质保单上传整体结构

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

@@ -308,8 +308,8 @@ export default {
     handleTreeNodeClick(node) {
       this.currentTreeNode = node;
       // 图表高亮并聚焦对应节点
-      if (node && node.id) {
-        this.highlightChartNode(node.id);
+      if (node && node.warehouseId) {
+        this.highlightChartNode(node.warehouseId);
       }
     },
     // 高亮并聚焦图表节点
@@ -323,7 +323,7 @@ export default {
       });
       // 聚焦节点（自动缩放到该节点）
       this.chart.dispatchAction({
-        type: 'zoomToNode',
+        type: 'treemapRootToNode',
         seriesIndex: 0,
         targetNodeId: id
       });

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;
     }
   }
 };

klp-ui/src/views/wms/stock/panels/stockIo.vue

@@ -0,0 +1,104 @@
+<template>
+  <div>
+    <el-form :model="form" label-width="120px">
+      <el-form-item label="单号">
+        <el-input v-model="form.stockIoCode" placeholder="请输入单号" />
+      </el-form-item>
+      <el-form-item label="类型">
+        <el-select v-model="form.ioType" placeholder="请选择类型">
+          <el-option label="入库" value="in" />
+          <el-option label="出库" value="out" />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="业务类型">
+        <el-select v-model="form.bizType" placeholder="请选择业务类型">
+          <el-option
+            v-for="dict in dict.type.stock_biz_type"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="备注">
+        <el-input v-model="form.remark" placeholder="请输入备注" />
+      </el-form-item>
+    </el-form>
+    <el-table :data="stockBoxData" style="width: 100%">
+      <el-table-column type="selection" width="55" />
+      <el-table-column prop="warehouseName" label="仓库" />
+      <el-table-column prop="itemName" label="物料" />
+      <el-table-column prop="quantity" label="数量" width="200">
+        <template slot-scope="scope">
+          <el-input-number v-model="scope.row.count" :min="0" :step="1" :max="scope.row.quantity" />
+        </template>
+      </el-table-column>
+      <el-table-column prop="unit" label="单位" />
+      <el-table-column label="操作" width="100">
+        <template slot-scope="scope">
+          <el-button type="danger" size="mini" @click="handleDelete(scope.row)">删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <div style="text-align: right; margin-top: 10px;">
+      <el-button type="danger" @click="handleDeleteAll">清空</el-button>
+      <el-button type="primary" @click="handleGenerateBill">生成单据</el-button>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'StockIo',
+  dicts: ['stock_biz_type'],
+  data() {
+    return {
+      stockBoxData: [],
+      form: {
+        stockIoCode: '',
+        ioType: 'in',
+        bizType: 'stock_io',
+        remark: '',
+      }
+    }
+  },
+  props: {
+    data: {
+      type: Array,
+      default: () => []
+    }
+  },
+  watch: {
+    data: {
+      handler(newVal) {
+        this.stockBoxData = newVal.map(item => ({
+          ...item,
+          count: 0,
+        }));
+      },
+      deep: true,
+      immediate: true
+    }
+  },
+  methods: {
+    handleDelete(row) {
+      this.stockBoxData = this.stockBoxData.filter(item => item.stockId !== row.stockId);
+    },
+    handleDeleteAll() {
+      this.stockBoxData = [];
+    },
+    handleGenerateBill() {
+      this.$emit('generateBill', {
+        ...this.form,
+        details: this.stockBoxData.map(item => ({
+          ...item,
+          status: 0,
+          quantity: item.count,
+          batchNo: item.batchNo,
+          remark: item.remark
+        }))
+      });
+    }
+  }
+}
+</script>