From e44132c038871e90c3acfd46c259c6d1551feda1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=A0=82=E7=B3=96?= <qq2178503051@163.com>
Date: Sat, 19 Jul 2025 18:03:35 +0800
Subject: [PATCH] 1

---
 klp-ui/src/views/wms/stock/index.vue | 339 ++++++++++-----------------
 1 file changed, 125 insertions(+), 214 deletions(-)

diff --git a/klp-ui/src/views/wms/stock/index.vue b/klp-ui/src/views/wms/stock/index.vue
index 165fd854..2edee58e 100644
--- a/klp-ui/src/views/wms/stock/index.vue
+++ b/klp-ui/src/views/wms/stock/index.vue
@@ -1,225 +1,124 @@
 <template>
   <div class="app-container stock-layout">
-    <el-row gutter="0">
-      <!-- 左侧树结构 -->
-      <el-col :span="5" 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"
-          />
-        </el-card>
-      </el-col>
-      <!-- 右侧内容 -->
-      <el-col :span="19" class="stock-main-col">
-        <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
-          <!-- 移除仓库筛选项 -->
+    <!-- 左侧树结构 -->
+    <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" />
+      </el-card>
+    </div>
+    <!-- 右侧内容 -->
+    <div class="stock-main-col">
+      <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+        <!-- 移除仓库筛选项 -->
+        <el-form-item label="物品类型" prop="itemType">
+          <el-select v-model="queryParams.itemType" placeholder="请选择物品类型" clearable>
+            <el-option v-for="dict in dict.type.stock_item_type" :key="dict.value" :label="dict.label"
+              :value="dict.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="物料" prop="itemId">
+          <raw-material-select v-if="queryParams.itemType === 'rawMaterial'" v-model="queryParams.itemId"
+            placeholder="请选择原材料" style="width: 100%;" clearable />
+          <product-select v-else-if="queryParams.itemType === 'product'" v-model="queryParams.itemId"
+            placeholder="请选择产品" style="width: 100%;" clearable />
+          <el-input v-else v-model="queryParams.itemId" placeholder="请先选择物品类型" :disabled="true" style="width: 100%;" />
+        </el-form-item>
+        <el-form-item label="单位" prop="unit">
+          <el-input v-model="queryParams.unit" placeholder="请输入单位" clearable @keyup.enter.native="handleQuery" />
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+        </el-form-item>
+      </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>
+        <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-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-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="itemType">
+          <template slot-scope="scope">
+            <dict-tag :options="dict.type.stock_item_type" :value="scope.row.itemType" />
+          </template>
+        </el-table-column>
+        <el-table-column label="物品" align="center" prop="itemName" />
+        <el-table-column label="物品编号" align="center" prop="itemCode" />
+        <el-table-column label="库存数量" align="center" prop="quantity" />
+        <el-table-column label="单位" align="center" prop="unit" />
+        <el-table-column label="批次号" align="center" prop="batchNo" />
+        <el-table-column label="备注" align="center" prop="remark" />
+        <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+          <template slot-scope="scope">
+            <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
+              v-hasPermi="['wms:stock:edit']">修改</el-button>
+            <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
+              v-hasPermi="['wms:stock:remove']">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
+        @pagination="getList" />
+
+      <!-- 添加或修改库存对话框（保持不变） -->
+      <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+        <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+          <el-form-item label="仓库/库区/库位ID" prop="warehouseId">
+            <warehouse-select v-model="form.warehouseId" placeholder="请选择仓库/库区/库位" style="width: 100%;" clearable />
+          </el-form-item>
           <el-form-item label="物品类型" prop="itemType">
-            <el-select v-model="queryParams.itemType" placeholder="请选择物品类型" clearable>
-              <el-option
-                v-for="dict in dict.type.stock_item_type"
-                :key="dict.value"
-                :label="dict.label"
-                :value="dict.value"
-              />
+            <el-select v-model="form.itemType" placeholder="请选择物品类型">
+              <el-option v-for="dict in dict.type.stock_item_type" :key="dict.value" :label="dict.label"
+                :value="dict.value"></el-option>
             </el-select>
           </el-form-item>
-          <el-form-item label="物料" prop="itemId">
-            <raw-material-select
-              v-if="queryParams.itemType === 'rawMaterial'"
-              v-model="queryParams.itemId"
-              placeholder="请选择原材料"
-              style="width: 100%;"
-              clearable
-            />
-            <product-select
-              v-else-if="queryParams.itemType === 'product'"
-              v-model="queryParams.itemId"
-              placeholder="请选择产品"
-              style="width: 100%;"
-              clearable
-            />
-            <el-input
-              v-else
-              v-model="queryParams.itemId"
-              placeholder="请先选择物品类型"
-              :disabled="true"
-              style="width: 100%;"
-            />
+          <el-form-item label="物品ID" prop="itemId">
+            <raw-material-select v-if="form.itemType === 'rawMaterial'" v-model="form.itemId" placeholder="请选择原材料"
+              style="width: 100%;" clearable />
+            <product-select v-else-if="form.itemType === 'product'" v-model="form.itemId" placeholder="请选择产品"
+              style="width: 100%;" clearable />
+            <el-input v-else v-model="form.itemId" placeholder="请先选择物品类型" :disabled="true" style="width: 100%;" />
+          </el-form-item>
+          <el-form-item label="库存数量" prop="quantity">
+            <el-input v-model="form.quantity" placeholder="请输入库存数量" />
           </el-form-item>
           <el-form-item label="单位" prop="unit">
-            <el-input
-              v-model="queryParams.unit"
-              placeholder="请输入单位"
-              clearable
-              @keyup.enter.native="handleQuery"
-            />
+            <el-input v-model="form.unit" placeholder="请输入单位" />
           </el-form-item>
-          <el-form-item>
-            <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
-            <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+          <el-form-item label="批次号" prop="batchNo">
+            <el-input v-model="form.batchNo" placeholder="请输入批次号" />
+          </el-form-item>
+          <el-form-item label="备注" prop="remark">
+            <el-input v-model="form.remark" placeholder="请输入备注" />
           </el-form-item>
         </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>
-          <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-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-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="itemType">
-            <template slot-scope="scope">
-              <dict-tag :options="dict.type.stock_item_type" :value="scope.row.itemType"/>
-            </template>
-          </el-table-column>
-          <el-table-column label="物品" align="center" prop="itemName" />
-          <el-table-column label="物品编号" align="center" prop="itemCode" />
-          <el-table-column label="库存数量" align="center" prop="quantity" />
-          <el-table-column label="单位" align="center" prop="unit" />
-          <el-table-column label="批次号" align="center" prop="batchNo" />
-          <el-table-column label="备注" align="center" prop="remark" />
-          <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
-            <template slot-scope="scope">
-              <el-button
-                size="mini"
-                type="text"
-                icon="el-icon-edit"
-                @click="handleUpdate(scope.row)"
-                v-hasPermi="['wms:stock:edit']"
-              >修改</el-button>
-              <el-button
-                size="mini"
-                type="text"
-                icon="el-icon-delete"
-                @click="handleDelete(scope.row)"
-                v-hasPermi="['wms:stock:remove']"
-              >删除</el-button>
-            </template>
-          </el-table-column>
-        </el-table>
-
-        <pagination
-          v-show="total>0"
-          :total="total"
-          :page.sync="queryParams.pageNum"
-          :limit.sync="queryParams.pageSize"
-          @pagination="getList"
-        />
-
-        <!-- 添加或修改库存对话框（保持不变） -->
-        <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
-          <el-form ref="form" :model="form" :rules="rules" label-width="80px">
-            <el-form-item label="仓库/库区/库位ID" prop="warehouseId">
-              <warehouse-select
-                v-model="form.warehouseId"
-                placeholder="请选择仓库/库区/库位"
-                style="width: 100%;"
-                clearable
-              />
-            </el-form-item>
-            <el-form-item label="物品类型" prop="itemType">
-              <el-select v-model="form.itemType" placeholder="请选择物品类型">
-                <el-option
-                  v-for="dict in dict.type.stock_item_type"
-                  :key="dict.value"
-                  :label="dict.label"
-                  :value="dict.value"
-                ></el-option>
-              </el-select>
-            </el-form-item>
-            <el-form-item label="物品ID" prop="itemId">
-              <raw-material-select
-                v-if="form.itemType === 'rawMaterial'"
-                v-model="form.itemId"
-                placeholder="请选择原材料"
-                style="width: 100%;"
-                clearable
-              />
-              <product-select
-                v-else-if="form.itemType === 'product'"
-                v-model="form.itemId"
-                placeholder="请选择产品"
-                style="width: 100%;"
-                clearable
-              />
-              <el-input
-                v-else
-                v-model="form.itemId"
-                placeholder="请先选择物品类型"
-                :disabled="true"
-                style="width: 100%;"
-              />
-            </el-form-item>
-            <el-form-item label="库存数量" prop="quantity">
-              <el-input v-model="form.quantity" placeholder="请输入库存数量" />
-            </el-form-item>
-            <el-form-item label="单位" prop="unit">
-              <el-input v-model="form.unit" placeholder="请输入单位" />
-            </el-form-item>
-            <el-form-item label="批次号" prop="batchNo">
-              <el-input v-model="form.batchNo" placeholder="请输入批次号" />
-            </el-form-item>
-            <el-form-item label="备注" prop="remark">
-              <el-input v-model="form.remark" placeholder="请输入备注" />
-            </el-form-item>
-          </el-form>
-          <div slot="footer" class="dialog-footer">
-            <el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
-            <el-button @click="cancel">取 消</el-button>
-          </div>
-        </el-dialog>
-      </el-col>
-    </el-row>
+        <div slot="footer" class="dialog-footer">
+          <el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </el-dialog>
+    </div>
   </div>
 </template>
 
@@ -375,7 +274,7 @@ export default {
     // 多选框选中数据
     handleSelectionChange(selection) {
       this.ids = selection.map(item => item.stockId)
-      this.single = selection.length!==1
+      this.single = selection.length !== 1
       this.multiple = !selection.length
     },
     /** 新增按钮操作 */
@@ -452,30 +351,42 @@ export default {
   display: flex;
   flex-direction: row;
 }
+
 .stock-tree-col {
-  min-width: 220px;
+  width: 260px;
   max-width: 300px;
   background: #fff;
   border-right: 1px solid #f0f0f0;
   height: 100%;
   padding-right: 0;
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
 }
+
 .stock-tree-card {
   height: 100%;
   border: none;
   box-shadow: none;
 }
+
 .stock-tree-title {
   font-weight: bold;
   font-size: 16px;
   padding: 8px 0;
 }
+
 .stock-tree {
   min-height: 500px;
   max-height: 80vh;
   overflow-y: auto;
 }
+
 .stock-main-col {
+  flex: 1;
   padding-left: 24px;
+  min-width: 0;
+  display: flex;
+  flex-direction: column;
 }
 </style>