From 55f89d384b3286e6a4251d758d6593e938527d4b Mon Sep 17 00:00:00 2001
From: selfrelease <freedak.ipad@gmail.com>
Date: Sat, 15 Aug 2026 14:47:48 +0800
Subject: [PATCH] =?UTF-8?q?ux:=20=E8=8A=B1=E5=90=8D=E5=86=8C=E6=93=8D?=
 =?UTF-8?q?=E4=BD=9C=E5=9B=BE=E6=A0=87=E6=8C=89=E9=92=AE=E5=88=86=E4=B8=A4?=
 =?UTF-8?q?=E8=A1=8C=E6=98=BE=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

第一行：调薪、转正、调部门
第二行：开具证明、续签合同、离职

Generated with [Devin](https://devin.ai)

Co-Authored-By: Devin <158243242+devin-ai-integration[bot]@users.noreply.github.com>
---
 frontend/src/pages/Roster.tsx | 176 +++++++++++++++++-----------------
 1 file changed, 90 insertions(+), 86 deletions(-)

diff --git a/frontend/src/pages/Roster.tsx b/frontend/src/pages/Roster.tsx
index b01cbf9..788e1e8 100644
--- a/frontend/src/pages/Roster.tsx
+++ b/frontend/src/pages/Roster.tsx
@@ -841,100 +841,104 @@ export default function Roster() {
                     </td>}
                     <td className="px-4 py-3 text-center">
                       {e.status === 'ACTIVE' && (!e.hasTermination || e.latestTerminationStatus === 'CANCELLED' || e.latestTerminationStatus === 'COMPLETED') && (
-                        <div className="flex items-center justify-center gap-2">
-                          <button
-                            type="button"
-                            title="调薪"
-                            aria-label={`为${e.name}调薪`}
-                            className="rounded-md p-1.5 text-gray-500 transition hover:bg-primary/10 hover:text-primary"
-                            onClick={(ev) => {
-                              ev.stopPropagation()
-                              setSalaryEmployee(e)
-                              setShowSalaryModal(true)
-                            }}
-                          >
-                            <DollarSign className="h-4 w-4" />
-                          </button>
-                          {/* 试用期员工显示转正按钮 */}
-                          {e.probationInfo?.isProbation && (
+                        <div className="flex flex-col items-center gap-1">
+                          <div className="flex items-center justify-center gap-1">
                             <button
                               type="button"
-                              title="转正"
-                              aria-label={`为${e.name}办理转正`}
+                              title="调薪"
+                              aria-label={`为${e.name}调薪`}
                               className="rounded-md p-1.5 text-gray-500 transition hover:bg-primary/10 hover:text-primary"
                               onClick={(ev) => {
                                 ev.stopPropagation()
-                                setConfirmEmployee(e)
-                                setShowConfirmModal(true)
+                                setSalaryEmployee(e)
+                                setShowSalaryModal(true)
                               }}
                             >
-                              <CheckCircle className="h-4 w-4" />
+                              <DollarSign className="h-4 w-4" />
                             </button>
-                          )}
-                          <button
-                            type="button"
-                            title="调部门"
-                            aria-label={`为${e.name}调整部门`}
-                            className="rounded-md p-1.5 text-gray-500 transition hover:bg-primary/10 hover:text-primary"
-                            onClick={(ev) => {
-                              ev.stopPropagation()
-                              setDeptEmployee(e)
-                              setShowDeptModal(true)
-                            }}
-                          >
-                            <Building2 className="h-4 w-4" />
-                          </button>
-                          <button
-                            type="button"
-                            title="开具证明"
-                            aria-label={`为${e.name}开具证明`}
-                            className="rounded-md p-1.5 text-gray-500 transition hover:bg-primary/10 hover:text-primary"
-                            onClick={(ev) => {
-                              ev.stopPropagation()
-                              setCertEmployee(e)
-                              setCertPurpose('')
-                              setShowCertModal(true)
-                            }}
-                          >
-                            <FileText className="h-4 w-4" />
-                          </button>
-                          <button
-                            type="button"
-                            title="续签合同"
-                            aria-label={`为${e.name}续签合同`}
-                            className="rounded-md p-1.5 text-gray-500 transition hover:bg-primary/10 hover:text-primary"
-                            onClick={(ev) => {
-                              ev.stopPropagation()
-                              // 自动推导新合同开始日期：原合同结束日 + 1天
-                              const oldEndDate = e.latestContract?.endDate
-                              let newStart = new Date().toISOString().slice(0, 10)
-                              if (oldEndDate) {
-                                const d = new Date(oldEndDate)
-                                d.setDate(d.getDate() + 1)
-                                newStart = d.toISOString().slice(0, 10)
-                              }
-                              setRenewEmployee(e)
-                              setRenewNewStartDate(newStart)
-                              setRenewNewEndDate('')
-                              setRenewNewSalary(e.monthlySalary ? String(e.monthlySalary) : '')
-                              setShowRenewModal(true)
-                            }}
-                          >
-                            <RotateCcw className="h-4 w-4" />
-                          </button>
-                          <button
-                            type="button"
-                            title="离职"
-                            aria-label={`为${e.name}办理离职`}
-                            className="rounded-md p-1.5 text-gray-500 transition hover:bg-danger/10 hover:text-danger"
-                            onClick={(ev) => {
-                              ev.stopPropagation()
-                              setResignEmployee(e)
-                              setShowResignModal(true)
-                            }}
-                          >
-                            <UserX className="h-4 w-4" />
-                          </button>
+                            {/* 试用期员工显示转正按钮 */}
+                            {e.probationInfo?.isProbation && (
+                              <button
+                                type="button"
+                                title="转正"
+                                aria-label={`为${e.name}办理转正`}
+                                className="rounded-md p-1.5 text-gray-500 transition hover:bg-primary/10 hover:text-primary"
+                                onClick={(ev) => {
+                                  ev.stopPropagation()
+                                  setConfirmEmployee(e)
+                                  setShowConfirmModal(true)
+                                }}
+                              >
+                                <CheckCircle className="h-4 w-4" />
+                              </button>
+                            )}
+                            <button
+                              type="button"
+                              title="调部门"
+                              aria-label={`为${e.name}调整部门`}
+                              className="rounded-md p-1.5 text-gray-500 transition hover:bg-primary/10 hover:text-primary"
+                              onClick={(ev) => {
+                                ev.stopPropagation()
+                                setDeptEmployee(e)
+                                setShowDeptModal(true)
+                              }}
+                            >
+                              <Building2 className="h-4 w-4" />
+                            </button>
+                          </div>
+                          <div className="flex items-center justify-center gap-1">
+                            <button
+                              type="button"
+                              title="开具证明"
+                              aria-label={`为${e.name}开具证明`}
+                              className="rounded-md p-1.5 text-gray-500 transition hover:bg-primary/10 hover:text-primary"
+                              onClick={(ev) => {
+                                ev.stopPropagation()
+                                setCertEmployee(e)
+                                setCertPurpose('')
+                                setShowCertModal(true)
+                              }}
+                            >
+                              <FileText className="h-4 w-4" />
+                            </button>
+                            <button
+                              type="button"
+                              title="续签合同"
+                              aria-label={`为${e.name}续签合同`}
+                              className="rounded-md p-1.5 text-gray-500 transition hover:bg-primary/10 hover:text-primary"
+                              onClick={(ev) => {
+                                ev.stopPropagation()
+                                // 自动推导新合同开始日期：原合同结束日 + 1天
+                                const oldEndDate = e.latestContract?.endDate
+                                let newStart = new Date().toISOString().slice(0, 10)
+                                if (oldEndDate) {
+                                  const d = new Date(oldEndDate)
+                                  d.setDate(d.getDate() + 1)
+                                  newStart = d.toISOString().slice(0, 10)
+                                }
+                                setRenewEmployee(e)
+                                setRenewNewStartDate(newStart)
+                                setRenewNewEndDate('')
+                                setRenewNewSalary(e.monthlySalary ? String(e.monthlySalary) : '')
+                                setShowRenewModal(true)
+                              }}
+                            >
+                              <RotateCcw className="h-4 w-4" />
+                            </button>
+                            <button
+                              type="button"
+                              title="离职"
+                              aria-label={`为${e.name}办理离职`}
+                              className="rounded-md p-1.5 text-gray-500 transition hover:bg-danger/10 hover:text-danger"
+                              onClick={(ev) => {
+                                ev.stopPropagation()
+                                setResignEmployee(e)
+                                setShowResignModal(true)
+                              }}
+                            >
+                              <UserX className="h-4 w-4" />
+                            </button>
+                          </div>
                         </div>
                       )}
                       {e.hasTermination && e.status === 'ACTIVE' && e.latestTerminationStatus !== 'CANCELLED' && e.latestTerminationStatus !== 'COMPLETED' && (