Merge pull request #2388 from dataease/pr@dev_feat_caculate_id_name

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

@@ -86,7 +86,7 @@
               :disabled="true"
             >
               <transition-group>
-                <span v-for="item in dimensionData" :key="item.id" class="item-dimension" :title="item.name" @click="insertFieldToCodeMirror('['+item.id+']')">
+                <span v-for="item in dimensionData" :key="item.id" class="item-dimension" :title="item.name" @click="insertFieldToCodeMirror('['+item.name+']')">
                   <svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" />
                   <svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
                   <svg-icon v-if="item.deType === 2 || item.deType === 3" icon-class="field_value" class="field-icon-value" />
@@ -106,7 +106,7 @@
               :disabled="true"
             >
               <transition-group>
-                <span v-for="item in quotaData" :key="item.id" class="item-quota" :title="item.name" @click="insertFieldToCodeMirror('['+item.id+']')">
+                <span v-for="item in quotaData" :key="item.id" class="item-quota" :title="item.name" @click="insertFieldToCodeMirror('['+item.name+']')">
                   <svg-icon v-if="item.deType === 0" icon-class="field_text" class="field-icon-text" />
                   <svg-icon v-if="item.deType === 1" icon-class="field_time" class="field-icon-time" />
                   <svg-icon v-if="item.deType === 2 || item.deType === 3" icon-class="field_value" class="field-icon-value" />
@@ -248,6 +248,7 @@ export default {
       searchFunction: '',
       dimensionData: [],
       quotaData: [],
+      name2Auto: [],
       functionData: []
     }
   },
@@ -292,9 +293,9 @@ export default {
       this.$refs.myCm.codemirror.showHint()
     })
     this.initFunctions()
-    this.initField()
     this.dimensionData = JSON.parse(JSON.stringify(this.tableFields.dimensionList)).filter(ele => ele.extField === 0)
     this.quotaData = JSON.parse(JSON.stringify(this.tableFields.quotaList)).filter(ele => ele.extField === 0)
+    this.initField()
   },
   methods: {
     onCmReady(cm) {
@@ -318,6 +319,7 @@ export default {
       pos2.line = pos1.line
       pos2.ch = pos1.ch
       this.$refs.myCm.codemirror.replaceRange(param, pos2)
+      this.$refs.myCm.codemirror.markText(pos2, { line: pos2.line, ch: param.length + pos2.ch }, { atomic: true, selectRight: true })
     },
 
     initFunctions() {
@@ -330,27 +332,57 @@ export default {
     initField() {
       if (this.field.id) {
         this.fieldForm = JSON.parse(JSON.stringify(this.field))
+        this.name2Auto = []
+        this.fieldForm.originName = this.setNameIdTrans('id', 'name', this.fieldForm.originName, this.name2Auto)
+        setTimeout(() => {
+          this.matchToAuto()
+        }, 500)
       } else {
         this.fieldForm = JSON.parse(JSON.stringify(this.fieldForm))
       }
     },
-
+    matchToAuto() {
+      if (!this.name2Auto.length) return
+      this.name2Auto.forEach(ele => {
+        const search = this.$refs.myCm.codemirror.getSearchCursor(ele, { line: 0, ch: 0 })
+        if (search.find()) {
+          const { from, to } = search.pos
+          this.$refs.myCm.codemirror.markText({ line: from.line, ch: from.ch - 1 }, { line: to.line, ch: to.ch + 1 }, { atomic: true, selectRight: true })
+        }
+      })
+    },
     closeCalcField() {
       this.resetField()
       this.$emit('onEditClose', {})
     },
+    setNameIdTrans(from, to, originName, name2Auto) {
+      let name2Id = originName
+      const nameIdMap = [...this.dimensionData, ...this.quotaData].reduce((pre, next) => {
+        pre[next[from]] = next[to]
+        return pre
+      }, {})
+      originName.match(/(?<=\[).+?(?=\])/g).forEach(ele => {
+        if (name2Auto) {
+          name2Auto.push(nameIdMap[ele])
+        }
+        name2Id = name2Id.replace(ele, nameIdMap[ele])
+      })
+      return name2Id
+    },
 
     saveCalcField() {
-      if (this.fieldForm.name && this.fieldForm.name.length > 50) {
+      const { id, name = [], deType, originName } = this.fieldForm
+      if (name.length > 50) {
         this.$message.error(this.$t('dataset.field_name_less_50'))
         return
       }
-      if (!this.fieldForm.id) {
-        this.fieldForm.type = this.fieldForm.deType
-        this.fieldForm.deExtractType = this.fieldForm.deType
+      if (!id) {
+        this.fieldForm.type = deType
+        this.fieldForm.deExtractType = deType
         this.fieldForm.tableId = this.param.id
         this.fieldForm.columnIndex = this.tableFields.dimensionList.length + this.tableFields.quotaList.length
       }
+      this.fieldForm.originName = this.setNameIdTrans('name', 'id', originName)
       post('/dataset/field/save', this.fieldForm).then(response => {
         this.closeCalcField()
       })