From 1f652335cd3d7a3dd3d33139969eb0d260b01114 Mon Sep 17 00:00:00 2001
From: wangjiahao <1522128093@qq.com>
Date: Mon, 20 May 2024 18:53:09 +0800
Subject: [PATCH] =?UTF-8?q?feat(=E6=95=B0=E6=8D=AE=E5=A4=A7=E5=B1=8F):=20?=
 =?UTF-8?q?=E6=95=B0=E6=8D=AE=E5=A4=A7=E5=B1=8F=E6=94=AF=E6=8C=81=E7=94=BB?=
 =?UTF-8?q?=E5=B8=83=E9=AB=98=E7=BA=A7=E9=85=8D=E8=89=B2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../dashboard-style/SeniorStyleSetting.vue    | 39 ++++++++++++++-----
 .../data-visualization/CanvasAttr.vue         |  9 +++++
 2 files changed, 39 insertions(+), 9 deletions(-)

diff --git a/core/core-frontend/src/components/dashboard/subject-setting/dashboard-style/SeniorStyleSetting.vue b/core/core-frontend/src/components/dashboard/subject-setting/dashboard-style/SeniorStyleSetting.vue
index 4f65267c48..30ffe42673 100644
--- a/core/core-frontend/src/components/dashboard/subject-setting/dashboard-style/SeniorStyleSetting.vue
+++ b/core/core-frontend/src/components/dashboard/subject-setting/dashboard-style/SeniorStyleSetting.vue
@@ -2,9 +2,15 @@
   <div style="width: 100%; padding-bottom: 8px">
     <el-form label-position="top" style="width: 100%">
       <div style="width: 100%; padding: 16px 8px 0">
-        <el-col :span="12">
-          <el-form-item class="form-item" label="联动、钻取、调整的图标颜色">
+        <el-col :span="24">
+          <el-form-item
+            :effect="themes"
+            class="form-item"
+            :class="'form-item-' + themes"
+            label="联动、钻取、跳转的图标颜色"
+          >
             <el-color-picker
+              :effect="themes"
               v-model="seniorStyleSetting.linkageIconColor"
               :trigger-width="197"
               is-custom
@@ -13,10 +19,16 @@
             />
           </el-form-item>
         </el-col>
-        <el-col :span="12">
-          <el-form-item class="form-item" label="钻取层级展示颜色">
+        <el-col :span="24">
+          <el-form-item
+            :effect="themes"
+            class="form-item"
+            :class="'form-item-' + themes"
+            label="钻取层级展示颜色"
+          >
             <el-color-picker
               v-model="seniorStyleSetting.drillLayerColor"
+              :effect="themes"
               :trigger-width="197"
               is-custom
               :predefine="state.predefineColors"
@@ -44,6 +56,12 @@ const seniorStyleSetting = computed<any>(() => {
   return dvMainStore.canvasStyleData.component.seniorStyleSetting
 })
 
+const props = defineProps({
+  themes: {
+    type: String,
+    default: 'light'
+  }
+})
 const state = reactive({
   fontSize: [],
   isSetting: false,
@@ -58,11 +76,6 @@ const themeChange = () => {
   snapshotStore.recordSnapshotCache('seniorStyleSettingSimpleSelector-themeChange')
 }
 
-const handleHorizontalChange = (type, horizontal = 'titleLayout') => {
-  seniorStyleSetting.value[horizontal] = type
-  themeChange(horizontal)
-}
-
 onMounted(() => {
   eventBus.on('onThemeColorChange', initForm)
 })
@@ -103,4 +116,12 @@ onMounted(() => {
     line-height: 20px;
   }
 }
+.form-item-dark {
+  :deep(.ed-form-item__label) {
+    color: #6a6a6a;
+    font-size: 12px;
+    font-weight: 400;
+    line-height: 20px;
+  }
+}
 </style>
diff --git a/core/core-frontend/src/components/data-visualization/CanvasAttr.vue b/core/core-frontend/src/components/data-visualization/CanvasAttr.vue
index f321fddf5b..fb0c2c3cfd 100644
--- a/core/core-frontend/src/components/data-visualization/CanvasAttr.vue
+++ b/core/core-frontend/src/components/data-visualization/CanvasAttr.vue
@@ -10,6 +10,7 @@ import { useEmitt } from '@/hooks/web/useEmitt'
 import ComponentColorSelector from '@/components/dashboard/subject-setting/dashboard-style/ComponentColorSelector.vue'
 import OverallSetting from '@/components/dashboard/subject-setting/dashboard-style/OverallSetting.vue'
 import CanvasBackground from '@/components/visualization/component-background/CanvasBackground.vue'
+import SeniorStyleSetting from '@/components/dashboard/subject-setting/dashboard-style/SeniorStyleSetting.vue'
 const dvMainStore = dvMainStoreWithOut()
 const snapshotStore = snapshotStoreWithOut()
 const { canvasStyleData, canvasViewInfo } = storeToRefs(dvMainStore)
@@ -102,6 +103,14 @@ onMounted(() => {
       <el-collapse-item effect="dark" title="刷新配置" name="overallSetting">
         <overall-setting themes="dark" />
       </el-collapse-item>
+      <el-collapse-item
+        effect="dark"
+        title="高级样式设置"
+        name="seniorStyleSetting"
+        class="no-padding no-border-bottom"
+      >
+        <senior-style-setting themes="dark"></senior-style-setting>
+      </el-collapse-item>
     </el-collapse>
   </div>
 </template>