From 02ecd75c6ba81122086b9cf75a2cf6d703eb3020 Mon Sep 17 00:00:00 2001
From: 张诺 <zhang_12370@163.com>
Date: 星期五, 23 五月 2025 18:01:18 +0800
Subject: [PATCH] 采购管理>供应商往来=>书写页面样式以及页面交互逻辑 采购管理>付款登记=>编辑无登记人问题

---
 src/views/procurementManagement/paymentLedger/index.vue |  231 +++++++++++++++++++++++++++++++++++++++------------------
 1 files changed, 159 insertions(+), 72 deletions(-)

diff --git a/src/views/procurementManagement/paymentLedger/index.vue b/src/views/procurementManagement/paymentLedger/index.vue
index 628ea90..e7a576c 100644
--- a/src/views/procurementManagement/paymentLedger/index.vue
+++ b/src/views/procurementManagement/paymentLedger/index.vue
@@ -2,111 +2,198 @@
   <div class="app-container">
     <div class="search_form">
       <div>
-        <span class="search_title">渚涘簲鍟嗘。妗堬細</span>
+        <span class="search_title">浠樻鍙拌处锛�</span>
         <el-input
-            v-model="searchForm.supplierName"
-            style="width: 240px"
-            placeholder="杈撳叆渚涘簲鍟嗗悕绉版悳绱�"
-            @change="handleQuery"
-            clearable
-            :prefix-icon="Search"
+          v-model="searchForm.supplierNameOrContractNo"
+          style="width: 240px"
+          placeholder="杈撳叆渚涘簲鍟嗗悕绉�"
+          @change="handleQuery"
+          clearable
+          :prefix-icon="Search"
         />
-        <el-button type="primary" @click="handleQuery" style="margin-left: 10px">鎼滅储</el-button>
+        <el-button type="primary" @click="handleQuery" style="margin-left: 10px"
+          >鎼滅储</el-button
+        >
+      </div>
+      <div>
       </div>
     </div>
-    <div class="table_list">
-      <PIMTable :column="tableColumn" :tableData="tableData" :page="page" :isShowSummary="true" style="width: 50%" :highlightCurrentRow="true"
-                :tableLoading="tableLoading" @pagination="pagination" :total="total" :row-click="setTableData"></PIMTable>
-      <PIMTable :column="tableColumn1" :tableData="tableData1" :isShowSummary="true" style="width: 50%"></PIMTable>
-    </div>
+    <el-row>
+      <el-col :span="14">
+        <div class="table_list">
+          <PIMTable
+            :column="tableColumn"
+            :tableData="tableData"
+            :page="page"
+            :isSelection="false"
+            :handleSelectionChange="handleSelectionChange"
+            :tableLoading="tableLoading"
+            @pagination="pagination"
+            :total="total"
+            :rowClick="rowClick"
+            :isShowSummary="isShowSummary"
+            :highlight-current-row="true"
+          ></PIMTable>
+        </div>
+      </el-col>
+      <el-col :span="10">
+        <div class="table_list">
+          <PIMTable
+            :column="tableColumnSon"
+            :tableData="tableDataSon"
+            :page="pageSon"
+            :isSelection="false"
+            :tableLoading="tableLoadingSon"
+            @pagination="paginationSon"
+            :total="totalSon"
+            :isShowSummary="isShowSummarySon"
+          ></PIMTable>
+        </div>
+      </el-col>
+    </el-row>
   </div>
 </template>
 
 <script setup>
-import { ref } from 'vue'
-import {Search} from "@element-plus/icons-vue";
-import {paymentLedgerList} from "@/api/procurementManagement/paymentLedger.js";
+import { ref, toRefs } from "vue";
+import { Search } from "@element-plus/icons-vue";
+import { paymentLedgerList } from "@/api/procurementManagement/paymentLedger.js";
 
 const tableColumn = ref([
   {
-    label: '渚涘簲鍟嗗悕绉�',
-    prop: 'supplierName',
+    label: "渚涘簲鍟嗗悕绉�",
+    prop: "supplierName",
   },
   {
-    label: '鏉ョエ閲戦(鍏�)',
-    prop: 'invoiceAmount'
+    label: "鍙戠エ閲戦(鍏�)",
+    prop: "invoiceAmount",
   },
   {
-    label: '浠樻閲戦(鍏�)',
-    prop: 'paymentAmount'
+    label: "浠樻閲戦(鍏�)",
+    prop: "paymentAmount",
   },
   {
-    label: '搴斾粯娆鹃噾棰�(鍏�)',
-    prop: 'payableAmount'
+    label: "搴斾粯閲戦(鍏�)",
+    prop: "payableAmount",
   },
-])
-const tableColumn1 = ref([
-  {
-    label: '鍙戠敓鏃ユ湡',
-    prop: 'createTime',
+]);
+const tableLoading = ref(false);
+const data = reactive({
+  searchForm: {
+    supplierNameOrContractNo: "",
   },
-  {
-    label: '鏉ョエ鏁�',
-    prop: 'voteCount'
-  },
-  {
-    label: '浠樻閲戦(鍏�)',
-    prop: 'paymentAmount'
-  },
-  {
-    label: '搴斾粯娆鹃噾棰�(鍏�)',
-    prop: 'payableAmount'
-  },
-])
-const tableData = ref([])
-const tableData1 = ref([])
-const tableLoading = ref(false)
+});
 const page = reactive({
   current: 1,
   size: 10,
-})
-const total = ref(0)
+});
+const total = ref(0);
+const isShowSummary = ref(true);
+const tableData = ref([]);
+const { searchForm } = toRefs(data);
 
-// 鐢ㄦ埛淇℃伅琛ㄥ崟寮规鏁版嵁
-const data = reactive({
-  searchForm: {
-    supplierName: '',
+
+import {getInfo} from "@/api/login.js";
+const rowClick = async (row) => {
+  /* let res = await getInfo(row.id)
+  if (res.code === 200) {
+    proxy.$modal.msgSuccess("鑾峰彇鎴愬姛")
+    if(res.data == "" || res.data == null){
+      proxy.$modal.msgError("娌℃湁鏁版嵁")
+      return
+    }
+    rightShow.value = !rightShow.value
+    form.value = res.data
+
+  } else {
+    proxy.$modal.msgError(res.msg)
+  } */
+  tableDataSon.value.push(row);
+  if(tableDataSon.value.length > 10) {
+    tableDataSon.value = []
+  }
+}
+
+
+// 瀛愭ā鍧�
+const tableColumnSon = ref([
+  {
+    label: "渚涘簲鍟嗗悕绉�",
+    prop: "supplierName",
   },
-})
-const { searchForm } = toRefs(data)
+  {
+    label: "鍙戠エ閲戦(鍏�)",
+    prop: "invoiceAmount",
+  },
+  {
+    label: "浠樻閲戦(鍏�)",
+    prop: "paymentAmount",
+  },
+  {
+    label: "搴斾粯閲戦(鍏�)",
+    prop: "payableAmount",
+  },
+]);
+const tableDataSon = ref([]);
+const tableLoadingSon = ref(false);
+const pageSon = reactive({
+  current: 1,
+  size: 10,
+});
+const totalSon = ref(0);
+const isShowSummarySon = ref(true);
 
-// 鏌ヨ鍒楄〃
+
+
+
 /** 鎼滅储鎸夐挳鎿嶄綔 */
 const handleQuery = () => {
-  page.current = 1
-  getList()
-}
-const setTableData = (data) => {
-  tableData1.value = data.details
-}
+  page.current = 1;
+  getList();
+};
 const pagination = ({ current, limit }) => {
   page.current = current;
   page.size = limit;
-  getList()
-}
+  getList();
+};
+const paginationSon = ({ current, limit }) => {
+  pageSon.current = current;
+  pageSon.size = limit;
+  getList();
+};
 const getList = () => {
-  tableLoading.value = true
-  paymentLedgerList({...searchForm.value, ...page}).then(res => {
-    tableLoading.value = false
-    tableData.value = res.data
-    total.value = res.total
-  })
-}
-getList()
+  tableLoading.value = false;
+  paymentLedgerList({ ...searchForm.value, ...page }).then((res) => {
+    let result = res.data
+    tableLoading.value = false;
+    tableData.value = result;
+    total.value = result.total;
+  });
+};
+// 琛ㄦ牸閫夋嫨鏁版嵁
+const handleSelectionChange = (selection) => {
+  selectedRows.value = selection;
+};
+
+getList();
 </script>
 
 <style scoped lang="scss">
-.table_list {
-  display: flex;
+/* 閫変腑鏌愯鏃剁殑鑳屾櫙鑹�*/
+/* .el-table__body tr.current-row > td {
+  color: #c0c0c0;
+  background: #F6F7FB !important;
+} */
+.el-row {
+  .el-col-14 {
+    .table_list {
+      padding-right: 0px;
+    }
+  }
+  .el-col-10 {
+    .table_list {
+      padding-left: 0px;
+    }
+  }
 }
 </style>

--
Gitblit v1.9.3