From c6d13e58d85fbaaceb49d4c24401b50143050173 Mon Sep 17 00:00:00 2001
From: zhang_12370 <z2864490065@outlook.com>
Date: 星期四, 26 六月 2025 18:01:24 +0800
Subject: [PATCH] 调整 基础管理煤种生产人 更改采购数计算逻辑 处理供应商数据回显问题

---
 src/views/production/index.vue |  239 ++++++++++++++++++++++++++++++-----------------------------
 1 files changed, 122 insertions(+), 117 deletions(-)

diff --git a/src/views/production/index.vue b/src/views/production/index.vue
index 531640a..fa77e22 100644
--- a/src/views/production/index.vue
+++ b/src/views/production/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="production-container">
+  <div class="app-container">
     <!-- 鎼滅储琛ㄥ崟 -->
     <el-form :inline="true" :model="queryParams" class="search-form">
       <el-form-item label="鎼滅储">
@@ -22,180 +22,177 @@
         <el-button type="success" :icon="Plus" @click="openDialog('add')">
           鏂板鍔犲伐
         </el-button>
-        <el-button type="danger" :icon="Delete" :disabled="!selectedRows.length">
+        <el-button
+          type="danger"
+          :icon="Delete"
+          :disabled="!selectedRows.length"
+          @click="() => deleteSelected(delPM)"
+        >
           鍒犻櫎
         </el-button>
       </div>
-
       <!-- 鏁版嵁琛ㄦ牸 -->
       <ETable
+        :showOverflowTooltip="false"
         :loading="loading"
         :table-data="tableData"
         :columns="columns"
+        :current-page="queryParams.current"
+        :page-size="queryParams.size"
         @selection-change="handleSelectionChange"
-        @edit="row => openDialog('edit', row)"
+        @edit="(row) => openDialog('edit', row)"
         :show-selection="true"
         :border="true"
-        :maxHeight="480"
+        @viewRow="(row) => (viewRow('viewRow', row))"
+        :operations="['edit', 'viewRow']"
+        :operationsWidth="200"
+        :show-overflow-tooltip="false"
+        style="width: 100%; height: calc(100vh - 26em)"
       >
-        <template #coal="{ row }">
+        <template #coalId="{ row }">
           <div class="coal-tags">
-            <el-tag v-for="coal in parseCoalArray(row.coal)" :key="coal" size="small">
-              {{ coal }}
-            </el-tag>
-            <span v-if="!row.coal">--</span>
+            <template v-if="row.coalId">
+              <el-tag
+                v-for="coal in parseCoalArray(row.coalId)"
+                :key="coal"
+                size="small"
+                type="primary"
+                class="coal-tag"
+              >
+                {{ getDisplayCoalName(coal) }}
+              </el-tag>
+            </template>
+            <span v-else class="no-data">--</span>
           </div>
         </template>
       </ETable>
-
       <!-- 鍒嗛〉缁勪欢 -->
       <Pagination
+        :layout="'total, prev, pager, next, jumper'"
         :total="total"
-        :page="queryParams.current"
+        v-model:page="queryParams.current"
         :limit="queryParams.size"
         @pagination="handlePageChange"
       />
     </el-card>
 
     <!-- 鐢熶骇瀵硅瘽妗� -->
+    <!-- handleProductionAndProcessing -->
     <ProductionDialog
       v-model:visible="dialogVisible"
       ref="dialogRef"
       :type="dialogType"
+      @update:productionAndProcessing="handleProductionAndProcessing"
       @success="handleDialogSuccess"
     />
   </div>
 </template>
 
 <script setup>
-import { ref, reactive, onMounted } from "vue";
-import { ElMessage, ElMessageBox } from "element-plus";
+import { onMounted, ref } from "vue";
+import { ElMessage } from "element-plus";
 import { Plus, Delete } from "@element-plus/icons-vue";
 import ProductionDialog from "./components/ProductionDialog.vue";
 import ETable from "@/components/Table/ETable.vue";
 import Pagination from "@/components/Pagination/index.vue";
-import { getProductionMasterList } from "@/api/production";
+import { getProductionMasterList, delPM } from "@/api/production";
+import { parseCoalArray } from "@/utils/production";
+import { useTableData } from "./components/useTableData.js";
+import { useDialog } from "./components/useDialog.js";
+import { useCoalData } from "./components/useCoalData.js";
+import { getCoalInfoList } from "@/api/production";
+
+// 鐓ょ淇℃伅鍒楄〃
+const coalInfoList = ref([]);
 
 // 琛ㄦ牸鍒楅厤缃�
 const columns = [
-  { prop: "coal", label: "鐓ょ", minWidth: 150, slot: 'coal' },
+  { prop: "coalId", label: "鐓ょ", minWidth: 150, slot: true },
   { prop: "productionQuantity", label: "鐢熶骇鏁伴噺", minWidth: 120 },
   { prop: "laborCost", label: "浜哄伐鎴愭湰", minWidth: 150 },
   { prop: "energyConsumptionCost", label: "鑳借�楁垚鏈�", minWidth: 120 },
   { prop: "equipmentDepreciation", label: "璁惧鎶樻棫", minWidth: 143 },
   { prop: "totalCost", label: "鎬绘垚鏈�", minWidth: 150 },
-  { prop: "producer", label: "鐢熶骇浜�", minWidth: 150 },
 ];
 
-// 鍝嶅簲寮忔暟鎹�
-const tableData = ref([]);
-const loading = ref(false);
-const total = ref(0);
-const selectedRows = ref([]);
-const dialogVisible = ref(false);
-const dialogType = ref("add");
-const dialogRef = ref(null);
+// 浣跨敤琛ㄦ牸鏁版嵁缁勫悎寮忓嚱鏁�
+const {
+  tableData,
+  loading,
+  total,
+  selectedRows,
+  queryParams,
+  getList,
+  handleSearch,
+  handleReset,
+  handlePageChange,
+  handleSelectionChange,
+  deleteSelected,
+} = useTableData(getProductionMasterList, { pageSize: 10 });
 
-// 鏌ヨ鍙傛暟
-const queryParams = reactive({
-  searchAll: "",
-  current: 1,
-  size: 10,
-});
+// 浣跨敤瀵硅瘽妗嗙粍鍚堝紡鍑芥暟
+const {
+  dialogVisible,
+  dialogType,
+  dialogRef,
+  openDialog,
+  viewRow,
+  handleDialogSuccess: onDialogSuccess,
+} = useDialog();
 
-// 鑾峰彇琛ㄦ牸鏁版嵁
-// 鑾峰彇琛ㄦ牸鏁版嵁
-const getList = async () => {
-  loading.value = true;
-  try {
-    // 鏋勫缓姝g‘鐨勫垎椤靛弬鏁�
-    const params = {
-      searchAll: queryParams.searchAll,
-      // 灏濊瘯澶氱甯歌鐨勫垎椤靛弬鏁版牸寮�
-      current: queryParams.current,
-      size: queryParams.size,
-      page: queryParams.current,
-      pageSize: queryParams.size,
-      pageNum: queryParams.current,
-      limit: queryParams.size,
-      offset: (queryParams.current - 1) * queryParams.size
-    };
-    
-    console.log('鍙戦�佸垎椤靛弬鏁�:', params);
-    console.log(`绗�${queryParams.current}椤靛簲璇ユ樉绀虹${(queryParams.current - 1) * queryParams.size + 1}-${queryParams.current * queryParams.size}鏉℃暟鎹甡);
-    
-    const res = await getProductionMasterList(params);
-    tableData.value = res.data.records || [];
-    total.value = res.data.total || 0;
-    
-    console.log('鎺ユ敹鍒扮殑鏁版嵁:', {
-      褰撳墠椤�: queryParams.current,
-      杩斿洖鏉℃暟: tableData.value.length,
-      鎬绘潯鏁�: total.value
-    });
-  } catch (error) {
-    ElMessage.error("鑾峰彇鏁版嵁澶辫触");
-    console.error('API閿欒:', error);
-  } finally {
-    loading.value = false;
+// 浣跨敤鐓ょ鏁版嵁缁勫悎寮忓嚱鏁�
+const { getCoalNameById, getCoalData } = useCoalData();
+
+// 鑾峰彇鐓ょ鏄剧ず鍚嶇О锛堝甫澶囩敤閫昏緫锛�
+const getDisplayCoalName = (coalId) => {
+  // 浼樺厛浣跨敤 useCoalData 鐨勬柟娉�
+  let name = getCoalNameById(coalId);
+
+  // 濡傛灉娌℃湁鎵惧埌锛屽皾璇曚粠 coalInfoList 涓煡鎵�
+  if (name === coalId && coalInfoList.value.length > 0) {
+    const found = coalInfoList.value.find((item) => item.id == coalId);
+    name = found ? found.coal : coalId;
   }
+
+  return name || coalId;
 };
 
-// 鎼滅储鍜岄噸缃�
-const handleSearch = () => {
-  queryParams.current = 1;
-  getList();
-};
-
-const handleReset = () => {
-  queryParams.searchAll = "";
-  handleSearch();
-};
-
-// 鍒嗛〉澶勭悊
-const handlePageChange = ({ page }) => {
-  queryParams.current = page;
-  getList();
-};
-
-// 琛ㄦ牸閫夋嫨澶勭悊
-const handleSelectionChange = (selection) => {
-  selectedRows.value = selection;
-};
-
-// 鎵撳紑瀵硅瘽妗� - 缁熶竴澶勭悊鏂板鍜岀紪杈�
-const openDialog = (type, row = null) => {
-  dialogType.value = type;
-  dialogVisible.value = true;
-  
-  if (type === 'add') {
-    dialogRef.value?.Initialization();
-  } else if (type === 'edit' && row) {
-    dialogRef.value?.editInitialization({ ...row });
+// 澶勭悊鐢熶骇鏁版嵁鏇存柊
+const handleProductionAndProcessing = (row, rows) => {
+  const index = tableData.value.findIndex((item) => item.id === rows.id);
+  if (index !== -1) {
+    tableData.value[index] = { ...tableData.value[index], ...row };
   }
 };
 
 // 瀵硅瘽妗嗘垚鍔熷洖璋�
 const handleDialogSuccess = () => {
-  getList();
-  ElMessage.success("鎿嶄綔鎴愬姛");
-};
-
-// 瑙f瀽鐓ょ鏁扮粍 - 绠�鍖栭�昏緫
-const parseCoalArray = (coalString) => {
-  if (!coalString) return [];
-  
-  if (Array.isArray(coalString)) return coalString;
-  
-  return String(coalString)
-    .replace(/^\[|\]$/g, '')
-    .split(',')
-    .map(item => item.trim())
-    .filter(Boolean);
+  onDialogSuccess(() => {
+    getList();
+    ElMessage.success("鎿嶄綔鎴愬姛");
+  });
 };
 
 // 缁勪欢鎸傝浇鏃跺姞杞芥暟鎹�
-onMounted(getList);
+onMounted(async () => {
+  try {
+    // 骞惰鍔犺浇鐓ょ鏁版嵁鍜岃〃鏍兼暟鎹�
+    await Promise.all([
+      getCoalData(), // 棰勫姞杞界叅绉嶆暟鎹�
+      (async () => {
+        const res = await getCoalInfoList();
+        if (res.code === 200) {
+          coalInfoList.value = res.data;
+        }
+      })(),
+    ]);
+
+    // 鍔犺浇琛ㄦ牸鏁版嵁
+    getList();
+  } catch (error) {
+    ElMessage.error("鏁版嵁鍔犺浇澶辫触锛岃鍒锋柊椤甸潰閲嶈瘯");
+  }
+});
 </script>
 
 <style scoped lang="scss">
@@ -216,9 +213,10 @@
     width: 20%;
   }
 }
+
 .search-form {
   display: flex;
-  justify-content: space-between;
+  justify-content: flex-start;
   align-items: center;
   margin-bottom: 20px;
 
@@ -230,18 +228,25 @@
     margin-left: 10px;
   }
 }
+
 .coal-tags {
   display: flex;
   flex-wrap: wrap;
   gap: 4px;
-  
-  .el-tag {
+  align-items: center;
+
+  .coal-tag {
     margin-right: 4px;
     margin-bottom: 4px;
-    
+
     &:last-child {
       margin-right: 0;
     }
   }
+
+  .no-data {
+    color: #999;
+    font-style: italic;
+  }
 }
 </style>

--
Gitblit v1.9.3