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

frontend/src/lang/zh.js

@@ -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: '数据源',

frontend/src/views/dataset/data/FieldEdit.vue

@@ -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>