refactor: 更新四个指标卡组件的左侧栏图标,从png资源换成svg资源

main
wu.jian2 1 year ago
parent 04cc30ea35
commit bbb948b6e1

Binary file not shown.

@ -5,9 +5,9 @@
>
<div
:style="{
'background-image': `linear-gradient(${customize.gradientDirection}, ${
gradientColor0 ? gradientColor0 : gradientColor1
} , ${gradientColor1 ? gradientColor1 : gradientColor0})`,
'background-image': `linear-gradient(${customize.gradientDirection}, ${
gradientColor0 ? gradientColor0 : gradientColor1
} , ${gradientColor1 ? gradientColor1 : gradientColor0})`,
'border-radius':customize.borderRadius + 'px',
border:`${customize.borderWidth}px solid ${customize.borderColor}`,
}"
@ -40,15 +40,16 @@
'margin-bottom':customize.lineDistance +'px'
}"
>
{{ optionData}}
<span
:style="{
'margin-left':'10px',
'font-size': customize.unitSize + 'px',
color:customize.unitColor,
}">
{{unit}}
</span>
{{ optionData }}
<span
:style="{
'margin-left':'10px',
'font-size': customize.unitSize + 'px',
color:customize.unitColor,
}"
>
{{ unit }}
</span>
</span>
<span
:style="{
@ -82,7 +83,7 @@ export default {
},
data () {
return {
imgUrl:require('data-room-ui/assets/images/cardImg/cardicon.png'),
imgUrl: require('data-room-ui/assets/images/cardImg/cardicon.png'),
customClass: {}
}
},
@ -94,9 +95,9 @@ export default {
return this.config.customize.gradientColor0 || this.config.customize.gradientColor1 || 'transparent'
},
gradientColor1 () {
return this.config.customize.gradientColor1 || this.config.customize.gradientColor0 || 'transparent'
return this.config.customize.gradientColor1 || this.config.customize.gradientColor0 || 'transparent'
},
unit(){
unit () {
return this.config?.customize.unit || ''
},
option () {
@ -107,12 +108,12 @@ export default {
},
customize () {
return this.config?.customize
},
}
},
methods: {
dataFormatting (config, data) {
let dataList = ''
if(data.success){
if (data.success) {
if (data.data instanceof Array) {
dataList = config.dataSource.dimensionField
? data.data[0][config.dataSource.dimensionField]
@ -120,8 +121,8 @@ export default {
} else {
dataList = data.data[config.dataSource.dimensionField]
}
}else{
dataList=80
} else {
dataList = 80
}
config.option = {
...config.option,
@ -129,7 +130,7 @@ export default {
}
return config
}
}
}
}
</script>

@ -6,8 +6,8 @@
<div
:style="{
'background-image': `linear-gradient(${customize.gradientDirection}, ${
gradientColor0 ? gradientColor0 : gradientColor1
} , ${gradientColor1 ? gradientColor1 : gradientColor0})`,
gradientColor0 ? gradientColor0 : gradientColor1
} , ${gradientColor1 ? gradientColor1 : gradientColor0})`,
'border-radius':customize.borderRadius + 'px',
border:`${customize.borderWidth}px solid ${customize.borderColor}`,
}"
@ -49,15 +49,16 @@
}"
class="content-right-second"
>
{{ optionData}}
<span
:style="{
'margin-left':'10px',
'font-size': customize.unitSize + 'px',
color:customize.unitColor,
}">
{{unit}}
</span>
{{ optionData }}
<span
:style="{
'margin-left':'10px',
'font-size': customize.unitSize + 'px',
color:customize.unitColor,
}"
>
{{ unit }}
</span>
</span>
</div>
</div>
@ -80,7 +81,7 @@ export default {
},
data () {
return {
imgUrl:require('data-room-ui/assets/images/cardImg/cardicon.png'),
imgUrl: require('data-room-ui/assets/images/cardImg/cardicon.png'),
customClass: {}
}
},
@ -88,13 +89,13 @@ export default {
mounted () {
},
computed: {
gradientColor0 () {
gradientColor0 () {
return this.config.customize.gradientColor0 || this.config.customize.gradientColor1 || 'transparent'
},
gradientColor1 () {
return this.config.customize.gradientColor1 || this.config.customize.gradientColor0 || 'transparent'
return this.config.customize.gradientColor1 || this.config.customize.gradientColor0 || 'transparent'
},
unit(){
unit () {
return this.config?.customize.unit || ''
},
option () {
@ -105,12 +106,12 @@ export default {
},
customize () {
return this.config?.customize
},
}
},
methods: {
dataFormatting (config, data) {
let dataList = ''
if(data.success){
if (data.success) {
if (data.data instanceof Array) {
dataList = config.dataSource.dimensionField
? data.data[0][config.dataSource.dimensionField]
@ -118,8 +119,8 @@ export default {
} else {
dataList = data.data[config.dataSource.dimensionField]
}
}else{
dataList=80
} else {
dataList = 80
}
config.option = {
...config.option,
@ -127,7 +128,7 @@ export default {
}
return config
}
}
}
}
</script>

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 32 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 29 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 36 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 21 KiB

@ -303,8 +303,8 @@ export default function getComponentConfig (type) {
return {
name: '指标卡一',
title: '指标卡一',
icon: null,
img: require('data-room-ui/assets/images/cardImg/card.png'),
icon: Icon.getNameList()[30],
// img: require('data-room-ui/assets/images/cardImg/card.png'),
className: 'com.gccloud.dataroom.core.module.chart.components.ScreenIndicatorCardChart',
w: 300,
h: 114,
@ -316,8 +316,8 @@ export default function getComponentConfig (type) {
return {
name: '指标卡二',
title: '指标卡二',
icon: null,
img: require('data-room-ui/assets/images/cardImg/card2.png'),
icon: Icon.getNameList()[31],
// img: require('data-room-ui/assets/images/cardImg/card2.png'),
className: 'com.gccloud.dataroom.core.module.chart.components.ScreenIndicatorCardChart',
w: 300,
h: 114,
@ -329,8 +329,8 @@ export default function getComponentConfig (type) {
return {
name: '指标卡三',
title: '指标卡三',
icon: null,
img: require('data-room-ui/assets/images/cardImg/indicard.png'),
icon: Icon.getNameList()[32],
// img: require('data-room-ui/assets/images/cardImg/indicard.png'),
className: 'com.gccloud.dataroom.core.module.chart.components.ScreenIndexCardChart',
w: 300,
h: 114,
@ -342,8 +342,8 @@ export default function getComponentConfig (type) {
return {
name: '指标卡四',
title: '指标卡四',
icon: null,
img: require('data-room-ui/assets/images/cardImg/indcard2.png'),
icon: Icon.getNameList()[33],
// img: require('data-room-ui/assets/images/cardImg/indcard2.png'),
className: 'com.gccloud.dataroom.core.module.chart.components.ScreenIndexCardChart',
w: 300,
h: 114,

Loading…
Cancel
Save