From 7d251e20fb432c95152b75e44a4be9a7bb747538 Mon Sep 17 00:00:00 2001
From: liding <756868258@qq.com>
Date: 星期一, 22 六月 2026 14:18:33 +0800
Subject: [PATCH] fix:生产排产页面修改

---
 src/views/productionManagement/workOrderEdit/index.vue |  318 ++++++++++++++++++++++++++++++++++------------------
 1 files changed, 207 insertions(+), 111 deletions(-)

diff --git a/src/views/productionManagement/workOrderEdit/index.vue b/src/views/productionManagement/workOrderEdit/index.vue
index 37cbb4e..5bca313 100644
--- a/src/views/productionManagement/workOrderEdit/index.vue
+++ b/src/views/productionManagement/workOrderEdit/index.vue
@@ -27,18 +27,145 @@
       </div>
     </div>
     <div class="table_list">
-      <PIMTable rowKey="id"
-                :column="tableColumn"
-                :tableData="tableData"
-                :page="page"
-                :tableLoading="tableLoading"
-                @pagination="pagination">
-        <template #completionStatus="{ row }">
-          <el-progress :percentage="toProgressPercentage(row?.completionStatus)"
-                       :color="progressColor(toProgressPercentage(row?.completionStatus))"
-                       :status="toProgressPercentage(row?.completionStatus) >= 100 ? 'success' : ''" />
-        </template>
-      </PIMTable>
+      <el-table :data="tableData"
+                border
+                v-loading="tableLoading"
+                :expand-row-keys="expandedRowKeys"
+                :row-key="(row) => row.productionOrderId"
+                @expand-change="expandChange"
+                height="calc(100vh - 22em)">
+        <!-- 灞曞紑琛屽垪 -->
+        <el-table-column type="expand"
+                         width="60"
+                         fixed="left">
+          <template #default="props">
+            <el-table :data="props.row.children || []"
+                      border
+                      v-loading="childLoading[props.row.productionOrderId]"
+                      style="margin: 10px 0;">
+              <el-table-column align="center"
+                               label="搴忓彿"
+                               type="index"
+                               width="60" />
+              <el-table-column label="宸ュ崟绫诲瀷"
+                               prop="workOrderType"
+                               width="80" />
+              <el-table-column label="宸ュ崟缂栧彿"
+                               prop="workOrderNo"
+                               width="140" />
+              <el-table-column label="闇�姹傛暟閲�"
+                               prop="planQuantity"
+                               width="140" />
+              <el-table-column label="瀹屾垚鏁伴噺"
+                               prop="completeQuantity"
+                               width="140" />
+              <el-table-column label="瀹屾垚杩涘害"
+                               width="140">
+                <template #default="scope">
+                  <el-progress :percentage="toProgressPercentage(scope.row?.completionStatus)"
+                               :color="progressColor(toProgressPercentage(scope.row?.completionStatus))"
+                               :status="toProgressPercentage(scope.row?.completionStatus) >= 100 ? 'success' : ''" />
+                </template>
+              </el-table-column>
+              <el-table-column label="璁″垝寮�濮嬫椂闂�"
+                               prop="planStartTime"
+                               width="140" />
+              <el-table-column label="璁″垝缁撴潫鏃堕棿"
+                               prop="planEndTime"
+                               width="140" />
+              <el-table-column label="瀹為檯寮�濮嬫椂闂�"
+                               prop="actualStartTime"
+                               width="140" />
+              <el-table-column label="瀹為檯缁撴潫鏃堕棿"
+                               prop="actualEndTime"
+                               width="140" />
+              <el-table-column label="鎸囧畾鎶ュ伐浜�"
+                               prop="userNames"
+                               width="180" />
+              <el-table-column label="鎿嶄綔"
+                               width="200"
+                               align="center"
+                               fixed="right">
+                <template #default="scope">
+                  <el-button link
+                             type="primary"
+                             @click="handleEdit(scope.row)">
+                    璁″垝鏃堕棿
+                  </el-button>
+                  <el-button link
+                             type="primary"
+                             @click="handleAssignReporter(scope.row)">
+                    鎸囧畾鎶ュ伐浜�
+                  </el-button>
+                </template>
+              </el-table-column>
+            </el-table>
+          </template>
+        </el-table-column>
+        <!-- 涓昏〃鍒� -->
+        <el-table-column align="center"
+                         label="搴忓彿"
+                         type="index"
+                         width="60" />
+        <el-table-column label="鐢熶骇璁㈠崟鍙�"
+                         prop="npsNo"
+                         min-width="140" />
+        <el-table-column label="浜у搧鍚嶇О"
+                         prop="productName"
+                         min-width="140" />
+        <el-table-column label="瑙勬牸"
+                         prop="model"
+                         min-width="100" />
+        <el-table-column label="鍗曚綅"
+                         prop="unit"
+                         min-width="60" />
+        <el-table-column label="宸ュ簭鍚嶇О"
+                         prop="operationName"
+                         min-width="100" />
+        <el-table-column label="宸ュ崟鏁伴噺"
+                         min-width="80">
+          <template #default="scope">
+            <span>鍏眥{ scope.row.productionTaskCount || 0 }}涓�</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="璁″垝鏁伴噺"
+                         prop="planQuantity"
+                         min-width="100" />
+        <el-table-column label="瀹屾垚鏁伴噺"
+                         prop="completeQuantity"
+                         min-width="100" />
+        <el-table-column label="瀹屾垚杩涘害"
+                         min-width="140">
+          <template #default="scope">
+            <el-progress :percentage="toProgressPercentage(scope.row?.completionStatus)"
+                         :color="progressColor(toProgressPercentage(scope.row?.completionStatus))"
+                         :status="toProgressPercentage(scope.row?.completionStatus) >= 100 ? 'success' : ''" />
+          </template>
+        </el-table-column>
+        <el-table-column label="鎶ュ簾鏁伴噺"
+                         prop="scrapQty"
+                         min-width="80">
+          <template #default="scope">
+            <span :class="{ 'scrap-text': scope.row.scrapQty > 0 }">
+              {{ scope.row.scrapQty || 0 }}
+            </span>
+          </template>
+        </el-table-column>
+        <el-table-column label="鐘舵��"
+                         min-width="100"
+                         align="center">
+          <template #default="scope">
+            <el-tag :type="getStatusTagType(scope.row.status)">
+              {{ getStatusText(scope.row.status) }}
+            </el-tag>
+          </template>
+        </el-table-column>
+      </el-table>
+      <PaginationComp v-show="page.total > 0"
+                  :total="page.total"
+                  :page="page.current"
+                  :limit="page.size"
+                  @pagination="pagination" />
     </div>
     <el-dialog v-model="editDialogVisible"
                title="缂栬緫璁″垝鏃堕棿"
@@ -137,114 +264,38 @@
   import { ElMessageBox } from "element-plus";
   import {
     productWorkOrderPage,
+    getWorkOrderListByOrderId,
     updateProductWorkOrder,
     assignProductWorkOrder,
   } from "@/api/productionManagement/workOrder.js";
   import { listUser } from "@/api/system/user.js";
+  import PaginationComp from "@/components/PIMTable/Pagination.vue";
 
   const { proxy } = getCurrentInstance();
 
-  const tableColumn = ref([
-    {
-      label: "宸ュ崟绫诲瀷",
-      prop: "workOrderType",
-      width: "80",
-    },
-    {
-      label: "宸ュ崟缂栧彿",
-      prop: "workOrderNo",
-      width: "140",
-    },
-    {
-      label: "鐢熶骇璁㈠崟鍙�",
-      prop: "npsNo",
-      width: "140",
-    },
-    {
-      label: "浜у搧鍚嶇О",
-      prop: "productName",
-      width: "140",
-    },
-    {
-      label: "瑙勬牸",
-      prop: "model",
-    },
-    {
-      label: "鍗曚綅",
-      prop: "unit",
-    },
-    {
-      label: "宸ュ簭鍚嶇О",
-      prop: "operationName",
-      width: "100",
-    },
-    {
-      label: "闇�姹傛暟閲�",
-      prop: "planQuantity",
-      width: "140",
-    },
-    {
-      label: "瀹屾垚鏁伴噺",
-      prop: "completeQuantity",
-      width: "140",
-    },
-    {
-      label: "瀹屾垚杩涘害",
-      prop: "completionStatus",
-      dataType: "slot",
-      slot: "completionStatus",
-      width: "140",
-    },
-    {
-      label: "璁″垝寮�濮嬫椂闂�",
-      prop: "planStartTime",
-      width: "140",
-    },
-    {
-      label: "璁″垝缁撴潫鏃堕棿",
-      prop: "planEndTime",
-      width: "140",
-    },
-    {
-      label: "瀹為檯寮�濮嬫椂闂�",
-      prop: "actualStartTime",
-      width: "140",
-    },
-    {
-      label: "瀹為檯缁撴潫鏃堕棿",
-      prop: "actualEndTime",
-      width: "140",
-    },
-    {
-      label: "鎸囧畾鎶ュ伐浜�",
-      prop: "userNames",
-      width: "180",
-    },
-    {
-      label: "鎿嶄綔",
-      width: "200",
-      align: "center",
-      dataType: "action",
-      fixed: "right",
-      operation: [
-        {
-          name: "璁″垝鏃堕棿",
-          clickFun: row => {
-            handleEdit(row);
-          },
-        },
-        {
-          name: "鎸囧畾鎶ュ伐浜�",
-          clickFun: row => {
-            handleAssignReporter(row);
-          },
-        },
-      ],
-    },
-  ]);
+  const statusMap = {
+    1: '寰呯‘璁�',
+    2: '寰呯敓浜�',
+    3: '鐢熶骇涓�',
+    4: '宸茬敓浜�',
+  };
+
+  const getStatusText = (status) => statusMap[status] || '鏈煡';
+
+  const getStatusTagType = (status) => {
+    switch (status) {
+      case 1: return 'info';
+      case 2: return 'warning';
+      case 3: return 'primary';
+      case 4: return 'success';
+      default: return 'info';
+    }
+  };
 
   const tableData = ref([]);
   const tableLoading = ref(false);
+  const expandedRowKeys = ref([]);
+  const childLoading = ref({});
   const editDialogVisible = ref(false);
   const editrow = ref(null);
   const page = reactive({
@@ -321,16 +372,52 @@
 
   const getList = () => {
     tableLoading.value = true;
+    expandedRowKeys.value = [];
     const params = { ...searchForm.value, ...page };
     productWorkOrderPage(params)
       .then(res => {
         tableLoading.value = false;
-        tableData.value = res.data.records;
+        tableData.value = res.data.records.map(item => ({
+          ...item,
+          children: [],
+        }));
         page.total = res.data.total;
       })
       .catch(() => {
         tableLoading.value = false;
       });
+  };
+
+  const expandChange = (row, expandedRows) => {
+    if (expandedRows.length > 0) {
+      expandedRowKeys.value = [];
+      const orderId = row.productionOrderId;
+
+      if (row.children && row.children.length > 0) {
+        expandedRowKeys.value.push(orderId);
+        return;
+      }
+
+      childLoading.value[orderId] = true;
+
+      getWorkOrderListByOrderId(orderId)
+        .then(res => {
+          childLoading.value[orderId] = false;
+          const index = tableData.value.findIndex(
+            item => item.productionOrderId === orderId
+          );
+          if (index > -1) {
+            tableData.value[index].children = res.data || [];
+          }
+          expandedRowKeys.value.push(orderId);
+        })
+        .catch(error => {
+          childLoading.value[orderId] = false;
+          console.error('鍔犺浇宸ュ崟鏄庣粏澶辫触:', error);
+        });
+    } else {
+      expandedRowKeys.value = [];
+    }
   };
 
   const handleEdit = row => {
@@ -443,6 +530,15 @@
     color: #606266;
   }
 
+  :deep(.el-table__expanded-cell) {
+    padding: 10px 30px !important;
+    background-color: #fafafa;
+  }
+
+  .scrap-text {
+    color: #f56c6c;
+  }
+
   .assign-reporter-content {
     .search-box {
       margin-bottom: 16px;

--
Gitblit v1.9.3