模板参数修改

src/views/ParamsModel/edit.vue

@@ -66,12 +66,12 @@
                 v-loading="loadingStatus">
                 <el-table-column label="字段">
                   <template slot-scope="scope">
-                    <input type="text" v-model="scope.row.field" @blur="handleBlur" placeholder="请输入">
+                    <input type="text" v-model="scope.row.field" @blur="handleBlur" placeholder="请输入" :disabled="!scope.row.level">
                   </template>
                 </el-table-column>
                 <el-table-column label="类型">
                   <template slot-scope="scope">
-                    <pack-select v-model="scope.row.type" placeholder="请选择" @blur="handleBlur" @visible-change="handleVisibleChange" @change="handleChange(scope.row)">
+                    <pack-select v-model="scope.row.type" placeholder="请选择" @blur="handleBlur" @visible-change="handleVisibleChange" @change="handleChange(scope.row)" :disabled="!scope.row.level">
                       <el-option
                         v-for="item in typeOptions"
                         :key="item.value"
@@ -83,17 +83,17 @@
                 </el-table-column>
                 <el-table-column label="值">
                   <template slot-scope="scope">
-                    <input v-if="scope.row.type === 'string' || scope.row.type === 'number'" type="text" v-model="scope.row.value" @blur="handleBlur" placeholder="请输入">
+                    <input v-if="scope.row.type === 'string' || scope.row.type === 'number'" type="text" v-model="scope.row.value" @blur="handleBlur" placeholder="请输入" :disabled="!scope.row.level">
                     <div class="btn-box" v-if="scope.row.type === 'blob'">
                       <span class="upload-btn" v-if="!scope.row.value">Select File</span>
-                      <input type="file" @blur="handleBlur" @change="(event) => handleUpload(event, scope.row)" class="input-btn" v-if="!scope.row.value">
+                      <input type="file" @blur="handleBlur" @change="(event) => handleUpload(event, scope.row)" class="input-btn" v-if="!scope.row.value" :disabled="!scope.row.level">
                       <span v-if="scope.row.value" style="float: left;margin-right: 10px">{{parseInt(calculateByte(scope.row.value))}}&nbsp;字节</span>
                       <el-image v-if="scope.row.value" style="width: 42px; height: 28px;overflow: visible" :src="scope.row.value" fit="fit">
                         <div slot="error" style="width: 80px; height: 28px;overflow: visible">(不可预览)</div>
                       </el-image>
                     </div>
                     <div v-if="scope.row.type === 'table'">
-                      <pack-select v-model="scope.row.value" placeholder="请选择" @blur="handleBlur" @visible-change="handleVisibleChange">
+                      <pack-select v-model="scope.row.value" placeholder="请选择" @blur="handleBlur" @visible-change="handleVisibleChange" :disabled="!scope.row.level">
                         <el-option
                           v-for="item in tableOptions"
                           :key="item.name"
@@ -106,7 +106,8 @@
                 </el-table-column>
                 <el-table-column label="操作">
                   <template slot-scope="scope">
-                    <span @click="handleDelete(scope.$index)" class="delete-btn">删除</span>
+                    <span @click="handleRestore(scope.$index, scope.row)" v-if="scope.row.restore" class="delete-btn">撤销覆盖</span>
+                    <span @click="handleDelete(scope.$index, scope.row)" v-else class="delete-btn">删除</span>
                   </template>
                 </el-table-column>
               </el-table>
@@ -148,10 +149,15 @@ export default {
       }, {
         value: 'blob',
         label: 'blob'
+      }, {
+        value: 'object',
+        label: 'null'
       }],
       tableOptions: [],
       baseOptions: [],
       tableData: [],
+      baseData: [],
+      currentData: [],
       flexHeight: 0,
       currentRow: ''
     }
@@ -194,13 +200,46 @@ export default {
         const scalarsObj = res.data.parameters.scalars
         const tableObj = res.data.parameters.table
         for (const key in binaryObj) {
-          this.tableData.push({ field: key, type: 'blob', value: binaryObj[key] })
+          this.currentData.push({ field: key, type: 'blob', value: binaryObj[key] })
         }
         for (const key in scalarsObj) {
-          this.tableData.push({ field: key, type: typeof scalarsObj[key], value: scalarsObj[key] })
+          this.currentData.push({ field: key, type: typeof scalarsObj[key], value: scalarsObj[key] })
         }
         for (const key in tableObj) {
-          this.tableData.push({ field: key, type: 'table', value: tableObj[key] })
+          this.currentData.push({ field: key, type: 'table', value: tableObj[key] })
+        }
+        if (this.$route.query.level === '2') {
+          const base = await detailParameter({ name: res.data.base })
+          if (base && base.data && base.data.code === 0) {
+            const binaryObj1 = base.data.parameters.binary
+            const scalarsObj1 = base.data.parameters.scalars
+            const tableObj1 = base.data.parameters.table
+            for (const key in binaryObj1) {
+              this.baseData.push({ field: key, type: 'blob', value: binaryObj1[key] })
+            }
+            for (const key in scalarsObj1) {
+              this.baseData.push({ field: key, type: typeof scalarsObj1[key], value: scalarsObj1[key] })
+            }
+            for (const key in tableObj1) {
+              this.baseData.push({ field: key, type: 'table', value: tableObj1[key] })
+            }
+          }
+        }
+        const tableData = []
+        for (const value of this.baseData) {
+          tableData.push({ ...value, level: 0 })
+        }
+        for (const value of this.currentData) {
+          tableData.push({ ...value, emit: true, level: 1 })
+        }
+        const temp = []
+        for (let i = 0; i < tableData.length; i++) {
+          if (temp.includes(tableData[i].field)) {
+            this.tableData[temp.indexOf(tableData[i].field)] = { ...tableData[i], level: 0, restore: true }
+          } else {
+            temp.push(tableData[i].field)
+            this.tableData.push(tableData[i])
+          }
         }
       }
       this.loadingStatus = false
@@ -208,9 +247,30 @@ export default {
     cancel() {
       this.$router.push({ path: '/params' })
     },
+    handleRestore(index, row) {
+      const temp = this.baseData[index]
+      this.tableData[index] = { ...temp, restore: false, emit: false }
+      this.$forceUpdate()
+    },
+    handleDelete(index, row) {
+      if (!row.emit) {
+        this.tableData[index] = { ...row, type: 'null', value: null, emit: true, restore: true }
+      } else {
+        this.tableData.splice(index, 1)
+      }
+      this.$forceUpdate()
+    },
     async save() {
-      const tableData = this.tableData.filter(item => item.field && item.value)
-      const scalarsArr = tableData.filter(item => item.type === 'string' || item.type === 'number')
+      const tableDataTemp = this.tableData.filter(item => item.field !== '' && item.value !== '' && item.emit)
+      const temp = []
+      const tableData = []
+      for (let i = 0; i < tableDataTemp.length; i++) {
+        if (!temp.includes(tableDataTemp[i].field)) {
+          temp.push(tableDataTemp[i].field)
+          tableData.push(tableDataTemp[i])
+        }
+      }
+      const scalarsArr = tableData.filter(item => item.type === 'string' || item.type === 'number' || item.type === 'null')
       const binaryArr = tableData.filter(item => item.type === 'blob')
       const tableArr = tableData.filter(item => item.type === 'table')
       const scalarsObj = {}
@@ -242,10 +302,7 @@ export default {
       row.value = await fileToBase64(event.target.files[0])
     },
     insertTableData() {
-      this.tableData.push({ field: '', type: '', value: '' })
-    },
-    handleDelete(index) {
-      this.tableData.splice(index, 1)
+      this.tableData.push({ field: '', type: '', value: '', emit: true, level: 1 })
     },
     handleChange(row) {
       row.value = ''
@@ -264,6 +321,7 @@ export default {
       event.target && event.target.classList && event.target.classList.remove('write')
     },
     cellClick(row, column, cell, event) {
+      if (!row.level) return
       if (cell.getElementsByTagName('input')[0]) {
         cell.getElementsByTagName('input')[0].classList.add('write')
         cell.getElementsByTagName('input')[0].focus()