Просмотр исходного кода

feat:将组件边距调整至边框栏中

liu.tao3 1 год назад
Родитель
Сommit
4c02f25553
47 измененных файлов с 61 добавлено и 398 удалено
  1. 1 1
      data-room-ui/packages/BasicComponents/DigitalFlop/setting.vue
  2. 1 1
      data-room-ui/packages/BasicComponents/FlyMap/settingConfig.js
  3. 1 1
      data-room-ui/packages/BasicComponents/Map/settingConfig.js
  4. 43 11
      data-room-ui/packages/BigScreenDesign/RightSetting/BorderSetting.vue
  5. 1 1
      data-room-ui/packages/BigScreenDesign/index.vue
  6. 2 2
      data-room-ui/packages/G2Plots/plotList.js
  7. 0 10
      data-room-ui/packages/G2Plots/折线图/基础折线图.js
  8. 0 10
      data-room-ui/packages/G2Plots/折线图/基础折线点图.js
  9. 0 11
      data-room-ui/packages/G2Plots/折线图/基础曲线图.js
  10. 0 11
      data-room-ui/packages/G2Plots/折线图/多折线动画图.js
  11. 0 11
      data-room-ui/packages/G2Plots/折线图/多折线图.js
  12. 0 11
      data-room-ui/packages/G2Plots/折线图/多阶梯折线图.js
  13. 0 11
      data-room-ui/packages/G2Plots/折线图/折线趋势填充图.js
  14. 0 10
      data-room-ui/packages/G2Plots/折线图/迷你基础折线图.js
  15. 0 10
      data-room-ui/packages/G2Plots/折线图/迷你面积图.js
  16. 0 10
      data-room-ui/packages/G2Plots/条形图/分组条形图.js
  17. 0 11
      data-room-ui/packages/G2Plots/条形图/基础条形图.js
  18. 0 11
      data-room-ui/packages/G2Plots/柱状图/分组柱状图.js
  19. 0 11
      data-room-ui/packages/G2Plots/柱状图/圆角柱状图.js
  20. 0 10
      data-room-ui/packages/G2Plots/柱状图/基础柱状图.js
  21. 0 11
      data-room-ui/packages/G2Plots/柱状图/堆叠柱状图.js
  22. 0 10
      data-room-ui/packages/G2Plots/漏斗图/分面漏斗图.js
  23. 0 10
      data-room-ui/packages/G2Plots/漏斗图/基础漏斗图.js
  24. 0 10
      data-room-ui/packages/G2Plots/漏斗图/对比漏斗图.js
  25. 0 11
      data-room-ui/packages/G2Plots/矩形树图/基础矩形树图.js
  26. 0 10
      data-room-ui/packages/G2Plots/词云图/词云图.js
  27. 0 10
      data-room-ui/packages/G2Plots/进度图/仪表盘.js
  28. 0 10
      data-room-ui/packages/G2Plots/进度图/圆角进度条.js
  29. 0 11
      data-room-ui/packages/G2Plots/进度图/水波图.js
  30. 0 10
      data-room-ui/packages/G2Plots/进度图/矩形水波图.js
  31. 0 10
      data-room-ui/packages/G2Plots/进度图/进度仪表盘.js
  32. 0 10
      data-room-ui/packages/G2Plots/进度图/进度条.js
  33. 0 10
      data-room-ui/packages/G2Plots/进度图/进度环图.js
  34. 0 10
      data-room-ui/packages/G2Plots/进度图/钻石水波图.js
  35. 0 10
      data-room-ui/packages/G2Plots/雷达图/分组雷达图.js
  36. 0 10
      data-room-ui/packages/G2Plots/雷达图/基础雷达图.js
  37. 0 10
      data-room-ui/packages/G2Plots/面积图/基础面积图.js
  38. 0 11
      data-room-ui/packages/G2Plots/面积图/堆叠面积图.js
  39. 0 11
      data-room-ui/packages/G2Plots/面积图/渐变色面积图.js
  40. 0 11
      data-room-ui/packages/G2Plots/饼图/基础环图.js
  41. 0 11
      data-room-ui/packages/G2Plots/饼图/基础饼图.js
  42. 0 10
      data-room-ui/packages/G2Plots/饼图/玫瑰图.js
  43. 1 1
      data-room-ui/packages/PlotRender/index.vue
  44. 2 2
      data-room-ui/packages/RemoteComponents/remoteComponentsList.js
  45. 7 1
      data-room-ui/packages/Render/RenderCard.vue
  46. 1 1
      data-room-ui/packages/js/config/basicComponentsConfig.js
  47. 1 1
      data-room-ui/packages/js/store/actions.js

+ 1 - 1
data-room-ui/packages/BasicComponents/DigitalFlop/setting.vue

@@ -31,7 +31,7 @@
           <div class="lc-field-body">
             <BorderSetting
               v-if="config.border"
-              label-width="120px"
+              label-width="100px"
               :config="config.border"
             />
           </div>

+ 1 - 1
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,isTitle:true,paddingTop:10},
+  border:{type:'',titleHeight:60,fontSize:30,isTitle:true,padding:[16,16,16,16]},
   className:
     'com.gccloud.dataroom.core.module.chart.components.ScreenFlyMapChart',
   w: 800,

+ 1 - 1
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,isTitle:true,paddingTop:30},
+  border:{type:'',titleHeight:60,fontSize:30,isTitle:true,padding:[16,16,16,16]},
   className:
     'com.gccloud.dataroom.core.module.chart.components.ScreenMapChart',
   w: 800,

+ 43 - 11
data-room-ui/packages/BigScreenDesign/RightSetting/BorderSetting.vue

@@ -27,30 +27,62 @@
         ref="BorderSelect"
         />
     </el-form-item>
-    <div v-if="config.type">
     <el-form-item
       :label-width="labelWidth"
-      label="是否显示标题"
+      label="上边距"
     >
-      <el-switch
-          v-model="config.isTitle"
-          class="bs-el-switch"
-          :active-value="true"
-          :inactive-value="false"
-        />
+      <el-input-number
+        v-model="config.padding[0]"
+        class="bs-el-input-number"
+        :min="0"
+        :step="1"
+      />
     </el-form-item>
     <el-form-item
-      v-if="!config.isTitle"
       :label-width="labelWidth"
-      label="边距"
+      label="边距"
     >
       <el-input-number
-        v-model="config.paddingTop"
+        v-model="config.padding[1]"
         class="bs-el-input-number"
         :min="0"
         :step="1"
       />
     </el-form-item>
+    <el-form-item
+      :label-width="labelWidth"
+      label="下边距"
+    >
+      <el-input-number
+        v-model="config.padding[2]"
+        class="bs-el-input-number"
+        :min="0"
+        :step="1"
+      />
+    </el-form-item>
+    <el-form-item
+      :label-width="labelWidth"
+      label="左边距"
+    >
+      <el-input-number
+        v-model="config.padding[3]"
+        class="bs-el-input-number"
+        :min="0"
+        :step="1"
+      />
+    </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"

+ 1 - 1
data-room-ui/packages/BigScreenDesign/index.vue

@@ -297,7 +297,7 @@ export default {
       getScreenInfo(component.code).then(res => {
         res.chartList.forEach((item) => {
           if (!item.border) {
-            item.border={type:'',titleHeight:60,fontSize:30,isTitle:true,paddingTop:20}
+            item.border={type:'',titleHeight:60,fontSize:30,isTitle:true,padding:[16,16,16,16]}
           }
         })
         // 给组件库导入的组件加入统一的前缀

+ 2 - 2
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:100,fontSize:30,isTitle:true,paddingTop:30},
+      border:{type:'',titleHeight:100,fontSize:30,isTitle:true,padding:[16,16,16,16]},
       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:100,fontSize:30,isTitle:true,paddingTop:30},
+      border:{type:'',titleHeight:100,fontSize:30,isTitle:true,padding:[16,16,16,16]},
       icon: null,
       img: config.img,
       className:

+ 0 - 10
data-room-ui/packages/G2Plots/折线图/基础折线图.js

@@ -453,15 +453,6 @@ const setting = [
     groupName: 'yAxis'
   },
   // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding',
-    field: 'appendPadding',
-    optionField: 'appendPadding',
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -490,7 +481,6 @@ const option = {
   dataKey: 'data',
   data,
   color: '',
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   xField: 'Date',
   yField: 'scales',
   smooth: false,

+ 0 - 10
data-room-ui/packages/G2Plots/折线图/基础折线点图.js

@@ -444,15 +444,6 @@ const setting = [
     groupName: 'yAxis'
   },
   // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding',
-    field: 'appendPadding',
-    optionField: 'appendPadding',
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -486,7 +477,6 @@ const option = {
       fontSize: 12
     }
   },
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   point: {
     size: 5,
     shape: 'circle',

+ 0 - 11
data-room-ui/packages/G2Plots/折线图/基础曲线图.js

@@ -343,16 +343,6 @@ const setting = [
     tabName: 'custom',
     groupName: 'yAxis'
   },
-  // 边距 padding
-    {
-    label: '图表边距',
-    type: 'padding',
-    field: 'appendPadding',
-    optionField: 'appendPadding',
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -381,7 +371,6 @@ const option = {
   dataKey: 'data',
   data,
   color: '',
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   xField: 'Date',
   yField: 'scales',
   smooth: true,

+ 0 - 11
data-room-ui/packages/G2Plots/折线图/多折线动画图.js

@@ -458,16 +458,6 @@ const setting = [
     tabName: 'custom',
     groupName: 'yAxis'
   },
-  // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding',
-    field: 'appendPadding',
-    optionField: 'appendPadding',
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -588,7 +578,6 @@ const option = {
   xField: 'year',
   yField: 'gdp',
   seriesField: 'name',
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   xAxis: {
     title: {
       text: '',

+ 0 - 11
data-room-ui/packages/G2Plots/折线图/多折线图.js

@@ -420,16 +420,6 @@ const setting = [
     tabName: 'custom',
     groupName: 'yAxis'
   },
-  // 边距 padding
-    {
-    label: '图表边距',
-    type: 'padding',
-    field: 'appendPadding',
-    optionField: 'appendPadding',
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -1278,7 +1268,6 @@ const option = {
   data,
   xField: 'year',
   yField: 'value',
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   legendEnable: false,
   legendLayout: 'vertical',
   legendPosition: 'top',

+ 0 - 11
data-room-ui/packages/G2Plots/折线图/多阶梯折线图.js

@@ -416,16 +416,6 @@ const setting = [
     tabName: 'custom',
     groupName: 'yAxis'
   },
-  // 边距 padding
-    {
-    label: '图表边距',
-    type: 'padding',
-    field: 'appendPadding',
-    optionField: 'appendPadding',
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -473,7 +463,6 @@ const option = {
   data,
   xField: 'month',
   yField: 'value',
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   legendEnable: false,
   legendLayout: 'vertical',
   legendPosition: 'top',

+ 0 - 11
data-room-ui/packages/G2Plots/折线图/折线趋势填充图.js

@@ -472,16 +472,6 @@ const setting = [
     tabName: 'custom',
     groupName: 'yAxis'
   },
-  // 边距 padding
-    {
-    label: '图表边距',
-    type: 'padding',
-    field: 'appendPadding',
-    optionField: 'appendPadding',
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -602,7 +592,6 @@ const option = {
   xField: 'year',
   yField: 'gdp',
   seriesField: 'name',
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   xAxis: {
     title: {
       text: '',

+ 0 - 10
data-room-ui/packages/G2Plots/折线图/迷你基础折线图.js

@@ -75,15 +75,6 @@ const setting = [
     groupName: 'graph'
   },
   // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding', // 设置组件类型
-    field: 'appendPadding', // 字段
-    optionField: 'appendPadding', // 对应options中的字段
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 数据处理脚本,取出所有指标的值
@@ -94,7 +85,6 @@ const option = {
   xField:'',
   yField:'',
   data: [16, 95, 35, 27, 50, 36, 78, 99, 60, 62, 37],
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   height: 60,
   autoFit: true,
   smooth: true,

+ 0 - 10
data-room-ui/packages/G2Plots/折线图/迷你面积图.js

@@ -95,15 +95,6 @@ const setting = [
     min:0
   },
   // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding', // 设置组件类型
-    field: 'appendPadding', // 字段
-    optionField: 'appendPadding', // 对应options中的字段
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 配置处理脚本
@@ -117,7 +108,6 @@ const option = {
   data: [16, 95, 35, 27, 50, 36, 78, 99, 60, 62, 37],
   xField:'',
   yField:'',
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   height: 60,
   autoFit: true,
   smooth: true,

+ 0 - 10
data-room-ui/packages/G2Plots/条形图/分组条形图.js

@@ -484,15 +484,6 @@ const setting = [
     groupName: 'yAxis'
   },
   // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding',
-    field: 'appendPadding',
-    optionField: 'appendPadding',
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -562,7 +553,6 @@ const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
   data,
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   isGroup: true,
   shape: ' ',
   xField: 'value',

+ 0 - 11
data-room-ui/packages/G2Plots/条形图/基础条形图.js

@@ -469,16 +469,6 @@ const setting = [
     tabName: 'custom',
     groupName: 'yAxis'
   },
-  // 边距 padding
-    {
-    label: '图表边距',
-    type: 'padding',
-    field: 'appendPadding',
-    optionField: 'appendPadding',
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -511,7 +501,6 @@ const option = {
   shape: 'default', // 条形图形状
   seriesField: 'year',
   color: ['#5B8FF9', '#61DDAA', '#5D7092', '#F6BD16', '#6F5EF9', '#6DC8EC', '#945FB9', '#FF9845', '#1E9493', '#FF99C3'],
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   legendEnable: true,
   legendLayout: 'vertical',
   legendPosition: 'top',

+ 0 - 11
data-room-ui/packages/G2Plots/柱状图/分组柱状图.js

@@ -458,16 +458,6 @@ const setting = [
     tabName: 'custom',
     groupName: 'yAxis'
   },
-  // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding',
-    field: 'appendPadding',
-    optionField: 'appendPadding',
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -505,7 +495,6 @@ const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
   data,
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   legendEnable: false,
   legendLayout: 'vertical',
   legendPosition: 'top',

+ 0 - 11
data-room-ui/packages/G2Plots/柱状图/圆角柱状图.js

@@ -458,16 +458,6 @@ const setting = [
     tabName: 'custom',
     groupName: 'yAxis'
   },
-  // 边距 padding
-    {
-    label: '图表边距',
-    type: 'padding',
-    field: 'appendPadding',
-    optionField: 'appendPadding',
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -521,7 +511,6 @@ const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
   data,
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   xField: 'city',
   yField: 'value',
   seriesField: 'type',

+ 0 - 10
data-room-ui/packages/G2Plots/柱状图/基础柱状图.js

@@ -380,15 +380,6 @@ const setting = [
     groupName: 'yAxis'
   },
   // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding',
-    field: 'appendPadding',
-    optionField: 'appendPadding',
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -437,7 +428,6 @@ const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
   data,
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   xField: 'type',
   yField: 'sales',
   color: '',

+ 0 - 11
data-room-ui/packages/G2Plots/柱状图/堆叠柱状图.js

@@ -458,16 +458,6 @@ const setting = [
     tabName: 'custom',
     groupName: 'yAxis'
   },
-  // 边距 padding
-    {
-    label: '图表边距',
-    type: 'padding',
-    field: 'appendPadding',
-    optionField: 'appendPadding',
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -507,7 +497,6 @@ const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
   data,
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   isStack: true,
   xField: 'year',
   yField: 'value',

+ 0 - 10
data-room-ui/packages/G2Plots/漏斗图/分面漏斗图.js

@@ -209,15 +209,6 @@ const setting = [
     groupName: 'legend'
   },
   // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding', // 设置组件类型
-    field: 'appendPadding', // 字段
-    optionField: 'appendPadding', // 对应options中的字段
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -254,7 +245,6 @@ const option = {
   dataKey: 'data',
   data,
   color: ['#5B8FF9', '#61DDAA', '#5D7092', '#F6BD16', '#6F5EF9', '#6DC8EC', '#945FB9', '#FF9845', '#1E9493', '#FF99C3'],
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   xField: 'stage',
   yField: 'number',
   seriesField: 'company',

+ 0 - 10
data-room-ui/packages/G2Plots/漏斗图/基础漏斗图.js

@@ -213,15 +213,6 @@ const setting = [
     groupName: 'legend'
   },
   // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding', // 设置组件类型
-    field: 'appendPadding', // 字段
-    optionField: 'appendPadding', // 对应options中的字段
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -251,7 +242,6 @@ const option = {
   dataKey: 'data',
   data,
   color: ['#5B8FF9', '#61DDAA', '#5D7092', '#F6BD16', '#6F5EF9', '#6DC8EC', '#945FB9', '#FF9845', '#1E9493', '#FF99C3'],
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   xField: 'stage',
   yField: 'number',
   dynamicHeight: false,

+ 0 - 10
data-room-ui/packages/G2Plots/漏斗图/对比漏斗图.js

@@ -209,15 +209,6 @@ const setting = [
     groupName: 'legend'
   },
   // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding', // 设置组件类型
-    field: 'appendPadding', // 字段
-    optionField: 'appendPadding', // 对应options中的字段
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -254,7 +245,6 @@ const option = {
   dataKey: 'data',
   data,
   color: ['#5B8FF9', '#61DDAA', '#5D7092', '#F6BD16', '#6F5EF9', '#6DC8EC', '#945FB9', '#FF9845', '#1E9493', '#FF99C3'],
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   xField: 'stage',
   yField: 'number',
   compareField: 'company',

+ 0 - 11
data-room-ui/packages/G2Plots/矩形树图/基础矩形树图.js

@@ -143,16 +143,6 @@ const setting = [
     tabName: 'custom',
     groupName: 'legend'
   },
-  // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding', // 设置组件类型
-    field: 'appendPadding', // 字段
-    optionField: 'appendPadding', // 对应options中的字段
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -205,7 +195,6 @@ const option = {
   dataKey: 'data',
   data,
   color: ['#5B8FF9', '#61DDAA', '#5D7092', '#F6BD16', '#6F5EF9', '#6DC8EC', '#945FB9', '#FF9845', '#1E9493', '#FF99C3'],
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   colorField: 'name',
   valueField: 'value',
   legendEnable: false,

+ 0 - 10
data-room-ui/packages/G2Plots/词云图/词云图.js

@@ -67,15 +67,6 @@ const setting = [
   },
   // 图例 legend
   // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding', // 设置组件类型
-    field: 'appendPadding', // 字段
-    optionField: 'appendPadding', // 对应options中的字段
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -591,7 +582,6 @@ const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
   data,
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   wordField: 'x',
   weightField: 'value',
   colorField: 'category',

+ 0 - 10
data-room-ui/packages/G2Plots/进度图/仪表盘.js

@@ -125,15 +125,6 @@ const setting = [
   },
   // 图例 legend
   // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding', // 设置组件类型
-    field: 'appendPadding', // 字段
-    optionField: 'appendPadding', // 对应options中的字段
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 const data = [
   {
@@ -149,7 +140,6 @@ const option = {
   dataKey: 'percent',
   data,
   percent: 0.75,
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   range: {
     color: 'l(0) 0:#6B74E3 1:#38BBE5'
   },

+ 0 - 10
data-room-ui/packages/G2Plots/进度图/圆角进度条.js

@@ -64,15 +64,6 @@ const setting = [
     groupName: 'graph'
   },
   // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding', // 设置组件类型
-    field: 'appendPadding', // 字段
-    optionField: 'appendPadding', // 对应options中的字段
-    value: [0, 0, 0, 0],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 const data = [
@@ -92,7 +83,6 @@ const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
   data,
-  appendPadding: [0, 0, 0, 0], // 设置图标的边距
   height: 50,
   width: 400,
   autoFit: true,

+ 0 - 11
data-room-ui/packages/G2Plots/进度图/水波图.js

@@ -137,16 +137,6 @@ const setting = [
     tabName: 'custom',
     groupName: 'graph'
   },
-  // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding', // 设置组件类型
-    field: 'appendPadding', // 字段
-    optionField: 'appendPadding', // 对应options中的字段
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 const data = [
@@ -166,7 +156,6 @@ const option = {
   color: '#598BF2',
   renderer: 'canvas',
   percent: 0.25,
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   outline: {
     border: 1, // 边框宽度
     distance: 1, // 边框距离

+ 0 - 10
data-room-ui/packages/G2Plots/进度图/矩形水波图.js

@@ -138,15 +138,6 @@ const setting = [
     groupName: 'graph'
   },
   // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding', // 设置组件类型
-    field: 'appendPadding', // 字段
-    optionField: 'appendPadding', // 对应options中的字段
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 const data = [
   {
@@ -164,7 +155,6 @@ const option = {
   renderer: 'canvas',
   color: '#598BF2',
   percent: 0.25,
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   shape: 'rect',
   outline: {
     border: 1, // 边框宽度

+ 0 - 10
data-room-ui/packages/G2Plots/进度图/进度仪表盘.js

@@ -113,15 +113,6 @@ const setting = [
     groupName: 'graph'
   },
   // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding', // 设置组件类型
-    field: 'appendPadding', // 字段
-    optionField: 'appendPadding', // 对应options中的字段
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 const data = [
   {
@@ -137,7 +128,6 @@ const option = {
   dataKey: 'percent',
   data,
   percent: 0.75,
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   range: {
     color: 'l(0) 0:#6B74E3 1:#38BBE5'
   },

+ 0 - 10
data-room-ui/packages/G2Plots/进度图/进度条.js

@@ -64,15 +64,6 @@ const setting = [
     groupName: 'graph'
   },
   // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding', // 设置组件类型
-    field: 'appendPadding', // 字段
-    optionField: 'appendPadding', // 对应options中的字段
-    value: [0, 0, 0, 0],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 const data = [
   {
@@ -90,7 +81,6 @@ const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'percent',
   data,
-  appendPadding: [0, 0, 0, 0], // 设置图标的边距
   height: 50,
   width: 400,
   autoFit: true,

+ 0 - 10
data-room-ui/packages/G2Plots/进度图/进度环图.js

@@ -135,15 +135,6 @@ const setting = [
     groupName: 'graph'
   },
   // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding', // 设置组件类型
-    field: 'appendPadding', // 字段
-    optionField: 'appendPadding', // 对应options中的字段
-    value: [0, 0, 0, 0],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 配置处理脚本
@@ -162,7 +153,6 @@ const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'percent',
   data,
-  appendPadding: [0, 0, 0, 0], // 设置图标的边距
   color1: '#F4664A',
   color2: '#d0d0d0',
   autoFit: true,

+ 0 - 10
data-room-ui/packages/G2Plots/进度图/钻石水波图.js

@@ -138,15 +138,6 @@ const setting = [
     groupName: 'graph'
   },
   // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding', // 设置组件类型
-    field: 'appendPadding', // 字段
-    optionField: 'appendPadding', // 对应options中的字段
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 const data = [
   {
@@ -162,7 +153,6 @@ const option = {
   color: '#598BF2',
   percent: 0.25,
   data,
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   shape: 'diamond',
   outline: {
     border: 1, // 边框宽度

+ 0 - 10
data-room-ui/packages/G2Plots/雷达图/分组雷达图.js

@@ -232,15 +232,6 @@ const setting = [
     groupName: 'legend'
   },
   // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding', // 设置组件类型
-    field: 'appendPadding', // 字段
-    optionField: 'appendPadding', // 对应options中的字段
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -297,7 +288,6 @@ const option = {
     }
   },
   color: 'l(90) 0:#648ff7 1:#648ff7',
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   meta: {
     score: {
       alias: '分数',

+ 0 - 10
data-room-ui/packages/G2Plots/雷达图/基础雷达图.js

@@ -161,15 +161,6 @@ const setting = [
     groupName: 'graph'
   },
   // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding', // 设置组件类型
-    field: 'appendPadding', // 字段
-    optionField: 'appendPadding', // 对应options中的字段
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -195,7 +186,6 @@ const option = {
   yField: 'star',
   smooth: false,
   color: 'l(90) 0:#648ff7 1:#648ff7',
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   theme: {
     styleSheet: {
       backgroundColor: ''

+ 0 - 10
data-room-ui/packages/G2Plots/面积图/基础面积图.js

@@ -466,15 +466,6 @@ const setting = [
     groupName: 'yAxis'
   },
   // 边距 padding
-    {
-    label: '图表边距',
-    type: 'padding',
-    field: 'appendPadding',
-    optionField: 'appendPadding',
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -511,7 +502,6 @@ const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
   data,
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   xField: 'Date',
   yField: 'scales',
   smooth: false,

+ 0 - 11
data-room-ui/packages/G2Plots/面积图/堆叠面积图.js

@@ -423,16 +423,6 @@ const setting = [
     tabName: 'custom',
     groupName: 'yAxis'
   },
-  // 边距 padding
-    {
-    label: '图表边距',
-    type: 'padding',
-    field: 'appendPadding',
-    optionField: 'appendPadding',
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -603,7 +593,6 @@ const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
   data,
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   xField: 'date',
   yField: 'value',
   color: ['#5B8FF9', '#61DDAA', '#5D7092', '#F6BD16', '#6F5EF9', '#6DC8EC', '#945FB9', '#FF9845', '#1E9493', '#FF99C3'],

+ 0 - 11
data-room-ui/packages/G2Plots/面积图/渐变色面积图.js

@@ -369,16 +369,6 @@ const setting = [
     tabName: 'custom',
     groupName: 'yAxis'
   },
-  // 边距 padding
-    {
-    label: '图表边距',
-    type: 'padding',
-    field: 'appendPadding',
-    optionField: 'appendPadding',
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -479,7 +469,6 @@ const option = {
   // 数据将要放入到哪个字段中
   dataKey: 'data',
   data,
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   xField: 'Date',
   yField: 'scales',
   smooth: false,

+ 0 - 11
data-room-ui/packages/G2Plots/饼图/基础环图.js

@@ -289,16 +289,6 @@ const setting = [
     tabName: 'custom',
     groupName: 'legend'
   },
-  // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding', // 设置组件类型
-    field: 'appendPadding', // 字段
-    optionField: 'appendPadding', // 对应options中的字段
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -322,7 +312,6 @@ const dataHandler = ''
 
 // 图表配置 new Pie('domName', option)
 const option = {
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   // 数据将要放入到哪个字段中
   dataKey: 'data',
   data,

+ 0 - 11
data-room-ui/packages/G2Plots/饼图/基础饼图.js

@@ -194,16 +194,6 @@ const setting = [
     tabName: 'custom',
     groupName: 'legend'
   },
-  // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding', // 设置组件类型
-    field: 'appendPadding', // 字段
-    optionField: 'appendPadding', // 对应options中的字段
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -227,7 +217,6 @@ const dataHandler = ''
 
 // 图表配置 new Pie('domName', option)
 const option = {
-  appendPadding: [16, 16, 16, 16], // 设置图标的边距
   // 数据将要放入到哪个字段中
   dataKey: 'data',
   data,

+ 0 - 10
data-room-ui/packages/G2Plots/饼图/玫瑰图.js

@@ -156,15 +156,6 @@ const setting = [
     groupName: 'legend'
   },
   // 边距 padding
-  {
-    label: '图表边距',
-    type: 'padding', // 设置组件类型
-    field: 'appendPadding', // 字段
-    optionField: 'appendPadding', // 对应options中的字段
-    value: [16, 16, 16, 16],
-    tabName: 'custom',
-    groupName: 'padding'
-  }
 ]
 
 // 模拟数据
@@ -216,7 +207,6 @@ const option = {
       fontWeight: 400
     }
   },
-  appendPadding: [16, 16, 16, 16] // 设置图标的边距
 }
 export default {
   category,

+ 1 - 1
data-room-ui/packages/PlotRender/index.vue

@@ -121,7 +121,7 @@ export default {
         renderer: 'svg',
         // 仪表盘缩放状态下,点击准确
         supportCSSTransform: true,
-        ...config.option
+        ...config.option,
       })
       this.chart.render()
       this.registerEvent()

+ 2 - 2
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:100,fontSize:30,isTitle:true,paddingTop:30},
+      border:{type:'',titleHeight:60,fontSize:30,isTitle:true,padding:[16,16,16,16]},
       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:100,fontSize:30,isTitle:true,paddingTop:30},
+    border:{type:'',titleHeight:60,fontSize:30,isTitle:true,padding:[16,16,16,16]},
     className:
       'com.gccloud.dataroom.core.module.chart.components.RemoteComponentChart',
     w: 450,

+ 7 - 1
data-room-ui/packages/Render/RenderCard.vue

@@ -16,7 +16,13 @@
     />
     <div
       class="render-item-wrap"
-      :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`"
+      :style="
+      `height:calc(100% - ${(config.border&&config.border.type&&config.border.isTitle)?config.border.titleHeight:0}px);
+      padding-top:${config.border?config.border.padding[0]:0}px;
+      padding-right:${config.border?config.border.padding[1]:0}px;
+      padding-bottom:${config.border?config.border.padding[2]:0}px;
+      padding-left:${config.border?config.border.padding[3]:0}px
+      `"
     >
       <component
         :is="resolveComponentType(config.type)"

+ 1 - 1
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,isTitle:true,paddingTop:30},
+    border:{type:'',titleHeight:60,fontSize:30,isTitle:true,padding:[16,16,16,16]},
     option: cloneDeep(setModules[item.type]),
     ...cloneDeep(dataModules[item.type])
   }

+ 1 - 1
data-room-ui/packages/js/store/actions.js

@@ -16,7 +16,7 @@ export default {
         // 兼容边框配置
         data.chartList.forEach((item) => {
           if (!item.border) {
-            item.border={type:'',titleHeight:60,fontSize:30,isTitle:true,paddingTop:10}
+            item.border={type:'',titleHeight:60,fontSize:30,isTitle:true,padding:[16,16,16,16]}
           }
         })
         const pageInfo = handleResData(data)