草稿编辑月份

src/views/components/AddDialog/tab3.vue

@@ -1,16 +1,13 @@
 <template>
   <div>
     <div class="tables" v-loading="loading">
-      <el-table
-        v-loading="loading"
-        :data="enterpriseList"
-      >
+      <el-table v-loading="loading" :data="enterpriseList">
         <el-table-column label="计划年份" align="center" prop="plannedYear" />
 
         <el-table-column label="计划月份" align="center" prop="plannedMonth">
           <template slot-scope="scope">
-            <span>
-              {{ scope.row.plannedMonth }}
+            <span @click="editMonth(scope.row)">
+              <i class="el-icon-edit el-edit"></i>{{ scope.row.plannedMonth }}
             </span>
           </template>
         </el-table-column>
@@ -34,7 +31,7 @@
             <span>{{ scope.row.isPoint == 1 ? "是" : "否" }}</span>
           </template>
         </el-table-column>
-        
+
         <el-table-column label="安全风险等级" align="center" prop="" />
         <el-table-column label="标准化等级" align="center" prop="" />
         <el-table-column label="上次检查时间" align="center" prop="" />
@@ -148,6 +145,27 @@ export default {
     this.getList();
   },
   methods: {
+    // 编辑月份
+    editMonth(row) {
+      this.$prompt("请输入月份", "编辑", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        inputValue: row.plannedMonth,
+        inputPlaceholder: "请输入1到12的数字",
+        inputPattern: /^(1[0-2]|[1-9])$/,
+        inputErrorMessage: "格式不正确",
+        closeOnClickModal: false,
+      })
+        .then(({ value }) => {
+          // 调用接口
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "取消输入",
+          });
+        });
+    },
     /** 查询计划企业列表 */
     getList() {
       this.loading = true;
@@ -355,6 +373,14 @@ export default {
       ::v-deep .el-table::before {
         height: 0;
       }
+
+      .el-edit {
+        color: #2378ec;
+        cursor: pointer;
+        &:hover {
+          color: #6aa4f6;
+        }
+      }
     }
     .pagination {
       margin-top: 10px;
@@ -436,21 +462,6 @@ export default {
       }
       .centered {
         align-items: center;
-        // position: relative;
-        // .data_icon {
-        //   width: 10px;
-        //   height: 7px;
-        //   position: absolute;
-        //   top: 50%;
-        //   left: 280px;
-        //   z-index: 9;
-        //   color: #c0c4cc;
-        //   font-size: 14px;
-        //   transform: translateY(-50%);
-        // }
-        // ::v-deep .el-input__prefix {
-        //   display: none;
-        // }
       }
     }
     .next {