feat(materialPlan): 添加批次号列到时间对话框表格，优化代码格式

src/views/bpm/handleTask/components/materialPlan/timeDialog.vue

@@ -1,133 +1,141 @@
 <template>
-    <el-dialog :title="title" :visible.sync="visible" :before-close="handleClose" :close-on-click-modal="false"
-        :close-on-press-escape="false" append-to-body width="35%">
-
-        <el-form :model="form" ref="tableForm" class="tableForm" :rules="tableFormRules">
-
-            <el-table ref="multipleTable" :data="form.timeList" tooltip-effect="dark" style="width: 100%" stripe
-                :header-cell-style="{ background: '#EEEEEE', border: 'none' }">
-
-
-
-                <el-table-column label="数量" prop="purchaseQuantity">
-                    <template slot-scope="{ row, $index }">
-                        <el-form-item :prop="'timeList.' + $index + '.purchaseQuantity'"
-                            >
-                            <el-input placeholder="请输入" disabled v-model="row.purchaseQuantity"></el-input>
-                        </el-form-item>
-
-                    </template>
-                </el-table-column>
-
-
-
-                <el-table-column label="到货时间">
-                    <template slot-scope="{ row, $index }">
-                        <el-form-item :prop="'timeList.' + $index + '.requireDeliveryTime'"
-                            :rules="tableFormRules.requireDeliveryTime">
-                            <el-date-picker disabled v-model="row.requireDeliveryTime"  value-format="timestamp"   placeholder="请选择日期">
-                            </el-date-picker>
-                        </el-form-item>
-                    </template></el-table-column>
-
-
-
-
-            </el-table>
-
-        </el-form>
-
-
-
-
-        <div class="btns">
-            <el-button size="small" @click="handleClose">取消</el-button>
-        </div>
-    </el-dialog>
+  <el-dialog
+    :title="title"
+    :visible.sync="visible"
+    :before-close="handleClose"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    append-to-body
+    width="35%"
+  >
+    <el-form
+      :model="form"
+      ref="tableForm"
+      class="tableForm"
+      :rules="tableFormRules"
+    >
+      <el-table
+        ref="multipleTable"
+        :data="form.timeList"
+        tooltip-effect="dark"
+        style="width: 100%"
+        stripe
+        :header-cell-style="{ background: '#EEEEEE', border: 'none' }"
+      >
+        <el-table-column label="批次号" prop="batchNo">
+          <template slot-scope="{ row, $index }">
+            <el-form-item
+              :prop="'timeList.' + $index + '.batchNo'"
+              :rules="tableFormRules.batchNo"
+            >
+              <el-input
+                placeholder="请输入"
+                clearable
+                v-model="row.batchNo"
+                disabled
+              ></el-input>
+            </el-form-item>
+          </template>
+        </el-table-column>
+
+        <el-table-column label="数量" prop="purchaseQuantity">
+          <template slot-scope="{ row, $index }">
+            <el-form-item :prop="'timeList.' + $index + '.purchaseQuantity'">
+              <el-input
+                placeholder="请输入"
+                disabled
+                v-model="row.purchaseQuantity"
+              ></el-input>
+            </el-form-item>
+          </template>
+        </el-table-column>
+
+        <el-table-column label="到货时间">
+          <template slot-scope="{ row, $index }">
+            <el-form-item
+              :prop="'timeList.' + $index + '.requireDeliveryTime'"
+              :rules="tableFormRules.requireDeliveryTime"
+            >
+              <el-date-picker
+                disabled
+                v-model="row.requireDeliveryTime"
+                value-format="timestamp"
+                placeholder="请选择日期"
+              >
+              </el-date-picker>
+            </el-form-item> </template
+        ></el-table-column>
+      </el-table>
+    </el-form>
+
+    <div class="btns">
+      <el-button size="small" @click="handleClose">取消</el-button>
+    </div>
+  </el-dialog>
 </template>
-  
-<script>
-
-
 
-
-export default {
-    components: {
-    },
+<script>
+  export default {
+    components: {},
     data() {
-        return {
-            visible: false,
-            title: '设置分批时间',
-
-            current: null,
-            form: {
-                timeList: [
-                    {
-                        requireDeliveryTime: null,
-                        purchaseQuantity: null
-                    }
-                ]
-            },
-
-            tableFormRules: {
-                purchaseQuantity: {
-                    required: true,
-                    message: '请输入数量',
-                    trigger: 'blur'
-                },
-
-                requireDeliveryTime: {
-                    required: true,
-                    message: '请选择日期',
-                    trigger: 'change'
-                }
+      return {
+        visible: false,
+        title: '设置分批时间',
+
+        current: null,
+        form: {
+          timeList: [
+            {
+              requireDeliveryTime: null,
+              purchaseQuantity: null
             }
+          ]
+        },
 
-
+        tableFormRules: {
+          purchaseQuantity: {
+            required: true,
+            message: '请输入数量',
+            trigger: 'blur'
+          },
+
+          requireDeliveryTime: {
+            required: true,
+            message: '请选择日期',
+            trigger: 'change'
+          }
         }
+      };
     },
 
-    watch: {
-
-    },
+    watch: {},
     methods: {
-
-
-
-        open(row) {
-
-            this.form.timeList = row.timeList
-            this.current = row;
-            this.visible = true
-
-        },
-
-
-
-
-
-
-
-        handleClose() {
-            this.visible = false
-            this.form.timeList = [{
-                requireDeliveryTime: null,
-                purchaseQuantity: null
-            }];
-        },
-
+      open(row) {
+        this.form.timeList = row.timeList;
+        this.current = row;
+        this.visible = true;
+      },
+
+      handleClose() {
+        this.visible = false;
+        this.form.timeList = [
+          {
+            requireDeliveryTime: null,
+            purchaseQuantity: null
+          }
+        ];
+      }
     }
-}
+  };
 </script>
-  
+
 <style lang="scss" scoped>
-.btns {
+  .btns {
     margin-top: 20px;
     text-align: center;
-}
+  }
 
-.el-form-item {
+  .el-form-item {
     margin-bottom: 20px !important;
-}
+  }
 </style>
-