From 9ea5ff67655241271bdf04bb50ca3a8d60c4e22a Mon Sep 17 00:00:00 2001
From: yuan <123@>
Date: 星期二, 11 八月 2026 15:07:02 +0800
Subject: [PATCH] fix: 用河南鹤壁代码覆盖山西长治
---
src/views/personnelManagement/socialSecuritySet/components/formDia.vue | 786 +++++++++++++++++++++++++++----------------------------
1 files changed, 388 insertions(+), 398 deletions(-)
diff --git a/src/views/personnelManagement/socialSecuritySet/components/formDia.vue b/src/views/personnelManagement/socialSecuritySet/components/formDia.vue
index 985a6b1..71f5e61 100644
--- a/src/views/personnelManagement/socialSecuritySet/components/formDia.vue
+++ b/src/views/personnelManagement/socialSecuritySet/components/formDia.vue
@@ -1,31 +1,34 @@
<template>
<div>
- <FormDialog v-model="dialogFormVisible"
- :operation-type="operationType"
- :title="dialogTitle"
- width="80%"
- @close="closeDia"
- @confirm="submitForm"
- @cancel="closeDia">
- <el-form ref="formRef"
- :model="form"
- :rules="rules"
- label-position="top">
+ <FormDialog
+ v-model="dialogFormVisible"
+ :operation-type="operationType"
+ :title="dialogTitle"
+ width="80%"
+ @close="closeDia"
+ @confirm="submitForm"
+ @cancel="closeDia"
+ >
+ <el-form ref="formRef" :model="form" :rules="rules" label-position="top">
<el-row :gutter="24">
<!-- 宸︿晶锛氶�傜敤浜哄憳 -->
<el-col :span="8">
- <el-form-item label="閫傜敤浜哄憳锛�"
- prop="deptIds">
+ <el-form-item label="閫傜敤浜哄憳锛�" prop="deptIds">
<div class="dept-checkbox-wrap">
- <el-checkbox-group v-model="form.deptIds"
- :disabled="isDetail">
- <div v-for="dept in deptList"
- :key="dept.deptId"
- class="dept-checkbox-item">
+ <el-checkbox-group
+ v-model="form.deptIds"
+ :disabled="isDetail"
+ >
+ <div
+ v-for="dept in deptList"
+ :key="dept.deptId"
+ class="dept-checkbox-item"
+ >
<el-checkbox :value="dept.deptId">
{{ dept.deptName }}
- <span v-if="dept.personCount != null"
- class="dept-count">{{ dept.personCount }}浜�</span>
+ <span v-if="dept.personCount != null" class="dept-count"
+ >{{ dept.personCount }}浜�</span
+ >
</el-checkbox>
</div>
</el-checkbox-group>
@@ -35,111 +38,124 @@
<!-- 鍙充晶锛氬熀纭�淇℃伅 + 淇濋櫓绫诲瀷 -->
<el-col :span="16">
<!-- 鍩虹淇℃伅 -->
- <el-card class="form-card"
- shadow="never">
+ <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>
+ <el-icon class="card-collapse"><ArrowUp /></el-icon>
</template>
- <el-form-item label="鏂规鏍囬锛�"
- prop="title">
- <el-input v-model="form.title"
- placeholder="璇疯緭鍏�"
- clearable
- :disabled="isDetail" />
+ <el-form-item label="鏂规鏍囬锛�" prop="title">
+ <el-input
+ v-model="form.title"
+ placeholder="璇疯緭鍏�"
+ clearable
+ :disabled="isDetail"
+ />
</el-form-item>
- <el-form-item label="澶囨敞锛�"
- prop="remark">
- <el-input v-model="form.remark"
- type="textarea"
- :rows="2"
- placeholder="璇疯緭鍏�"
- clearable
- :disabled="isDetail" />
+ <el-form-item label="澶囨敞锛�" prop="remark">
+ <el-input
+ v-model="form.remark"
+ type="textarea"
+ :rows="2"
+ placeholder="璇疯緭鍏�"
+ clearable
+ :disabled="isDetail"
+ />
</el-form-item>
</el-card>
+
<!-- 淇濋櫓绫诲瀷 -->
- <el-card class="form-card"
- shadow="never">
+ <el-card class="form-card" shadow="never">
<template #header>
<span class="card-title"><span class="card-title-line">|</span> 淇濋櫓绫诲瀷</span>
- <el-button v-if="!isDetail"
- type="primary"
- size="small"
- @click="addInsuranceBenefit">
+ <el-button
+ v-if="!isDetail"
+ type="primary"
+ size="small"
+ @click="addInsuranceBenefit"
+ >
娣诲姞淇濋櫓绂忓埄
</el-button>
</template>
<el-row :gutter="16">
- <el-col v-for="(item, index) in form.insuranceBenefits"
- :key="item._key"
- :span="12">
+ <el-col
+ v-for="(item, index) in form.insuranceBenefits"
+ :key="item._key"
+ :span="12"
+ >
<div class="insurance-benefit-card">
<div class="insurance-benefit-title">
淇濋櫓绂忓埄{{ index + 1 }}
- <el-button v-if="!isDetail && form.insuranceBenefits.length > 1"
- type="danger"
- link
- size="small"
- class="card-delete-btn"
- @click="removeInsuranceBenefit(index)">
+ <el-button
+ v-if="!isDetail && form.insuranceBenefits.length > 1"
+ type="danger"
+ link
+ size="small"
+ class="card-delete-btn"
+ @click="removeInsuranceBenefit(index)"
+ >
鍒犻櫎
</el-button>
</div>
- <el-form-item :prop="'insuranceBenefits.' + index + '.insuranceType'"
- label="淇濋櫓绫诲瀷锛�"
- label-width="100px">
- <el-select v-model="item.insuranceType"
- placeholder="璇烽�夋嫨"
- clearable
- style="width: 100%"
- :disabled="isDetail">
- <el-option v-for="opt in insuranceTypeOptions"
- :key="opt.value"
- :label="opt.label"
- :value="opt.value" />
+ <el-form-item
+ :prop="'insuranceBenefits.' + index + '.insuranceType'"
+ label="淇濋櫓绫诲瀷锛�"
+ label-width="100px"
+ >
+ <el-select
+ v-model="item.insuranceType"
+ placeholder="璇烽�夋嫨"
+ clearable
+ style="width: 100%"
+ :disabled="isDetail"
+ >
+ <el-option
+ v-for="opt in insuranceTypeOptions"
+ :key="opt.value"
+ :label="opt.label"
+ :value="opt.value"
+ />
</el-select>
</el-form-item>
- <el-form-item label="缂磋垂鍩烘暟锛�"
- label-width="100px">
+ <el-form-item label="缂磋垂鍩烘暟锛�" label-width="100px">
<div class="base-salary-wrap">
- <el-input v-model="item.paymentBase"
- placeholder="鏍规嵁鍩烘湰宸ヨ祫缂寸撼"
- clearable
- style="width: 120px"
- type="number"
- :disabled="isDetail || item.useBasicSalary"
- @input="handlePaymentBaseInput(item)" />
- <el-checkbox v-model="item.useBasicSalary"
- @change="handleUseBasicSalaryChange(item)"
- :disabled="isDetail">
+ <el-input
+ v-model="item.paymentBase"
+ placeholder="鏍规嵁鍩烘湰宸ヨ祫缂寸撼"
+ clearable
+ style="width: 120px"
+ type="number"
+ :disabled="isDetail || item.useBasicSalary"
+ @input="handlePaymentBaseInput(item)"
+ />
+ <el-checkbox
+ v-model="item.useBasicSalary"
+ @change="handleUseBasicSalaryChange(item)"
+ :disabled="isDetail"
+ >
璋冪敤鍩烘湰宸ヨ祫
</el-checkbox>
</div>
</el-form-item>
- <el-form-item label="涓汉缂磋垂姣斾緥锛�"
- label-width="100px">
+ <el-form-item label="涓汉缂磋垂姣斾緥锛�" label-width="100px">
<div class="personal-ratio-wrap">
- <el-input v-model="item.personalRatio"
- placeholder="璇疯緭鍏�"
- clearable
- style="width: 100px"
- type="number"
- :disabled="isDetail"
- :min="0"
- @input="handlePersonalRatioInput(item)" />
+ <el-input
+ v-model="item.personalRatio"
+ placeholder="璇疯緭鍏�"
+ clearable
+ style="width: 100px"
+ type="number"
+ :disabled="isDetail"
+ />
<span class="ratio-unit">(%)</span>
<span class="ratio-plus">+</span>
- <el-input v-model="item.personalFixed"
- placeholder="璇疯緭鍏�"
- clearable
- style="width: 100px"
- type="number"
- :disabled="isDetail"
- :min="0"
- @input="handlePersonalFixedInput(item)" />
+ <el-input
+ v-model="item.personalFixed"
+ placeholder="璇疯緭鍏�"
+ clearable
+ style="width: 100px"
+ type="number"
+ :disabled="isDetail"
+ />
</div>
</el-form-item>
</div>
@@ -154,327 +170,301 @@
</template>
<script setup>
- import {
- ref,
- reactive,
- toRefs,
- getCurrentInstance,
- nextTick,
- computed,
- } from "vue";
- import FormDialog from "@/components/Dialog/FormDialog.vue";
- import { ArrowUp } from "@element-plus/icons-vue";
- import { listDept } from "@/api/system/dept.js";
- import {
- socialSecurityAdd,
- socialSecurityUpdate,
- } from "@/api/personnelManagement/socialSecuritySet.js";
+import { ref, reactive, toRefs, getCurrentInstance, nextTick, computed } from "vue";
+import FormDialog from "@/components/Dialog/FormDialog.vue";
+import { ArrowUp } from "@element-plus/icons-vue";
+import { listDept } from "@/api/system/dept.js";
+import { socialSecurityAdd, socialSecurityUpdate } from "@/api/personnelManagement/socialSecuritySet.js";
- const emit = defineEmits(["close"]);
- const { proxy } = getCurrentInstance();
+const emit = defineEmits(["close"]);
+const { proxy } = getCurrentInstance();
- const dialogFormVisible = ref(false);
- const operationType = ref("add");
- const formRef = ref(null);
- const deptList = ref([]);
+const dialogFormVisible = ref(false);
+const operationType = ref("add");
+const formRef = ref(null);
+const deptList = ref([]);
- const isDetail = computed(() => operationType.value === "detail");
+const isDetail = computed(() => operationType.value === "detail");
- const dialogTitle = () =>
- operationType.value === "add"
- ? "鏂板鏂规"
- : operationType.value === "edit"
- ? "缂栬緫鏂规"
- : "鏂规璇︽儏";
+const dialogTitle = () =>
+ operationType.value === "add"
+ ? "鏂板鏂规"
+ : operationType.value === "edit"
+ ? "缂栬緫鏂规"
+ : "鏂规璇︽儏";
- // 淇濋櫓绫诲瀷閫夐」锛堝彲鎸夊瓧鍏告浛鎹級
- const insuranceTypeOptions = [
- { label: "鍏昏�佷繚闄�", value: "鍏昏�佷繚闄�" },
- { label: "鍖荤枟淇濋櫓", value: "鍖荤枟淇濋櫓" },
- { label: "澶变笟淇濋櫓", value: "澶变笟淇濋櫓" },
- { label: "宸ヤ激淇濋櫓", value: "宸ヤ激淇濋櫓" },
- { label: "鐢熻偛淇濋櫓", value: "鐢熻偛淇濋櫓" },
- { label: "鍏Н閲�", value: "鍏Н閲�" },
- ];
+// 淇濋櫓绫诲瀷閫夐」锛堝彲鎸夊瓧鍏告浛鎹級
+const insuranceTypeOptions = [
+ { label: "鍏昏�佷繚闄�", value: "鍏昏�佷繚闄�" },
+ { label: "鍖荤枟淇濋櫓", value: "鍖荤枟淇濋櫓" },
+ { label: "澶变笟淇濋櫓", value: "澶变笟淇濋櫓" },
+ { label: "宸ヤ激淇濋櫓", value: "宸ヤ激淇濋櫓" },
+ { label: "鐢熻偛淇濋櫓", value: "鐢熻偛淇濋櫓" },
+ { label: "鍏Н閲�", value: "鍏Н閲�" },
+];
- const defaultBenefit = () => ({
- _key: Math.random().toString(36).slice(2),
- insuranceType: "",
- paymentBase: "",
- useBasicSalary: false,
- personalRatio: "",
- personalFixed: "",
- });
+const defaultBenefit = () => ({
+ _key: Math.random().toString(36).slice(2),
+ insuranceType: "",
+ paymentBase: "",
+ useBasicSalary: false,
+ personalRatio: "",
+ personalFixed: "",
+});
- const data = reactive({
- form: {
- id: undefined,
- title: "",
- remark: "",
- deptIds: [],
- insuranceBenefits: [defaultBenefit()],
- },
- rules: {
- title: [{ required: true, message: "璇疯緭鍏ユ柟妗堟爣棰�", trigger: "blur" }],
- deptIds: [
- {
- required: true,
- type: "array",
- min: 1,
- message: "璇疯嚦灏戦�夋嫨涓�涓�傜敤閮ㄩ棬",
- trigger: "change",
- },
- ],
- },
- });
- const { form, rules } = toRefs(data);
+const data = reactive({
+ form: {
+ id: undefined,
+ title: "",
+ remark: "",
+ deptIds: [],
+ insuranceBenefits: [defaultBenefit()],
+ },
+ rules: {
+ title: [{ required: true, message: "璇疯緭鍏ユ柟妗堟爣棰�", trigger: "blur" }],
+ deptIds: [
+ {
+ required: true,
+ type: "array",
+ min: 1,
+ message: "璇疯嚦灏戦�夋嫨涓�涓�傜敤閮ㄩ棬",
+ trigger: "change",
+ },
+ ],
+ },
+});
+const { form, rules } = toRefs(data);
- function flattenDept(tree, list = []) {
- if (!tree || !tree.length) return list;
- tree.forEach(node => {
- list.push({
- deptId: node.deptId,
- deptName: node.deptName,
- personCount: node.personCount ?? null,
- });
- if (node.children && node.children.length) {
- flattenDept(node.children, list);
- }
+function flattenDept(tree, list = []) {
+ if (!tree || !tree.length) return list;
+ tree.forEach((node) => {
+ list.push({
+ deptId: node.deptId,
+ deptName: node.deptName,
+ personCount: node.personCount ?? null,
});
- return list;
+ if (node.children && node.children.length) {
+ flattenDept(node.children, list);
+ }
+ });
+ return list;
+}
+
+const loadDeptList = () => {
+ listDept().then((res) => {
+ const tree = res.data ?? [];
+ deptList.value = flattenDept(tree);
+ });
+};
+
+const addInsuranceBenefit = () => {
+ form.value.insuranceBenefits.push(defaultBenefit());
+};
+
+const removeInsuranceBenefit = (index) => {
+ form.value.insuranceBenefits.splice(index, 1);
+};
+
+const handleUseBasicSalaryChange = (item) => {
+ if (item.useBasicSalary) {
+ item.paymentBase = "";
}
+};
- const loadDeptList = () => {
- listDept().then(res => {
- const tree = res.data ?? [];
- deptList.value = flattenDept(tree);
- });
+const handlePaymentBaseInput = (item) => {
+ if (item.paymentBase !== "" && item.paymentBase != null) {
+ item.useBasicSalary = false;
+ }
+};
+
+const resetForm = () => {
+ form.value = {
+ id: undefined,
+ title: "",
+ remark: "",
+ deptIds: [],
+ insuranceBenefits: [defaultBenefit()],
};
+};
- const addInsuranceBenefit = () => {
- form.value.insuranceBenefits.push(defaultBenefit());
- };
-
- const removeInsuranceBenefit = index => {
- form.value.insuranceBenefits.splice(index, 1);
- };
-
- const handleUseBasicSalaryChange = item => {
- if (item.useBasicSalary) {
- item.paymentBase = "";
+const openDialog = (type, row) => {
+ operationType.value = type;
+ dialogFormVisible.value = true;
+ loadDeptList();
+ resetForm();
+ if ((type === "edit" || type === "detail") && row) {
+ const d = row || {};
+ form.value.id = d.id;
+ form.value.title = d.title;
+ form.value.remark = d.remark ?? "";
+ // deptIds 鍚庣鍙兘鏄�楀彿鍒嗛殧瀛楃涓叉垨鏁扮粍锛岃繖閲岀粺涓�杞负鏁扮粍骞跺敖閲忚繕鍘熸暟鍊肩被鍨�
+ if (d.deptIds) {
+ form.value.deptIds = String(d.deptIds)
+ .split(",")
+ .filter((v) => v !== "")
+ .map((v) => {
+ const num = Number(v);
+ return Number.isNaN(num) ? v : num;
+ });
+ } else {
+ form.value.deptIds = [];
}
- };
+ const detailList = d.schemeInsuranceDetailList || [];
+ form.value.insuranceBenefits =
+ detailList.length > 0
+ ? detailList.map((b) => ({
+ _key: Math.random().toString(36).slice(2),
+ insuranceType: b.insuranceType || "",
+ paymentBase: b.paymentBase ?? "",
+ useBasicSalary: b.useBasicSalary === 2,
+ personalRatio: b.personalRatio ?? "",
+ personalFixed: b.personalFixed ?? "",
+ }))
+ : [defaultBenefit()];
+ }
+};
- const handlePaymentBaseInput = item => {
- if (item.paymentBase !== "" && item.paymentBase != null) {
- item.useBasicSalary = false;
- }
- };
-
- const handlePersonalRatioInput = item => {
- if (item.personalRatio !== "" && item.personalRatio != null) {
- const value = Number(item.personalRatio);
- if (value < 0) {
- item.personalRatio = "";
- }
- }
- };
-
- const handlePersonalFixedInput = item => {
- if (item.personalFixed !== "" && item.personalFixed != null) {
- const value = Number(item.personalFixed);
- if (value < 0) {
- item.personalFixed = "";
- }
- }
- };
-
- const resetForm = () => {
- form.value = {
- id: undefined,
- title: "",
- remark: "",
- deptIds: [],
- insuranceBenefits: [defaultBenefit()],
- };
- };
-
- const openDialog = (type, row) => {
- operationType.value = type;
- dialogFormVisible.value = true;
- loadDeptList();
- resetForm();
- if ((type === "edit" || type === "detail") && row) {
- const d = row || {};
- form.value.id = d.id;
- form.value.title = d.title;
- form.value.remark = d.remark ?? "";
- // deptIds 鍚庣鍙兘鏄�楀彿鍒嗛殧瀛楃涓叉垨鏁扮粍锛岃繖閲岀粺涓�杞负鏁扮粍骞跺敖閲忚繕鍘熸暟鍊肩被鍨�
- if (d.deptIds) {
- form.value.deptIds = String(d.deptIds)
- .split(",")
- .filter(v => v !== "")
- .map(v => {
- const num = Number(v);
- return Number.isNaN(num) ? v : num;
- });
- } else {
- form.value.deptIds = [];
- }
- const detailList = d.schemeInsuranceDetailList || [];
- form.value.insuranceBenefits =
- detailList.length > 0
- ? detailList.map(b => ({
- _key: Math.random().toString(36).slice(2),
- insuranceType: b.insuranceType || "",
- paymentBase: b.paymentBase ?? "",
- useBasicSalary: b.useBasicSalary === 2,
- personalRatio: b.personalRatio ?? "",
- personalFixed: b.personalFixed ?? "",
- }))
- : [defaultBenefit()];
- }
- };
-
- const submitForm = () => {
- // 璇︽儏妯″紡涓嬩笉鎻愪氦锛屽彧鍏抽棴寮圭獥
- if (operationType.value === "detail") {
- closeDia();
- return;
- }
- formRef.value?.validate(valid => {
- if (!valid) return;
- const deptIds =
- Array.isArray(form.value.deptIds) && form.value.deptIds.length
- ? form.value.deptIds.join(",")
- : "";
- const schemeInsuranceDetailList = (form.value.insuranceBenefits || []).map(
- ({ _key, ...rest }) => ({
- ...rest,
- useBasicSalary: rest.useBasicSalary ? 2 : 1,
- })
- );
- const insuranceTypes = schemeInsuranceDetailList
- .map(item => item.insuranceType)
- .filter(v => v)
- .join(",");
- // 閮ㄩ棬鍚嶇О锛屽涓娇鐢ㄩ�楀彿闅斿紑锛堟牴鎹�変腑鐨� deptIds 涓� deptList 璁＄畻锛�
- const deptNames = (deptList.value || [])
- .filter(d =>
- (form.value.deptIds || []).some(id => String(id) === String(d.deptId))
+const submitForm = () => {
+ // 璇︽儏妯″紡涓嬩笉鎻愪氦锛屽彧鍏抽棴寮圭獥
+ if (operationType.value === "detail") {
+ closeDia();
+ return;
+ }
+ formRef.value?.validate((valid) => {
+ if (!valid) return;
+ const deptIds =
+ Array.isArray(form.value.deptIds) && form.value.deptIds.length
+ ? form.value.deptIds.join(",")
+ : "";
+ const schemeInsuranceDetailList = (form.value.insuranceBenefits || []).map(
+ ({ _key, ...rest }) => ({
+ ...rest,
+ useBasicSalary: rest.useBasicSalary ? 2 : 1,
+ })
+ );
+ const insuranceTypes = schemeInsuranceDetailList
+ .map((item) => item.insuranceType)
+ .filter((v) => v)
+ .join(",");
+ // 閮ㄩ棬鍚嶇О锛屽涓娇鐢ㄩ�楀彿闅斿紑锛堟牴鎹�変腑鐨� deptIds 涓� deptList 璁＄畻锛�
+ const deptNames = (deptList.value || [])
+ .filter((d) =>
+ (form.value.deptIds || []).some(
+ (id) => String(id) === String(d.deptId)
)
- .map(d => d.deptName)
- .join(",");
- const submitData = {
- id: form.value.id,
- title: form.value.title,
- remark: form.value.remark ?? "",
- deptIds,
- insuranceTypes,
- deptNames,
- schemeInsuranceDetailList,
- };
- if (operationType.value === "add") {
- socialSecurityAdd(submitData).then(() => {
- proxy.$modal.msgSuccess("鏂板鎴愬姛");
- closeDia();
- });
- } else {
- socialSecurityUpdate(submitData).then(() => {
- proxy.$modal.msgSuccess("淇敼鎴愬姛");
- closeDia();
- });
- }
- });
- };
+ )
+ .map((d) => d.deptName)
+ .join(",");
+ const submitData = {
+ id: form.value.id,
+ title: form.value.title,
+ remark: form.value.remark ?? "",
+ deptIds,
+ insuranceTypes,
+ deptNames,
+ schemeInsuranceDetailList,
+ };
+ if (operationType.value === "add") {
+ socialSecurityAdd(submitData).then(() => {
+ proxy.$modal.msgSuccess("鏂板鎴愬姛");
+ closeDia();
+ });
+ } else {
+ socialSecurityUpdate(submitData).then(() => {
+ proxy.$modal.msgSuccess("淇敼鎴愬姛");
+ closeDia();
+ });
+ }
+ });
+};
- const closeDia = () => {
- proxy.resetForm?.("formRef");
- dialogFormVisible.value = false;
- emit("close");
- };
+const closeDia = () => {
+ proxy.resetForm?.("formRef");
+ dialogFormVisible.value = false;
+ emit("close");
+};
- defineExpose({ openDialog });
+defineExpose({ openDialog });
</script>
<style scoped>
- .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;
- }
- .dept-checkbox-wrap {
- max-height: 320px;
- overflow-y: auto;
- padding: 8px 0;
- border: 1px solid var(--el-border-color);
- border-radius: 4px;
- background: #fff;
- }
- .dept-checkbox-item {
- padding: 6px 12px;
- }
- .dept-count {
- color: #909399;
- font-size: 12px;
- margin-left: 4px;
- }
- .insurance-benefit-card {
- border: 1px solid var(--el-border-color-lighter);
- border-radius: 4px;
- padding: 12px 16px;
- margin-bottom: 12px;
- background: #fafafa;
- }
- .insurance-benefit-title {
- font-size: 14px;
- margin-bottom: 12px;
- font-weight: 500;
- display: flex;
- align-items: center;
- justify-content: space-between;
- }
- .card-delete-btn {
- margin-left: auto;
- }
- .checkbox-group-inline {
- display: flex;
- flex-wrap: wrap;
- gap: 16px;
- }
- .base-salary-wrap {
- display: flex;
- flex-wrap: wrap;
- align-items: center;
- gap: 8px;
- }
- .base-salary-text {
- color: #606266;
- font-size: 14px;
- }
- .personal-ratio-wrap {
- display: flex;
- align-items: center;
- gap: 8px;
- }
- .ratio-unit,
- .ratio-plus {
- color: #606266;
- font-size: 14px;
- }
+.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;
+}
+.dept-checkbox-wrap {
+ max-height: 320px;
+ overflow-y: auto;
+ padding: 8px 0;
+ border: 1px solid var(--el-border-color);
+ border-radius: 4px;
+ background: #fff;
+}
+.dept-checkbox-item {
+ padding: 6px 12px;
+}
+.dept-count {
+ color: #909399;
+ font-size: 12px;
+ margin-left: 4px;
+}
+.insurance-benefit-card {
+ border: 1px solid var(--el-border-color-lighter);
+ border-radius: 4px;
+ padding: 12px 16px;
+ margin-bottom: 12px;
+ background: #fafafa;
+}
+.insurance-benefit-title {
+ font-size: 14px;
+ margin-bottom: 12px;
+ font-weight: 500;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+}
+.card-delete-btn {
+ margin-left: auto;
+}
+.checkbox-group-inline {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 16px;
+}
+.base-salary-wrap {
+ display: flex;
+ flex-wrap: wrap;
+ align-items: center;
+ gap: 8px;
+}
+.base-salary-text {
+ color: #606266;
+ font-size: 14px;
+}
+.personal-ratio-wrap {
+ display: flex;
+ align-items: center;
+ gap: 8px;
+}
+.ratio-unit,
+.ratio-plus {
+ color: #606266;
+ font-size: 14px;
+}
</style>
--
Gitblit v1.9.3