From 4d43af735b9ba460a2fe139dc7f20608cae2aaca Mon Sep 17 00:00:00 2001
From: wangjiahao <1522128093@qq.com>
Date: Mon, 31 Oct 2022 18:10:00 +0800
Subject: [PATCH] =?UTF-8?q?refactor(=E7=BB=84=E4=BB=B6):=20Tab=E7=BB=84?=
 =?UTF-8?q?=E4=BB=B6=E6=94=AF=E6=8C=81=E8=AE=BE=E7=BD=AE=E5=AD=97=E4=BD=93?=
 =?UTF-8?q?=E5=A4=A7=E5=B0=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/canvas/components/TextAttr.vue | 62 ++++++++++---------
 .../canvas/custom-component/component-list.js |  3 +-
 frontend/src/components/canvas/utils/utils.js |  3 +
 .../src/components/widget/DeWidget/DeTabs.vue |  9 ++-
 4 files changed, 44 insertions(+), 33 deletions(-)

diff --git a/frontend/src/components/canvas/components/TextAttr.vue b/frontend/src/components/canvas/components/TextAttr.vue
index 981cff69f9..c9412d7710 100644
--- a/frontend/src/components/canvas/components/TextAttr.vue
+++ b/frontend/src/components/canvas/components/TextAttr.vue
@@ -518,6 +518,7 @@ export default {
       ],
       // tab组件显示的属性
       'de-tabs': [
+        'fontSize',
         'borderStyle',
         'borderWidth',
         'borderColor',
@@ -718,39 +719,42 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-  .attr-list {
-    overflow: auto;
-    padding: 20px;
-    padding-top: 0;
-    height: 100%;
-  }
-  .el-card-main {
-    height: 34px;
-    z-index: 10;
-    padding-right: 2px;
-    position: absolute;
+.attr-list {
+  overflow: auto;
+  padding: 20px;
+  padding-top: 0;
+  height: 100%;
+}
 
-  }
-  .el-card-main ::v-deep .el-card__body {
-    padding: 0px!important;
+.el-card-main {
+  height: 34px;
+  z-index: 10;
+  padding-right: 2px;
+  position: absolute;
 
-  }
+}
 
-  ::v-deep .el-radio-button__inner{
-    padding: 5px!important;
-    width: 30px!important;
-  }
+.el-card-main ::v-deep .el-card__body {
+  padding: 0px !important;
 
-  ::v-deep .el-color-dropdown__link-btn {
-    display: inline!important;
-  }
+}
 
-  ::v-deep input::-webkit-outer-spin-button,
-  ::v-deep input::-webkit-inner-spin-button {
-    -webkit-appearance: none !important;
-  }
-  ::v-deep input[type='number'] {
-    -moz-appearance: textfield !important;
-  }
+::v-deep .el-radio-button__inner {
+  padding: 5px !important;
+  width: 30px !important;
+}
+
+::v-deep .el-color-dropdown__link-btn {
+  display: inline !important;
+}
+
+::v-deep input::-webkit-outer-spin-button,
+::v-deep input::-webkit-inner-spin-button {
+  -webkit-appearance: none !important;
+}
+
+::v-deep input[type='number'] {
+  -moz-appearance: textfield !important;
+}
 
 </style>
diff --git a/frontend/src/components/canvas/custom-component/component-list.js b/frontend/src/components/canvas/custom-component/component-list.js
index 844f31a2a7..0c79e78f02 100644
--- a/frontend/src/components/canvas/custom-component/component-list.js
+++ b/frontend/src/components/canvas/custom-component/component-list.js
@@ -388,7 +388,8 @@ const list = [
       height: 200,
       borderStyle: 'solid',
       borderWidth: 0,
-      borderColor: '#000000'
+      borderColor: '#000000',
+      fontSize: 16
     },
     options: {
       tabList: [{
diff --git a/frontend/src/components/canvas/utils/utils.js b/frontend/src/components/canvas/utils/utils.js
index d3ab9c2e14..3edae4b655 100644
--- a/frontend/src/components/canvas/utils/utils.js
+++ b/frontend/src/components/canvas/utils/utils.js
@@ -99,6 +99,9 @@ export function panelDataPrepare(componentData, componentStyle, callback) {
         item.options.attrs.accuracy = 'HH:mm'
       }
     }
+    if (item.type === 'de-tabs') {
+      item.style.fontSize = item.style.fontSize || 16
+    }
     if (item.type === 'custom') {
       item.options.manualModify = false
     }
diff --git a/frontend/src/components/widget/DeWidget/DeTabs.vue b/frontend/src/components/widget/DeWidget/DeTabs.vue
index 68ae346e8c..d9526cad50 100644
--- a/frontend/src/components/widget/DeWidget/DeTabs.vue
+++ b/frontend/src/components/widget/DeWidget/DeTabs.vue
@@ -25,8 +25,7 @@
         :name="item.name"
       >
         <span slot="label">
-          <span>{{ item.title }}</span>
-
+          <span :style="titleStyle">{{ item.title }}</span>
           <el-dropdown
             v-if="dropdownShow"
             slot="label"
@@ -35,7 +34,6 @@
             @command="handleCommand"
           >
             <span class="el-dropdown-link">
-
               <i
                 v-if="isEdit"
                 class="de-tab-i el-icon-arrow-down el-icon--right"
@@ -295,6 +293,11 @@ export default {
     }
   },
   computed: {
+    titleStyle() {
+      return {
+        fontSize: (this.element.style.fontSize || 16) + 'px'
+      }
+    },
     headClass() {
       return 'tab-head-' + this.element.style.headPosition
     },