平台新增编辑和保存

src/views/orderEntry/orderImport/columns.js

@@ -10,7 +10,7 @@ const columns = [
   {
     prop: "platform_code",
     label: "平台订单号",
-    
+    _slot_: "platform_code",
     width: "152px",
   },
   {
@@ -94,7 +94,7 @@ const columns = [
     label: "操作",
     fixed: "right",
       _noset_: true,
-    width: "50px",
+    width: "80px",
       _slot_: "operation",
   },
 ]

src/views/orderEntry/orderImport/index.vue

@@ -17,7 +17,19 @@
       :data="tableData"
       style="margin: 15px 0 0 0"
     >
+      <!-- 待修改 -->
+      <template #platform_code="{ scope }" >
+        <input type="text" v-model="scope.row.platform_code" style="width:100%; height:36px" v-if="scope.row.editFlag">
+        <span v-if="!scope.row.editFlag">{{scope.row.platform_code}}</span>
+      </template>
       <template #operation="{ scope }">
+
+        <el-tooltip effect="dark" content="编辑" placement="top" v-if="!scope.row.editFlag">
+          <i class="el-icon-edit tb-icon" @click="edit(scope)"></i>
+        </el-tooltip>
+        <el-tooltip effect="dark" content="保存" placement="top" v-if="scope.row.editFlag">
+          <i class="el-icon-circle-check tb-icon" @click="check(scope)"></i>
+        </el-tooltip>
         <el-tooltip effect="dark" content="删除" placement="top">
           <i class="el-icon-delete tb-icon" @click="del(scope)"></i>
         </el-tooltip>
@@ -58,6 +70,11 @@ export default {
 
       //按钮锁
       btnFlag: false,
+
+      //编辑全局锁
+      editBtnFlag:false,
+
+      
     };
   },
   mounted() {},
@@ -149,6 +166,8 @@ export default {
             mobile: b[11] + "",
             addr: b[12] + "",
             order_remark: b[13] + "",
+            //编辑锁
+            editFlag:false,
           };
 
           this.tableData.push(model);
@@ -161,6 +180,28 @@ export default {
     cancel() {
       this.tableData = [];
     },
+    //编辑
+    edit(scope){
+      if(this.editBtnFlag){
+        this.$message.warning("当前已有数据在编辑，请保存后再试！");
+        return;
+      }
+      //只能同时编辑一条数据，将编辑上锁
+      this.editBtnFlag = true;
+      //将本条编辑功能替换为保存
+      this.tableData[scope.$index].editFlag = true;
+      console.log(scope)
+    },
+    //保存
+    check(scope){
+      //将编辑锁解开
+      this.editBtnFlag = false;
+      //将本条保存功能替换为编辑
+      this.tableData[scope.$index].editFlag = false;
+
+      //本条数据是否更改
+      console.log("本条数据",this.tableData[scope.$index])
+    },
     //删除
     del(scope) {
       console.log(scope.$index);