From 4d3d3012fe57eb26a9eb39ba41f231a5352cdd3b Mon Sep 17 00:00:00 2001
From: zhangwencui <1064582902@qq.com>
Date: 星期三, 27 五月 2026 17:25:59 +0800
Subject: [PATCH] 人员薪资增加详情功能

---
 src/views/personnelManagement/monthlyStatistics/components/Show.vue |  127 ++++++++
 src/views/personnelManagement/monthlyStatistics/index.vue           |  723 ++++++++++++++++++++++++-----------------------
 2 files changed, 499 insertions(+), 351 deletions(-)

diff --git a/src/views/personnelManagement/monthlyStatistics/components/Show.vue b/src/views/personnelManagement/monthlyStatistics/components/Show.vue
new file mode 100644
index 0000000..9124ef3
--- /dev/null
+++ b/src/views/personnelManagement/monthlyStatistics/components/Show.vue
@@ -0,0 +1,127 @@
+<template>
+  <el-dialog v-model="visible"
+             title="宸ヨ祫琛ㄨ鎯�"
+             width="90%"
+             append-to-body>
+    <div class="detail-container">
+      <!-- 涓昏〃淇℃伅 -->
+      <el-descriptions title="鍩虹淇℃伅" :column="4" border>
+        <el-descriptions-item label="宸ヨ祫涓婚">{{ mainInfo.salaryTitle }}</el-descriptions-item>
+        <el-descriptions-item label="宸ヨ祫鏈堜唤">{{ mainInfo.salaryMonth }}</el-descriptions-item>
+        <el-descriptions-item label="宸ヨ祫鎬婚">
+          <span class="text-danger">楼 {{ (mainInfo.totalSalary || 0).toFixed(2) }}</span>
+        </el-descriptions-item>
+        <el-descriptions-item label="鐘舵��">
+          <el-tag :type="getStatusType(mainInfo.status)">{{ getStatusLabel(mainInfo.status) }}</el-tag>
+        </el-descriptions-item>
+        <el-descriptions-item label="瀹℃牳浜�">{{ mainInfo.auditUserName }}</el-descriptions-item>
+        <el-descriptions-item label="鏀粯閾惰">{{ mainInfo.payBank || '-' }}</el-descriptions-item>
+        <el-descriptions-item label="鍒涘缓鏃堕棿">{{ mainInfo.createTime }}</el-descriptions-item>
+        <el-descriptions-item label="澶囨敞">{{ mainInfo.remark || '-' }}</el-descriptions-item>
+      </el-descriptions>
+
+      <!-- 鏄庣粏鍒楄〃 -->
+      <div class="detail-table-wrap">
+        <div class="table-title">宸ヨ祫鏄庣粏</div>
+        <el-table :data="detailList" border stripe max-height="500">
+          <el-table-column label="閮ㄩ棬" prop="deptName" minWidth="120" />
+          <el-table-column label="鍛樺伐濮撳悕" prop="staffName" minWidth="100" />
+          <el-table-column label="姘戞棌" prop="nation" width="80" align="center" />
+          <el-table-column label="鍩烘湰宸ヨ祫" prop="basicSalary" minWidth="100" align="right" />
+          <el-table-column label="鐧界彮澶╂暟" prop="dayDays" width="90" align="center" />
+          <el-table-column label="澶滅彮澶╂暟" prop="nightDays" width="90" align="center" />
+          <el-table-column label="椁愯ˉ" prop="mealAmount" minWidth="100" align="right" />
+          <el-table-column label="澶滅彮琛ュ姪" prop="nightAmount" minWidth="100" align="right" />
+          <el-table-column label="鍏朵粬鏀跺叆" prop="otherIncome" minWidth="100" align="right" />
+          <el-table-column label="绀句繚涓汉" prop="socialPersonal" minWidth="100" align="right" />
+          <el-table-column label="鍏Н閲戜釜浜�" prop="fundPersonal" minWidth="110" align="right" />
+          <el-table-column label="鍏朵粬鏀嚭" prop="otherDeduct" minWidth="100" align="right" />
+          <el-table-column label="绀句繚琛ョ即" prop="socialSecurityRetroactive" minWidth="100" align="right" />
+          <el-table-column label="宸ヨ祫涓◣" prop="salaryTax" minWidth="100" align="right" />
+          <el-table-column label="搴斿彂宸ヨ祫" prop="grossSalary" minWidth="110" align="right">
+            <template #default="{ row }">
+              <span class="text-bold">{{ row.grossSalary }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="搴旀墸宸ヨ祫" prop="deductSalary" minWidth="110" align="right">
+            <template #default="{ row }">
+              <span class="text-danger">{{ row.deductSalary }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="瀹炲彂宸ヨ祫" prop="netSalary" minWidth="110" align="right">
+            <template #default="{ row }">
+              <span class="text-success text-bold">{{ row.netSalary }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="澶囨敞" prop="remark" minWidth="120" show-overflow-tooltip />
+        </el-table>
+      </div>
+    </div>
+    <template #footer>
+      <el-button @click="visible = false">鍏� 闂�</el-button>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+
+const visible = ref(false);
+const mainInfo = ref({});
+const detailList = ref([]);
+
+const openDialog = (row) => {
+  mainInfo.value = row || {};
+  detailList.value = row.staffSalaryDetailList || [];
+  visible.value = true;
+};
+
+const getStatusType = (status) => {
+  const map = {
+    1: 'info',    // 鑽夌
+    2: 'warning', // 寰呮敮浠�
+    3: 'primary', // 寰呭鏍�
+    4: 'success', // 宸插彂鏀�
+    5: 'danger'   // 宸查┏鍥�
+  };
+  return map[status] || 'info';
+};
+
+const getStatusLabel = (status) => {
+  const map = {
+    1: '鑽夌',
+    2: '寰呮敮浠�',
+    3: '寰呭鏍�',
+    4: '宸插彂鏀�',
+    5: '宸查┏鍥�'
+  };
+  return map[status] || '鏈煡';
+};
+
+defineExpose({ openDialog });
+</script>
+
+<style scoped lang="scss">
+.detail-container {
+  padding: 10px;
+}
+.detail-table-wrap {
+  margin-top: 20px;
+}
+.table-title {
+  font-size: 16px;
+  font-weight: bold;
+  margin-bottom: 15px;
+  padding-left: 10px;
+  border-left: 4px solid #409eff;
+}
+.text-danger {
+  color: #f56c6c;
+}
+.text-success {
+  color: #67c23a;
+}
+.text-bold {
+  font-weight: bold;
+}
+</style>
diff --git a/src/views/personnelManagement/monthlyStatistics/index.vue b/src/views/personnelManagement/monthlyStatistics/index.vue
index 4ac9e97..c008a39 100644
--- a/src/views/personnelManagement/monthlyStatistics/index.vue
+++ b/src/views/personnelManagement/monthlyStatistics/index.vue
@@ -3,33 +3,39 @@
     <div class="search_form">
       <div>
         <span class="search_title">涓婚锛�</span>
-        <el-input
-          v-model="searchForm.salaryTitle"
-          style="width: 240px"
-          placeholder="璇疯緭鍏ヤ富棰�"
-          clearable
-          @keyup.enter="handleQuery"
-        />
+        <el-input v-model="searchForm.salaryTitle"
+                  style="width: 240px"
+                  placeholder="璇疯緭鍏ヤ富棰�"
+                  clearable
+                  @keyup.enter="handleQuery" />
         <span class="search_title ml10">鐘舵�侊細</span>
-        <el-select v-model="searchForm.status" placeholder="璇烽�夋嫨鐘舵��" clearable style="width: 180px">
-          <el-option label="鑽夌" :value="1" />
-          <el-option label="瀹℃牳鏈�氳繃" :value="2" />
-          <el-option label="寰呭鏍�" :value="3" />
-          <el-option label="寰呭彂鏀�" :value="4" />
-          <el-option label="宸插彂鏀�" :value="5" />
+        <el-select v-model="searchForm.status"
+                   placeholder="璇烽�夋嫨鐘舵��"
+                   clearable
+                   style="width: 180px">
+          <el-option label="鑽夌"
+                     :value="1" />
+          <el-option label="瀹℃牳鏈�氳繃"
+                     :value="2" />
+          <el-option label="寰呭鏍�"
+                     :value="3" />
+          <el-option label="寰呭彂鏀�"
+                     :value="4" />
+          <el-option label="宸插彂鏀�"
+                     :value="5" />
         </el-select>
         <span class="search_title ml10">宸ヨ祫鏈堜唤锛�</span>
-        <el-date-picker
-          v-model="searchForm.salaryMonth"
-          type="month"
-          value-format="YYYY-MM"
-          format="YYYY-MM"
-          placeholder="璇烽�夋嫨宸ヨ祫鏈堜唤"
-          style="width: 180px"
-          clearable
-          @change="handleQuery"
-        />
-        <el-button type="primary" @click="handleQuery" style="margin-left: 10px">
+        <el-date-picker v-model="searchForm.salaryMonth"
+                        type="month"
+                        value-format="YYYY-MM"
+                        format="YYYY-MM"
+                        placeholder="璇烽�夋嫨宸ヨ祫鏈堜唤"
+                        style="width: 180px"
+                        clearable
+                        @change="handleQuery" />
+        <el-button type="primary"
+                   @click="handleQuery"
+                   style="margin-left: 10px">
           鎼滅储
         </el-button>
         <el-button @click="handleReset">閲嶇疆</el-button>
@@ -37,371 +43,386 @@
     </div>
     <div class="table_list">
       <div style="margin-bottom: 10px;text-align: right">
-        <el-button type="primary" @click="openForm('add')">鏂板缓宸ヨ祫琛�</el-button>
+        <el-button type="primary"
+                   @click="openForm('add')">鏂板缓宸ヨ祫琛�</el-button>
         <el-button @click="handleDelete">鍒犻櫎</el-button>
         <el-button @click="openBankSetting">璁剧疆閾惰</el-button>
         <el-button @click="handleExport">瀵煎嚭</el-button>
       </div>
-      <PIMTable
-        rowKey="id"
-        :column="tableColumn"
-        :tableData="tableData"
-        :page="page"
-        :isSelection="true"
-        :tableLoading="tableLoading"
-        @selection-change="handleSelectionChange"
-        @pagination="pagination"
-        :total="page.total"
-      />
+      <PIMTable rowKey="id"
+                :column="tableColumn"
+                :tableData="tableData"
+                :page="page"
+                :isSelection="true"
+                :tableLoading="tableLoading"
+                @selection-change="handleSelectionChange"
+                @pagination="pagination"
+                :total="page.total" />
     </div>
-    <form-dia
-      v-model="dialogVisible"
-      :operation-type="operationType"
-      :row="currentRow"
-      ref="formDiaRef"
-      @close="handleQuery"
-    />
-    <bank-setting-dia
-      v-model="bankDialogVisible"
-      ref="bankDiaRef"
-      @saved="handleBankSaved"
-    />
-    <el-dialog v-model="issueDialogVisible" title="宸ヨ祫鍙戞斁" width="720px">
+    <form-dia v-model="dialogVisible"
+              :operation-type="operationType"
+              :row="currentRow"
+              ref="formDiaRef"
+              @close="handleQuery" />
+    <bank-setting-dia v-model="bankDialogVisible"
+                      ref="bankDiaRef"
+                      @saved="handleBankSaved" />
+    <el-dialog v-model="issueDialogVisible"
+               title="宸ヨ祫鍙戞斁"
+               width="720px">
       <el-form label-position="top">
-        <el-form-item label="鍙戞斁閾惰" required>
-          <el-select
-            v-model="issueForm.bank"
-            placeholder="璇烽�夋嫨鍙戞斁閾惰"
-            clearable
-            filterable
-            style="width: 100%"
-          >
-            <el-option v-for="b in issueBankOptions" :key="b" :label="b" :value="b" />
+        <el-form-item label="鍙戞斁閾惰"
+                      required>
+          <el-select v-model="issueForm.bank"
+                     placeholder="璇烽�夋嫨鍙戞斁閾惰"
+                     clearable
+                     filterable
+                     style="width: 100%">
+            <el-option v-for="b in issueBankOptions"
+                       :key="b"
+                       :label="b"
+                       :value="b" />
           </el-select>
         </el-form-item>
       </el-form>
       <template #footer>
-        <el-button type="primary" :loading="issueLoading" @click="confirmIssue">
+        <el-button type="primary"
+                   :loading="issueLoading"
+                   @click="confirmIssue">
           纭畾
         </el-button>
         <el-button @click="issueDialogVisible = false">鍙栨秷</el-button>
       </template>
     </el-dialog>
-    <audit-dia
-      v-model="auditDialogVisible"
-      :row="auditRow"
-      @close="auditDialogVisible = false"
-      @success="handleAuditSuccess"
-    />
+    <audit-dia v-model="auditDialogVisible"
+               :row="auditRow"
+               @close="auditDialogVisible = false"
+               @success="handleAuditSuccess" />
+    <show-dia ref="showDiaRef" />
   </div>
 </template>
 
 <script setup>
-import {
-  onMounted,
-  computed,
-  ref,
-  reactive,
-  toRefs,
-  getCurrentInstance,
-  nextTick,
-} from "vue";
-import { ElMessageBox } from "element-plus";
-import Cookies from "js-cookie";
-import FormDia from "./components/formDia.vue";
-import BankSettingDia from "./components/bankSettingDia.vue";
-import AuditDia from "./components/auditDia.vue";
-import PIMTable from "@/components/PIMTable/PIMTable.vue";
-import { bankList } from "@/api/personnelManagement/bank.js";
-import {
-  staffSalaryMainListPage,
-  staffSalaryMainDelete,
-  staffSalaryMainUpdate,
-} from "@/api/personnelManagement/staffSalaryMain.js";
+  import {
+    onMounted,
+    computed,
+    ref,
+    reactive,
+    toRefs,
+    getCurrentInstance,
+    nextTick,
+  } from "vue";
+  import { ElMessageBox } from "element-plus";
+  import Cookies from "js-cookie";
+  import FormDia from "./components/formDia.vue";
+  import BankSettingDia from "./components/bankSettingDia.vue";
+  import AuditDia from "./components/auditDia.vue";
+  import ShowDia from "./components/Show.vue";
+  import PIMTable from "@/components/PIMTable/PIMTable.vue";
+  import { bankList } from "@/api/personnelManagement/bank.js";
+  import {
+    staffSalaryMainListPage,
+    staffSalaryMainDelete,
+    staffSalaryMainUpdate,
+  } from "@/api/personnelManagement/staffSalaryMain.js";
 
-const data = reactive({
-  searchForm: {
-    salaryTitle: "",
-    status: "",
-    salaryMonth: "",
-  },
-});
-const { searchForm } = toRefs(data);
+  const data = reactive({
+    searchForm: {
+      salaryTitle: "",
+      status: "",
+      salaryMonth: "",
+    },
+  });
+  const { searchForm } = toRefs(data);
 
-const tableColumn = ref([
-  { label: "宸ヨ祫涓婚", prop: "salaryTitle", minWidth: 140 },
-  { label: "宸ヨ祫鏈堜唤", prop: "salaryMonth", width: 120 },
-  { 
-    label: "鐘舵��", 
-    prop: "statusName", 
-    width: 110,
-    dataType: "tag",
-    formatType: (status) => {
-      const statusMap = {
-        "鑽夌": "info",
-        "瀹℃牳鏈�氳繃": "danger", 
-        "寰呭鏍�": "warning",
-        "寰呭彂鏀�": "primary",
-        "宸插彂鏀�": "success"
-      };
-      return statusMap[status] || "info";
-    }
-  },
-  { label: "宸ヨ祫鎬婚", prop: "totalSalary", width: 120 },
-  { label: "鏀粯閾惰", prop: "payBank", width: 120 },
-  { label: "瀹℃牳浜�", prop: "auditUserName", width: 110 },
-  { label: "澶囨敞", prop: "remark", minWidth: 120 },
-  {
-    dataType: "action",
-    label: "鎿嶄綔",
-    align: "center",
-    fixed: "right",
-    width: 180,
-    operation: [
-      {
-        name: "缂栬緫",
-        type: "text",
-        disabled: (row) => Number(row?.status) !== 1 && Number(row?.status) !== 2,
-        clickFun: (row) => openForm("edit", row),
-      },
-      {
-        name: "瀹℃牳",
-        type: "text",
-        disabled: (row) => Number(row?.status) !== 3,
-        clickFun: (row) => openAudit(row),
-      },
-      {
-        name: "鍙戞斁",
-        type: "text",
-        disabled: (row) => Number(row?.status) !== 4,
-        clickFun: (row) => openIssue(row),
-      },
-    ],
-  },
-]);
-
-const tableData = ref([]);
-const selectedRows = ref([]);
-const tableLoading = ref(false);
-const page = reactive({
-  current: 1,
-  size: 10,
-  total: 0,
-});
-const formDiaRef = ref(null);
-const dialogVisible = ref(false);
-const operationType = ref("add");
-const currentRow = ref({});
-const { proxy } = getCurrentInstance();
-const bankSetting = ref({});
-const bankDialogVisible = ref(false);
-const bankDiaRef = ref(null);
-const issueDialogVisible = ref(false);
-const issueLoading = ref(false);
-const issueRow = ref(null);
-const issueForm = reactive({ bank: "" });
-const auditDialogVisible = ref(false);
-const auditRow = ref(null);
-const auditDiaRef = ref(null);
-
-const issueBankOptions = computed(() => {
-  const options = Array.isArray(bankSetting.value?.options) ? bankSetting.value.options : [];
-  return options
-    .map((v) => (v == null ? "" : String(v).trim()))
-    .filter((v) => v !== "");
-});
-
-const statusName = (s) => {
-  const n = Number(s);
-  return (
+  const tableColumn = ref([
+    { label: "宸ヨ祫涓婚", prop: "salaryTitle", minWidth: 140 },
+    { label: "宸ヨ祫鏈堜唤", prop: "salaryMonth", width: 120 },
     {
-      1: "鑽夌",
-      2: "瀹℃牳鏈�氳繃",
-      3: "寰呭鏍�",
-      4: "寰呭彂鏀�",
-      5: "宸插彂鏀�",
-    }[n] || "-"
-  );
-};
+      label: "鐘舵��",
+      prop: "statusName",
+      width: 110,
+      dataType: "tag",
+      formatType: status => {
+        const statusMap = {
+          鑽夌: "info",
+          瀹℃牳鏈�氳繃: "danger",
+          寰呭鏍�: "warning",
+          寰呭彂鏀�: "primary",
+          宸插彂鏀�: "success",
+        };
+        return statusMap[status] || "info";
+      },
+    },
+    { label: "宸ヨ祫鎬婚", prop: "totalSalary", width: 120 },
+    { label: "鏀粯閾惰", prop: "payBank", width: 120 },
+    { label: "瀹℃牳浜�", prop: "auditUserName", width: 110 },
+    { label: "澶囨敞", prop: "remark", minWidth: 120 },
+    {
+      dataType: "action",
+      label: "鎿嶄綔",
+      align: "center",
+      fixed: "right",
+      width: 200,
+      operation: [
+        {
+          name: "璇︽儏",
+          type: "text",
+          clickFun: row => openShow(row),
+        },
+        {
+          name: "缂栬緫",
+          type: "text",
+          disabled: row => Number(row?.status) !== 1 && Number(row?.status) !== 2,
+          clickFun: row => openForm("edit", row),
+        },
+        {
+          name: "瀹℃牳",
+          type: "text",
+          disabled: row => Number(row?.status) !== 3,
+          clickFun: row => openAudit(row),
+        },
+        {
+          name: "鍙戞斁",
+          type: "text",
+          disabled: row => Number(row?.status) !== 4,
+          clickFun: row => openIssue(row),
+        },
+      ],
+    },
+  ]);
 
-const loadBankSetting = () => {
-  return bankList().then((res) => {
-    const list = Array.isArray(res?.data) ? res.data : [];
-    const options = list
-      .map((b) => (b?.bankName == null ? "" : String(b.bankName).trim()))
-      .filter((v) => v !== "");
-    bankSetting.value = { options, defaultBank: "" };
+  const tableData = ref([]);
+  const selectedRows = ref([]);
+  const tableLoading = ref(false);
+  const page = reactive({
+    current: 1,
+    size: 10,
+    total: 0,
   });
-};
+  const formDiaRef = ref(null);
+  const showDiaRef = ref(null);
+  const dialogVisible = ref(false);
+  const operationType = ref("add");
+  const currentRow = ref({});
+  const { proxy } = getCurrentInstance();
+  const bankSetting = ref({});
+  const bankDialogVisible = ref(false);
+  const bankDiaRef = ref(null);
+  const issueDialogVisible = ref(false);
+  const issueLoading = ref(false);
+  const issueRow = ref(null);
+  const issueForm = reactive({ bank: "" });
+  const auditDialogVisible = ref(false);
+  const auditRow = ref(null);
+  const auditDiaRef = ref(null);
 
-const handleQuery = () => {
-  page.current = 1;
-  getList();
-};
+  const issueBankOptions = computed(() => {
+    const options = Array.isArray(bankSetting.value?.options)
+      ? bankSetting.value.options
+      : [];
+    return options
+      .map(v => (v == null ? "" : String(v).trim()))
+      .filter(v => v !== "");
+  });
 
-const handleReset = () => {
-  searchForm.value.salaryTitle = "";
-  searchForm.value.status = "";
-  searchForm.value.salaryMonth = "";
-  page.current = 1;
-  getList();
-};
+  const statusName = s => {
+    const n = Number(s);
+    return (
+      {
+        1: "鑽夌",
+        2: "瀹℃牳鏈�氳繃",
+        3: "寰呭鏍�",
+        4: "寰呭彂鏀�",
+        5: "宸插彂鏀�",
+      }[n] || "-"
+    );
+  };
 
-const pagination = (obj) => {
-  page.current = obj.page;
-  page.size = obj.limit;
-  getList();
-};
-
-const getList = () => {
-  tableLoading.value = true;
-  staffSalaryMainListPage({
-    ...searchForm.value,
-    current: page.current,
-    size: page.size,
-  })
-    .then((res) => {
-      tableLoading.value = false;
-      const records = res.data?.records ?? res.data?.list ?? [];
-      console.log('鍒楄〃鎺ュ彛杩斿洖鏁版嵁:', records);
-      // 鍏煎鍚庣瀛楁锛氳嫢鎺ュ彛浠嶈繑鍥炲彴璐︾粨鏋勶紝鍙湪姝ゅ仛鏄犲皠
-      tableData.value = records.map((item) => ({
-        ...item,
-        salaryTitle: item.salaryTitle ?? "-",
-        salaryMonth: item.salaryMonth ?? "-",
-        statusName: statusName(item.status),
-        totalSalary: item.totalSalary ?? "-",
-        payBank: (item.payBank == null ? "" : String(item.payBank).trim()) || "-",
-        auditUserName: item.auditUserName ?? "-",
-      }));
-      page.total = res.data?.total ?? res.data?.count ?? 0;
-    })
-    .catch(() => {
-      tableLoading.value = false;
+  const loadBankSetting = () => {
+    return bankList().then(res => {
+      const list = Array.isArray(res?.data) ? res.data : [];
+      const options = list
+        .map(b => (b?.bankName == null ? "" : String(b.bankName).trim()))
+        .filter(v => v !== "");
+      bankSetting.value = { options, defaultBank: "" };
     });
-};
+  };
 
-const handleSelectionChange = (selection) => {
-  selectedRows.value = selection;
-};
+  const handleQuery = () => {
+    page.current = 1;
+    getList();
+  };
 
-const openForm = (type, row) => {
-  operationType.value = type;
-  currentRow.value = row || {};
-  dialogVisible.value = true;
-  nextTick(() => {
-    formDiaRef.value?.openDialog(type, row);
-  });
-};
+  const handleReset = () => {
+    searchForm.value.salaryTitle = "";
+    searchForm.value.status = "";
+    searchForm.value.salaryMonth = "";
+    page.current = 1;
+    getList();
+  };
 
-const openBankSetting = () => {
-  bankDialogVisible.value = true;
-};
+  const pagination = obj => {
+    page.current = obj.page;
+    page.size = obj.limit;
+    getList();
+  };
 
-const openAudit = (row) => {
-  console.log('鎵撳紑瀹℃牳锛屼紶鍏ョ殑鏁版嵁:', row);
-  auditRow.value = row || null;
-  auditDialogVisible.value = true;
-  nextTick(() => {
-    auditDiaRef.value?.openDialog(row);
-  });
-};
-
-const handleAuditSuccess = () => {
-  getList();
-};
-
-const openIssue = (row) => {
-  if (!issueBankOptions.value?.length) {
-    proxy?.$modal?.msgWarning?.("璇峰厛鍦ㄢ�滆缃摱琛屸�濅腑缁存姢鍙戞斁閾惰閫夐」");
-    return;
-  }
-  issueRow.value = row || null;
-  const current = row?.payBank && row.payBank !== "-" ? String(row.payBank).trim() : "";
-  issueForm.bank = current;
-  issueDialogVisible.value = true;
-};
-
-
-
-const confirmIssue = () => {
-  const bank = issueForm.bank ? String(issueForm.bank).trim() : "";
-  if (!bank) {
-    proxy?.$modal?.msgWarning?.("璇烽�夋嫨鍙戞斁閾惰");
-    return;
-  }
-  const row = issueRow.value;
-  if (!row?.id) {
-    issueDialogVisible.value = false;
-    return;
-  }
-  issueLoading.value = true;
-  staffSalaryMainUpdate({
-    id: row.id,
-    payBank: bank,
-    status: 5,
-  })
-    .then(() => {
-      proxy?.$modal?.msgSuccess?.("鍙戞斁鎴愬姛");
-      issueDialogVisible.value = false;
-      getList();
+  const getList = () => {
+    tableLoading.value = true;
+    staffSalaryMainListPage({
+      ...searchForm.value,
+      current: page.current,
+      size: page.size,
     })
-    .finally(() => {
-      issueLoading.value = false;
-    });
-};
-
-const handleBankSaved = () => {
-  loadBankSetting();
-  getList();
-};
-
-const handleDelete = () => {
-  if (!selectedRows.value?.length) {
-    proxy.$modal.msgWarning("璇烽�夋嫨瑕佸垹闄ょ殑鏁版嵁");
-    return;
-  }
-  const ids = selectedRows.value.map((item) => item.id);
-  ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚垹闄わ紝鏄惁纭鍒犻櫎锛�", "鍒犻櫎", {
-    confirmButtonText: "纭",
-    cancelButtonText: "鍙栨秷",
-    type: "warning",
-  })
-    .then(() => {
-      staffSalaryMainDelete(ids).then(() => {
-        proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛");
-        getList();
+      .then(res => {
+        tableLoading.value = false;
+        const records = res.data?.records ?? res.data?.list ?? [];
+        console.log("鍒楄〃鎺ュ彛杩斿洖鏁版嵁:", records);
+        // 鍏煎鍚庣瀛楁锛氳嫢鎺ュ彛浠嶈繑鍥炲彴璐︾粨鏋勶紝鍙湪姝ゅ仛鏄犲皠
+        tableData.value = records.map(item => ({
+          ...item,
+          salaryTitle: item.salaryTitle ?? "-",
+          salaryMonth: item.salaryMonth ?? "-",
+          statusName: statusName(item.status),
+          totalSalary: item.totalSalary ?? "-",
+          payBank:
+            (item.payBank == null ? "" : String(item.payBank).trim()) || "-",
+          auditUserName: item.auditUserName ?? "-",
+        }));
+        page.total = res.data?.total ?? res.data?.count ?? 0;
+      })
+      .catch(() => {
+        tableLoading.value = false;
       });
+  };
+
+  const handleSelectionChange = selection => {
+    selectedRows.value = selection;
+  };
+
+  const openForm = (type, row) => {
+    operationType.value = type;
+    currentRow.value = row || {};
+    dialogVisible.value = true;
+    nextTick(() => {
+      formDiaRef.value?.openDialog(type, row);
+    });
+  };
+
+  const openShow = row => {
+    nextTick(() => {
+      showDiaRef.value?.openDialog(row);
+    });
+  };
+
+  const openBankSetting = () => {
+    bankDialogVisible.value = true;
+  };
+
+  const openAudit = row => {
+    console.log("鎵撳紑瀹℃牳锛屼紶鍏ョ殑鏁版嵁:", row);
+    auditRow.value = row || null;
+    auditDialogVisible.value = true;
+    nextTick(() => {
+      auditDiaRef.value?.openDialog(row);
+    });
+  };
+
+  const handleAuditSuccess = () => {
+    getList();
+  };
+
+  const openIssue = row => {
+    if (!issueBankOptions.value?.length) {
+      proxy?.$modal?.msgWarning?.("璇峰厛鍦ㄢ�滆缃摱琛屸�濅腑缁存姢鍙戞斁閾惰閫夐」");
+      return;
+    }
+    issueRow.value = row || null;
+    const current =
+      row?.payBank && row.payBank !== "-" ? String(row.payBank).trim() : "";
+    issueForm.bank = current;
+    issueDialogVisible.value = true;
+  };
+
+  const confirmIssue = () => {
+    const bank = issueForm.bank ? String(issueForm.bank).trim() : "";
+    if (!bank) {
+      proxy?.$modal?.msgWarning?.("璇烽�夋嫨鍙戞斁閾惰");
+      return;
+    }
+    const row = issueRow.value;
+    if (!row?.id) {
+      issueDialogVisible.value = false;
+      return;
+    }
+    issueLoading.value = true;
+    staffSalaryMainUpdate({
+      id: row.id,
+      payBank: bank,
+      status: 5,
     })
-    .catch(() => {});
-};
+      .then(() => {
+        proxy?.$modal?.msgSuccess?.("鍙戞斁鎴愬姛");
+        issueDialogVisible.value = false;
+        getList();
+      })
+      .finally(() => {
+        issueLoading.value = false;
+      });
+  };
 
-const handleExport = () => {
-  proxy.download(
-    "/compensationPerformance/export",
-    { ...searchForm.value, current: page.current, size: page.size },
-    "宸ヨ祫琛�.xlsx"
-  );
-};
+  const handleBankSaved = () => {
+    loadBankSetting();
+    getList();
+  };
 
-onMounted(() => {
-  loadBankSetting();
-  getList();
-});
+  const handleDelete = () => {
+    if (!selectedRows.value?.length) {
+      proxy.$modal.msgWarning("璇烽�夋嫨瑕佸垹闄ょ殑鏁版嵁");
+      return;
+    }
+    const ids = selectedRows.value.map(item => item.id);
+    ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚垹闄わ紝鏄惁纭鍒犻櫎锛�", "鍒犻櫎", {
+      confirmButtonText: "纭",
+      cancelButtonText: "鍙栨秷",
+      type: "warning",
+    })
+      .then(() => {
+        staffSalaryMainDelete(ids).then(() => {
+          proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+          getList();
+        });
+      })
+      .catch(() => {});
+  };
+
+  const handleExport = () => {
+    proxy.download(
+      "/compensationPerformance/export",
+      { ...searchForm.value, current: page.current, size: page.size },
+      "宸ヨ祫琛�.xlsx"
+    );
+  };
+
+  onMounted(() => {
+    loadBankSetting();
+    getList();
+  });
 </script>
 
 <style scoped>
-.search_form {
-  margin-bottom: 20px;
-}
-.search_title {
-  font-weight: 500;
-  margin-right: 5px;
-}
-.ml10 {
-  margin-left: 10px;
-}
-.table_list {
-  margin-top: 20px;
-}
+  .search_form {
+    margin-bottom: 20px;
+  }
+  .search_title {
+    font-weight: 500;
+    margin-right: 5px;
+  }
+  .ml10 {
+    margin-left: 10px;
+  }
+  .table_list {
+    margin-top: 20px;
+  }
 </style>

--
Gitblit v1.9.3