Merge pull request #9962 from dataease/pr@dev-v2@chart-progress-style

style(图表-进度条): 优化进度条渐变色样式及去除纵轴配置中多余的分割线
This commit is contained in:
jianneng-fit2cloud 2024-05-29 19:28:00 +08:00 committed by GitHub
commit f9bb56efa2
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 16 additions and 5 deletions

View File

@ -255,7 +255,11 @@ onMounted(() => {
</el-form-item>
</template>
</template>
<el-divider class="m-divider" :class="'m-divider--' + themes" />
<el-divider
v-if="showProperty('splitLine') || showProperty('axisLine')"
class="m-divider"
:class="'m-divider--' + themes"
/>
<el-form-item class="form-item" :class="'form-item-' + themes" v-if="showProperty('axisLine')">
<el-checkbox
size="small"
@ -325,7 +329,11 @@ onMounted(() => {
</el-select>
</el-form-item>
</div>
<el-divider class="m-divider" :class="'m-divider--' + themes" />
<el-divider
v-if="showProperty('axisLabel')"
class="m-divider"
:class="'m-divider--' + themes"
/>
<el-form-item
class="form-item form-item-checkbox"
:class="{

View File

@ -62,7 +62,8 @@ export class ProgressBar extends G2PlotChartView<BarOptions, G2Progress> {
isGroup: false,
isPercent: true,
isStack: true,
xAxis: false
xAxis: false,
appendPadding: [0, 0, 10, 0]
}
drawChart(drawOptions: G2PlotDrawOptions<G2Progress>): G2Progress {
@ -98,13 +99,15 @@ export class ProgressBar extends G2PlotChartView<BarOptions, G2Progress> {
const data1 = defaultTo(sourceData[0]?.data, [])
const data2 = defaultTo(sourceData[1]?.data, [])
const currentData = data2.map(item => {
const progress = getCompletionRate(data1.find(i => i.field === item.field)?.value, item.value)
return {
...item,
type: 'current',
title: item.field,
id: item.quotaList[0].id,
originalValue: item.value,
progress: getCompletionRate(data1.find(i => i.field === item.field)?.value, item.value)
originalProgress: progress,
progress: progress >= 100 ? 100 : progress
}
})
const targetData = data1.map(item => {
@ -223,7 +226,7 @@ export class ProgressBar extends G2PlotChartView<BarOptions, G2Progress> {
if (item.type === 'target') {
return ''
}
return (item.progress * 100).toFixed(2) + '%'
return item.originalProgress.toFixed(2) + '%'
}
}
if (label.position === 'top') {