From d7ebf0e173c91bdfbe68e0fd3a75f4a1406e6e34 Mon Sep 17 00:00:00 2001
From: MTrun <1262327911@qq.com>
Date: Wed, 23 Feb 2022 15:49:00 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E6=96=B0=E5=A2=9E=E4=B8=BB=E9=A2=98?=
 =?UTF-8?q?=E8=89=B2=E9=85=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ChartItemSetting/CollapseItem.vue         | 12 +++-
 .../ChartItemSetting/GlobalSetting.vue        | 66 ++++++++++++++-----
 src/settings/chartThemes/global.theme.json    | 10 ++-
 3 files changed, 68 insertions(+), 20 deletions(-)

diff --git a/src/components/ChartItemSetting/CollapseItem.vue b/src/components/ChartItemSetting/CollapseItem.vue
index e25b2884..2d078c9d 100644
--- a/src/components/ChartItemSetting/CollapseItem.vue
+++ b/src/components/ChartItemSetting/CollapseItem.vue
@@ -1,9 +1,11 @@
 <template>
-  <n-divider style="margin: 10px 0" />
-  <n-collapse arrow-placement="right" default-expanded-names="1">
+  <n-divider style="margin: 10px 0;" />
+  <n-collapse arrow-placement="right">
     <!-- 右侧 -->
     <template #header-extra>
-      <slot name="header" />
+      <div @click="click">
+        <slot name="header" />
+      </div>
     </template>
 
     <n-collapse-item :title="name" name="1">
@@ -19,4 +21,8 @@ defineProps({
     required: true
   }
 })
+const click = (e:MouseEvent) => {
+  e.preventDefault()
+  e.stopPropagation()
+}
 </script>
diff --git a/src/components/ChartItemSetting/GlobalSetting.vue b/src/components/ChartItemSetting/GlobalSetting.vue
index 0cb56945..be96d3e3 100644
--- a/src/components/ChartItemSetting/GlobalSetting.vue
+++ b/src/components/ChartItemSetting/GlobalSetting.vue
@@ -1,22 +1,42 @@
 <template>
   <div class="go-global-setting">
     <CollapseItem name="标题">
+      <template #header>
+        <n-switch v-model:value="title.show" size="small" />
+      </template>
       <SettingItemBox name="标题">
-        <SettingItem width="200">
+        <SettingItem name="颜色">
           <n-color-picker v-model:value="title.textStyle.color" size="small" />
         </SettingItem>
+        <SettingItem name="大小">
+          <n-input-number
+            v-model:value="title.textStyle.fontSize"
+            :min="1"
+            size="small"
+          />
+        </SettingItem>
       </SettingItemBox>
       <SettingItemBox name="副标题">
-        <SettingItem width="200">
+        <SettingItem name="颜色">
           <n-color-picker
             size="small"
             v-model:value="title.subtextStyle.color"
           />
         </SettingItem>
+        <SettingItem name="大小">
+          <n-input-number
+            v-model:value="title.subtextStyle.fontSize"
+            :min="1"
+            size="small"
+          />
+        </SettingItem>
       </SettingItemBox>
     </CollapseItem>
 
     <CollapseItem name="X轴">
+      <template #header>
+        <n-switch v-model:value="xAxis.show" size="small" />
+      </template>
       <SettingItemBox name="名称">
         <SettingItem name="颜色">
           <n-color-picker
@@ -32,10 +52,7 @@
           </n-space>
         </SettingItem>
         <SettingItem name="颜色">
-          <n-color-picker
-            size="small"
-            v-model:value="xAxis.axisLabel.color"
-          />
+          <n-color-picker size="small" v-model:value="xAxis.axisLabel.color" />
         </SettingItem>
       </SettingItemBox>
       <SettingItemBox name="轴线">
@@ -87,15 +104,26 @@
           />
         </SettingItem>
         <SettingItem name="类型">
-          <n-select v-model:value="xAxis.splitLine.lineStyle.type" size="small" :options="axisConf.splitLint.lineStyle.type" />
+          <n-select
+            v-model:value="xAxis.splitLine.lineStyle.type"
+            size="small"
+            :options="axisConf.splitLint.lineStyle.type"
+          />
         </SettingItem>
         <SettingItem name="位置">
-          <n-select v-model:value="xAxis.position" size="small" :options="axisConf.xposition" />
+          <n-select
+            v-model:value="xAxis.position"
+            size="small"
+            :options="axisConf.xposition"
+          />
         </SettingItem>
       </SettingItemBox>
     </CollapseItem>
 
     <CollapseItem name="Y轴">
+      <template #header>
+        <n-switch v-model:value="yAxis.show" size="small" />
+      </template>
       <SettingItemBox name="名称">
         <SettingItem name="颜色">
           <n-color-picker
@@ -104,17 +132,14 @@
           />
         </SettingItem>
       </SettingItemBox>
-       <SettingItemBox name="标签">
+      <SettingItemBox name="标签">
         <SettingItem name="展示">
           <n-space>
             <n-switch v-model:value="yAxis.axisLabel.show" size="small" />
           </n-space>
         </SettingItem>
         <SettingItem name="颜色">
-          <n-color-picker
-            size="small"
-            v-model:value="yAxis.axisLabel.color"
-          />
+          <n-color-picker size="small" v-model:value="yAxis.axisLabel.color" />
         </SettingItem>
       </SettingItemBox>
       <SettingItemBox name="轴线">
@@ -171,15 +196,26 @@
           />
         </SettingItem>
         <SettingItem name="类型">
-          <n-select v-model:value="yAxis.splitLine.lineStyle.type" size="small" :options="axisConf.splitLint.lineStyle.type" />
+          <n-select
+            v-model:value="yAxis.splitLine.lineStyle.type"
+            size="small"
+            :options="axisConf.splitLint.lineStyle.type"
+          />
         </SettingItem>
         <SettingItem name="位置">
-          <n-select v-model:value="yAxis.position" size="small" :options="axisConf.yposition" />
+          <n-select
+            v-model:value="yAxis.position"
+            size="small"
+            :options="axisConf.yposition"
+          />
         </SettingItem>
       </SettingItemBox>
     </CollapseItem>
 
     <CollapseItem name="图例">
+      <template #header>
+        <n-switch v-model:value="legend.show" size="small" />
+      </template>
       <SettingItemBox name="图例文字">
         <SettingItem>
           <n-color-picker size="small" v-model:value="legend.textStyle.color" />
diff --git a/src/settings/chartThemes/global.theme.json b/src/settings/chartThemes/global.theme.json
index 758b2376..2c4a0b05 100644
--- a/src/settings/chartThemes/global.theme.json
+++ b/src/settings/chartThemes/global.theme.json
@@ -1,13 +1,17 @@
 {
   "title": {
+    "show": true,
     "textStyle": {
-      "color": "#464646"
+      "color": "#464646",
+      "fontSize": 18
     },
     "subtextStyle": {
-      "color": "#6e7079"
+      "color": "#6e7079",
+      "fontSize": 14
     }
   },
   "xAxis": {
+    "show": true,
     "nameTextStyle": {
       "color": "#B9B8CE"
     },
@@ -37,6 +41,7 @@
     }
   },
   "yAxis": {
+    "show": true,
     "nameTextStyle": {
       "color": "#B9B8CE"
     },
@@ -66,6 +71,7 @@
     }
   },
   "legend": {
+    "show": true,
     "textStyle": {
       "color": "#B9B8CE"
     }