From d8fead89b61acd2b1462559c2fa634b05f73c5d1 Mon Sep 17 00:00:00 2001
From: 张诺 <zhang_12370@163.com>
Date: 星期一, 09 六月 2025 09:16:04 +0800
Subject: [PATCH] 提交修改新增加工 增加煤质方案和煤质字段模块

---
 src/views/basicInformation/index.vue                              |  155 ++-
 src/views/procureMent/index.vue                                   |    8 
 src/views/production/components/ProductionDetailsTable.vue        |  222 ++++++
 /dev/null                                                         |  283 --------
 src/views/basicInformation/mould/coalMeiZhiZiDuanWeiHu.vue        |  101 +++
 src/main.js                                                       |    1 
 src/views/procureMent/components/ProductionDialog.vue             |   38 
 package.json                                                      |    1 
 src/views/production/index.vue                                    |  372 +++++-----
 src/views/basicInformation/mould/coalQualityMaintenance.vue       |  154 +---
 src/views/production/components/ProductionDetailsTableExample.vue |   88 ++
 src/views/production/components/ProductionDialog.vue              |  528 +++++++++++----
 12 files changed, 1,169 insertions(+), 782 deletions(-)

diff --git a/package.json b/package.json
index 9655913..3548462 100644
--- a/package.json
+++ b/package.json
@@ -22,6 +22,7 @@
     "axios": "0.28.1",
     "clipboard": "2.0.11",
     "echarts": "5.5.1",
+    "default-passive-events": "^4.0.0",
     "element-china-area-data": "^6.1.0",
     "element-plus": "2.7.6",
     "file-saver": "2.0.5",
diff --git a/src/main.js b/src/main.js
index f059fe0..2110fac 100644
--- a/src/main.js
+++ b/src/main.js
@@ -6,6 +6,7 @@
 import 'element-plus/dist/index.css'
 import 'element-plus/theme-chalk/dark/css-vars.css'
 import locale from 'element-plus/es/locale/lang/zh-cn'
+import "default-passive-events";
 
 import '@/assets/styles/index.scss' // global css
 
diff --git a/src/views/basicInformation/index.vue b/src/views/basicInformation/index.vue
index ff27c0e..336ae2c 100644
--- a/src/views/basicInformation/index.vue
+++ b/src/views/basicInformation/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div>    <el-form :inline="true" :model="queryParams" class="search-form" >
+  <div> <el-form :inline="true" :model="queryParams" class="search-form">
       <el-form-item label="鎼滅储" v-if="tabName === 'supplier' || tabName === 'customer'">
         <el-input v-model="queryParams.searchAll" placeholder="渚涘簲鍟�/璇嗗埆鐮�/璇︾粏鍦板潃" clearable />
       </el-form-item>
@@ -16,7 +16,7 @@
       <el-tabs v-model="activeTab" class="info-tabs" @tab-click="handleTabClick">
         <el-tab-pane v-for="tab in tabs" :key="tab.name" :label="tab.label" :name="tab.name" />
       </el-tabs>
-  
+
       <!-- 鎿嶄綔鎸夐挳鍖� -->
       <el-row :gutter="24" class="table-toolbar">
         <el-button type="primary" :icon="Plus" @click="handleAdd">鏂板缓</el-button>
@@ -28,17 +28,21 @@
         <data-table :loading="loading" :table-data="tableData" :columns="columns"
           @selection-change="handleSelectionChange" @edit="handleEdit" :show-selection="true" :border="true" />
       </div>
-      <pagination v-if="total>0" :page="pageNum" :limit="pageSizes" :total="total" @pagination="handPagination"
+      <pagination v-if="total > 0" :page="pageNum" :limit="pageSizes" :total="total" @pagination="handPagination"
         :layout="'total, prev, pager, next, jumper'" />
-      <Supplier v-if="tabName === 'supplier'" v-model:copyForm="copyForm" v-model:supplierDialogFormVisible="dialogFormVisible" :form="form"
-        :title="title" @submit="handleSubmit" @beforeClose="handleBeforeClose"
-        @update:dialogFormVisible="handleDialogFormVisible" :addOrEdit="addOrEdit" />
-      <Customer v-if="tabName === 'customer'" v-model:copyForm="copyForm" v-model:customerDialogFormVisible="dialogFormVisible" :form="form"
-        :title="title" @submit="handleSubmit" :addOrEdit="addOrEdit" @beforeClose="handleBeforeClose" />
-      <Coal v-if="tabName === 'coal'" v-model:copyForm="copyForm" v-model:coalDialogFormVisible="dialogFormVisible" :form="form" :title="title"
-        :addOrEdit="addOrEdit" @submit="handleSubmit" />
+      <Supplier v-if="tabName === 'supplier'" v-model:copyForm="copyForm"
+        v-model:supplierDialogFormVisible="dialogFormVisible" :form="form" :title="title" @submit="handleSubmit"
+        @beforeClose="handleBeforeClose" @update:dialogFormVisible="handleDialogFormVisible" :addOrEdit="addOrEdit" />
+      <Customer v-if="tabName === 'customer'" v-model:copyForm="copyForm"
+        v-model:customerDialogFormVisible="dialogFormVisible" :form="form" :title="title" @submit="handleSubmit"
+        :addOrEdit="addOrEdit" @beforeClose="handleBeforeClose" />
+      <Coal v-if="tabName === 'coal'" v-model:copyForm="copyForm" v-model:coalDialogFormVisible="dialogFormVisible"
+        :form="form" :title="title" :addOrEdit="addOrEdit" @submit="handleSubmit" />
       <coalQualityMaintenance v-if="tabName === 'coalQualityMaintenance'"
         v-model:coalQualityMaintenanceDialogFormVisible="dialogFormVisible" :form="form" :title="title"
+        :addOrEdit="addOrEdit" @submit="handleSubmit" />
+      <coalMeiZhiZiDuanWeiHu v-if="tabName === 'coalMeiZhiZiDuanWeiHu'"
+        v-model:coalMaintenanceFieldDialogVisible="dialogFormVisible" :form="form" :title="title"
         :addOrEdit="addOrEdit" @submit="handleSubmit" />
     </el-card>
   </div>
@@ -54,6 +58,7 @@
 import Customer from "./mould/customer.vue";
 import Coal from "./mould/coal.vue";
 import coalQualityMaintenance from "./mould/coalQualityMaintenance.vue";
+import coalMeiZhiZiDuanWeiHu from "./mould/coalMeiZhiZiDuanWeiHu.vue";
 const { proxy } = getCurrentInstance()
 import { getSupply, addOrEditSupply, delSupply } from "@/api/basicInformation/supplier.js";
 import { getCoalInfo, delCoalInfo } from "@/api/basicInformation/coal.js";
@@ -63,6 +68,7 @@
 import { getCustomerList, delCustomer } from "@/api/basicInformation/customer.js";
 
 // 寮圭獥
+const coalMaintenanceFieldDialogVisible = ref(false);
 const coalQualityMaintenanceDialogFormVisible = ref(false);
 const customerDialogFormVisible = ref(false);
 const coalDialogFormVisible = ref(false);
@@ -120,19 +126,16 @@
 // 鍦板潃鏍煎紡鍖栧嚱鏁�
 const formatAddressArray = (addressIds) => {
   // 濡傛灉鍦板潃鏄犲皠琛ㄨ繕娌℃湁鍑嗗濂斤紝鏄剧ず --
-  if (!addressMap.value || Object.keys(addressMap.value).length === 0||!addressIds || !Array.isArray(addressIds) || addressIds.length === 0 || addressIds.every(id => !id)) {
+  if (!addressMap.value || Object.keys(addressMap.value).length === 0 || !addressIds || !Array.isArray(addressIds) || addressIds.length === 0 || addressIds.every(id => !id)) {
     return '--';
   }
-  
   const addressNames = addressIds.map(id => {
     return addressMap.value[id]?.name || '--';
   });
-  
   // 濡傛灉鎵�鏈夊湴鍧�鍚嶇О閮芥槸 '--'锛屽垯杩斿洖 '--'
   if (addressNames.every(name => name === '--')) {
     return '--';
   }
-  
   return addressNames.filter(name => name !== '--').join(' / ');
 };
 // 鑾峰彇鐢ㄦ埛鍒楄〃鏁版嵁
@@ -149,7 +152,6 @@
     console.error('鑾峰彇鐢ㄦ埛鍒楄〃澶辫触:', error);
   }
 };
-
 onMounted(async () => {
   await handleTabClick({ props: { name: "supplier" } });
   await fetchAreaOptions(); // 鍏堣幏鍙栧湴鍧�閫夋嫨鏁版嵁骞舵瀯寤烘槧灏勮〃
@@ -161,7 +163,8 @@
   { name: "supplier", label: "渚涘簲鍟嗕俊鎭�" },
   { name: "customer", label: "瀹㈡埛淇℃伅" },
   { name: "coal", label: "鐓ょ淇℃伅" },
-  { name: "coalQualityMaintenance", label: "鐓よ川缁存姢" },
+  { name: "coalQualityMaintenance", label: "鐓よ川鏂规" },
+  { name: "coalMeiZhiZiDuanWeiHu", label: "鐓よ川瀛楁" }
 ]);
 // 鏄惁缂栬緫
 const addOrEdit = ref("add");
@@ -170,9 +173,9 @@
 // supplier 渚涘簲鍟嗘暟鎹�
 const supplierColumns = ref([
   { prop: "supplierName", label: "渚涘簲鍟嗗悕绉�", minWidth: 100 },
-  { prop: "taxpayerId", label: "缁熶竴浜鸿瘑鍒彿", minWidth: 170 },  { 
-    prop: "bids", 
-    label: "缁忚惀鍦板潃", 
+  { prop: "taxpayerId", label: "缁熶竴浜鸿瘑鍒彿", minWidth: 170 }, {
+    prop: "bids",
+    label: "缁忚惀鍦板潃",
     minWidth: 150,
     showOverflowTooltip: true,
     formatter: (row, column, cellValue) => {
@@ -187,10 +190,10 @@
   { prop: "businessAddress", label: "缁忚惀璇︾粏鍦板潃", minWidth: 150 },
   { prop: "bankAccount", label: "寮�鎴疯", minWidth: 120 },
   { prop: "bankName", label: "閾惰璐﹀彿", minWidth: 150 },
-  { prop: "contactPerson", label: "鑱旂郴浜�", minWidth: 100 },  
-  { 
-    prop: "cids", 
-    label: "鑱旂郴浜哄湴鍧�", 
+  { prop: "contactPerson", label: "鑱旂郴浜�", minWidth: 100 },
+  {
+    prop: "cids",
+    label: "鑱旂郴浜哄湴鍧�",
     minWidth: 150,
     showOverflowTooltip: true,
     formatter: (row, column, cellValue) => {
@@ -201,7 +204,7 @@
       ]
       return formatAddressArray(arr);
     }
-  },{ prop: "contactAddress", label: "鑱旂郴浜鸿缁嗗湴鍧�", minWidth: 120 },
+  }, { prop: "contactAddress", label: "鑱旂郴浜鸿缁嗗湴鍧�", minWidth: 120 },
   // { 
   //   prop: "maintainerId", 
   //   label: "缁存姢浜�", 
@@ -229,9 +232,9 @@
 const customerColumns = ref([
   { prop: "customerName", label: "瀹㈡埛鍚嶇О", minWidth: 100 },
   { prop: "taxpayerId", label: "缁熶竴浜鸿瘑鍒彿", minWidth: 120 },
-{ 
-    prop: "bids", 
-    label: "缁忚惀鍦板潃", 
+  {
+    prop: "bids",
+    label: "缁忚惀鍦板潃",
     minWidth: 150,
     showOverflowTooltip: true,
     formatter: (row, column, cellValue) => {
@@ -245,12 +248,12 @@
   },
   { prop: "businessAddress", label: "璇︾粏鍦板潃", minWidth: 150 },
   { prop: "bankName", label: "寮�鎴疯", minWidth: 120 },
-  { prop: "bankAccount", label: "閾惰璐﹀彿", minWidth: 150 },  
+  { prop: "bankAccount", label: "閾惰璐﹀彿", minWidth: 150 },
   { prop: "contactPerson", label: "鑱旂郴浜�", minWidth: 100 },
   { prop: "contactPhone", label: "鑱旂郴浜虹數璇�", minWidth: 100 },
-{ 
-    prop: "cids", 
-    label: "鑱旂郴浜哄湴鍧�", 
+  {
+    prop: "cids",
+    label: "鑱旂郴浜哄湴鍧�",
     minWidth: 150,
     showOverflowTooltip: true,
     formatter: (row, column, cellValue) => {
@@ -267,9 +270,9 @@
 ]);
 // coal 鐓ょ鏁版嵁
 const coalColumns = ref([
-  { prop: "coal", label: "鐓ょ鍚嶇О", minWidth: 200 },  { 
-    prop: "maintainerId", 
-    label: "缁存姢浜�", 
+  { prop: "coal", label: "鐓ょ鍚嶇О", minWidth: 200 }, {
+    prop: "maintainerId",
+    label: "缁存姢浜�",
     minWidth: 120,
     formatter: (row, column, cellValue) => {
       // 濡傛灉鐢ㄦ埛鏄犲皠琛ㄨ繕娌℃湁鍑嗗濂斤紝鏄剧ず --
@@ -292,14 +295,18 @@
 ]);
 // coalQualityMaintenance 鐓よ川缁存姢鏁版嵁
 const coalQualityMaintenanceColumns = ref([
-  { prop: "supplierName", label: "鍏ㄦ按(<)", minWidth: 200 },
-  { prop: "identifyNumber", label: "姘村垎鏋�(<)", minWidth: 120 },
-  { prop: "address", label: "鐏板垎", minWidth: 150 },
-  { prop: "bank", label: "鎸ュ彂(>)", minWidth: 100 },
-  { prop: "bankAccount", label: "纭�(<)", minWidth: 100 },
-  { prop: "contacts", label: "鍥哄畾纰�", minWidth: 100 },
+  { prop: "coal", label: "鐓ょ鍚嶇О", minWidth: 200 },
+  { prop: "totalMoisture", label: "鍏ㄦ按鍚噺鐧惧垎姣� (%)", minWidth: 200 },
+  { prop: "analysisMoisture", label: "鍒嗘瀽姘村惈閲忕櫨鍒嗘瘮 (%)", minWidth: 200 },
+  { prop: "volatileMatter", label: "鎸ュ彂鍒嗙櫨鍒嗘瘮 (%)", minWidth: 100 },
+  { prop: "sulfurContent", label: "纭惈閲忕櫨鍒嗘瘮 (%)", minWidth: 100 },
+  { prop: "contacts", label: "鍥哄畾纰崇櫨鍒嗘瘮 (%)", minWidth: 100 },
   { prop: "contactAddress", label: "楂樹綅鍙戠儹閲�", minWidth: 100 },
   { prop: "maintainer", label: "浣庝綅鍙戠儹閲�", minWidth: 100 },
+]);
+const coalMeiZhiZiDuanWeiHuColumns = ref([
+  { prop: "fieldName", label: "瀛楁鍚嶇О", minWidth: 200 },
+  { prop: "fieldDescription", label: "瀛楁鎻忚堪", minWidth: 200 },
 ]);
 // 鏍囩椤电偣鍑�
 const handleTabClick = (tab) => {
@@ -318,7 +325,6 @@
       columns.value = customerColumns.value;
       dialogFormVisible.value = customerDialogFormVisible.value;
       getList("customer");
-
       break;
     case "coal":
       columns.value = coalColumns.value;
@@ -329,6 +335,11 @@
       columns.value = coalQualityMaintenanceColumns.value;
       dialogFormVisible.value = coalQualityMaintenanceDialogFormVisible.value;
       getList("coalQualityMaintenance");
+      break;
+    case "coalMeiZhiZiDuanWeiHu":
+      columns.value = coalMeiZhiZiDuanWeiHuColumns.value;
+      dialogFormVisible.value = coalMaintenanceFieldDialogVisible.value;
+      getList("coalMeiZhiZiDuanWeiHu");
       break;
   }
 };
@@ -363,7 +374,11 @@
     openDialog();
   } else if (tabName === "coalQualityMaintenance") {
     dialogFormVisible.value = true;
-    title.value = title.value + "鐓よ川缁存姢";
+    title.value = title.value + "鐓よ川鏂规缁存姢";
+    openDialog();
+  } else if (tabName === "coalMeiZhiZiDuanWeiHu") {
+    dialogFormVisible.value = true;
+    title.value = title.value + "鐓よ川瀛楁缁存姢";
     openDialog();
   }
 };
@@ -403,28 +418,28 @@
 // 缂栬緫
 const handleEdit = (row) => {
   form.value = JSON.parse(JSON.stringify(row));
-  if(form.value.bprovinceId && form.value.bdistrictId && form.value.bcityId  ){
+  if (form.value.bprovinceId && form.value.bdistrictId && form.value.bcityId) {
     form.value.bids = [
-    row.bprovinceId,
-    row.bcityId,
-    row.bdistrictId,
-  ];
+      row.bprovinceId,
+      row.bcityId,
+      row.bdistrictId,
+    ];
   }
-   if(form.value.cprovinceId && form.value.cdistrictId && form.value.ccityId  ){
+  if (form.value.cprovinceId && form.value.cdistrictId && form.value.ccityId) {
     form.value.cids = [
-    row.cprovinceId,
-    row.ccityId,
-    row.cdistrictId,
-  ];
+      row.cprovinceId,
+      row.ccityId,
+      row.cdistrictId,
+    ];
   }
-  if(form.value.businessCityId && form.value.businessDistrictId && form.value.businessProvinceId) {
+  if (form.value.businessCityId && form.value.businessDistrictId && form.value.businessProvinceId) {
     form.value.bids = [
       row.businessProvinceId,
       row.businessCityId,
       row.businessDistrictId,
     ];
   }
-  if(form.value.cityId && form.value.districtId && form.value.provinceId) {
+  if (form.value.cityId && form.value.districtId && form.value.provinceId) {
     form.value.cids = [
       row.provinceId,
       row.cityId,
@@ -452,21 +467,21 @@
     .then(async () => {
       try {
         let res;
-        if( tabName.value === "supplier" ) {
+        if (tabName.value === "supplier") {
           res = await delSupply(arr);
         } else if (tabName.value === "coal") {
           res = await delCoalInfo(arr);
         } else if (tabName.value === "coalQualityMaintenance") {
           res = await delCoalQuality(arr);
-        } else if( tabName.value === "customer") {
+        } else if (tabName.value === "customer") {
           res = await delCustomer(arr);
         }
-        if(res.code !== 200 && res.meg == "鎿嶄綔鎴愬姛") {
+        if (res.code !== 200 && res.meg == "鎿嶄綔鎴愬姛") {
           ElMessage.error("鍒犻櫎澶辫触锛�" + res.msg);
           return;
         }
         ElMessage.success("鍒犻櫎鎴愬姛");
-        await getList(); 
+        await getList();
       } catch (e) {
         console.error(e);
         ElMessage.error("鍒犻櫎澶辫触锛岃绋嶅悗鍐嶈瘯");
@@ -483,7 +498,7 @@
   form.value = {};
 };
 const handleExport = () => {
-  if(tabName.value === "supplier") {
+  if (tabName.value === "supplier") {
     Export("/supply/export", "渚涘簲鍟嗕俊鎭�");
   } else if (tabName.value === "customer") {
     Export("/customer/export", "瀹㈡埛淇℃伅");
@@ -494,7 +509,7 @@
 
   }
 }
-const Export = (api,name) => {
+const Export = (api, name) => {
   proxy.download(api, {
     ...queryParams.value
   }, `${name}${new Date().getTime()}.xlsx`)
@@ -526,6 +541,23 @@
       pageSize: pageSizes.value,
       searchAll: queryParams.searchAll,
     });
+  } else if (tabName.value === "coalMeiZhiZiDuanWeiHu") {
+    return {
+      code: 200,
+          data: {
+          records: [
+            { fieldName: "瀛楁1", fieldDescription: "鎻忚堪1" },
+            { fieldName: "瀛楁2", fieldDescription: "鎻忚堪2" },
+            { fieldName: "瀛楁3", fieldDescription: "鎻忚堪3" }
+          ],
+            total: 10
+        }
+    };
+    // return getCoalQuality({
+    //   current: pageNum.value,
+    //   pageSize: pageSizes.value,
+    //   searchAll: queryParams.searchAll,
+    // });
   }
 }
 const search = () => {
@@ -539,7 +571,8 @@
     await fetchAreaOptions();
   } */
   let { data, code } = await selectInterface()
-  if(code !== 200) {
+  console.log("鑾峰彇鏁版嵁锛�", code, data);
+  if (code !== 200) {
     ElMessage.error("鑾峰彇鏁版嵁澶辫触锛�" + data.msg);
     loading.value = false;
     return;
diff --git a/src/views/basicInformation/mould/coalMeiZhiZiDuanWeiHu.vue b/src/views/basicInformation/mould/coalMeiZhiZiDuanWeiHu.vue
new file mode 100644
index 0000000..22d4448
--- /dev/null
+++ b/src/views/basicInformation/mould/coalMeiZhiZiDuanWeiHu.vue
@@ -0,0 +1,101 @@
+<template>
+  <div>
+    <el-dialog
+      v-model="dialogVisible"
+      :title="title"
+      width="600"
+      :close-on-click-modal="false"
+      :before-close="handleClose"
+    >
+      <el-form
+        ref="formRef"
+        style="max-width: 400px; margin: 0 auto"
+        :model="formData"
+        :rules="rules"
+        label-width="auto"
+      >
+        <el-form-item label="瀛楁鍚嶇О" prop="fieldName">
+          <el-input
+            v-model="formData.fieldName"
+            placeholder="璇疯緭鍏ュ瓧娈靛悕绉�"
+          />
+        </el-form-item>
+        <el-form-item label="Activity form" props="dielDescription">
+      <el-input v-model="formData.fieldDescription" type="textarea" placeholder="璇疯緭鍏ュ瓧娈垫弿杩�" />
+    </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="submitForm"> 纭畾 </el-button>
+          <el-button v-if="addOrEdit === 'edit'" @click="resetForm"
+            >閲嶇疆</el-button
+          >
+          <el-button v-if="addOrEdit === 'add'" @click="cancelForm"
+            >鍙栨秷</el-button
+          >
+        </el-form-item>
+      </el-form>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import { ref, watch, defineProps, onMounted } from "vue";
+import addressList from "@/api/jsonApi/areaList.json";
+const props = defineProps({
+  beforeClose: {
+    type: Function,
+    default: () => {},
+  },
+  form: {
+    type: Object,
+    default: () => ({}),
+  },
+  addOrEdit: {
+    type: String,
+    default: "add",
+  },
+  title: {
+    type: String,
+    default: "",
+  },
+});
+
+const emit = defineEmits(["submit", "handleBeforeClose"]);
+// 琛ㄥ崟鏁版嵁
+const formData = ref({ ...props.form });
+// 寮圭獥鍙鎬�
+const dialogVisible = defineModel("coalMaintenanceFieldDialogVisible", {
+  required: true,
+  type: Boolean,
+});
+// 鎻愪氦琛ㄥ崟
+const submitForm = async () => {
+  if (!formRef.value) return;
+  await formRef.value.validate(async (valid, fields) => {
+    if (valid) {
+    }
+  });
+};
+// 鍙栨秷琛ㄥ崟
+const cancelForm = () => {
+  emit("update:coalMaintenanceFieldDialogVisible", false);
+  formData.value = {};
+};
+// 閲嶇疆琛ㄥ崟
+const resetForm = () => {
+
+  
+};
+// 鍏抽棴寮圭獥
+const handleClose = () => {
+  // 瑙﹀彂鐖剁粍浠剁殑鍏抽棴鍑芥暟
+  emit("handleBeforeClose");
+  emit("update:coalMaintenanceFieldDialogVisible", false);
+};
+const rules = reactive({
+  coal: [
+    { required: true, message: "璇疯緭鍏ョ叅绉嶅悕绉�", trigger: "blur" },
+  ],
+});
+</script>
+<style lang="sass" scoped>
+</style>
\ No newline at end of file
diff --git a/src/views/basicInformation/mould/coalQualityMaintenance.vue b/src/views/basicInformation/mould/coalQualityMaintenance.vue
index 0b87d1d..d1bb443 100644
--- a/src/views/basicInformation/mould/coalQualityMaintenance.vue
+++ b/src/views/basicInformation/mould/coalQualityMaintenance.vue
@@ -1,75 +1,31 @@
 <template>
   <div>
-    <el-dialog
-      v-model="dialogVisible"
-      :title="title"
-      width="600"
-      :close-on-click-modal="false"
-      :before-close="handleClose"
-    >
-      <el-form
-        ref="formRef"
-        style="max-width: 400px; margin: 0 auto"
-        :model="formData"
-        :rules="rules"
-        label-width="auto"
-      >
-        <el-form-item label="鐓ょ绫诲瀷" prop="coal">
-          <el-input
-            v-model="formData.coal"
-            placeholder="璇疯緭鍏ヤ緵璐у晢鍚嶇О"
-          />
+    <el-dialog v-model="dialogVisible" :title="title" width="600" :close-on-click-modal="false"
+      :before-close="handleClose">
+      <el-form ref="formRef" style="max-width: 400px; margin: 0 auto" :model="formData" :rules="rules"
+        label-width="auto">
+        <el-form-item label="鏂规鍚嶇О" prop="schemeName">
+          <el-input v-model="formData.schemeName" placeholder="璇疯緭鍏ユ柟妗堝悕绉�"  prop="schemeName" />
         </el-form-item>
-        <el-form-item label="鍏ㄦ按鍚噺鐧惧垎姣� (%)" prop="totalMoisture">
-          <el-input
-            v-model="formData.totalMoisture"
-            placeholder="璇疯緭鍏ュ叏姘村惈閲忕櫨鍒嗘瘮"
-          />
+        <el-form-item label="鏂规绫诲瀷" props="fieldName">
+          <el-select v-model="formData.fieldName" placeholder="Select" style="width: 240px" clearable multiple>
+            <template #label="{ label }">
+              <span>{{ label }}: </span>
+              <span style="font-weight: bold">{{ value }}</span>
+            </template>
+            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
+          </el-select>
         </el-form-item>
-        <el-form-item label="鍏ㄦ按鍚噺鐧惧垎姣� (%)" prop="analysisMoisture">
-          <el-input
-            v-model="formData.analysisMoisture"
-            placeholder="璇疯緭鍏ュ叏姘村惈閲忕櫨鍒嗘瘮"
-          />
-        </el-form-item>
-        <el-form-item label="鍏ㄦ按鍚噺鐧惧垎姣� (%)" prop="volatileMatter">
-          <el-input
-            v-model="formData.volatileMatter"
-            placeholder="璇疯緭鍏ュ叏姘村惈閲忕櫨鍒嗘瘮"
-          />
-        </el-form-item>
-        <el-form-item label="鍥哄畾纰崇櫨鍒嗘瘮 (%)" prop="fixedCarbon">
-          <el-input
-            v-model="formData.fixedCarbon"
-            placeholder="璇疯緭鍏ュ鎴疯缁嗗湴鍧�"
-          />
-        </el-form-item>
-        <el-form-item label="浣庝綅鍙戠儹閲忥紙鍗曚綅锛氬崈鍗�/鍗冨厠锛�" prop="lowerHeatValue">
-          <el-input
-            v-model="formData.lowerHeatValue"
-            placeholder="璇疯緭鍏ラ摱琛岃处鎴�"
-          />
-        </el-form-item>
-        <el-form-item label="楂樹綅鍙戠儹閲忥紙鍗曚綅锛氬崈鍗�/鍗冨厠锛�" prop="higherHeatValue">
-          <el-input v-model="formData.higherHeatValue" placeholder="璇疯緭鍏ュ紑鎴疯" />
-        </el-form-item>
-        <el-form-item label="鐏板垎鐧惧垎姣� (%)" prop="ashContent">
-          <el-input v-model="formData.ashContent" placeholder="璇疯緭鍏ヨ仈绯讳汉" />
-        </el-form-item>
-        <el-form-item label="纭惈閲忕櫨鍒嗘瘮 (%)" prop="sulfurContent">
-          <el-input
-            v-model="formData.sulfurContent"
-            placeholder="璇疯緭鍏ヨ仈绯讳汉鐢佃瘽"
-          />
-        </el-form-item>
+        <template #footer>
+          <el-form-item label="瀛楁鎻忚堪" prop="fieldDescription">
+            <el-input v-model="formData.fieldDescription" type="textarea" placeholder="璇疯緭鍏ュ瓧娈垫弿杩�" />
+          </el-form-item>
+
+        </template>
         <el-form-item>
           <el-button type="primary" @click="submitForm"> 纭畾 </el-button>
-          <el-button v-if="addOrEdit === 'edit'" @click="resetForm"
-            >閲嶇疆</el-button
-          >
-          <el-button v-if="addOrEdit === 'add'" @click="cancelForm"
-            >鍙栨秷</el-button
-          >
+          <el-button v-if="addOrEdit === 'edit'" @click="resetForm">閲嶇疆</el-button>
+          <el-button v-if="addOrEdit === 'add'" @click="cancelForm">鍙栨秷</el-button>
         </el-form-item>
       </el-form>
     </el-dialog>
@@ -79,11 +35,10 @@
 <script setup>
 import { ref, watch, defineProps, onMounted } from "vue";
 import addressList from "@/api/jsonApi/areaList.json";
-import { addOrEditCoalQuality } from "@/api/basicInformation/coalQualityMaintenance.js";
 const props = defineProps({
   beforeClose: {
     type: Function,
-    default: () => {},
+    default: () => { },
   },
   form: {
     type: Object,
@@ -98,24 +53,30 @@
     default: "",
   },
 });
-
+const options = [
+  {
+    value: 'Option1',
+    label: 'Label1',
+  },
+  {
+    value: 'Option2',
+    label: 'Label2',
+  },
+  {
+    value: 'Option3',
+    label: 'Label3',
+  },
+  {
+    value: 'Option4',
+    label: 'Label4',
+  },
+  {
+    value: 'Option5',
+    label: 'Label5',
+  },
+]
 const emit = defineEmits(["submit", "handleBeforeClose"]);
 
-onMounted(()=>{
-  addressSelectOptions.value = mapAddress(addressList);
-})
-// 鍦板潃閫夋嫨鏁版嵁
-const addressSelectOptions = ref([]);
-// 澶勭悊鍦板潃鏁版嵁杞崲
-function mapAddress(list) {
-  return list.map(item => ({
-    value: item.no,
-    label: item.name,
-    children: item.children ? mapAddress(item.children) : undefined
-  }));
-}
-// 琛ㄥ崟寮曠敤
-const formRef = ref(null);
 // 琛ㄥ崟鏁版嵁
 const formData = ref({ ...props.form });
 // 寮圭獥鍙鎬�
@@ -123,34 +84,13 @@
   required: true,
   type: Boolean,
 });
-// 鐩戝惉澶栭儴浼犲叆鐨勮〃鍗曟暟鎹彉鍖�
-watch(
-  () => props.form,
-  (newVal) => {
-    formData.value = { ...newVal };
-  },
-  { deep: true }
-);
-
-// 鐩戝惉鍐呴儴寮圭獥鐘舵�佸彉鍖�
-watch(
-  () => dialogVisible.value,
-  (newVal) => {
-    emit("update:coalQualityMaintenanceDialogFormVisible", newVal);
-  }
-);
-// 澶勭悊鍦板潃閫夋嫨鍙樺寲
-const handleChange = (value) => {
-  console.log(value);
-};
 // 鎻愪氦琛ㄥ崟
 const submitForm = async () => {
   if (!formRef.value) return;
   await formRef.value.validate(async (valid, fields) => {
     if (valid) {
-
-      let result = await addOrEditCoalQuality({...formData.value});
-      console.log(result);
+      // let result = await addOrEditCoalQuality({...formData.value});
+      // console.log(result);
       // emit("submit", formData.value);
     }
   });
diff --git a/src/views/procureMent/components/ProductionDialog.vue b/src/views/procureMent/components/ProductionDialog.vue
index 3e6d937..3216d1f 100644
--- a/src/views/procureMent/components/ProductionDialog.vue
+++ b/src/views/procureMent/components/ProductionDialog.vue
@@ -20,44 +20,61 @@
           <el-input v-model="form.supplierName" placeholder="璇疯緭鍏�" />
         </el-form-item>
         <el-form-item label="鐓ょ" prop="coal">
-          <el-input v-model="form.coal" placeholder="璇疯緭鍏�" />
-        </el-form-item>
+            <el-select v-model="form.coal" placeholder="璇烽�夋嫨鐓ょ" clearable style="width: 100%">
+              <el-option label="鐦︾叅" value="鐦︾叅" />
+              <el-option label="姘旂叅" value="姘旂叅" />
+              <el-option label="鏃犵儫鐓�" value="鏃犵儫鐓�" />
+              <el-option label="闀跨劙鐓�" value="闀跨劙鐓�" />
+              <el-option label="璐叅" value="璐叅" />
+            </el-select>
+          </el-form-item>
         <el-form-item label="鍗曚綅" prop="unit">
-          <el-input v-model="form.unit" placeholder="璇疯緭鍏�" />
+          <el-select v-model="form.unit" placeholder="璇烽�夋嫨鍗曚綅" clearable style="width: 100%">
+              <el-option label="鍚�" value="鍚�" />
+              <el-option label="鍗冨厠" value="鍗冨厠" />
+            </el-select>
         </el-form-item>
         <el-form-item label="閲囪喘鏁伴噺" prop="purchaseQuantity">
-          <el-input v-model="form.purchaseQuantity" placeholder="璇疯緭鍏�"  />
+          <el-input v-model.number="form.purchaseQuantity" placeholder="璇疯緭鍏�"  >
+            <template v-slot:suffix>
+            <i style="font-style:normal;">{{form.unit?form.unit:''}}</i>
+          </template>
+          </el-input>
         </el-form-item>
         <el-form-item label="鍗曚环(涓嶅惈绋�)" prop="priceExcludingTax">
-          <el-input v-model="form.priceExcludingTax" placeholder="璇疯緭鍏�" >
+          <el-input v-model.number="form.priceExcludingTax" placeholder="璇疯緭鍏�" >
             <template v-slot:suffix>
             <i style="font-style:normal;">鍏�</i>
           </template>
           </el-input>
         </el-form-item>
         <el-form-item label="鎬讳环(涓嶅惈绋�)" prop="totalPriceExcludingTax">
-          <el-input v-model="form.totalPriceExcludingTax" placeholder="璇疯緭鍏�" >
+          <el-input v-model.number="form.totalPriceExcludingTax" placeholder="璇疯緭鍏�" >
             <template v-slot:suffix>
             <i style="font-style:normal;">鍏�</i>
           </template>
           </el-input>
         </el-form-item>
         <el-form-item label="鍗曚环(鍚◣)" prop="priceIncludingTax">
-          <el-input v-model="form.priceIncludingTax" placeholder="璇疯緭鍏�" >
+          <el-input v-model.number="form.priceIncludingTax" placeholder="璇疯緭鍏�" >
             <template v-slot:suffix>
             <i style="font-style:normal;">鍏�</i>
           </template>
           </el-input>
         </el-form-item>
         <el-form-item label="鎬讳环(鍚◣)" prop="totalPriceIncludingTax">
-          <el-input v-model="form.totalPriceIncludingTax" placeholder="璇疯緭鍏�" >
+          <el-input v-model.number="form.totalPriceIncludingTax" placeholder="璇疯緭鍏�" >
             <template v-slot:suffix>
             <i style="font-style:normal;">鍏�</i>
           </template>
           </el-input>
         </el-form-item>
         <el-form-item label="绋庣巼" prop="taxRate">
-          <el-input v-model="form.taxRate" placeholder="璇疯緭鍏�" />
+          <el-input v-model="form.taxRate" placeholder="璇疯緭鍏ョ◣鐜�" >
+            <template v-slot:suffix>
+            <i style="font-style:normal;">%</i>
+          </template>
+            </el-input>
         </el-form-item>
         <el-form-item label="鐧昏浜�" prop="registrantId">
           <el-input v-model="form.registrantId" disabled placeholder="璇疯緭鍏�" />
@@ -131,6 +148,7 @@
   unit: [{ required: true, message: "璇疯緭鍏ュ崟浣�", trigger: "blur" }],
   purchaseQuantity: [
     { required: true, message: "璇疯緭鍏ラ噰璐暟閲�", trigger: "blur" },
+    { type: "number", message: "閲囪喘鏁伴噺蹇呴』涓烘暟瀛�", trigger: "blur" },
   ],
   priceExcludingTax: [{ required: true, message: "璇疯緭鍏ュ崟浠�", trigger: "blur" }],
   totalPriceExcludingTax: [{ required: true, message: "璇疯緭鍏ユ�讳环", trigger: "blur" }],
@@ -154,7 +172,6 @@
   if (formRef.value) {
     formRef.value.clearValidate();
   }
-  console.log(form.value);
 };
 const formRef = ref(null);
 // 鎻愪氦琛ㄥ崟
@@ -162,7 +179,6 @@
   if (!formRef.value) return;
   await formRef.value.validate(async (valid) => {
     if (valid) {
-      console.log("琛ㄥ崟楠岃瘉閫氳繃", form.value);
       const obj = ref({});
       if (props.title.includes('鏂板')) {
         let result = await addOrEditPR({
diff --git a/src/views/procureMent/index.vue b/src/views/procureMent/index.vue
index 038b727..68d304d 100644
--- a/src/views/procureMent/index.vue
+++ b/src/views/procureMent/index.vue
@@ -23,7 +23,7 @@
       <el-row :gutter="24" class="table-toolbar">
         <el-button type="primary" :icon="Plus" @click="handleAdd">鏂板缓</el-button>
         <el-button type="danger" :icon="Delete" @click="handleDelete">鍒犻櫎</el-button>
-        <el-button type="info" :icon="Download" @click="handleExport">瀵煎嚭</el-button>
+        <!-- <el-button type="info" :icon="Download" @click="handleExport">瀵煎嚭</el-button> -->
       </el-row>
       <!-- 琛ㄦ牸缁勪欢 -->
       <data-table :loading="loading" :table-data="tableData" :columns="columns" @selection-change="handleSelectionChange"
@@ -76,9 +76,11 @@
   getList();
 };
 const userStore = useUserStore();
+// 鑾峰彇鐢ㄦ埛淇℃伅
+const userInfo = ref({});
 onMounted(async() => {
   let res = await userStore.getInfo()
-  form.value.registrantId = res.user.userName; // 璁剧疆鐧昏浜篒D
+  userInfo.value = res.user;
 });
 // 鍒嗛〉澶勭悊
 const handlePagination = (val) => {
@@ -141,7 +143,7 @@
     priceIncludingTax: "",
     totalPriceIncludingTax: "",
     taxRate: "",
-    registrantId: "",
+    registrantId: userInfo.value.userName,
     registrationDate: new Date().toISOString().split('T')[0]
   };
   // 鏂板缓鏃朵篃闇�瑕佽缃� copyForm 鐢ㄤ簬閲嶇疆鍔熻兘
diff --git a/src/views/production/components/ProductionDetailsTable.vue b/src/views/production/components/ProductionDetailsTable.vue
new file mode 100644
index 0000000..e8adfc4
--- /dev/null
+++ b/src/views/production/components/ProductionDetailsTable.vue
@@ -0,0 +1,222 @@
+<template>
+  <el-table :data="tableData" :border="border" style="width: 100%">
+    <el-table-column label="鐓ょ" min-width="120">
+      <template #default="{ row, $index }">
+        <el-input 
+          v-model="row.coalType" 
+          placeholder="璇疯緭鍏ョ叅绉�"
+          @input="handleInput('coalType', $index, $event)"
+        />
+      </template>
+    </el-table-column>
+    
+    <el-table-column label="鐑��" min-width="120">
+      <template #default="{ row, $index }">
+        <el-input 
+          v-model="row.calorificValue" 
+          placeholder="璇疯緭鍏ョ儹鍊�"
+          @input="handleInput('calorificValue', $index, $event)"
+        />
+      </template>
+    </el-table-column>
+    
+    <el-table-column label="鐢熶骇鏁伴噺" min-width="120">
+      <template #default="{ row, $index }">
+        <el-input 
+          v-model="row.productionQuantity" 
+          placeholder="璇疯緭鍏ョ敓浜ф暟閲�"
+          type="number"
+          @input="handleInput('productionQuantity', $index, $event)"
+        />
+      </template>
+    </el-table-column>
+    
+    <el-table-column label="浜哄伐鎴愭湰" min-width="120">
+      <template #default="{ row, $index }">
+        <el-input 
+          v-model="row.laborCost" 
+          placeholder="璇疯緭鍏ヤ汉宸ユ垚鏈�"
+          type="number"
+          @input="handleInput('laborCost', $index, $event)"
+        >
+          <template #suffix>
+            <i style="font-style:normal;">鍏�</i>
+          </template>
+        </el-input>
+      </template>
+    </el-table-column>
+    
+    <el-table-column label="鑳借�楁垚鏈�" min-width="120">
+      <template #default="{ row, $index }">
+        <el-input 
+          v-model="row.energyCost" 
+          placeholder="璇疯緭鍏ヨ兘鑰楁垚鏈�"
+          type="number"
+          @input="handleInput('energyCost', $index, $event)"
+        >
+          <template #suffix>
+            <i style="font-style:normal;">鍏�</i>
+          </template>
+        </el-input>
+      </template>
+    </el-table-column>
+    
+    <el-table-column label="璁惧鎶樻棫" min-width="120">
+      <template #default="{ row, $index }">
+        <el-input 
+          v-model="row.equipmentDepreciation" 
+          placeholder="璇疯緭鍏ヨ澶囨姌鏃�"
+          type="number"
+          @input="handleInput('equipmentDepreciation', $index, $event)"
+        >
+          <template #suffix>
+            <i style="font-style:normal;">鍏�</i>
+          </template>
+        </el-input>
+      </template>
+    </el-table-column>
+    
+    <el-table-column label="閲囪喘鍗曚环" min-width="120">
+      <template #default="{ row, $index }">
+        <el-input 
+          v-model="row.purchasePrice" 
+          placeholder="璇疯緭鍏ラ噰璐崟浠�"
+          type="number"
+          @input="handleInput('purchasePrice', $index, $event)"
+        >
+          <template #suffix>
+            <i style="font-style:normal;">鍏�</i>
+          </template>
+        </el-input>
+      </template>
+    </el-table-column>
+    
+    <el-table-column label="鎬绘垚鏈�" min-width="120">
+      <template #default="{ row, $index }">
+        <el-input 
+          v-model="row.totalCost" 
+          placeholder="鎬绘垚鏈�"
+          type="number"
+          :readonly="autoCalculate"
+          @input="handleInput('totalCost', $index, $event)"
+        >
+          <template #suffix>
+            <i style="font-style:normal;">鍏�</i>
+          </template>
+        </el-input>
+      </template>
+    </el-table-column>
+      <el-table-column v-if="showOperations" label="鎿嶄綔" width="120" fixed="right">
+      <template #default="{ $index }">
+        <el-button 
+          type="danger" 
+          size="small" 
+          @click="handleDelete($index)"
+          :icon="Delete"
+        >
+          鍒犻櫎
+        </el-button>
+      </template>
+    </el-table-column>
+  </el-table>
+</template>
+
+<script setup name="ProductionDetailsTable">
+import { ref, computed, watch } from 'vue'
+import { Delete } from '@element-plus/icons-vue'
+
+const props = defineProps({
+  modelValue: {
+    type: Array,
+    default: () => []
+  },
+  border: {
+    type: Boolean,
+    default: false
+  },
+  showOperations: {
+    type: Boolean,
+    default: true
+  },
+  autoCalculate: {
+    type: Boolean,
+    default: true
+  }
+})
+
+const emit = defineEmits(['update:modelValue', 'input-change', 'delete-row'])
+
+// 浣跨敤 v-model 杩涜鍙屽悜缁戝畾
+const tableData = computed({
+  get() {
+    return props.modelValue
+  },
+  set(value) {
+    emit('update:modelValue', value)
+  }
+})
+
+// 澶勭悊杈撳叆鍙樺寲
+const handleInput = (field, index, value) => {
+  const newData = [...tableData.value]
+  newData[index][field] = value
+  
+  // 濡傛灉寮�鍚嚜鍔ㄨ绠楁�绘垚鏈�
+  if (props.autoCalculate && ['laborCost', 'energyCost', 'equipmentDepreciation', 'purchasePrice'].includes(field)) {
+    calculateTotalCost(newData[index])
+  }
+  
+  tableData.value = newData
+  emit('input-change', { field, index, value, row: newData[index] })
+}
+
+// 璁＄畻鎬绘垚鏈�
+const calculateTotalCost = (row) => {
+  const laborCost = parseFloat(row.laborCost) || 0
+  const energyCost = parseFloat(row.energyCost) || 0
+  const equipmentDepreciation = parseFloat(row.equipmentDepreciation) || 0
+  const purchasePrice = parseFloat(row.purchasePrice) || 0
+  
+  row.totalCost = (laborCost + energyCost + equipmentDepreciation + purchasePrice).toFixed(2)
+}
+
+// 鍒犻櫎琛�
+const handleDelete = (index) => {
+  const newData = [...tableData.value]
+  newData.splice(index, 1)
+  tableData.value = newData
+  emit('delete-row', index)
+}
+
+// 鏆撮湶鏂规硶缁欑埗缁勪欢浣跨敤
+defineExpose({
+  calculateTotalCost,
+  addRow: (rowData = {}) => {
+    const defaultRow = {
+      coalType: '',
+      calorificValue: '',
+      productionQuantity: '',
+      laborCost: '',
+      energyCost: '',
+      equipmentDepreciation: '',
+      purchasePrice: '',
+      totalCost: '',
+      ...rowData
+    }
+    tableData.value = [...tableData.value, defaultRow]
+  },
+  clearData: () => {
+    tableData.value = []
+  }
+})
+</script>
+
+<style scoped>
+:deep(.el-input__inner) {
+  text-align: center;
+}
+
+:deep(.el-table .el-table__cell) {
+  padding: 8px 0;
+}
+</style>
diff --git a/src/views/production/components/ProductionDetailsTableExample.vue b/src/views/production/components/ProductionDetailsTableExample.vue
new file mode 100644
index 0000000..d5d72a7
--- /dev/null
+++ b/src/views/production/components/ProductionDetailsTableExample.vue
@@ -0,0 +1,88 @@
+<!-- 浣跨敤绀轰緥 -->
+<template>
+  <div>
+    <!-- 鍩烘湰浣跨敤 -->
+    <ProductionDetailsTable v-model="tableData" />
+    
+    <!-- 鑷畾涔夐厤缃� -->
+    <ProductionDetailsTable 
+      v-model="tableData" 
+      :border="true"
+      :show-operations="false"
+      :auto-calculate="false"
+      @input-change="handleChange"
+      @delete-row="handleDelete"
+    />
+    
+    <!-- 鎿嶄綔鎸夐挳 -->
+    <el-row :gutter="10" style="margin-top: 20px;">
+      <el-col :span="4">
+        <el-button type="primary" @click="addRow">鏂板琛�</el-button>
+      </el-col>
+      <el-col :span="4">
+        <el-button type="danger" @click="clearData">娓呯┖鏁版嵁</el-button>
+      </el-col>
+      <el-col :span="4">
+        <el-button type="success" @click="submitData">鎻愪氦鏁版嵁</el-button>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import ProductionDetailsTable from './ProductionDetailsTable.vue'
+
+// 琛ㄦ牸鏁版嵁
+const tableData = ref([
+  {
+    coalType: '鍔ㄥ姏鐓�',
+    calorificValue: '5000',
+    productionQuantity: '100',
+    laborCost: '1000',
+    energyCost: '800',
+    equipmentDepreciation: '500',
+    purchasePrice: '2000',
+    totalCost: '4300'
+  }
+])
+
+// 鑾峰彇缁勪欢瀹炰緥寮曠敤
+const tableRef = ref(null)
+
+// 浜嬩欢澶勭悊
+const handleChange = (data) => {
+  console.log('鏁版嵁鍙樺寲:', data)
+}
+
+const handleDelete = (index) => {
+  console.log('鍒犻櫎琛�:', index)
+}
+
+// 鎿嶄綔鏂规硶
+const addRow = () => {
+  if (tableRef.value) {
+    tableRef.value.addRow({
+      coalType: '鏂扮叅绉�',
+      calorificValue: '0',
+      productionQuantity: '0',
+      laborCost: '0',
+      energyCost: '0',
+      equipmentDepreciation: '0',
+      purchasePrice: '0',
+      totalCost: '0'
+    })
+  }
+}
+
+const clearData = () => {
+  if (tableRef.value) {
+    tableRef.value.clearData()
+  }
+}
+
+const submitData = () => {
+  console.log('鎻愪氦鐨勬暟鎹�:', tableData.value)
+  // 杩欓噷鍙互璋冪敤API鎻愪氦鏁版嵁
+}
+</script>
diff --git a/src/views/production/components/ProductionDialog.vue b/src/views/production/components/ProductionDialog.vue
index dedb7b3..7ce8482 100644
--- a/src/views/production/components/ProductionDialog.vue
+++ b/src/views/production/components/ProductionDialog.vue
@@ -1,107 +1,162 @@
 <template>
-  <el-dialog v-model="dialogVisible" :title="dialogType === 'add' ? '鏂板鐢熶骇鍔犲伐' : '缂栬緫鐢熶骇鍔犲伐'" width="1200px"
-    :close-on-click-modal="false" @close="handleClose">
-    <el-form ref="formRef" :model="formData" :rules="rules" class="production-form">
-      <el-row :gutter="24">
-        <el-col :span="6">
-          <el-form-item label="鐓ょ" prop="category">
-            <el-select v-model="formData.category" placeholder="璇烽�夋嫨鐓ょ" clearable style="width: 100%" @change="selectChange">
-              <el-option label="鐐肩劍" value="鐐肩劍" />
-              <el-option label="姘旂叅" value="姘旂叅" />
-              <el-option label="鏃犵儫鐓�" value="鏃犵儫鐓�" />
-              <el-option label="闀跨劙鐓�" value="闀跨劙鐓�" />
-              <el-option label="璐叅" value="璐叅" />
-            </el-select>
-          </el-form-item>
-        </el-col>
-        <el-col :span="6">
-          <el-form-item label="鐑��" prop="Calorific">
-            <el-input v-model="formData.Calorific" placeholder="璇疯緭鍏ョ儹鍊�" clearable />
-          </el-form-item>
-        </el-col>
-        <el-col :span="4" :offset="8">
-          <el-button type="primary" @click="search">鏌ヨ</el-button>
-          <el-button @click="reset">閲嶇疆</el-button>
-        </el-col>
-      </el-row>
-    </el-form>
-    <ETable :columns="columns" height="200" @cell-edit="handleCellEdit" :showOperations="false" :tableData="tableData" @row-click="handleRowClick" :editableColumns="['used']" />
-    <el-row :gutter="10">
-        <el-col :span="4">
-          <h1>鐢熶骇鏄庣粏</h1>
-        </el-col>
+  <el-dialog
+    v-model="dialogVisible"
+    :title="dialogType === 'add' ? '鏂板鐢熶骇鍔犲伐' : '缂栬緫鐢熶骇鍔犲伐'"
+    width="1200px"
+    :close-on-click-modal="false"
+    @close="handleClose"
+  >
+    <el-button type="primary" @click="handlData">閫夋嫨鏁版嵁</el-button>
+    <ETable
+      v-if="tableData.length > 0"
+      :columns="columns"
+      height="200"
+      @cell-edit="handleCellEdit"
+      :showOperations="false"
+      :tableData="tableData"
+      @row-click="handleRowClick"
+      :editableColumns="['used']"
+    />
+    <div v-if="tableData.length > 0" class="empty-table">
+    <h1>鐢熶骇鏄庣粏</h1>
+      <el-row :gutter="10">
+      <el-col :span="2">
+        <el-button type="primary" @click="addNewRow">
+          <el-icon>
+            <Plus />
+          </el-icon>
+          鏂板
+        </el-button>
+      </el-col>
+      <el-col :span="2">
+        <el-button type="danger" @click="clearAllRows">
+          <el-icon>
+            <Delete />
+          </el-icon>
+          娓呯┖
+        </el-button>
+      </el-col>
+      <!-- <el-col :span="2">
+        <el-button type="warning" @click="calculateAllCosts">
+          <el-icon>
+            <Warning />
+          </el-icon> 閲嶆柊璁＄畻
+        </el-button>
+      </el-col> -->
     </el-row>
-    <el-row :gutter="10">
-        <el-col :span="2">
-          <el-button type="primary">
-            <el-icon><Plus /></el-icon> 鏂板
-          </el-button>
-        </el-col>
-        <el-col :span="2"><el-button type="danger">
-            <el-icon><Delete /></el-icon> 鍒犻櫎
-          </el-button></el-col>
-        <el-col :span="2">
-          <el-button type="warning">
-            <el-icon><Warning /></el-icon> 淇敼
-          </el-button>
-        </el-col>
-    </el-row>
+    <ProductionDetailsTable
+      v-model="detailsTableData"
+      :border="false"
+      :show-operations="true"
+      :auto-calculate="true"
+      @input-change="handleDetailsChange"
+      @delete-row="handleDeleteRow"
+    />
+    </div>
+      <div style="margin-top: 20px;" v-else>鏆傛棤鏁版嵁锛岃閫夋嫨閰嶇疆鏁版嵁</div>
+
     <template #footer>
       <div class="dialog-footer">
         <el-button @click="handleClose">鍙� 娑�</el-button>
-        <el-button type="primary" :loading="loading" @click="handleSubmit">纭� 瀹�</el-button>
+        <el-button type="primary" :loading="loading" @click="handleSubmit"
+          >纭� 瀹�</el-button
+        >
       </div>
-      
     </template>
+  </el-dialog>
+  <el-dialog
+    v-model="innerVisible"
+    width="1000"
+    title="閫夋嫨閰嶇疆鏁版嵁"
+    append-to-body
+  >
+    <ETable
+      @selection-change="handleSelectionChange"
+      :showOperations="false"
+      :columns="formalDatabaseDataColumns"
+      :tableData="formalDatabaseData"
+      height="400"
+      @cell-edit="handleCellEdit"
+      :show-selection="true"
+    />
+    <el-row :gutter="24">
+      <el-col :span="2" :offset="22">
+        <el-button type="primary" @click="handleSelectData">纭畾</el-button>
+      </el-col>
+    </el-row>
   </el-dialog>
 </template>
 
 <script setup>
-import { ref, reactive, watch } from 'vue'
-import ETable from '@/components/Table/ETable.vue'
-import { ElMessage } from 'element-plus'
-import { Delete, Warning } from '@element-plus/icons-vue'
+import { ref, reactive, watch } from "vue";
+import ETable from "@/components/Table/EtableModify.vue";
+import ProductionDetailsTable from "./ProductionDetailsTable.vue";
+import { ElMessage } from "element-plus";
+import { Delete, Warning, Plus } from "@element-plus/icons-vue";
 
 const props = defineProps({
   visible: {
     type: Boolean,
-    default: false
+    default: false,
   },
   type: {
     type: String,
-    default: 'add' // 'add' 鎴� 'edit'
+    default: "add", // 'add' 鎴� 'edit'
   },
   rowData: {
     type: Object,
-    default: () => ({})
-  }
-})
-const dialogVisible = defineModel('visible', {
+    default: () => ({}),
+  },
+});
+const dialogVisible = defineModel("visible", {
   type: Boolean,
-  default: false
-})
-const emit = defineEmits(['update:visible', 'success'])
+  default: false,
+});
+const emit = defineEmits(["update:visible", "success"]);
 
-const dialogType = ref('add')
-const loading = ref(false)
-const formRef = ref(null)
-
-const tableData = ref([])
-const currentRow = ref(null)
+const innerVisible = ref(false);
+const dialogType = ref("add");
+const loading = ref(false);
+const formRef = ref(null);
+const tableData = ref([]);
+const currentRow = ref(null);
 const columns = [
-  { label: '鐓ょ', prop: 'category' },
-  { label: '鐑��', prop: 'Calorific' },
-  { label: '搴撳瓨鏁伴噺', prop: 'stock' },
-  { label: '鏈浣跨敤鏁伴噺', prop: 'used' },
-]
+  { label: "鐓ょ", prop: "category" },
+  { label: "鐑��", prop: "Calorific" },
+  { label: "搴撳瓨鏁伴噺", prop: "stock" },
+  { label: "鏈浣跨敤鏁伴噺", prop: "used" },
+];
+const detailsTableData = ref([
+  {
+    coalType: "",
+    calorificValue: "",
+    productionQuantity: "",
+    laborCost: "",
+    energyCost: "",
+    equipmentDepreciation: "",
+    purchasePrice: "",
+    totalCost: "",
+  },
+]);
 const handleRowClick = (row) => {
-  currentRow.value = row
-  console.log('褰撳墠琛屾暟鎹�:', currentRow.value)
-}
+  currentRow.value = row;
+};
+const formalDatabaseDataColumns = ref([
+  { prop: "name", label: "渚涘簲鍟嗗悕绉�", width: 150 },
+  { prop: "type", label: "鐓ょ绫诲瀷", width: 120 },
+  { prop: "unit", label: "鍗曚綅", width: 100 },
+  { prop: "number", label: "閲囪喘鏁伴噺", width: 100 },
+  { prop: "money", label: "鍗曚环锛堝惈绋庯級", width: 120 },
+  { prop: "money1", label: "鎬讳环锛堝惈绋庯級", width: 120 },
+  { prop: "money2", label: "绋庣巼", width: 80 },
+  { prop: "money3", label: "涓嶅惈绋庡崟浠�", width: 120 },
+  { prop: "createUser", label: "鐧昏浜�", width: 100 },
+  { prop: "createTime", label: "鐧昏鏃ユ湡", width: 150 },
+]);
 // 琛ㄥ崟鏁版嵁
 const formData = reactive({
-  category: '',
-  unit: '',
+  category: "",
+  unit: "",
   productionVolume: 0,
   laborCost: 0,
   materialCost: 0,
@@ -109,68 +164,218 @@
   totalCost: 0,
   totalPrice: 0,
   profit: 0,
-  reviewer: '',
-  date: ''
-})
+  reviewer: "",
+  date: "",
+});
+const handlData = () => {
+  innerVisible.value = true;
+};
+const formalDatabaseData = ref([]);
+const formalDatabaseSelectedData = ref([]);
+formalDatabaseData.value = [
+  {
+    id: 1,
+    name: "渚涘簲鍟咥",
+    type: "鍔ㄥ姏鐓�",
+    unit: "鍚�",
+    number: 120,
+    money: 500,
+    money1: 200,
+    money2: 200,
+    money3: 300,
+    money4: "楂樹綅",
+    createUser: "admin",
+    createTime: "2025-06-01",
+  },
+  {
+    id: 2,
+    name: "渚涘簲鍟咥",
+    type: "鍔ㄥ姏鐓�",
+    unit: "鍚�",
+    number: 100,
+    money: 600,
+    money1: 300,
+    money2: 300,
+    money3: 300,
+    money4: "浣庝綅",
+    createUser: "admin",
+    createTime: "2025-06-01",
+  },
+  {
+    id: 3,
+    name: "渚涘簲鍟咮",
+    type: "鐒︾叅",
+    unit: "鍚�",
+    number: 300,
+    money: 789,
+    money1: 400,
+    money2: 400,
+    money3: 400,
+    money4: "楂樹綅",
+    createUser: "admin",
+    createTime: "2025-06-01",
+  },
+  {
+    id: 4,
+    name: "渚涘簲鍟咮",
+    type: "鐒︾叅",
+    unit: "鍚�",
+    number: 256,
+    money: 800,
+    money1: 420,
+    money2: 420,
+    money3: 420,
+    money4: "浣庝綅",
+    createUser: "admin",
+    createTime: "2025-06-01",
+  },
+  {
+    id: 5,
+    name: "渚涘簲鍟咰",
+    type: "鏃犵儫鐓�",
+    unit: "鍚�",
+    number: 256,
+    money: 700,
+    money1: 300,
+    money2: 300,
+    money3: 300,
+    money4: "楂樹綅",
+    createUser: "admin",
+    createTime: "2025-06-01",
+  },
+  {
+    id: 6,
+    name: "渚涘簲鍟咥",
+    type: "鍔ㄥ姏鐓�",
+    unit: "鍚�",
+    number: 120,
+    money: 500,
+    money1: 200,
+    money2: 200,
+    money3: 300,
+    money4: "楂樹綅",
+    createUser: "admin",
+    createTime: "2025-06-01",
+  },
+  {
+    id: 7,
+    name: "渚涘簲鍟咥",
+    type: "鍔ㄥ姏鐓�",
+    unit: "鍚�",
+    number: 100,
+    money: 600,
+    money1: 300,
+    money2: 300,
+    money3: 300,
+    money4: "浣庝綅",
+    createUser: "admin",
+    createTime: "2025-06-01",
+  },
+  {
+    id: 8,
+    name: "渚涘簲鍟咮",
+    type: "鐒︾叅",
+    unit: "鍚�",
+    number: 300,
+    money: 789,
+    money1: 400,
+    money2: 400,
+    money3: 400,
+    money4: "楂樹綅",
+    createUser: "admin",
+    createTime: "2025-06-01",
+  },
+  {
+    id: 9,
+    name: "渚涘簲鍟咮",
+    type: "鐒︾叅",
+    unit: "鍚�",
+    number: 256,
+    money: 800,
+    money1: 420,
+    money2: 420,
+    money3: 420,
+    money4: "浣庝綅",
+    createUser: "admin",
+    createTime: "2025-06-01",
+  },
+  {
+    id: 10,
+    name: "渚涘簲鍟咰",
+    type: "鏃犵儫鐓�",
+    unit: "鍚�",
+    number: 256,
+    money: 700,
+    money1: 300,
+    money2: 300,
+    money3: 300,
+    money4: "楂樹綅",
+    createUser: "admin",
+    createTime: "2025-06-01",
+  },
+];
 
 // 琛ㄥ崟楠岃瘉瑙勫垯
 const rules = {
-  category: [{ required: true, message: '璇烽�夋嫨鐓ょ', trigger: 'change' }],
-}
+  category: [{ required: true, message: "璇烽�夋嫨鐓ょ", trigger: "change" }],
+};
 
-const search = () => {
-  // 鏌ヨ閫昏緫
-  if (!formData.category) {
-    return this.$message.error('璇烽�夋嫨鐓ょ')
+// 鍒濆鍖�
+const Initialization = () => {
+  console.log("鍒濆鍖栨暟鎹�");
+  tableData.value = [];
+};
+defineExpose({
+  Initialization
+});
+const handleSelectData = (row) => {
+  if (!innerVisible.value) return;
+  // 鑾峰彇閫変腑鐨勬暟鎹�
+  const selectedData = formalDatabaseSelectedData.value;
+  if (selectedData.length === 0) {
+    ElMessage.warning("璇疯嚦灏戦�夋嫨涓�鏉℃暟鎹�");
+    return;
   }
-  loading.value = true
-  // 妯℃嫙鏌ヨ鏁版嵁
-  setTimeout(() => {
-    // 鍋囨暟鎹�
-    tableData.value = [
-      { category: '鐐肩劍', Calorific: '6000', stock: 100, used: 20 },
-      { category: '姘旂叅', Calorific: '5500', stock: 80, used: 15 },
-      { category: '姘旂叅', Calorific: '5500', stock: 80, used: 15 },
-      { category: '姘旂叅', Calorific: '5500', stock: 80, used: 15 },
-      { category: '姘旂叅', Calorific: '5500', stock: 80, used: 15 },
-      { category: '姘旂叅', Calorific: '5500', stock: 80, used: 15 },
-      { category: '姘旂叅', Calorific: '5500', stock: 80, used: 15 },
-      { category: '鏃犵儫鐓�', Calorific: '7000', stock: 120, used: 30 }
-    ]
-    loading.value = false
-  }, 1000)
-}
-
+  // 灏嗛�変腑鐨勬暟鎹牴鎹渶瑕佺瓫閫夊埌琛ㄦ牸涓�
+  selectedData.forEach((item) => {
+    const existingItem = tableData.value.find(
+      (row) => row.id === item.id
+    );
+    if (!existingItem) {
+      tableData.value.push({
+        id: item.id,
+        category: item.type,
+        Calorific: item.money4,
+        stock: item.number,
+        used: 0, // 鍒濆浣跨敤鏁伴噺涓�0
+      });
+    }
+  });
+  innerVisible.value = false;
+};
+const handleSelectionChange = (selection) => {
+  formalDatabaseSelectedData.value = selection;
+};
 const reset = () => {
   // formRef
-  formRef.value?.resetFields()
-}
+  formRef.value?.resetFields();
+};
 
-const selectChange = (value) => {
-}
+const selectChange = (value) => {};
 
 // 鎻愪氦琛ㄥ崟
 const handleSubmit = async () => {
-  if (!formRef.value) return
-
-  await formRef.value.validate((valid) => {
-    if (valid) {
-      loading.value = true
-      // 瑙﹀彂鎴愬姛浜嬩欢锛屼紶閫掕〃鍗曟暟鎹�
-      emit('success', { ...formData })
-      loading.value = false
-      handleClose()
-    }
-  })
-}
+  console.log(detailsTableData.value);
+  // dialogVisible.value = false;
+};
 
 // 鍏抽棴寮圭獥
 const handleClose = () => {
-  dialogVisible.value = false
-  formRef.value?.resetFields()
+  dialogVisible.value = false;
+  formRef.value?.resetFields();
   Object.assign(formData, {
-    category: '',
-    unit: '',
+    category: "",
+    unit: "",
     productionVolume: 0,
     laborCost: 0,
     materialCost: 0,
@@ -178,32 +383,73 @@
     totalCost: 0,
     totalPrice: 0,
     profit: 0,
-    reviewer: '',
-    date: ''
-  })
-}
+    reviewer: "",
+    date: "",
+  });
+};
 
 // 娣诲姞鍗曞厓鏍肩紪杈戝鐞嗗嚱鏁�
 const handleCellEdit = (row, prop, value) => {
-  console.log('鍗曞厓鏍肩紪杈�:',  prop)
-  // console.log('鍗曞厓鏍肩紪杈戝畬鎴�:', row, prop, value)
-  // 杩欓噷鍙互娣诲姞楠岃瘉閫昏緫锛屼緥濡傛鏌ヤ娇鐢ㄩ噺鏄惁澶т簬搴撳瓨
-  if (prop === 'used' && Number(value) > Number(row.stock)) {
-    ElMessage.warning('浣跨敤鏁伴噺涓嶈兘澶т簬搴撳瓨鏁伴噺锛�')
-    // 鍙互鍦ㄨ繖閲岄噸缃��
-    row.used = row.stock
+  if (prop === "used" && Number(value) > Number(row.stock)) {
+    ElMessage.warning("浣跨敤鏁伴噺涓嶈兘澶т簬搴撳瓨鏁伴噺锛�");
+    row.used = row.stock;
   }
-}
+};
+
+// 澶勭悊鐢熶骇鏄庣粏琛ㄦ牸鐨勬搷浣�
+const addNewRow = () => {
+  detailsTableData.value.push({
+    coalType: "",
+    calorificValue: "",
+    productionQuantity: "",
+    laborCost: "",
+    energyCost: "",
+    equipmentDepreciation: "",
+    purchasePrice: "",
+    totalCost: "",
+  });
+};
+
+const clearAllRows = () => {
+  detailsTableData.value = [];
+  ElMessage.success("宸叉竻绌烘墍鏈夋暟鎹�");
+};
+
+const calculateAllCosts = () => {
+  detailsTableData.value.forEach((row) => {
+    const laborCost = parseFloat(row.laborCost) || 0;
+    const energyCost = parseFloat(row.energyCost) || 0;
+    const equipmentDepreciation = parseFloat(row.equipmentDepreciation) || 0;
+    const purchasePrice = parseFloat(row.purchasePrice) || 0;
+
+    row.totalCost = (
+      laborCost +
+      energyCost +
+      equipmentDepreciation +
+      purchasePrice
+    ).toFixed(2);
+  });
+  ElMessage.success("閲嶆柊璁＄畻瀹屾垚");
+};
+
+const handleDetailsChange = (data) => {
+  console.log("鐢熶骇鏄庣粏鏁版嵁鍙樺寲:", data);
+};
+
+const handleDeleteRow = (index) => {
+  ElMessage.success(`宸插垹闄ょ ${index + 1} 琛屾暟鎹甡);
+};
 </script>
 
-<style scoped lang="scss"> 
-.el-form{
+<style scoped lang="scss">
+.el-form {
   .el-row {
     padding-top: 20px;
-    background: rgba($color: #F8FAFB, $alpha: 0.5) ;
+    background: rgba($color: #f8fafb, $alpha: 0.5);
   }
 }
-.el-row>.el-col>h1{
+
+.el-row > .el-col > h1 {
   font-weight: bolder;
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/src/views/production/components/SupplierDialog.vue b/src/views/production/components/SupplierDialog.vue
deleted file mode 100644
index 38735b7..0000000
--- a/src/views/production/components/SupplierDialog.vue
+++ /dev/null
@@ -1,283 +0,0 @@
-<template>
-  <el-dialog
-    v-model="dialogVisible"
-    :title="title"
-    width="800px"
-    :close-on-click-modal="false"
-    @close="handleClose"
-  >
-    <el-form
-      ref="formRef"
-      :model="formData"
-      :rules="rules"
-      label-width="120px"
-      class="supplier-form"
-    >
-      <el-row :gutter="20">
-        <el-col :span="12">
-          <el-form-item label="渚涘簲鍟嗗悕绉�" prop="supplierName">
-            <el-input v-model="formData.supplierName" placeholder="璇疯緭鍏ヤ緵搴斿晢鍚嶇О" />
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="绾崇◣浜鸿瘑鍒彿" prop="identifyNumber">
-            <el-input v-model="formData.identifyNumber" placeholder="璇疯緭鍏ョ撼绋庝汉璇嗗埆鍙�" />
-          </el-form-item>
-        </el-col>
-      </el-row>
-
-      <el-row :gutter="20">
-        <el-col :span="12">
-          <el-form-item label="缁忚惀鍦板潃" prop="address">
-            <el-cascader
-              v-model="formData.address"
-              :options="addressOptions"
-              placeholder="璇烽�夋嫨缁忚惀鍦板潃"
-              clearable
-              style="width: 100%"
-            />
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="璇︾粏鍦板潃" prop="addressDetail">
-            <el-input v-model="formData.addressDetail" placeholder="璇疯緭鍏ヨ缁嗗湴鍧�" />
-          </el-form-item>
-        </el-col>
-      </el-row>
-
-      <el-row :gutter="20">
-        <el-col :span="12">
-          <el-form-item label="閾惰璐︽埛" prop="bankAccount">
-            <el-input v-model="formData.bankAccount" placeholder="璇疯緭鍏ラ摱琛岃处鎴�" />
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="寮�鎴疯" prop="bank">
-            <el-input v-model="formData.bank" placeholder="璇疯緭鍏ュ紑鎴疯" />
-          </el-form-item>
-        </el-col>
-      </el-row>
-
-      <el-row :gutter="20">
-        <el-col :span="12">
-          <el-form-item label="鑱旂郴浜�" prop="contacts">
-            <el-input v-model="formData.contacts" placeholder="璇疯緭鍏ヨ仈绯讳汉" />
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="鑱旂郴浜虹數璇�" prop="contactsPhone">
-            <el-input v-model="formData.contactsPhone" placeholder="璇疯緭鍏ヨ仈绯讳汉鐢佃瘽" />
-          </el-form-item>
-        </el-col>
-      </el-row>
-
-      <el-row :gutter="20">
-        <el-col :span="12">
-          <el-form-item label="鐢靛瓙閭" prop="email">
-            <el-input v-model="formData.email" placeholder="璇疯緭鍏ョ數瀛愰偖绠�" />
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="澶囨敞" prop="remark">
-            <el-input v-model="formData.remark" type="textarea" placeholder="璇疯緭鍏ュ娉ㄤ俊鎭�" />
-          </el-form-item>
-        </el-col>
-      </el-row>
-    </el-form>
-
-    <template #footer>
-      <div class="dialog-footer">
-        <el-button @click="handleClose">鍙� 娑�</el-button>
-        <el-button v-if="type === 'edit'" @click="handleReset">閲� 缃�</el-button>
-        <el-button type="primary" :loading="loading" @click="handleSubmit">纭� 瀹�</el-button>
-      </div>
-    </template>
-  </el-dialog>
-</template>
-
-<script setup>
-import { ref, reactive, defineProps, watch } from 'vue'
-import { ElMessage } from 'element-plus'
-
-const props = defineProps({
-  visible: {
-    type: Boolean,
-    default: false
-  },
-  type: {
-    type: String,
-    default: 'add' // 'add' 鎴� 'edit'
-  },
-  title: {
-    type: String,
-    default: '鏂板渚涘簲鍟�'
-  },
-  rowData: {
-    type: Object,
-    default: () => ({})
-  }
-})
-
-const emit = defineEmits(['update:visible', 'success'])
-
-const dialogVisible = ref(false)
-const loading = ref(false)
-const formRef = ref(null)
-
-// 琛ㄥ崟鏁版嵁
-const formData = reactive({
-  supplierName: '',
-  identifyNumber: '',
-  address: [],
-  addressDetail: '',
-  bankAccount: '',
-  bank: '',
-  contacts: '',
-  contactsPhone: '',
-  email: '',
-  remark: ''
-})
-
-// 鍦板潃閫夐」锛堢ず渚嬫暟鎹級
-const addressOptions = [
-  {
-    value: 'shanghai',
-    label: '涓婃捣',
-    children: [
-      {
-        value: 'pudong',
-        label: '娴︿笢鏂板尯'
-      },
-      {
-        value: 'xuhui',
-        label: '寰愭眹鍖�'
-      }
-    ]
-  },
-  {
-    value: 'beijing',
-    label: '鍖椾含',
-    children: [
-      {
-        value: 'chaoyang',
-        label: '鏈濋槼鍖�'
-      },
-      {
-        value: 'haidian',
-        label: '娴锋穩鍖�'
-      }
-    ]
-  }
-]
-
-// 琛ㄥ崟楠岃瘉瑙勫垯
-const rules = {
-  supplierName: [
-    { required: true, message: '璇疯緭鍏ヤ緵搴斿晢鍚嶇О', trigger: 'blur' }
-  ],
-  identifyNumber: [
-    { required: true, message: '璇疯緭鍏ョ撼绋庝汉璇嗗埆鍙�', trigger: 'blur' },
-    { min: 15, max: 20, message: '绾崇◣浜鸿瘑鍒彿闀垮害鍦�15鍒�20涓瓧绗�', trigger: 'blur' }
-  ],
-  address: [
-    { required: true, message: '璇烽�夋嫨缁忚惀鍦板潃', trigger: 'change' }
-  ],
-  bankAccount: [
-    { required: true, message: '璇疯緭鍏ラ摱琛岃处鎴�', trigger: 'blur' }
-  ],
-  bank: [
-    { required: true, message: '璇疯緭鍏ュ紑鎴疯', trigger: 'blur' }
-  ],
-  contacts: [
-    { required: true, message: '璇疯緭鍏ヨ仈绯讳汉', trigger: 'blur' }
-  ],
-  contactsPhone: [
-    { required: true, message: '璇疯緭鍏ヨ仈绯讳汉鐢佃瘽', trigger: 'blur' },
-    { pattern: /^1[3-9]\d{9}$/, message: '璇疯緭鍏ユ纭殑鎵嬫満鍙风爜', trigger: 'blur' }
-  ],
-  email: [
-    { type: 'email', message: '璇疯緭鍏ユ纭殑閭鍦板潃', trigger: 'blur' }
-  ]
-}
-
-// 鐩戝惉visible鍙樺寲
-watch(() => props.visible, (val) => {
-  dialogVisible.value = val
-  if (val && props.type === 'edit') {
-    Object.assign(formData, props.rowData)
-  }
-})
-
-// 鐩戝惉dialogVisible鍙樺寲
-watch(() => dialogVisible.value, (val) => {
-  emit('update:visible', val)
-})
-
-// 鎻愪氦琛ㄥ崟
-const handleSubmit = async () => {
-  if (!formRef.value) return
-  
-  await formRef.value.validate((valid) => {
-    if (valid) {
-      loading.value = true
-      try {
-        // 瑙﹀彂鎴愬姛浜嬩欢锛屼紶閫掕〃鍗曟暟鎹�
-        emit('success', { ...formData })
-        handleClose()
-      } catch (error) {
-        ElMessage.error('鎻愪氦澶辫触')
-      } finally {
-        loading.value = false
-      }
-    }
-  })
-}
-
-// 閲嶇疆琛ㄥ崟
-const handleReset = () => {
-  formRef.value?.resetFields()
-}
-
-// 鍏抽棴寮圭獥
-const handleClose = () => {
-  dialogVisible.value = false
-  formRef.value?.resetFields()
-  Object.assign(formData, {
-    supplierName: '',
-    identifyNumber: '',
-    address: [],
-    addressDetail: '',
-    bankAccount: '',
-    bank: '',
-    contacts: '',
-    contactsPhone: '',
-    email: '',
-    remark: ''
-  })
-}
-</script>
-
-<style scoped>
-.supplier-form {
-  padding: 20px;
-}
-
-.dialog-footer {
-  display: flex;
-  justify-content: flex-end;
-  gap: 10px;
-}
-
-:deep(.el-form-item__label) {
-  font-weight: bold;
-}
-
-:deep(.el-input),
-:deep(.el-cascader) {
-  width: 100%;
-}
-
-:deep(.el-textarea__inner) {
-  min-height: 80px;
-}
-</style> 
\ No newline at end of file
diff --git a/src/views/production/index.vue b/src/views/production/index.vue
index c113e9f..8872835 100644
--- a/src/views/production/index.vue
+++ b/src/views/production/index.vue
@@ -1,274 +1,294 @@
 <template>
   <div class="production-container">
-    <div class="search-bar">
-      <el-input v-model="searchForm.keyword" placeholder="璇疯緭鍏ュ叧閿瘝" clearable />
-      <el-input v-model="searchForm.addUser" placeholder="璇疯緭鍏ヤ汉" clearable />
-      <el-button type="primary" @click="handleSearch">鏌ヨ</el-button>
-      <el-button @click="handleReset">閲嶇疆</el-button>
-    </div>
-
-    <div class="operation-bar">
-      <!-- <el-button type="primary" @click="handleAdd">鏂板閰嶉」</el-button> -->
+        <el-form :inline="true" :model="searchForm" class="search-form" style="width: 100%">
+          <el-form-item label="鎼滅储">
+            <el-input v-model="searchForm.searchAll" placeholder="璇疯緭鍏ュ叧閿瘝" clearable />
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" @click="handleSearch">鏌ヨ</el-button>
+            <el-button @click="handleReset">閲嶇疆</el-button>
+          </el-form-item>
+        </el-form>
+    <el-card>
       <el-button type="success" :icon="Plus" @click="handleAddBatch">鏂板鍔犲伐</el-button>
       <el-button type="danger" :icon="Delete">鍒犻櫎</el-button>
       <el-button type="info" :icon="Download">瀵煎嚭</el-button>
-    </div>
-
-    <el-table :data="tableData" border style="width: 100%" @selection-change="handleSelectionChange">
-      <el-table-column type="selection" width="55" />
-      <el-table-column prop="sequence" label="搴忓彿" width="80" />
-      <el-table-column prop="category" label="鐓ょ" width="120" />
-      <el-table-column prop="unit" label="鍗曚綅" width="100" />
-      <el-table-column prop="productionVolume" label="鐢熶骇鏁伴噺" width="120" />
-      <el-table-column prop="laborCost" label="浜哄伐鎴愭湰" width="120" />
-      <el-table-column prop="materialCost" label="鍘熸枡鎴愭湰" width="120" />
-      <el-table-column prop="equipmentCost" label="璁惧璐圭敤" width="120" />
-      <el-table-column prop="totalCost" label="鎬绘垚鏈�" width="120" />
-      <el-table-column prop="totalPrice" label="鎬绘垚鏈�" width="120" />
-      <el-table-column prop="profit" label="鍒╂鼎" width="100" />
-      <el-table-column prop="reviewer" label="澶嶈浜�" width="120" />
-      <el-table-column prop="date" label="鏃ユ湡" width="120" />
-      <el-table-column label="鎿嶄綔" fixed="right" width="220">
-        <template #default="scope">
-          <el-button type="primary" link @click="handleEdit(scope.row)">鐧昏</el-button>
-          <el-button type="success" link @click="handleEdit(scope.row)">缂栬緫</el-button>
-          <el-button type="danger" link @click="handleDelete(scope.row)">鍒犻櫎</el-button>
-          <el-button type="warning" link @click="handleExport(scope.row)">瀵煎嚭</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-
-    <div class="pagination">
-      <el-pagination
-        v-model:current-page="pagination.currentPage"
-        v-model:page-size="pagination.pageSize"
-        :page-sizes="[10, 20, 30, 50]"
-        :total="pagination.total"
-        layout="total, sizes, prev, pager, next, jumper"
-        @size-change="handleSizeChange"
-        @current-change="handleCurrentChange"
-      />
-    </div>
-
-    <!-- 寮圭獥缁勪欢 -->
-    <ProductionDialog
-      v-model:visible="dialogVisible"
-      :type="dialogType"
-      :row-data="currentRow"
-      @success="handleDialogSuccess"
-    />
+      <ETable :loading="loading" :table-data="tableData" :columns="columns" @selection-change="handleSelectionChange"
+        @edit="handleEdit" @view-detail="handleViewDetail" :show-selection="true" :border="true" :maxHeight="480" />
+      <Pagination v-model:currentPage="pagination.currentPage" v-model:pageSize="pagination.pageSize"
+        :total="pagination.total" @current-change="handleCurrentChange" @size-change="handleSizeChange" />
+    </el-card>
+    <ProductionDialog v-model:visible="dialogVisible"  ref="childRef" :type="dialogType"
+      @success="handleDialogSuccess" />
   </div>
 </template>
 
 <script setup>
-import { ref, reactive, onMounted } from 'vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import { Plus, Delete, Download } from "@element-plus/icons-vue";
-import ProductionDialog from './components/ProductionDialog.vue'
+import { ref, reactive, onMounted } from "vue";
+import { ElMessage, ElMessageBox } from "element-plus";
+import { Plus, Delete, Download, List } 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";
+const childRef = ref(null);
+const columns = [
+  { prop: "category", label: "鐓ょ", width: 150 },
+  { prop: "unit", label: "鍗曚綅", width: 120 },
+  { prop: "productionVolume", label: "鐢熶骇鏁伴噺", width: 150 },
+  { prop: "laborCost", label: "浜哄伐鎴愭湰", width: 150 },
+  { prop: "materialCost", label: "鍘熸枡鎴愭湰", width: 120 },
+  { prop: "equipmentCost", label: "璁惧璐圭敤", width: 143 },
+  { prop: "totalCost", label: "鎬绘垚鏈�", width: 150 },
+  { prop: "totalPrice", label: "鎬诲敭浠�", width: 150 },
+  { prop: "profit", label: "鍒╂鼎", width: 100 },
+  { prop: "reviewer", label: "澶嶈浜�", width: 120 },
+  { prop: "date", label: "鏃ユ湡", width: 150 },
+];
 
 // 鎼滅储琛ㄥ崟鏁版嵁
 const searchForm = reactive({
-  keyword: '',
-  addUser: ''
-})
+  searchAll:""
+});
 
 // 琛ㄦ牸鏁版嵁
-const tableData = ref([])
-const loading = ref(false)
+const tableData = ref([]);
+const loading = ref(false);
 
 // 鍒嗛〉鏁版嵁
 const pagination = reactive({
   currentPage: 1,
   pageSize: 10,
-  total: 0
-})
+  total: 0,
+});
 
 // 閫変腑鐨勮鏁版嵁
-const selectedRows = ref([])
+const selectedRows = ref([]);
 
 // 寮圭獥鐩稿叧
-const dialogVisible = ref(false)
-const dialogType = ref('add')
-const currentRow = ref(null)
+const dialogVisible = ref(false);
+const dialogType = ref("add");
+const currentRow = ref(null);
+
+// 鐢熶骇鏄庣粏瀵硅瘽妗嗘帶鍒�
+const detailDialogVisible = ref(false);
+const currentDetailRow = ref(null);
 
 // 鑾峰彇琛ㄦ牸鏁版嵁
 const getList = async () => {
-  loading.value = true
+  loading.value = true;
   try {
     const params = {
       ...searchForm,
       pageNum: pagination.currentPage,
-      pageSize: pagination.pageSize
-    }
+      pageSize: pagination.pageSize,
+    };
     // const res = await getProductionList(params)
     // 鍋囨暟鎹�
     const res = {
       data: {
-        list: [{
-          sequence: 1,
-          category: '鐓ょ',
-          unit: '鍗曚綅',
-          productionVolume: '鐢熶骇鏁伴噺',
-          laborCost: '浜哄伐鎴愭湰',
-          materialCost: '鍘熸枡鎴愭湰',
-          equipmentCost: '璁惧璐圭敤',
-          totalCost: '鎬绘垚鏈�',
-          totalPrice: '鎬绘垚鏈�',
-          profit: '鍒╂鼎',
-          reviewer: '澶嶈浜�',
-          date: '鏃ユ湡'
-        }],
-        total: 0
-      }
-    }
-    
+        list: [
+          {
+            sequence: 1,
+            category: "鏃犵儫鐓�",
+            unit: "鍚�",
+            productionVolume: 100,
+            laborCost: "300",
+            materialCost: "200",
+            equipmentCost: "100",
+            totalCost: "600",
+            totalPrice: "800",
+            profit: "200",
+            reviewer: "寮犱笁",
+            date: "2023-10-01",
+          },
+          {
+            sequence: 12,
+            category: "鏃犵儫鐓�",
+            unit: "鍚�",
+            productionVolume: 100,
+            laborCost: "3100",
+            materialCost: "2020",
+            equipmentCost: "1300",
+            totalCost: "6030",
+            totalPrice: "8300",
+            profit: "2300",
+            reviewer: "寮犱笁",
+            date: "2025-10-02",
+          },
+        ],
+        total: 2,
+      },
+    };
 
-    tableData.value = res.data.list
-    pagination.total = res.data.total
+    tableData.value = res.data.list;
+    pagination.total = res.data.total;
   } catch (error) {
-    ElMessage.error('鑾峰彇鏁版嵁澶辫触')
+    ElMessage.error("鑾峰彇鏁版嵁澶辫触");
   } finally {
-    loading.value = false
+    loading.value = false;
   }
-}
+};
 
 // 澶勭悊琛ㄦ牸閫夋嫨鍙樺寲
 const handleSelectionChange = (selection) => {
-  selectedRows.value = selection
-}
+  selectedRows.value = selection;
+};
 
 // 鎼滅储鏂规硶
 const handleSearch = () => {
-  pagination.currentPage = 1
-  getList()
-}
+  pagination.currentPage = 1;
+  getList();
+};
 
 // 閲嶇疆鎼滅储
 const handleReset = () => {
-  searchForm.keyword = ''
-  searchForm.addUser = ''
-  handleSearch()
-}
-
-// 鏂板閰嶉」
-const handleAdd = () => {
-  dialogType.value = 'add'
-  dialogVisible.value = true
-}
+  searchForm.keyword = "";
+  searchForm.addUser = "";
+  handleSearch();
+};
 
 // 鏂板鍔犲伐
 const handleAddBatch = () => {
-  dialogType.value = 'add'
-  dialogVisible.value = true
-}
+  dialogType.value = "add";
+  dialogVisible.value = true;
+  childRef.value.Initialization();
+};
 
 // 缂栬緫
 const handleEdit = (row) => {
-  currentRow.value = row
-  dialogType.value = 'edit'
-  dialogVisible.value = true
-}
+  currentRow.value = row;
+  dialogType.value = "edit";
+  dialogVisible.value = true;
+};
+
+// 鎵撳紑鐢熶骇鏄庣粏瀵硅瘽妗�
+const handleViewDetail = (row) => {
+  currentDetailRow.value = row;
+  detailDialogVisible.value = true;
+};
 
 // 澶勭悊寮圭獥鎻愪氦
 const handleDialogSuccess = async (formData) => {
   try {
-    if (dialogType.value === 'add') {
-      await addProduction(formData)
-      ElMessage.success('鏂板鎴愬姛')
+    if (dialogType.value === "add") {
+      await addProduction(formData);
+      ElMessage.success("鏂板鎴愬姛");
     } else {
       await updateProduction({
         ...formData,
-        id: currentRow.value.id
-      })
-      ElMessage.success('鏇存柊鎴愬姛')
+        id: currentRow.value.id,
+      });
+      ElMessage.success("鏇存柊鎴愬姛");
     }
-    getList()
+    getList();
   } catch (error) {
-    ElMessage.error(dialogType.value === 'add' ? '鏂板澶辫触' : '鏇存柊澶辫触')
+    ElMessage.error(dialogType.value === "add" ? "鏂板澶辫触" : "鏇存柊澶辫触");
   }
-}
+};
+
+// 澶勭悊鐢熶骇鏄庣粏寮圭獥鎻愪氦
+const handleDetailDialogSuccess = async (formData) => {
+  try {
+    ElMessage.success("淇濆瓨鎴愬姛");
+    getList();
+  } catch (error) {
+    ElMessage.error("淇濆瓨澶辫触");
+  }
+};
 
 // 鍒犻櫎
 const handleDelete = (row) => {
-  ElMessageBox.confirm('纭鍒犻櫎璇ヨ褰曞悧锛�', '鎻愮ず', {
-    confirmButtonText: '纭畾',
-    cancelButtonText: '鍙栨秷',
-    type: 'warning'
-  }).then(async () => {
-    try {
-      await deleteProduction(row.id)
-      ElMessage.success('鍒犻櫎鎴愬姛')
-      getList()
-    } catch (error) {
-      console.error('鍒犻櫎澶辫触:', error)
-      ElMessage.error('鍒犻櫎澶辫触')
-    }
-  }).catch(() => {
-    ElMessage.info('宸插彇娑堝垹闄�')
+  ElMessageBox.confirm("纭鍒犻櫎璇ヨ褰曞悧锛�", "鎻愮ず", {
+    confirmButtonText: "纭畾",
+    cancelButtonText: "鍙栨秷",
+    type: "warning",
   })
-}
+    .then(async () => {
+      try {
+        await deleteProduction(row.id);
+        ElMessage.success("鍒犻櫎鎴愬姛");
+        getList();
+      } catch (error) {
+        console.error("鍒犻櫎澶辫触:", error);
+        ElMessage.error("鍒犻櫎澶辫触");
+      }
+    })
+    .catch(() => {
+      ElMessage.info("宸插彇娑堝垹闄�");
+    });
+};
 
 // 瀵煎嚭
 const handleExport = async (row) => {
   try {
-    const res = await exportProduction({ id: row.id })
-    const blob = new Blob([res], { type: 'application/vnd.ms-excel' })
-    const fileName = `鐢熶骇鍔犲伐璁板綍_${new Date().getTime()}.xlsx`
-    if ('download' in document.createElement('a')) {
-      const elink = document.createElement('a')
-      elink.download = fileName
-      elink.style.display = 'none'
-      elink.href = URL.createObjectURL(blob)
-      document.body.appendChild(elink)
-      elink.click()
-      URL.revokeObjectURL(elink.href)
-      document.body.removeChild(elink)
+    const res = await exportProduction({ id: row.id });
+    const blob = new Blob([res], { type: "application/vnd.ms-excel" });
+    const fileName = `鐢熶骇鍔犲伐璁板綍_${new Date().getTime()}.xlsx`;
+    if ("download" in document.createElement("a")) {
+      const elink = document.createElement("a");
+      elink.download = fileName;
+      elink.style.display = "none";
+      elink.href = URL.createObjectURL(blob);
+      document.body.appendChild(elink);
+      elink.click();
+      URL.revokeObjectURL(elink.href);
+      document.body.removeChild(elink);
     } else {
-      navigator.msSaveBlob(blob, fileName)
+      navigator.msSaveBlob(blob, fileName);
     }
   } catch (error) {
-    ElMessage.error('瀵煎嚭澶辫触')
+    ElMessage.error("瀵煎嚭澶辫触");
   }
-}
+};
 
 // 澶勭悊姣忛〉鏄剧ず鏁伴噺鍙樺寲
 const handleSizeChange = (val) => {
-  pagination.pageSize = val
-  getList()
-}
+  pagination.pageSize = val;
+  getList();
+};
 
 // 澶勭悊椤电爜鍙樺寲
 const handleCurrentChange = (val) => {
-  pagination.currentPage = val
-  getList()
-}
+  pagination.currentPage = val;
+  getList();
+};
 
 // 缁勪欢鎸傝浇鏃跺姞杞芥暟鎹�
 onMounted(() => {
-  getList()
-})
+  getList();
+});
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 .production-container {
   padding: 20px;
+
+  .el-card:nth-child(1) {
+    margin-bottom: 20px;
+  }
 }
 
 .search-bar {
   margin-bottom: 20px;
   display: flex;
   gap: 10px;
-}
 
-.operation-bar {
+  .el-input {
+    width: 20%;
+  }
+}
+.search-form{
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
   margin-bottom: 20px;
-  display: flex;
-  gap: 10px;
-}
 
-.pagination {
-  margin-top: 20px;
-  display: flex;
-  justify-content: flex-end;
+  .el-form-item {
+    margin-right: 10px;
+  }
+
+  .el-button {
+    margin-left: 10px;
+  }
 }
-</style> 
\ No newline at end of file
+</style>

--
Gitblit v1.9.3