Merge pull request #6040 from dataease/pr@dev@fix_gauge_batch_edit

Merge branch 'dev' into pr@dev@fix_gauge_batch_edit
This commit is contained in:
wisonic-s 2023-09-06 19:42:29 +08:00 committed by GitHub
commit 6e8e0e60db
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 152 additions and 141 deletions

View File

@ -297,7 +297,7 @@ export const TYPE_CONFIGS = [
'gaugeStartAngle', 'gaugeStartAngle',
'gaugeEndAngle', 'gaugeEndAngle',
'gaugeTickCount', 'gaugeTickCount',
'gaugeAxisLabel' 'gaugeAxisLine'
], ],
'label-selector-ant-v': [ 'label-selector-ant-v': [
'labelGauge' 'labelGauge'
@ -2160,7 +2160,7 @@ export const TYPE_CONFIGS = [
'gaugeMax', 'gaugeMax',
'gaugeStartAngle', 'gaugeStartAngle',
'gaugeEndAngle', 'gaugeEndAngle',
'gaugeAxisLabel' 'gaugeAxisLine'
], ],
'label-selector': [ 'label-selector': [
'show', 'show',

View File

@ -477,13 +477,13 @@
/> />
</el-form-item> </el-form-item>
<el-form-item <el-form-item
v-show="showProperty('gaugeAxisLabel')" v-show="showProperty('gaugeAxisLine')"
:label="$t('chart.gauge_axis_label')" :label="$t('chart.gauge_axis_label')"
class="form-item" class="form-item"
> >
<el-checkbox <el-checkbox
v-model="sizeForm.gaugeAxisLine" v-model="sizeForm.gaugeAxisLine"
@change="changeBarSizeCase('gaugeAxisLabel')" @change="changeBarSizeCase('gaugeAxisLine')"
/> />
</el-form-item> </el-form-item>
<!--gauge-end--> <!--gauge-end-->

View File

@ -522,150 +522,151 @@
label-width="100px" label-width="100px"
size="mini" size="mini"
> >
<el-form-item <div v-show="!batchOptStatus">
v-show="showProperty('gaugeMin')" <el-form-item
:label="$t('chart.min')" v-show="showProperty('gaugeMin')"
class="form-item" :label="$t('chart.min')"
> class="form-item"
<el-radio-group
v-model="sizeForm.gaugeMinType"
size="mini"
@change="changeQuotaField('min')"
> >
<el-radio-button label="fix">{{ $t('chart.fix') }}</el-radio-button> <el-radio-group
<el-radio-button label="dynamic">{{ $t('chart.dynamic') }}</el-radio-button> v-model="sizeForm.gaugeMinType"
</el-radio-group> size="mini"
</el-form-item> @change="changeQuotaField('min')"
<el-form-item
v-if="showProperty('gaugeMin') && sizeForm.gaugeMinType === 'fix'"
class="form-item form-item-slider"
>
<el-input-number
v-model="sizeForm.gaugeMin"
size="mini"
@change="changeBarSizeCase('gaugeMin')"
/>
</el-form-item>
<el-form-item
v-if="showProperty('gaugeMin') && sizeForm.gaugeMinType === 'dynamic'"
class="form-item form-flex"
>
<el-select
v-model="sizeForm.gaugeMinField.id"
:placeholder="$t('chart.field')"
@change="changeQuotaField('min',true)"
>
<el-option
v-for="item in quotaData"
:key="item.id"
:label="item.name"
:value="item.id"
> >
<el-radio-button label="fix">{{ $t('chart.fix') }}</el-radio-button>
<el-radio-button label="dynamic">{{ $t('chart.dynamic') }}</el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item
v-if="showProperty('gaugeMin') && sizeForm.gaugeMinType === 'fix'"
class="form-item form-item-slider"
>
<el-input-number
v-model="sizeForm.gaugeMin"
size="mini"
@change="changeBarSizeCase('gaugeMin')"
/>
</el-form-item>
<el-form-item
v-if="showProperty('gaugeMin') && sizeForm.gaugeMinType === 'dynamic'"
class="form-item form-flex"
>
<el-select
v-model="sizeForm.gaugeMinField.id"
:placeholder="$t('chart.field')"
@change="changeQuotaField('min',true)"
>
<el-option
v-for="item in quotaData"
:key="item.id"
:label="item.name"
:value="item.id"
>
<span style="float: left"> <span style="float: left">
<svg-icon <svg-icon
v-if="item.deType === 0" v-if="item.deType === 0"
icon-class="field_text" icon-class="field_text"
class="field-icon-text" class="field-icon-text"
/> />
<svg-icon <svg-icon
v-if="item.deType === 1" v-if="item.deType === 1"
icon-class="field_time" icon-class="field_time"
class="field-icon-time" class="field-icon-time"
/> />
<svg-icon <svg-icon
v-if="item.deType === 2 || item.deType === 3" v-if="item.deType === 2 || item.deType === 3"
icon-class="field_value" icon-class="field_value"
class="field-icon-value" class="field-icon-value"
/> />
<svg-icon <svg-icon
v-if="item.deType === 5" v-if="item.deType === 5"
icon-class="field_location" icon-class="field_location"
class="field-icon-location" class="field-icon-location"
/> />
</span> </span>
<span style="float: left; color: #8492a6; font-size: 12px">{{ item.name }}</span> <span style="float: left; color: #8492a6; font-size: 12px">{{ item.name }}</span>
</el-option> </el-option>
</el-select> </el-select>
<el-select <el-select
v-model="sizeForm.gaugeMinField.summary" v-model="sizeForm.gaugeMinField.summary"
:placeholder="$t('chart.summary')" :placeholder="$t('chart.summary')"
@change="changeQuotaField('min')" @change="changeQuotaField('min')"
> >
<el-option <el-option
v-if="validMinField" v-if="validMinField"
key="sum" key="sum"
value="sum" value="sum"
:label="$t('chart.sum')" :label="$t('chart.sum')"
/> />
<el-option <el-option
v-if="validMinField" v-if="validMinField"
key="avg" key="avg"
value="avg" value="avg"
:label="$t('chart.avg')" :label="$t('chart.avg')"
/> />
<el-option <el-option
v-if="validMinField" v-if="validMinField"
key="max" key="max"
value="max" value="max"
:label="$t('chart.max')" :label="$t('chart.max')"
/> />
<el-option <el-option
v-if="validMinField" v-if="validMinField"
key="min" key="min"
value="min" value="min"
:label="$t('chart.min')" :label="$t('chart.min')"
/> />
<el-option <el-option
v-if="validMinField" v-if="validMinField"
key="stddev_pop" key="stddev_pop"
value="stddev_pop" value="stddev_pop"
:label="$t('chart.stddev_pop')" :label="$t('chart.stddev_pop')"
/> />
<el-option <el-option
v-if="validMinField" v-if="validMinField"
key="var_pop" key="var_pop"
value="var_pop" value="var_pop"
:label="$t('chart.var_pop')" :label="$t('chart.var_pop')"
/> />
<el-option <el-option
key="count" key="count"
value="count" value="count"
:label="$t('chart.count')" :label="$t('chart.count')"
/> />
<el-option <el-option
v-if="minField.id !== 'count'" v-if="minField.id !== 'count'"
key="count_distinct" key="count_distinct"
value="count_distinct" value="count_distinct"
:label="$t('chart.count_distinct')" :label="$t('chart.count_distinct')"
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item <el-form-item
v-show="showProperty('gaugeMax')" v-show="showProperty('gaugeMax')"
:label="$t('chart.max')" :label="$t('chart.max')"
class="form-item" class="form-item"
>
<el-radio-group
v-model="sizeForm.gaugeMaxType"
size="mini"
@change="changeQuotaField('max')"
> >
<el-radio-button label="fix">{{ $t('chart.fix') }}</el-radio-button> <el-radio-group
<el-radio-button label="dynamic">{{ $t('chart.dynamic') }}</el-radio-button> v-model="sizeForm.gaugeMaxType"
</el-radio-group> size="mini"
</el-form-item> @change="changeQuotaField('max')"
<el-form-item >
v-if="showProperty('gaugeMax') && sizeForm.gaugeMaxType === 'fix'" <el-radio-button label="fix">{{ $t('chart.fix') }}</el-radio-button>
class="form-item form-item-slider" <el-radio-button label="dynamic">{{ $t('chart.dynamic') }}</el-radio-button>
> </el-radio-group>
<el-input-number </el-form-item>
v-model="sizeForm.gaugeMax" <el-form-item
size="mini" v-if="showProperty('gaugeMax') && sizeForm.gaugeMaxType === 'fix'"
@change="changeBarSizeCase('gaugeMax')" class="form-item form-item-slider"
/> >
</el-form-item> <el-input-number
<el-form-item v-model="sizeForm.gaugeMax"
size="mini"
@change="changeBarSizeCase('gaugeMax')"
/>
</el-form-item>
<el-form-item
v-if="showProperty('gaugeMax') && sizeForm.gaugeMaxType === 'dynamic'" v-if="showProperty('gaugeMax') && sizeForm.gaugeMaxType === 'dynamic'"
class="form-item form-flex" class="form-item form-flex"
> >
@ -759,6 +760,7 @@
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
</div>
<el-form-item <el-form-item
v-show="showProperty('gaugeStartAngle')" v-show="showProperty('gaugeStartAngle')"
@ -791,13 +793,13 @@
/> />
</el-form-item> </el-form-item>
<el-form-item <el-form-item
v-show="showProperty('gaugeAxisLabel')" v-show="showProperty('gaugeAxisLine')"
:label="$t('chart.gauge_axis_label')" :label="$t('chart.gauge_axis_label')"
class="form-item" class="form-item"
> >
<el-checkbox <el-checkbox
v-model="sizeForm.gaugeAxisLine" v-model="sizeForm.gaugeAxisLine"
@change="changeBarSizeCase('gaugeAxisLabel')" @change="changeBarSizeCase('gaugeAxisLine')"
/> />
</el-form-item> </el-form-item>
<!-- <el-form-item v-show="showProperty('gaugeTickCount')" :label="$t('chart.tick_count')" class="form-item form-item-slider">--> <!-- <el-form-item v-show="showProperty('gaugeTickCount')" :label="$t('chart.tick_count')" class="form-item form-item-slider">-->
@ -1369,7 +1371,7 @@
<el-form-item <el-form-item
v-show="showProperty('wordSizeRange') " v-show="showProperty('wordSizeRange') "
:label="$t('chart.word_size_range')" :label="$t('chart.word_size_range')"
class="form-item form-item-slider" class="form-item form-item-slider form-item-range-slider"
> >
<el-slider <el-slider
v-model="sizeForm.wordSizeRange" v-model="sizeForm.wordSizeRange"
@ -1386,6 +1388,9 @@
> >
<el-slider <el-slider
v-model="sizeForm.wordSpacing" v-model="sizeForm.wordSpacing"
show-input
:show-input-controls="false"
input-size="mini"
:min="0" :min="0"
:max="20" :max="20"
@change="changeBarSizeCase('wordSpacing')" @change="changeBarSizeCase('wordSpacing')"
@ -1402,6 +1407,7 @@
<script> <script>
import { CHART_FONT_FAMILY, CHART_FONT_LETTER_SPACE, DEFAULT_SIZE } from '../../chart/chart' import { CHART_FONT_FAMILY, CHART_FONT_LETTER_SPACE, DEFAULT_SIZE } from '../../chart/chart'
import { equalsAny } from '@/utils/StringUtils' import { equalsAny } from '@/utils/StringUtils'
import { mapState } from 'vuex'
export default { export default {
name: 'SizeSelectorAntV', name: 'SizeSelectorAntV',
@ -1490,7 +1496,8 @@ export default {
return customAttr.color.mapLineGradient && equalsAny(this.sizeForm.mapLineType, 'line', 'arc') return customAttr.color.mapLineGradient && equalsAny(this.sizeForm.mapLineType, 'line', 'arc')
} }
return false return false
} },
...mapState(['batchOptStatus'])
}, },
watch: { watch: {
'chart': { 'chart': {
@ -1750,6 +1757,10 @@ export default {
line-height: 38px; line-height: 38px;
} }
.form-item-range-slider ::v-deep .el-form-item__content {
padding-right: 6px
}
.form-item ::v-deep .el-form-item__label { .form-item ::v-deep .el-form-item__label {
font-size: 12px; font-size: 12px;
} }