feat(人员薪资): 查看明细升级为全字段明细并带实发合计

gaoluyang

7 天以前 7a74c11a6bb50c51384d2cb0a86552753711dd18

feat(人员薪资): 查看明细升级为全字段明细并带实发合计

查看明细弹窗补齐计时工资、其他支出、社保补缴、备注等字段，
增加状态、工资总额、审核人信息和实发合计。

Co-Authored-By: Claude Code <noreply@anthropic.com>

 src/views/personnelManagement/monthlyStatistics/index.vue

@@ -93,32 +93,6 @@
      @close="auditDialogVisible = false"
      @success="handleAuditSuccess"
    />
    <el-dialog v-model="salaryDetailVisible" title="人员工资明细" width="1100px">
      <div class="salary-detail-title">
        {{ salaryDetailRow.salaryTitle || "-" }}（{{ salaryDetailRow.salaryMonth || "-" }}）
      </div>
      <el-table :data="salaryDetailRow.staffSalaryDetailList || []" border style="width: 100%">
        <el-table-column prop="staffName" label="姓名" width="90" />
        <el-table-column prop="deptName" label="部门" width="110" />
        <el-table-column prop="postName" label="岗位" width="110" />
        <el-table-column prop="basicSalary" label="基本工资" width="100" align="right" />
        <el-table-column prop="pieceSalary" label="计件工资" width="100" align="right" />
        <el-table-column prop="otherIncome" label="其他收入" width="100" align="right" />
        <el-table-column prop="socialPersonal" label="社保(个人)" width="100" align="right" />
        <el-table-column prop="fundPersonal" label="公积金(个人)" width="110" align="right" />
        <el-table-column prop="salaryTax" label="个税" width="90" align="right" />
        <el-table-column prop="grossSalary" label="应发工资" width="110" align="right">
          <template #default="{ row }">{{ formatAmount(row.grossSalary) }}</template>
        </el-table-column>
        <el-table-column prop="deductSalary" label="扣款合计" width="100" align="right" />
        <el-table-column prop="netSalary" label="实发工资" width="110" align="right">
          <template #default="{ row }">{{ formatAmount(row.netSalary) }}</template>
        </el-table-column>
      </el-table>
      <template #footer>
        <el-button @click="salaryDetailVisible = false">关闭</el-button>
      </template>
    </el-dialog>
    <el-dialog v-model="issueRecordVisible" title="发放记录" width="820px" append-to-body>
      <template v-if="issueRecordRow">
        <el-descriptions :column="2" border>
@@ -149,6 +123,58 @@
      </template>
      <template #footer>
        <el-button @click="issueRecordVisible = false">关闭</el-button>
      </template>
    </el-dialog>
    <el-dialog
      v-model="detailDialogVisible"
      :title="`${detailRow.salaryTitle || '工资表'} - 人员明细`"
      width="90%"
      append-to-body
    >
      <el-descriptions :column="4" border size="small">
        <el-descriptions-item label="工资月份">
          {{ detailRow.salaryMonth || "-" }}
        </el-descriptions-item>
        <el-descriptions-item label="状态">
          {{ statusName(detailRow.status) }}
        </el-descriptions-item>
        <el-descriptions-item label="工资总额">
          {{ formatAmount(detailRow.totalSalary) }}
        </el-descriptions-item>
        <el-descriptions-item label="审核人">
          {{ detailRow.auditUserName || "-" }}
        </el-descriptions-item>
      </el-descriptions>
      <el-table
        :data="detailRow.staffSalaryDetailList || []"
        border
        size="small"
        max-height="460"
        style="margin-top: 12px"
      >
        <el-table-column type="index" label="序号" width="60" align="center" />
        <el-table-column prop="staffName" label="姓名" width="100" />
        <el-table-column prop="deptName" label="部门" width="110" />
        <el-table-column prop="postName" label="岗位" width="100" />
        <el-table-column prop="basicSalary" label="基本工资" width="100" align="right" />
        <el-table-column prop="pieceSalary" label="计件工资" width="100" align="right" />
        <el-table-column prop="hourlySalary" label="计时工资" width="100" align="right" />
        <el-table-column prop="otherIncome" label="其他收入" width="100" align="right" />
        <el-table-column prop="socialPersonal" label="社保个人" width="100" align="right" />
        <el-table-column prop="fundPersonal" label="公积金个人" width="120" align="right" />
        <el-table-column prop="otherDeduct" label="其他支出" width="100" align="right" />
        <el-table-column prop="socialSupplementAmount" label="社保补缴" width="100" align="right" />
        <el-table-column prop="salaryTax" label="工资个税" width="100" align="right" />
        <el-table-column prop="grossSalary" label="应发工资" width="100" align="right" />
        <el-table-column prop="deductSalary" label="应扣工资" width="100" align="right" />
        <el-table-column prop="netSalary" label="实发工资" width="100" align="right" />
        <el-table-column prop="remark" label="备注" min-width="160" show-overflow-tooltip />
      </el-table>
      <div class="detail-total">
        实发合计：<span>¥ {{ detailTotal }}</span>
      </div>
      <template #footer>
        <el-button @click="detailDialogVisible = false">关闭</el-button>
      </template>
    </el-dialog>
  </div>
@@ -215,12 +241,12 @@
    label: "操作",
    align: "center",
    fixed: "right",
    width: 240,
    width: 320,
    operation: [
      {
        name: "查看明细",
        type: "text",
        clickFun: (row) => openSalaryDetail(row),
        clickFun: (row) => openDetail(row),
      },
      {
        name: "编辑",
@@ -279,8 +305,6 @@
const auditDialogVisible = ref(false);
const auditRow = ref(null);
const auditDiaRef = ref(null);
const salaryDetailVisible = ref(false);
const salaryDetailRow = ref({});
const issueRecordVisible = ref(false);
const issueRecordRow = ref(null);

@@ -290,16 +314,27 @@
    : []
);

const detailDialogVisible = ref(false);
const detailRow = ref({});

const detailTotal = computed(() => {
  const list = Array.isArray(detailRow.value?.staffSalaryDetailList)
    ? detailRow.value.staffSalaryDetailList
    : [];
  const sum = list.reduce((acc, item) => acc + Number(item?.netSalary || 0), 0);
  return sum.toFixed(2);
});

const openDetail = (row) => {
  detailRow.value = row || {};
  detailDialogVisible.value = true;
};

const formatAmount = (v) => (v == null || v === "" ? "-" : Number(v).toFixed(2));

const openIssueRecord = (row) => {
  issueRecordRow.value = row || null;
  issueRecordVisible.value = true;
};

const openSalaryDetail = (row) => {
  salaryDetailRow.value = row || {};
  salaryDetailVisible.value = true;
};

const issueBankOptions = computed(() => {
@@ -502,13 +537,20 @@
.table_list {
  margin-top: 20px;
}
.salary-detail-title {
  margin-bottom: 12px;
  font-weight: 600;
}
.issue-record-title {
  margin: 16px 0 8px;
  font-weight: 600;
  font-size: 14px;
}
.detail-total {
  margin-top: 12px;
  text-align: right;
  font-size: 14px;
  color: #606266;
}
.detail-total span {
  color: #f56c6c;
  font-weight: 700;
  font-size: 16px;
}
</style>