From 7c86b549b27bd54f6bd5de81c13f8242f91c87ff Mon Sep 17 00:00:00 2001
From: 张诺 <zhang_12370@163.com>
Date: 星期一, 16 六月 2025 18:03:27 +0800
Subject: [PATCH] 优化文件上传组件及表格显示

---
 src/views/procureMent/index.vue |  254 ++++++++++++++++++++++++++++----------------------
 1 files changed, 141 insertions(+), 113 deletions(-)

diff --git a/src/views/procureMent/index.vue b/src/views/procureMent/index.vue
index b04a0f1..0651cd4 100644
--- a/src/views/procureMent/index.vue
+++ b/src/views/procureMent/index.vue
@@ -1,78 +1,84 @@
 <template>
   <div class="app-container">
-      <el-form :inline="true" :model="queryParams" class="search-form">
-        <el-form-item label="鎼滅储">
-          <el-input
-            v-model="queryParams.searchText"
-            placeholder="璇疯緭鍏ュ叧閿瘝"
-            clearable
-            :style="{ width: '100%' }"
-          />
-        </el-form-item>
-        <el-form-item label="渚涘簲鍟嗗悕绉�">
-          <el-input
-            v-model="queryParams.supplierName"
-            placeholder="璇疯緭鍏�"
-            clearable
-            :style="{ width: '100%' }"
-          />
-        </el-form-item>
-        <el-form-item label="缁熶竴浜鸿瘑鍒彿">
-          <el-input
-            v-model="queryParams.identifyNumber"
-            placeholder="璇疯緭鍏�"
-            clearable
-            :style="{ width: '100%' }"
-          />
-        </el-form-item>
-        <el-form-item label="缁忚惀鍦板潃">
-          <el-input
-            v-model="queryParams.address"
-            placeholder="璇疯緭鍏�"
-            clearable
-            :style="{ width: '100%' }"
-          />
-        </el-form-item>
-        <el-form-item>
-          <el-button type="primary" @click="handleQuery">鏌ヨ</el-button>
-          <el-button @click="resetQuery">閲嶇疆</el-button>
-        </el-form-item>
-      </el-form>
+    <el-form :inline="true" :model="queryParams" class="search-form">
+      <el-form-item label="鎼滅储">
+        <el-input
+          v-model="queryParams.searchText"
+          placeholder="璇疯緭鍏ュ叧閿瘝"
+          clearable
+          :style="{ width: '100%' }"
+        />
+      </el-form-item>
+      <el-form-item label="渚涘簲鍟嗗悕绉�">
+        <el-input
+          v-model="queryParams.supplierName"
+          placeholder="璇疯緭鍏�"
+          clearable
+          :style="{ width: '100%' }"
+        />
+      </el-form-item>
+      <el-form-item label="缁熶竴浜鸿瘑鍒彿">
+        <el-input
+          v-model="queryParams.identifyNumber"
+          placeholder="璇疯緭鍏�"
+          clearable
+          :style="{ width: '100%' }"
+        />
+      </el-form-item>
+      <el-form-item label="缁忚惀鍦板潃">
+        <el-input
+          v-model="queryParams.address"
+          placeholder="璇疯緭鍏�"
+          clearable
+          :style="{ width: '100%' }"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" @click="handleQuery">鏌ヨ</el-button>
+        <el-button @click="resetQuery">閲嶇疆</el-button>
+      </el-form-item>
+    </el-form>
     <el-card>
       <!-- 鎿嶄綔鎸夐挳鍖� -->
       <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-row> 
+        <el-button type="danger" :icon="Delete" @click="handleDelete"
+          >鍒犻櫎</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"
-          @edit="handleEdit"
-          @delete="handleDeleteSuccess"
-          :show-selection="true"
-          :border="true"
-          :maxHeight="440"
-        />      <pagination
-        v-if="total>0"
-        :page="pageNum"
+      <data-table
+        :loading="loading"
+        :table-data="tableData"
+        :columns="columns"
+        @selection-change="handleSelectionChange"
+        @edit="handleEdit"
+        @delete="handleDeleteSuccess"
+        :show-selection="true"
+        :border="true"
+        :maxHeight="440"
+      />
+      <pagination
+        v-if="total > 0"
+        :page="current"
         :limit="pageSize"
         :total="total"
         @pagination="handlePagination"
         :layout="'total, prev, pager, next, jumper'"
       />
-    </el-card>    <ProductionDialog
-        v-model:dialogFormVisible="dialogFormVisible"
-        :form="form"
-        :title="title"
-        @submit="handleSubmit"
-        @success="handleSuccess"
-      />
+    </el-card>
+    <ProductionDialog
+      v-model:copyForm="copyForm"
+      v-model:dialogFormVisible="dialogFormVisible"
+      v-model:form="form"
+      :title="title"
+      @submit="handleSubmit"
+      @success="handleSuccess"
+      ref="productionDialogs"
+    />
   </div>
 </template>
 
@@ -82,26 +88,29 @@
 import { Plus, Edit, Delete, Download } from "@element-plus/icons-vue";
 import DataTable from "@/components/Table/ETable.vue";
 import Pagination from "@/components/Pagination";
-import ProductionDialog from './components/ProductionDialog.vue';
+import ProductionDialog from "./components/ProductionDialog.vue";
 import { purchaseRegistration } from "@/api/procureMent";
-const { proxy } = getCurrentInstance()
+import useUserStore from "@/store/modules/user";
+// 寮曞叆瀛楀吀鏁版嵁
+const { proxy } = getCurrentInstance();
 const dialogFormVisible = ref(false);
 const form = ref({});
 const title = ref("");
 // 鐘舵�佸彉閲�
 const loading = ref(false);
 const total = ref(0);
-const pageNum = ref(1)
+const current = ref(1);
 const pageSize = ref(10);
 const selectedRows = ref([]);
+const copyForm = ref({});
 // 鏌ヨ鍙傛暟
 const queryParams = reactive({
   searchText: "",
   supplierName: "",
   identifyNumber: "",
   address: "",
-  pageNum: 1,
-  pageSize: 10
+  current: 1,
+  pageSize: 10,
 });
 // 鏄惁缂栬緫
 const addOrEdit = ref("add");
@@ -113,13 +122,18 @@
   // 杩欓噷娣诲姞瀹為檯鐨勬煡璇㈤�昏緫
   getList();
 };
-
+const userStore = useUserStore();
+// 鑾峰彇鐢ㄦ埛淇℃伅
+const userInfo = ref({});
+onMounted(async () => {
+  let res = await userStore.getInfo();
+  userInfo.value = res.user;
+});
 // 鍒嗛〉澶勭悊
 const handlePagination = (val) => {
-  console.log("鍒嗛〉鍙傛暟锛�", val);
-  pageNum.value = val.page;
+  current.value = val.page;
   pageSize.value = val.limit;
-  queryParams.pageNum = val.page;
+  queryParams.current = val.page;
   queryParams.pageSize = val.limit;
   getList();
 };
@@ -127,8 +141,8 @@
 // supplier 渚涘簲鍟嗘暟鎹�
 const columns = ref([
   { prop: "supplierName", label: "渚涘簲鍟嗗悕绉�", minWidth: 200 },
-  { prop: "unit", label: "鍗曚綅", minWidth: 150 },
   { prop: "coal", label: "鐓ょ绫诲瀷", minWidth: 120 },
+  { prop: "unit", label: "鍗曚綅", minWidth: 150 },
   { prop: "purchaseQuantity", label: "閲囪喘鏁伴噺", minWidth: 100 },
   { prop: "priceIncludingTax", label: "鍗曚环锛堝惈绋庯級", minWidth: 150 },
   { prop: "totalPriceIncludingTax", label: "鎬讳环锛堝惈绋庯級", minWidth: 100 },
@@ -141,50 +155,66 @@
 // 閲嶇疆鏌ヨ
 const resetQuery = () => {
   Object.keys(queryParams).forEach((key) => {
-    if (key !== "pageNum" && key !== "pageSize") {
+    if (key !== "current" && key !== "pageSize") {
       queryParams[key] = "";
     }
   });
-  handleQuery();
 };
 // 鏂板
 const handleAdd = () => {
-  console.log("鐐瑰嚮鏂板鎸夐挳");
   addOrEdit.value = "add";
   handleAddEdit();
 };
 // 鏂板缂栬緫
+const productionDialogs = ref(null); // 娣诲姞ref澹版槑
+
 const handleAddEdit = () => {
   addOrEdit.value == "add" ? (title.value = "鏂板") : (title.value = "缂栬緫");
-    title.value = title.value + "閲囪喘淇℃伅";
-    openDialog();
+  title.value = title.value + "閲囪喘淇℃伅";
+  
+  // 姝ｇ‘浣跨敤瀛愮粍浠秗ef
+  if (productionDialogs.value) {
+    // 杩欓噷鍙互璋冪敤瀛愮粍浠剁殑鏂规硶
+    console.log("瀛愮粍浠跺疄渚�:", productionDialogs.value.getDropdownData());
+  }
+  
+  openDialog();
 };
 // 鎵撳紑寮圭獥
 const openDialog = () => {
   if (addOrEdit.value === "edit") {
     // 纭繚澶嶅埗涓�浠芥暟鎹紝閬垮厤鐩存帴寮曠敤
-    form.value = JSON.parse(JSON.stringify(form.value));
+    copyForm.value = JSON.parse(JSON.stringify(form.value));
     dialogFormVisible.value = true;
+    // 瑙﹀彂ref閲岄潰鐨勬柟娉�
     return;
   }
   // 鏂板缓鏃跺垵濮嬪寲琛ㄥ崟
   form.value = {
     supplierName: "",
-    category: "",
+    coal: "",
     unit: "",
-    purchaseAmount: "",
-    priceBeforeTax: "",
-    totalBeforeTax: "",
-    calorificValue: "",
-    registrant: "",
-    registrationDate: new Date().toISOString().split('T')[0]
-  };  dialogFormVisible.value = true;
-  console.log("openDialog 璁剧疆 dialogFormVisible =", dialogFormVisible.value);
+    purchaseQuantity: "",
+    priceExcludingTax: "",
+    totalPriceExcludingTax: "",
+    priceIncludingTax: "",
+    totalPriceIncludingTax: "",
+    taxRate: "",
+    registrantId: userInfo.value.userName,
+    registrationDate: new Date().toISOString().split("T")[0],
+  };
+  // 鏂板缓鏃朵篃闇�瑕佽缃� copyForm 鐢ㄤ簬閲嶇疆鍔熻兘
+  copyForm.value = JSON.parse(JSON.stringify(form.value));
+  dialogFormVisible.value = true;
 };
 
 // 鎻愪氦琛ㄥ崟
-const handleSubmit = () => {
-  // 鎷垮埌鎻愪氦鏁版嵁
+const handleSubmit = (val) => {
+  if (val.result.code !== 200) {
+    ElMessage.error("鎿嶄綔澶辫触锛�" + val.result.msg);
+    return;
+  }
+  ElMessage.success(val.title + val.result.msg);
   dialogFormVisible.value = false;
   getList();
 };
@@ -194,24 +224,20 @@
 };
 // 琛ㄦ牸缂栬緫鏂规硶
 const handleEdit = (row) => {
-    form.value = JSON.parse(JSON.stringify(row));
-    addOrEdit.value = "edit";
-    handleAddEdit()
+  form.value = JSON.parse(JSON.stringify(row));
+  addOrEdit.value = "edit";
+  handleAddEdit();
 };
 const handleDelete = () => {
   if (selectedRows.value.length === 0) {
     ElMessage.warning("璇烽�夋嫨瑕佸垹闄ょ殑鏁版嵁");
     return;
   }
-  ElMessageBox.confirm(
-    `纭鍒犻櫎閫変腑鐨� ${selectedRows.value.length} 鏉℃暟鎹悧锛焋,
-    "鎻愮ず",
-    {
-      confirmButtonText: "纭畾",
-      cancelButtonText: "鍙栨秷",
-      type: "warning"
-    }
-  )
+  ElMessageBox.confirm(`纭畾鍒犻櫎閫変腑鐨勬暟鎹悧锛焋, "鎻愮ず", {
+    confirmButtonText: "纭畾",
+    cancelButtonText: "鍙栨秷",
+    type: "warning",
+  })
     .then(() => {
       // 妯℃嫙鍒犻櫎鎿嶄綔
       tableData.value = tableData.value.filter(
@@ -223,20 +249,23 @@
     .catch(() => {
       ElMessage.info("宸插彇娑堝垹闄�");
     });
-}
+};
 const handleDeleteSuccess = (row) => {
   ElMessage.success("鍒犻櫎鎴愬姛锛�" + row.supplierName);
 };
 // 瀵煎嚭
 const handleExport = (row) => {
-  proxy.download("system/post/export", {
-    ...queryParams.value
-  }, `post_${new Date().getTime()}.xlsx`)
+  proxy.download(
+    "system/post/export",
+    {
+      ...queryParams.value,
+    },
+    `post_${new Date().getTime()}.xlsx`
+  );
   ElMessage.success("瀵煎嚭鏁版嵁锛�" + row.supplierName);
 };
 // 鎴愬姛
 const handleSuccess = (val) => {
-  console.log(val);
   tableData.value.push(val);
   // getList();
   total.value = tableData.value.length;
@@ -247,17 +276,15 @@
   try {
     // 浼犻�掑垎椤靛弬鏁�
     let res = await purchaseRegistration({
-      pageNum: pageNum.value,
+      current: current.value,
       pageSize: pageSize.value,
-      ...queryParams
+      ...queryParams,
     });
-    console.log("API杩斿洖鏁版嵁:", res);
     if (res && res.data) {
       tableData.value = res.data.records || [];
       total.value = res.data.total || 0;
     }
   } catch (error) {
-    console.error("鑾峰彇鏁版嵁澶辫触:", error);
     ElMessage.error("鑾峰彇鏁版嵁澶辫触");
   } finally {
     loading.value = false;
@@ -267,7 +294,7 @@
 </script>
 
 <style scoped>
-.app-container{
+.app-container {
   box-sizing: border-box;
 }
 .search-form {
@@ -310,10 +337,11 @@
   }
 }
 /* 琛ㄦ牸宸ュ叿鏍� */
-.table-toolbar, .table-toolbar > * {
+.table-toolbar,
+.table-toolbar > * {
   margin: 0 0 0 0 !important;
 }
-.table-toolbar{
+.table-toolbar {
   margin-bottom: 20px !important;
 }
-</style>
\ No newline at end of file
+</style>

--
Gitblit v1.9.3