设置用户偏好.

orion-ops-ui/src/components/global-setting/block.vue

@@ -4,9 +4,9 @@
     <div v-for="option in options" :key="option.name" class="option-wrapper">
       <!-- 偏好项 -->
       <span>{{ option.name }}</span>
-      <!-- input -->
+      <!-- 偏好值 -->
       <form-wrapper :name="option.key"
-                    :type="option.type"
+                    :type="option.type as string"
                     :default-value="option.defaultVal"
                     :options="option.options"
                     @input-change="handleChange" />
@@ -19,6 +19,8 @@
   import { useAppStore } from '@/store';
   import FormWrapper from './form-wrapper.vue';
   import { RadioOption } from '@arco-design/web-vue/es/radio/interface';
+  import { updatePreferencePartial } from '@/api/user/preference';
+  import { Message } from '@arco-design/web-vue';
 
   interface OptionsProps {
     name: string;
@@ -37,6 +39,7 @@
       },
     },
   });
+
   const appStore = useAppStore();
 
   /**
@@ -46,10 +49,6 @@
     key: string;
     value: unknown;
   }) => {
-    // 色弱模式
-    if (key === 'colorWeak') {
-      document.body.style.filter = value ? 'invert(80%)' : 'none';
-    }
     // 顶部菜单
     if (key === 'topMenu') {
       appStore.updateSettings({
@@ -57,9 +56,21 @@
       });
     }
     // 修改配置
-    appStore.updateSettings({ [key]: value });
-    // TODO 同步偏好
-
+    const updateConfig = { [key]: value };
+    appStore.updateSettings(updateConfig);
+    // 同步偏好
+    Message.clear();
+    const loading = Message.loading('同步中...');
+    try {
+      await updatePreferencePartial({
+        type: 'SYSTEM',
+        config: updateConfig
+      });
+      Message.success('同步成功');
+    } catch (e) {
+    } finally {
+      loading.close();
+    }
   };
 </script>