From 0d72650b6efe87097b117d9eac9a340227b483ed Mon Sep 17 00:00:00 2001
From: 张诺 <zhang_12370@163.com>
Date: 星期三, 04 六月 2025 16:58:51 +0800
Subject: [PATCH] 后端联调供应商模块 完善页面

---
 src/views/basicInformation/index.vue |  433 ++++++++++++++++--------------------------------------
 1 files changed, 129 insertions(+), 304 deletions(-)

diff --git a/src/views/basicInformation/index.vue b/src/views/basicInformation/index.vue
index 9a35c6a..e2007e9 100644
--- a/src/views/basicInformation/index.vue
+++ b/src/views/basicInformation/index.vue
@@ -1,119 +1,43 @@
 <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
-          />
-        </el-form-item>
-        <el-form-item label="渚涘簲鍟嗗悕绉�">
-          <el-input
-            v-model="queryParams.supplierName"
-            placeholder="璇疯緭鍏�"
-            clearable
-          />
-        </el-form-item>
-        <el-form-item label="缁熶竴浜鸿瘑鍒彿">
-          <el-input
-            v-model="queryParams.identifyNumber"
-            placeholder="璇疯緭鍏�"
-            clearable
-          />
-        </el-form-item>
-        <el-form-item label="缁忚惀鍦板潃">
-          <el-input
-            v-model="queryParams.address"
-            placeholder="璇疯緭鍏�"
-            clearable
-          />
-        </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>
+  <div>
+    <el-form :inline="true" :model="queryParams" class="search-form">
+      <el-form-item label="渚涘簲鍟嗗悕绉�">
+        <el-input v-model="queryParams.searchAll" placeholder="璇疯緭鍏ュ叧閿瘝" clearable />
+      </el-form-item>
+  
+      <el-form-item>
+        <el-button type="primary" @click="getList">鏌ヨ</el-button>
+        <el-button @click="resetQuery">閲嶇疆</el-button>
+      </el-form-item>
+    </el-form>
     <el-card>
       <!-- 鏍囩椤� -->
-      <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 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
-        >
+        <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-row>
       <!-- 琛ㄦ牸缁勪欢 -->
       <div>
-        <data-table
-          :loading="loading"
-          :table-data="tableData"
-          :columns="columns"
-          @selection-change="handleSelectionChange"
-          @edit="handleEdit"
-          @delete="handleDeleteSuccess"
-          :show-selection="true"
-          :border="true"
-          :maxHeight="480"
-        />
-      </div>
-      <pagination
-        v-if="total>0"
-        :page-num="pageNum"
-        :page-size="pageSize"
-        :total="total"
-        @pagination="handleQuery"
-        :layout="'total, prev, pager, next, jumper'"
-      />
-      <Supplier
-        v-if="tabName === 'supplier'"
-        v-model:supplierDialogFormVisible="dialogFormVisible"
-        :form="form"
-        :title="title"
-        @submit="handleSubmit"
-        @beforeClose="handleBeforeClose"
-        @update:dialogFormVisible="handleDialogFormVisible"
-        :addOrEdit="addOrEdit"
-      />
-      <Customer
-        v-if="tabName === 'customer'"
-        v-model:customerDialogFormVisible="dialogFormVisible"
-        :form="form"
-        :title="title"
-        @submit="handleSubmit"
-        :addOrEdit="addOrEdit"
-        @beforeClose="handleBeforeClose"
-      />
-      <Coal
-        v-if="tabName === 'coal'"
-        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"
-      />
+        <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"
+        :layout="'total, prev, pager, next, jumper'" />
+      <Supplier v-if="tabName === 'supplier'" v-model:supplierDialogFormVisible="dialogFormVisible" :form="form"
+        :title="title" @submit="handleSubmit" @beforeClose="handleBeforeClose"
+        @update:dialogFormVisible="handleDialogFormVisible" :addOrEdit="addOrEdit" />
+      <Customer v-if="tabName === 'customer'" v-model:customerDialogFormVisible="dialogFormVisible" :form="form"
+        :title="title" @submit="handleSubmit" :addOrEdit="addOrEdit" @beforeClose="handleBeforeClose" />
+      <Coal v-if="tabName === 'coal'" 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" />
     </el-card>
   </div>
 </template>
@@ -129,6 +53,9 @@
 import Coal from "./mould/coal.vue";
 import coalQualityMaintenance from "./mould/coalQualityMaintenance.vue";
 const { proxy } = getCurrentInstance()
+import { getSupply, addOrEditSupply, delSupply } from "@/api/basicInformation/supplier.js";
+import { getCoalInfo, addOrEditCoalInfo } from "@/api/basicInformation/coal.js";
+import { getCoalQuality, addOrEditCoalQuality } from "@/api/basicInformation/coalQualityMaintenance.js";
 // 寮圭獥
 const coalQualityMaintenanceDialogFormVisible = ref(false);
 const customerDialogFormVisible = ref(false);
@@ -144,7 +71,7 @@
 const loading = ref(false);
 const total = ref(0);
 const pageNum = ref(1);
-const pageSize = ref(10);
+const pageSizes = ref(10);
 const activeTab = ref("supplier");
 const selectedRows = ref([]);
 // 鏌ヨ鍙傛暟
@@ -169,25 +96,22 @@
 const addOrEdit = ref("add");
 // 琛ㄦ牸鏁版嵁
 const tableData = ref([]);
-// 鏂规硶瀹氫箟
+// 鏌ヨ鏂规硶
 const handleQuery = () => {
-  loading.value = true;
-  setTimeout(() => {
-    loading.value = false;
-  }, 500);
+
 };
 // supplier 渚涘簲鍟嗘暟鎹�
 const supplierColumns = ref([
   { prop: "supplierName", label: "渚涘簲鍟嗗悕绉�", minWidth: 200 },
-  { prop: "identifyNumber", label: "缁熶竴浜鸿瘑鍒彿", minWidth: 120 },
-  { prop: "address", label: "缁忚惀鍦板潃", minWidth: 150 },
-  { prop: "detailedaddress", label: "璇︾粏鍦板潃", minWidth: 150 },
-  { prop: "bank", label: "寮�鎴疯", minWidth: 120 },
-  { prop: "bankAccount", label: "閾惰璐﹀彿", minWidth: 150 },
-  { prop: "contacts", label: "鑱旂郴浜�", minWidth: 100 },
+  { prop: "taxpayerId", label: "缁熶竴浜鸿瘑鍒彿", minWidth: 120 },
+  { prop: "businessAddress", label: "缁忚惀鍦板潃", minWidth: 150 },
+  { prop: "bids", label: "璇︾粏鍦板潃", minWidth: 150 },
+  { prop: "bankAccount", label: "寮�鎴疯", minWidth: 120 },
+  { prop: "bankName", label: "閾惰璐﹀彿", minWidth: 150 },
+  { prop: "contactPerson", label: "鑱旂郴浜�", minWidth: 100 },
   { prop: "contactAddress", label: "鑱旂郴鍦板潃", minWidth: 150 },
   { prop: "maintainer", label: "缁存姢浜�", minWidth: 100 },
-  { prop: "maintainDate", label: "缁存姢鏃ユ湡", minWidth: 100 },
+  { prop: "createTime", label: "缁存姢鏃ユ湡", minWidth: 100 },
 ]);
 // customer 瀹㈡埛鏁版嵁
 const customerColumns = ref([
@@ -205,7 +129,7 @@
 // coal 鐓ょ鏁版嵁
 const coalColumns = ref([
   { prop: "coalName", label: "鐓ょ鍚嶇О", minWidth: 200 },
-  { prop: "maintainer", label: "缁存姢浜�", minWidth: 120 },
+  { prop: "maintainerId", label: "缁存姢浜�", minWidth: 120 },
   { prop: "maintenanceDate", label: "缁存姢鏃ユ湡", minWidth: 150 },
 ]);
 // coalQualityMaintenance 鐓よ川缁存姢鏁版嵁
@@ -222,42 +146,41 @@
 // 鏍囩椤电偣鍑�
 const handleTabClick = (tab) => {
   form.value = {};
-  getList();
   addOrEdit.value = "add";
   loading.value = true;
   tabName.value = tab.props.name;
   tableData.value = [];
-  getList();
   switch (tabName.value) {
     case "supplier":
       columns.value = supplierColumns.value;
       dialogFormVisible.value = supplierDialogFormVisible.value;
+      getList("supplier");
       break;
     case "customer":
       columns.value = customerColumns.value;
       dialogFormVisible.value = customerDialogFormVisible.value;
+      getList("customer");
+
       break;
     case "coal":
       columns.value = coalColumns.value;
       dialogFormVisible.value = coalDialogFormVisible.value;
+      getList("coal");
       break;
     case "coalQualityMaintenance":
       columns.value = coalQualityMaintenanceColumns.value;
       dialogFormVisible.value = coalQualityMaintenanceDialogFormVisible.value;
+      getList("coalQualityMaintenance");
       break;
   }
-  setTimeout(() => {
-    loading.value = false;
-  }, 500);
 };
 // 閲嶇疆鏌ヨ
 const resetQuery = () => {
   Object.keys(queryParams).forEach((key) => {
-    if (key !== "pageNum" && key !== "pageSize") {
+    if (key !== "pageNum" && key !== "pageSizes") {
       queryParams[key] = "";
     }
   });
-  handleQuery();
 };
 // 鏂板
 const handleAdd = () => {
@@ -295,16 +218,22 @@
   form.value = {};
   dialogFormVisible.value = true;
 };
-// 鎻愪氦琛ㄥ崟
-const handleSubmit = () => {
-  // 鎷垮埌鎻愪氦鏁版嵁
-  dialogFormVisible.value = false;
-  if (addOrEdit.value === "add") {
-    ElMessage.success("鏂板鎴愬姛锛�" + copyForm.value.supplierName);
-  } else {
-    ElMessage.success("缂栬緫鎴愬姛锛�" + copyForm.value.supplierName);
-  }
+// 鍒嗛〉
+const handPagination = (val) => {
+  console.log("鍒嗛〉鍙傛暟锛�", val);
+  pageNum.value = val.page;
+  pageSizes.value = val.limit;
   getList();
+};
+// 鎻愪氦琛ㄥ崟
+const handleSubmit = async (val) => {
+  console.log(val)
+  if (val.code !== 200) {
+    ElMessage.error("鎿嶄綔澶辫触锛�" + result.msg);
+    return;
+  }
+  ElMessage.success("鏂板鎴愬姛锛�" + result.msg);
+  dialogFormVisible.value = false;
 };
 const handleDialogFormVisible = (value) => {
   dialogFormVisible.value = value;
@@ -315,9 +244,9 @@
 };
 // 缂栬緫
 const handleEdit = (row) => {
-    form.value = JSON.parse(JSON.stringify(row));
-    addOrEdit.value = "edit";
-    handleAddEdit(tabName.value);
+  form.value = JSON.parse(JSON.stringify(row));
+  addOrEdit.value = "edit";
+  handleAddEdit(tabName.value);
 };
 // 鎵归噺鍒犻櫎
 const handleDelete = () => {
@@ -325,29 +254,30 @@
     ElMessage.warning("璇烽�夋嫨瑕佸垹闄ょ殑鏁版嵁");
     return;
   }
+  let arr = reactive([]);
+  selectedRows.value.forEach(element => {
+    return arr.push(element.id);
+  });
+  console.log("閫変腑鐨勬暟鎹甀D锛�", arr);
   ElMessageBox.confirm("纭畾鍒犻櫎閫変腑鐨勬暟鎹悧锛�", "鎻愮ず", {
     confirmButtonText: "纭畾",
     cancelButtonText: "鍙栨秷",
     type: "warning",
   })
-    .then(() => {
-      ElMessage.success("鍒犻櫎鎴愬姛锛屽叡鍒犻櫎" + selectedRows.value.length + "鏉℃暟鎹�");
-      selectedRows.value.forEach((row) => {
-        tableData.value = tableData.value.filter(
-          (item) => item !== row
-        );
-      });
-      total.value = tableData.value.length;
-      // 娓呯┖閫変腑琛�
-      selectedRows.value = [];
-  }).catch(() => {
-    ElMessage.info("宸插彇娑堝垹闄ゆ搷浣�");
-  });
+    .then(async () => {
+      try {
+        let res = await delSupply(arr)
+        console.log(res)
+        selectedRows.value = [];
+        getlist()
+      } catch {
+        ElMessage.error("鍒犻櫎澶辫触锛岃绋嶅悗鍐嶈瘯");
+        return;
+      }
+    }).catch(() => {
+      ElMessage.info("宸插彇娑堝垹闄ゆ搷浣�");
+    });
 }
-// 琛ㄦ牸鍒犻櫎
-const handleDeleteSuccess = (row) => {
-  ElMessage.success("鍒犻櫎鎴愬姛锛�" + row.supplierName);
-};
 // 鍏抽棴寮圭獥
 const handleBeforeClose = () => {
   dialogFormVisible.value = false;
@@ -359,153 +289,39 @@
   }, `post_${new Date().getTime()}.xlsx`)
   ElMessage.success("瀵煎嚭鏁版嵁锛�" + row.supplierName);
 };
-const getList = () => {
+// 閫夋嫨鎺ュ彛
+const selectInterface = () => {
+  if (tabName.value === "supplier") {
+    return getSupply({
+      current: pageNum.value,
+      pageSize: pageSizes.value,
+      searchAll: queryParams.searchAll,
+    });
+  } else if (tabName.value === "customer") {
+    return getSupply({
+      current: pageNum.value,
+      pageSize: pageSizes.value,
+      ...queryParams
+    });
+  } else if (tabName.value === "coal") {
+    console.log(addOrEdit.value)
+    return getCoalInfo();
+  } else if (tabName.value === "coalQualityMaintenance") {
+    return getCoalQuality({
+      current: pageNum.value,
+      pageSize: pageSizes.value,
+      ...queryParams
+    });
+  }
+}
+const getList = async () => {
   loading.value = true;
-
-  setTimeout(() => {
-    // 鏆傛椂寮曞叆娴嬭瘯鏁版嵁
-    tableData.value = [
-      {
-        supplierName: "涓浗鍐堕噾绉戝伐鑲′唤鏈夐檺鍏徃",
-        identifyNumber: "123412123123123111",
-        address: "灞辫タ鐪�",
-        bank: "浜ら�氶摱琛�",
-        bankAccount: "901234567890123456",
-        contacts: "鏉庨洩鑺�",
-        contactAddress: "XX鐪乆X甯俋X鍖篨X璺�",
-        maintainer: "鏉庨洩鑺�",
-        maintainDate: "2022-09-26",
-        contactsPhone: "19345678901",
-      },
-      {
-        supplierName: "涓浗鍐堕噾绉戝伐鑲′唤鏈夐檺鍏徃",
-        identifyNumber: "123412123123123111",
-        address: "灞辫タ鐪�",
-        bank: "浜ら�氶摱琛�",
-        bankAccount: "901234567890123456",
-        contacts: "鏉庨洩鑺�",
-        contactAddress: "XX鐪乆X甯俋X鍖篨X璺�",
-        maintainer: "鏉庨洩鑺�",
-        maintainDate: "2022-09-26",
-        contactsPhone: "19345678901",
-      },
-      {
-        supplierName: "涓浗鍐堕噾绉戝伐鑲′唤鏈夐檺鍏徃",
-        identifyNumber: "123412123123123111",
-        address: "灞辫タ鐪�",
-        bank: "浜ら�氶摱琛�",
-        bankAccount: "901234567890123456",
-        contacts: "鏉庨洩鑺�",
-        contactAddress: "XX鐪乆X甯俋X鍖篨X璺�",
-        maintainer: "鏉庨洩鑺�",
-        maintainDate: "2022-09-26",
-        contactsPhone: "19345678901",
-      },
-      {
-        supplierName: "浜ら�氶摱琛岃偂浠芥湁闄愬叕鍙�",
-        identifyNumber: "042-26881314",
-        address: "姹熻タ鐪�",
-        bank: "骞冲畨閾惰",
-        bankAccount: "123456789012345678",
-        contacts: "鍛ㄧ櫧鐜�",
-        contactAddress: "XX鐪乆X甯俋X鍖篨X璺�",
-        maintainer: "鍛ㄧ櫧鐜�",
-        maintainDate: "2022-08-29",
-      },
-      {
-        supplierName: "涓浗鍐堕噾绉戝伐鑲′唤鏈夐檺鍏徃",
-        identifyNumber: "019-65851198",
-        address: "灞辫タ鐪�",
-        bank: "浜ら�氶摱琛�",
-        bankAccount: "901234567890123456",
-        contacts: "鏉庨洩鑺�",
-        contactAddress: "XX鐪乆X甯俋X鍖篨X璺�",
-        maintainer: "鏉庨洩鑺�",
-        maintainDate: "2022-09-26",
-      },
-      {
-        supplierName: "浜ら�氶摱琛岃偂浠芥湁闄愬叕鍙�",
-        identifyNumber: "042-26881314",
-        address: "姹熻タ鐪�",
-        bank: "骞冲畨閾惰",
-        bankAccount: "123456789012345678",
-        contacts: "鍛ㄧ櫧鐜�",
-        contactAddress: "XX鐪乆X甯俋X鍖篨X璺�",
-        maintainer: "鍛ㄧ櫧鐜�",
-        maintainDate: "2022-08-29",
-      },
-      {
-        supplierName: "涓浗鍐堕噾绉戝伐鑲′唤鏈夐檺鍏徃",
-        identifyNumber: "019-65851198",
-        address: "灞辫タ鐪�",
-        bank: "浜ら�氶摱琛�",
-        bankAccount: "901234567890123456",
-        contacts: "鏉庨洩鑺�",
-        contactAddress: "XX鐪乆X甯俋X鍖篨X璺�",
-        maintainer: "鏉庨洩鑺�",
-        maintainDate: "2022-09-26",
-      },
-      {
-        supplierName: "浜ら�氶摱琛岃偂浠芥湁闄愬叕鍙�",
-        identifyNumber: "042-26881314",
-        address: "姹熻タ鐪�",
-        bank: "骞冲畨閾惰",
-        bankAccount: "123456789012345678",
-        contacts: "鍛ㄧ櫧鐜�",
-        contactAddress: "XX鐪乆X甯俋X鍖篨X璺�",
-        maintainer: "鍛ㄧ櫧鐜�",
-        maintainDate: "2022-08-29",
-      },
-      {
-        supplierName: "涓浗鍐堕噾绉戝伐鑲′唤鏈夐檺鍏徃",
-        identifyNumber: "019-65851198",
-        address: "灞辫タ鐪�",
-        bank: "浜ら�氶摱琛�",
-        bankAccount: "901234567890123456",
-        contacts: "鏉庨洩鑺�",
-        contactAddress: "XX鐪乆X甯俋X鍖篨X璺�",
-        maintainer: "鏉庨洩鑺�",
-        maintainDate: "2022-09-26",
-      },
-      {
-        supplierName: "浜ら�氶摱琛岃偂浠芥湁闄愬叕鍙�",
-        identifyNumber: "042-26881314",
-        address: "姹熻タ鐪�",
-        bank: "骞冲畨閾惰",
-        bankAccount: "123456789012345678",
-        contacts: "鍛ㄧ櫧鐜�",
-        contactAddress: "XX鐪乆X甯俋X鍖篨X璺�",
-        maintainer: "鍛ㄧ櫧鐜�",
-        maintainDate: "2022-08-29",
-      },
-      {
-        supplierName: "涓浗鍐堕噾绉戝伐鑲′唤鏈夐檺鍏徃",
-        identifyNumber: "019-65851198",
-        address: "灞辫タ鐪�",
-        bank: "浜ら�氶摱琛�",
-        bankAccount: "901234567890123456",
-        contacts: "鏉庨洩鑺�",
-        contactAddress: "XX鐪乆X甯俋X鍖篨X璺�",
-        maintainer: "鏉庨洩鑺�",
-        maintainDate: "2022-09-26",
-      },
-      {
-        supplierName: "浜ら�氶摱琛岃偂浠芥湁闄愬叕鍙�",
-        identifyNumber: "042-26881314",
-        address: "姹熻タ鐪�",
-        bank: "骞冲畨閾惰",
-        bankAccount: "123456789012345678",
-        contacts: "鍛ㄧ櫧鐜�",
-        contactAddress: "XX鐪乆X甯俋X鍖篨X璺�",
-        maintainer: "鍛ㄧ櫧鐜�",
-        maintainDate: "2022-08-29",
-      },
-    ];
-    total.value = tableData.value.length;
-    loading.value = false;
-  }, 500);
+  let { data, code } = await selectInterface()
+  console.log(data)
+  tableData.value = data.records;
+  total.value = data.total;
+  loading.value = false;
 };
-getList();
 </script>
 
 <style scoped>
@@ -515,37 +331,46 @@
     width: 50%;
   }
 }
+
 @media screen and (min-width: 1200px) {
   .search-form :deep(.el-form-item) {
     width: 16%;
   }
 }
+
 .table-toolbar {
   margin-bottom: 20px;
   display: flex;
   flex-wrap: wrap;
   gap: 10px;
 }
+
 /* 鍝嶅簲寮忚〃鏍� */
 @media screen and (max-width: 768px) {
   .table-toolbar {
     flex-direction: column;
   }
+
   .table-toolbar .el-button {
     width: 100%;
   }
 }
+
 /* 琛ㄦ牸宸ュ叿鏍� */
-.table-toolbar, .table-toolbar > * {
+.table-toolbar,
+.table-toolbar>* {
   margin: 0 0 0 0 !important;
 }
-.table-toolbar{
+
+.table-toolbar {
   margin-bottom: 20px !important;
 }
+
 .el-form--inline .el-form-item {
   margin-right: 25px;
 }
-.main-container{
+
+.main-container {
   background: red !important;
 }
 </style>
\ No newline at end of file

--
Gitblit v1.9.3