feat(frontend):UI->数据集 字段编辑支持修改字段类型

This commit is contained in:
junjie 2021-05-11 17:35:48 +08:00
parent 9d6680ad31
commit 516ce8142e
2 changed files with 46 additions and 15 deletions

View File

@ -812,9 +812,10 @@ export default {
target_field: '被关联字段',
union_relation: '关联关系',
pls_setting_union_success: '请正确设置关联关系',
invalid_dataset:'Kettle未运行无效数据集',
invalid_dataset: 'Kettle未运行无效数据集',
check_all: '全选',
can_not_union_self: '被关联表不能与关联表相同'
can_not_union_self: '被关联表不能与关联表相同',
float: '小数'
},
datasource: {
datasource: '数据源',

View File

@ -12,19 +12,37 @@
</el-row>
<el-divider />
<el-table :data="tableFields" size="mini" :max-height="maxHeight">
<el-table-column property="type" :label="$t('dataset.field_type')" width="100">
<el-table-column property="type" :label="$t('dataset.field_type')" width="180">
<template slot-scope="scope">
<span v-if="scope.row.deType === 0">
<svg-icon v-if="scope.row.deType === 0" icon-class="field_text" class="field-icon-text" />
<span class="field-class">{{ $t('dataset.text') }}</span>
</span>
<span v-if="scope.row.deType === 1">
<svg-icon v-if="scope.row.deType === 1" icon-class="field_time" class="field-icon-time" />
<span class="field-class">{{ $t('dataset.time') }}</span>
</span>
<span v-if="scope.row.deType === 2 || scope.row.deType === 3">
<svg-icon v-if="scope.row.deType === 2 || scope.row.deType === 3" icon-class="field_value" class="field-icon-value" />
<span class="field-class">{{ $t('dataset.value') }}</span>
<el-select v-model="scope.row.deType" size="mini" style="display: inline-block;width: 26px;">
<el-option
v-for="item in fields"
:key="item.value"
:label="item.label"
:value="item.value"
>
<span style="float: left">
<svg-icon v-if="item.value === 0" icon-class="field_text" class="field-icon-text" />
<svg-icon v-if="item.value === 1" icon-class="field_time" class="field-icon-time" />
<svg-icon v-if="item.value === 2 || item.value === 3" icon-class="field_value" class="field-icon-value" />
</span>
<span style="float: left; color: #8492a6; font-size: 12px">{{ item.label }}</span>
</el-option>
</el-select>
<span style="margin-left: 8px;">
<span v-if="scope.row.deType === 0">
<svg-icon v-if="scope.row.deType === 0" icon-class="field_text" class="field-icon-text" />
<span class="field-class">{{ $t('dataset.text') }}</span>
</span>
<span v-if="scope.row.deType === 1">
<svg-icon v-if="scope.row.deType === 1" icon-class="field_time" class="field-icon-time" />
<span class="field-class">{{ $t('dataset.time') }}</span>
</span>
<span v-if="scope.row.deType === 2 || scope.row.deType === 3">
<svg-icon v-if="scope.row.deType === 2 || scope.row.deType === 3" icon-class="field_value" class="field-icon-value" />
<span v-if="scope.row.deType === 2" class="field-class">{{ $t('dataset.value') }}</span>
<span v-if="scope.row.deType === 3" class="field-class">{{ $t('dataset.value') + '(' + $t('dataset.float') + ')' }}</span>
</span>
</span>
</template>
</el-table-column>
@ -58,7 +76,13 @@ export default {
data() {
return {
maxHeight: 'auto',
tableFields: []
tableFields: [],
fields: [
{ label: this.$t('dataset.text'), value: 0 },
{ label: this.$t('dataset.time'), value: 1 },
{ label: this.$t('dataset.value'), value: 2 },
{ label: this.$t('dataset.value') + '(' + this.$t('dataset.float') + ')', value: 3 }
]
}
},
watch: {
@ -108,4 +132,10 @@ export default {
.field-class{
font-size: 12px !important;
}
.el-select>>>input{
padding-right: 10px;
}
.el-select>>>.el-input__suffix{
right: 0;
}
</style>