refactor(盘库流程): 重构盘库流程页面与组件，完善排产明细功能

1.  重构盘库流程的步骤与状态映射，调整流程节点顺序与名称
2.  拆分通用盘库详情组件PlanDetailPanel，复用各流程页面
3.  新增计划审批、盘库执行页面，完善差异审批页面
4.  为排产单明细添加增删改查API与前端操作功能
5.  为排产日期添加格式化注解，完善参数接收格式

klp-ui/src/views/wms/post/InvCount/apply.vue

@@ -7,14 +7,14 @@
             <div class="header-title"><i class="el-icon-s-check"></i><span>盘库申请</span><el-button size="mini" type="text" icon="el-icon-refresh" @click="getList" title="刷新列表" /></div>
             <el-select v-model="queryParams.planStatus" size="mini" @change="handleQuery" class="header-filter">
               <el-option label="草稿" :value="0" />
-              <el-option label="待审批" :value="1" />
+              <el-option label="计划待审批" :value="1" />
             </el-select>
           </div>
           <div class="search-row"><el-input v-model="queryParams.planCode" placeholder="搜索计划编号..." clearable prefix-icon="el-icon-search" size="small" @keyup.enter.native="handleQuery" @clear="handleQuery" /><el-button type="primary" size="small" @click="handleAdd"><i class="el-icon-plus"></i></el-button></div>
           <div v-loading="loading" class="list-body">
             <div v-for="item in dataList" :key="item.planId" class="list-item" :class="{ active: currentRow && currentRow.planId === item.planId }" @click="handleRowClick(item)">
               <div class="item-main"><span class="item-title">{{ item.planCode }}</span><span class="item-sub">{{ item.planName }}</span></div>
-              <div class="item-meta"><el-tag v-if="item.planStatus === 0" type="info" size="mini">草稿</el-tag><el-tag v-else size="mini">待审批</el-tag></div>
+              <div class="item-meta"><el-tag v-if="item.planStatus === 0" type="info" size="mini">草稿</el-tag><el-tag v-else size="mini">计划待审批</el-tag></div>
             </div>
             <div v-if="dataList.length === 0 && !loading" class="list-empty"><i class="el-icon-folder-opened"></i><span>暂无盘库计划</span></div>
           </div>
@@ -23,54 +23,28 @@
       </template>
       <template #panelB>
         <div class="right-panel">
-          <div v-if="!currentRow" class="empty-tip"><i class="el-icon-info"></i><span>请在左侧列表中选择一条盘库计划</span></div>
-          <div v-else v-loading="detailLoading" class="detail-content">
-            <div class="doc-header">
-              <div class="doc-header-top">
-                <div class="doc-title-group"><div class="doc-title">{{ currentRow.planCode }}</div><div class="doc-subtitle">Application</div></div>
-                <div class="doc-header-right">
-                  <el-button size="mini" type="text" icon="el-icon-refresh" @click="handleRefreshDetail">刷新</el-button>
-                  <el-button v-if="currentRow.planStatus === 0" size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(currentRow)">编辑</el-button>
-                  <el-button v-if="currentRow.planStatus === 0" size="mini" type="text" icon="el-icon-delete" @click="handleDelete(currentRow)">删除</el-button>
-                </div>
-              </div>
-              <div class="doc-status-row"><span class="doc-status-label">Status：</span><el-tag v-if="currentRow.planStatus === 0" type="info" size="small">草稿</el-tag><el-tag v-else size="small">待审批</el-tag></div>
-            </div>
-            <div class="detail-meta">
-              <span><i class="el-icon-document"></i>{{ currentRow.planName }}</span>
-              <span v-if="currentRow.countDate"><i class="el-icon-date"></i>{{ parseTime(currentRow.countDate, '{y}-{m}-{d}') }}</span>
-              <span v-if="currentRow.countUserName"><i class="el-icon-user-solid"></i>{{ currentRow.countUserName }}</span>
-            </div>
-            <CountFlowSection :planStatus="currentRow.planStatus" />
-            <el-divider />
-
-            <div class="section-title">库区盘点明细 <span class="en-sub">· Warehouses</span>
-              <el-button v-if="currentRow.planStatus === 0" size="mini" type="primary" plain icon="el-icon-plus" @click="handleAddWarehouse">绑定库区</el-button>
-            </div>
-
-            <WarehouseDetailPanel ref="whPanel"
-              :planId="currentRow.planId"
-              :planStatus="currentRow.planStatus"
-              @submit-approval="handleSubmitApproval"
-            />
-
-            <div class="section-gap" />
-            <div class="section-title">备注 <span class="en-sub">· Remarks</span></div>
-            <div class="remark-content">{{ currentRow.remark || '无' }}</div>
-          </div>
+          <PlanDetailPanel ref="detailPanel"
+            :planId="currentRow ? currentRow.planId : null"
+            subtitle="Application"
+            emptyText="请在左侧列表中选择一条盘库计划"
+            @submit-approval="handleSubmitApproval"
+            @edit-plan="handleUpdate"
+            @delete-plan="handleDelete"
+            @bind-warehouse="handleAddWarehouse"
+          />
         </div>
       </template>
     </DragResizePanel>
 
     <el-dialog :title="planDialogTitle" :visible.sync="planDialogOpen" width="650px" append-to-body>
       <el-form ref="planForm" :model="planForm" label-width="100px">
-        <el-form-item label="计划名称" prop="planName"><el-input v-model="planForm.planName" /></el-form-item>
-        <el-form-item label="盘库日期" prop="countDate"><el-date-picker v-model="planForm.countDate" type="date" value-format="yyyy-MM-dd" style="width:100%" /></el-form-item>
-        <el-form-item label="截止时间" prop="deadlineTime"><el-date-picker v-model="planForm.deadlineTime" type="datetime" value-format="yyyy-MM-dd HH:mm:ss" style="width:100%" /></el-form-item>
-        <el-form-item label="盘点人"><el-input v-model="planForm.countUserName" /></el-form-item>
-        <el-form-item label="负责人"><el-input v-model="planForm.principalUserName" /></el-form-item>
-        <el-form-item label="参与人"><el-input v-model="planForm.participantNames" /></el-form-item>
-        <el-form-item label="备注"><el-input v-model="planForm.remark" type="textarea" :rows="3" /></el-form-item>
+        <el-form-item label="计划名称" prop="planName"><el-input v-model="planForm.planName" placeholder="请输入计划名称" /></el-form-item>
+        <el-form-item label="盘库日期" prop="countDate"><el-date-picker v-model="planForm.countDate" type="date" value-format="yyyy-MM-dd" placeholder="请选择盘库日期" style="width:100%" /></el-form-item>
+        <el-form-item label="截止时间" prop="deadlineTime"><el-date-picker v-model="planForm.deadlineTime" type="datetime" value-format="yyyy-MM-dd HH:mm:ss" placeholder="请选择截止时间" style="width:100%" /></el-form-item>
+        <el-form-item label="盘点人"><el-input v-model="planForm.countUserName" placeholder="请输入盘点人" /></el-form-item>
+        <el-form-item label="负责人"><el-input v-model="planForm.principalUserName" placeholder="请输入负责人" /></el-form-item>
+        <el-form-item label="参与人"><el-input v-model="planForm.participantNames" placeholder="请输入参与人员" /></el-form-item>
+        <el-form-item label="备注"><el-input v-model="planForm.remark" type="textarea" :rows="3" placeholder="请输入备注" /></el-form-item>
       </el-form>
       <div slot="footer"><el-button :loading="btnLoading" type="primary" @click="submitPlan">确定</el-button><el-button @click="planDialogOpen = false">取消</el-button></div>
     </el-dialog>
@@ -88,21 +62,20 @@
 </template>
 
 <script>
-import { listCountPlan, getCountPlan, addCountPlan, updateCountPlan, delCountPlan } from "@/api/flow/countPlan";
+import { listCountPlan, addCountPlan, updateCountPlan, delCountPlan } from "@/api/flow/countPlan";
 import { addCountPlanWarehouse } from "@/api/flow/countPlanWarehouse";
 import DragResizePanel from "@/components/DragResizePanel/index.vue";
-import CountFlowSection from "./components/CountFlowSection.vue";
-import WarehouseDetailPanel from "./components/WarehouseDetailPanel.vue";
+import PlanDetailPanel from "./components/PlanDetailPanel.vue";
 import WarehouseSelect from "@/components/KLPService/WarehouseSelect/index.vue";
 import ActualWarehouseL1L2Select from "@/components/KLPService/ActualWarehouseL1L2Select/index.vue";
 import { parseTime } from '@/utils/klp'
 
 export default {
   name: "InvCountApply",
-  components: { DragResizePanel, CountFlowSection, WarehouseDetailPanel, WarehouseSelect, ActualWarehouseL1L2Select },
+  components: { DragResizePanel, PlanDetailPanel, WarehouseSelect, ActualWarehouseL1L2Select },
   data() {
     return {
-      loading: false, detailLoading: false, btnLoading: false, whBtnLoading: false, submitLoading: false, total: 0, dataList: [], currentRow: null,
+      loading: false, btnLoading: false, whBtnLoading: false, submitLoading: false, total: 0, dataList: [], currentRow: null,
       queryParams: { pageNum: 1, pageSize: 10, planCode: undefined, planStatus: 0 },
       planDialogOpen: false, planDialogTitle: '', planForm: {},
       whDialogOpen: false, whForm: { warehouseId: undefined, actualWarehouseId: undefined, warehouseName: '', actualWarehouseName: '', ioStartTime: undefined, ioEndTime: undefined }
@@ -113,18 +86,16 @@ export default {
     parseTime,
     getList() { var self = this; this.loading = true; listCountPlan(this.queryParams).then(function(r) { self.dataList = r.rows; self.total = r.total; }).finally(function() { self.loading = false; }); },
     handleQuery() { this.queryParams.pageNum = 1; this.getList(); },
-    handleRowClick(row) { this.currentRow = row; this.loadDetail(row.planId); },
-    loadDetail(planId) { var self = this; this.detailLoading = true; getCountPlan(planId).then(function(r) { self.currentRow = r.data; }).finally(function() { self.detailLoading = false; }); },
-    handleRefreshDetail() { if (this.currentRow) this.loadDetail(this.currentRow.planId); },
-    handleAdd() { this.planForm = {}; this.planDialogTitle = '新增盘库计划'; this.planDialogOpen = true; },
-    handleUpdate(row) { var self = this; getCountPlan(row.planId).then(function(r) { self.planForm = r.data; self.planDialogTitle = '修改'; self.planDialogOpen = true; }); },
-    submitPlan() { var self = this; this.btnLoading = true; var api = this.planForm.planId ? updateCountPlan : addCountPlan; api(this.planForm).then(function() { self.$modal.msgSuccess('成功'); self.planDialogOpen = false; self.getList(); }).finally(function() { self.btnLoading = false; }); },
+    handleRowClick(row) { this.currentRow = row; },
+    handleAdd() { this.planForm = { planName: new Date().toLocaleDateString().replace(/\//g, '-') + '盘库计划' }; this.planDialogTitle = '新增盘库计划'; this.planDialogOpen = true; },
+    handleUpdate(row) { this.planForm = Object.assign({}, row); this.planDialogTitle = '修改'; this.planDialogOpen = true; },
+    submitPlan() { var self = this; this.btnLoading = true; this.planForm.planCode = this.planForm.planName; var api = this.planForm.planId ? updateCountPlan : addCountPlan; api(this.planForm).then(function() { self.$modal.msgSuccess('成功'); self.planDialogOpen = false; self.getList(); }).finally(function() { self.btnLoading = false; }); },
     handleDelete(row) { var self = this; this.$modal.confirm('确认删除？').then(function() { return delCountPlan(row.planId); }).then(function() { self.$modal.msgSuccess('已删除'); self.currentRow = null; self.getList(); }).catch(function() {}); },
-    handleSubmitApproval() { var self = this; this.$modal.confirm('确认提交审批？').then(function() { self.submitLoading = true; return updateCountPlan({ planId: self.currentRow.planId, planStatus: 1 }); }).then(function() { self.$modal.msgSuccess('已提交'); self.loadDetail(self.currentRow.planId); self.getList(); }).finally(function() { self.submitLoading = false; }); },
+    handleSubmitApproval() { var self = this; this.$modal.confirm('确认提交审批？').then(function() { self.submitLoading = true; return updateCountPlan({ planId: self.currentRow.planId, planStatus: 1 }); }).then(function() { self.$modal.msgSuccess('已提交'); self.getList(); self.currentRow = null; }).finally(function() { self.submitLoading = false; }); },
     handleAddWarehouse() { this.whForm = { warehouseId: undefined, actualWarehouseId: undefined, warehouseName: '', actualWarehouseName: '', ioStartTime: undefined, ioEndTime: undefined }; this.whDialogOpen = true; },
     onWhChange(val) { if (val && this.$refs.wsRef) { var o = this.$refs.wsRef.warehouseOptions; var f = o.find(function(x) { return x.warehouseId === val; }); this.whForm.warehouseName = f ? f.warehouseName : ''; } else this.whForm.warehouseName = ''; },
     onAwhChange(val) { if (val && this.$refs.awsRef) { var o = this.$refs.awsRef.options; var f = o.find(function(x) { return x.actualWarehouseId === val; }); this.whForm.actualWarehouseName = f ? f.actualWarehouseName : ''; } else this.whForm.actualWarehouseName = ''; },
-    submitWh() { var self = this; if (!this.whForm.warehouseId && !this.whForm.actualWarehouseId) { this.$modal.msgWarning('请至少选择一个库区'); return; } this.whBtnLoading = true; addCountPlanWarehouse({ planId: this.currentRow.planId, warehouseId: this.whForm.warehouseId || undefined, actualWarehouseId: this.whForm.actualWarehouseId || undefined, warehouseName: this.whForm.warehouseName || undefined, actualWarehouseName: this.whForm.actualWarehouseName || undefined, ioStartTime: this.whForm.ioStartTime, ioEndTime: this.whForm.ioEndTime }).then(function() { self.$modal.msgSuccess('绑定成功'); self.whDialogOpen = false; self.$refs.whPanel.refreshAll(); }).finally(function() { self.whBtnLoading = false; }); }
+    submitWh() { var self = this; if (!this.whForm.warehouseId && !this.whForm.actualWarehouseId) { this.$modal.msgWarning('请至少选择一个库区'); return; } this.whBtnLoading = true; addCountPlanWarehouse({ planId: this.currentRow.planId, warehouseId: this.whForm.warehouseId || undefined, actualWarehouseId: this.whForm.actualWarehouseId || undefined, warehouseName: this.whForm.warehouseName || undefined, actualWarehouseName: this.whForm.actualWarehouseName || undefined, ioStartTime: this.whForm.ioStartTime, ioEndTime: this.whForm.ioEndTime }).then(function() { self.$modal.msgSuccess('绑定成功'); self.whDialogOpen = false; self.$refs.detailPanel.refresh(); }).finally(function() { self.whBtnLoading = false; }); }
   }
 };
 </script>