样式修改
This commit is contained in:
@@ -109,39 +109,33 @@
|
|||||||
</el-dialog>
|
</el-dialog>
|
||||||
|
|
||||||
<!-- 工资配置对话框 -->
|
<!-- 工资配置对话框 -->
|
||||||
|
<div class="salary-config-dialog">
|
||||||
<el-dialog v-model="salaryDialogVisible" title="工资配置" width="600px">
|
<el-dialog v-model="salaryDialogVisible" title="工资配置" width="600px">
|
||||||
|
<div class="salary-config-form">
|
||||||
<el-form :model="salaryForm" :rules="salaryRules" ref="salaryFormRef" label-width="140px">
|
<el-form :model="salaryForm" :rules="salaryRules" ref="salaryFormRef" label-width="140px">
|
||||||
<el-form-item label="基本工资" prop="baseSalary" required>
|
<el-form-item label="基本工资">
|
||||||
<el-input-number v-model="salaryForm.baseSalary" :min="0" :precision="2" :step="100" style="width: 200px" />
|
<el-input-number v-model="salaryForm.baseSalary" :min="0" :precision="2" :step="100" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="总经理补贴" prop="managerAllowance" required>
|
<el-form-item label="总经理补贴" prop="managerAllowance" required>
|
||||||
<el-input-number v-model="salaryForm.managerAllowance" :min="0" :precision="2" :step="100"
|
<el-input-number v-model="salaryForm.managerAllowance" :min="0" :precision="2" :step="100" />
|
||||||
style="width: 200px" />
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="交通补贴" prop="transportationAllowance" required>
|
<el-form-item label="交通补贴">
|
||||||
<el-input-number v-model="salaryForm.transportationAllowance" :min="0" :precision="2" :step="100"
|
<el-input-number v-model="salaryForm.transportationAllowance" :min="0" :precision="2" :step="100" />
|
||||||
style="width: 200px" />
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="其他补贴" prop="otherAllowance" required>
|
<el-form-item label="其他补贴" prop="otherAllowance" required>
|
||||||
<el-input-number v-model="salaryForm.otherAllowance" :min="0" :precision="2" :step="100"
|
<el-input-number v-model="salaryForm.otherAllowance" :min="0" :precision="2" :step="100" />
|
||||||
style="width: 200px" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="工龄工资" prop="senioritySalary" required>
|
|
||||||
<el-input-number v-model="salaryForm.senioritySalary" :min="0" :precision="2" :step="100"
|
|
||||||
style="width: 200px" />
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="年度绩效奖金" prop="annualPerformanceBonus" required>
|
<el-form-item label="年度绩效奖金" prop="annualPerformanceBonus" required>
|
||||||
<el-input-number v-model="salaryForm.annualPerformanceBonus" :min="0" :precision="2" :step="100"
|
<el-input-number v-model="salaryForm.annualPerformanceBonus" :min="0" :precision="2" :step="100" />
|
||||||
style="width: 200px" />
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="月度绩效奖金" prop="monthlyPerformanceBonus" required>
|
<el-form-item label="月度绩效奖金" prop="monthlyPerformanceBonus" required>
|
||||||
<el-input-number v-model="salaryForm.monthlyPerformanceBonus" :min="0" :precision="2" :step="100"
|
<el-input-number v-model="salaryForm.monthlyPerformanceBonus" :min="0" :precision="2" :step="100" />
|
||||||
style="width: 200px" />
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="其他奖金" prop="otherBonus" required>
|
<el-form-item label="其他奖金" prop="otherBonus" required>
|
||||||
<el-input-number v-model="salaryForm.otherBonus" :min="0" :precision="2" :step="100" style="width: 200px" />
|
<el-input-number v-model="salaryForm.otherBonus" :min="0" :precision="2" :step="100" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
|
</div>
|
||||||
<template #footer>
|
<template #footer>
|
||||||
<span class="dialog-footer">
|
<span class="dialog-footer">
|
||||||
<el-button @click="salaryDialogVisible = false">取消</el-button>
|
<el-button @click="salaryDialogVisible = false">取消</el-button>
|
||||||
@@ -149,6 +143,7 @@
|
|||||||
</span>
|
</span>
|
||||||
</template>
|
</template>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
|
||||||
<!-- 添加成员对话框 -->
|
<!-- 添加成员对话框 -->
|
||||||
<el-dialog v-model="addUserDialogVisible" title="添加成员" width="800px">
|
<el-dialog v-model="addUserDialogVisible" title="添加成员" width="800px">
|
||||||
@@ -241,7 +236,6 @@ const salaryForm = ref({
|
|||||||
managerAllowance: 0,
|
managerAllowance: 0,
|
||||||
transportationAllowance: 0,
|
transportationAllowance: 0,
|
||||||
otherAllowance: 0,
|
otherAllowance: 0,
|
||||||
senioritySalary: 0,
|
|
||||||
annualPerformanceBonus: 0,
|
annualPerformanceBonus: 0,
|
||||||
monthlyPerformanceBonus: 0,
|
monthlyPerformanceBonus: 0,
|
||||||
otherBonus: 0
|
otherBonus: 0
|
||||||
@@ -266,9 +260,6 @@ const salaryRules = {
|
|||||||
otherAllowance: [
|
otherAllowance: [
|
||||||
{ required: true, message: '请输入其他补贴', trigger: 'blur' }
|
{ required: true, message: '请输入其他补贴', trigger: 'blur' }
|
||||||
],
|
],
|
||||||
senioritySalary: [
|
|
||||||
{ required: true, message: '请输入工龄工资', trigger: 'blur' }
|
|
||||||
],
|
|
||||||
annualPerformanceBonus: [
|
annualPerformanceBonus: [
|
||||||
{ required: true, message: '请输入年度绩效奖金', trigger: 'blur' }
|
{ required: true, message: '请输入年度绩效奖金', trigger: 'blur' }
|
||||||
],
|
],
|
||||||
@@ -459,7 +450,6 @@ const handleViewSalary = async (user) => {
|
|||||||
managerAllowance: result.managerAllowance,
|
managerAllowance: result.managerAllowance,
|
||||||
transportationAllowance: result.transportationAllowance,
|
transportationAllowance: result.transportationAllowance,
|
||||||
otherAllowance: result.otherAllowance,
|
otherAllowance: result.otherAllowance,
|
||||||
senioritySalary: result.senioritySalary,
|
|
||||||
annualPerformanceBonus: result.annualPerformanceBonus,
|
annualPerformanceBonus: result.annualPerformanceBonus,
|
||||||
monthlyPerformanceBonus: result.monthlyPerformanceBonus,
|
monthlyPerformanceBonus: result.monthlyPerformanceBonus,
|
||||||
otherBonus: result.otherBonus
|
otherBonus: result.otherBonus
|
||||||
@@ -487,7 +477,6 @@ const handleSalarySubmit = async () => {
|
|||||||
managerAllowance: salaryForm.value.managerAllowance,
|
managerAllowance: salaryForm.value.managerAllowance,
|
||||||
transportationAllowance: salaryForm.value.transportationAllowance,
|
transportationAllowance: salaryForm.value.transportationAllowance,
|
||||||
otherAllowance: salaryForm.value.otherAllowance,
|
otherAllowance: salaryForm.value.otherAllowance,
|
||||||
senioritySalary: salaryForm.value.senioritySalary,
|
|
||||||
annualPerformanceBonus: salaryForm.value.annualPerformanceBonus,
|
annualPerformanceBonus: salaryForm.value.annualPerformanceBonus,
|
||||||
monthlyPerformanceBonus: salaryForm.value.monthlyPerformanceBonus,
|
monthlyPerformanceBonus: salaryForm.value.monthlyPerformanceBonus,
|
||||||
otherBonus: salaryForm.value.otherBonus
|
otherBonus: salaryForm.value.otherBonus
|
||||||
@@ -808,4 +797,63 @@ onMounted(() => {
|
|||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.salary-config-dialog {
|
||||||
|
:deep(.el-dialog__body) {
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.el-dialog__header) {
|
||||||
|
margin: 0;
|
||||||
|
padding: 20px;
|
||||||
|
border-bottom: 1px solid var(--el-border-color-light);
|
||||||
|
background-color: var(--el-bg-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.el-dialog__footer) {
|
||||||
|
padding: 20px;
|
||||||
|
border-top: 1px solid var(--el-border-color-light);
|
||||||
|
background-color: var(--el-bg-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.el-dialog) {
|
||||||
|
border-radius: 8px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.salary-config-form {
|
||||||
|
padding: 20px;
|
||||||
|
background-color: #f8fafd;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
|
||||||
|
|
||||||
|
:deep(.el-form-item) {
|
||||||
|
margin-bottom: 20px;
|
||||||
|
|
||||||
|
.el-form-item__label {
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333;
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-input-number {
|
||||||
|
width: 100%;
|
||||||
|
min-width: 120px;
|
||||||
|
|
||||||
|
.el-input__wrapper {
|
||||||
|
padding-right: 40px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.dialog-footer {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
gap: 12px;
|
||||||
|
padding: 16px 20px;
|
||||||
|
border-top: 1px solid var(--el-border-color-light);
|
||||||
|
background-color: var(--el-bg-color);
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Reference in New Issue
Block a user