@@ -31,7 +31,7 @@
<div class="lc-field-body">
<BorderSetting
v-if="config.border"
- label-width="120px"
+ label-width="100px"
:config="config.border"
/>
</div>
@@ -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,
@@ -102,7 +102,7 @@ export const mapData = {
name: '地图',
title: '地图',
icon: Icon.getNameList()[5],
- border:{type:'',titleHeight:60,fontSize:30,isTitle:true,paddingTop:30},
'com.gccloud.dataroom.core.module.chart.components.ScreenMapChart',
@@ -27,30 +27,62 @@
ref="BorderSelect"
</el-form-item>
- <div v-if="config.type">
<el-form-item
:label-width="labelWidth"
- label="是否显示标题"
+ label="上边距"
>
- <el-switch
+ <el-input-number
- v-model="config.isTitle"
+ v-model="config.padding[0]"
- class="bs-el-switch"
+ class="bs-el-input-number"
- :active-value="true"
+ :min="0"
- :inactive-value="false"
+ :step="1"
- />
+ />
- v-if="!config.isTitle"
- 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
+ :label-width="labelWidth"
+ label="下边距"
+ >
+ v-model="config.padding[2]"
+ </el-form-item>
+ label="左边距"
+ v-model="config.padding[3]"
+ <div v-if="config.type">
+ label="是否显示标题"
+ <el-switch
+ v-model="config.isTitle"
+ class="bs-el-switch"
+ :active-value="true"
+ :inactive-value="false"
v-if="config.isTitle"
@@ -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]}
}
})
// 给组件库导入的组件加入统一的前缀
@@ -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`),
@@ -65,7 +65,7 @@ export function getCustomPlots () {
category: config.category,
img: config.img,
@@ -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,
@@ -444,15 +444,6 @@ const setting = [
@@ -486,7 +477,6 @@ const option = {
fontSize: 12
point: {
size: 5,
shape: 'circle',
@@ -343,16 +343,6 @@ const setting = [
tabName: 'custom',
- // 边距 padding
@@ -381,7 +371,6 @@ const option = {
smooth: true,
@@ -458,16 +458,6 @@ const setting = [
@@ -588,7 +578,6 @@ const option = {
xField: 'year',
yField: 'gdp',
seriesField: 'name',
xAxis: {
title: {
text: '',
@@ -420,16 +420,6 @@ const setting = [
@@ -1278,7 +1268,6 @@ const option = {
yField: 'value',
legendEnable: false,
legendLayout: 'vertical',
legendPosition: 'top',
@@ -416,16 +416,6 @@ const setting = [
@@ -473,7 +463,6 @@ const option = {
xField: 'month',
@@ -472,16 +472,6 @@ const setting = [
@@ -602,7 +592,6 @@ const option = {
@@ -75,15 +75,6 @@ const setting = [
groupName: 'graph'
- type: 'padding', // 设置组件类型
- field: 'appendPadding', // 字段
- optionField: 'appendPadding', // 对应options中的字段
// 数据处理脚本,取出所有指标的值
@@ -94,7 +85,6 @@ const option = {
xField:'',
yField:'',
data: [16, 95, 35, 27, 50, 36, 78, 99, 60, 62, 37],
height: 60,
autoFit: true,
@@ -95,15 +95,6 @@ const setting = [
min:0
// 配置处理脚本
@@ -117,7 +108,6 @@ const option = {
@@ -484,15 +484,6 @@ const setting = [
@@ -562,7 +553,6 @@ const option = {
// 数据将要放入到哪个字段中
isGroup: true,
shape: ' ',
xField: 'value',
@@ -469,16 +469,6 @@ const setting = [
@@ -511,7 +501,6 @@ const option = {
shape: 'default', // 条形图形状
seriesField: 'year',
color: ['#5B8FF9', '#61DDAA', '#5D7092', '#F6BD16', '#6F5EF9', '#6DC8EC', '#945FB9', '#FF9845', '#1E9493', '#FF99C3'],
legendEnable: true,
@@ -505,7 +495,6 @@ const option = {
@@ -521,7 +511,6 @@ const option = {
xField: 'city',
seriesField: 'type',
@@ -380,15 +380,6 @@ const setting = [
@@ -437,7 +428,6 @@ const option = {
xField: 'type',
yField: 'sales',
@@ -507,7 +497,6 @@ const option = {
isStack: true,
@@ -209,15 +209,6 @@ const setting = [
groupName: 'legend'
@@ -254,7 +245,6 @@ const option = {
xField: 'stage',
yField: 'number',
seriesField: 'company',
@@ -213,15 +213,6 @@ const setting = [
@@ -251,7 +242,6 @@ const option = {
dynamicHeight: false,
compareField: 'company',
@@ -143,16 +143,6 @@ const setting = [
@@ -205,7 +195,6 @@ const option = {
colorField: 'name',
valueField: 'value',
@@ -67,15 +67,6 @@ const setting = [
// 图例 legend
@@ -591,7 +582,6 @@ const option = {
wordField: 'x',
weightField: 'value',
colorField: 'category',
@@ -125,15 +125,6 @@ const setting = [
const data = [
{
@@ -149,7 +140,6 @@ const option = {
dataKey: 'percent',
percent: 0.75,
range: {
color: 'l(0) 0:#6B74E3 1:#38BBE5'
@@ -64,15 +64,6 @@ const setting = [
- value: [0, 0, 0, 0],
@@ -92,7 +83,6 @@ const option = {
- appendPadding: [0, 0, 0, 0], // 设置图标的边距
height: 50,
width: 400,
@@ -137,16 +137,6 @@ const setting = [
@@ -166,7 +156,6 @@ const option = {
color: '#598BF2',
renderer: 'canvas',
percent: 0.25,
outline: {
border: 1, // 边框宽度
distance: 1, // 边框距离
@@ -138,15 +138,6 @@ const setting = [
@@ -164,7 +155,6 @@ const option = {
shape: 'rect',
@@ -113,15 +113,6 @@ const setting = [
@@ -137,7 +128,6 @@ const option = {
@@ -90,7 +81,6 @@ const option = {
@@ -135,15 +135,6 @@ const setting = [
@@ -162,7 +153,6 @@ const option = {
color1: '#F4664A',
color2: '#d0d0d0',
shape: 'diamond',
@@ -232,15 +232,6 @@ const setting = [
@@ -297,7 +288,6 @@ const option = {
color: 'l(90) 0:#648ff7 1:#648ff7',
meta: {
score: {
alias: '分数',
@@ -161,15 +161,6 @@ const setting = [
@@ -195,7 +186,6 @@ const option = {
yField: 'star',
theme: {
styleSheet: {
backgroundColor: ''
@@ -466,15 +466,6 @@ const setting = [
@@ -511,7 +502,6 @@ const option = {
@@ -423,16 +423,6 @@ const setting = [
@@ -603,7 +593,6 @@ const option = {
xField: 'date',
@@ -369,16 +369,6 @@ const setting = [
@@ -479,7 +469,6 @@ const option = {
@@ -289,16 +289,6 @@ const setting = [
@@ -322,7 +312,6 @@ const dataHandler = ''
// 图表配置 new Pie('domName', option)
const option = {
@@ -194,16 +194,6 @@ const setting = [
@@ -227,7 +217,6 @@ const dataHandler = ''
@@ -156,15 +156,6 @@ const setting = [
@@ -216,7 +207,6 @@ const option = {
fontWeight: 400
- appendPadding: [16, 16, 16, 16] // 设置图标的边距
export default {
category,
@@ -121,7 +121,7 @@ export default {
renderer: 'svg',
// 仪表盘缩放状态下,点击准确
supportCSSTransform: true,
- ...config.option
+ ...config.option,
this.chart.render()
this.registerEvent()
@@ -32,7 +32,7 @@ export function getRemoteComponents (comList) {
'com.gccloud.dataroom.core.module.chart.components.RemoteComponentChart',
w: 450,
@@ -64,7 +64,7 @@ export function getRemoteComponentConfig (code, name) {
title: name,
img: null,
@@ -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)"
@@ -44,7 +44,7 @@ basicConfigList = basicConfigList.map((item) => {
export function basicComponentsConfig (item) {
return {
...item,
option: cloneDeep(setModules[item.type]),
...cloneDeep(dataModules[item.type])
@@ -16,7 +16,7 @@ export default {
// 兼容边框配置
data.chartList.forEach((item) => {
- item.border={type:'',titleHeight:60,fontSize:30,isTitle:true,paddingTop:10}
const pageInfo = handleResData(data)