forked from github/dataease
Merge pull request #12876 from dataease/pr@dev-v2@chart-assist-line
feat(图表): 百分比柱状图、百分比条形图支持添加辅助线功能 #11865
This commit is contained in:
commit
856dd86342
@ -212,6 +212,7 @@ onMounted(() => {
|
||||
class="dialog-css"
|
||||
>
|
||||
<assist-line-edit
|
||||
:chart="props.chart"
|
||||
:line="state.assistLineCfg.assistLine"
|
||||
:quota-fields="quotaFields"
|
||||
:quota-ext-fields="quotaExtFields"
|
||||
|
@ -1,7 +1,7 @@
|
||||
<script lang="tsx" setup>
|
||||
import icon_deleteTrash_outlined from '@/assets/svg/icon_delete-trash_outlined.svg'
|
||||
import icon_add_outlined from '@/assets/svg/icon_add_outlined.svg'
|
||||
import { computed, onMounted, reactive } from 'vue'
|
||||
import { computed, onMounted, PropType, reactive } from 'vue'
|
||||
import { useI18n } from '@/hooks/web/useI18n'
|
||||
import { COLOR_PANEL } from '@/views/chart/components/editor/util/chart'
|
||||
import { fieldType } from '@/utils/attr'
|
||||
@ -11,6 +11,10 @@ import { iconFieldMap } from '@/components/icon-group/field-list'
|
||||
const { t } = useI18n()
|
||||
|
||||
const props = defineProps({
|
||||
chart: {
|
||||
type: Object as PropType<ChartObj>,
|
||||
required: true
|
||||
},
|
||||
line: {
|
||||
type: Array,
|
||||
required: true
|
||||
@ -167,6 +171,13 @@ const getQuotaExtField = id => {
|
||||
}
|
||||
}
|
||||
|
||||
const getFieldOptions = computed(() => {
|
||||
if (['percentage-bar-stack', 'percentage-bar-stack-horizontal'].includes(props.chart.type)) {
|
||||
return state.fieldOptions.filter(item => item.value === '0')
|
||||
}
|
||||
return state.fieldOptions
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
init()
|
||||
})
|
||||
@ -199,7 +210,7 @@ onMounted(() => {
|
||||
<el-col :span="3">
|
||||
<el-select v-model="item.field" class="select-item" @change="changeAssistLine">
|
||||
<el-option
|
||||
v-for="opt in state.fieldOptions"
|
||||
v-for="opt in getFieldOptions"
|
||||
:key="opt.value"
|
||||
:label="opt.label"
|
||||
:value="opt.value"
|
||||
|
@ -657,7 +657,8 @@ export class PercentageStackBar extends GroupStackBar {
|
||||
this.configLegend,
|
||||
this.configXAxis,
|
||||
this.configYAxis,
|
||||
this.configSlider
|
||||
this.configSlider,
|
||||
this.configAnalyse
|
||||
)(chart, options, {}, this)
|
||||
}
|
||||
constructor() {
|
||||
@ -669,7 +670,6 @@ export class PercentageStackBar extends GroupStackBar {
|
||||
isGroup: false,
|
||||
groupField: undefined
|
||||
}
|
||||
this.properties = this.properties.filter(item => item !== 'assist-line')
|
||||
this.axis = [...BAR_AXIS_TYPE, 'extStack']
|
||||
}
|
||||
}
|
||||
|
@ -475,7 +475,8 @@ export class HorizontalPercentageStackBar extends HorizontalStackBar {
|
||||
this.configLegend,
|
||||
this.configXAxis,
|
||||
this.configYAxis,
|
||||
this.configSlider
|
||||
this.configSlider,
|
||||
this.configAnalyseHorizontal
|
||||
)(chart, options, {}, this)
|
||||
}
|
||||
|
||||
@ -485,6 +486,5 @@ export class HorizontalPercentageStackBar extends HorizontalStackBar {
|
||||
...this.baseOptions,
|
||||
isPercent: true
|
||||
}
|
||||
this.properties = this.properties.filter(item => item !== 'assist-line')
|
||||
}
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user