样式修改

src/views/groupManagement/index.vue

@@ -109,46 +109,41 @@
     </el-dialog>
 
     <!-- 工资配置对话框 -->
-    <el-dialog v-model="salaryDialogVisible" title="工资配置" width="600px">
-      <el-form :model="salaryForm" :rules="salaryRules" ref="salaryFormRef" label-width="140px">
-        <el-form-item label="基本工资" prop="baseSalary" required>
-          <el-input-number v-model="salaryForm.baseSalary" :min="0" :precision="2" :step="100" style="width: 200px" />
-        </el-form-item>
-        <el-form-item label="总经理补贴" prop="managerAllowance" required>
-          <el-input-number v-model="salaryForm.managerAllowance" :min="0" :precision="2" :step="100"
-            style="width: 200px" />
-        </el-form-item>
-        <el-form-item label="交通补贴" prop="transportationAllowance" required>
-          <el-input-number v-model="salaryForm.transportationAllowance" :min="0" :precision="2" :step="100"
-            style="width: 200px" />
-        </el-form-item>
-        <el-form-item label="其他补贴" prop="otherAllowance" required>
-          <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 label="年度绩效奖金" prop="annualPerformanceBonus" required>
-          <el-input-number v-model="salaryForm.annualPerformanceBonus" :min="0" :precision="2" :step="100"
-            style="width: 200px" />
-        </el-form-item>
-        <el-form-item label="月度绩效奖金" prop="monthlyPerformanceBonus" required>
-          <el-input-number v-model="salaryForm.monthlyPerformanceBonus" :min="0" :precision="2" :step="100"
-            style="width: 200px" />
-        </el-form-item>
-        <el-form-item label="其他奖金" prop="otherBonus" required>
-          <el-input-number v-model="salaryForm.otherBonus" :min="0" :precision="2" :step="100" style="width: 200px" />
-        </el-form-item>
-      </el-form>
-      <template #footer>
-        <span class="dialog-footer">
-          <el-button @click="salaryDialogVisible = false">取消</el-button>
-          <el-button type="primary" @click="handleSalarySubmit">确定</el-button>
-        </span>
-      </template>
-    </el-dialog>
+    <div class="salary-config-dialog">
+      <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-item label="基本工资">
+              <el-input-number v-model="salaryForm.baseSalary" :min="0" :precision="2" :step="100" />
+            </el-form-item>
+            <el-form-item label="总经理补贴" prop="managerAllowance" required>
+              <el-input-number v-model="salaryForm.managerAllowance" :min="0" :precision="2" :step="100" />
+            </el-form-item>
+            <el-form-item label="交通补贴">
+              <el-input-number v-model="salaryForm.transportationAllowance" :min="0" :precision="2" :step="100" />
+            </el-form-item>
+            <el-form-item label="其他补贴" prop="otherAllowance" required>
+              <el-input-number v-model="salaryForm.otherAllowance" :min="0" :precision="2" :step="100" />
+            </el-form-item>
+            <el-form-item label="年度绩效奖金" prop="annualPerformanceBonus" required>
+              <el-input-number v-model="salaryForm.annualPerformanceBonus" :min="0" :precision="2" :step="100" />
+            </el-form-item>
+            <el-form-item label="月度绩效奖金" prop="monthlyPerformanceBonus" required>
+              <el-input-number v-model="salaryForm.monthlyPerformanceBonus" :min="0" :precision="2" :step="100" />
+            </el-form-item>
+            <el-form-item label="其他奖金" prop="otherBonus" required>
+              <el-input-number v-model="salaryForm.otherBonus" :min="0" :precision="2" :step="100" />
+            </el-form-item>
+          </el-form>
+        </div>
+        <template #footer>
+          <span class="dialog-footer">
+            <el-button @click="salaryDialogVisible = false">取消</el-button>
+            <el-button type="primary" @click="handleSalarySubmit">确定</el-button>
+          </span>
+        </template>
+      </el-dialog>
+    </div>
 
     <!-- 添加成员对话框 -->
     <el-dialog v-model="addUserDialogVisible" title="添加成员" width="800px">
@@ -241,7 +236,6 @@ const salaryForm = ref({
   managerAllowance: 0,
   transportationAllowance: 0,
   otherAllowance: 0,
-  senioritySalary: 0,
   annualPerformanceBonus: 0,
   monthlyPerformanceBonus: 0,
   otherBonus: 0
@@ -266,9 +260,6 @@ const salaryRules = {
   otherAllowance: [
     { required: true, message: '请输入其他补贴', trigger: 'blur' }
   ],
-  senioritySalary: [
-    { required: true, message: '请输入工龄工资', trigger: 'blur' }
-  ],
   annualPerformanceBonus: [
     { required: true, message: '请输入年度绩效奖金', trigger: 'blur' }
   ],
@@ -459,7 +450,6 @@ const handleViewSalary = async (user) => {
         managerAllowance: result.managerAllowance,
         transportationAllowance: result.transportationAllowance,
         otherAllowance: result.otherAllowance,
-        senioritySalary: result.senioritySalary,
         annualPerformanceBonus: result.annualPerformanceBonus,
         monthlyPerformanceBonus: result.monthlyPerformanceBonus,
         otherBonus: result.otherBonus
@@ -487,7 +477,6 @@ const handleSalarySubmit = async () => {
           managerAllowance: salaryForm.value.managerAllowance,
           transportationAllowance: salaryForm.value.transportationAllowance,
           otherAllowance: salaryForm.value.otherAllowance,
-          senioritySalary: salaryForm.value.senioritySalary,
           annualPerformanceBonus: salaryForm.value.annualPerformanceBonus,
           monthlyPerformanceBonus: salaryForm.value.monthlyPerformanceBonus,
           otherBonus: salaryForm.value.otherBonus
@@ -808,4 +797,63 @@ onMounted(() => {
   border-radius: 8px;
   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>