fix: 表格和视图类型圆角无效

This commit is contained in:
fit2cloud-chenyw 2021-08-25 15:49:59 +08:00
parent 5751df76e4
commit a4420a22a7
2 changed files with 45 additions and 7 deletions

View File

@ -1,5 +1,5 @@
<template>
<div ref="tableContainer" :style="bg_class" style="padding: 8px;">
<div ref="tableContainer" :style="bg_class" style="padding: 8px;width: 100%;height: 100%;overflow: hidden;">
<p v-show="title_show" ref="title" :style="title_class">{{ chart.title }}</p>
<div
v-if="chart.data && chart.data.x && chart.data.x.length > 0 && chart.data.series && chart.data.series.length > 0 && chart.data.series[0].data && chart.data.series[0].data.length > 0"
@ -76,9 +76,18 @@ export default {
bg_class: {
background: hexColorToRGBA('#ffffff', 0)
},
title_show: true
title_show: true,
borderRadius: '0px'
}
},
computed: {
// bg_class() {
// return {
// background: hexColorToRGBA('#ffffff', 0),
// borderRadius: this.borderRadius
// }
// }
},
watch: {
chart() {
this.init()
@ -100,6 +109,16 @@ export default {
window.onresize = function() {
that.calcHeight()
}
this.setBackGroundBorder()
},
setBackGroundBorder() {
if (this.chart.customStyle) {
const customStyle = JSON.parse(this.chart.customStyle)
if (customStyle.background) {
this.borderRadius = (customStyle.background.borderRadius || 0) + 'px'
this.bg_class.borderRadius = this.borderRadius
}
}
},
calcHeight() {
const that = this

View File

@ -1,5 +1,5 @@
<template>
<div ref="tableContainer" :style="bg_class" style="padding: 8px;">
<div ref="tableContainer" :style="bg_class" style="padding: 8px;width: 100%;height: 100%;overflow: hidden;">
<p v-show="title_show" ref="title" :style="title_class">{{ chart.title }}</p>
<ux-grid
ref="plxTable"
@ -68,9 +68,10 @@ export default {
fontStyle: 'normal',
fontWeight: 'normal'
},
bg_class: {
background: hexColorToRGBA('#ffffff', 0)
},
// bg_class: {
// background: hexColorToRGBA('#ffffff', 0),
// borderRadius: this.borderRadius
// },
table_header_class: {
fontSize: '12px',
color: '#606266',
@ -89,7 +90,16 @@ export default {
background: '#ffffff',
height: '36px'
},
title_show: true
title_show: true,
borderRadius: '0px'
}
},
computed: {
bg_class() {
return {
background: hexColorToRGBA('#ffffff', 0),
borderRadius: this.borderRadius
}
}
},
watch: {
@ -111,6 +121,15 @@ export default {
this.initData()
this.calcHeightDelay()
})
this.setBackGroundBorder()
},
setBackGroundBorder() {
if (this.chart.customStyle) {
const customStyle = JSON.parse(this.chart.customStyle)
if (customStyle.background) {
this.borderRadius = (customStyle.background.borderRadius || 0) + 'px'
}
}
},
initData() {
const that = this