质保单上传整体结构

klp-ui/src/views/wms/stock/index.vue

@@ -4,8 +4,7 @@
     <div class="stock-tree-col">
       <el-card shadow="never" class="stock-tree-card">
         <div slot="header" class="stock-tree-title">仓库结构</div>
-        <el-tree :data="warehouseTreeData" :props="treeProps" node-key="warehouseId" highlight-current
-          @node-click="handleTreeSelect" :expand-on-click-node="false" :default-expand-all="true" class="stock-tree" />
+        <WarehouseTree @node-click="handleTreeSelect" />
       </el-card>
     </div>
     <!-- 右侧内容 -->
@@ -35,31 +34,21 @@
       </el-form>
 
       <el-row :gutter="10" class="mb8">
-        <!-- <el-col :span="1.5">
-          <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
-            v-hasPermi="['wms:stock:add']">新增</el-button>
+        <el-col :span="1.5">
+          <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport">导出</el-button>
         </el-col>
         <el-col :span="1.5">
-          <el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate"
-            v-hasPermi="['wms:stock:edit']">修改</el-button>
+          <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleStockBox">添加暂存单据</el-button>
         </el-col>
         <el-col :span="1.5">
-          <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
-            v-hasPermi="['wms:stock:remove']">删除</el-button>
-        </el-col> -->
-        <el-col :span="1.5">
-          <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
-            v-hasPermi="['wms:stock:export']">导出</el-button>
+          <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleViewStockBox">查看暂存单据</el-button>
         </el-col>
-        <!-- <el-col :span="1.5">
-          <el-button type="primary" plain icon="el-icon-data-analysis" size="mini" @click="showStockBox">库存分析</el-button>
-        </el-col> -->
         <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
       </el-row>
 
       <el-table v-loading="loading" :data="stockList" @selection-change="handleSelectionChange">
         <el-table-column type="selection" width="55" align="center" />
-        <el-table-column label="主键ID" align="center" prop="stockId" v-if="true" />
+        <el-table-column label="仓库" align="center" prop="warehouseName" />
         <el-table-column label="物品类型" align="center" prop="itemType">
           <template slot-scope="scope">
             <dict-tag :options="dict.type.stock_item_type" :value="scope.row.itemType" />
@@ -138,13 +127,17 @@
           <el-button @click="cancel">取 消</el-button>
         </div>
       </el-dialog>
+
+      <el-dialog :visible.sync="stockBoxVisible" title="暂存单据" width="800px" append-to-body>
+        <stock-io :data="stockBoxData" @generateBill="handleGenerateBill" />
+      </el-dialog>
     </div>
   </div>
 </template>
 
 <script>
-import { listStock, getStock, delStock, addStock, updateStock } from "@/api/wms/stock";
-import { listWarehouse } from "@/api/wms/warehouse";
+import { listStock, delStock, addStock, updateStock } from "@/api/wms/stock";
+import { addStockIoWithDetail } from "@/api/wms/stockIo";
 import RawMaterialSelect from "@/components/KLPService/RawMaterialSelect";
 import ProductSelect from "@/components/KLPService/ProductSelect";
 import WarehouseSelect from "@/components/WarehouseSelect";
@@ -152,6 +145,8 @@ import StockBox from './box';
 import RawMaterialInfo from "@/components/KLPService/Renderer/RawMaterialInfo";
 import ProductInfo from "@/components/KLPService/Renderer/ProductInfo";
 import BomInfoMini from "@/components/KLPService/Renderer/BomInfoMini";
+import StockIo from './panels/stockIo.vue';
+import WarehouseTree from "@/components/KLPService/WarehouseTree/index.vue";
 
 export default {
   name: "Stock",
@@ -163,7 +158,9 @@ export default {
     StockBox,
     RawMaterialInfo,
     ProductInfo,
-    BomInfoMini
+    BomInfoMini,
+    StockIo,
+    WarehouseTree
   },
   data() {
     return {
@@ -223,17 +220,14 @@ export default {
           { required: true, message: "批次号不能为空", trigger: "blur" }
         ],
       },
-      // 仓库树数据
-      warehouseTreeData: [],
-      treeProps: {
-        children: 'children',
-        label: 'warehouseName',
-        isLeaf: () => false
-      },
+      // 暂存用于创建出库单或移库单的数据
+      stockBoxData: [],
+      stockBoxVisible: false,
+      // 选中的数据
+      selectedRows: []
     };
   },
   created() {
-    this.getWarehouseTree();
     this.getList();
   },
   methods: {
@@ -246,21 +240,6 @@ export default {
         this.loading = false;
       });
     },
-    // 获取仓库树数据
-    getWarehouseTree() {
-      listWarehouse().then(response => {
-        this.warehouseTreeData = this.handleTree(response.data, 'warehouseId', 'parentId');
-      });
-    },
-    // 处理树结构
-    handleTree(data, id, parentId) {
-      const cloneData = JSON.parse(JSON.stringify(data));
-      return cloneData.filter(father => {
-        const branchArr = cloneData.filter(child => father[id] === child[parentId]);
-        if (branchArr.length > 0) father.children = branchArr;
-        return father[parentId] === 0 || father[parentId] === null;
-      });
-    },
     // 树节点点击
     handleTreeSelect(node) {
       this.queryParams.warehouseId = node.warehouseId;
@@ -303,28 +282,11 @@ export default {
     },
     // 多选框选中数据
     handleSelectionChange(selection) {
+      this.selectedRows = selection;
       this.ids = selection.map(item => item.stockId)
       this.single = selection.length !== 1
       this.multiple = !selection.length
     },
-    /** 新增按钮操作 */
-    handleAdd() {
-      this.reset();
-      this.open = true;
-      this.title = "添加库存：原材料/产品与库区/库位的存放关系";
-    },
-    /** 修改按钮操作 */
-    handleUpdate(row) {
-      this.loading = true;
-      this.reset();
-      const stockId = row.stockId || this.ids
-      getStock(stockId).then(response => {
-        this.loading = false;
-        this.form = response.data;
-        this.open = true;
-        this.title = "修改库存：原材料/产品与库区/库位的存放关系";
-      });
-    },
     /** 提交按钮 */
     submitForm() {
       this.$refs["form"].validate(valid => {
@@ -371,12 +333,26 @@ export default {
         ...this.queryParams
       }, `stock_${new Date().getTime()}.xlsx`)
     },
-    /** 显示库存分析图表 */
-    showStockBox() {
-      this.stockBoxVisible = true;
-      this.$nextTick(() => {
-        this.$refs.stockBoxChart && this.$refs.stockBoxChart.refresh();
+    handleStockBox() {
+      // 添加到暂存单据中，并且去重,去重依据为stockId是否相同
+      const list = [...this.selectedRows, ...this.stockBoxData];
+      console.log(list);
+      const uniqueStockBoxData = list.filter((item, index, self) =>
+        index === self.findIndex(t => t.stockId === item.stockId)
+      );
+      this.stockBoxData = uniqueStockBoxData;
+      
+      this.$modal.msgSuccess("暂存成功，请点击“暂存单据”按钮生成单据");
+    },
+    handleGenerateBill(data) {
+      addStockIoWithDetail(data).then(response => {
+        this.$modal.msgSuccess("生成单据成功");
       });
+    },
+    handleViewStockBox() {
+      // 查看暂存单据
+      console.log(this.stockBoxData);
+      this.stockBoxVisible = true;
     }
   }
 };