[CODE]: 仓库新增页面添加从表

src/views/basicdata/warehouse/index.vue

@@ -98,11 +98,9 @@
     <el-table v-loading="loading" :data="warehouseList" @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
       <el-table-column type="index" label="序号" align="center"/>
-     <!-- <el-table-column label="状态，默认 T ,正常T 停用F 下拉选择" align="center" prop="fId" />-->
       <el-table-column label="编号" align="center" prop="fNo" />
       <el-table-column label="名称" align="center" prop="fName" />
       <el-table-column label="地址" align="center" prop="fAddr" />
-      <!--<el-table-column label="状态，默认 T ,正常T 停用F 下拉选择" align="center" prop="fStatus" />-->
       <el-table-column label="状态" align="center">
         <template slot-scope="scope">
           <el-switch
@@ -148,7 +146,7 @@
         <el-row>
           <el-col :span="12">
             <el-form-item label="编号" prop="fNo">
-              <el-input v-model="form.fNo" placeholder="请输入编号" />
+              <el-input v-model="form.fNo"  v-on:keyup="testFno" placeholder="请输入编号" />
             </el-form-item>
           </el-col>
           <el-col :span="12">
@@ -187,6 +185,55 @@
         <el-form-item label="备注" prop="remark">
           <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
         </el-form-item>
+
+        <div >
+          <el-row :gutter="10" class="mb8">
+            <el-col :span="1.5">
+              <el-button
+                type="primary"
+                icon="el-icon-plus"
+                size="mini"
+                @click="addRow(contactList)"
+              >添加</el-button>
+            </el-col>
+          </el-row>
+        </div>
+
+        <el-table v-loading="loading" :data="contactList" @selection-change="handleSelectionChange">
+
+          <el-table-column type="index" label="序号" align="center"/>
+
+          <el-table-column label="库区编号" align="center" prop="fNo" >
+            <template scope="scope">
+              <el-input v-model="scope.row.fNo"  placeholder="库区编号" />
+            </template>
+          </el-table-column>
+
+          <el-table-column label="库区名称" align="center" prop="fName" >
+            <template scope="scope">
+              <el-input v-model="scope.row.fName"  placeholder="库区名称" />
+            </template>
+          </el-table-column>
+
+          <el-table-column label="备注" align="center" prop="remark" >
+            <template scope="scope">
+              <el-input v-model="scope.row.remark"  placeholder="备注" />
+            </template>
+          </el-table-column>
+
+          <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="100">
+            <template slot-scope="scope">
+              <el-button
+                size="mini"
+                type="text"
+                icon="el-icon-delete"
+                @click.native.prevent="deleteRow(scope.$index,scope.row.tId, contactList)"
+                v-hasPermi="['basicdata:contact:edit']"
+              >删除</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+
       </el-form>
       <div slot="footer" class="dialog-footer">
         <el-button type="primary" @click="submitForm">确 定</el-button>
@@ -205,6 +252,8 @@ export default {
   },
   data() {
     return {
+      // 从表
+      contactList:[],
       // 遮罩层
       loading: true,
       // 选中数组
@@ -257,6 +306,29 @@ export default {
     });
   },
   methods: {
+    // 添加行
+    addRow(tableData){
+      var obj = {}
+      tableData.push(obj)
+    },
+    //删除行
+    deleteRow(index1,index, rows) {
+      if(index!=null && index!=''){
+        this.$confirm('是否确认删除', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          alert(index);
+          return delCusCon(index);
+        }).then(() => {
+          this.getList();
+          this.msgSuccess("删除成功");
+        })
+      } else {
+        rows.splice(index1, 1)
+      }
+    },
     /** 查询仓库列表 */
     getList() {
       this.loading = true;
@@ -266,10 +338,15 @@ export default {
         this.loading = false;
       });
     },
+    // 检验唯一
+    testFno(){
+       alert(1);
+    },
     // 取消按钮
     cancel() {
       this.open = false;
       this.reset();
+      this.contList();
     },
     // 表单重置
     reset() {
@@ -288,6 +365,10 @@ export default {
       };
       this.resetForm("form");
     },
+    // 从表重置
+    contList() {
+      this.contactList = []
+    },
     // 状态修改
     handleStatusChange(row) {
       let text = row.fStatus === "0" ? "启用" : "停用";
@@ -322,6 +403,7 @@ export default {
     /** 新增按钮操作 */
     handleAdd() {
       this.reset();
+      this.contList();
       this.open = true;
       this.title = "添加仓库";
     },
@@ -330,7 +412,8 @@ export default {
       this.reset();
       const fId = row.fId || this.ids
       getWarehouse(fId).then(response => {
-        this.form = response.data;
+        this.form = response.data['tWarehouse'];
+        this.contactList= response.data['tWarehouseArea'];
         this.open = true;
         this.title = "修改仓库";
       });
@@ -338,15 +421,25 @@ export default {
     /** 提交按钮 */
     submitForm() {
       this.$refs["form"].validate(valid => {
+        if (this.contactList.length === 0) {
+          this.msgError("库区为空");
+          return
+        }
         if (valid) {
           if (this.form.fId != null) {
-            updateWarehouse(this.form).then(response => {
+            let formDate= new FormData()
+            formDate.append('tWarehouse',JSON.stringify(this.form));
+            formDate.append('tWarehouseArea',JSON.stringify(this.contactList));
+            addWarehouse(formDate).then(response => {
               this.msgSuccess("修改成功");
               this.open = false;
               this.getList();
             });
           } else {
-            addWarehouse(this.form).then(response => {
+            let formDate= new FormData()
+            formDate.append('tWarehouse',JSON.stringify(this.form));
+            formDate.append('tWarehouseArea',JSON.stringify(this.contactList));
+            addWarehouse(formDate).then(response => {
               this.msgSuccess("新增成功");
               this.open = false;
               this.getList();