From 2763efef00d553bc65e08bd21384cdd6dd2a5a2f Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期四, 05 三月 2026 11:52:05 +0800
Subject: [PATCH] 进销存升级 1.添加社会保险设置页面，开发与联调 2.丰富新增入职所填字段字段并于用户管理关联 3.修改人员薪资页面样式和逻辑
---
src/views/personnelManagement/monthlyStatistics/components/formDia.vue | 819 ++++++++++++++++++++++++++++++++++++++--------------------
1 files changed, 533 insertions(+), 286 deletions(-)
diff --git a/src/views/personnelManagement/monthlyStatistics/components/formDia.vue b/src/views/personnelManagement/monthlyStatistics/components/formDia.vue
index c67fdd6..0882ba4 100644
--- a/src/views/personnelManagement/monthlyStatistics/components/formDia.vue
+++ b/src/views/personnelManagement/monthlyStatistics/components/formDia.vue
@@ -1,318 +1,565 @@
<template>
- <el-dialog v-model="dialogVisible"
- :title="title"
- width="700px"
- :close-on-click-modal="false">
- <el-form ref="formRef"
- :model="form"
- :rules="rules"
- label-width="140px"
- label-position="top">
- <el-row :gutter="20">
- <el-col :span="12">
- <el-form-item label="缁熻鏈堜唤"
- prop="payDate">
- <el-date-picker v-model="form.payDate"
- type="month"
- value-format="YYYY-MM"
- format="YYYY-MM"
- placeholder="璇烽�夋嫨鏈堜唤"
- style="width: 100%"
- :disabled="operationType === 'view'" />
- </el-form-item>
- </el-col>
- <el-col :span="12">
- <el-form-item label="濮撳悕"
- prop="staffId">
- <el-select v-model="form.staffId"
- placeholder="璇烽�夋嫨鍛樺伐"
- style="width: 100%"
- :disabled="operationType === 'view'">
- <el-option v-for="item in userList"
- :key="item.id"
- :label="item.staffName"
- :value="item.id" />
- </el-select>
- </el-form-item>
- </el-col>
- </el-row>
- <el-row :gutter="20">
- <el-col :span="12">
- <el-form-item label="鍩烘湰宸ヨ祫"
- prop="basicSalary">
- <el-input v-model="form.basicSalary"
- type="number"
- placeholder="璇疯緭鍏ュ熀鏈伐璧�"
- :disabled="operationType === 'view'" />
- </el-form-item>
- </el-col>
- <el-col :span="12">
- <el-form-item label="璁′欢宸ヨ祫"
- prop="pieceworkSalary">
- <el-input v-model="form.pieceworkSalary"
- type="number"
- placeholder="璇疯緭鍏ヨ浠跺伐璧�"
- :disabled="operationType === 'view'" />
- </el-form-item>
- </el-col>
- </el-row>
- <el-row :gutter="20">
- <el-col :span="12">
- <el-form-item label="璁℃椂宸ヨ祫"
- prop="hourlySalary">
- <el-input v-model="form.hourlySalary"
- type="number"
- placeholder="璇疯緭鍏ヨ鏃跺伐璧�"
- :disabled="operationType === 'view'" />
- </el-form-item>
- </el-col>
- <el-col :span="12">
- <el-form-item label="鍏朵粬鏀跺叆"
- prop="otherIncome">
- <el-input v-model="form.otherIncome"
- type="number"
- placeholder="璇疯緭鍏ュ叾浠栨敹鍏�"
- :disabled="operationType === 'view'" />
- </el-form-item>
- </el-col>
- </el-row>
- <el-row :gutter="20">
- <el-col :span="12">
- <el-form-item label="绀句繚涓汉"
- prop="socialSecurityIndividuals">
- <el-input v-model="form.socialSecurityIndividuals"
- type="number"
- placeholder="璇疯緭鍏ョぞ淇濅釜浜�"
- :disabled="operationType === 'view'" />
- </el-form-item>
- </el-col>
- <el-col :span="12">
- <el-form-item label="鍏Н閲戜釜浜�"
- prop="providentFundIndividuals">
- <el-input v-model="form.providentFundIndividuals"
- type="number"
- placeholder="璇疯緭鍏ュ叕绉噾涓汉"
- :disabled="operationType === 'view'" />
- </el-form-item>
- </el-col>
- </el-row>
- <el-row :gutter="20">
- <el-col :span="12">
- <el-form-item label="涓汉鎵�寰楃◣"
- prop="personalIncomeTax">
- <el-input v-model="form.personalIncomeTax"
- type="number"
- placeholder="璇疯緭鍏ヤ釜浜烘墍寰楃◣"
- :disabled="operationType === 'view'" />
- </el-form-item>
- </el-col>
- <el-col :span="12">
- <el-form-item label="鍏朵粬鎵ｆ"
- prop="otherDeductions">
- <el-input v-model="form.otherDeductions"
- type="number"
- placeholder="璇疯緭鍏ュ叾浠栨墸娆�"
- :disabled="operationType === 'view'" />
- </el-form-item>
- </el-col>
- </el-row>
- <el-row :gutter="20">
- <el-col :span="24">
- <el-form-item label="澶囨敞"
- prop="remark">
- <el-input v-model="form.remark"
- type="textarea"
- placeholder="璇疯緭鍏ュ娉�"
- :rows="3"
- :disabled="operationType === 'view'" />
- </el-form-item>
- </el-col>
- </el-row>
- </el-form>
+ <el-dialog
+ v-model="dialogVisible"
+ :title="operationType === 'add' ? '鏂板缓宸ヨ祫琛�' : '缂栬緫宸ヨ祫琛�'"
+ width="90%"
+ :close-on-click-modal="false"
+ destroy-on-close
+ @close="closeDia"
+ >
+ <div class="form-dia-body">
+ <!-- 鍩虹璧勬枡 -->
+ <el-card class="form-card" shadow="never">
+ <template #header>
+ <span class="card-title"><span class="card-title-line">|</span> 鍩虹璧勬枡</span>
+ <el-icon class="card-collapse"><ArrowUp /></el-icon>
+ </template>
+ <el-form ref="formRef" :model="form" :rules="rules" label-position="top">
+ <el-row :gutter="24">
+ <el-col :span="6">
+ <el-form-item label="宸ヨ祫涓婚" prop="title">
+ <el-input
+ v-model="form.title"
+ placeholder="璇疯緭鍏�"
+ clearable
+ maxlength="20"
+ show-word-limit
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :span="6">
+ <el-form-item label="閫夋嫨閮ㄩ棬" prop="deptId">
+ <el-select
+ v-model="form.deptId"
+ placeholder="璇烽�夋嫨"
+ clearable
+ style="width: 100%"
+ >
+ <el-option
+ v-for="item in deptOptions"
+ :key="item.deptId"
+ :label="item.deptName"
+ :value="item.deptId"
+ />
+ </el-select>
+ </el-form-item>
+ </el-col>
+ <el-col :span="6">
+ <el-form-item label="閫夋嫨宸ヨ祫鏈堜唤" prop="payMonth">
+ <el-date-picker
+ v-model="form.payMonth"
+ type="month"
+ value-format="YYYY-MM"
+ format="YYYY-MM"
+ placeholder="璇烽�夋嫨宸ヨ祫鏈堜唤"
+ style="width: 100%"
+ clearable
+ />
+ </el-form-item>
+ </el-col>
+ <el-col :span="6">
+ <el-form-item label="澶囨敞" prop="remark">
+ <el-input
+ v-model="form.remark"
+ placeholder="璇疯緭鍏�"
+ clearable
+ />
+ </el-form-item>
+ </el-col>
+ </el-row>
+ </el-form>
+ </el-card>
+
+ <!-- 鎿嶄綔鎸夐挳 -->
+ <div class="toolbar">
+ <el-button type="primary" @click="handleGenerate">鐢熸垚宸ヨ祫琛�</el-button>
+ <el-button @click="handleExport">瀵煎嚭</el-button>
+ <el-button @click="handleImport">瀵煎叆</el-button>
+ <el-button @click="handleClear">娓呯┖</el-button>
+ <el-button @click="openAddPerson">鏂板浜哄憳</el-button>
+ <el-button @click="handleBatchDelete">鍒犻櫎</el-button>
+ <el-button @click="handleTaxForm">涓◣琛�</el-button>
+ </div>
+
+ <!-- 鍛樺伐宸ヨ祫璇︽儏琛ㄦ牸 -->
+ <div class="employee-table-wrap">
+ <el-table
+ ref="employeeTableRef"
+ :data="employeeList"
+ border
+ max-height="400"
+ @selection-change="onEmployeeSelectionChange"
+ >
+ <el-table-column type="selection" width="55" align="center" />
+ <el-table-column label="鍛樺伐濮撳悕" prop="staffName" minWidth="100" />
+ <el-table-column label="瑙掕壊" prop="roleName" minWidth="100" />
+ <el-table-column label="閮ㄩ棬" prop="deptName" minWidth="100" />
+ <el-table-column label="鍩烘湰宸ヨ祫" minWidth="110">
+ <template #default="{ row }">
+ <el-input
+ v-model.number="row.basicSalary"
+ type="number"
+ placeholder="0"
+ size="small"
+ @input="row.basicSalary = parseNum(row.basicSalary)"
+ />
+ </template>
+ </el-table-column>
+ <el-table-column label="璁′欢宸ヨ祫" minWidth="110">
+ <template #default="{ row }">
+ <el-input
+ v-model.number="row.pieceworkSalary"
+ type="number"
+ placeholder="0"
+ size="small"
+ @input="row.pieceworkSalary = parseNum(row.pieceworkSalary)"
+ />
+ </template>
+ </el-table-column>
+ <el-table-column label="璁℃椂宸ヨ祫" minWidth="110">
+ <template #default="{ row }">
+ <el-input
+ v-model.number="row.hourlySalary"
+ type="number"
+ placeholder="0"
+ size="small"
+ @input="row.hourlySalary = parseNum(row.hourlySalary)"
+ />
+ </template>
+ </el-table-column>
+ <el-table-column label="鍏朵粬鏀跺叆" minWidth="110">
+ <template #default="{ row }">
+ <el-input
+ v-model.number="row.otherIncome"
+ type="number"
+ placeholder="0"
+ size="small"
+ @input="row.otherIncome = parseNum(row.otherIncome)"
+ />
+ </template>
+ </el-table-column>
+ <el-table-column label="绀句繚涓汉" minWidth="110">
+ <template #default="{ row }">
+ <el-input
+ v-model.number="row.socialSecurityIndividuals"
+ type="number"
+ placeholder="0"
+ size="small"
+ @input="row.socialSecurityIndividuals = parseNum(row.socialSecurityIndividuals)"
+ />
+ </template>
+ </el-table-column>
+ <el-table-column label="鍏Н閲戜釜浜�" minWidth="120">
+ <template #default="{ row }">
+ <el-input
+ v-model.number="row.providentFundIndividuals"
+ type="number"
+ placeholder="0"
+ size="small"
+ @input="row.providentFundIndividuals = parseNum(row.providentFundIndividuals)"
+ />
+ </template>
+ </el-table-column>
+ <el-table-column label="鎿嶄綔" width="80" align="center" fixed="right">
+ <template #default="{ row }">
+ <el-button type="primary" link @click="removeEmployee(row)">鍒犻櫎</el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ <div v-if="!employeeList.length" class="table-empty">鏆傛棤鏁版嵁</div>
+ </div>
+ </div>
+
<template #footer>
- <span class="dialog-footer">
- <el-button @click="dialogVisible = false">鍙栨秷</el-button>
- <el-button type="primary"
- @click="submitForm"
- v-if="operationType !== 'view'">
- 纭畾
- </el-button>
- </span>
+ <div class="dialog-footer">
+ <el-button @click="closeDia">鍙栨秷</el-button>
+ <el-button type="primary" @click="submitForm">纭畾</el-button>
+ </div>
</template>
+
+ <!-- 鏂板浜哄憳寮圭獥 -->
+ <el-dialog
+ v-model="addPersonVisible"
+ title="鏂板浜哄憳"
+ width="400px"
+ append-to-body
+ @close="addPersonClose"
+ >
+ <div class="add-person-tree">
+ <el-tree
+ ref="personTreeRef"
+ :data="deptStaffTree"
+ show-checkbox
+ node-key="id"
+ :props="{ label: 'label', children: 'children' }"
+ default-expand-all
+ />
+ </div>
+ <template #footer>
+ <el-button @click="addPersonVisible = false">鍙栨秷</el-button>
+ <el-button type="primary" @click="confirmAddPerson">纭畾</el-button>
+ </template>
+ </el-dialog>
+
+ <!-- 涓◣琛ㄥ脊绐� -->
+ <el-dialog
+ v-model="taxDialogVisible"
+ title="涓◣琛�"
+ width="700px"
+ append-to-body
+ >
+ <div class="tax-desc">涓汉鎵�寰楃◣鍏嶅緛棰濓細5000鍏�</div>
+ <el-table :data="taxTableData" border style="width: 100%;margin-bottom: 20px;">
+ <el-table-column prop="level" label="绾ф暟" width="80" align="center" />
+ <el-table-column
+ prop="range"
+ label="鍏ㄥ勾搴旂撼绋庢墍寰楅/鍏�"
+ min-width="220"
+ />
+ <el-table-column
+ prop="rate"
+ label="绋庣巼(%)"
+ width="100"
+ align="center"
+ />
+ <el-table-column
+ prop="quickDeduction"
+ label="閫熺畻鎵ｉ櫎鏁�/鍏�"
+ width="160"
+ align="center"
+ />
+ </el-table>
+ </el-dialog>
</el-dialog>
</template>
<script setup>
- import { ref, reactive, computed, onMounted } from "vue";
- import { ElMessage } from "element-plus";
- import {
- monthlyStatisticsAdd,
- monthlyStatisticsUpdate,
- staffOnJobList,
- } from "@/api/personnelManagement/monthlyStatistics.js";
+import { ref, reactive, toRefs, computed, getCurrentInstance, nextTick } from "vue";
+import { ArrowUp } from "@element-plus/icons-vue";
+import { listDept } from "@/api/system/dept.js";
+import { staffOnJobList } from "@/api/personnelManagement/monthlyStatistics.js";
+import {
+ monthlyStatisticsAdd,
+ monthlyStatisticsUpdate,
+ monthlyStatisticsGet,
+} from "@/api/personnelManagement/monthlyStatistics.js";
- const props = defineProps({
- modelValue: {
- type: Boolean,
- default: false,
- },
- operationType: {
- type: String,
- default: "add",
- },
- row: {
- type: Object,
- default: () => ({}),
- },
- });
+const emit = defineEmits(["update:modelValue", "close"]);
+const props = defineProps({
+ modelValue: { type: Boolean, default: false },
+ operationType: { type: String, default: "add" },
+ row: { type: Object, default: () => ({}) },
+});
- const emit = defineEmits(["update:modelValue", "close"]);
+const { proxy } = getCurrentInstance();
- const dialogVisible = computed({
- get: () => props.modelValue,
- set: val => emit("update:modelValue", val),
- });
+const dialogVisible = computed({
+ get: () => props.modelValue,
+ set: (val) => emit("update:modelValue", val),
+});
- const title = computed(() => {
- if (props.operationType === "add") return "鏂板钖祫鍙拌处";
- if (props.operationType === "edit") return "缂栬緫钖祫鍙拌处";
- return "鏌ョ湅钖祫鍙拌处";
- });
+const formRef = ref(null);
+const employeeTableRef = ref(null);
+const personTreeRef = ref(null);
+const addPersonVisible = ref(false);
+const taxDialogVisible = ref(false);
+const deptOptions = ref([]);
+const deptStaffTree = ref([]);
+const employeeList = ref([]);
+const selectedEmployees = ref([]);
+const taxTableData = ref([
+ { level: 1, range: "涓嶈秴杩�36000鍏�", rate: 3, quickDeduction: 0 },
+ { level: 2, range: "瓒呰繃36000-144000鍏�", rate: 10, quickDeduction: 2520 },
+ { level: 3, range: "瓒呰繃144000-300000鍏�", rate: 20, quickDeduction: 16920 },
+ { level: 4, range: "瓒呰繃300000-420000鍏�", rate: 25, quickDeduction: 31920 },
+ { level: 5, range: "瓒呰繃420000-660000鍏�", rate: 30, quickDeduction: 52920 },
+ { level: 6, range: "瓒呰繃660000-960000鍏�", rate: 35, quickDeduction: 85920 },
+ { level: 7, range: "瓒呰繃960000鍏�", rate: 45, quickDeduction: 181920 },
+]);
- const formRef = ref();
- const form = reactive({
- id: "",
- payDate: "",
- staffId: "",
- basicSalary: 0,
- pieceworkSalary: 0,
- hourlySalary: 0,
- otherIncome: 0,
- socialSecurityIndividuals: 0,
- providentFundIndividuals: 0,
- personalIncomeTax: 0,
- otherDeductions: 0,
- payableWages: 0,
- deductibleWages: 0,
- actualWages: 0,
+function parseNum(v) {
+ if (v === "" || v == null) return 0;
+ const n = Number(v);
+ return isNaN(n) ? 0 : n;
+}
+
+// 鍩虹璧勬枡琛ㄥ崟
+const data = reactive({
+ form: {
+ id: undefined,
+ title: "",
+ deptId: undefined,
+ payMonth: "",
remark: "",
+ },
+ rules: {
+ title: [{ required: true, message: "璇疯緭鍏ュ伐璧勪富棰�", trigger: "blur" }],
+ deptId: [{ required: true, message: "璇烽�夋嫨閮ㄩ棬", trigger: "change" }],
+ payMonth: [{ required: true, message: "璇烽�夋嫨宸ヨ祫鏈堜唤", trigger: "change" }],
+ },
+});
+const { form, rules } = toRefs(data);
+
+// 鎵佸钩鍖栭儴闂ㄦ爲渚涗笅鎷変娇鐢�
+function flattenDept(tree, list = []) {
+ if (!tree?.length) return list;
+ tree.forEach((node) => {
+ list.push({ deptId: node.deptId, deptName: node.deptName });
+ if (node.children?.length) flattenDept(node.children, list);
});
+ return list;
+}
- const rules = {
- payDate: [{ required: true, message: "璇烽�夋嫨缁熻鏈堜唤", trigger: "change" }],
- staffId: [{ required: true, message: "璇烽�夋嫨鍛樺伐", trigger: "change" }],
- basicSalary: [{ required: true, message: "璇疯緭鍏ュ熀鏈伐璧�", trigger: "blur" }],
- };
+const loadDeptOptions = () => {
+ listDept().then((res) => {
+ const tree = res.data ?? [];
+ deptOptions.value = flattenDept(tree);
+ });
+};
- const userList = ref([]);
-
- const loadUserList = () => {
- // userListNoPage().then(res => {
- // userList.value = res.data || [];
- // });
- staffOnJobList().then(res => {
- userList.value = res.data || [];
+// 鏋勫缓 閮ㄩ棬-浜哄憳 鏍戯紙鐢ㄤ簬鏂板浜哄憳寮圭獥锛�
+const loadDeptStaffTree = () => {
+ Promise.all([listDept(), staffOnJobList()]).then(([deptRes, staffRes]) => {
+ const tree = deptRes.data ?? [];
+ const staffList = staffRes.data ?? [];
+ const deptMap = new Map();
+ function walk(nodes) {
+ nodes.forEach((node) => {
+ deptMap.set(node.deptId, {
+ id: "dept_" + node.deptId,
+ deptId: node.deptId,
+ label: node.deptName,
+ type: "dept",
+ children: [],
+ });
+ if (node.children?.length) walk(node.children);
+ });
+ }
+ walk(tree);
+ staffList.forEach((s) => {
+ const deptId = s.deptId ?? s.dept_id;
+ const node = deptMap.get(deptId);
+ if (node) {
+ node.children.push({
+ id: s.id ?? s.staffId,
+ staffId: s.id ?? s.staffId,
+ label: s.staffName ?? s.name,
+ type: "staff",
+ ...s,
+ });
+ }
});
- };
+ deptStaffTree.value = Array.from(deptMap.values()).filter(
+ (n) => n.children && n.children.length > 0
+ );
+ });
+};
- const openDialog = (type, row) => {
- // 閲嶇疆琛ㄥ崟
- Object.assign(form, {
- id: "",
- payDate: "",
- staffId: "",
+const openDialog = (type, row) => {
+ nextTick(() => {
+ loadDeptOptions();
+ employeeList.value = [];
+ Object.assign(form.value, {
+ id: undefined,
+ title: "",
+ deptId: undefined,
+ payMonth: "",
+ remark: "",
+ });
+ if (type === "edit" && row?.id) {
+ monthlyStatisticsGet(row.id).then((res) => {
+ const d = res.data || {};
+ form.value.id = d.id;
+ form.value.title = d.title ?? d.payDateStr ?? "";
+ form.value.deptId = d.deptId;
+ form.value.payMonth = d.payMonth ?? d.payDate ?? d.payDateStr ?? "";
+ form.value.remark = d.remark ?? "";
+ employeeList.value = (d.detailList || d.employeeList || []).map((e) => ({
+ ...e,
+ basicSalary: parseNum(e.basicSalary),
+ pieceworkSalary: parseNum(e.pieceworkSalary),
+ hourlySalary: parseNum(e.hourlySalary),
+ otherIncome: parseNum(e.otherIncome),
+ socialSecurityIndividuals: parseNum(e.socialSecurityIndividuals),
+ providentFundIndividuals: parseNum(e.providentFundIndividuals),
+ }));
+ });
+ }
+ });
+};
+
+const openAddPerson = () => {
+ loadDeptStaffTree();
+ addPersonVisible.value = true;
+ nextTick(() => {
+ personTreeRef.value?.setCheckedKeys([]);
+ });
+};
+
+const addPersonClose = () => {};
+
+const confirmAddPerson = () => {
+ const tree = personTreeRef.value;
+ if (!tree) {
+ addPersonVisible.value = false;
+ return;
+ }
+ const checked = tree.getCheckedNodes();
+ const staffNodes = checked.filter((n) => n.type === "staff");
+ const existIds = new Set(employeeList.value.map((e) => e.staffId || e.id));
+ staffNodes.forEach((node) => {
+ const id = node.staffId ?? node.id;
+ if (existIds.has(id)) return;
+ existIds.add(id);
+ employeeList.value.push({
+ staffId: id,
+ id: id,
+ staffName: node.label,
+ roleName: node.roleName ?? node.role ?? "",
+ deptName: node.deptName ?? "",
basicSalary: 0,
pieceworkSalary: 0,
hourlySalary: 0,
otherIncome: 0,
socialSecurityIndividuals: 0,
providentFundIndividuals: 0,
- personalIncomeTax: 0,
- otherDeductions: 0,
- payableWages: 0,
- deductibleWages: 0,
- actualWages: 0,
- remark: "",
});
+ });
+ addPersonVisible.value = false;
+};
- if (type === "add") {
- dialogVisible.value = true;
- } else if (type === "edit" || type === "view") {
- if (row && row.id) {
- Object.assign(form, row);
- dialogVisible.value = true;
- }
+const removeEmployee = (row) => {
+ employeeList.value = employeeList.value.filter(
+ (e) => (e.staffId || e.id) !== (row.staffId || row.id)
+ );
+};
+
+const onEmployeeSelectionChange = (selection) => {
+ selectedEmployees.value = selection;
+};
+
+const handleBatchDelete = () => {
+ if (!selectedEmployees.value?.length) {
+ proxy.$modal.msgWarning("璇峰厛鍕鹃�夎鍒犻櫎鐨勫憳宸�");
+ return;
+ }
+ const ids = new Set(selectedEmployees.value.map((e) => e.staffId || e.id));
+ employeeList.value = employeeList.value.filter(
+ (e) => !ids.has(e.staffId || e.id)
+ );
+};
+
+const handleGenerate = () => {
+ proxy.$modal.msgInfo("鐢熸垚宸ヨ祫琛ㄥ姛鑳介渶瀵规帴鍚庣");
+};
+
+const handleExport = () => {
+ proxy.$modal.msgInfo("瀵煎嚭鍔熻兘闇�瀵规帴鍚庣");
+};
+
+const handleImport = () => {
+ proxy.$modal.msgInfo("瀵煎叆鍔熻兘闇�瀵规帴鍚庣");
+};
+
+const handleClear = () => {
+ proxy.$modal.confirm("纭畾娓呯┖褰撳墠鍛樺伐鍒楄〃鍚楋紵").then(() => {
+ employeeList.value = [];
+ }).catch(() => {});
+};
+
+const handleTaxForm = () => {
+ taxDialogVisible.value = true;
+};
+
+const submitForm = () => {
+ formRef.value?.validate((valid) => {
+ if (!valid) return;
+ const payload = {
+ ...form.value,
+ detailList: employeeList.value.map((e) => ({
+ staffId: e.staffId ?? e.id,
+ staffName: e.staffName,
+ basicSalary: parseNum(e.basicSalary),
+ pieceworkSalary: parseNum(e.pieceworkSalary),
+ hourlySalary: parseNum(e.hourlySalary),
+ otherIncome: parseNum(e.otherIncome),
+ socialSecurityIndividuals: parseNum(e.socialSecurityIndividuals),
+ providentFundIndividuals: parseNum(e.providentFundIndividuals),
+ })),
+ };
+ if (props.operationType === "add") {
+ monthlyStatisticsAdd(payload).then(() => {
+ proxy.$modal.msgSuccess("鏂板鎴愬姛");
+ closeDia();
+ });
+ } else {
+ monthlyStatisticsUpdate(payload).then(() => {
+ proxy.$modal.msgSuccess("淇敼鎴愬姛");
+ closeDia();
+ });
}
- };
-
- const submitForm = () => {
- formRef.value.validate(valid => {
- if (valid) {
- form.basicSalary = Number(form.basicSalary);
- form.pieceworkSalary = Number(form.pieceworkSalary);
- form.hourlySalary = Number(form.hourlySalary);
- form.otherIncome = Number(form.otherIncome);
- form.socialSecurityIndividuals = Number(form.socialSecurityIndividuals);
- form.providentFundIndividuals = Number(form.providentFundIndividuals);
- form.personalIncomeTax = Number(form.personalIncomeTax);
- form.otherDeductions = Number(form.otherDeductions);
-
- // 璁＄畻搴斿彂宸ヨ祫銆佸簲鎵ｅ伐璧勫拰瀹炲彂宸ヨ祫
- const payableWages =
- form.basicSalary +
- form.pieceworkSalary +
- form.hourlySalary +
- form.otherIncome;
- const deductibleWages =
- form.socialSecurityIndividuals +
- form.providentFundIndividuals +
- form.personalIncomeTax +
- form.otherDeductions;
- const actualWages = payableWages - deductibleWages;
-
- const submitData = {
- ...form,
- payableWages,
- deductibleWages,
- actualWages,
- };
-
- if (props.operationType === "add") {
- monthlyStatisticsAdd(submitData).then(res => {
- if (res.code === 200) {
- ElMessage.success("鏂板鎴愬姛");
- dialogVisible.value = false;
- emit("close");
- } else {
- ElMessage.error(res.msg || "鏂板澶辫触");
- }
- });
- } else if (props.operationType === "edit") {
- monthlyStatisticsUpdate(submitData).then(res => {
- if (res.code === 200) {
- ElMessage.success("鏇存柊鎴愬姛");
- dialogVisible.value = false;
- emit("close");
- } else {
- ElMessage.error(res.msg || "鏇存柊澶辫触");
- }
- });
- }
- }
- });
- };
-
- onMounted(() => {
- loadUserList();
});
+};
- defineExpose({
- openDialog,
- });
+const closeDia = () => {
+ dialogVisible.value = false;
+ emit("close");
+};
+
+defineExpose({ openDialog });
</script>
<style scoped>
- .dialog-footer {
- text-align: right;
- }
-</style>
\ No newline at end of file
+.form-dia-body {
+ padding: 0;
+}
+.card-title-line {
+ color: #f56c6c;
+ margin-right: 4px;
+}
+.form-card {
+ margin-bottom: 16px;
+}
+.form-card :deep(.el-card__header) {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 12px 16px;
+}
+.card-title {
+ font-weight: 500;
+}
+.card-collapse {
+ color: #999;
+ cursor: pointer;
+}
+.toolbar {
+ margin-bottom: 16px;
+ display: flex;
+ flex-wrap: wrap;
+ gap: 10px;
+}
+.employee-table-wrap {
+ position: relative;
+ min-height: 120px;
+}
+.table-empty {
+ text-align: center;
+ padding: 24px;
+ color: #999;
+ font-size: 14px;
+}
+.add-person-tree {
+ max-height: 360px;
+ overflow-y: auto;
+ padding: 8px 0;
+}
+.tax-desc {
+ margin-bottom: 12px;
+ font-size: 14px;
+ color: #606266;
+}
+.dialog-footer {
+ text-align: right;
+}
+</style>
--
Gitblit v1.9.3