tzjy-code
/
DataRoom
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat:边框组件优化

Browse Source
main
liu.tao3 2 years ago
parent 45dae66fcf
commit 68e6998f7a
38 changed files with 83 additions and 189 deletions
Show Stats Download Patch File Download Diff File

2
data-room-ui/packages/BasicComponents/DigitalFlop/setting.vue
Unescape Escape View File

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

2
data-room-ui/packages/BasicComponents/FlyMap/settingConfig.js
Unescape Escape View File

@ -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,

2
data-room-ui/packages/BasicComponents/Map/settingConfig.js
Unescape Escape View File

@ -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,

2
data-room-ui/packages/BasicComponents/Select/setting.vue
Unescape Escape View File

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

41
data-room-ui/packages/BigScreenDesign/RightSetting/BorderSetting.vue
Unescape Escape View File

@ -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>

3
data-room-ui/packages/BigScreenDesign/RightSetting/G2CustomSetting.vue
Unescape Escape View File

@ -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"

5
data-room-ui/packages/BigScreenDesign/index.vue
Unescape Escape View File

@ -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)

1
data-room-ui/packages/BorderComponents/GcBorder1/index.vue
Unescape Escape View File

@ -9,6 +9,7 @@
:key="updateKey"
>
<div class="element"
v-if="config.border.isTitle"
:style="`
color:${color};
font-size:${config.border.fontSize}px;

13
data-room-ui/packages/BorderComponents/GcBorder1/setting.js
Unescape Escape View File

@ -18,19 +18,6 @@ const setting = [
// 绑定的值
value: '',
},
// 标题字体颜色
{
label:'标题字体颜色',
// 设置组件类型， select / input / colorPicker
type: 'colorPicker',
// 字段
field: 'fontColor',
optionField: 'fontColor', // 对应options中的字段
// 是否多选
multiple: false,
// 绑定的值
value: '',
},
]

1
data-room-ui/packages/BorderComponents/GcBorder10/index.vue
Unescape Escape View File

@ -9,6 +9,7 @@
:key="updateKey"
>
<div class="element"
v-if="config.border.isTitle"
:style="`
color:${color};
font-size:${config.border.fontSize}px;

13
data-room-ui/packages/BorderComponents/GcBorder10/setting.js
Unescape Escape View File

@ -17,19 +17,6 @@ const setting = [
// 绑定的值
value: '',
},
// 标题字体颜色
{
label:'标题字体颜色',
// 设置组件类型， select / input / colorPicker
type: 'colorPicker',
// 字段
field: 'fontColor',
optionField: 'fontColor', // 对应options中的字段
// 是否多选
multiple: false,
// 绑定的值
value: '',
},
]

1
data-room-ui/packages/BorderComponents/GcBorder11/index.vue
Unescape Escape View File

@ -9,6 +9,7 @@
:key="updateKey"
>
<div class="element"
v-if="config.border.isTitle"
:style="`
color:${color};
font-size:${config.border.fontSize}px;

15
data-room-ui/packages/BorderComponents/GcBorder11/setting.js
Unescape Escape View File

@ -16,20 +16,7 @@ const setting = [
multiple: false,
// 绑定的值
value: '',
},
// 标题字体颜色
{
label:'标题字体颜色',
// 设置组件类型， select / input / colorPicker
type: 'colorPicker',
// 字段
field: 'fontColor',
optionField: 'fontColor', // 对应options中的字段
// 是否多选
multiple: false,
// 绑定的值
value: '',
},
}
]

1
data-room-ui/packages/BorderComponents/GcBorder12/index.vue
Unescape Escape View File

@ -9,6 +9,7 @@
:key="updateKey"
>
<div class="element"
v-if="config.border.isTitle"
:style="`
color:${color};
font-size:${config.border.fontSize}px;

13
data-room-ui/packages/BorderComponents/GcBorder12/setting.js
Unescape Escape View File

@ -18,19 +18,6 @@ const setting = [
// 绑定的值
value: '',
},
// 标题字体颜色
{
label:'标题字体颜色',
// 设置组件类型， select / input / colorPicker
type: 'colorPicker',
// 字段
field: 'fontColor',
optionField: 'fontColor', // 对应options中的字段
// 是否多选
multiple: false,
// 绑定的值
value: '',
},
]

1
data-room-ui/packages/BorderComponents/GcBorder13/index.vue
Unescape Escape View File

@ -9,6 +9,7 @@
:key="updateKey"
>
<div class="element"
v-if="config.border.isTitle"
:style="`
color:${color};
font-size:${config.border.fontSize}px;

15
data-room-ui/packages/BorderComponents/GcBorder13/setting.js
Unescape Escape View File

@ -16,20 +16,7 @@ const setting = [
multiple: false,
// 绑定的值
value: '',
},
// 标题字体颜色
{
label:'标题字体颜色',
// 设置组件类型， select / input / colorPicker
type: 'colorPicker',
// 字段
field: 'fontColor',
optionField: 'fontColor', // 对应options中的字段
// 是否多选
multiple: false,
// 绑定的值
value: '',
},
}
]

1
data-room-ui/packages/BorderComponents/GcBorder2/index.vue
Unescape Escape View File

@ -9,6 +9,7 @@
:key="updateKey"
>
<div class="element"
v-if="config.border.isTitle"
:style="`
color:${color};
font-size:${config.border.fontSize}px;

16
data-room-ui/packages/BorderComponents/GcBorder2/setting.js
Unescape Escape View File

@ -16,21 +16,7 @@ const setting = [
multiple: false,
// 绑定的值
value: '',
},
// 标题字体颜色
{
label:'标题字体颜色',
// 设置组件类型， select / input / colorPicker
type: 'colorPicker',
// 字段
field: 'fontColor',
optionField: 'fontColor', // 对应options中的字段
// 是否多选
multiple: false,
// 绑定的值
value: '',
},
}
]

1
data-room-ui/packages/BorderComponents/GcBorder3/index.vue
Unescape Escape View File

@ -9,6 +9,7 @@
:key="updateKey"
>
<div class="element"
v-if="config.border.isTitle"
:style="`
color:${color};
font-size:${config.border.fontSize}px;

15
data-room-ui/packages/BorderComponents/GcBorder3/setting.js
Unescape Escape View File

@ -16,20 +16,7 @@ const setting = [
multiple: false,
// 绑定的值
value: '',
},
// 标题字体颜色
{
label:'标题字体颜色',
// 设置组件类型， select / input / colorPicker
type: 'colorPicker',
// 字段
field: 'fontColor',
optionField: 'fontColor', // 对应options中的字段
// 是否多选
multiple: false,
// 绑定的值
value: '',
},
}
]

1
data-room-ui/packages/BorderComponents/GcBorder4/index.vue
Unescape Escape View File

@ -10,6 +10,7 @@
:key="updateKey"
>
<div class="element"
v-if="config.border.isTitle"
:style="`
color:${color};
font-size:${config.border.fontSize}px;

13
data-room-ui/packages/BorderComponents/GcBorder4/setting.js
Unescape Escape View File

@ -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

1
data-room-ui/packages/BorderComponents/GcBorder5/index.vue
Unescape Escape View File

@ -9,6 +9,7 @@
:key="updateKey"
>
<div class="element"
v-if="config.border.isTitle"
:style="`
color:${color};
font-size:${config.border.fontSize}px;

13
data-room-ui/packages/BorderComponents/GcBorder5/setting.js
Unescape Escape View File

@ -17,19 +17,6 @@ const setting = [
// 绑定的值
value: '',
},
// 标题字体颜色
{
label:'标题字体颜色',
// 设置组件类型， select / input / colorPicker
type: 'colorPicker',
// 字段
field: 'fontColor',
optionField: 'fontColor', // 对应options中的字段
// 是否多选
multiple: false,
// 绑定的值
value: '',
},
]

1
data-room-ui/packages/BorderComponents/GcBorder6/index.vue
Unescape Escape View File

@ -9,6 +9,7 @@
:key="updateKey"
>
<div class="element"
v-if="config.border.isTitle"
:style="`
color:${color};
font-size:${config.border.fontSize}px;

14
data-room-ui/packages/BorderComponents/GcBorder6/setting.js
Unescape Escape View File

@ -17,19 +17,7 @@ const setting = [
// 绑定的值
value: '',
},
// 标题字体颜色
{
label:'标题字体颜色',
// 设置组件类型， select / input / colorPicker
type: 'colorPicker',
// 字段
field: 'fontColor',
optionField: 'fontColor', // 对应options中的字段
// 是否多选
multiple: false,
// 绑定的值
value: '',
},
]

1
data-room-ui/packages/BorderComponents/GcBorder7/index.vue
Unescape Escape View File

@ -9,6 +9,7 @@
:key="updateKey"
>
<div class="element"
v-if="config.border.isTitle"
:style="`
color:${color};
font-size:${config.border.fontSize}px;

13
data-room-ui/packages/BorderComponents/GcBorder7/setting.js
Unescape Escape View File

@ -17,19 +17,6 @@ const setting = [
// 绑定的值
value: '',
},
// 标题字体颜色
{
label:'标题字体颜色',
// 设置组件类型， select / input / colorPicker
type: 'colorPicker',
// 字段
field: 'fontColor',
optionField: 'fontColor', // 对应options中的字段
// 是否多选
multiple: false,
// 绑定的值
value: '',
},
]

1
data-room-ui/packages/BorderComponents/GcBorder8/index.vue
Unescape Escape View File

@ -9,6 +9,7 @@
:key="updateKey"
>
<div class="element"
v-if="config.border.isTitle"
:style="`
color:${color};
font-size:${config.border.fontSize}px;

14
data-room-ui/packages/BorderComponents/GcBorder8/setting.js
Unescape Escape View File

@ -17,20 +17,6 @@ const setting = [
// 绑定的值
value: '',
},
// 标题字体颜色
{
label:'标题字体颜色',
// 设置组件类型， select / input / colorPicker
type: 'colorPicker',
// 字段
field: 'fontColor',
optionField: 'fontColor', // 对应options中的字段
// 是否多选
multiple: false,
// 绑定的值
value: '',
},
]

1
data-room-ui/packages/BorderComponents/GcBorder9/index.vue
Unescape Escape View File

@ -9,6 +9,7 @@
:key="updateKey"
>
<div class="element"
v-if="config.border.isTitle"
:style="`
color:${color};
font-size:${config.border.fontSize}px;

15
data-room-ui/packages/BorderComponents/GcBorder9/setting.js
Unescape Escape View File

@ -16,20 +16,7 @@ const setting = [
multiple: false,
// 绑定的值
value: '',
},
// 标题字体颜色
{
label:'标题字体颜色',
// 设置组件类型， select / input / colorPicker
type: 'colorPicker',
// 字段
field: 'fontColor',
optionField: 'fontColor', // 对应options中的字段
// 是否多选
multiple: false,
// 绑定的值
value: '',
},
}
]

4
data-room-ui/packages/G2Plots/plotList.js
Unescape Escape View File

@ -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:

4
data-room-ui/packages/RemoteComponents/remoteComponentsList.js
Unescape Escape View File

@ -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,

4
data-room-ui/packages/Render/RenderCard.vue
Unescape Escape View File

@ -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>

2
data-room-ui/packages/js/config/basicComponentsConfig.js
Unescape Escape View File

@ -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])
}

6
data-room-ui/packages/js/store/actions.js
Unescape Escape View File

@ -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)

Write Preview
Loading…
Cancel
Save