From 5568c3cd2d1f68b50678030dbd77ef0cbc144385 Mon Sep 17 00:00:00 2001
From: wangzhiqiang <wangzhiqiang@qq.com>
Date: Thu, 16 Jun 2022 14:56:54 +0800
Subject: [PATCH] =?UTF-8?q?=E6=BB=9A=E5=8A=A8=E6=8E=92=E5=90=8D=E5=88=97?=
 =?UTF-8?q?=E8=A1=A8=E5=A2=9E=E5=8A=A0=E8=AE=BE=E7=BD=AE=E5=AD=97=E4=BD=93?=
 =?UTF-8?q?=E5=A4=A7=E5=B0=8F=E9=85=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Tables/Tables/TableList/config.ts         |  6 +++++
 .../Tables/Tables/TableList/config.vue        | 25 +++++++++++++++++++
 .../Tables/Tables/TableList/index.vue         | 17 +++++++------
 3 files changed, 41 insertions(+), 7 deletions(-)

diff --git a/src/packages/components/Tables/Tables/TableList/config.ts b/src/packages/components/Tables/Tables/TableList/config.ts
index 920685e9..d3f60d4d 100644
--- a/src/packages/components/Tables/Tables/TableList/config.ts
+++ b/src/packages/components/Tables/Tables/TableList/config.ts
@@ -19,6 +19,12 @@ export const option = {
   textColor: '#CDD2F8FF',
   borderColor: '#1370fb80',
   carousel: 'single',
+  //序号字体大小
+  indexFontSize: 12,
+  //左侧数据字体大小
+  leftFontSize: 12,
+  //右侧数据字体大小
+  rightFontSize: 12,
   // 格式化
   valueFormatter(item: { value: any}) { return item.value}
 }
diff --git a/src/packages/components/Tables/Tables/TableList/config.vue b/src/packages/components/Tables/Tables/TableList/config.vue
index bd7c34c5..fb76b46e 100644
--- a/src/packages/components/Tables/Tables/TableList/config.vue
+++ b/src/packages/components/Tables/Tables/TableList/config.vue
@@ -49,6 +49,31 @@
         ></n-color-picker>
       </SettingItem>
     </SettingItemBox>
+
+    <SettingItemBox name="字体样式">
+       <SettingItem name="序号字体">
+        <n-input-number
+          size="small"
+          v-model:value="optionData.indexFontSize"
+          :min="12"
+        />
+      </SettingItem>
+      <SettingItem name="左侧数据字体">
+        <n-input-number
+          size="small"
+          v-model:value="optionData.leftFontSize"
+          :min="12"
+        />
+      </SettingItem>
+      <SettingItem name="右侧数据字体">
+        <n-input-number
+          size="small"
+          v-model:value="optionData.rightFontSize"
+          :min="12"
+        />
+      </SettingItem>
+    </SettingItemBox>
+      
   </CollapseItem>
 </template>
 
diff --git a/src/packages/components/Tables/Tables/TableList/index.vue b/src/packages/components/Tables/Tables/TableList/index.vue
index f5e95e07..f1b8d487 100644
--- a/src/packages/components/Tables/Tables/TableList/index.vue
+++ b/src/packages/components/Tables/Tables/TableList/index.vue
@@ -7,9 +7,9 @@
       :style="`height: ${status.heights[i]}px;`"
     >
       <div class="ranking-info">
-        <div class="rank" :style="`color: ${color}`">No.{{ item.ranking }}</div>
-        <div class="info-name" v-html="item.name" />
-        <div class="ranking-value" :style="`color: ${textColor}`">
+        <div class="rank" :style="`color: ${color};font-size: ${indexFontSize}px`">No.{{ item.ranking }}</div>
+        <div class="info-name" :style="`font-size: ${leftFontSize}px`" v-html="item.name" />
+        <div class="ranking-value" :style="`color: ${textColor};font-size: ${rightFontSize}px`">
           {{
             status.mergedConfig.valueFormatter
               ? status.mergedConfig.valueFormatter(item)
@@ -43,7 +43,7 @@ const props = defineProps({
   },
 })
 const { w, h } = toRefs(props.chartConfig.attr)
-const { rowNum, unit, color, textColor, borderColor } = toRefs(
+const { rowNum, unit, color, textColor, borderColor, indexFontSize, leftFontSize, rightFontSize } = toRefs(
   props.chartConfig.option
 )
 
@@ -166,10 +166,12 @@ watch(
 
 // 数据更新
 watch(
-  () => props.chartConfig.option.dataset,
+  () => props.chartConfig.option,
   () => {
+    console.log('数据更新', props.chartConfig.option)
     onRestart()
-  }
+  },
+  {deep:true}
 )
 
 useChartDataFetch(props.chartConfig, useChartEditStore)
@@ -197,9 +199,10 @@ onUnmounted(() => {
     display: flex;
     width: 100%;
     font-size: 13px;
+    align-items: center;
 
     .rank {
-      width: 40px;
+      margin-right: 5px;
     }
 
     .info-name {