From 68e6998f7ac0b760ac8a41e914590b69db69e65d Mon Sep 17 00:00:00 2001
From: "liu.tao3" <liu.tao3@ustcinfo.com>
Date: Mon, 18 Sep 2023 15:04:58 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E8=BE=B9=E6=A1=86=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../BasicComponents/DigitalFlop/setting.vue   |  2 +-
 .../BasicComponents/FlyMap/settingConfig.js   |  2 +-
 .../BasicComponents/Map/settingConfig.js      |  2 +-
 .../BasicComponents/Select/setting.vue        |  2 +-
 .../RightSetting/BorderSetting.vue            | 41 ++++++++++++++++++-
 .../RightSetting/G2CustomSetting.vue          |  3 +-
 .../packages/BigScreenDesign/index.vue        |  5 +++
 .../BorderComponents/GcBorder1/index.vue      |  1 +
 .../BorderComponents/GcBorder1/setting.js     | 13 ------
 .../BorderComponents/GcBorder10/index.vue     |  1 +
 .../BorderComponents/GcBorder10/setting.js    | 13 ------
 .../BorderComponents/GcBorder11/index.vue     |  1 +
 .../BorderComponents/GcBorder11/setting.js    | 15 +------
 .../BorderComponents/GcBorder12/index.vue     |  1 +
 .../BorderComponents/GcBorder12/setting.js    | 13 ------
 .../BorderComponents/GcBorder13/index.vue     |  1 +
 .../BorderComponents/GcBorder13/setting.js    | 15 +------
 .../BorderComponents/GcBorder2/index.vue      |  1 +
 .../BorderComponents/GcBorder2/setting.js     | 16 +-------
 .../BorderComponents/GcBorder3/index.vue      |  1 +
 .../BorderComponents/GcBorder3/setting.js     | 15 +------
 .../BorderComponents/GcBorder4/index.vue      |  1 +
 .../BorderComponents/GcBorder4/setting.js     | 13 ------
 .../BorderComponents/GcBorder5/index.vue      |  1 +
 .../BorderComponents/GcBorder5/setting.js     | 13 ------
 .../BorderComponents/GcBorder6/index.vue      |  1 +
 .../BorderComponents/GcBorder6/setting.js     | 14 +------
 .../BorderComponents/GcBorder7/index.vue      |  1 +
 .../BorderComponents/GcBorder7/setting.js     | 13 ------
 .../BorderComponents/GcBorder8/index.vue      |  1 +
 .../BorderComponents/GcBorder8/setting.js     | 14 -------
 .../BorderComponents/GcBorder9/index.vue      |  1 +
 .../BorderComponents/GcBorder9/setting.js     | 15 +------
 data-room-ui/packages/G2Plots/plotList.js     |  4 +-
 .../RemoteComponents/remoteComponentsList.js  |  4 +-
 data-room-ui/packages/Render/RenderCard.vue   |  4 +-
 .../js/config/basicComponentsConfig.js        |  2 +-
 data-room-ui/packages/js/store/actions.js     |  6 +++
 38 files changed, 83 insertions(+), 189 deletions(-)

diff --git a/data-room-ui/packages/BasicComponents/DigitalFlop/setting.vue b/data-room-ui/packages/BasicComponents/DigitalFlop/setting.vue
index b19ec83f..de5dd4f5 100644
--- a/data-room-ui/packages/BasicComponents/DigitalFlop/setting.vue
+++ b/data-room-ui/packages/BasicComponents/DigitalFlop/setting.vue
@@ -31,7 +31,7 @@
           <div class="lc-field-body">
             <BorderSetting
               v-if="config.border"
-              label-width="100px"
+              label-width="120px"
               :config="config.border"
             />
           </div>
diff --git a/data-room-ui/packages/BasicComponents/FlyMap/settingConfig.js b/data-room-ui/packages/BasicComponents/FlyMap/settingConfig.js
index ee7bf77b..e75a155c 100644
--- a/data-room-ui/packages/BasicComponents/FlyMap/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/FlyMap/settingConfig.js
@@ -110,7 +110,7 @@ export const FlyMapData = {
   name: '飞线图',
   title: '飞线图',
   icon: Icon.getNameList()[18],
-  border:{type:'',titleHeight:60,fontSize:30},
+  border:{type:'',titleHeight:60,fontSize:30,isTitle:true,paddingTop:10},
   className:
     'com.gccloud.dataroom.core.module.chart.components.ScreenFlyMapChart',
   w: 800,
diff --git a/data-room-ui/packages/BasicComponents/Map/settingConfig.js b/data-room-ui/packages/BasicComponents/Map/settingConfig.js
index a4c1e3b0..0358f8b1 100644
--- a/data-room-ui/packages/BasicComponents/Map/settingConfig.js
+++ b/data-room-ui/packages/BasicComponents/Map/settingConfig.js
@@ -102,7 +102,7 @@ export const mapData = {
   name: '地图',
   title: '地图',
   icon: Icon.getNameList()[5],
-  border:{type:'',titleHeight:60,fontSize:30},
+  border:{type:'',titleHeight:60,fontSize:30,isTitle:true,paddingTop:30},
   className:
     'com.gccloud.dataroom.core.module.chart.components.ScreenMapChart',
   w: 800,
diff --git a/data-room-ui/packages/BasicComponents/Select/setting.vue b/data-room-ui/packages/BasicComponents/Select/setting.vue
index 3b336f65..40510abd 100644
--- a/data-room-ui/packages/BasicComponents/Select/setting.vue
+++ b/data-room-ui/packages/BasicComponents/Select/setting.vue
@@ -25,7 +25,7 @@
           <div class="lc-field-body">
             <BorderSetting
               v-if="config.border"
-              label-width="120px"
+              label-width="100px"
               :config="config.border"
             />
           </div>
diff --git a/data-room-ui/packages/BigScreenDesign/RightSetting/BorderSetting.vue b/data-room-ui/packages/BigScreenDesign/RightSetting/BorderSetting.vue
index 70b7eb20..9dcd4507 100644
--- a/data-room-ui/packages/BigScreenDesign/RightSetting/BorderSetting.vue
+++ b/data-room-ui/packages/BigScreenDesign/RightSetting/BorderSetting.vue
@@ -27,7 +27,32 @@
         ref="BorderSelect"
         />
     </el-form-item>
+    <div v-if="config.type">
     <el-form-item
+      :label-width="labelWidth"
+      label="是否显示标题"
+    >
+      <el-switch
+          v-model="config.isTitle"
+          class="bs-el-switch"
+          :active-value="true"
+          :inactive-value="false"
+        />
+    </el-form-item>
+    <el-form-item
+      v-if="!config.isTitle"
+      :label-width="labelWidth"
+      label="上边距"
+    >
+      <el-input-number
+        v-model="config.paddingTop"
+        class="bs-el-input-number"
+        :min="0"
+        :step="1"
+      />
+    </el-form-item>
+    <el-form-item
+      v-if="config.isTitle"
       :label-width="labelWidth"
       label="标题高度"
     >
@@ -39,6 +64,7 @@
       />
     </el-form-item>
     <el-form-item
+      v-if="config.isTitle"
       :label-width="labelWidth"
       label="标题字体大小"
     >
@@ -49,13 +75,25 @@
         :step="1"
       />
     </el-form-item>
+    <el-form-item
+      v-if="config.isTitle"
+      :label-width="labelWidth"
+      label="标题颜色"
+    >
+      <el-color-picker
+          v-model="config.fontColor"
+          popper-class="bs-el-color-picker"
+          class="bs-el-color-picker"
+          show-alpha
+        />
+    </el-form-item>
     <div
       v-for="(setting, settingIndex) in list"
       :key="settingIndex+1"
     >
       <el-form-item
         :label="setting.type=== 'padding' ? '' : setting.label"
-        :label-width="setting.type=== 'padding' ? '0px' :'120px'"
+        :label-width="labelWidth"
       >
         <el-input
           v-if="setting.type === 'input'"
@@ -165,6 +203,7 @@
           v-model="config[setting.field]"
         />
       </el-form-item>
+      </div>
     </div>
   </div>
 </template>
diff --git a/data-room-ui/packages/BigScreenDesign/RightSetting/G2CustomSetting.vue b/data-room-ui/packages/BigScreenDesign/RightSetting/G2CustomSetting.vue
index 852248e6..2e459e8d 100644
--- a/data-room-ui/packages/BigScreenDesign/RightSetting/G2CustomSetting.vue
+++ b/data-room-ui/packages/BigScreenDesign/RightSetting/G2CustomSetting.vue
@@ -21,8 +21,9 @@
           />
         </el-form-item>
       </div>
+      <SettingTitle>边框</SettingTitle>
       <div class="lc-field-body">
-        <BorderSetting
+         <BorderSetting
           v-if="config.border"
           label-width="120px"
           :config="config.border"
diff --git a/data-room-ui/packages/BigScreenDesign/index.vue b/data-room-ui/packages/BigScreenDesign/index.vue
index bd6af08f..89fd8b7e 100644
--- a/data-room-ui/packages/BigScreenDesign/index.vue
+++ b/data-room-ui/packages/BigScreenDesign/index.vue
@@ -295,6 +295,11 @@ export default {
     setComponent (component) {
       // 根据component获取页面详情
       getScreenInfo(component.code).then(res => {
+        res.chartList.forEach((item) => {
+          if (!item.border) {
+            item.border={type:'',titleHeight:60,fontSize:30,isTitle:true,paddingTop:20}
+          }
+        })
         // 给组件库导入的组件加入统一的前缀
         const randomStr = randomString(8)
         const pageInfo = handleResData(res)
diff --git a/data-room-ui/packages/BorderComponents/GcBorder1/index.vue b/data-room-ui/packages/BorderComponents/GcBorder1/index.vue
index 1793c29d..cbd49801 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder1/index.vue
+++ b/data-room-ui/packages/BorderComponents/GcBorder1/index.vue
@@ -9,6 +9,7 @@
       :key="updateKey"
     >
     <div class="element"
+    v-if="config.border.isTitle"
     :style="`
     color:${color};
     font-size:${config.border.fontSize}px;
diff --git a/data-room-ui/packages/BorderComponents/GcBorder1/setting.js b/data-room-ui/packages/BorderComponents/GcBorder1/setting.js
index d0dd3dcf..54e93b7e 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder1/setting.js
+++ b/data-room-ui/packages/BorderComponents/GcBorder1/setting.js
@@ -18,19 +18,6 @@ const setting = [
     // 绑定的值
     value: '',
   },
-  // 标题字体颜色
-  {
-    label:'标题字体颜色',
-    // 设置组件类型， select / input / colorPicker
-    type: 'colorPicker',
-    // 字段
-    field: 'fontColor',
-    optionField: 'fontColor', // 对应options中的字段
-    // 是否多选
-    multiple: false,
-    // 绑定的值
-    value: '',
-  },
 
 
 ]
diff --git a/data-room-ui/packages/BorderComponents/GcBorder10/index.vue b/data-room-ui/packages/BorderComponents/GcBorder10/index.vue
index f4fb304c..edc3c195 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder10/index.vue
+++ b/data-room-ui/packages/BorderComponents/GcBorder10/index.vue
@@ -9,6 +9,7 @@
       :key="updateKey"
     >
     <div class="element"
+    v-if="config.border.isTitle"
     :style="`
     color:${color};
     font-size:${config.border.fontSize}px;
diff --git a/data-room-ui/packages/BorderComponents/GcBorder10/setting.js b/data-room-ui/packages/BorderComponents/GcBorder10/setting.js
index 5c9924ad..45d11a2c 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder10/setting.js
+++ b/data-room-ui/packages/BorderComponents/GcBorder10/setting.js
@@ -17,19 +17,6 @@ const setting = [
     // 绑定的值
     value: '',
   },
-  // 标题字体颜色
-  {
-    label:'标题字体颜色',
-    // 设置组件类型， select / input / colorPicker
-    type: 'colorPicker',
-    // 字段
-    field: 'fontColor',
-    optionField: 'fontColor', // 对应options中的字段
-    // 是否多选
-    multiple: false,
-    // 绑定的值
-    value: '',
-  },
 
 
 ]
diff --git a/data-room-ui/packages/BorderComponents/GcBorder11/index.vue b/data-room-ui/packages/BorderComponents/GcBorder11/index.vue
index 40fada1e..14a5d355 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder11/index.vue
+++ b/data-room-ui/packages/BorderComponents/GcBorder11/index.vue
@@ -9,6 +9,7 @@
       :key="updateKey"
     >
     <div class="element"
+    v-if="config.border.isTitle"
     :style="`
     color:${color};
     font-size:${config.border.fontSize}px;
diff --git a/data-room-ui/packages/BorderComponents/GcBorder11/setting.js b/data-room-ui/packages/BorderComponents/GcBorder11/setting.js
index 93e7a25d..11be9214 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder11/setting.js
+++ b/data-room-ui/packages/BorderComponents/GcBorder11/setting.js
@@ -16,20 +16,7 @@ const setting = [
     multiple: false,
     // 绑定的值
     value: '',
-  },
-  // 标题字体颜色
-  {
-    label:'标题字体颜色',
-    // 设置组件类型， select / input / colorPicker
-    type: 'colorPicker',
-    // 字段
-    field: 'fontColor',
-    optionField: 'fontColor', // 对应options中的字段
-    // 是否多选
-    multiple: false,
-    // 绑定的值
-    value: '',
-  },
+  }
 
 
 ]
diff --git a/data-room-ui/packages/BorderComponents/GcBorder12/index.vue b/data-room-ui/packages/BorderComponents/GcBorder12/index.vue
index 9da31a4f..703909cb 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder12/index.vue
+++ b/data-room-ui/packages/BorderComponents/GcBorder12/index.vue
@@ -9,6 +9,7 @@
       :key="updateKey"
     >
     <div class="element"
+    v-if="config.border.isTitle"
     :style="`
     color:${color};
     font-size:${config.border.fontSize}px;
diff --git a/data-room-ui/packages/BorderComponents/GcBorder12/setting.js b/data-room-ui/packages/BorderComponents/GcBorder12/setting.js
index a67f48a5..b70971ce 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder12/setting.js
+++ b/data-room-ui/packages/BorderComponents/GcBorder12/setting.js
@@ -18,19 +18,6 @@ const setting = [
     // 绑定的值
     value: '',
   },
-  // 标题字体颜色
-  {
-    label:'标题字体颜色',
-    // 设置组件类型， select / input / colorPicker
-    type: 'colorPicker',
-    // 字段
-    field: 'fontColor',
-    optionField: 'fontColor', // 对应options中的字段
-    // 是否多选
-    multiple: false,
-    // 绑定的值
-    value: '',
-  },
 
 
 ]
diff --git a/data-room-ui/packages/BorderComponents/GcBorder13/index.vue b/data-room-ui/packages/BorderComponents/GcBorder13/index.vue
index 886dce76..f6a70452 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder13/index.vue
+++ b/data-room-ui/packages/BorderComponents/GcBorder13/index.vue
@@ -9,6 +9,7 @@
       :key="updateKey"
     >
     <div class="element"
+    v-if="config.border.isTitle"
     :style="`
     color:${color};
     font-size:${config.border.fontSize}px;
diff --git a/data-room-ui/packages/BorderComponents/GcBorder13/setting.js b/data-room-ui/packages/BorderComponents/GcBorder13/setting.js
index f1ebcc29..76cf9f6f 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder13/setting.js
+++ b/data-room-ui/packages/BorderComponents/GcBorder13/setting.js
@@ -16,20 +16,7 @@ const setting = [
     multiple: false,
     // 绑定的值
     value: '',
-  },
-  // 标题字体颜色
-  {
-    label:'标题字体颜色',
-    // 设置组件类型， select / input / colorPicker
-    type: 'colorPicker',
-    // 字段
-    field: 'fontColor',
-    optionField: 'fontColor', // 对应options中的字段
-    // 是否多选
-    multiple: false,
-    // 绑定的值
-    value: '',
-  },
+  }
 
 
 ]
diff --git a/data-room-ui/packages/BorderComponents/GcBorder2/index.vue b/data-room-ui/packages/BorderComponents/GcBorder2/index.vue
index 205574d2..350b80e1 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder2/index.vue
+++ b/data-room-ui/packages/BorderComponents/GcBorder2/index.vue
@@ -9,6 +9,7 @@
       :key="updateKey"
     >
     <div class="element"
+    v-if="config.border.isTitle"
     :style="`
     color:${color};
     font-size:${config.border.fontSize}px;
diff --git a/data-room-ui/packages/BorderComponents/GcBorder2/setting.js b/data-room-ui/packages/BorderComponents/GcBorder2/setting.js
index 35c5b6ec..abdeca87 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder2/setting.js
+++ b/data-room-ui/packages/BorderComponents/GcBorder2/setting.js
@@ -16,21 +16,7 @@ const setting = [
     multiple: false,
     // 绑定的值
     value: '',
-  },
-  // 标题字体颜色
-  {
-    label:'标题字体颜色',
-    // 设置组件类型， select / input / colorPicker
-    type: 'colorPicker',
-    // 字段
-    field: 'fontColor',
-    optionField: 'fontColor', // 对应options中的字段
-    // 是否多选
-    multiple: false,
-    // 绑定的值
-    value: '',
-  },
-
+  }
 
 ]
 
diff --git a/data-room-ui/packages/BorderComponents/GcBorder3/index.vue b/data-room-ui/packages/BorderComponents/GcBorder3/index.vue
index 751ac774..d92b0114 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder3/index.vue
+++ b/data-room-ui/packages/BorderComponents/GcBorder3/index.vue
@@ -9,6 +9,7 @@
       :key="updateKey"
     >
     <div class="element"
+    v-if="config.border.isTitle"
     :style="`
     color:${color};
     font-size:${config.border.fontSize}px;
diff --git a/data-room-ui/packages/BorderComponents/GcBorder3/setting.js b/data-room-ui/packages/BorderComponents/GcBorder3/setting.js
index 727d9bad..1cc0fd89 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder3/setting.js
+++ b/data-room-ui/packages/BorderComponents/GcBorder3/setting.js
@@ -16,20 +16,7 @@ const setting = [
     multiple: false,
     // 绑定的值
     value: '',
-  },
-  // 标题字体颜色
-  {
-    label:'标题字体颜色',
-    // 设置组件类型， select / input / colorPicker
-    type: 'colorPicker',
-    // 字段
-    field: 'fontColor',
-    optionField: 'fontColor', // 对应options中的字段
-    // 是否多选
-    multiple: false,
-    // 绑定的值
-    value: '',
-  },
+  }
 
 
 ]
diff --git a/data-room-ui/packages/BorderComponents/GcBorder4/index.vue b/data-room-ui/packages/BorderComponents/GcBorder4/index.vue
index 892cd7ff..2e8717df 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder4/index.vue
+++ b/data-room-ui/packages/BorderComponents/GcBorder4/index.vue
@@ -10,6 +10,7 @@
       :key="updateKey"
     >
     <div class="element"
+    v-if="config.border.isTitle"
     :style="`
     color:${color};
     font-size:${config.border.fontSize}px;
diff --git a/data-room-ui/packages/BorderComponents/GcBorder4/setting.js b/data-room-ui/packages/BorderComponents/GcBorder4/setting.js
index 96bf4a81..98acf7a5 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder4/setting.js
+++ b/data-room-ui/packages/BorderComponents/GcBorder4/setting.js
@@ -17,19 +17,6 @@ const setting = [
     // 绑定的值
     value: '',
   },
-  // 标题字体颜色
-  {
-    label:'标题字体颜色',
-    // 设置组件类型， select / input / colorPicker
-    type: 'colorPicker',
-    // 字段
-    field: 'fontColor',
-    optionField: 'fontColor', // 对应options中的字段
-    // 是否多选
-    multiple: false,
-    // 绑定的值
-    value: '',
-  },
   {
     label:'边框主颜色',
     // 设置组件类型， select / input / colorPicker
diff --git a/data-room-ui/packages/BorderComponents/GcBorder5/index.vue b/data-room-ui/packages/BorderComponents/GcBorder5/index.vue
index 7abe83d3..4a1746e3 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder5/index.vue
+++ b/data-room-ui/packages/BorderComponents/GcBorder5/index.vue
@@ -9,6 +9,7 @@
       :key="updateKey"
     >
     <div class="element"
+    v-if="config.border.isTitle"
     :style="`
     color:${color};
     font-size:${config.border.fontSize}px;
diff --git a/data-room-ui/packages/BorderComponents/GcBorder5/setting.js b/data-room-ui/packages/BorderComponents/GcBorder5/setting.js
index 60f494b7..306f123b 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder5/setting.js
+++ b/data-room-ui/packages/BorderComponents/GcBorder5/setting.js
@@ -17,19 +17,6 @@ const setting = [
     // 绑定的值
     value: '',
   },
-  // 标题字体颜色
-  {
-    label:'标题字体颜色',
-    // 设置组件类型， select / input / colorPicker
-    type: 'colorPicker',
-    // 字段
-    field: 'fontColor',
-    optionField: 'fontColor', // 对应options中的字段
-    // 是否多选
-    multiple: false,
-    // 绑定的值
-    value: '',
-  },
 
 
 ]
diff --git a/data-room-ui/packages/BorderComponents/GcBorder6/index.vue b/data-room-ui/packages/BorderComponents/GcBorder6/index.vue
index cf279bbb..7829813d 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder6/index.vue
+++ b/data-room-ui/packages/BorderComponents/GcBorder6/index.vue
@@ -9,6 +9,7 @@
       :key="updateKey"
     >
     <div class="element"
+    v-if="config.border.isTitle"
     :style="`
     color:${color};
     font-size:${config.border.fontSize}px;
diff --git a/data-room-ui/packages/BorderComponents/GcBorder6/setting.js b/data-room-ui/packages/BorderComponents/GcBorder6/setting.js
index 65ada105..a3cbf490 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder6/setting.js
+++ b/data-room-ui/packages/BorderComponents/GcBorder6/setting.js
@@ -17,19 +17,7 @@ const setting = [
     // 绑定的值
     value: '',
   },
-  // 标题字体颜色
-  {
-    label:'标题字体颜色',
-    // 设置组件类型， select / input / colorPicker
-    type: 'colorPicker',
-    // 字段
-    field: 'fontColor',
-    optionField: 'fontColor', // 对应options中的字段
-    // 是否多选
-    multiple: false,
-    // 绑定的值
-    value: '',
-  },
+  
 
 
 ]
diff --git a/data-room-ui/packages/BorderComponents/GcBorder7/index.vue b/data-room-ui/packages/BorderComponents/GcBorder7/index.vue
index ac6808b6..71d856c5 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder7/index.vue
+++ b/data-room-ui/packages/BorderComponents/GcBorder7/index.vue
@@ -9,6 +9,7 @@
       :key="updateKey"
     >
     <div class="element"
+    v-if="config.border.isTitle"
     :style="`
     color:${color};
     font-size:${config.border.fontSize}px;
diff --git a/data-room-ui/packages/BorderComponents/GcBorder7/setting.js b/data-room-ui/packages/BorderComponents/GcBorder7/setting.js
index 9cdcfe38..38023f41 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder7/setting.js
+++ b/data-room-ui/packages/BorderComponents/GcBorder7/setting.js
@@ -17,19 +17,6 @@ const setting = [
     // 绑定的值
     value: '',
   },
-  // 标题字体颜色
-  {
-    label:'标题字体颜色',
-    // 设置组件类型， select / input / colorPicker
-    type: 'colorPicker',
-    // 字段
-    field: 'fontColor',
-    optionField: 'fontColor', // 对应options中的字段
-    // 是否多选
-    multiple: false,
-    // 绑定的值
-    value: '',
-  },
 
 
 ]
diff --git a/data-room-ui/packages/BorderComponents/GcBorder8/index.vue b/data-room-ui/packages/BorderComponents/GcBorder8/index.vue
index ae941a29..cdccd138 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder8/index.vue
+++ b/data-room-ui/packages/BorderComponents/GcBorder8/index.vue
@@ -9,6 +9,7 @@
       :key="updateKey"
     >
     <div class="element"
+    v-if="config.border.isTitle"
     :style="`
     color:${color};
     font-size:${config.border.fontSize}px;
diff --git a/data-room-ui/packages/BorderComponents/GcBorder8/setting.js b/data-room-ui/packages/BorderComponents/GcBorder8/setting.js
index 99033210..5bbd24d7 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder8/setting.js
+++ b/data-room-ui/packages/BorderComponents/GcBorder8/setting.js
@@ -17,20 +17,6 @@ const setting = [
     // 绑定的值
     value: '',
   },
-  // 标题字体颜色
-  {
-    label:'标题字体颜色',
-    // 设置组件类型， select / input / colorPicker
-    type: 'colorPicker',
-    // 字段
-    field: 'fontColor',
-    optionField: 'fontColor', // 对应options中的字段
-    // 是否多选
-    multiple: false,
-    // 绑定的值
-    value: '',
-  },
-
 
 ]
 
diff --git a/data-room-ui/packages/BorderComponents/GcBorder9/index.vue b/data-room-ui/packages/BorderComponents/GcBorder9/index.vue
index fda5e02f..baf89a0c 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder9/index.vue
+++ b/data-room-ui/packages/BorderComponents/GcBorder9/index.vue
@@ -9,6 +9,7 @@
       :key="updateKey"
     >
     <div class="element"
+    v-if="config.border.isTitle"
     :style="`
     color:${color};
     font-size:${config.border.fontSize}px;
diff --git a/data-room-ui/packages/BorderComponents/GcBorder9/setting.js b/data-room-ui/packages/BorderComponents/GcBorder9/setting.js
index ab22eb7c..a45a1d5e 100644
--- a/data-room-ui/packages/BorderComponents/GcBorder9/setting.js
+++ b/data-room-ui/packages/BorderComponents/GcBorder9/setting.js
@@ -16,20 +16,7 @@ const setting = [
     multiple: false,
     // 绑定的值
     value: '',
-  },
-  // 标题字体颜色
-  {
-    label:'标题字体颜色',
-    // 设置组件类型， select / input / colorPicker
-    type: 'colorPicker',
-    // 字段
-    field: 'fontColor',
-    optionField: 'fontColor', // 对应options中的字段
-    // 是否多选
-    multiple: false,
-    // 绑定的值
-    value: '',
-  },
+  }
 
 
 ]
diff --git a/data-room-ui/packages/G2Plots/plotList.js b/data-room-ui/packages/G2Plots/plotList.js
index f5d97f4d..d03df39d 100644
--- a/data-room-ui/packages/G2Plots/plotList.js
+++ b/data-room-ui/packages/G2Plots/plotList.js
@@ -32,7 +32,7 @@ function getPlotList (files) {
       category: configMapKey,
       name: config.name,
       title: config.title,
-      border:{type:'',titleHeight:60,fontSize:30},
+      border:{type:'',titleHeight:100,fontSize:30,isTitle:true,paddingTop:30},
       icon: null,
       img: require(`../G2Plots/images/componentLogo/${config.title}.png`),
       className:
@@ -65,7 +65,7 @@ export function getCustomPlots () {
       category: config.category,
       name: config.name,
       title: config.title,
-      border:{type:'',titleHeight:60,fontSize:30},
+      border:{type:'',titleHeight:100,fontSize:30,isTitle:true,paddingTop:30},
       icon: null,
       img: config.img,
       className:
diff --git a/data-room-ui/packages/RemoteComponents/remoteComponentsList.js b/data-room-ui/packages/RemoteComponents/remoteComponentsList.js
index 7be9b955..b77a755a 100644
--- a/data-room-ui/packages/RemoteComponents/remoteComponentsList.js
+++ b/data-room-ui/packages/RemoteComponents/remoteComponentsList.js
@@ -32,7 +32,7 @@ export function getRemoteComponents (comList) {
       title: config.title,
       icon: null,
       img: config.img,
-      border:{type:'',titleHeight:60,fontSize:30},
+      border:{type:'',titleHeight:100,fontSize:30,isTitle:true,paddingTop:30},
       className:
         'com.gccloud.dataroom.core.module.chart.components.RemoteComponentChart',
       w: 450,
@@ -64,7 +64,7 @@ export function getRemoteComponentConfig (code, name) {
     title: name,
     icon: null,
     img: null,
-    border:{type:'',titleHeight:60,fontSize:30},
+    border:{type:'',titleHeight:100,fontSize:30,isTitle:true,paddingTop:30},
     className:
       'com.gccloud.dataroom.core.module.chart.components.RemoteComponentChart',
     w: 450,
diff --git a/data-room-ui/packages/Render/RenderCard.vue b/data-room-ui/packages/Render/RenderCard.vue
index dfabb300..837d256d 100644
--- a/data-room-ui/packages/Render/RenderCard.vue
+++ b/data-room-ui/packages/Render/RenderCard.vue
@@ -16,7 +16,7 @@
     />
     <div
       class="render-item-wrap"
-      :style="`height:calc(100% - ${(config.border&&config.border.type)?config.border.titleHeight:0}px)`"
+      :style="`height:calc(100% - ${(config.border&&config.border.type&&config.border.isTitle)?config.border.titleHeight:0}px);padding-top:${(config.border&&config.border.type&&!config.border.isTitle)?config.border.paddingTop:0}px`"
     >
       <component
         :is="resolveComponentType(config.type)"
@@ -113,6 +113,6 @@ export default {
   position: relative;
   overflow: hidden;
   box-sizing: border-box;
-  padding-bottom:20px;
+  padding-bottom: 15px;
 }
 </style>
diff --git a/data-room-ui/packages/js/config/basicComponentsConfig.js b/data-room-ui/packages/js/config/basicComponentsConfig.js
index 46e0c563..1819e27c 100644
--- a/data-room-ui/packages/js/config/basicComponentsConfig.js
+++ b/data-room-ui/packages/js/config/basicComponentsConfig.js
@@ -44,7 +44,7 @@ basicConfigList = basicConfigList.map((item) => {
 export function basicComponentsConfig (item) {
   return {
     ...item,
-    border:{type:'',titleHeight:60,fontSize:30},
+    border:{type:'',titleHeight:60,fontSize:30,isTitle:true,paddingTop:30},
     option: cloneDeep(setModules[item.type]),
     ...cloneDeep(dataModules[item.type])
   }
diff --git a/data-room-ui/packages/js/store/actions.js b/data-room-ui/packages/js/store/actions.js
index f9d57791..8827c5fa 100644
--- a/data-room-ui/packages/js/store/actions.js
+++ b/data-room-ui/packages/js/store/actions.js
@@ -13,6 +13,12 @@ export default {
   initLayout ({ commit, dispatch }, code) {
     return new Promise(resolve => {
       getScreenInfo(code).then(data => {
+        // 兼容边框配置
+        data.chartList.forEach((item) => {
+          if (!item.border) {
+            item.border={type:'',titleHeight:60,fontSize:30,isTitle:true,paddingTop:10}
+          }
+        })
         const pageInfo = handleResData(data)
         // 改变页面数据
         commit('changePageInfo', pageInfo)