购买 CDK 入口改为原生锚点链接：修复手机浏览器 window.open 被强制当前页打开

手机浏览器（UC/夸克等）把程序化 window.open 当弹窗强制降级为当前页跳转，
换成 <a target=_blank rel=noopener> 走浏览器原生新标签页处理。
微信 WebView 无 tab 概念，仍为当前页打开（平台限制）。

backed/cmd/server/main.go

@@ -37,6 +37,8 @@ func main() {
 
 	// 连接数据库
 	database.Init()
+	// 存量用户补齐邀请码（每个用户都应有邀请码；无缺失时仅一次查询）
+	handler.BackfillInviteCodes()
 
 	// 连接 Redis（验证码存储/限流）
 	service.InitRedis()
@@ -84,7 +86,6 @@ func main() {
 	auth.Post("/login/mfa/send", handler.MFASendCode)
 	auth.Post("/refresh", handler.RefreshToken)
 	auth.Get("/userinfo", middleware.AuthRequired(), handler.GetUserInfo)
-	auth.Post("/generate-invite", middleware.AuthRequired(), handler.GenerateMyInviteCode)
 	auth.Get("/my-invite", middleware.AuthRequired(), handler.GetMyInviteInfo)
 	auth.Post("/bind-invite", middleware.AuthRequired(), handler.BindInviteCode)
 	auth.Post("/redeem-invite", middleware.AuthRequired(), handler.RedeemInviteReward)
@@ -119,6 +120,7 @@ func main() {
 	leave.Post("/apply-approvers", handler.GetLeaveApplyApprovers)
 	leave.Post("/cc-search", handler.GetLeaveNewCcSearch)
 	leave.Post("/apply", handler.ExecuteLeaveApply)
+	leave.Post("/extend-prefill", handler.GetLeaveExtendPrefill)
 
 	// CDK 兑换
 	cdk := api.Group("/cdk", middleware.AuthRequired())

backed/internal/handler/admin_user.go

@@ -404,7 +404,7 @@ const adminLogUnionSQL = `
 		WHERE created_at >= ? AND created_at < ?
 		UNION ALL
 		SELECT id, user_id,
-		       (CASE action WHEN 'apply' THEN 'leave_apply' ELSE 'leave_report' END) COLLATE utf8mb4_unicode_ci AS task_type,
+		       (CASE action WHEN 'apply' THEN 'leave_apply' WHEN 'extend' THEN 'leave_extend' ELSE 'leave_report' END) COLLATE utf8mb4_unicode_ci AS task_type,
 		       title COLLATE utf8mb4_unicode_ci, '' COLLATE utf8mb4_unicode_ci AS real_title, is_success,
 		       error_message COLLATE utf8mb4_unicode_ci, created_at,
 		       (deleted_at IS NOT NULL) AS deleted, 2 AS source

backed/internal/handler/auth.go

@@ -485,6 +485,7 @@ func findOrCreateUser(username, password, schoolID, schoolName, studentID, cooki
 	var user model.SysUser
 	err := database.DB.Where("username = ?", username).First(&user).Error
 	if err == nil {
+		ensureInviteCodeOnLogin(&user)
 		return &user, false, nil
 	}
 
@@ -496,6 +497,7 @@ func findOrCreateUser(username, password, schoolID, schoolName, studentID, cooki
 	if studentID != "" {
 		if e2 := database.DB.Where("school_id = ? AND student_id = ?", schoolID, studentID).First(&user).Error; e2 == nil {
 			slog.Info("按学工号匹配到已有账号（学工号登录）", "userId", user.ID, "studentId", studentID)
+			ensureInviteCodeOnLogin(&user)
 			return &user, false, nil
 		} else if !errors.Is(e2, gorm.ErrRecordNotFound) {
 			return nil, false, e2
@@ -510,19 +512,20 @@ func findOrCreateUser(username, password, schoolID, schoolName, studentID, cooki
 		return nil, false, err
 	}
 
-	// 为新用户生成一个唯一的邀请码（避免空字符串与 uniqueIndex 冲突）
-	myInviteCode := generateRandomCode(6)
-
-	user = model.SysUser{
-		Username:   username,
-		Password:   string(hashedPwd),
-		SchoolID:   schoolID,
-		SchoolName: schoolName,
-		StudentID:  studentID,
-		Cookie:     cookie,
-		InviteCode: myInviteCode, // 始终设置邀请码，避免空字符串唯一索引冲突
-	}
-	if err := database.DB.Create(&user).Error; err != nil {
+	// 注册即生成邀请码：唯一索引冲突时换码重试（见 withUniqueInviteCode）
+	myInviteCode, err := withUniqueInviteCode(func(code string) error {
+		user = model.SysUser{
+			Username:   username,
+			Password:   string(hashedPwd),
+			SchoolID:   schoolID,
+			SchoolName: schoolName,
+			StudentID:  studentID,
+			Cookie:     cookie,
+			InviteCode: code,
+		}
+		return database.DB.Create(&user).Error
+	})
+	if err != nil {
 		slog.Error("用户创建失败（可能用户名冲突）", "username", username, "error", err)
 		return nil, false, err
 	}
@@ -531,30 +534,11 @@ func findOrCreateUser(username, password, schoolID, schoolName, studentID, cooki
 	return &user, true, nil
 }
 
-// GenerateMyInviteCode 生成/获取当前用户的邀请码
-func GenerateMyInviteCode(c *fiber.Ctx) error {
-	userID := c.Locals("userId").(uint)
-
-	var user model.SysUser
-	if err := database.DB.First(&user, userID).Error; err != nil {
-		return utils.FailAuth(c, "用户不存在")
+// ensureInviteCodeOnLogin 登录时为缺少邀请码的老用户补发；失败只记日志，不影响登录
+func ensureInviteCodeOnLogin(user *model.SysUser) {
+	if err := ensureInviteCode(user); err != nil {
+		slog.Error("登录时补发邀请码失败", "userId", user.ID, "error", err)
 	}
-
-	// 已有邀请码直接返回
-	if user.InviteCode != "" {
-		return utils.Success(c, inviteInfoMap(&user))
-	}
-
-	// 生成新邀请码（6 位随机大写字母数字）
-	code := generateRandomCode(6)
-	user.InviteCode = code
-	if err := database.DB.Model(&user).Update("invite_code", code).Error; err != nil {
-		return utils.FailServer(c, "生成邀请码失败")
-	}
-
-	slog.Info("邀请码已生成", "userId", userID, "inviteCode", code)
-
-	return utils.Success(c, inviteInfoMap(&user))
 }
 
 // GetMyInviteInfo 获取当前用户的邀请信息
@@ -564,6 +548,8 @@ func GetMyInviteInfo(c *fiber.Ctx) error {
 	if err := database.DB.First(&user, userID).Error; err != nil {
 		return utils.FailAuth(c, "用户不存在")
 	}
+	// 兜底：仍缺邀请码（如登录时补发失败）则在这里再补一次
+	ensureInviteCodeOnLogin(&user)
 
 	return utils.Success(c, inviteInfoMap(&user))
 }
@@ -703,12 +689,16 @@ func RedeemInviteReward(c *fiber.Ctx) error {
 // generateRandomCode 生成 N 位随机大写字母数字码
 func generateRandomCode(n int) string {
 	const chars = "ABCDEFGHJKLMNPQRSTUVWXYZ23456789"
-	code := make([]byte, n)
-	for i := range code {
-		code[i] = chars[time.Now().UnixNano()%int64(len(chars))]
-		time.Sleep(1)
+	code, err := randomFromCharset(chars, n)
+	if err != nil {
+		// crypto/rand 读取失败极罕见；退回时间种子，保证调用方总能拿到非空串
+		b := make([]byte, n)
+		for i := range b {
+			b[i] = chars[(time.Now().UnixNano()+int64(i)*7919)%int64(len(chars))]
+		}
+		return string(b)
 	}
-	return string(code)
+	return code
 }
 
 // ========== 多因子认证（MFA）会话暂存 ==========

backed/internal/handler/cdk.go

@@ -54,6 +54,25 @@ func getVipCardPrice(key string, def float64) float64 {
 func getVipWeekPrice() float64  { return getVipCardPrice("vip_price_week", 30.00) }
 func getVipMonthPrice() float64 { return getVipCardPrice("vip_price_month", 100.00) }
 
+// getCdkBuyUrl 获取「购买 CDK」跳转链接（系统设置 cdk_buy_url，默认空 = 不展示按钮）
+func getCdkBuyUrl() string {
+	var cfg model.SystemConfig
+	if database.DB.Where("`key` = ?", "cdk_buy_url").First(&cfg).Error == nil {
+		return strings.TrimSpace(cfg.Value)
+	}
+	return ""
+}
+
+// getCdkBuyVisible 获取「购买 CDK」按钮是否展示（系统设置 cdk_buy_visible，默认 false）
+// 生效条件：开关为 true 且链接非空（链接为空时前端无处可跳，视为关闭）。
+func getCdkBuyVisible() bool {
+	var cfg model.SystemConfig
+	if database.DB.Where("`key` = ?", "cdk_buy_visible").First(&cfg).Error == nil {
+		return cfg.Value == "true" && getCdkBuyUrl() != ""
+	}
+	return false
+}
+
 // GenerateCDK 生成CDK
 func GenerateCDK(c *fiber.Ctx) error {
 	agentID := c.Locals("adminId").(uint)
@@ -502,5 +521,7 @@ func GetUserVipInfo(c *fiber.Ctx) error {
 		"vipWeekPrice":  formatFloat(getVipWeekPrice()),
 		"vipMonthPrice": formatFloat(getVipMonthPrice()),
 		"vipPrice":      formatFloat(getVipMonthPrice()), // 兼容旧字段：月卡价
+		"cdkBuyUrl":     getCdkBuyUrl(),
+		"cdkBuyVisible": getCdkBuyVisible(),
 	})
 }

backed/internal/handler/invite_code.go

@@ -0,0 +1,139 @@
+package handler
+
+import (
+	"crypto/rand"
+	"errors"
+	"fmt"
+	"log/slog"
+	"math/big"
+	"strings"
+
+	"cpdaily-new/internal/database"
+	"cpdaily-new/internal/model"
+)
+
+// 邀请码规则：每个用户在注册（首次登录）时自动获得一个邀请码，不再提供手动生成接口。
+//   - 字符集去掉易混淆的 0/O、1/I/L，便于口头/截图分享；
+//   - 长度 6，字符集 31 个 → 约 8.9 亿种组合，配合唯一索引冲突重试，碰撞概率可忽略；
+//   - 使用 crypto/rand：旧实现以纳秒时间戳取模，可预测且并发注册时易生成相同码，
+//     在 invite_code 唯一索引下会直接导致用户创建（登录）失败。
+const (
+	inviteCodeChars    = "ABCDEFGHJKMNPQRSTUVWXYZ23456789"
+	inviteCodeLength   = 6
+	inviteCodeAttempts = 8
+)
+
+// newInviteCode 生成一个随机邀请码（不保证唯一，唯一性由调用方的写库重试保证）
+func newInviteCode() (string, error) {
+	return randomFromCharset(inviteCodeChars, inviteCodeLength)
+}
+
+// randomFromCharset 用 crypto/rand 从字符集中均匀取 n 个字符
+func randomFromCharset(charset string, n int) (string, error) {
+	max := big.NewInt(int64(len(charset)))
+	var sb strings.Builder
+	sb.Grow(n)
+	for i := 0; i < n; i++ {
+		idx, err := rand.Int(rand.Reader, max)
+		if err != nil {
+			return "", err
+		}
+		sb.WriteByte(charset[idx.Int64()])
+	}
+	return sb.String(), nil
+}
+
+// isInviteCodeConflict 判断是否为「邀请码」唯一索引冲突。
+// 只认 invite_code 索引：用户名等其他唯一键冲突也会报 Duplicate entry，换邀请码重试毫无意义，
+// 必须原样返回给调用方。MySQL 报错形如：
+//
+//	Error 1062 (23000): Duplicate entry 'ABC123' for key 'sys_user.idx_sys_user_invite_code'
+func isInviteCodeConflict(err error) bool {
+	if err == nil {
+		return false
+	}
+	msg := err.Error()
+	return strings.Contains(msg, "Duplicate entry") && strings.Contains(msg, "invite_code")
+}
+
+// withUniqueInviteCode 生成邀请码并执行写库操作 write(code)；
+// 若写库因唯一索引冲突失败，则换一个新码重试，最多 inviteCodeAttempts 次。
+// 冲突判定交给数据库唯一索引（而非「先查后写」），并发下依然正确。
+func withUniqueInviteCode(write func(code string) error) (string, error) {
+	var lastErr error
+	for i := 0; i < inviteCodeAttempts; i++ {
+		code, err := newInviteCode()
+		if err != nil {
+			return "", fmt.Errorf("生成邀请码失败: %w", err)
+		}
+		err = write(code)
+		if err == nil {
+			return code, nil
+		}
+		if !isInviteCodeConflict(err) {
+			return "", err
+		}
+		lastErr = err
+	}
+	return "", fmt.Errorf("邀请码重复次数过多: %w", lastErr)
+}
+
+// ensureInviteCode 确保用户拥有邀请码：已有则直接返回；没有则生成并写库。
+// 写库条件带 invite_code 为空，避免并发登录时把已生成的码覆盖掉；
+// 若条件未命中（被并发请求抢先写入），重新读取最新值。
+func ensureInviteCode(user *model.SysUser) error {
+	if strings.TrimSpace(user.InviteCode) != "" {
+		return nil
+	}
+	code, err := withUniqueInviteCode(func(code string) error {
+		res := database.DB.Model(&model.SysUser{}).
+			Where("id = ? AND (invite_code IS NULL OR invite_code = '')", user.ID).
+			Update("invite_code", code)
+		if res.Error != nil {
+			return res.Error
+		}
+		if res.RowsAffected == 0 {
+			return errInviteCodeAlreadySet
+		}
+		return nil
+	})
+	if errors.Is(err, errInviteCodeAlreadySet) {
+		var fresh model.SysUser
+		if e := database.DB.Select("id", "invite_code").First(&fresh, user.ID).Error; e != nil {
+			return e
+		}
+		user.InviteCode = fresh.InviteCode
+		return nil
+	}
+	if err != nil {
+		return err
+	}
+	user.InviteCode = code
+	slog.Info("已为用户补发邀请码", "userId", user.ID, "inviteCode", code)
+	return nil
+}
+
+var errInviteCodeAlreadySet = errors.New("invite code already set")
+
+// BackfillInviteCodes 启动时为所有缺少邀请码的存量用户补齐邀请码（幂等，无缺失时只执行一次计数查询）。
+func BackfillInviteCodes() {
+	var users []model.SysUser
+	if err := database.DB.Select("id", "invite_code").
+		Where("invite_code IS NULL OR invite_code = ''").
+		Find(&users).Error; err != nil {
+		slog.Error("查询缺少邀请码的用户失败", "error", err)
+		return
+	}
+	if len(users) == 0 {
+		return
+	}
+	ok := 0
+	for i := range users {
+		if err := ensureInviteCode(&users[i]); err != nil {
+			slog.Error("补发邀请码失败", "userId", users[i].ID, "error", err)
+			continue
+		}
+		ok++
+	}
+	slog.Info("存量用户邀请码补齐完成", "total", len(users), "success", ok)
+}

backed/internal/handler/invite_code_integration_test.go

@@ -0,0 +1,186 @@
+package handler
+
+import (
+	"fmt"
+	"os"
+	"sync"
+	"testing"
+
+	"cpdaily-new/internal/database"
+	"cpdaily-new/internal/model"
+
+	"gorm.io/driver/mysql"
+	"gorm.io/gorm"
+	"gorm.io/gorm/logger"
+)
+
+// 集成测试：仅在设置 INVITE_IT_DSN 时运行（指向一次性测试库，会建表/清表）。
+//
+//	INVITE_IT_DSN='root:test@tcp(127.0.0.1:33099)/invtest?charset=utf8mb4&parseTime=True&loc=Local' go test -run Integration ./internal/handler/
+func setupInviteIT(t *testing.T) {
+	dsn := os.Getenv("INVITE_IT_DSN")
+	if dsn == "" {
+		t.Skip("未设置 INVITE_IT_DSN，跳过数据库集成测试")
+	}
+	db, err := gorm.Open(mysql.Open(dsn), &gorm.Config{Logger: logger.Default.LogMode(logger.Silent)})
+	if err != nil {
+		t.Fatalf("连接测试库失败: %v", err)
+	}
+	if err := db.Migrator().DropTable(&model.SysUser{}); err != nil {
+		t.Fatalf("清表失败: %v", err)
+	}
+	if err := db.AutoMigrate(&model.SysUser{}); err != nil {
+		t.Fatalf("建表失败: %v", err)
+	}
+	database.DB = db
+}
+
+func insertUser(t *testing.T, name, code string) model.SysUser {
+	u := model.SysUser{Username: name, Password: "x", SchoolID: "s", SchoolName: "S", StudentID: name}
+	if err := database.DB.Create(&u).Error; err != nil {
+		t.Fatalf("插入用户失败: %v", err)
+	}
+	// invite_code 为 varchar NULL + 唯一索引；用原生 SQL 精确构造 NULL / '' 两种缺失形态
+	if code == "<NULL>" {
+		database.DB.Exec("UPDATE sys_user SET invite_code = NULL WHERE id = ?", u.ID)
+	} else {
+		database.DB.Exec("UPDATE sys_user SET invite_code = ? WHERE id = ?", code, u.ID)
+	}
+	return u
+}
+
+// TestIntegrationConflictErrorText 真实 MySQL 的唯一索引冲突报错能被 isInviteCodeConflict 识别；
+// 用户名冲突不会被误判
+func TestIntegrationConflictErrorText(t *testing.T) {
+	setupInviteIT(t)
+	insertUser(t, "u1", "AAAAAA")
+	u2 := insertUser(t, "u2", "BBBBBB")
+	err := database.DB.Model(&model.SysUser{}).Where("id = ?", u2.ID).Update("invite_code", "AAAAAA").Error
+	if err == nil {
+		t.Fatal("应触发唯一索引冲突")
+	}
+	t.Logf("邀请码冲突真实报错: %v", err)
+	if !isInviteCodeConflict(err) {
+		t.Fatalf("未识别为邀请码冲突: %v", err)
+	}
+	err = database.DB.Create(&model.SysUser{Username: "u1", Password: "x", InviteCode: "CCCCCC"}).Error
+	if err == nil {
+		t.Fatal("应触发用户名唯一冲突")
+	}
+	t.Logf("用户名冲突真实报错: %v", err)
+	if isInviteCodeConflict(err) {
+		t.Fatalf("用户名冲突被误判为邀请码冲突: %v", err)
+	}
+}
+
+// TestIntegrationEnsureAndBackfill 已有码不覆盖；NULL 与空串都会被补齐；补齐后全部唯一
+func TestIntegrationEnsureAndBackfill(t *testing.T) {
+	setupInviteIT(t)
+	keep := insertUser(t, "keep", "KEEP23")
+	insertUser(t, "n1", "<NULL>")
+	insertUser(t, "n2", "<NULL>")
+	insertUser(t, "e1", "") // 空串最多一行（唯一索引），正好覆盖历史数据形态
+
+	BackfillInviteCodes()
+
+	var users []model.SysUser
+	database.DB.Order("id").Find(&users)
+	seen := map[string]bool{}
+	for _, u := range users {
+		if u.InviteCode == "" {
+			t.Fatalf("用户 %s 仍无邀请码", u.Username)
+		}
+		if seen[u.InviteCode] {
+			t.Fatalf("邀请码重复: %s", u.InviteCode)
+		}
+		seen[u.InviteCode] = true
+		if u.ID == keep.ID && u.InviteCode != "KEEP23" {
+			t.Fatalf("已有邀请码被覆盖: %s", u.InviteCode)
+		}
+	}
+	// 再跑一次应为幂等（不改动任何人）
+	before := map[uint]string{}
+	for _, u := range users {
+		before[u.ID] = u.InviteCode
+	}
+	BackfillInviteCodes()
+	database.DB.Order("id").Find(&users)
+	for _, u := range users {
+		if before[u.ID] != u.InviteCode {
+			t.Fatalf("第二次补齐改动了用户 %s 的邀请码", u.Username)
+		}
+	}
+}
+
+// TestIntegrationEnsureConcurrent 同一用户并发补发：只写入一次，所有调用方拿到同一个码
+func TestIntegrationEnsureConcurrent(t *testing.T) {
+	setupInviteIT(t)
+	u := insertUser(t, "race", "<NULL>")
+	const n = 20
+	codes := make([]string, n)
+	var wg sync.WaitGroup
+	for i := 0; i < n; i++ {
+		wg.Add(1)
+		go func(i int) {
+			defer wg.Done()
+			cp := model.SysUser{ID: u.ID}
+			if err := ensureInviteCode(&cp); err != nil {
+				t.Errorf("ensureInviteCode: %v", err)
+			}
+			codes[i] = cp.InviteCode
+		}(i)
+	}
+	wg.Wait()
+	var fresh model.SysUser
+	database.DB.First(&fresh, u.ID)
+	for i, c := range codes {
+		if c != fresh.InviteCode {
+			t.Fatalf("第 %d 个调用拿到 %q，库里是 %q", i, c, fresh.InviteCode)
+		}
+	}
+}
+
+// TestIntegrationRegisterAndLoginBackfill 新用户注册自带邀请码；老用户（无码）登录时补发
+func TestIntegrationRegisterAndLoginBackfill(t *testing.T) {
+	setupInviteIT(t)
+	nu, isNew, err := findOrCreateUser("newbie", "pw", "s", "S", "2025001", "")
+	if err != nil || !isNew || nu.InviteCode == "" {
+		t.Fatalf("新用户注册应带邀请码: user=%+v isNew=%v err=%v", nu, isNew, err)
+	}
+	old := insertUser(t, "olduser", "<NULL>")
+	got, isNew, err := findOrCreateUser("olduser", "pw", "s", "S", "olduser", "")
+	if err != nil || isNew {
+		t.Fatalf("老用户登录: isNew=%v err=%v", isNew, err)
+	}
+	if got.ID != old.ID || got.InviteCode == "" {
+		t.Fatalf("老用户登录应补发邀请码: %+v", got)
+	}
+	var fresh model.SysUser
+	database.DB.First(&fresh, old.ID)
+	if fresh.InviteCode != got.InviteCode {
+		t.Fatalf("补发的邀请码未落库: 返回 %q 库里 %q", got.InviteCode, fresh.InviteCode)
+	}
+	// 并发注册多个新用户，邀请码互不重复
+	var wg sync.WaitGroup
+	errs := make(chan error, 30)
+	for i := 0; i < 30; i++ {
+		wg.Add(1)
+		go func(i int) {
+			defer wg.Done()
+			name := fmt.Sprintf("bulk%02d", i)
+			if _, _, e := findOrCreateUser(name, "pw", "s", "S", name, ""); e != nil {
+				errs <- e
+			}
+		}(i)
+	}
+	wg.Wait()
+	close(errs)
+	for e := range errs {
+		t.Fatalf("并发注册失败: %v", e)
+	}
+	var dup int64
+	database.DB.Raw("SELECT COUNT(*) FROM (SELECT invite_code FROM sys_user GROUP BY invite_code HAVING COUNT(*) > 1) t").Scan(&dup)
+	if dup != 0 {
+		t.Fatalf("存在 %d 组重复邀请码", dup)
+	}
+}

backed/internal/handler/invite_code_test.go

@@ -0,0 +1,113 @@
+package handler
+
+import (
+	"errors"
+	"strings"
+	"testing"
+)
+
+// TestNewInviteCodeFormat 邀请码长度、字符集（不含易混淆的 0/O/1/I/L）
+func TestNewInviteCodeFormat(t *testing.T) {
+	for i := 0; i < 2000; i++ {
+		code, err := newInviteCode()
+		if err != nil {
+			t.Fatalf("newInviteCode error: %v", err)
+		}
+		if len(code) != inviteCodeLength {
+			t.Fatalf("长度应为 %d，得到 %q", inviteCodeLength, code)
+		}
+		for _, ch := range code {
+			if !strings.ContainsRune(inviteCodeChars, ch) {
+				t.Fatalf("出现字符集外字符 %q（code=%q）", ch, code)
+			}
+			if strings.ContainsRune("0O1IL", ch) {
+				t.Fatalf("出现易混淆字符 %q（code=%q）", ch, code)
+			}
+		}
+	}
+}
+
+// TestNewInviteCodeRandomness 连续生成不应大量重复（旧实现按纳秒取模，快速连续调用会高度重复）
+func TestNewInviteCodeRandomness(t *testing.T) {
+	const n = 5000
+	seen := make(map[string]struct{}, n)
+	for i := 0; i < n; i++ {
+		code, _ := newInviteCode()
+		seen[code] = struct{}{}
+	}
+	// 31^6 ≈ 8.9 亿空间，5000 个样本的期望碰撞数 ≈ 0.014；允许极少量
+	if dup := n - len(seen); dup > 2 {
+		t.Fatalf("5000 次生成出现 %d 个重复，随机性异常", dup)
+	}
+}
+
+func dupErr(key string) error {
+	return errors.New("Error 1062 (23000): Duplicate entry 'ABC123' for key '" + key + "'")
+}
+
+// TestWithUniqueInviteCodeRetriesOnConflict 邀请码唯一索引冲突时换码重试，成功返回最终写入的码
+func TestWithUniqueInviteCodeRetriesOnConflict(t *testing.T) {
+	calls := 0
+	var tried []string
+	code, err := withUniqueInviteCode(func(c string) error {
+		calls++
+		tried = append(tried, c)
+		if calls < 3 {
+			return dupErr("sys_user.idx_sys_user_invite_code")
+		}
+		return nil
+	})
+	if err != nil {
+		t.Fatalf("应重试成功，得到错误 %v", err)
+	}
+	if calls != 3 {
+		t.Fatalf("应调用 3 次，实际 %d", calls)
+	}
+	if code != tried[len(tried)-1] {
+		t.Fatalf("返回的码应为最后一次写入的码：got %q, want %q", code, tried[len(tried)-1])
+	}
+}
+
+// TestWithUniqueInviteCodeNoRetryOnOtherErrors 用户名冲突等其他错误不重试，原样返回
+func TestWithUniqueInviteCodeNoRetryOnOtherErrors(t *testing.T) {
+	cases := []error{
+		dupErr("sys_user.idx_sys_user_username"),
+		errors.New("connection refused"),
+	}
+	for _, want := range cases {
+		calls := 0
+		_, err := withUniqueInviteCode(func(string) error { calls++; return want })
+		if calls != 1 {
+			t.Fatalf("非邀请码冲突不应重试（%v），实际调用 %d 次", want, calls)
+		}
+		if !errors.Is(err, want) && err.Error() != want.Error() {
+			t.Fatalf("应原样返回错误 %v，得到 %v", want, err)
+		}
+	}
+}
+
+// TestWithUniqueInviteCodeGivesUp 持续冲突时有上限，不会死循环
+func TestWithUniqueInviteCodeGivesUp(t *testing.T) {
+	calls := 0
+	_, err := withUniqueInviteCode(func(string) error {
+		calls++
+		return dupErr("sys_user.idx_sys_user_invite_code")
+	})
+	if err == nil {
+		t.Fatal("持续冲突应返回错误")
+	}
+	if calls != inviteCodeAttempts {
+		t.Fatalf("应尝试 %d 次，实际 %d", inviteCodeAttempts, calls)
+	}
+}
+
+// TestGenerateRandomCode 短信登录占位密码等仍使用该函数：长度正确且不重复
+func TestGenerateRandomCode(t *testing.T) {
+	a, b := generateRandomCode(32), generateRandomCode(32)
+	if len(a) != 32 || len(b) != 32 {
+		t.Fatalf("长度应为 32：%q %q", a, b)
+	}
+	if a == b {
+		t.Fatal("两次生成不应相同")
+	}
+}

backed/internal/handler/leave_apply.go

@@ -164,6 +164,11 @@ type ExecuteLeaveApplyRequest struct {
 	ApproverName  string              `json:"approverName"`  // 审批人姓名
 	CcUsers       []cpd.LeaveApprover `json:"ccUsers"`       // 抄送人（非必填，候选取自审批人列表）
 	SignatureURL  string              `json:"signatureUrl"`  // 手写承诺书签名图 URL（requireSign=1 的类型必填）
+	// —— 续假（仅新套）——
+	IsExtend      bool   `json:"isExtend"`      // true=续假（延长已有假单）
+	ExtendLeaveID string `json:"extendLeaveId"` // 续假的原假单 ID
+	// 自定义附加字段的作答（新套 selfDefineFields，如「当天是否返校」）
+	SelfDefineAnswers []map[string]interface{} `json:"selfDefineAnswers"`
 }
 
 // mergeApplyImageURLs 合并 imageUrls 与兼容字段 imageUrl，保序去重并剔除空串
@@ -255,6 +260,11 @@ func ExecuteLeaveApply(c *fiber.Ctx) error {
 
 		// 请假记录 ID：申请时平台尚未生成，用时间戳占位（日志/展示用）
 		applyLeaveID := "apply_" + strconv.FormatInt(time.Now().Unix(), 10)
+		// 续假与新建请假分开归档：action=extend / apply，后台据此分类型统计
+		applyAction := model.LeaveActionApply
+		if req.IsExtend {
+			applyAction = model.LeaveActionExtend
+		}
 
 		// 类型配置（拿 needApproval/enableAttach/mustOut 等权威开关做服务端校验）
 		title := leaveApplyLogTitle(req.LeaveType, req.StartTime, req.EndTime)
@@ -264,7 +274,7 @@ func ExecuteLeaveApply(c *fiber.Ctx) error {
 				LeaveID:      applyLeaveID,
 				Title:        title,
 				SchoolName:   user.SchoolName,
-				Action:       model.LeaveActionApply,
+				Action:       applyAction,
 				IsSuccess:    isSuccess,
 				ErrorMessage: errMsg,
 			}
@@ -430,13 +440,21 @@ func ExecuteLeaveApply(c *fiber.Ctx) error {
 			ApproverName:  req.ApproverName,
 			CcUsers:       req.CcUsers,
 		}
-		form := cpd.BuildLeaveApplyForm(p, user.MobileCode, "15", "9.9.6")
-		err = cpd.SubmitLeaveApply(cookieMap, host, form, req.Longitude, req.Latitude, user.MobileCode, user.StudentID)
+		// 续假（旧套）：改走 /saveExtend（body = 申请体 + leaveId + extendReason）
+		submit := func(cm map[string]string) error {
+			if req.IsExtend {
+				form := cpd.BuildLeaveExtendForm(p, user.MobileCode, "15", "9.9.6", req.ExtendLeaveID)
+				return cpd.SubmitLeaveExtend(cm, host, form, req.Longitude, req.Latitude, user.MobileCode, user.StudentID)
+			}
+			form := cpd.BuildLeaveApplyForm(p, user.MobileCode, "15", "9.9.6")
+			return cpd.SubmitLeaveApply(cm, host, form, req.Longitude, req.Latitude, user.MobileCode, user.StudentID)
+		}
+		err = submit(cookieMap)
 		if err != nil && isCookieExpired(err) {
 			slog.Info("提交请假cookie过期，尝试自动刷新", "userId", userID)
 			if refreshErr := refreshCpdailyCookie(&user); refreshErr == nil {
 				cookieMap = cpd.ParseCookieJSON(user.Cookie)
-				err = cpd.SubmitLeaveApply(cookieMap, host, form, req.Longitude, req.Latitude, user.MobileCode, user.StudentID)
+				err = submit(cookieMap)
 			} else if errors.Is(refreshErr, ErrPasswordChanged) {
 				err = ErrPasswordChanged
 			}

backed/internal/handler/leave_extend.go

@@ -0,0 +1,98 @@
+package handler
+
+import (
+	"errors"
+	"log/slog"
+	"strings"
+
+	cpd "cpdaily-new/internal/service/cpdaily"
+	"cpdaily-new/internal/utils"
+
+	"github.com/gofiber/fiber/v2"
+)
+
+// 续假（仅新套 wec-counselor-leave-new-apps）。
+// 续假复用请假提交接口 /stu/leave/apply（body 带 reApply/isExtend/leaveId/extendId）；
+// 执行逻辑并入 ExecuteLeaveApply（见 leaveNewExecuteApply 的续假分支），本文件仅提供「续假预填」查询。
+
+// GetLeaveExtendPrefill 续假预填：返回原假单的类型、原结束时间（续假开始时间）、原因、是否离校等。
+// 前端据此预填续假表单（开始时间锁定为原结束时间，用户只改新的结束时间）。
+func GetLeaveExtendPrefill(c *fiber.Ctx) error {
+	user, err := loadLeaveUser(c)
+	if err != nil {
+		return utils.FailAuth(c, err.Error())
+	}
+
+	var req struct {
+		LeaveID string `json:"leaveId"`
+	}
+	if err := c.BodyParser(&req); err != nil {
+		return utils.FailParam(c, "请求参数错误")
+	}
+	req.LeaveID = strings.TrimSpace(req.LeaveID)
+	if req.LeaveID == "" {
+		return utils.FailParam(c, "缺少请假单 ID")
+	}
+
+	cookieMap := cpd.ParseCookieJSON(user.Cookie)
+	host := getSchoolHost(user.SchoolID)
+
+	// 旧套：续假预填取自请假详情（类型 code + 原结束时间作为续假开始时间）
+	if schoolLeaveFlavor(user, cookieMap) != cpd.LeaveFlavorNew {
+		d, err := cpd.FetchLeaveDetail(cookieMap, host, req.LeaveID)
+		if err != nil && isCookieExpired(err) {
+			if refreshErr := refreshCpdailyCookie(user); refreshErr == nil {
+				cookieMap = cpd.ParseCookieJSON(user.Cookie)
+				d, err = cpd.FetchLeaveDetail(cookieMap, host, req.LeaveID)
+			} else if errors.Is(refreshErr, ErrPasswordChanged) {
+				err = ErrPasswordChanged
+			}
+		}
+		if err != nil {
+			slog.Error("获取续假预填失败(旧套)", "userId", user.ID, "leaveId", req.LeaveID, "error", err)
+			if errors.Is(err, ErrPasswordChanged) {
+				return utils.Fail(c, 401, "登录凭证已过期，请重新登录")
+			}
+			return utils.Fail(c, 503, "获取续假信息失败: "+err.Error())
+		}
+		return utils.Success(c, fiber.Map{
+			"leaveId":     req.LeaveID,
+			"typeWid":     d.LeaveCodeNum,
+			"beginTime":   d.EndTime, // 续假开始时间 = 原假单结束时间
+			"endTime":     d.EndTime,
+			"leaveReason": "",
+			"isLeaveOut":  "",
+		})
+	}
+
+	rd, err := cpd.FetchLeaveNewReplyDetail(cookieMap, host, req.LeaveID)
+	if err != nil && isCookieExpired(err) {
+		if refreshErr := refreshCpdailyCookie(user); refreshErr == nil {
+			cookieMap = cpd.ParseCookieJSON(user.Cookie)
+			rd, err = cpd.FetchLeaveNewReplyDetail(cookieMap, host, req.LeaveID)
+		} else if errors.Is(refreshErr, ErrPasswordChanged) {
+			err = ErrPasswordChanged
+		}
+	}
+	if err != nil {
+		slog.Error("获取续假预填失败", "userId", user.ID, "leaveId", req.LeaveID, "error", err)
+		if errors.Is(err, ErrPasswordChanged) {
+			return utils.Fail(c, 401, "登录凭证已过期，请重新登录")
+		}
+		return utils.Fail(c, 503, "获取续假信息失败: "+err.Error())
+	}
+
+	// extendId 为空通常意味着该假单当前不可续假（已销假/已结束/未到可续假状态）
+	if strings.TrimSpace(rd.ExtendID) == "" && strings.TrimSpace(rd.BeginTime) == "" {
+		return utils.Fail(c, 400, "该请假单当前不可续假")
+	}
+
+	return utils.Success(c, fiber.Map{
+		"leaveId":     rd.LeaveID,
+		"typeWid":     rd.TypeWid,
+		"beginTime":   rd.BeginTime, // 续假开始时间 = 原假单结束时间
+		"endTime":     rd.EndTime,
+		"leaveReason": rd.LeaveReason,
+		"isLeaveOut":  rd.IsLeaveOut,
+	})
+}

backed/internal/handler/leave_flavor.go

@@ -18,8 +18,8 @@ import (
 // 探测失败时试探新套端点兜底；结果按学校缓存 30 分钟。
 
 type leaveFlavorCacheEntry struct {
-	flavor  cpd.LeaveAppFlavor
-	expire  time.Time
+	flavor cpd.LeaveAppFlavor
+	expire time.Time
 }
 
 var leaveFlavorCache sync.Map // schoolID -> leaveFlavorCacheEntry
@@ -87,6 +87,24 @@ func leaveNewToLeaveTypes(list []cpd.LeaveNewType, detailOf func(typeWid int) *c
 				// 材料区不可见时不得带出上限，否则前端按「上限>0」会误显示上传入口
 				item.AttachmentNumberLimit = 0
 			}
+			// 证明材料是否必填（isRequiredEvidenceFile）：类型列表接口不返回该开关，
+			// 只在详情里；此前未透传，导致必填附件被漏检、提交被服务端拒绝。
+			if d.IsRequiredEvidence {
+				item.RequireEvidence = 1
+			}
+			item.EvidenceMin = d.EvidenceFileCountMini
+			// 自定义附加字段（selfDefineFields）：必填项需前端采集、提交时回填 selfDefineAnswers
+			if raw, ok := d.Raw["selfDefineFields"]; ok && raw != nil {
+				if arr, ok := raw.([]interface{}); ok {
+					fields := make([]map[string]interface{}, 0, len(arr))
+					for _, it := range arr {
+						if m, ok := it.(map[string]interface{}); ok {
+							fields = append(fields, m)
+						}
+					}
+					item.SelfDefineFields = fields
+				}
+			}
 			item.ReasonWordLimit = d.LeaveReasonWordsMini
 			item.DisableTime = 0
 			item.LimitDay = 0

backed/internal/handler/leave_new_exec.go

@@ -242,27 +242,50 @@ func leaveNewExecuteApply(user *model.SysUser, cookieMap map[string]string, host
 	// "是"覆盖成 0，学校端因 0 非合法枚举而显示为"否"。
 	isLeaveOut := leaveNewOutStatusValue(req.OutStatus)
 
+	// 续假：取原假单的 extendId（queryReplyLeaveDetail），审批流/类型沿用原假单
+	var extendID string
+	if req.IsExtend {
+		rd, rerr := cpd.FetchLeaveNewReplyDetail(cookieMap, host, req.ExtendLeaveID)
+		if rerr != nil && isCookieExpired(rerr) {
+			if refreshErr := refreshCpdailyCookie(user); refreshErr == nil {
+				cookieMap = cpd.ParseCookieJSON(user.Cookie)
+				rd, rerr = cpd.FetchLeaveNewReplyDetail(cookieMap, host, req.ExtendLeaveID)
+			} else if errors.Is(refreshErr, ErrPasswordChanged) {
+				return false, "登录凭证已过期，请重新登录", true, false
+			}
+		}
+		if rerr != nil {
+			return false, "获取续假信息失败: " + rerr.Error(), false, false
+		}
+		extendID = rd.ExtendID
+	}
+
 	form := cpd.BuildLeaveNewApplyForm(cpd.LeaveNewApplyParams{
-		TypeWid:         req.LeaveType,
-		BeginTime:       trimSeconds(req.StartTime),
-		EndTime:         trimSeconds(req.EndTime),
-		LeaveReason:     req.LeaveReason,
-		ImageURLs:       imageURLs,
-		SignatureURL:    req.SignatureURL,
-		LocationAddr:    req.LocationAddr,
-		Longitude:       req.Longitude,
-		Latitude:        req.Latitude,
-		IsLeaveOut:      isLeaveOut,
-		Destination:     req.Address,
-		Detail:          req.DetailAddress,
-		EmergencyName:   req.UrgencyMobile,
-		EmergencyMobile: req.UrgencyMobile,
-		Approver:        approver,
-		CcUsers:         ccUsers,
-		FlowData:        flowData,
-		UserID:          user.StudentID,
-		DeviceID:        user.MobileCode,
-		Model:           "cpdaily",
+		TypeWid:           req.LeaveType,
+		LeaveID:           req.ExtendLeaveID,
+		IsExtend:          req.IsExtend,
+		ExtendID:          extendID,
+		ReApply:           req.IsExtend,
+		BeginTime:         trimSeconds(req.StartTime),
+		EndTime:           trimSeconds(req.EndTime),
+		LeaveReason:       req.LeaveReason,
+		ImageURLs:         imageURLs,
+		SignatureURL:      req.SignatureURL,
+		LocationAddr:      req.LocationAddr,
+		Longitude:         req.Longitude,
+		Latitude:          req.Latitude,
+		IsLeaveOut:        isLeaveOut,
+		Destination:       req.Address,
+		Detail:            req.DetailAddress,
+		EmergencyName:     req.UrgencyMobile,
+		EmergencyMobile:   req.UrgencyMobile,
+		Approver:          approver,
+		CcUsers:           ccUsers,
+		FlowData:          flowData,
+		UserID:            user.StudentID,
+		DeviceID:          user.MobileCode,
+		Model:             "cpdaily",
+		SelfDefineAnswers: req.SelfDefineAnswers,
 	})
 	err = cpd.SubmitLeaveNewApply(cookieMap, host, form)
 	if err != nil && isCookieExpired(err) {

backed/internal/handler/leave_new_handler.go

@@ -62,7 +62,8 @@ func fetchLeaveNewPendingList(cookieMap map[string]string, host string, user *mo
 			slog.Warn("获取新套请假详情失败，跳过该记录", "leaveId", r.LeaveID, "error", derr)
 			continue
 		}
-		if !detail.CanReport {
+		// 可销假 或 可续假（isAllowExtend）其一满足即展示
+		if !detail.CanReport && !detail.IsAllowExtend {
 			continue
 		}
 		// 销假需要确认人：reportMode=2（老师审批销假）
@@ -79,6 +80,10 @@ func fetchLeaveNewPendingList(cookieMap map[string]string, host string, user *mo
 			ReportPlaces:    places,
 			ReportApplyFlow: needApprover,
 			EnableAttach:    enableAttach,
+			CanReport:       detail.CanReport,
+			CanExtend:       detail.IsAllowExtend,
+			TypeWid:         detail.TypeWid,
+			IsLeaveOut:      detail.IsLeaveOut,
 		})
 	}
 	return list, nil

backed/internal/handler/settings.go

@@ -6,11 +6,36 @@ import (
 	"cpdaily-new/internal/service"
 	"cpdaily-new/internal/utils"
 	"log/slog"
+	"net/url"
 	"strconv"
+	"strings"
 
 	"github.com/gofiber/fiber/v2"
 )
 
+// isValidHttpUrl 校验字符串是否为合法的 http(s) 链接（空串合法 = 清空场景）
+func isValidHttpUrl(s string) bool {
+	if s == "" {
+		return true
+	}
+	u, err := url.Parse(s)
+	if err != nil || u.Host == "" {
+		return false
+	}
+	return u.Scheme == "http" || u.Scheme == "https"
+}
+
+// normalizeBoolSetting 将布尔设置值归一化为 "true"/"false"（支持 1/0、on/off 等常见写法）
+func normalizeBoolSetting(s string) (string, bool) {
+	switch strings.ToLower(strings.TrimSpace(s)) {
+	case "true", "1", "on", "yes":
+		return "true", true
+	case "false", "0", "off", "no", "":
+		return "false", true
+	}
+	return "", false
+}
+
 // GetSettings 获取所有系统设置
 func GetSettings(c *fiber.Ctx) error {
 	var configs []model.SystemConfig
@@ -47,6 +72,13 @@ func GetSettings(c *fiber.Ctx) error {
 	if _, ok := settings[settingDeductReport]; !ok {
 		settings[settingDeductReport] = "1.00"
 	}
+	// 「购买 CDK」入口（个人中心显眼按钮）：链接为空 + 默认关闭
+	if _, ok := settings["cdk_buy_url"]; !ok {
+		settings["cdk_buy_url"] = ""
+	}
+	if _, ok := settings["cdk_buy_visible"]; !ok {
+		settings["cdk_buy_visible"] = "false"
+	}
 
 	return utils.Success(c, settings)
 }
@@ -87,6 +119,9 @@ func UpdateSetting(c *fiber.Ctx) error {
 		"smtp_from_name": true,
 		"smtp_secure":    true,
 		"admin_emails":   true,
+		// 「购买 CDK」入口（个人中心显眼按钮的跳转链接与显隐）
+		"cdk_buy_url":     true,
+		"cdk_buy_visible": true,
 	}
 	if !allowedKeys[req.Key] {
 		return utils.Fail(c, 400, "不支持的设置项: "+req.Key)
@@ -100,6 +135,24 @@ func UpdateSetting(c *fiber.Ctx) error {
 		}
 	}
 
+	// 「购买 CDK」链接：允许清空；非空时必须是 http(s) 链接（前端将以新标签页打开）
+	if req.Key == "cdk_buy_url" {
+		url := strings.TrimSpace(req.Value)
+		if !isValidHttpUrl(url) {
+			return utils.FailParam(c, "购买链接必须以 http:// 或 https:// 开头")
+		}
+		req.Value = url
+	}
+
+	// 「购买 CDK」开关：归一化为 true / false 存储
+	if req.Key == "cdk_buy_visible" {
+		v, ok := normalizeBoolSetting(req.Value)
+		if !ok {
+			return utils.FailParam(c, "展示开关仅支持 true / false")
+		}
+		req.Value = v
+	}
+
 	var cfg model.SystemConfig
 	result := database.DB.Where("`key` = ?", req.Key).First(&cfg)
 	if result.Error != nil {

backed/internal/handler/settings_cdkbuy_test.go

@@ -0,0 +1,60 @@
+package handler
+
+import "testing"
+
+// TestIsValidHttpUrl 「购买 CDK」链接校验：仅允许空串（清空）与合法 http(s) 链接。
+func TestIsValidHttpUrl(t *testing.T) {
+	cases := []struct {
+		name  string
+		value string
+		want  bool
+	}{
+		{"空串=清空场景合法", "", true},
+		{"https 链接", "https://shop.example.com/cdk", true},
+		{"http 链接", "http://shop.example.com/cdk?from=profile", true},
+		{"带路径与参数", "https://example.com/a/b?x=1&y=2#frag", true},
+		{"端口号", "https://example.com:8443/cdk", true},
+		{"纯域名无协议", "shop.example.com/cdk", false},
+		{"javascript 协议", "javascript:alert(1)", false},
+		{"data 协议", "data:text/html;base64,xxxx", false},
+		{"file 协议", "file:///etc/passwd", false},
+		{"只有协议无主机", "https://", false},
+		{"中文字符串", "不是一个链接", false},
+	}
+	for _, c := range cases {
+		t.Run(c.name, func(t *testing.T) {
+			if got := isValidHttpUrl(c.value); got != c.want {
+				t.Fatalf("isValidHttpUrl(%q) = %v, want %v", c.value, got, c.want)
+			}
+		})
+	}
+}
+
+// TestNormalizeBoolSetting 布尔设置归一化：常见写法统一为 true/false，其余报错。
+func TestNormalizeBoolSetting(t *testing.T) {
+	cases := []struct {
+		name  string
+		value string
+		want  string
+		ok    bool
+	}{
+		{"true", "true", "true", true},
+		{"TRUE 大写", "TRUE", "true", true},
+		{"1", "1", "true", true},
+		{"on", "on", "true", true},
+		{"带空白", " true ", "true", true},
+		{"false", "false", "false", true},
+		{"0", "0", "false", true},
+		{"off", "off", "false", true},
+		{"空串按关闭", "", "false", true},
+		{"乱值报错", "maybe", "", false},
+	}
+	for _, c := range cases {
+		t.Run(c.name, func(t *testing.T) {
+			got, ok := normalizeBoolSetting(c.value)
+			if ok != c.ok || got != c.want {
+				t.Fatalf("normalizeBoolSetting(%q) = (%q, %v), want (%q, %v)", c.value, got, ok, c.want, c.ok)
+			}
+		})
+	}
+}

backed/internal/handler/task.go

@@ -170,6 +170,38 @@ func GetTaskForm(c *fiber.Ctx) error {
 		})
 	}
 
+	// 工作日志（教师端）：表单来自 worklog/detail，字段结构与签到不同，单独转换
+	if cpd.TaskType(task.TaskType) == cpd.TaskTypeWorklog {
+		var user model.SysUser
+		if err := database.DB.First(&user, userID).Error; err != nil {
+			return utils.FailAuth(c, "用户不存在")
+		}
+		cookieMap := cpd.ParseCookieJSON(user.Cookie)
+		host := getSchoolHost(user.SchoolID)
+		_, wid, perr := cpd.ParseWorklogSignWid(task.SignWid)
+		if perr != nil {
+			return utils.FailParam(c, "任务标识无效")
+		}
+		fields, err := cpd.FetchWorklogDetail(cookieMap, host, wid)
+		if err != nil && isCookieExpired(err) {
+			if refreshErr := refreshCpdailyCookie(&user); refreshErr == nil {
+				cookieMap = cpd.ParseCookieJSON(user.Cookie)
+				fields, err = cpd.FetchWorklogDetail(cookieMap, host, wid)
+			}
+		}
+		if err != nil {
+			if errors.Is(err, ErrPasswordChanged) {
+				return utils.Fail(c, 401, "登录凭证已过期，请重新登录")
+			}
+			return utils.Fail(c, 503, "获取工作日志表单失败: "+err.Error())
+		}
+		return utils.Success(c, fiber.Map{
+			"formItems": cpd.WorklogFieldsToFormItems(fields),
+			"realTitle": task.RealTitle,
+			"isPhoto":   false,
+		})
+	}
+
 	var user model.SysUser
 	if err := database.DB.First(&user, userID).Error; err != nil {
 		return utils.FailAuth(c, "用户不存在")
@@ -463,7 +495,6 @@ func GetTaskSavedForm(c *fiber.Ctx) error {
 	return utils.Success(c, fiber.Map{"formData": task.FormData})
 }
 
-
 // DeleteTask 删除任务
 func DeleteTask(c *fiber.Ctx) error {
 	userID := c.Locals("userId").(uint)
@@ -494,11 +525,37 @@ func ExecuteTask(c *fiber.Ctx) error {
 	switch cpd.TaskType(task.TaskType) {
 	case cpd.TaskTypeReturnRegister:
 		return executeReturnRegisterTask(c, &task)
+	case cpd.TaskTypeWorklog:
+		return executeWorklogTask(c, &task)
 	default:
 		return executeSignTask(c)
 	}
 }
 
+// isOutOfRangeSign 判断提交表单是否为「范围外签到」。
+// 值来源：cpd 组装 submitForm 时 isMalposition 为 1（范围外）或 0（范围内）；
+// 兼容字符串 "是"/"1"/"true" 与数值 1。
+func isOutOfRangeSign(submitForm map[string]interface{}) bool {
+	v, ok := submitForm["isMalposition"]
+	if !ok || v == nil {
+		return false
+	}
+	switch t := v.(type) {
+	case bool:
+		return t
+	case int:
+		return t == 1
+	case int64:
+		return t == 1
+	case float64:
+		return t == 1
+	case string:
+		s := strings.TrimSpace(t)
+		return s == "是" || s == "1" || s == "true" || s == "True"
+	}
+	return false
+}
+
 // executeSignTask 同步执行签到/查寝（SSE 流式返回状态）
 func executeSignTask(c *fiber.Ctx) error {
 	userID := c.Locals("userId").(uint)
@@ -660,8 +717,12 @@ func executeSignTask(c *fiber.Ctx) error {
 			sendEvent("task_error", map[string]interface{}{"status": "error", "message": errMsg})
 			return
 		}
-		// 历史位置超出查寝组所有签到范围时自动改用最近签到点，避免"位置不在签到范围内"
-		cpd.AdjustSubmitFormToSignRange(submitForm, detail.Rows)
+		// 历史位置超出签到范围时自动改用最近签到点，避免"位置不在签到范围内"。
+		// 但用户主动选择「范围外签到=是」时不得调整：此时用户就是要填范围外的位置
+		// （如回家/实习），强行改回学校坐标会导致实际打卡地点变成学校。
+		if !isOutOfRangeSign(submitForm) {
+			cpd.AdjustSubmitFormToSignRange(submitForm, detail.Rows)
+		}
 		// 照片仍是本地预览(base64)时自动上传换取正式 URL（用户上传失败保存的表单/历史遗留数据）
 		if photo, ok := submitForm["signPhotoUrl"].(string); ok && cpd.IsDataURIImage(photo) {
 			sendEvent("submitting", map[string]interface{}{"status": "submitting", "message": "正在上传照片..."})
@@ -678,6 +739,16 @@ func executeSignTask(c *fiber.Ctx) error {
 				return
 			}
 			submitForm["signPhotoUrl"] = previewUrl
+		} else if photo, ok := submitForm["signPhotoUrl"].(string); ok && photo != "" {
+			// 照片是已上传的 OBS 预览 URL：其签名由云端签发、有效期很短，而任务是持久化的，
+			// 隔日执行时原签名多已过期，直接提交会被学校判为签到失败（如兰州交大 2210010000）。
+			// 用 URL 里稳定的对象 key 重签一个未过期的 URL（同一张照片，无需用户重传）。
+			// 重签失败不阻断：回退使用原 URL，由学校端判定，避免因预览接口偶发故障误杀签到。
+			if refreshed, rerr := cpd.RefreshPreviewURL(cookieMap, host, cpd.TaskType(task.TaskType), photo); rerr == nil {
+				submitForm["signPhotoUrl"] = refreshed
+			} else {
+				slog.Warn("签到照片重签失败，回退原URL", "taskId", id, "error", rerr)
+			}
 		}
 		err = cpd.SubmitSign(cookieMap, host, cpd.TaskType(task.TaskType), submitForm, user.MobileCode, user.StudentID)
 		if err != nil && isCookieExpired(err) {

backed/internal/handler/task_outofrange_test.go

@@ -0,0 +1,31 @@
+package handler
+
+import "testing"
+
+// TestIsOutOfRangeSign 判定「范围外签到」：值来源为 cpd 组装 submitForm 时的 isMalposition（1=范围外/0=范围内），
+// 兼容字符串。用于决定是否跳过坐标自动回退到学校签到点。
+func TestIsOutOfRangeSign(t *testing.T) {
+	cases := []struct {
+		name string
+		form map[string]interface{}
+		want bool
+	}{
+		{"缺字段默认范围内", map[string]interface{}{}, false},
+		{"数值1=范围外", map[string]interface{}{"isMalposition": 1}, true},
+		{"数值0=范围内", map[string]interface{}{"isMalposition": 0}, false},
+		{"int64 1", map[string]interface{}{"isMalposition": int64(1)}, true},
+		{"float64 1", map[string]interface{}{"isMalposition": float64(1)}, true},
+		{"字符串是", map[string]interface{}{"isMalposition": "是"}, true},
+		{"字符串否", map[string]interface{}{"isMalposition": "否"}, false},
+		{"字符串1", map[string]interface{}{"isMalposition": "1"}, true},
+		{"布尔true", map[string]interface{}{"isMalposition": true}, true},
+		{"nil", map[string]interface{}{"isMalposition": nil}, false},
+	}
+	for _, c := range cases {
+		t.Run(c.name, func(t *testing.T) {
+			if got := isOutOfRangeSign(c.form); got != c.want {
+				t.Fatalf("isOutOfRangeSign(%v) = %v, want %v", c.form, got, c.want)
+			}
+		})
+	}
+}

backed/internal/handler/task_worklog.go

@@ -0,0 +1,157 @@
+package handler
+
+import (
+	"bufio"
+	"encoding/json"
+	"errors"
+	"fmt"
+	"log/slog"
+	"strconv"
+	"strings"
+
+	"cpdaily-new/internal/database"
+	"cpdaily-new/internal/model"
+	cpd "cpdaily-new/internal/service/cpdaily"
+	"cpdaily-new/internal/utils"
+
+	"github.com/gofiber/fiber/v2"
+)
+
+// 教师端「工作日志」执行（SSE）。
+// 流程：取表单 → 文本项回填 → 定位签到项走 submitSign → update(operationType=1) 提交。
+// 事件流与其他任务一致：connecting → submitting → success / task_error。
+//
+// 注意：本流程依据公开逆向实现（spec://worklog_api.md）编写，尚未经真实教师会话端到端验证。
+func executeWorklogTask(c *fiber.Ctx, task *model.CpTask) error {
+	userID := c.Locals("userId").(uint)
+
+	var user model.SysUser
+	if err := database.DB.First(&user, userID).Error; err != nil {
+		return utils.FailAuth(c, "用户不存在")
+	}
+	if strings.TrimSpace(user.Cookie) == "" {
+		return utils.Fail(c, 400, "请先登录")
+	}
+
+	formWid, wid, perr := cpd.ParseWorklogSignWid(task.SignWid)
+	if perr != nil {
+		return utils.FailParam(c, "任务标识无效")
+	}
+
+	// 保存的表单值（colName=字段 wid → content），用于回填
+	saved := map[string]string{}
+	for _, it := range parseSavedFormItems(task.FormData) {
+		saved[it.ColName] = it.Content
+	}
+
+	c.Set("Content-Type", "text/event-stream")
+	c.Set("Cache-Control", "no-cache")
+	c.Set("Connection", "keep-alive")
+	c.Set("X-Accel-Buffering", "no")
+
+	c.Context().SetBodyStreamWriter(func(w *bufio.Writer) {
+		sendEvent := func(event string, data map[string]interface{}) {
+			d, _ := json.Marshal(data)
+			fmt.Fprintf(w, "event: %s\ndata: %s\n\n", event, string(d))
+			w.Flush()
+		}
+		saveLog := func(isSuccess bool, errMsg string) {
+			database.DB.Create(&model.CpTaskLog{
+				UserID: userID, CpTaskID: task.ID, TaskType: string(cpd.TaskTypeWorklog),
+				Title: task.Title, RealTitle: task.RealTitle, IsSuccess: isSuccess, ErrorMessage: errMsg,
+			})
+		}
+
+		host := getSchoolHost(user.SchoolID)
+		sendEvent("connecting", map[string]interface{}{"status": "connecting", "message": "正在连接今日校园..."})
+
+		cookieMap := cpd.ParseCookieJSON(user.Cookie)
+		fields, err := cpd.FetchWorklogDetail(cookieMap, host, wid)
+		if err != nil && isCookieExpired(err) {
+			if refreshErr := refreshCpdailyCookie(&user); refreshErr == nil {
+				cookieMap = cpd.ParseCookieJSON(user.Cookie)
+				fields, err = cpd.FetchWorklogDetail(cookieMap, host, wid)
+			}
+		}
+		if err != nil {
+			msg := "获取工作日志表单失败: " + err.Error()
+			if errors.Is(err, ErrPasswordChanged) {
+				msg = "登录凭证已过期，请重新登录"
+			}
+			saveLog(false, msg)
+			sendEvent("task_error", map[string]interface{}{"status": "error", "message": msg, "needReLogin": errors.Is(err, ErrPasswordChanged)})
+			return
+		}
+
+		sendEvent("submitting", map[string]interface{}{"status": "submitting", "message": "正在提交工作日志..."})
+
+		// 逐字段回填：普通字段赋值；签到项（signCondition=true）走 submitSign。
+		// 签到项的坐标由用户在编辑时选择校区写入该字段 content（"lat,lng"，取该校区的规定经纬度）。
+		for i := range fields {
+			f := &fields[i]
+			if v, ok := saved[strconv.FormatInt(f.Wid, 10)]; ok && strings.TrimSpace(v) != "" {
+				f.Value = v
+			}
+			if !f.SignCondition {
+				continue
+			}
+			lat, lon := parseWorklogLatLon(f.Value)
+			if lon == "" || lat == "" {
+				msg := "工作日志「" + f.Title + "」需要选择签到校区，请在编辑任务时选择后重试"
+				saveLog(false, msg)
+				sendEvent("task_error", map[string]interface{}{"status": "error", "message": msg})
+				return
+			}
+			// 范围校验：不在允许的校区范围内则明确拒绝（不伪造定位）
+			if scopes := cpd.WorklogScopePoints(*f); len(scopes) > 0 && !cpd.WorklogWithinRange(*f, lat, lon) {
+				msg := "工作日志「" + f.Title + "」当前定位不在允许的签到范围内，请到指定校区后重新获取定位"
+				saveLog(false, msg)
+				sendEvent("task_error", map[string]interface{}{"status": "error", "message": msg})
+				return
+			}
+			if serr := cpd.SubmitWorklogSign(cookieMap, host, f.Wid, wid, "", lon, lat); serr != nil {
+				msg := "签到失败: " + serr.Error()
+				saveLog(false, msg)
+				sendEvent("task_error", map[string]interface{}{"status": "error", "message": msg})
+				return
+			}
+		}
+
+		if err := cpd.SubmitWorklog(cookieMap, host, formWid, wid, fields); err != nil {
+			msg := "提交工作日志失败: " + err.Error()
+			saveLog(false, msg)
+			sendEvent("task_error", map[string]interface{}{"status": "error", "message": msg})
+			return
+		}
+
+		saveLog(true, "")
+		database.DB.Model(&model.CpTask{}).Where("id = ?", task.ID).
+			Updates(map[string]interface{}{"task_status": "success", "error_message": ""})
+		slog.Info("工作日志提交成功", "userId", userID, "taskId", task.ID)
+		sendEvent("success", map[string]interface{}{"status": "success", "message": "工作日志提交成功！"})
+	})
+
+	return nil
+}
+
+// parseSavedFormItems 解析任务已保存表单（best-effort，解析失败返回空）
+func parseSavedFormItems(raw string) []model.CpTaskFormItem {
+	if strings.TrimSpace(raw) == "" {
+		return nil
+	}
+	var items []model.CpTaskFormItem
+	if err := json.Unmarshal([]byte(raw), &items); err != nil {
+		return nil
+	}
+	return items
+}
+
+// parseWorklogLatLon 解析签到字段 content 中的 "lat,lng"。
+// 前端由用户选择校区后写入该校区的规定经纬度（lat,lng），学校按点位半径校验。
+func parseWorklogLatLon(v string) (lat, lon string) {
+	parts := strings.SplitN(strings.TrimSpace(v), ",", 2)
+	if len(parts) != 2 {
+		return "", ""
+	}
+	return strings.TrimSpace(parts[0]), strings.TrimSpace(parts[1])
+}

backed/internal/middleware/jwt.go

@@ -54,6 +54,20 @@ func AuthRequired() fiber.Handler {
 		if err != nil {
 			return utils.FailAuth(c, "token无效或已过期")
 		}
+		// 封号拦截：token 有效但账号已被封禁时，所有接口一律拒绝并返回封号原因。
+		// 注意：必须用 query 只取 status/disabled_reason，避免加载长字段；用户不存在按放行处理
+		//（由各 handler 自行兜底），避免误伤。
+		var u model.SysUser
+		if err := database.DB.Select("id", "status", "disabled_reason").First(&u, claims.UserID).Error; err == nil {
+			if u.Status == "disabled" {
+				reason := strings.TrimSpace(u.DisabledReason)
+				if reason == "" {
+					reason = "您的账号已被管理员封禁，如有疑问请联系客服"
+				}
+				// HTTP 403 + 业务码 4030：前端据此弹出封号原因并登出，不触发 token 刷新
+				return c.Status(403).JSON(utils.Response{Code: 4030, Message: reason})
+			}
+		}
 		// 将用户信息存入 context
 		c.Locals("userId", claims.UserID)
 		c.Locals("username", claims.Username)

backed/internal/model/cp_leave_log.go

@@ -30,5 +30,6 @@ func (CpLeaveLog) TableName() string {
 // 日志动作类型：请假申请 / 销假
 const (
 	LeaveActionApply  = "apply"  // 请假申请
+	LeaveActionExtend = "extend" // 续假（延长已有假单，与新建请假区分）
 	LeaveActionReport = "report" // 销假
 )

backed/internal/model/cp_task.go

@@ -47,6 +47,10 @@ const (
 	ItemTypeMulti     CpTaskItemType = 3 // 多选
 	ItemTypeImage     CpTaskItemType = 4 // 图片
 	ItemTypeLatAndLon CpTaskItemType = 6 // 经纬度
+	// 以下类型来自今日校园字段定义（工作日志等场景）：原样透传，前端按类型渲染控件
+	ItemTypeDate     CpTaskItemType = 5 // 日期/时间
+	ItemTypeDateTime CpTaskItemType = 7 // 日期时间
+	ItemTypeTextarea CpTaskItemType = 9 // 多行文本
 )
 
 // CpTaskFormOption 表单选项

backed/internal/service/cpdaily/image.go

@@ -9,6 +9,7 @@ import (
 	"io"
 	"mime/multipart"
 	"net/textproto"
+	"net/url"
 	"strings"
 	"time"
 
@@ -242,6 +243,36 @@ func IsDataURIImage(content string) bool {
 	return strings.HasPrefix(content, "data:image")
 }
 
+// OssKeyFromURL 从已存的 OBS 预览 URL 中提取稳定的对象 key（即 URL path，去掉前导 "/"）。
+// 预览 URL 形如：
+//
+//	https://<host>/<key>?AccessKeyId=..&Expires=..&Signature=..
+//	https://<host>/<key>?sign=q-sign-algorithm%3D..
+//
+// 其中 query（AccessKeyId/Expires/Signature 或 sign）是**一次性签名**，会过期；
+// 而 path（对象 key）指向同一张图、长期不变。取出 key 后可反复向预览接口换取
+// 未过期的新 URL（同一张图，无需用户重传）。
+func OssKeyFromURL(raw string) string {
+	u, err := url.Parse(strings.TrimSpace(raw))
+	if err != nil || u.Host == "" {
+		return ""
+	}
+	return strings.TrimPrefix(u.Path, "/")
+}
+
+// RefreshPreviewURL 用已存预览 URL 里稳定的对象 key，向预览接口重新换取一个未过期的 URL。
+//
+// 场景：签到照片的签名由云端签发、有效期很短（可能仅数分钟），而签到任务是持久化的。
+// 用户建任务当天上传照片、隔日再执行时，原签名早已过期，直接提交会被学校判为签到失败
+// （如兰州交大返回 2210010000 签到失败）。此处用对象 key 重签即可继续使用同一张照片。
+func RefreshPreviewURL(cookieMap map[string]string, host string, taskType TaskType, storedURL string) (string, error) {
+	key := OssKeyFromURL(storedURL)
+	if key == "" {
+		return "", fmt.Errorf("无法从图片 URL 解析对象 key")
+	}
+	return GetPreviewUrl(cookieMap, host, taskType, key)
+}
+
 // UploadDataURIImage 将 base64 图片解码后走正常 OBS 上传流程，返回正式预览 URL。
 // 用于执行时自动修复历史表单中残留的 base64 照片（用户上传失败时保存的内容）。
 func UploadDataURIImage(cookieMap map[string]string, host string, taskType TaskType, dataURI string) (string, error) {

backed/internal/service/cpdaily/image_test.go

@@ -0,0 +1,71 @@
+package cpdaily
+
+import (
+	"encoding/json"
+	"net/http"
+	"net/http/httptest"
+	"testing"
+)
+
+// OssKeyFromURL 从已存预览 URL 提取稳定对象 key（query 里的签名会过期，path 不会）。
+func TestOssKeyFromURL(t *testing.T) {
+	cases := []struct {
+		name string
+		in   string
+		want string
+	}{
+		{
+			name: "腾讯COS风格签名URL(真实样本)",
+			in:   `https://wecres.campusphere.net/counselor/sign/1019669221816027/attachment/2e6daa899c974a2cbb71a3243c50ddb1?AccessKeyId=HPUAX9XCPLECZ7RMD26U&Expires=1791877432&Signature=r7nEh%2BauSO2d4lsga5fzPugOhzw%3D`,
+			want: "counselor/sign/1019669221816027/attachment/2e6daa899c974a2cbb71a3243c50ddb1",
+		},
+		{
+			name: "华为OBS风格 sign= 签名URL(真实样本)",
+			in:   `https://counselor-cos-wecres.campusphere.net/counselor/sign/1019669221816027/attachment/730b54175bc249a783d69124e7ecb81e.png?sign=q-sign-algorithm%3Dsha1%26q-ak%3DAKIDMaaNyLVdgmr59AC6qZ7a5QjsnbIo8MOF`,
+			want: "counselor/sign/1019669221816027/attachment/730b54175bc249a783d69124e7ecb81e.png",
+		},
+		{name: "无query", in: "https://h.example.com/a/b/c.jpg", want: "a/b/c.jpg"},
+		{name: "非URL", in: "data:image/png;base64,AAAA", want: ""},
+		{name: "空串", in: "", want: ""},
+	}
+	for _, c := range cases {
+		if got := OssKeyFromURL(c.in); got != c.want {
+			t.Errorf("%s: OssKeyFromURL=%q, want %q", c.name, got, c.want)
+		}
+	}
+}
+
+// RefreshPreviewURL 用存储URL里的对象key重新换取未过期URL（走 mock 预览接口）。
+func TestRefreshPreviewURL(t *testing.T) {
+	const key = "counselor/sign/1019669221816027/attachment/2e6daa899c974a2cbb71a3243c50ddb1"
+	srv := httptest.NewServer(http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
+		// 断言用的是提取出的 key，而非把整条旧URL再传回去
+		var body map[string]interface{}
+		_ = json.NewDecoder(r.Body).Decode(&body)
+		if got, _ := body["ossKey"].(string); got != key {
+			t.Errorf("预览接口收到 ossKey=%q, want %q", got, key)
+		}
+		w.Header().Set("Content-Type", "application/json")
+		_ = json.NewEncoder(w).Encode(map[string]interface{}{
+			"errCode": 0,
+			"datas":   "https://wecres.campusphere.net/" + key + "?AccessKeyId=x&Expires=9999999999&Signature=y",
+		})
+	}))
+	defer srv.Close()
+
+	stored := "https://wecres.campusphere.net/" + key + "?AccessKeyId=old&Expires=1&Signature=old"
+	got, err := RefreshPreviewURL(map[string]string{}, srv.URL, TaskTypeSign, stored)
+	if err != nil {
+		t.Fatalf("RefreshPreviewURL 失败: %v", err)
+	}
+	if got == "" || got == stored {
+		t.Fatalf("应返回新的预览URL，实际: %q", got)
+	}
+}
+
+// key 解析不出时明确报错（不静默用坏URL提交）。
+func TestRefreshPreviewURLBadInput(t *testing.T) {
+	if _, err := RefreshPreviewURL(map[string]string{}, "https://h.example.com", TaskTypeSign, "not-a-url"); err == nil {
+		t.Fatal("无法解析 key 时应报错")
+	}
+}

backed/internal/service/cpdaily/leave.go

@@ -55,6 +55,11 @@ type LeaveItem struct {
 	ReportApplyFlow bool `json:"reportApplyFlow"`
 	// 销假是否允许上传图片（leaveType.enableAttach=1）
 	EnableAttach bool `json:"enableAttach"`
+	// —— 续假（仅新套）——
+	CanReport  bool   `json:"canReport"` // 是否可销假（列表含仅可续假的单，前端销假模式据此过滤）
+	CanExtend  bool   `json:"canExtend"` // 是否可续假（休假中/逾期 且 isAllowExtend）
+	TypeWid    string `json:"typeWid,omitempty"`
+	IsLeaveOut string `json:"isLeaveOut,omitempty"`
 }
 
 // LeaveDetail 请假详情（提交销假所需字段）
@@ -68,6 +73,8 @@ type LeaveDetail struct {
 	ReportApplyFlow bool   // 销假需要选择审批人
 	EnableAttach    bool   // 销假允许上传图片
 	ReportPlaces    []LeaveReportPlace
+	// IsAllowedExtend 旧套详情顶层字段：当前是否允许续假（列表接口不返回，只能查详情）
+	IsAllowedExtend bool
 }
 
 // leaveAnyStr 将 interface{} 值转为纯文本字符串（数字类型避免科学计数法）
@@ -234,9 +241,13 @@ func FetchLeaveList(cookieMap map[string]string, host string) ([]LeaveItem, erro
 			CreateTime: leaveMapStr(row, "createTime"),
 			ActEndTime: leaveMapStr(row, "actEndTime"),
 			Status:     status,
+			// 旧套列表已过滤为可销假记录
+			CanReport: true,
+			// 旧套续假：列表行不含该字段，需由详情 detailOther 的 isAllowedExtend 判定（见下）
 		}
-		// 补充规定销假位置与开关（来自详情 reportPlaces / leaveType）
+		// 补充规定销假位置与开关（来自详情 reportPlaces / leaveType），以及可续假标记
 		if d, err := FetchLeaveDetail(cookieMap, host, id); err == nil {
+			item.CanExtend = leaveOldCanExtend(status, d.IsAllowedExtend)
 			item.ReportPlaces = d.ReportPlaces
 			item.ReportApplyFlow = d.ReportApplyFlow
 			item.EnableAttach = d.EnableAttach
@@ -248,6 +259,23 @@ func FetchLeaveList(cookieMap map[string]string, host string) ([]LeaveItem, erro
 	return list, nil
 }
 
+// leaveOldCanExtend 旧套「是否可续假」判定：与销假同理，需同时满足
+//  1. 状态处于假期中/待处理阶段（5=即将休假、6=正在休假中；其余 3 已驳回/4 已完成/10 逾期驳回等不可续）；
+//  2. 详情接口返回 isAllowedExtend=true（学校放开该单的续假）。
+//
+// 仅凭 isAllowedExtend 不够：已结束/驳回的单服务端也可能不返回该标志，但显式加状态判断更稳。
+func leaveOldCanExtend(status string, allowedExtend bool) bool {
+	if !allowedExtend {
+		return false
+	}
+	switch status {
+	case "2", "5", "6": // 处理中/即将休假/正在休假中
+		return true
+	default:
+		return false
+	}
+}
+
 // FetchLeaveDetail 获取请假详情（提交销假所需字段 + 规定销假位置与开关）
 func FetchLeaveDetail(cookieMap map[string]string, host, leaveID string) (*LeaveDetail, error) {
 	body, err := leavePost(cookieMap, host+leaveAPIBase+"/stu/detailOther", map[string]interface{}{
@@ -265,7 +293,9 @@ func FetchLeaveDetail(cookieMap map[string]string, host, leaveID string) (*Leave
 		ErrCode int         `json:"errCode"`
 		Message string      `json:"message"`
 		Datas   struct {
-			Detail struct {
+			// 顶层 isAllowedExtend：当前是否允许续假（与 isExtend 不同，isExtend 表示是否为续假单）
+			IsAllowedExtend interface{} `json:"isAllowedExtend"`
+			Detail          struct {
 				ID        string `json:"id"`
 				StartDate string `json:"startDate"`
 				EndDate   string `json:"endDate"`
@@ -315,6 +345,7 @@ func FetchLeaveDetail(cookieMap map[string]string, host, leaveID string) (*Leave
 		EndTime:         result.Datas.Detail.EndDate,
 		ReportApplyFlow: leaveAnyBool(result.Datas.LeaveType.ReportApplyFlow),
 		EnableAttach:    leaveAnyBool(result.Datas.LeaveType.EnableAttach),
+		IsAllowedExtend: leaveAnyBool(result.Datas.IsAllowedExtend),
 	}
 	for _, p := range result.Datas.ReportPlaces {
 		d.ReportPlaces = append(d.ReportPlaces, LeaveReportPlace{
@@ -346,7 +377,7 @@ func FetchReportApprovers(cookieMap map[string]string, host string, leaveCodeNum
 		Code    json.Number `json:"code"`
 		Message string      `json:"message"`
 		Datas   struct {
-			Approvers []LeaveApprover `json:"approvers"`
+			Approvers    []LeaveApprover `json:"approvers"`
 			ApproveNodes []struct {
 				ApproveNode []struct {
 					NodeName  string          `json:"nodeName"`
@@ -453,14 +484,16 @@ func SubmitLeaveReport(cookieMap map[string]string, host string, form map[string
 	code, _ := result.Code.Int64()
 	slog.Info("leave/report 响应", "code", result.Code.String(), "message", result.Message, "body", string(body))
 	if code != 0 {
-		msg := result.Message
-		if msg == "" {
-			msg = "未知错误"
-		}
-		// 2210990000：学校要求销假必须上传附件。enableAttach 字段在旧套不可靠
-		// （实测多所旧套学校恒为 0），无法提交前拦截，只能在此识别并引导用户。
-		if code == 2210990000 {
-			msg = "该请假销假需要上传附件图片，请上传附件后重试"
+		// 优先透传学校返回的 message：该校 2210990000 是通用错误码，可能表示
+		// 「需要添加附件」「设备更换，无法查看，请联系管理老师」等多种原因，
+		// 不能一律翻译成"需要附件"（曾因此误导用户以为已上传附件仍报错）。
+		msg := strings.TrimSpace(result.Message)
+		if msg == "" || msg == "failed" {
+			if code == 2210990000 {
+				msg = "销假失败，请检查是否已按要求上传附件或设备信息是否有效，或联系管理老师"
+			} else {
+				msg = "未知错误"
+			}
 		}
 		return fmt.Errorf("%s", msg)
 	}

backed/internal/service/cpdaily/leave_apply.go

@@ -32,6 +32,10 @@ type LeaveType struct {
 	LimitDay              int    `json:"limitDay"`              // 单次最长可请假天数（0=不限）
 	RequireSign           int    `json:"requireSign"`           // 1=需先手写承诺书签名后提交
 	OutStatusDefault      int    `json:"outStatusDefault"`      // 「是否离校」默认值（0=无默认 1=默认是 2=默认否；仅新套）
+	// —— 新套「附加信息」相关 ——
+	RequireEvidence  int                      `json:"requireEvidence"`  // 1=必须上传证明材料（isRequiredEvidenceFile）
+	EvidenceMin      int                      `json:"evidenceMin"`      // 证明材料最少张数
+	SelfDefineFields []map[string]interface{} `json:"selfDefineFields"` // 自定义必填字段（如「当天是否返校」），提交时回填 selfDefineAnswers
 }
 
 // CheckOnceLeave 检查是否允许请假（学校可能配置同一时间仅一条请假单等限制）
@@ -348,3 +352,53 @@ func SubmitLeaveApply(cookieMap map[string]string, host string, form map[string]
 	}
 	return nil
 }
+
+// BuildLeaveExtendForm 构造旧套续假提交体（/saveExtend）。
+// 续假体 = 普通请假申请体 + leaveId + extendReason + extendHolidayAutoDefineVos（见官方 home.*.js）。
+// extendReason 复用 leaveReason；holiday 自动定义暂传空数组（与官方默认一致）。
+func BuildLeaveExtendForm(p LeaveApplyParams, deviceId, systemVersion, appVersion, leaveID string) map[string]interface{} {
+	form := BuildLeaveApplyForm(p, deviceId, systemVersion, appVersion)
+	form["leaveId"] = leaveID
+	form["extendReason"] = p.LeaveReason
+	form["extendHolidayAutoDefineVos"] = []interface{}{}
+
+	// 续假（/leave/saveExtend）定位参数与普通请假不同：官方提交体把坐标放在**顶层**
+	// address/latitude/longitude（由前端 locationData 展开），而**不使用 location 子对象**。
+	// 此前沿用请假的 location:{...}，服务端报「请假定位参数错误」。
+	// 实测官方 saveExtend 提交体字段：{...model, address, latitude, longitude, locationType, leaveId, extendReason, ...}
+	delete(form, "location")
+	form["address"] = p.LocationAddr
+	form["latitude"] = p.Latitude
+	form["longitude"] = p.Longitude
+	form["locationType"] = 0
+	return form
+}
+
+// SubmitLeaveExtend 提交旧套续假（POST /saveExtend，明文 JSON + Cpdaily-Extension 头）。
+// 与 SubmitLeaveApply 同构，仅接口路径不同。
+func SubmitLeaveExtend(cookieMap map[string]string, host string, form map[string]interface{}, lon, lat, deviceId, username string) error {
+	extensionString := GetExtensionString(lat, lon, deviceId, username)
+
+	body, err := leavePost(cookieMap, host+leaveAPIBase+"/saveExtend", form, extensionString)
+	if err != nil {
+		return fmt.Errorf("提交续假请求失败: %w", err)
+	}
+
+	var result struct {
+		Code    json.Number `json:"code"`
+		Message string      `json:"message"`
+	}
+	if err := unmarshalBody(body, &result); err != nil {
+		return fmt.Errorf("解析续假响应失败: %w, body: %s", err, string(body))
+	}
+	code, _ := result.Code.Int64()
+	slog.Info("leave/saveExtend 响应", "code", result.Code.String(), "message", result.Message)
+	if code != 0 {
+		msg := result.Message
+		if msg == "" {
+			msg = "未知错误"
+		}
+		return fmt.Errorf("%s", msg)
+	}
+	return nil
+}

backed/internal/service/cpdaily/leave_apply_test.go

@@ -275,3 +275,30 @@ func TestBuildLeaveApplyFormEmptyAttachURLs(t *testing.T) {
 		t.Errorf("全空时应为空数组: %v", form2["applyAttach"])
 	}
 }
+
+// 续假（旧套 saveExtend）提交体：坐标必须放顶层 latitude/longitude/address，
+// 且不得携带请假用的 location 子对象（否则服务端报「请假定位参数错误」）。
+func TestBuildLeaveExtendForm_LocationTopLevel(t *testing.T) {
+	p := LeaveApplyParams{
+		LeaveType: 12, StartTime: "2026-10-08 22:30", EndTime: "2026-10-10 22:30",
+		LeaveReason: "续假三天", OutStatus: false,
+		Longitude: "102.85939585", Latitude: "24.82989733", LocationAddr: "云南省昆明市呈贡区洋浦路",
+	}
+	form := BuildLeaveExtendForm(p, "dev-uuid", "15", "9.9.6", "3d917d58abcd")
+
+	if _, has := form["location"]; has {
+		t.Fatal("续假提交体不应包含 location 子对象")
+	}
+	if form["latitude"] != "24.82989733" || form["longitude"] != "102.85939585" {
+		t.Fatalf("坐标应在顶层 latitude/longitude，实际 lat=%v lon=%v", form["latitude"], form["longitude"])
+	}
+	if form["address"] != "云南省昆明市呈贡区洋浦路" {
+		t.Fatalf("address 应为定位地址，实际 %v", form["address"])
+	}
+	if form["leaveId"] != "3d917d58abcd" || form["extendReason"] != "续假三天" {
+		t.Fatalf("leaveId/extendReason 错误: %v / %v", form["leaveId"], form["extendReason"])
+	}
+	if _, has := form["extendHolidayAutoDefineVos"]; !has {
+		t.Fatal("应携带 extendHolidayAutoDefineVos")
+	}
+}

backed/internal/service/cpdaily/leave_new.go

@@ -777,6 +777,8 @@ type LeaveNewApplyParams struct {
 	TypeWid         int
 	LeaveID         string // 续假时的原请假单 ID（新申请为空）
 	IsExtend        bool
+	ExtendID        string // 续假时由 queryReplyLeaveDetail 返回的 extendId（新申请为空）
+	ReApply         bool   // 续假/重新申请标记（续假为 true）
 	BeginTime       string // yyyy-MM-dd HH:mm
 	EndTime         string
 	LeaveTime       int64 // 时长（分钟，0 由服务端计算）
@@ -800,6 +802,8 @@ type LeaveNewApplyParams struct {
 	UserID          string
 	DeviceID        string
 	Model           string
+	// SelfDefineAnswers 自定义附加字段的作答（selfDefineFields 的回填，如「当天是否返校」）
+	SelfDefineAnswers []map[string]interface{}
 }
 
 // BuildLeaveNewApplyForm 构造请假提交体（/stu/leave/apply 明文 JSON）
@@ -866,6 +870,8 @@ func BuildLeaveNewApplyForm(p LeaveNewApplyParams) map[string]interface{} {
 	form := map[string]interface{}{
 		"leaveId":     p.LeaveID,
 		"isExtend":    p.IsExtend,
+		"reApply":     p.ReApply,
+		"extendId":    nilIfEmpty(p.ExtendID),
 		"typeWid":     p.TypeWid,
 		"beginTime":   p.BeginTime,
 		"endTime":     p.EndTime,
@@ -878,7 +884,7 @@ func BuildLeaveNewApplyForm(p LeaveNewApplyParams) map[string]interface{} {
 			"latitude":  p.Latitude,
 		},
 		"leaveOutInfo":      leaveOutInfo,
-		"selfDefineAnswers": []interface{}{},
+		"selfDefineAnswers": selfDefineAnswersOrEmpty(p.SelfDefineAnswers),
 		"ccObjects":         ccObjects,
 		"baseCcObjects":     []interface{}{},
 		"flowData":          p.FlowData,
@@ -1038,3 +1044,69 @@ func UploadLeaveNewDataURIImage(cookieMap map[string]string, host, dataURI strin
 	}
 	return UploadLeaveNewImage(cookieMap, host, imgBytes, "image/jpeg")
 }
+
+// nilIfEmpty 空串转 nil（extendId 等字段官方前端在非续假时传 null）
+func nilIfEmpty(s string) interface{} {
+	if strings.TrimSpace(s) == "" {
+		return nil
+	}
+	return s
+}
+
+// LeaveNewReplyDetail 续假预填信息（queryReplyLeaveDetail 返回的关键字段）
+type LeaveNewReplyDetail struct {
+	LeaveID     string
+	ExtendID    string
+	TypeWid     int
+	BeginTime   string // 原假单结束时间，作为续假开始时间
+	EndTime     string
+	LeaveReason string
+	IsLeaveOut  string
+	Raw         map[string]interface{}
+}
+
+// FetchLeaveNewReplyDetail 续假预填：POST /stu/leave/queryReplyLeaveDetail {leaveId}
+// 仅对「休假中 + isAllowExtend」的假单返回有效数据；其它状态字段为 null。
+func FetchLeaveNewReplyDetail(cookieMap map[string]string, host, leaveID string) (*LeaveNewReplyDetail, error) {
+	body, err := leavePost(cookieMap, host+leaveNewAPIBase+"/stu/leave/queryReplyLeaveDetail", map[string]interface{}{"leaveId": leaveID}, "")
+	if err != nil {
+		return nil, err
+	}
+	if _, err := leaveNewResultErr(body, "续假预填"); err != nil {
+		return nil, err
+	}
+	var result struct {
+		Datas map[string]interface{} `json:"datas"`
+	}
+	if err := unmarshalBody(body, &result); err != nil {
+		return nil, fmt.Errorf("解析续假预填失败: %w", err)
+	}
+	d := result.Datas
+	twid := 0
+	if v, ok := d["typeWid"]; ok {
+		switch n := v.(type) {
+		case float64:
+			twid = int(n)
+		case string:
+			twid, _ = strconv.Atoi(n)
+		}
+	}
+	return &LeaveNewReplyDetail{
+		LeaveID:     leaveMapStr(d, "leaveId"),
+		ExtendID:    leaveMapStr(d, "extendId"),
+		TypeWid:     twid,
+		BeginTime:   leaveMapStr(d, "beginTime"),
+		EndTime:     leaveMapStr(d, "endTime"),
+		LeaveReason: leaveMapStr(d, "leaveReason"),
+		IsLeaveOut:  leaveMapStr(d, "isLeaveOut"),
+		Raw:         d,
+	}, nil
+}
+
+// selfDefineAnswersOrEmpty 保证 selfDefineAnswers 为非 nil 数组（无作答时为 []）
+func selfDefineAnswersOrEmpty(a []map[string]interface{}) []map[string]interface{} {
+	if a == nil {
+		return []map[string]interface{}{}
+	}
+	return a
+}

backed/internal/service/cpdaily/login_cas.go

@@ -33,7 +33,13 @@ func newSessionClient() *sessionClient {
 			InsecureSkipVerify: true,
 			MinVersion:         tls.VersionTLS10,
 		}).
-		SetHeader("User-Agent", "Mozilla/5.0 (iPhone; CPU iPhone OS 17_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.0 Mobile/15E148 Safari/604.1")
+		SetHeader("User-Agent", "Mozilla/5.0 (iPhone; CPU iPhone OS 17_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.0 Mobile/15E148 Safari/604.1").
+		// 浏览器常见头：部分学校（如通化师范学院 authserver.thnu.edu.cn）前置 WAF 按请求头
+		// 指纹判定客户端，仅带 UA、缺少 Accept 类头会被判为机器人直接返回 429（空 body）。
+		// 仅补 Accept/Accept-Language 即可通过校验（实测移动 UA + 这两项 → 200）；
+		// 保留原移动 UA，不影响 wisedu 按 UA 渲染移动/PC 模板。
+		SetHeader("Accept", "text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,*/*;q=0.8").
+		SetHeader("Accept-Language", "zh-CN,zh;q=0.9,en;q=0.8")
 	client.SetCookieJar(jar)
 	// 自定义重定向策略：与 resty 默认 FlexibleRedirectPolicy 行为一致（最多 20 跳），
 	// 但跨 host 重定向时保留原 User-Agent。resty 默认策略会把跨 host 请求的 UA 换成
@@ -100,6 +106,8 @@ func casLogin(ctx context.Context, school *SchoolDetailInfo, username, password
 
 	// 4. 解析表单
 	allInputs := parseLoginForm(loginPageBytes, username, password)
+	// CAS-PaaS 定制 CAS：密码需 RSA 加密（"__RSA__"+密文），覆盖上面解出的明文密码
+	casPaasEncryptIfNeeded(sc.Client, loginResponseUrl, loginPageBytes, allInputs, password)
 	slog.Info("CAS表单解析", "inputs", fmt.Sprintf("%v", allInputs))
 
 	// 5. 判断是否需要验证码

backed/internal/service/cpdaily/login_caspaas.go

@@ -0,0 +1,84 @@
+package cpdaily
+
+import (
+	"encoding/base64"
+	"encoding/hex"
+	"fmt"
+	"log/slog"
+	"net/url"
+	"strings"
+
+	"github.com/go-resty/resty/v2"
+)
+
+// ========== CAS-PaaS（深信息 suncaper 定制 CAS）适配 ==========
+//
+// 部分学校（如兰州理工大学 cas-paas.lut.edu.cn）使用 CAS-PaaS 统一身份认证：
+// 登录页为 JS 渲染，密码需用 RSA（JSEncrypt）加密后提交，格式为 "__RSA__" + RSA密文。
+// 公钥来自登录页同域接口 /cas/jwt/publicKey（PEM 格式）。
+//
+// 判定：登录页 HTML 同时含 "/cas/jwt/publicKey" 或 "__RSA__" 特征。
+
+// isCasPaasLoginPage 登录页是否为 CAS-PaaS 定制 CAS
+func isCasPaasLoginPage(page []byte) bool {
+	s := string(page)
+	return strings.Contains(s, "/cas/jwt/publicKey") || strings.Contains(s, "__RSA__")
+}
+
+// casPaasEncryptPassword 拉取 CAS-PaaS 公钥并加密密码，返回 "__RSA__"+密文。
+// casHost 形如 https://cas-paas.lut.edu.cn
+func casPaasEncryptPassword(client *resty.Client, casHost, password string) (string, error) {
+	resp, err := client.R().Get(casHost + "/cas/jwt/publicKey")
+	if err != nil {
+		return "", fmt.Errorf("获取 CAS-PaaS 公钥失败: %w", err)
+	}
+	pub := strings.TrimSpace(string(readBody(resp)))
+	// 去掉 PEM 头尾，取 base64 主体（NewRSAKeyPairFromPublicKey 接收 base64）
+	pub = strings.ReplaceAll(pub, "-----BEGIN PUBLIC KEY-----", "")
+	pub = strings.ReplaceAll(pub, "-----END PUBLIC KEY-----", "")
+	pub = strings.ReplaceAll(pub, "\n", "")
+	pub = strings.ReplaceAll(pub, "\r", "")
+	pub = strings.TrimSpace(pub)
+	if pub == "" {
+		return "", fmt.Errorf("CAS-PaaS 公钥为空")
+	}
+	key, err := NewRSAKeyPairFromPublicKey(pub)
+	if err != nil {
+		return "", fmt.Errorf("解析 CAS-PaaS 公钥失败: %w", err)
+	}
+	encHex, err := key.Encrypt(password)
+	if err != nil {
+		return "", fmt.Errorf("CAS-PaaS 密码加密失败: %w", err)
+	}
+	// JSEncrypt 的 encrypt() 返回 base64；本仓库 RSAKeyPair.Encrypt 返回 hex，需转 base64。
+	// Go 侧 hex→bytes→base64 与 JS 的 b64tohex 逆运算一致（均为无符号大端字节序列）。
+	raw, err := hex.DecodeString(encHex)
+	if err != nil {
+		return "", fmt.Errorf("CAS-PaaS 密文转码失败: %w", err)
+	}
+	enc := base64.StdEncoding.EncodeToString(raw)
+	return "__RSA__" + enc, nil
+}
+
+// casPaasBaseOf 由登录页 URL 推导 CAS-PaaS 基础地址（scheme://host）
+func casPaasBaseOf(loginURL *url.URL) string {
+	if loginURL == nil {
+		return ""
+	}
+	return loginURL.Scheme + "://" + loginURL.Host
+}
+
+// casPaasEncryptIfNeeded 若登录页为 CAS-PaaS，则把表单密码替换为加密值，返回是否已处理。
+func casPaasEncryptIfNeeded(client *resty.Client, loginURL *url.URL, page []byte, inputs map[string]string, password string) bool {
+	if !isCasPaasLoginPage(page) {
+		return false
+	}
+	enc, err := casPaasEncryptPassword(client, casPaasBaseOf(loginURL), password)
+	if err != nil {
+		slog.Warn("CAS-PaaS 密码加密失败", "error", err)
+		return false
+	}
+	inputs["password"] = enc
+	slog.Info("CAS-PaaS 密码已加密")
+	return true
+}

backed/internal/service/cpdaily/login_caspaas_test.go

@@ -0,0 +1,49 @@
+package cpdaily
+
+import (
+	"encoding/base64"
+	"encoding/hex"
+	"testing"
+)
+
+// TestIsCasPaasLoginPage CAS-PaaS 登录页特征识别
+func TestIsCasPaasLoginPage(t *testing.T) {
+	if !isCasPaasLoginPage([]byte(`<script src="/cas/deps/js/jsencrypt.min.js"></script>var url="/cas/jwt/publicKey"`)) {
+		t.Error("含 /cas/jwt/publicKey 应判定为 CAS-PaaS")
+	}
+	if !isCasPaasLoginPage([]byte(`var encodedPassword = "__RSA__"+encrypt.encrypt(password);`)) {
+		t.Error("含 __RSA__ 应判定为 CAS-PaaS")
+	}
+	if isCasPaasLoginPage([]byte(`<form id="casLoginForm" action="/authserver/login">`)) {
+		t.Error("普通 wisedu CAS 不应判定为 CAS-PaaS")
+	}
+}
+
+// TestCasPaasEncryptFormat CAS-PaaS 密码密文格式：__RSA__ + base64(PKCS#1 v1.5)。
+// 用固定 PEM 公钥验证：前缀正确、密文 base64 可解码且长度等于模长。
+func TestCasPaasEncryptFormat(t *testing.T) {
+	// 用仓库内 RSA 工具直接产出一个 base64 密文，校验与 CAS-PaaS 一致（hex→base64）
+	key, err := NewRSAKeyPairFromPublicKey(testPubKeyB64)
+	if err != nil {
+		t.Fatalf("构造公钥失败: %v", err)
+	}
+	encHex, err := key.Encrypt("pw")
+	if err != nil {
+		t.Fatalf("加密失败: %v", err)
+	}
+	raw, err := hex.DecodeString(encHex)
+	if err != nil {
+		t.Fatalf("hex 解码失败: %v", err)
+	}
+	b64 := base64.StdEncoding.EncodeToString(raw)
+	if _, err := base64.StdEncoding.DecodeString(b64); err != nil {
+		t.Fatalf("base64 解码失败: %v", err)
+	}
+	// 长度应为模长（2048 位 → 256 字节）；此处用 1024 位测试密钥 → 128 字节
+	if len(raw) != 128 {
+		t.Fatalf("密文长度应为 128（1024 位模长），got %d", len(raw))
+	}
+}
+
+// testPubKeyB64 1024 位 RSA 公钥（base64 DER/PKIX），仅测试用
+const testPubKeyB64 = "MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQCqGKukO1De7zhZj6+H0qtjTkVxwTCpvKe4eCZ0FPqri0cb2JZfXJ/DgYSF6vUpwmJG8wVQZKjeGcjDOL5UlsuusFncCzWBQ7RKNUSesmQRMSGkVb1/3j+skZ6UtW+5u09lHNsj6tQ51s1SPrCBkedbNf0Tp0GbMJDyR4e9T04ZZwIDAQAB"

backed/internal/service/cpdaily/login_lut.go

@@ -0,0 +1,45 @@
+package cpdaily
+
+import (
+	"context"
+	"net/http"
+	"strings"
+)
+
+// ========== 兰州理工大学（lut）单独适配 ==========
+
+// LutSchoolId 兰州理工大学 tenant id
+const LutSchoolId = "28fbe96b-cb5e-44a1-b31a-e6a44a556fe8"
+
+// lutCasLoginEntry 兰州理工大学 CAS 登录入口：
+// wecloud/ampUrl（fdm.lut.edu.cn）的 /iap 或 /wec-portal-mobile/client 会 302 到
+// 学校统一身份认证（cas-paas.lut.edu.cn/cas/login），service 携带网关回调
+// /iap/loginSuccess?sessionToken=...；从网关入口进入才能让回调后 cookie 落在
+// fdm.lut.edu.cn 域（wec-* 任务接口所在域）。
+func lutCasLoginEntry(school *SchoolDetailInfo) string {
+	if school == nil {
+		return ""
+	}
+	if school.AmpUrl != "" {
+		return school.AmpUrl
+	}
+	if school.WecloudUrl != "" {
+		return strings.TrimSuffix(school.WecloudUrl, "/") + "/iap"
+	}
+	return school.IdsUrl
+}
+
+// lutCasLogin 兰州理工大学强制走 CAS：
+// 平台配置 joinType=CLOUD（IsIap=true），但学校实际使用 CAS-PaaS 统一身份认证
+// （cas-paas.lut.edu.cn/cas/login，密码需 RSA 加密，前缀 "__RSA__"），
+// IAP 账密接口提交报 FAIL_UPNOTMATCH（误导为"密码错误"）。
+// 真实链路为网关入口 302 → CAS-PaaS 账密（RSA 加密密码）→ 回调 /iap/loginSuccess。
+// casLogin 内已按登录页特征自动识别 CAS-PaaS 并加密密码（见 login_caspaas.go）。
+func lutCasLogin(ctx context.Context, school *SchoolDetailInfo, username, password string) ([]*http.Cookie, *MFAContext, error) {
+	lut := *school
+	if entry := lutCasLoginEntry(school); entry != "" {
+		lut.AmpUrl = entry
+		lut.IdsUrl = entry
+	}
+	return casLogin(ctx, &lut, username, password)
+}

backed/internal/service/cpdaily/service.go

@@ -226,6 +226,12 @@ func CpdailyLogin(ctx context.Context, school *SchoolDetailInfo, username, passw
 	if school.ID == XzmySchoolId {
 		return xzmyCasLogin(ctx, school, username, password)
 	}
+	// 兰州理工大学：平台配置 joinType=CLOUD（IsIap=true），但实际为 CAS-PaaS 统一身份认证
+	//（cas-paas.lut.edu.cn/cas/login，密码 RSA 加密 "__RSA__"+密文），IAP 提交报 FAIL_UPNOTMATCH
+	//（"密码错误"）；单独强制走 CAS（详见 login_lut.go；CAS-PaaS 加密见 login_caspaas.go）
+	if school.ID == LutSchoolId {
+		return lutCasLogin(ctx, school, username, password)
+	}
 	// 华侨大学：写死强制走通用 CAS 流程——CAS 账密登录需 wisedu 定制滑块验证码
 	//（casLogin 内按 sliderIds 配置分流，见 slider.go），IAP 账密接口不兼容（FAIL_UPNOTMATCH）
 	if school.ID == HquSchoolId {

backed/internal/service/cpdaily/sms_login.go

@@ -311,6 +311,50 @@ func RefreshCasCookie(ctx context.Context, cookieMap map[string]string, host str
 	}
 
 	client := newSmsClient()
+	// 与 ExchangeCasCookie 保持一致：跟随 CAS 重定向，且跨跳时保留原请求头
+	// （否则 UPDATE 网关 302 到 /iap/login 后不跟随，或跟随中丢失 AmpCookies/SessionToken，
+	// 都会落到登录页 HTML，无法换回 MOD_AUTH_CAS）。
+	client.SetRedirectPolicy(resty.RedirectPolicyFunc(func(req *http.Request, via []*http.Request) error {
+		if len(via) >= 50 {
+			return fmt.Errorf("重定向次数过多")
+		}
+		for key, val := range via[0].Header {
+			if !strings.EqualFold(key, "Cookie") {
+				req.Header[key] = val
+			}
+		}
+		return nil
+	}))
+
+	// 关键：把长期凭证（CASTGC 等）连同基础 cookie 预置进 jar。
+	// 手机号登录时 CASTGC（TGC）会随登录响应一起保存，是真正的长期 SSO 凭证；
+	// 仅凭 sessionToken 头（AmpCookies）无法续期——网关会 302 到登录页。
+	// 此前这里未预置 CASTGC，导致手机号登录账号一旦 MOD_AUTH_CAS 过期便无法自动续期。
+	presetCookies := map[string]string{
+		"clientType":   "cpdaily_student",
+		"standAlone":   "0",
+		"sessionToken": sessionToken,
+	}
+	if v := cookieMap["tenantId"]; v != "" {
+		presetCookies["tenantId"] = v
+	}
+	if v := cookieMap["CASTGC"]; v != "" {
+		presetCookies["CASTGC"] = v
+	}
+	targetSchoolURL, err := url.Parse(strings.TrimSuffix(host, "/"))
+	if err != nil {
+		return nil, fmt.Errorf("解析学校地址失败: %w", err)
+	}
+	targetAPIURL, _ := url.Parse("https://api.campushoy.com")
+	for name, value := range presetCookies {
+		c := &http.Cookie{Name: name, Value: value}
+		if jar := client.GetClient().Jar; jar != nil {
+			jar.SetCookies(targetSchoolURL, []*http.Cookie{c})
+			if targetAPIURL != nil {
+				jar.SetCookies(targetAPIURL, []*http.Cookie{c})
+			}
+		}
+	}
 
 	ampCookieMap := map[string]any{
 		"AMP2": []map[string]any{

backed/internal/service/cpdaily/sms_login_test.go

@@ -0,0 +1,78 @@
+package cpdaily
+
+import (
+	"context"
+	"net/http"
+	"net/http/httptest"
+	"strings"
+	"testing"
+)
+
+// 复刻学校网关行为：未携带有效 CASTGC 时，getImUserToken 会 302 到 CAS 登录页；
+// 携带 CASTGC 时，CAS 登录页换发一次性 ST 并回调原 service（下发 MOD_AUTH_CAS）。
+// 用于验证 RefreshCasCookie 是否（1）把长期凭证 CASTGC 预置进客户端、（2）跟随重定向。
+func newRefreshMockServer(t *testing.T) *httptest.Server {
+	t.Helper()
+	const validTGT = "iap-test-TGT-abc"
+	return httptest.NewServer(http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
+		switch {
+		// CAS 登录入口：带有效 TGT 则换发 ST 回调 service；否则踢回登录页
+		case r.URL.Path == "/iap/login":
+			service := r.URL.Query().Get("service")
+			if c, err := r.Cookie("CASTGC"); err == nil && c.Value == validTGT {
+				w.Header().Set("Location", service+"?ticket=ST-iap:test:ST:x:20260101120000")
+				w.WriteHeader(http.StatusFound)
+				return
+			}
+			w.Header().Set("Location", "/iap/login/pc.html")
+			w.WriteHeader(http.StatusFound)
+		// service 回调：带 ticket 时下发 MOD_AUTH_CAS（模拟 CAS 建立会话）
+		case r.URL.Path == "/wec-im-group/group/imUserToken/getImUserToken":
+			if strings.HasPrefix(r.URL.Query().Get("ticket"), "ST-iap:") {
+				http.SetCookie(w, &http.Cookie{Name: "MOD_AUTH_CAS", Value: r.URL.Query().Get("ticket"), Path: "/"})
+				w.Header().Set("Content-Type", "application/json")
+				_, _ = w.Write([]byte(`{"errCode":0,"errMsg":"","data":{}}`))
+				return
+			}
+			// 无有效会话：302 到 CAS 登录入口
+			w.Header().Set("Location", "/iap/login?service="+r.URL.Path)
+			w.WriteHeader(http.StatusFound)
+		default:
+			w.WriteHeader(http.StatusNotFound)
+		}
+	}))
+}
+
+// 携带 CASTGC 时应能续期成功并拿回 MOD_AUTH_CAS。
+// 修复前 RefreshCasCookie 未预置 CASTGC，会落到登录页、解析 HTML 失败。
+func TestRefreshCasCookiePresetsCASTGC(t *testing.T) {
+	srv := newRefreshMockServer(t)
+	defer srv.Close()
+
+	cookies, err := RefreshCasCookie(context.Background(), map[string]string{
+		"sessionToken": "st-test",
+		"tenantId":     "lzufe",
+		"CASTGC":       "iap-test-TGT-abc",
+	}, srv.URL, "device-1")
+	if err != nil {
+		t.Fatalf("续期应成功，实际报错: %v", err)
+	}
+	hasMOD := false
+	for _, c := range cookies {
+		if c.Name == "MOD_AUTH_CAS" {
+			hasMOD = true
+		}
+	}
+	if !hasMOD {
+		t.Fatalf("续期后应取得 MOD_AUTH_CAS，实际 cookies: %+v", cookies)
+	}
+}
+
+// 缺少 sessionToken 时保持既有保护：直接报错，不发请求。
+func TestRefreshCasCookieRequiresSessionToken(t *testing.T) {
+	if _, err := RefreshCasCookie(context.Background(), map[string]string{
+		"CASTGC": "iap-test-TGT-abc",
+	}, "https://school.campusphere.net", "device-1"); err == nil {
+		t.Fatal("缺少 sessionToken 应报错")
+	}
+}

backed/internal/service/cpdaily/task.go

@@ -29,6 +29,8 @@ const (
 	TaskTypeLeave      TaskType = "leave" // 销假（请假销假）图片上传使用
 	// TaskTypeReturnRegister 节假日离返校的返校登记（确认到达）
 	TaskTypeReturnRegister TaskType = "return_register"
+	// TaskTypeWorklog 教师端「工作日志」（独立套件 wec-counselor-worklog-apps，仅教师账号可用）
+	TaskTypeWorklog TaskType = "worklog"
 )
 
 // 各任务类型的 API 基础路径
@@ -243,26 +245,26 @@ func parseTasksFromDatas(datas map[string]interface{}) []TodayTaskInfo {
 	return tasks
 }
 
-// FetchAllRecentTasks 并发查询 sign + sleep_check 两种签到类任务；
-// 若启用返校登记（GetReturnRegisterTasks 提供），额外聚合其待办。去重后返回。
-// 若签到/查寝两类查询都失败则返回错误（供上层识别登录态失效并续期重试）；
-// 只要有一类成功就返回结果（另一类失败仅记录日志）。
+// FetchAllRecentTasks 聚合各打卡套件的待办：签到(sign) + 查寝(sleep_check) +
+// 返校登记(return_register) + 教师端工作日志(worklog)，去重后返回。
+//
+// 会话失效判定（重要）：教师账号在学生端套件（sign/sleep_check/return_register）本无权限，
+// 调用会被网关拒绝；若只以签到/查寝是否成功来判断会话有效性，教师账号会被误判为
+// 「登录凭证已过期」。故只要**任一**套件成功返回，即认为会话有效；仅当全部套件都失败
+// 且首个错误表明登录态失效时才返回错误。
 func FetchAllRecentTasks(cookieMap map[string]string, host string) ([]TodayTaskInfo, error) {
 	type result struct {
 		tasks []TodayTaskInfo
 		err   error
 	}
-	ch := make(chan result, 2)
-
 	types := []TaskType{TaskTypeSign, TaskTypeSleepCheck}
+	ch := make(chan result, len(types))
 	for _, tt := range types {
 		go func(t TaskType) {
 			tasks, err := FetchTodayTasks(cookieMap, host, t)
 			if err != nil {
-				// 记录失败原因，避免签到/查寝某一类型静默失败（如接口错误、cookie 过期等）
 				slog.Warn("获取近期任务失败", "taskType", t, "host", host, "error", err)
 			}
-			// 标记任务类型
 			for i := range tasks {
 				tasks[i].TaskType = string(t)
 			}
@@ -273,49 +275,59 @@ func FetchAllRecentTasks(cookieMap map[string]string, host string) ([]TodayTaskI
 	seen := map[string]bool{}
 	var all []TodayTaskInfo
 	var firstErr error
-	successCount := 0
-
-	for i := 0; i < 2; i++ {
+	signSuccess := 0
+	for i := 0; i < len(types); i++ {
 		r := <-ch
 		if r.err != nil {
 			if firstErr == nil {
 				firstErr = r.err
 			}
 		} else {
-			successCount++
-		}
-		for _, t := range r.tasks {
-			key := t.TaskName + "|" + t.TaskType
-			if !seen[key] {
-				seen[key] = true
-				all = append(all, t)
-			}
+			signSuccess++
 		}
+		appendUnique(&all, seen, r.tasks)
 	}
 
-	// 两类都失败：返回错误（cookie 失效等场景由上层续期重试）
-	if successCount == 0 && firstErr != nil {
-		return nil, firstErr
-	}
-
-	// 返校登记待办（节假日离返校应用；接口失败不影响签到类任务）
+	// 返校登记：成功也作为「会话有效」的证据（教师/学生均可能开通）
+	rrSuccess := false
 	if rr, rerr := FetchReturnRegisterTasks(cookieMap, host); rerr == nil {
-		for _, t := range rr {
-			key := t.TaskName + "|" + t.TaskType
-			if !seen[key] {
-				seen[key] = true
-				all = append(all, t)
-			}
-		}
+		rrSuccess = true
+		appendUnique(&all, seen, rr)
 	} else {
 		slog.Warn("获取返校登记待办失败", "host", host, "error", rerr)
 	}
 
-	if len(all) == 0 {
-		return []TodayTaskInfo{}, nil
+	// 工作日志（教师端）：成功同样作为会话有效证据
+	wlSuccess := false
+	if wl, werr := FetchWorklogTasks(cookieMap, host); werr == nil {
+		wlSuccess = true
+		appendUnique(&all, seen, wl)
+	} else if isWorklogForbidden(werr) {
+		slog.Debug("该账号无工作日志权限（正常现象）", "host", host)
+	} else if isWorklogUnauthorized(werr) {
+		slog.Debug("工作日志接口未授权（非教师账号）", "host", host)
+	} else {
+		slog.Warn("获取工作日志任务失败", "host", host, "error", werr)
+	}
+
+	// 会话有效：任一学生端套件成功，或返校登记/工作日志成功
+	if signSuccess == 0 && !rrSuccess && !wlSuccess && firstErr != nil {
+		return nil, firstErr
 	}
 	return all, nil
 }
+
+// appendUnique 按 "TaskName|TaskType" 去重追加
+func appendUnique(dst *[]TodayTaskInfo, seen map[string]bool, items []TodayTaskInfo) {
+	for _, t := range items {
+		key := t.TaskName + "|" + t.TaskType
+		if !seen[key] {
+			seen[key] = true
+			*dst = append(*dst, t)
+		}
+	}
+}
+
 func fetchTasksByYearMonth(cookieMap map[string]string, host string, taskType TaskType, year, month string) ([]TodayTaskInfo, error) {
 	yearMonth := fmt.Sprintf("%s-%s", year, month)
 	return fetchTasksByEndpoint(cookieMap, host, taskType, yearMonth)
@@ -403,8 +415,11 @@ func GetTaskDetailByWid(cookieMap map[string]string, host string, taskType TaskT
 	return fetchTaskDetailByWid(cookieMap, host, taskType, signWid, signInstanceWid, title)
 }
 
-// FetchTodayTaskDetail 任务执行专用：按任务名从当天列表实时匹配未签到的实例并拉取详情。
+// FetchTodayTaskDetail 任务执行专用：按任务名从当天列表实时匹配任务实例并拉取详情。
 // wid 每次执行时自动获取，不依赖配置快照；匹配失败直接报明确错误，不做任何回退。
+// 匹配优先级：优先未签到实例（正常签到）；若无未签到实例但存在已签到实例，则用已签到实例
+// 重新提交（允许重签，便于用户在首次位置填错、或需范围外重签时再次执行；是否真正接受
+// 由今日校园服务端决定）。
 func FetchTodayTaskDetail(cookieMap map[string]string, host string, taskType TaskType, title string) (*TaskFormDetail, error) {
 	tasks, err := fetchTasksByEndpoint(cookieMap, host, taskType, "")
 	if err != nil {
@@ -425,14 +440,22 @@ func FetchTodayTaskDetail(cookieMap map[string]string, host string, taskType Tas
 			signed = &s
 		}
 	}
+	// 无未签到实例但有已签到实例：放开重签，用已签到实例继续提交
+	resign := false
 	if target == nil {
-		if signed != nil {
-			return nil, fmt.Errorf("「%s」今日已签到，无需重复执行", title)
+		if signed == nil {
+			return nil, fmt.Errorf("当日任务列表中未找到「%s」", title)
 		}
-		return nil, fmt.Errorf("当日任务列表中未找到「%s」", title)
+		target = signed
+		resign = true
+	}
+	if resign {
+		slog.Info("无未签到实例，允许对已签到实例重新提交",
+			"title", title, "signInstanceWid", target.SignInstanceWid, "taskType", taskType)
+	} else {
+		slog.Info("按任务名实时匹配到当日任务实例",
+			"title", title, "signInstanceWid", target.SignInstanceWid, "taskType", taskType)
 	}
-	slog.Info("按任务名实时匹配到当日任务实例",
-		"title", title, "signInstanceWid", target.SignInstanceWid, "taskType", taskType)
 	detail, err := fetchTaskDetailByWid(cookieMap, host, taskType, target.SignWid, target.SignInstanceWid, target.TaskName)
 	if err != nil {
 		return nil, err

backed/internal/service/cpdaily/task_agg_test.go

@@ -0,0 +1,22 @@
+package cpdaily
+
+import "testing"
+
+// appendUnique 去重：同名同类型只保留一次，不同类型同名分别保留
+func TestAppendUnique(t *testing.T) {
+	seen := map[string]bool{}
+	var dst []TodayTaskInfo
+	appendUnique(&dst, seen, []TodayTaskInfo{
+		{TaskName: "学管值班", TaskType: "worklog"},
+		{TaskName: "学管值班", TaskType: "worklog"}, // 重复
+		{TaskName: "晚查寝", TaskType: "sleep_check"},
+	})
+	if len(dst) != 2 {
+		t.Fatalf("应保留 2 条，得到 %d: %+v", len(dst), dst)
+	}
+	// 同名不同类型应共存
+	appendUnique(&dst, seen, []TodayTaskInfo{{TaskName: "学管值班", TaskType: "sign"}})
+	if len(dst) != 3 {
+		t.Fatalf("同名不同类型应共存，得到 %d", len(dst))
+	}
+}

backed/internal/service/cpdaily/worklog.go

@@ -0,0 +1,407 @@
+package cpdaily
+
+import (
+	"encoding/json"
+	"fmt"
+	"log/slog"
+	"strconv"
+	"strings"
+)
+
+// 教师端「工作日志」套件（wec-counselor-worklog-apps）。
+//
+// 学生端签到/查寝同域名同会话，但服务端按角色校验：学生账号调用返回 401，仅教师账号可用。
+// 字段结构已用教师账号实测校正（原照第三方 Python 推断的字段名与实际不符）。
+//
+// 流程：
+//  1. listActiveTemplate 取模板（两级：分组 row + templateVoList 子模板，提交用子模板 wid）；
+//  2. list(formWid=子模板wid) 取该模板下的日志单（status=0 未提交），行内含 subjects 字段；
+//  3. detail(wid=单wid) 取完整字段定义（wid/colName/fieldType/isRequired/fieldItems/value）；
+//  4. 回填 value（单选用 fieldItems 的 contendExtend/wid），定位签到项走 sign/submitSign；
+//  5. update(operationType=1) 提交。
+const worklogAPIBase = "/wec-counselor-worklog-apps"
+
+// WorklogSubTemplate 子模板（真正用于建单/查询的 formWid）
+type WorklogSubTemplate struct {
+	Wid          int64  `json:"wid"`
+	TemplateName string `json:"templateName"`
+}
+
+// WorklogTemplateGroup 模板分组（listActiveTemplate 的行）
+type WorklogTemplateGroup struct {
+	Wid            int64                `json:"wid"`
+	TemplateName   string               `json:"templateName"`
+	TemplateVoList []WorklogSubTemplate `json:"templateVoList"`
+}
+
+// WorklogOption 单选项
+type WorklogOption struct {
+	Wid           int64    `json:"wid"`
+	FieldWid      int64    `json:"fieldWid"`
+	Content       string   `json:"content"`
+	ContendExtend string   `json:"contendExtend"`
+	IsOtherItems  FlexBool `json:"isOtherItems"`
+}
+
+// FlexBool 兼容 JSON 的 true/false 与 0/1（含字符串形式）。
+// detail 返回 isOtherItems 为数字，template/detail 返回布尔，统一兼容避免整体解析失败。
+type FlexBool bool
+
+func (b *FlexBool) UnmarshalJSON(data []byte) error {
+	s := strings.Trim(strings.TrimSpace(string(data)), `"`)
+	switch s {
+	case "true", "1":
+		*b = true
+	default:
+		*b = false
+	}
+	return nil
+}
+
+// WorklogField 工作日志字段（detail.form / template detail.content 元素）
+type WorklogField struct {
+	Wid            int64                    `json:"wid"` // 字段标识（提交用）
+	FormWid        int64                    `json:"formWid"`
+	ColName        string                   `json:"colName"`
+	Title          string                   `json:"title"`
+	FieldType      int                      `json:"fieldType"` // 1文本 2单选 5/7时间日期 9多行
+	Value          string                   `json:"value"`
+	IsRequired     bool                     `json:"isRequired"`
+	SignCondition  bool                     `json:"signCondition"`  // true=签到项（需走 submitSign）
+	SignScopeWids  string                   `json:"signScopeWids"`  // 允许签到的范围点位 id（非坐标）
+	TemplateScopes []map[string]interface{} `json:"templateScopes"` // 签到范围点
+	FieldItems     []WorklogOption          `json:"fieldItems"`
+	Sort           int                      `json:"sort"`
+
+	// raw 保留服务器返回的完整字段对象（含未建模字段）。
+	// 提交时按官方前端做法把整个对象回传、仅覆盖 value，避免模型字段不全导致丢字段。
+	raw map[string]interface{}
+}
+
+// UnmarshalJSON 解析已知字段的同时保留完整原始对象
+func (f *WorklogField) UnmarshalJSON(data []byte) error {
+	type alias WorklogField
+	var a alias
+	if err := json.Unmarshal(data, &a); err != nil {
+		return err
+	}
+	*f = WorklogField(a)
+	var m map[string]interface{}
+	if err := json.Unmarshal(data, &m); err == nil {
+		f.raw = m
+	}
+	return nil
+}
+
+// RawObject 返回字段完整原始对象副本（无原始数据时 nil）
+func (f *WorklogField) RawObject() map[string]interface{} {
+	if f.raw == nil {
+		return nil
+	}
+	out := make(map[string]interface{}, len(f.raw))
+	for k, v := range f.raw {
+		out[k] = v
+	}
+	return out
+}
+
+// WorklogItem 工作日志单（list 行）
+type WorklogItem struct {
+	Wid        int64          `json:"wid"`
+	Status     int            `json:"status"` // 0=未提交
+	CreateTime string         `json:"createTime"`
+	Subjects   []WorklogField `json:"subjects"` // 列表里已带字段骨架
+}
+
+// worklogResultErr 解析 {code,message,datas} 通用响应
+func worklogResultErr(body []byte, action string, out interface{}) error {
+	var envelope struct {
+		Code    string          `json:"code"`
+		Message string          `json:"message"`
+		Datas   json.RawMessage `json:"datas"`
+	}
+	if err := unmarshalBody(body, &envelope); err != nil {
+		return fmt.Errorf("解析%s响应失败: %w (body: %.200s)", action, err, string(body))
+	}
+	if envelope.Code != "" && envelope.Code != "0" {
+		msg := strings.TrimSpace(envelope.Message)
+		if msg == "" {
+			msg = "未知错误"
+		}
+		return fmt.Errorf("%s", msg)
+	}
+	if out != nil && len(envelope.Datas) > 0 {
+		if err := json.Unmarshal(envelope.Datas, out); err != nil {
+			return fmt.Errorf("解析%s数据失败: %w", action, err)
+		}
+	}
+	return nil
+}
+
+// isWorklogForbidden 明确权限拒绝（仅文案）
+func isWorklogForbidden(err error) bool {
+	if err == nil {
+		return false
+	}
+	msg := err.Error()
+	return strings.Contains(msg, "无权") || strings.Contains(msg, "没有权限")
+}
+
+// isWorklogUnauthorized 网关 401（学生账号正常现象）
+func isWorklogUnauthorized(err error) bool {
+	if err == nil {
+		return false
+	}
+	return strings.Contains(err.Error(), "401")
+}
+
+// FetchWorklogTemplates 取模板（返回展开后的子模板列表：wid + 名称）
+func FetchWorklogTemplates(cookieMap map[string]string, host string) ([]WorklogSubTemplate, error) {
+	body, err := leavePost(cookieMap, host+worklogAPIBase+"/worklog/template/listActiveTemplate", map[string]interface{}{
+		"pageNumber": "1", "pageSize": "9999999", "status": "1",
+	}, "")
+	if err != nil {
+		return nil, fmt.Errorf("获取工作日志模板失败: %w", err)
+	}
+	var datas struct {
+		Rows []WorklogTemplateGroup `json:"rows"`
+	}
+	if err := worklogResultErr(body, "工作日志模板", &datas); err != nil {
+		return nil, err
+	}
+	var out []WorklogSubTemplate
+	for _, g := range datas.Rows {
+		for _, sub := range g.TemplateVoList {
+			if sub.Wid == 0 {
+				continue
+			}
+			out = append(out, sub)
+		}
+	}
+	return out, nil
+}
+
+// FetchWorklogItems 取模板下的日志单（status==0 为未提交）
+func FetchWorklogItems(cookieMap map[string]string, host string, formWid int64) ([]WorklogItem, error) {
+	body, err := leavePost(cookieMap, host+worklogAPIBase+"/worklog/list", map[string]interface{}{
+		"formWid": strconv.FormatInt(formWid, 10), "pageNumber": "1", "pageSize": "9999999",
+	}, "")
+	if err != nil {
+		return nil, fmt.Errorf("获取工作日志列表失败: %w", err)
+	}
+	var datas struct {
+		Rows []WorklogItem `json:"rows"`
+	}
+	if err := worklogResultErr(body, "工作日志列表", &datas); err != nil {
+		return nil, err
+	}
+	return datas.Rows, nil
+}
+
+// FetchWorklogDetail 取日志单完整字段（提交用）
+func FetchWorklogDetail(cookieMap map[string]string, host string, wid int64) ([]WorklogField, error) {
+	body, err := leavePost(cookieMap, host+worklogAPIBase+"/worklog/detail", map[string]interface{}{
+		"wid": strconv.FormatInt(wid, 10),
+	}, "")
+	if err != nil {
+		return nil, fmt.Errorf("获取工作日志详情失败: %w", err)
+	}
+	var datas struct {
+		Form []WorklogField `json:"form"`
+	}
+	if err := worklogResultErr(body, "工作日志详情", &datas); err != nil {
+		return nil, err
+	}
+	return datas.Form, nil
+}
+
+// SubmitWorklogSign 定位签到项提交
+func SubmitWorklogSign(cookieMap map[string]string, host string, fieldWid int64, worklogWid int64, signPlace, longitude, latitude string) error {
+	body, err := leavePost(cookieMap, host+worklogAPIBase+"/worklog/sign/submitSign", map[string]interface{}{
+		"fieldWid":   fieldWid,
+		"worklogWid": worklogWid,
+		"signPlace":  signPlace,
+		"longitude":  longitude,
+		"latitude":   latitude,
+	}, "")
+	if err != nil {
+		return fmt.Errorf("工作日志定位签到失败: %w", err)
+	}
+	var envelope struct {
+		Message string `json:"message"`
+	}
+	if err := unmarshalBody(body, &envelope); err != nil {
+		return fmt.Errorf("解析定位签到响应失败: %w", err)
+	}
+	if envelope.Message != "SUCCESS" {
+		msg := strings.TrimSpace(envelope.Message)
+		if msg == "" {
+			msg = "定位信息提交失败"
+		}
+		return fmt.Errorf("%s", msg)
+	}
+	return nil
+}
+
+// SubmitWorklog 提交工作日志（operationType=1，form 为回填后的字段列表）
+func SubmitWorklog(cookieMap map[string]string, host string, formWid, wid int64, form []WorklogField) error {
+	// 优先回传字段的完整原始对象（仅覆盖 value），与官方前端一致；
+	// 缺原始对象的字段退化为最小结构 {wid,value}。
+	formOut := make([]map[string]interface{}, 0, len(form))
+	for i := range form {
+		if raw := form[i].RawObject(); raw != nil {
+			raw["value"] = form[i].Value
+			formOut = append(formOut, raw)
+		} else {
+			formOut = append(formOut, map[string]interface{}{"wid": form[i].Wid, "value": form[i].Value})
+		}
+	}
+	body, err := leavePost(cookieMap, host+worklogAPIBase+"/worklog/update", map[string]interface{}{
+		"formWid":       formWid,
+		"wid":           wid,
+		"form":          formOut,
+		"operationType": 1,
+	}, "")
+	if err != nil {
+		return fmt.Errorf("提交工作日志失败: %w", err)
+	}
+	var envelope struct {
+		Code    string `json:"code"`
+		Message string `json:"message"`
+	}
+	if err := unmarshalBody(body, &envelope); err != nil {
+		return fmt.Errorf("解析工作日志提交响应失败: %w (body: %.200s)", err, string(body))
+	}
+	slog.Info("worklog/update 响应", "code", envelope.Code, "message", envelope.Message)
+	if envelope.Code != "" && envelope.Code != "0" {
+		msg := strings.TrimSpace(envelope.Message)
+		if msg == "" {
+			msg = "提交失败"
+		}
+		return fmt.Errorf("%s", msg)
+	}
+	return nil
+}
+
+// WorklogSignWidOf 组合标识 "formWid:wid"
+func WorklogSignWidOf(formWid, wid int64) string {
+	return strconv.FormatInt(formWid, 10) + ":" + strconv.FormatInt(wid, 10)
+}
+
+// ParseWorklogSignWid 解析 "formWid:wid"
+func ParseWorklogSignWid(signWid string) (int64, int64, error) {
+	parts := strings.SplitN(strings.TrimSpace(signWid), ":", 2)
+	if len(parts) != 2 {
+		return 0, 0, fmt.Errorf("工作日志标识格式错误: %q", signWid)
+	}
+	f, err1 := strconv.ParseInt(parts[0], 10, 64)
+	w, err2 := strconv.ParseInt(parts[1], 10, 64)
+	if err1 != nil || err2 != nil {
+		return 0, 0, fmt.Errorf("工作日志标识解析失败: %q", signWid)
+	}
+	return f, w, nil
+}
+
+// FetchWorklogTasks 工作日志未提交单 → 统一任务项（TaskName=模板名，SignWid="formWid:wid"）
+func FetchWorklogTasks(cookieMap map[string]string, host string) ([]TodayTaskInfo, error) {
+	templates, err := FetchWorklogTemplates(cookieMap, host)
+	if err != nil {
+		return nil, err
+	}
+	var out []TodayTaskInfo
+	for _, tpl := range templates {
+		items, ierr := FetchWorklogItems(cookieMap, host, tpl.Wid)
+		if ierr != nil {
+			slog.Warn("获取工作日志列表失败，跳过该模板", "formWid", tpl.Wid, "error", ierr)
+			continue
+		}
+		for _, it := range items {
+			if it.Status != 0 {
+				continue
+			}
+			out = append(out, TodayTaskInfo{
+				TaskName: tpl.TemplateName,
+				SignWid:  WorklogSignWidOf(tpl.Wid, it.Wid),
+				IsSigned: false,
+				TaskType: string(TaskTypeWorklog),
+			})
+		}
+	}
+	return out, nil
+}
+
+// WorklogFieldsToFormItems 工作日志字段 → 通用表单项（供打卡页复用表单渲染）。
+// fieldType 映射：1/9=文本(textarea 由前端按多行)、2=单选、5/7=时间/日期、其余按文本。
+// 定位签到项（signScopeWids 非空）标记 type=7 并附 signScope 标记，前端渲染签到入口。
+func WorklogFieldsToFormItems(fields []WorklogField) []map[string]interface{} {
+	out := make([]map[string]interface{}, 0, len(fields))
+	for _, f := range fields {
+		item := map[string]interface{}{
+			"title":    f.Title,
+			"colName":  strconv.FormatInt(f.Wid, 10), // 提交按字段 wid 回填
+			"type":     f.FieldType,
+			"content":  f.Value,
+			"required": f.IsRequired,
+			"show":     true,
+		}
+		if len(f.FieldItems) > 0 {
+			opts := make([]map[string]interface{}, 0, len(f.FieldItems))
+			for _, o := range f.FieldItems {
+				opts = append(opts, map[string]interface{}{"content": o.Content, "isOtherItems": bool(o.IsOtherItems)})
+			}
+			item["options"] = opts
+		}
+		// 签到项（signCondition=true）：需在编辑时提供定位，执行时由后端调 submitSign 提交定位。
+		// signScopeWids 是允许签到的范围点位 id（非坐标），一并透传供前端展示。
+		if f.SignCondition {
+			item["isWorklogSign"] = true
+			item["signScopeWids"] = f.SignScopeWids
+			// 透传签到范围点（地址/经纬度/半径），供前端展示与"是否在范围内"提示
+			scopes := make([]map[string]interface{}, 0, len(f.TemplateScopes))
+			for _, sc := range f.TemplateScopes {
+				scopes = append(scopes, map[string]interface{}{
+					"address":   mapValueStr(sc, "address"),
+					"latitude":  mapValueStr(sc, "latitude"),
+					"longitude": mapValueStr(sc, "longitude"),
+					"radius":    sc["radius"],
+				})
+			}
+			item["signScopes"] = scopes
+		}
+		out = append(out, item)
+	}
+	return out
+}
+
+// WorklogScopePoints 把签到字段的 templateScopes 解析为与查寝一致的 SignPlace 列表
+// （字段键名实测一致：address/latitude/longitude/radius），从而可复用 coordsWithinSignRange。
+func WorklogScopePoints(f WorklogField) []SignPlace {
+	places := make([]SignPlace, 0, len(f.TemplateScopes))
+	for _, m := range f.TemplateScopes {
+		lat := mapValueStr(m, "latitude")
+		lon := mapValueStr(m, "longitude")
+		radius := 0.0
+		if r, ok := m["radius"]; ok && r != nil {
+			radius, _ = strconv.ParseFloat(fmt.Sprintf("%v", r), 64)
+		}
+		latF, e1 := strconv.ParseFloat(lat, 64)
+		lonF, e2 := strconv.ParseFloat(lon, 64)
+		if e1 != nil || e2 != nil || radius <= 0 {
+			continue
+		}
+		places = append(places, SignPlace{
+			Address:      mapValueStr(m, "address"),
+			Longitude:    lon,
+			Latitude:     lat,
+			LongitudeF:   lonF,
+			LatitudeF:    latF,
+			RadiusMeters: radius,
+		})
+	}
+	return places
+}
+
+// WorklogWithinRange 判断坐标是否落在该签到字段的任一范围内（无范围点则视为通过）
+func WorklogWithinRange(f WorklogField, lat, lon string) bool {
+	return coordsWithinSignRange(lat, lon, WorklogScopePoints(f))
+}

backed/internal/service/cpdaily/worklog_test.go

@@ -0,0 +1,83 @@
+package cpdaily
+
+import (
+	"encoding/json"
+	"testing"
+)
+
+// 工作日志：响应解析与字段契约（结构按教师账号实测校正）。
+
+func TestWorklogResultErr(t *testing.T) {
+	if err := worklogResultErr([]byte(`{"code":"401","message":"您无权获取工作日志列表"}`), "模板", nil); err == nil || err.Error() != "您无权获取工作日志列表" {
+		t.Fatalf("应透传错误文案，得到 %v", err)
+	}
+	if err := worklogResultErr([]byte(`{"code":"500"}`), "列表", nil); err == nil || err.Error() != "未知错误" {
+		t.Fatalf("空 message 应回退，得到 %v", err)
+	}
+	if err := worklogResultErr([]byte(`<html>waf</html>`), "详情", nil); err == nil {
+		t.Fatal("非 JSON 应报错")
+	}
+}
+
+// 模板两级结构：真正可用的是 templateVoList[].wid
+func TestWorklogTemplateGroupParse(t *testing.T) {
+	body := []byte(`{"code":"0","datas":{"rows":[{"wid":200011199,"templateName":"学管值班","templateVoList":[{"wid":26,"templateName":"学管值班"},{"wid":3,"templateName":"谈心谈话记录"}]},{"wid":200011041,"templateName":"未分类","templateVoList":[]}]}}`)
+	var datas struct {
+		Rows []WorklogTemplateGroup `json:"rows"`
+	}
+	if err := worklogResultErr(body, "模板", &datas); err != nil {
+		t.Fatalf("解析失败: %v", err)
+	}
+	if len(datas.Rows) != 2 {
+		t.Fatalf("应 2 个分组，得到 %d", len(datas.Rows))
+	}
+	if datas.Rows[0].TemplateVoList[0].Wid != 26 {
+		t.Fatalf("子模板 wid 应为 26，得到 %d", datas.Rows[0].TemplateVoList[0].Wid)
+	}
+}
+
+// 字段契约：wid(数字)/colName/fieldType/isRequired/fieldItems/value
+func TestWorklogFieldParse(t *testing.T) {
+	raw := `[{"wid":428,"formWid":26,"fieldType":7,"colName":"field001","title":"值班时间","isRequired":true,"signScopeWids":"","value":""},
+	         {"wid":425,"formWid":26,"fieldType":2,"colName":"field002","title":"值班校区","isRequired":true,"fieldItems":[{"wid":91,"content":"唐槐校区"}],"value":""}]`
+	var fields []WorklogField
+	if err := json.Unmarshal([]byte(raw), &fields); err != nil {
+		t.Fatalf("解析失败: %v", err)
+	}
+	if fields[0].Wid != 428 || fields[0].ColName != "field001" || !fields[0].IsRequired {
+		t.Fatalf("字段解析异常: %+v", fields[0])
+	}
+	if len(fields[1].FieldItems) != 1 || fields[1].FieldItems[0].Content != "唐槐校区" {
+		t.Fatalf("单选项解析异常: %+v", fields[1].FieldItems)
+	}
+}
+
+// 提交：form 按真实字段序列化（wid/value 字段名与接口一致）
+func TestWorklogSubmitFormSerialization(t *testing.T) {
+	form := []WorklogField{{Wid: 428, FormWid: 26, ColName: "field001", FieldType: 7, Value: "2026-10-06 21:30", IsRequired: true}}
+	payload := map[string]interface{}{"formWid": int64(26), "wid": int64(2234), "form": form, "operationType": 1}
+	b, err := json.Marshal(payload)
+	if err != nil {
+		t.Fatalf("序列化失败: %v", err)
+	}
+	var back map[string]interface{}
+	json.Unmarshal(b, &back)
+	if back["operationType"].(float64) != 1 {
+		t.Fatal("operationType 应为 1")
+	}
+	first := back["form"].([]interface{})[0].(map[string]interface{})
+	if first["wid"].(float64) != 428 || first["value"] != "2026-10-06 21:30" {
+		t.Fatalf("提交字段形状异常: %v", first)
+	}
+}
+
+func TestWorklogSignWidRoundTrip(t *testing.T) {
+	str := WorklogSignWidOf(26, 2234)
+	f, w, err := ParseWorklogSignWid(str)
+	if err != nil || f != 26 || w != 2234 {
+		t.Fatalf("往返失败: %q -> %d,%d err=%v", str, f, w, err)
+	}
+	if _, _, err := ParseWorklogSignWid("bad"); err == nil {
+		t.Fatal("非法标识应报错")
+	}
+}

frondend/index.html

@@ -4,7 +4,7 @@
     <meta charset="UTF-8" />
     <link rel="icon" type="image/svg+xml" href="/vite.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover" />
-    <meta name="theme-color" content="#f5f5f5" />
+    <meta name="theme-color" content="#f3faf7" />
     <title>小助手</title>
     <script>
       // 老内核（Chrome 78~92，即微信 XWEB / 国产浏览器）缺失的 ES2022 运行时 API 补齐。
@@ -29,13 +29,15 @@
       })()
     </script>
     <script>
-      // 暗色主题防闪烁：与 composables/useTheme.ts 保持同一时间规则
-      // （18:00–次日 06:00 暗色），在首屏渲染前预设 html.dark 与状态栏色
+      // 暗色主题防闪烁：与 composables/useTheme.ts 保持同一规则
+      // （用户选择 light/dark 优先；auto 时 18:00–次日 06:00 暗色），在首屏渲染前预设 html.dark 与状态栏色
       ;(function () {
+        var mode = 'auto'
+        try { mode = localStorage.getItem('xz_theme') || 'auto' } catch (e) {}
         var h = new Date().getHours()
-        if (h >= 18 || h < 6) {
+        if (mode === 'dark' || (mode !== 'light' && (h >= 18 || h < 6))) {
           document.documentElement.classList.add('dark')
-          document.querySelector('meta[name="theme-color"]').setAttribute('content', '#15151f')
+          document.querySelector('meta[name="theme-color"]').setAttribute('content', '#0f1815')
         }
       })()
     </script>

frondend/scripts/postbuild-css.mjs

@@ -27,7 +27,106 @@ const TARGETS = {
   android: 78 << 16,
 }
 
-/** 解包 :where(...) → 内部选择器（老内核不支持 :where，会整条丢弃规则） */
+/** 按顶层逗号拆分（忽略括号/方括号内的逗号） */
+function splitTopLevel(s) {
+  const parts = []
+  let depth = 0
+  let start = 0
+  for (let k = 0; k < s.length; k++) {
+    const ch = s[k]
+    if (ch === '(' || ch === '[') depth++
+    else if (ch === ')' || ch === ']') depth--
+    else if (ch === ',' && depth === 0) {
+      parts.push(s.slice(start, k))
+      start = k + 1
+    }
+  }
+  parts.push(s.slice(start))
+  return parts.map((p) => p.trim())
+}
+
+/**
+ * 把 :where 的单个备选项 alt 合并回原选择器（before + :where(alt) + after）。
+ *  - alt 是单个复合选择器（如 `.dark`、`[type=button]`）：直接拼进同一复合选择器；
+ *  - alt 形如 `A *`（祖先 A 的任意后代，Tailwind dark 变体即 `.dark *`）：
+ *    语义为「元素满足 before/after，且有祖先满足 A」→ `A ` + before + after。
+ *    若 before 自身含组合符（祖先链），A 放在最前面；dark 变体的 `.dark` 在 <html> 上，
+ *    是所有元素的祖先，结果与原语义一致。
+ *  - 其他带组合符的形式无法在不支持 :is() 的老内核上等价表达 → 直接报错，绝不静默产出错误 CSS。
+ */
+function expandAlternative(before, alt, after, whole) {
+  const parts = alt.split(/\s+/).filter(Boolean)
+  if (parts.length === 1 && !/[>+~]/.test(alt)) return before + alt + after
+  if (parts.length === 2 && parts[1] === '*' && !/[>+~]/.test(parts[0])) {
+    // `before` 为空（规则本身就是 `:where(A *)`）时退化为 `A *`
+    const rest = before + after
+    return parts[0] + ' ' + (rest.trim() ? rest : '*')
+  }
+  throw new Error(`[postbuild-css] 无法安全展开的 :where 备选项「${alt}」（选择器：${whole}）`)
+}
+
+/**
+ * 展开选择器里「带逗号列表」的 :where(A, B)：
+ *   X:where(A, B)Y  →  XAY, XBY（含组合符的备选项见 expandAlternative）
+ * 直接去壳会得到 `XA, BY`：逗号把选择器拆开，后半段 B 变成一条独立的全局规则。
+ * 典型事故：dark 变体 `.dark\:bg-x:where(.dark, .dark *)` 去壳成
+ * `.dark\:bg-x.dark, .dark *` —— `.dark *` 命中暗色下所有元素，全站被刷成同一背景色。
+ * 只处理规则选择器（`{` 之前的部分），声明块内容原样保留。
+ */
+function expandWhereLists(css) {
+  return css.replace(/([^{}]+)\{/g, (whole, selectorList) => {
+    if (!selectorList.includes(':where(')) return whole
+    // 跳过 at-rule 前缀（如 @media (...) / @supports (...)），这些不是选择器
+    if (selectorList.trim().startsWith('@')) return whole
+    const expanded = []
+    for (const sel of splitTopLevel(selectorList)) {
+      let queue = [sel]
+      for (let guard = 0; guard < 8; guard++) {
+        let changed = false
+        const next = []
+        for (const s of queue) {
+          const m = s.indexOf(':where(')
+          if (m < 0) {
+            next.push(s)
+            continue
+          }
+          let depth = 0
+          let end = -1
+          for (let k = m + 6; k < s.length; k++) {
+            if (s[k] === '(') depth++
+            else if (s[k] === ')') {
+              depth--
+              if (depth === 0) {
+                end = k
+                break
+              }
+            }
+          }
+          if (end < 0) {
+            next.push(s)
+            continue
+          }
+          const inner = splitTopLevel(s.slice(m + 7, end))
+          if (inner.length < 2) {
+            next.push(s)
+            continue
+          }
+          changed = true
+          const before = s.slice(0, m)
+          const after = s.slice(end + 1)
+          for (const alt of inner) next.push(expandAlternative(before, alt, after, s))
+        }
+        queue = next
+        if (!changed) break
+      }
+      expanded.push(...queue)
+    }
+    return expanded.join(',') + '{'
+  })
+}
+
+/** 解包 :where(...) → 内部选择器（老内核不支持 :where，会整条丢弃规则）。
+ *  须先经 expandWhereLists 展开逗号列表，此处只剩单项 :where(A)，去壳即等价 */
 function unwrapWhere(css) {
   let out = ''
   let i = 0
@@ -122,8 +221,9 @@ for (const file of files) {
   const path = join(assetsDir, file)
   const src = await readFile(path)
 
-  // ① 解包 :where()（lightningcss 不会处理它，需先做）
-  let prepared = Buffer.from(unwrapWhere(src.toString('utf8')))
+  // ① 解包 :where()（lightningcss 不会处理它，需先做）：
+  //    先把 :where(A, B) 展开成多条选择器，再对剩余单项 :where(A) 去壳
+  let prepared = Buffer.from(unwrapWhere(expandWhereLists(src.toString('utf8'))))
   const whereCount = (src.toString('utf8').match(/:where\(/g) || []).length
 
   // ② 按目标内核降级（oklch 等新颜色函数 → 老内核可识别的色值）
@@ -142,6 +242,10 @@ for (const file of files) {
   if (/@layer/.test(out)) throw new Error(`[postbuild-css] ${file} 仍残留 @layer`)
   if (/oklch\(/.test(out)) throw new Error(`[postbuild-css] ${file} 仍残留 oklch(`)
   if (/:where\(/.test(out)) throw new Error(`[postbuild-css] ${file} 仍残留 :where(`)
+  // 暗色变体去壳错误的特征：出现一条以 `.dark *` 开头的独立全局规则（会把暗色下所有元素刷成同一样式）
+  if (/(^|[{},])\s*\.dark \*\s*\{/.test(out)) {
+    throw new Error(`[postbuild-css] ${file} 出现全局 \`.dark *\` 规则，:where 逗号列表展开失败`)
+  }
   assertBalanced(out, file)
 
   await writeFile(path, out)

frondend/src/App.vue

@@ -4,6 +4,7 @@ import { useRoute } from 'vue-router'
 import { useMessage } from '@/composables/useMessage'
 import UpdateChecker from '@/components/UpdateChecker.vue'
 import ConfirmHost from '@/components/ConfirmHost.vue'
+import { Check, X, Info } from 'lucide-vue-next'
 
 const route = useRoute()
 const { toasts, removeToast } = useMessage()
@@ -36,23 +37,37 @@ watch(
 
   <!-- Toast 容器 -->
   <Teleport to="body">
-    <div class="fixed top-4 right-4 z-[100] flex flex-col gap-2 max-w-sm">
+    <!-- 顶部居中胶囊 Toast（液态玻璃，iOS 风格灵动提示） -->
+    <div
+      class="fixed inset-x-0 top-0 z-[100] flex flex-col items-center gap-2 px-4 pointer-events-none"
+      style="padding-top: calc(var(--safe-top) + 12px)"
+      role="status"
+      aria-live="polite"
+    >
       <TransitionGroup name="toast">
         <div
           v-for="toast in toasts"
           :key="toast.id"
-          :class="[
-            'px-4 py-3 rounded-lg shadow-lg border text-sm flex items-center gap-2 transition-all',
-            toast.type === 'success' && 'bg-green-50 border-green-200 text-green-700',
-            toast.type === 'error' && 'bg-red-50 border-red-200 text-red-700',
-            toast.type === 'info' && 'bg-blue-50 border-blue-200 text-blue-700',
-          ]"
+          class="glass pointer-events-auto max-w-sm w-fit pl-3 pr-2.5 py-2.5 rounded-full text-sm font-medium text-gray-800 flex items-center gap-2 transition-all"
         >
-          <span class="flex-1">{{ toast.message }}</span>
+          <span
+            :class="[
+              'w-5 h-5 rounded-full flex items-center justify-center flex-shrink-0 text-white',
+              toast.type === 'success' && 'bg-green-500',
+              toast.type === 'error' && 'bg-red-500',
+              toast.type === 'info' && 'bg-brand-500',
+            ]"
+          >
+            <Check v-if="toast.type === 'success'" class="w-3.5 h-3.5" :stroke-width="3" />
+            <X v-else-if="toast.type === 'error'" class="w-3.5 h-3.5" :stroke-width="3" />
+            <Info v-else class="w-3.5 h-3.5" :stroke-width="3" />
+          </span>
+          <span class="flex-1 min-w-0 break-words">{{ toast.message }}</span>
           <button
-            class="text-current opacity-50 hover:opacity-100 text-lg leading-none"
+            class="w-6 h-6 rounded-full flex items-center justify-center text-gray-400 hover:text-gray-600 flex-shrink-0"
+            aria-label="关闭提示"
             @click="removeToast(toast.id)"
-          >&times;</button>
+          ><X class="w-3.5 h-3.5" /></button>
         </div>
       </TransitionGroup>
     </div>
@@ -61,17 +76,17 @@ watch(
 
 <style scoped>
 .toast-enter-active {
-  transition: all 0.3s ease-out;
+  transition: all 0.42s cubic-bezier(0.34, 1.36, 0.64, 1);
 }
 .toast-leave-active {
-  transition: all 0.2s ease-in;
+  transition: all 0.22s ease-in;
 }
 .toast-enter-from {
   opacity: 0;
-  transform: translateX(40px);
+  transform: translateY(-16px) scale(0.92);
 }
 .toast-leave-to {
   opacity: 0;
-  transform: translateX(40px);
+  transform: translateY(-10px) scale(0.96);
 }
 </style>

frondend/src/api/auth.ts

@@ -210,11 +210,19 @@ export function redeemCDK(code: string, captchaId: string, captchaCode: string)
   }>('/cdk/redeem', { code, captchaId, captchaCode })
 }
 
-/** 当前用户 VIP 信息（是否 VIP、到期时间、系统配置单价） */
+/** 当前用户 VIP 信息（是否 VIP、到期时间、系统配置单价；含「购买 CDK」入口配置） */
 export function getVipInfo() {
-  return api.get<{ data: { isVip: boolean; vipExpireAt: string; vipWeekPrice: string; vipMonthPrice: string; vipPrice: string } }>(
-    '/cdk/vip-info'
-  )
+  return api.get<{
+    data: {
+      isVip: boolean
+      vipExpireAt: string
+      vipWeekPrice: string
+      vipMonthPrice: string
+      vipPrice: string
+      cdkBuyUrl?: string
+      cdkBuyVisible?: boolean
+    }
+  }>('/cdk/vip-info')
 }
 
 // ======== 签到任务相关 ========
@@ -259,6 +267,12 @@ export interface FormItem {
   number?: number
   show: boolean
   tip?: string
+  /** 工作日志签到项（需获取当前位置，学校按点位半径校验） */
+  isWorklogSign?: boolean
+  /** 工作日志签到项允许的范围点位 id（展示用，非坐标） */
+  signScopeWids?: string
+  /** 工作日志签到项允许的签到范围点（地址/经纬度/半径） */
+  signScopes?: { address: string; latitude: string; longitude: string; radius?: number }[]
 }
 
 /** 获取所有可用的签到/查寝任务标题列表（后台并发聚合） */
@@ -372,11 +386,6 @@ export function deleteTaskLog(id: number) {
   return api.delete(`/task/logs/${id}`)
 }
 
-/** 获取/生成邀请码 */
-export function getMyInvite() {
-  return api.post<{ data: MyInviteInfo }>('/auth/generate-invite')
-}
-
 /** 查询邀请信息 */
 export function getMyInviteInfo() {
   return api.get<{ data: MyInviteInfo }>('/auth/my-invite')

frondend/src/api/index.ts

@@ -2,6 +2,8 @@ import axios from 'axios'
 
 // 自定义事件：cpdaily 密码错误，通知组件弹窗
 export const CPD_PASSWORD_ERROR = 'cpd-password-error'
+// 自定义事件：账号被封禁（携带 detail: { message }），通知组件弹出封号原因
+export const ACCOUNT_BANNED = 'account-banned'
 
 const api = axios.create({
   baseURL: import.meta.env.VITE_API_BASE_URL || '/api',
@@ -44,6 +46,14 @@ api.interceptors.response.use(
   async (error) => {
     const originalRequest = error.config
 
+    // 账号封禁：后台在所有接口统一返回 HTTP 403 + code 4030，message 为封号原因。
+    // 清除登录态、广播事件让界面弹出封号原因并跳登录页；不触发 token 刷新。
+    if (error.response?.status === 403 && error.response?.data?.code === 4030) {
+      const message = error.response.data.message || '您的账号已被封禁'
+      handleAccountBanned(message)
+      return Promise.reject(error)
+    }
+
     // admin API 401：直接清理 admin token 并跳管理后台登录页，
     // 不触碰用户端 access_token/refresh_token（两端登录互不影响）
     if (error.response?.status === 401 && originalRequest.url?.startsWith('/admin/')) {
@@ -128,4 +138,19 @@ function handleCpdailyPasswordError() {
   }, 500)
 }
 
+// handleAccountBanned 处理账号封禁：清除登录态、广播封号原因并跳登录页
+function handleAccountBanned(message: string) {
+  if ((window as any).__accountBannedHandled) return
+  ;(window as any).__accountBannedHandled = true
+
+  localStorage.removeItem('access_token')
+  localStorage.removeItem('refresh_token')
+
+  // 广播事件（若页面有监听则弹窗）；同时用原生 alert 兜底，确保封号原因一定可见
+  window.dispatchEvent(new CustomEvent(ACCOUNT_BANNED, { detail: { message } }))
+  try { window.alert(message) } catch { /* ignore */ }
+
+  window.location.href = '/login'
+}
+
 export default api

frondend/src/api/leave.ts

@@ -28,6 +28,14 @@ export interface LeaveItem {
   reportPlaces: LeaveReportPlace[]
   /** 该请假类型销假是否需要选择审批人（leaveType.reportApplyFlow=1） */
   reportApplyFlow: boolean
+  /** 是否可销假（列表含仅可续假的单） */
+  canReport?: boolean
+  /** 是否可续假（休假中/逾期 且学校允许续假） */
+  canExtend?: boolean
+  /** 续假用：原假单的请假类型 ID（typeWid） */
+  typeWid?: string
+  /** 续假用：原假单是否离校（"1"=离校） */
+  isLeaveOut?: string
   /** 该请假类型销假是否允许上传图片（leaveType.enableAttach=1） */
   enableAttach: boolean
 }
@@ -87,6 +95,34 @@ export interface LeaveType {
   requireSign: number
   /** 「是否离校」默认值（0=无默认 1=默认是 2=默认否；仅新套类型返回，非强制） */
   outStatusDefault: number
+  /** 1=必须上传证明材料（isRequiredEvidenceFile，仅新套） */
+  requireEvidence?: number
+  /** 证明材料最少张数 */
+  evidenceMin?: number
+  /** 自定义附加字段（如「当天是否返校」），提交时回填 selfDefineAnswers */
+  selfDefineFields?: SelfDefineField[]
+}
+
+/** 请假自定义附加字段（新套 selfDefineFields） */
+export interface SelfDefineField {
+  fieldWid: number
+  fieldName: string
+  fieldType: number
+  fieldTip?: string
+  fieldValue?: string | null
+  isRequired: boolean
+  optionList?: { optionContent: string; optionSeq: number }[]
+  wordsMax?: number
+  wordsMini?: number
+}
+
+/** 自定义附加字段作答（提交 selfDefineAnswers 项） */
+export interface SelfDefineAnswer {
+  fieldWid: number
+  fieldName: string
+  fieldValue: string
+  /** 字段类型（官方前端一并回传） */
+  fieldType?: number
 }
 
 /** 请假执行参数 */
@@ -111,6 +147,26 @@ export interface ExecuteLeaveApplyParams {
   ccUsers?: LeaveApprover[]
   /** 手写承诺书签名图 URL（requireSign=1 的类型必填） */
   signatureUrl?: string
+  /** 续假：true=延长已有假单（仅新套） */
+  isExtend?: boolean
+  /** 续假：原假单 ID */
+  extendLeaveId?: string
+  /** 自定义附加字段作答（新套 selfDefineFields） */
+  selfDefineAnswers?: SelfDefineAnswer[]
+}
+
+/** 续假预填：取原假单类型/原结束时间/原因等（仅新套） */
+export interface LeaveExtendPrefill {
+  leaveId: string
+  typeWid: number
+  beginTime: string
+  endTime: string
+  leaveReason: string
+  isLeaveOut: string
+}
+
+export function getLeaveExtendPrefill(leaveId: string) {
+  return api.post<{ data: LeaveExtendPrefill }>('/leave/extend-prefill', { leaveId })
 }
 
 // ======== API ========

frondend/src/api/ticket.ts

@@ -150,8 +150,8 @@ export const TICKET_STATUS_MAP: Record<string, string> = {
 
 /** 工单状态颜色映射 */
 export const TICKET_STATUS_COLOR: Record<string, string> = {
-  pending: 'bg-amber-100 text-amber-700',
-  processing: 'bg-blue-100 text-blue-700',
-  resolved: 'bg-green-100 text-green-700',
-  closed: 'bg-gray-100 text-gray-500',
+  pending: 'adm-badge-amber',
+  processing: 'adm-badge-brand',
+  resolved: 'adm-badge-green',
+  closed: 'adm-badge-gray',
 }

frondend/src/assets/styles/globals.css

@@ -1,34 +1,180 @@
 @import "tailwindcss";
 
 /* 基于 class 的暗色变体：html.dark 时启用 dark:* 工具类
-   （切换逻辑见 composables/useTheme.ts，按浏览器系统时间自动切换） */
+   （切换逻辑见 composables/useTheme.ts：自动 / 亮 / 暗 三档） */
 @custom-variant dark (&:where(.dark, .dark *));
 
+/* ============================================================
+ * 设计令牌 · 薄荷汽水（Mint Soda）× 轻量液态玻璃
+ *
+ * 换肤方式：直接重映射 Tailwind 色阶 —— blue → 薄荷品牌色、gray → 薄荷中性灰、
+ * red/rose → 珊瑚、amber → 柠檬、green → 清新绿。全站 1000+ 处色阶类无需逐个
+ * 改写即可统一换肤（历史代码里的 blue-* 即品牌色）；新代码请优先用 brand-*。
+ *
+ * 对比度（WCAG AA，已逐色计算）：亮色下 *-500/600 作文字或白字底色均 ≥ 4.5；
+ * 暗色下品牌按钮白字 ≥ 3（AA 大字/UI 组件级），正文文字 ≥ 4.5。
+ * ============================================================ */
 @theme {
-  --color-background: #f5f5f5;
-  --color-foreground: #1a1a1a;
+  --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC", "HarmonyOS Sans SC",
+    "MiSans", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
+
+  /* —— 品牌 · 薄荷青（brand 与 blue 同值；blue 为历史类名兼容）—— */
+  --color-brand-50: #eafaf5;
+  --color-brand-100: #d2f4ea;
+  --color-brand-200: #a8e9d7;
+  --color-brand-300: #74dac2;
+  --color-brand-400: #2cc5a8;
+  --color-brand-500: #0b8672;
+  --color-brand-600: #0a7866;
+  --color-brand-700: #08604f;
+  --color-brand-800: #0a4d41;
+  --color-brand-900: #0b3f36;
+  --color-blue-50: #eafaf5;
+  --color-blue-100: #d2f4ea;
+  --color-blue-200: #a8e9d7;
+  --color-blue-300: #74dac2;
+  --color-blue-400: #2cc5a8;
+  --color-blue-500: #0b8672;
+  --color-blue-600: #0a7866;
+  --color-blue-700: #08604f;
+  --color-blue-800: #0a4d41;
+  --color-blue-900: #0b3f36;
+
+  /* —— 点缀 · 天空蓝（信息/次强调，取代原 indigo/sky 的位置）—— */
+  --color-sky-50: #eef6ff;
+  --color-sky-100: #dcecfe;
+  --color-sky-400: #5aa9f5;
+  --color-sky-500: #2373c4;
+  --color-sky-600: #1d63a9;
+  --color-indigo-50: #eef6ff;
+  --color-indigo-100: #dcecfe;
+  --color-indigo-500: #2373c4;
+  --color-cyan-400: #5aa9f5;
+
+  /* —— 中性 · 薄荷灰（带一丝青调，比纯灰更通透）—— */
+  --color-gray-50: #f6faf8;
+  --color-gray-100: #edf3f0;
+  --color-gray-200: #dfe8e4;
+  --color-gray-300: #c9d5d0;
+  --color-gray-400: #808e89;
+  --color-gray-500: #66756f;
+  --color-gray-600: #4f5d58;
+  --color-gray-700: #3a4743;
+  --color-gray-800: #263330;
+  --color-gray-900: #17221f;
+  --color-gray-950: #0e1714;
+
+  /* —— 语义 · 珊瑚（危险/错误；red 与 rose 合一，比纯红柔和）—— */
+  --color-red-50: #fff1f2;
+  --color-red-100: #ffe1e4;
+  --color-red-200: #ffc7cd;
+  --color-red-300: #ffa1ab;
+  --color-red-400: #f77a87;
+  --color-red-500: #d63f52;
+  --color-red-600: #bf3446;
+  --color-red-700: #9e2a3a;
+  --color-rose-50: #fff1f4;
+  --color-rose-100: #ffe1e8;
+  --color-rose-200: #ffc8d5;
+  --color-rose-300: #ffa3b8;
+  --color-rose-400: #f7809c;
+  --color-rose-500: #d23c68;
+  --color-rose-600: #b8325a;
+  --color-rose-700: #96284a;
+
+  /* —— 语义 · 清新绿（成功）—— */
+  --color-green-50: #ecfaf2;
+  --color-green-100: #d5f4e2;
+  --color-green-200: #ade8c6;
+  --color-green-400: #4ccb86;
+  --color-green-500: #1f9d58;
+  --color-green-600: #16864a;
+  --color-green-700: #126b3b;
+  --color-emerald-50: #ecfaf2;
+  --color-emerald-200: #ade8c6;
+  --color-emerald-400: #4ccb86;
+  --color-emerald-600: #16864a;
+
+  /* —— 语义 · 柠檬（提醒/公告/积分）—— */
+  --color-amber-50: #fffaeb;
+  --color-amber-100: #fff1c7;
+  --color-amber-200: #ffe39a;
+  --color-amber-300: #ffd45c;
+  --color-amber-400: #f5bd2e;
+  --color-amber-500: #e3a008;
+  --color-amber-600: #9a6200;
+  --color-amber-700: #8a5a00;
+  --color-amber-800: #6e4700;
+  --color-amber-900: #573800;
+  --color-orange-50: #fff5ec;
+  --color-orange-100: #ffe8d4;
+  --color-orange-400: #ffa45c;
+  --color-orange-500: #f08a3c;
+  --color-orange-600: #b35a12;
+
+  /* —— 点缀 · 薰衣草（VIP/特殊标签）—— */
+  --color-purple-50: #f5f2ff;
+  --color-purple-100: #ebe5ff;
+  --color-purple-200: #d9cfff;
+  --color-purple-500: #8b6ce6;
+  --color-purple-600: #6a4bcb;
+
+  /* —— 语义 token（ui/ 组件与语义类使用）—— */
+  --color-background: #f3faf7;
+  --color-foreground: #17221f;
   --color-card: #ffffff;
-  --color-card-foreground: #1a1a1a;
-  --color-primary: #2563eb;
+  --color-card-foreground: #17221f;
+  --color-primary: #0b8672;
   --color-primary-foreground: #ffffff;
-  --color-secondary: #f3f4f6;
-  --color-secondary-foreground: #1f2937;
-  --color-muted: #f3f4f6;
-  --color-muted-foreground: #6b7280;
-  --color-accent: #f3f4f6;
-  --color-accent-foreground: #1f2937;
-  --color-destructive: #ef4444;
+  --color-secondary: #edf3f0;
+  --color-secondary-foreground: #263330;
+  --color-muted: #edf3f0;
+  --color-muted-foreground: #66756f;
+  --color-accent: #eafaf5;
+  --color-accent-foreground: #08604f;
+  --color-destructive: #d63f52;
   --color-destructive-foreground: #ffffff;
-  --color-border: #e5e7eb;
-  --color-input: #e5e7eb;
-  --color-ring: #2563eb;
-  --radius: 0.5rem;
+  --color-border: #dfe8e4;
+  --color-input: #dfe8e4;
+  --color-ring: #2cc5a8;
+
+  /* —— 圆角：控件 / 卡片 / 浮层（同心圆角：内层 = 外层 − 内边距）—— */
+  --radius: 0.75rem;
+  --radius-md: 0.5rem;
+  --radius-lg: 0.75rem;
+  --radius-xl: 1.25rem;
+  --radius-2xl: 1.5rem;
+  --radius-3xl: 1.75rem;
+
+  /* —— 阴影：柔和、带一点品牌色调 —— */
+  --shadow-sm: 0 1px 2px rgb(14 40 34 / 0.04), 0 2px 8px rgb(14 40 34 / 0.04);
+  --shadow: 0 2px 6px rgb(14 40 34 / 0.05), 0 6px 18px rgb(14 40 34 / 0.06);
+  --shadow-md: 0 4px 12px rgb(14 40 34 / 0.07), 0 10px 28px rgb(14 40 34 / 0.06);
+  --shadow-lg: 0 8px 24px rgb(14 40 34 / 0.09), 0 18px 44px rgb(14 40 34 / 0.08);
+  --shadow-xl: 0 12px 32px rgb(14 40 34 / 0.12), 0 24px 60px rgb(14 40 34 / 0.1);
+  --shadow-2xl: 0 20px 50px rgb(14 40 34 / 0.18);
+
+  /* —— 动效 —— */
+  --ease-spring: cubic-bezier(0.34, 1.36, 0.64, 1);
+  --ease-out-soft: cubic-bezier(0.22, 1, 0.36, 1);
 }
 
 * {
   border-color: var(--color-border);
 }
 
+/* 顶部安全区：只在「添加到主屏幕」全屏打开（standalone）时避让状态栏。
+   普通浏览器与 App 内置 WebView（今日校园/微信等）本身已把网页放在状态栏下方，
+   但部分内核仍会上报 safe-area-inset-top，直接叠加会让顶部内容凭空下移几十像素。 */
+:root {
+  --safe-top: 0px;
+}
+@media (display-mode: standalone), (display-mode: fullscreen) {
+  :root {
+    --safe-top: env(safe-area-inset-top, 0px);
+  }
+}
+
 html, body {
   margin: 0;
   padding: 0;
@@ -37,12 +183,18 @@ html, body {
 }
 
 body {
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
-  background-color: #e8e8e8;
+  font-family: var(--font-sans);
+  background-color: #e4efea;
   color: var(--color-foreground);
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-tap-highlight-color: transparent;
+  text-rendering: optimizeLegibility;
 }
 
-/* 手机容器 — 固定最大宽度，全屏高度，水平居中 */
+/* 手机容器 — 固定最大宽度，全屏高度，水平居中。
+   背景 = 底色 + 三处柔光斑（薄荷 / 天空蓝 / 柠檬），为玻璃层提供可折射的底图；
+   纯 radial-gradient 实现，无 filter: blur，低端机零额外开销。 */
 #app {
   max-width: 430px;
   width: 100%;
@@ -51,89 +203,581 @@ body {
   height: 100vh;
   height: 100dvh;
   margin: 0 auto;
-  background-color: #ffffff;
+  background-color: var(--color-background);
+  background-image:
+    radial-gradient(70% 38% at 0% 0%, rgb(44 197 168 / 0.22), transparent 72%),
+    radial-gradient(55% 32% at 100% 18%, rgb(90 169 245 / 0.16), transparent 72%),
+    radial-gradient(65% 36% at 60% 100%, rgb(255 212 92 / 0.16), transparent 72%);
+  background-attachment: local;
   overflow: hidden;
   display: flex;
   flex-direction: column;
-  box-shadow: 0 0 20px rgba(0, 0, 0, 0.08);
+  box-shadow: 0 0 40px rgb(14 40 34 / 0.1);
+  position: relative;
 }
 
-/* 管理后台模式 — 全屏宽度 */
+/* 管理后台模式 — 全屏宽度，不使用光斑背景 */
 #app.admin-mode {
   max-width: none;
   box-shadow: none;
   background-color: transparent;
+  background-image: none;
 }
 
 /* ============================================================
- * 暗色主题（html.dark，由 useTheme.ts 按系统时间自动切换）
+ * 液态玻璃（Liquid Glass，网页近似实现）
+ * 仅用于「浮在内容之上的控件层」：底部胶囊 Tab、顶栏、弹层/抽屉。
+ * 内容卡片保持不透明，保证可读性与低端机滚动性能。
+ * 降级：不支持 backdrop-filter / 系统「减弱透明度」→ 高不透明实底。
+ * ============================================================ */
+.glass {
+  background-color: rgb(255 255 255 / 0.66);
+  -webkit-backdrop-filter: blur(22px) saturate(180%);
+  backdrop-filter: blur(22px) saturate(180%);
+  border: 1px solid rgb(255 255 255 / 0.6);
+  box-shadow:
+    inset 0 1px 0 rgb(255 255 255 / 0.75),
+    inset 0 -1px 0 rgb(255 255 255 / 0.25),
+    0 8px 28px rgb(14 40 34 / 0.12);
+}
+.glass-bar {
+  background-color: rgb(243 250 247 / 0.72);
+  -webkit-backdrop-filter: blur(20px) saturate(180%);
+  backdrop-filter: blur(20px) saturate(180%);
+}
+.glass-panel {
+  background-color: rgb(255 255 255 / 0.86);
+  -webkit-backdrop-filter: blur(28px) saturate(180%);
+  backdrop-filter: blur(28px) saturate(180%);
+}
+.dark .glass {
+  background-color: rgb(30 44 40 / 0.62);
+  border-color: rgb(255 255 255 / 0.09);
+  box-shadow:
+    inset 0 1px 0 rgb(255 255 255 / 0.08),
+    0 10px 30px rgb(0 0 0 / 0.45);
+}
+.dark .glass-bar {
+  background-color: rgb(15 24 21 / 0.72);
+}
+.dark .glass-panel {
+  background-color: rgb(26 38 34 / 0.88);
+}
+@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
+  .glass { background-color: rgb(255 255 255 / 0.96); }
+  .glass-bar { background-color: rgb(243 250 247 / 0.97); }
+  .glass-panel { background-color: #ffffff; }
+  .dark .glass { background-color: rgb(30 44 40 / 0.98); }
+  .dark .glass-bar { background-color: rgb(15 24 21 / 0.98); }
+  .dark .glass-panel { background-color: #1a2622; }
+}
+@media (prefers-reduced-transparency: reduce) {
+  .glass, .glass-bar, .glass-panel {
+    -webkit-backdrop-filter: none;
+    backdrop-filter: none;
+  }
+  .glass { background-color: rgb(255 255 255 / 0.97); }
+  .glass-bar { background-color: rgb(243 250 247 / 0.98); }
+  .glass-panel { background-color: #ffffff; }
+  .dark .glass { background-color: #1e2c28; }
+  .dark .glass-bar { background-color: #0f1815; }
+  .dark .glass-panel { background-color: #1a2622; }
+}
+
+/* 品牌渐变（顶栏/头图/主按钮）：薄荷 → 青绿，右上带一点天空蓝 */
+.bg-brand-gradient {
+  background-color: #0b8672;
+  background-image: linear-gradient(135deg, #12a58b 0%, #0b8672 55%, #0a7a6e 100%);
+}
+.dark .bg-brand-gradient {
+  background-color: #0e6f60;
+  background-image: linear-gradient(135deg, #10856f 0%, #0c6d5d 60%, #0b5f55 100%);
+}
+
+/* 头卡装饰光斑容器：overflow:hidden 仍可被 scrollIntoView 等程序化滚动横向推动；
+   clip 彻底禁止滚动（老内核不识别 clip 时回落为同元素上的 overflow-hidden） */
+.overflow-hidden.hero-clip {
+  overflow: clip;
+}
+
+/* 按压反馈：轻微缩放，iOS 风格 */
+.press {
+  transition: transform 0.18s var(--ease-out-soft), opacity 0.18s ease, background-color 0.2s ease, color 0.2s ease;
+}
+.press:active {
+  transform: scale(0.96);
+}
+
+/* 内容进场：轻微上浮淡入 */
+@keyframes rise-in {
+  from { opacity: 0; transform: translateY(8px); }
+  to { opacity: 1; transform: none; }
+}
+.rise-in {
+  animation: rise-in 0.42s var(--ease-out-soft) both;
+}
+
+/* 系统「减弱动态效果」：关闭位移/弹簧动画（保留极短时长，保证 animationend 仍会触发） */
+@media (prefers-reduced-motion: reduce) {
+  *, ::before, ::after {
+    animation-duration: 0.01ms !important;
+    animation-iteration-count: 1 !important;
+    transition-duration: 0.01ms !important;
+    scroll-behavior: auto !important;
+  }
+}
+
+/* ============================================================
+ * 暗色主题（html.dark）· 墨绿夜
  *
  * Tailwind v4 的颜色工具类均引用 --color-* CSS 变量（bg-white →
- * var(--color-white)），此处整体覆盖变量即可让全站 1000+ 处硬编码
- * 颜色类自动适配，无需逐个加 dark: 变体。深彩色（blue-500 等
- * 品牌/状态色）与遮罩黑保持原值。彩底上的白色元素用类名级规则恢复。
+ * var(--color-white)），此处整体覆盖变量即可让全站硬编码颜色类自动适配。
+ * 规则：
+ *   - 白 / 灰阶反转（越浅的灰在暗色下越亮，保持层次感）；
+ *   - 彩色 50/100/200 浅底 → 对应深色调底；
+ *   - 彩色 400–700 文字色提亮，保证在暗卡片上 ≥ 4.5 对比度；
+ *   - 彩底上的白色元素用类名级规则恢复为纯白（见下方）。
  * ============================================================ */
 .dark {
-  /* —— 基础调色板：白与灰阶（越浅的灰在暗色下越亮，保持层次感）—— */
-  --color-white: #1e1e2a;
-  --color-gray-50: #232331;
-  --color-gray-100: #2a2a3a;
-  --color-gray-200: #36364a;
-  --color-gray-300: #474763;
-  --color-gray-400: #8f8fab;
-  --color-gray-500: #a5a5c3;
-  --color-gray-600: #bcbcd6;
-  --color-gray-700: #d4d4e6;
-  --color-gray-800: #e5e5f0;
-  --color-gray-900: #ededf6;
-  --color-gray-950: #f4f4fa;
-  /* —— 彩色浅底 → 对应暗色调 —— */
-  --color-blue-50: #1c2a4d;
-  --color-blue-100: #243660;
-  --color-red-50: #3d1c28;
-  --color-red-100: #522534;
+  --color-white: #18221f;
+  --color-gray-50: #1c2724;
+  --color-gray-100: #22302c;
+  --color-gray-200: #2c3b36;
+  --color-gray-300: #3b4c46;
+  --color-gray-400: #7f908a;
+  --color-gray-500: #98aba4;
+  --color-gray-600: #b6c5bf;
+  --color-gray-700: #cbd8d3;
+  --color-gray-800: #dde7e3;
+  --color-gray-900: #eaf2ef;
+  --color-gray-950: #f4f8f6;
+
+  --color-brand-50: #163a33;
+  --color-brand-100: #1b4840;
+  --color-brand-200: #22594f;
+  --color-brand-300: #2d7a6b;
+  --color-brand-400: #3ad3b6;
+  --color-brand-500: #16a88d;
+  --color-brand-600: #0e9079;
+  --color-brand-700: #7fe6d0;
+  --color-blue-50: #163a33;
+  --color-blue-100: #1b4840;
+  --color-blue-200: #22594f;
+  --color-blue-300: #2d7a6b;
+  --color-blue-400: #3ad3b6;
+  --color-blue-500: #16a88d;
+  --color-blue-600: #0e9079;
+  --color-blue-700: #7fe6d0;
+  --color-blue-800: #a6efdf;
+
+  --color-sky-50: #172c40;
+  --color-sky-100: #1d3850;
+  --color-sky-500: #6cb4ff;
+  --color-sky-600: #8cc4ff;
+  --color-indigo-50: #172c40;
+  --color-indigo-100: #1d3850;
+  --color-indigo-500: #6cb4ff;
+
+  --color-red-50: #3a1d24;
+  --color-red-100: #4a232c;
+  --color-red-200: #5e2b36;
+  --color-red-300: #7a3442;
+  --color-red-400: #ff8c96;
+  --color-red-500: #f2636f;
+  --color-red-600: #ff8c96;
+  --color-red-700: #ffb3ba;
   --color-rose-50: #3a1c2b;
-  --color-rose-100: #4d2539;
-  --color-green-50: #173224;
-  --color-green-100: #1f4430;
-  --color-amber-50: #3a2f16;
-  --color-amber-100: #4d3f1e;
-  --color-purple-100: #322552;
-  /* —— 语义 token（ui/ 组件与语义类使用）—— */
-  --color-background: #15151f;
-  --color-foreground: #ededf6;
-  --color-card: #1e1e2a;
-  --color-card-foreground: #ededf6;
-  --color-secondary: #262636;
-  --color-secondary-foreground: #d4d4e6;
-  --color-muted: #262636;
-  --color-muted-foreground: #9c9cb8;
-  --color-accent: #262636;
-  --color-accent-foreground: #d4d4e6;
-  --color-border: #33334a;
-  --color-input: #3a3a55;
-  --color-ring: #3b82f6;
+  --color-rose-100: #4a2337;
+  --color-rose-200: #5e2c45;
+  --color-rose-300: #7a3758;
+  --color-rose-400: #ff8fab;
+  --color-rose-500: #ef6a8e;
+  --color-rose-600: #ff8fab;
+  --color-rose-700: #ffb8cb;
+
+  --color-green-50: #14301f;
+  --color-green-100: #183b27;
+  --color-green-200: #1f4d33;
+  --color-green-400: #4ccb86;
+  --color-green-500: #3fbf79;
+  --color-green-600: #4ccb86;
+  --color-green-700: #8fe3b5;
+  --color-emerald-50: #14301f;
+  --color-emerald-200: #1f4d33;
+  --color-emerald-600: #4ccb86;
+
+  --color-amber-50: #332a16;
+  --color-amber-100: #40331a;
+  --color-amber-200: #52411f;
+  --color-amber-300: #b08a2e;
+  --color-amber-400: #f7c54a;
+  --color-amber-500: #e9b23a;
+  --color-amber-600: #f7c54a;
+  --color-amber-700: #ffd978;
+  --color-amber-800: #ffe39a;
+  --color-amber-900: #fff0c2;
+  --color-orange-50: #35251a;
+  --color-orange-100: #44301f;
+  --color-orange-600: #ffb47a;
+
+  --color-purple-50: #261f3d;
+  --color-purple-100: #2f264d;
+  --color-purple-200: #3b3061;
+  --color-purple-600: #b9a5ff;
+
+  --color-background: #0f1815;
+  --color-foreground: #eaf2ef;
+  --color-card: #18221f;
+  --color-card-foreground: #eaf2ef;
+  --color-primary: #0e9079;
+  --color-secondary: #22302c;
+  --color-secondary-foreground: #cbd8d3;
+  --color-muted: #22302c;
+  --color-muted-foreground: #98aba4;
+  --color-accent: #163a33;
+  --color-accent-foreground: #7fe6d0;
+  --color-destructive: #e0505e;
+  --color-border: #2a3934;
+  --color-input: #33443e;
+  --color-ring: #3ad3b6;
 }
 
 /* —— 彩底上的白色元素恢复纯白（--color-white 已被覆盖为卡片暗色）—— */
 .dark .text-white { color: #fff; }
 .dark .text-white\/95 { color: rgb(255 255 255 / 0.95); }
+.dark .text-white\/90 { color: rgb(255 255 255 / 0.9); }
 .dark .text-white\/80 { color: rgb(255 255 255 / 0.8); }
+.dark .text-white\/75 { color: rgb(255 255 255 / 0.75); }
 .dark .text-white\/70 { color: rgb(255 255 255 / 0.7); }
+.dark .bg-white\/10 { background-color: rgb(255 255 255 / 0.1); }
 .dark .bg-white\/15 { background-color: rgb(255 255 255 / 0.15); }
 .dark .bg-white\/20 { background-color: rgb(255 255 255 / 0.2); }
 .dark .bg-white\/25 { background-color: rgb(255 255 255 / 0.25); }
 .dark .hover\:bg-white\/25:hover { background-color: rgb(255 255 255 / 0.25); }
 .dark .ring-white\/30 { --tw-ring-color: rgb(255 255 255 / 0.3); }
+.dark .border-white\/30 { border-color: rgb(255 255 255 / 0.3); }
 
 /* —— 全局容器暗色 —— */
 .dark body {
-  background-color: #0d0d14;
+  background-color: #070c0a;
 }
 .dark #app {
-  background-color: #15151f;
-  box-shadow: 0 0 20px rgba(0, 0, 0, 0.45);
+  background-color: var(--color-background);
+  background-image:
+    radial-gradient(70% 38% at 0% 0%, rgb(44 197 168 / 0.14), transparent 72%),
+    radial-gradient(55% 32% at 100% 18%, rgb(90 169 245 / 0.09), transparent 72%),
+    radial-gradient(65% 36% at 60% 100%, rgb(255 212 92 / 0.06), transparent 72%);
+  box-shadow: 0 0 40px rgb(0 0 0 / 0.5);
 }
 .dark #app.admin-mode {
   background-color: transparent;
+  background-image: none;
+}
+
+/* ============================================================
+ * 管理后台组件类（adm-*）
+ * 后台以信息密度与可读性优先：不用玻璃，实底卡片 + 细边框 + 柔和阴影；
+ * 统一页头、卡片、表格、徽标、工具栏、分页、空状态，各页只需套类名。
+ * ============================================================ */
+.adm-page {
+  padding: 16px;
+  max-width: 1480px;
+  margin: 0 auto;
+}
+@media (min-width: 768px) {
+  .adm-page { padding: 28px 32px 40px; }
+}
+/* 页头：图标 + 标题 + 副标题，右侧放主操作 */
+.adm-head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+  flex-wrap: wrap;
+  margin-bottom: 20px;
+}
+.adm-head-icon {
+  width: 42px;
+  height: 42px;
+  border-radius: 14px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  color: #fff;
+  background-image: linear-gradient(135deg, #12a58b 0%, #0b8672 100%);
+  box-shadow: 0 6px 16px rgb(11 134 114 / 0.22);
+}
+.adm-title {
+  font-size: 20px;
+  line-height: 1.25;
+  font-weight: 700;
+  letter-spacing: -0.01em;
+  color: var(--color-gray-900);
+}
+.adm-sub {
+  margin-top: 2px;
+  font-size: 13px;
+  color: var(--color-gray-500);
+}
+/* 卡片 */
+.adm-card {
+  background-color: var(--color-card);
+  border: 1px solid var(--color-gray-200);
+  border-radius: 18px;
+  box-shadow: 0 1px 2px rgb(14 40 34 / 0.04), 0 4px 14px rgb(14 40 34 / 0.04);
+}
+.adm-card-head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+  padding: 14px 18px;
+  border-bottom: 1px solid var(--color-gray-100);
+}
+.adm-card-title {
+  font-size: 15px;
+  font-weight: 600;
+  color: var(--color-gray-900);
+}
+/* 统计卡 */
+.adm-stat {
+  display: flex;
+  align-items: center;
+  gap: 14px;
+  padding: 16px 18px;
+}
+.adm-stat-icon {
+  width: 44px;
+  height: 44px;
+  border-radius: 14px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+}
+.adm-stat-label {
+  font-size: 12px;
+  color: var(--color-gray-500);
+}
+.adm-stat-value {
+  margin-top: 2px;
+  font-size: 22px;
+  line-height: 1.2;
+  font-weight: 700;
+  color: var(--color-gray-900);
+  font-variant-numeric: tabular-nums;
+}
+/* 工具栏（搜索 + 筛选 + 操作） */
+.adm-toolbar {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  flex-wrap: wrap;
+  margin-bottom: 14px;
+}
+/* 表格 */
+.adm-table {
+  width: 100%;
+  font-size: 13px;
+  border-collapse: separate;
+  border-spacing: 0;
+}
+.adm-table thead th {
+  position: sticky;
+  top: 0;
+  z-index: 1;
+  background-color: var(--color-gray-50);
+  color: var(--color-gray-500);
+  font-size: 12px;
+  font-weight: 600;
+  text-align: left;
+  white-space: nowrap;
+  border-bottom: 1px solid var(--color-gray-200);
+}
+.adm-table tbody tr {
+  transition: background-color 0.15s ease;
+}
+.adm-table tbody tr:hover {
+  background-color: var(--color-gray-50);
+}
+.adm-table tbody td {
+  border-bottom: 1px solid var(--color-gray-100);
+  color: var(--color-gray-700);
+  vertical-align: middle;
+}
+.adm-table tbody tr:last-child td {
+  border-bottom: 0;
+}
+/* 徽标 */
+.adm-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  height: 22px;
+  padding: 0 8px;
+  border-radius: 999px;
+  font-size: 12px;
+  font-weight: 600;
+  white-space: nowrap;
+  line-height: 1;
+}
+.adm-badge::before {
+  content: '';
+  width: 6px;
+  height: 6px;
+  border-radius: 999px;
+  background-color: currentColor;
+  opacity: 0.85;
+}
+.adm-badge.no-dot::before { display: none; }
+.adm-badge-green { background-color: var(--color-green-50); color: var(--color-green-700); }
+.adm-badge-red { background-color: var(--color-red-50); color: var(--color-red-600); }
+.adm-badge-amber { background-color: var(--color-amber-50); color: var(--color-amber-700); }
+.adm-badge-brand { background-color: var(--color-brand-50); color: var(--color-brand-700); }
+.adm-badge-purple { background-color: var(--color-purple-50); color: var(--color-purple-600); }
+.adm-badge-sky { background-color: var(--color-sky-50); color: var(--color-sky-600); }
+.adm-badge-gray { background-color: var(--color-gray-100); color: var(--color-gray-600); }
+/* 行内文字按钮（表格操作） */
+.adm-link {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  height: 28px;
+  padding: 0 8px;
+  border-radius: 8px;
+  font-size: 12px;
+  font-weight: 600;
+  white-space: nowrap;
+  transition: background-color 0.15s ease, color 0.15s ease;
+}
+.adm-link-brand { color: var(--color-brand-600); }
+.adm-link-brand:hover { background-color: var(--color-brand-50); }
+.adm-link-red { color: var(--color-red-600); }
+.adm-link-red:hover { background-color: var(--color-red-50); }
+.adm-link-green { color: var(--color-green-600); }
+.adm-link-green:hover { background-color: var(--color-green-50); }
+.adm-link-gray { color: var(--color-gray-600); }
+.adm-link-gray:hover { background-color: var(--color-gray-100); }
+/* 弱化占位（--、/、未设置）：比 gray-300 深，保证 ≥ 3:1 */
+.adm-muted { color: var(--color-gray-400); }
+/* 分段筛选（全部 / 状态） */
+.adm-seg {
+  display: inline-flex;
+  padding: 3px;
+  gap: 2px;
+  border-radius: 12px;
+  background-color: var(--color-gray-100);
+}
+.adm-seg > button {
+  height: 30px;
+  padding: 0 12px;
+  border-radius: 9px;
+  font-size: 13px;
+  font-weight: 500;
+  color: var(--color-gray-600);
+  white-space: nowrap;
+  transition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
+}
+.adm-seg > button.is-active {
+  background-color: var(--color-card);
+  color: var(--color-brand-600);
+  font-weight: 600;
+  box-shadow: 0 1px 2px rgb(14 40 34 / 0.08), 0 0 0 1px rgb(14 40 34 / 0.04);
+}
+/* 空状态 */
+.adm-empty {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 56px 16px;
+  color: var(--color-gray-500);
+  font-size: 13px;
+  text-align: center;
+}
+.adm-empty-icon {
+  width: 52px;
+  height: 52px;
+  border-radius: 16px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-bottom: 10px;
+  background-color: var(--color-gray-100);
+  color: var(--color-gray-400);
+}
+.dark .adm-card {
+  box-shadow: 0 1px 2px rgb(0 0 0 / 0.3);
+}
+.dark .adm-seg > button.is-active {
+  background-color: var(--color-gray-300);
+  color: var(--color-brand-700);
+}
+.dark .adm-head-icon {
+  background-image: linear-gradient(135deg, #10856f 0%, #0c6d5d 100%);
+  box-shadow: none;
+}
+/* 分页 */
+.adm-pager {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+  flex-wrap: wrap;
+  padding: 12px 18px;
+  border-top: 1px solid var(--color-gray-100);
+  font-size: 12px;
+  color: var(--color-gray-500);
+}
+.adm-pager-btn {
+  width: 32px;
+  height: 32px;
+  border-radius: 10px;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--color-gray-600);
+  border: 1px solid var(--color-gray-200);
+  background-color: var(--color-card);
+  transition: background-color 0.15s ease, border-color 0.15s ease;
+}
+.adm-pager-btn:hover:not(:disabled) {
+  background-color: var(--color-gray-50);
+  border-color: var(--color-gray-300);
+}
+.adm-pager-btn:disabled {
+  opacity: 0.4;
+  cursor: not-allowed;
+}
+.adm-select {
+  height: 32px;
+  padding: 0 8px;
+  border-radius: 10px;
+  border: 1px solid var(--color-gray-200);
+  background-color: var(--color-card);
+  color: var(--color-gray-600);
+  font-size: 12px;
+}
+.adm-select:focus {
+  outline: none;
+  border-color: var(--color-brand-400);
+  box-shadow: 0 0 0 3px rgb(44 197 168 / 0.15);
+}
+/* 今日已登录用户行：浅绿底 + 左侧色条 */
+.adm-row-today td {
+  background-color: var(--color-green-50);
+}
+.adm-row-today td:first-child {
+  box-shadow: inset 3px 0 0 var(--color-green-500);
+}
+/* 成功操作按钮：固定绿（白字 ≥ 4.5:1）。bg-green-500 在暗色色板下会被提亮，白字看不清 */
+.adm-btn-success {
+  color: #fff;
+  background-image: linear-gradient(135deg, #1f9d58 0%, #16864a 100%);
+}
+/* 品牌实色按钮/开关（固定色，白字 ≥ 4.5:1；bg-blue-500 在暗色色板下被提亮，不宜放白字） */
+.adm-btn-brand {
+  color: #fff;
+  background-color: #0b8672;
 }

frondend/src/components/ConfirmHost.vue

@@ -26,7 +26,7 @@ const { state, respond } = useConfirm()
       <div
         :class="[
           'w-14 h-14 rounded-full flex items-center justify-center mx-auto mb-4',
-          state.danger ? 'bg-red-100' : 'bg-blue-100',
+          state.danger ? 'bg-red-100' : 'bg-brand-100',
         ]"
       >
         <AlertTriangle v-if="state.danger" class="w-7 h-7 text-red-500" />
@@ -43,14 +43,14 @@ const { state, respond } = useConfirm()
         <Button
           v-if="!state.alertOnly"
           variant="outline"
-          class="flex-1 h-10 text-sm font-medium"
+          class="flex-1 h-11 text-sm"
           @click="respond(false)"
         >
           {{ state.cancelText || '取消' }}
         </Button>
         <Button
           :variant="state.danger ? 'destructive' : 'default'"
-          class="flex-1 h-10 text-sm font-medium"
+          class="flex-1 h-11 text-sm"
           @click="respond(true)"
         >
           {{ state.confirmText || '确定' }}

frondend/src/components/GuideOverlay.vue

@@ -55,7 +55,7 @@ const steps: GuideStep[] = [
     title: '先绑定设备码',
     targets: ['[data-guide="profile-device-code"]'],
     descByKind: () =>
-      '签到任务依赖设备码执行。到这一栏点「重新绑定」用手机扫码授权，或点「随机」直接生成设备码。\n注意：随机设备码与真实手机不一致，执行签到时现有手机会提示「频繁切换设备」无法签到，建议优先扫码授权。',
+      '签到任务依赖设备码执行。到这一栏点「去绑定 / 重绑」用手机扫码授权，或点「随机」直接生成设备码。\n注意：随机设备码与真实手机不一致，执行签到时现有手机会提示「频繁切换设备」无法签到，建议优先扫码授权。',
   },
   {
     tab: 'profile',
@@ -63,15 +63,15 @@ const steps: GuideStep[] = [
     targets: ['[data-guide="profile-fill-invite"]', '[data-guide="profile-invite-row"]'],
     descByKind: (kind) =>
       kind === 'profile-fill-invite'
-        ? '如果你有好友的邀请码，点这里的「填写邀请码」输入后，你和好友都能获得奖励积分。'
-        : '如果你有好友的邀请码，可在「推广信息」里点「填写邀请码」输入，你和好友都能获得奖励积分。',
+        ? '如果你有好友的邀请码，点这里填写后，你和好友都能获得奖励积分。'
+        : '如果你有好友的邀请码，可在「邀请同学」卡片里点「点此填写」输入，你和好友都能获得奖励积分。',
   },
   {
     tab: 'profile',
     title: '兑换积分',
-    targets: ['[data-guide="profile-invite-redeem"]', '[data-guide="profile-invite-row"]'],
+    targets: ['[data-guide="profile-invite-redeem"]'],
     descByKind: () =>
-      '邀请好友可赚取积分，积分满 1 后，点「推广信息」里的「兑换」按钮即可换成执行次数，1 积分 = 1 次，可重复兑换。',
+      '邀请好友可赚取积分，积分满 1 后，点这个「邀请积分」格子即可换成执行次数，1 积分 = 1 次，可重复兑换。',
   },
   {
     tab: 'home',
@@ -93,15 +93,12 @@ const steps: GuideStep[] = [
   {
     tab: 'profile',
     title: '推广赚积分',
-    targets: ['[data-guide="profile-invite-copy"]', '[data-guide="profile-fill-invite"]', '[data-guide="profile-invite-generate"]'],
+    targets: ['[data-guide="profile-invite-copy"]', '[data-guide="profile-fill-invite"]'],
     descByKind: (kind) => {
       const inviter = fmtReward(props.inviterRewardPerInvite)
       const invitee = fmtReward(props.inviteeRewardPerInvite)
       if (kind === 'profile-fill-invite') {
-        return '你还没填写邀请码。点「填写邀请码」输入好友的邀请码，双方都能获得奖励积分。'
-      }
-      if (kind === 'profile-invite-generate') {
-        return '把你的邀请码分享给同学，TA 在「我的」里填写你的邀请码后，你们都能获得奖励积分，多邀多得。'
+        return '你还没填写邀请码。点「点此填写」输入好友的邀请码，双方都能获得奖励积分。'
       }
       if (inviter !== null && invitee !== null) {
         return `把邀请码复制发给同学，TA 在「我的」填写后，你可得 ${inviter} 积分、TA 得 ${invitee} 积分，多邀多得，随时可兑换执行次数。`
@@ -114,7 +111,7 @@ const steps: GuideStep[] = [
     title: 'VIP 会员：执行不限次',
     targets: ['[data-guide="profile-vip-btn"]'],
     descByKind: () =>
-      '普通执行次数：每执行一次任务扣 1 次，用完需要再兑换。\nVIP 会员：有效期内执行任务不限次数（无限次），不再扣执行次数。\n点「续费 VIP」输入 VIP 兑换码即可开通，到期时间自动顺延。',
+      '普通执行次数：每执行一次任务扣 1 次，用完需要再兑换。\nVIP 会员：有效期内执行任务不限次数（无限次），不再扣执行次数。\n点会员卡上的「开通 VIP / 续费」输入 VIP 兑换码即可开通，到期时间自动顺延。',
   },
 ]
 
@@ -329,7 +326,9 @@ async function locate() {
   // 排在目标上/下方，不会停留在顶部兜底样式遮住目标
   measure(el)
   try {
-    if (moved) el.scrollIntoView({ block: 'center', inline: 'center' })
+    // 只做纵向居中（inline: 'nearest'）：inline: 'center' 会把 overflow:hidden 的祖先
+    // （如头卡装饰光斑超出边界的容器）横向滚动，导致整块内容向左错位
+    if (moved) el.scrollIntoView({ block: 'center', inline: 'nearest' })
   } catch {
     // ignore（个别浏览器不支持 options）
   }
@@ -540,11 +539,11 @@ const bubbleStyle = computed(() => {
             <div class="flex-1 min-w-0 mr-2">
               <div class="flex items-center gap-1.5">
                 <span class="text-sm font-medium text-gray-900 whitespace-nowrap">晚签到</span>
-                <span class="text-[10px] px-1.5 py-0.5 rounded-full bg-purple-100 text-purple-600 whitespace-nowrap">晚归签到</span>
+                <span class="text-xs px-1.5 py-0.5 rounded-full bg-purple-100 text-purple-600 whitespace-nowrap">晚归签到</span>
               </div>
               <div class="flex items-center gap-2 mt-1">
-                <span class="text-[10px] px-1.5 py-0.5 rounded-full font-medium bg-amber-100 text-amber-600 whitespace-nowrap">待签到</span>
-                <span class="text-[10px] text-gray-400 whitespace-nowrap">示例任务</span>
+                <span class="text-xs px-1.5 py-0.5 rounded-full font-medium bg-amber-100 text-amber-600 whitespace-nowrap">待签到</span>
+                <span class="text-xs text-gray-400 whitespace-nowrap">示例任务</span>
               </div>
             </div>
             <button
@@ -563,7 +562,7 @@ const bubbleStyle = computed(() => {
         <div ref="bubbleEl" :style="bubbleStyle" class="guide-bubble absolute z-10">
           <!-- 顶部：标识 + 步骤 + 跳过 -->
           <div class="flex items-center gap-2">
-            <span class="flex items-center gap-1 text-[10px] font-semibold text-blue-600 flex-shrink-0">
+            <span class="flex items-center gap-1 text-xs font-semibold text-blue-600 flex-shrink-0">
               <Sparkles class="w-3 h-3" />
               新手引导
             </span>
@@ -586,7 +585,7 @@ const bubbleStyle = computed(() => {
 
           <!-- 标题与说明 -->
           <h3 class="text-[15px] font-bold text-gray-900 mt-2.5">{{ current.title }}</h3>
-          <p v-if="waitingTarget" class="text-[11px] text-blue-500 mt-1.5 font-medium">正在为你切换到目标页面…</p>
+          <p v-if="waitingTarget" class="text-xs text-blue-500 mt-1.5 font-medium">正在为你切换到目标页面…</p>
           <p class="text-xs text-gray-500 leading-relaxed whitespace-pre-line mt-1.5 guide-desc">{{ guideDesc }}</p>
 
           <!-- 操作按钮 -->

frondend/src/components/PinnedNotice.vue

@@ -0,0 +1,267 @@
+<script setup lang="ts">
+// 置顶公告条（首页顶部）。
+// 交互：一次展示一条，每 4 秒向上翻页切换；内容过长时先横向缓慢滚动到末尾再翻页；
+// 点击整条打开底部面板查看全部置顶公告全文。页面切到后台 / 系统「减弱动态效果」时暂停轮播。
+import { computed, nextTick, onMounted, onUnmounted, ref, watch } from 'vue'
+import { Megaphone, ChevronRight, X } from 'lucide-vue-next'
+import AppDialog from '@/components/ui/dialog/AppDialog.vue'
+import type { PinnedAnnouncement } from '@/api/announcement'
+
+const props = defineProps<{ items: PinnedAnnouncement[] }>()
+
+const index = ref(0)
+const showAll = ref(false)
+const current = computed(() => props.items[index.value] || null)
+
+// —— 长文本横向滚动：测量溢出宽度，按 40px/s 速度滚动到末尾 ——
+const viewport = ref<HTMLElement | null>(null)
+const track = ref<HTMLElement | null>(null)
+const overflow = ref(0)
+const DWELL = 4000 // 短内容停留时长
+const SCROLL_SPEED = 55 // px/s（长文本按此速度滚动，总时长再夹在 3–9 秒之间）
+const reduceMotion = typeof window !== 'undefined' && window.matchMedia?.('(prefers-reduced-motion: reduce)').matches
+
+let timer: ReturnType<typeof setTimeout> | null = null
+
+function clearTimer() {
+  if (timer) clearTimeout(timer)
+  timer = null
+}
+
+async function measure() {
+  overflow.value = 0
+  await nextTick()
+  const v = viewport.value
+  const t = track.value
+  if (!v || !t) return
+  overflow.value = Math.max(0, Math.ceil(t.scrollWidth - v.clientWidth))
+}
+
+/** 当前条展示时长：短内容固定停留；长内容 = 起步停顿 + 滚动时长 + 末尾停顿 */
+const scrollDuration = computed(() => (overflow.value > 0 ? Math.min(9, Math.max(3, overflow.value / SCROLL_SPEED)) : 0))
+
+function schedule() {
+  clearTimer()
+  if (props.items.length < 2 && overflow.value === 0) return
+  if (reduceMotion || document.visibilityState !== 'visible' || showAll.value) return
+  const ms = overflow.value > 0 ? 1000 + scrollDuration.value * 1000 + 1200 : DWELL
+  timer = setTimeout(next, ms)
+}
+
+function next() {
+  if (props.items.length > 1) {
+    index.value = (index.value + 1) % props.items.length
+  } else {
+    // 只有一条且内容过长：重置后重新滚动一遍
+    overflow.value = 0
+    void measure().then(schedule)
+  }
+}
+
+watch(index, async () => {
+  await measure()
+  schedule()
+})
+
+watch(
+  () => props.items,
+  async () => {
+    if (index.value >= props.items.length) index.value = 0
+    await measure()
+    schedule()
+  },
+  { deep: false },
+)
+
+function onVisibility() {
+  if (document.visibilityState === 'visible') schedule()
+  else clearTimer()
+}
+
+function openAll() {
+  showAll.value = true
+  clearTimer()
+}
+
+function closeAll(v: boolean) {
+  if (v) return
+  showAll.value = false
+  schedule()
+}
+
+function fmtDate(s: string) {
+  if (!s) return ''
+  const d = new Date(s)
+  if (Number.isNaN(d.getTime())) return ''
+  return `${d.getMonth() + 1}月${d.getDate()}日`
+}
+
+onMounted(async () => {
+  await measure()
+  schedule()
+  document.addEventListener('visibilitychange', onVisibility)
+  window.addEventListener('resize', measure)
+})
+
+onUnmounted(() => {
+  clearTimer()
+  document.removeEventListener('visibilitychange', onVisibility)
+  window.removeEventListener('resize', measure)
+})
+</script>
+
+<template>
+  <button
+    v-if="current"
+    type="button"
+    class="press notice-card w-full flex items-center gap-2.5 rounded-2xl pl-2 pr-2.5 py-2 text-left"
+    :aria-label="`置顶公告：${current.title}，点击查看全部`"
+    @click="openAll"
+  >
+    <!-- 图标：柠檬色圆底 + 轻微摆动 -->
+    <span class="notice-icon w-8 h-8 rounded-xl flex items-center justify-center flex-shrink-0">
+      <Megaphone class="w-4 h-4" :stroke-width="2.4" />
+    </span>
+
+    <!-- 内容视窗：上下翻页切换 + 长文本横向滚动 -->
+    <span ref="viewport" class="relative flex-1 min-w-0 h-5 overflow-hidden">
+      <Transition name="notice-flip">
+        <span
+          :key="current.id + '-' + index"
+          class="absolute inset-0 flex items-center"
+        >
+          <span
+            ref="track"
+            class="notice-track whitespace-nowrap text-[13px] leading-5"
+            :class="overflow > 0 && 'is-scrolling'"
+            :style="overflow > 0 ? { '--notice-shift': `-${overflow}px`, '--notice-dur': `${scrollDuration}s` } : undefined"
+          >
+            <span class="notice-title font-semibold">{{ current.title }}</span>
+            <span class="notice-sep mx-1.5">·</span>
+            <span class="notice-text">{{ current.content }}</span>
+          </span>
+        </span>
+      </Transition>
+    </span>
+
+    <!-- 计数 + 箭头 -->
+    <span class="flex items-center gap-0.5 flex-shrink-0">
+      <span v-if="items.length > 1" class="notice-count text-xs tabular-nums font-medium">{{ index + 1 }}/{{ items.length }}</span>
+      <ChevronRight class="notice-arrow w-4 h-4" />
+    </span>
+  </button>
+
+  <!-- 全部置顶公告（底部面板） -->
+  <AppDialog
+    :open="showAll"
+    overlay-class="bg-black/40"
+    panel-class="sm:max-w-sm max-h-[75vh] shadow-2xl"
+    :fade="true"
+    title="置顶公告"
+    @update:open="closeAll"
+  >
+    <div class="flex justify-center pt-2.5 pb-1 flex-shrink-0">
+      <div class="w-9 h-1 rounded-full bg-gray-300" />
+    </div>
+    <div class="flex items-center justify-between px-5 py-2 flex-shrink-0">
+      <div class="flex items-center gap-2">
+        <span class="notice-icon w-8 h-8 rounded-xl flex items-center justify-center">
+          <Megaphone class="w-4 h-4" :stroke-width="2.4" />
+        </span>
+        <span class="font-bold text-gray-900 text-base">置顶公告</span>
+      </div>
+      <button class="w-8 h-8 rounded-full hover:bg-gray-100 flex items-center justify-center" aria-label="关闭" @click="closeAll(false)">
+        <X class="w-4 h-4 text-gray-400" />
+      </button>
+    </div>
+    <div class="flex-1 overflow-y-auto px-5 pt-1 pb-6 space-y-3">
+      <article
+        v-for="(a, i) in items"
+        :key="a.id"
+        class="rounded-2xl border p-4"
+        :class="i === index ? 'border-amber-200 bg-amber-50' : 'border-gray-100 bg-gray-50'"
+      >
+        <div class="flex items-start justify-between gap-3 mb-1.5">
+          <h4 class="text-sm font-semibold text-gray-900 leading-snug">{{ a.title }}</h4>
+          <span v-if="fmtDate(a.createdAt)" class="text-xs text-gray-400 flex-shrink-0 mt-0.5">{{ fmtDate(a.createdAt) }}</span>
+        </div>
+        <p class="text-sm text-gray-600 leading-relaxed whitespace-pre-wrap break-words">{{ a.content }}</p>
+      </article>
+    </div>
+  </AppDialog>
+</template>
+
+<style scoped>
+/* 卡片：柠檬暖色玻璃（亮）/ 暗金半透明（暗），与品牌薄荷色区分开，表达「提醒」语义 */
+.notice-card {
+  background: linear-gradient(135deg, rgb(255 246 214 / 0.92), rgb(255 250 235 / 0.86));
+  border: 1px solid rgb(245 189 46 / 0.32);
+  box-shadow: 0 1px 2px rgb(138 90 0 / 0.06), 0 6px 16px rgb(227 160 8 / 0.1);
+  -webkit-backdrop-filter: blur(12px) saturate(160%);
+  backdrop-filter: blur(12px) saturate(160%);
+}
+.notice-icon {
+  color: #8a5a00;
+  background: linear-gradient(135deg, #ffe08a, #f5bd2e);
+  box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.6);
+  animation: notice-wiggle 4s ease-in-out infinite;
+  transform-origin: 60% 60%;
+}
+.notice-title { color: #6e4700; }
+.notice-sep { color: rgb(138 90 0 / 0.7); }
+.notice-text { color: #8a5a00; }
+.notice-count { color: rgb(138 90 0 / 0.75); }
+.notice-arrow { color: rgb(138 90 0 / 0.55); }
+
+/* 喇叭轻摆：每 4 秒摆两下，吸引注意但不吵闹 */
+@keyframes notice-wiggle {
+  0%, 86%, 100% { transform: rotate(0); }
+  89% { transform: rotate(-12deg); }
+  92% { transform: rotate(9deg); }
+  95% { transform: rotate(-5deg); }
+}
+
+/* 长文本：起步停顿 1s → 匀速滚到末尾 → 停住（翻页由脚本计时） */
+.notice-track.is-scrolling {
+  animation: notice-scroll var(--notice-dur, 6s) linear 1s forwards;
+}
+@keyframes notice-scroll {
+  to { transform: translateX(var(--notice-shift, 0)); }
+}
+
+/* 上下翻页切换 */
+.notice-flip-enter-active,
+.notice-flip-leave-active {
+  transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.35s ease;
+}
+.notice-flip-enter-from {
+  transform: translateY(100%);
+  opacity: 0;
+}
+.notice-flip-leave-to {
+  transform: translateY(-100%);
+  opacity: 0;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .notice-icon,
+  .notice-track.is-scrolling {
+    animation: none;
+  }
+}
+</style>
+
+<style>
+/* 暗色覆盖：放在非 scoped 块里（scoped 中的 :global(.dark) .x 会被编译成仅 `.dark`，规则失效）；
+   用 html.dark 提高优先级，稳定压过 scoped 的 .x[data-v] */
+html.dark .notice-card {
+  background: linear-gradient(135deg, rgb(64 51 26 / 0.85), rgb(51 42 22 / 0.8));
+  border-color: rgb(247 197 74 / 0.22);
+  box-shadow: 0 6px 18px rgb(0 0 0 / 0.3);
+}
+html.dark .notice-title { color: #ffe39a; }
+html.dark .notice-sep { color: rgb(255 217 120 / 0.65); }
+html.dark .notice-text { color: #f2d48a; }
+html.dark .notice-count { color: rgb(255 217 120 / 0.7); }
+html.dark .notice-arrow { color: rgb(255 217 120 / 0.5); }
+</style>

frondend/src/components/QrScanner.vue

@@ -0,0 +1,242 @@
+<script setup lang="ts">
+// 全屏摄像头扫码（查寝二维码等）。
+// 流程：getUserMedia 打开后置摄像头 → 每 ~120ms 截取取景框区域 → jsQR 识别 → 命中即回调并关闭。
+// 不支持摄像头（非 https、WebView 未授权、无设备）时显示原因，并提供「从相册选择」回退到原有图片解析。
+import { onBeforeUnmount, onMounted, ref } from 'vue'
+import jsQR from 'jsqr'
+import { X, ImagePlus, Flashlight, CameraOff } from 'lucide-vue-next'
+
+const emit = defineEmits<{
+  (e: 'result', text: string): void
+  (e: 'pick'): void
+  (e: 'close'): void
+}>()
+
+const videoEl = ref<HTMLVideoElement | null>(null)
+const state = ref<'starting' | 'scanning' | 'error'>('starting')
+const errMsg = ref('')
+const torchOn = ref(false)
+const torchSupported = ref(false)
+
+let stream: MediaStream | null = null
+let track: MediaStreamTrack | null = null
+let timer: ReturnType<typeof setTimeout> | null = null
+let canvas: HTMLCanvasElement | null = null
+let stopped = false
+
+/** 环境自检：给出可操作的失败原因，而不是笼统的「打开失败」 */
+function unsupportedReason(): string {
+  if (!window.isSecureContext && location.hostname !== 'localhost') {
+    return '当前页面不是 HTTPS，浏览器禁止调用摄像头。请用 https 地址打开，或改用「从相册选择」。'
+  }
+  if (!navigator.mediaDevices?.getUserMedia) {
+    return '当前浏览器不支持调用摄像头，请改用「从相册选择」。'
+  }
+  return ''
+}
+
+function failMsg(e: unknown): string {
+  const name = (e as { name?: string })?.name || ''
+  if (name === 'NotAllowedError' || name === 'SecurityError') {
+    return '摄像头权限被拒绝。请在浏览器地址栏或系统设置中允许摄像头权限后重试。'
+  }
+  if (name === 'NotFoundError' || name === 'OverconstrainedError') {
+    return '未检测到可用摄像头，请改用「从相册选择」。'
+  }
+  if (name === 'NotReadableError') {
+    return '摄像头被其他应用占用，请关闭后重试。'
+  }
+  return '摄像头打开失败，请改用「从相册选择」。'
+}
+
+async function start() {
+  const reason = unsupportedReason()
+  if (reason) {
+    state.value = 'error'
+    errMsg.value = reason
+    return
+  }
+  try {
+    // facingMode 用 ideal：部分设备没有后置摄像头，exact 会直接失败
+    stream = await navigator.mediaDevices.getUserMedia({
+      video: { facingMode: { ideal: 'environment' }, width: { ideal: 1280 }, height: { ideal: 720 } },
+      audio: false,
+    })
+    if (stopped) {
+      release()
+      return
+    }
+    track = stream.getVideoTracks()[0] || null
+    torchSupported.value = !!(track?.getCapabilities?.() as { torch?: boolean } | undefined)?.torch
+    const v = videoEl.value
+    if (!v) return
+    v.srcObject = stream
+    await v.play().catch(() => {})
+    state.value = 'scanning'
+    tick()
+  } catch (e) {
+    state.value = 'error'
+    errMsg.value = failMsg(e)
+  }
+}
+
+/** 单帧识别：按整帧下采样识别。
+ *  不裁中心区：object-cover 下画面被放大裁切，二维码常常超出中心框而识别不到；
+ *  取景框只作视觉引导，实际整幅画面内的码都能扫到（与微信/支付宝的体感一致）。
+ *  两档缩放：先 480（快），失败再 720（远距离小码更清晰）。 */
+function scanFrame(): string | null {
+  const v = videoEl.value
+  if (!v || v.readyState < 2 || !v.videoWidth) return null
+  if (!canvas) canvas = document.createElement('canvas')
+  const ctx = canvas.getContext('2d', { willReadFrequently: true })
+  if (!ctx) return null
+  for (const target of [480, 720]) {
+    const scale = Math.min(1, target / Math.max(v.videoWidth, v.videoHeight))
+    const w = Math.max(1, Math.round(v.videoWidth * scale))
+    const h = Math.max(1, Math.round(v.videoHeight * scale))
+    canvas.width = w
+    canvas.height = h
+    ctx.drawImage(v, 0, 0, w, h)
+    const data = ctx.getImageData(0, 0, w, h)
+    const code = jsQR(data.data, data.width, data.height, { inversionAttempts: 'attemptBoth' })
+    if (code?.data) return code.data
+    // 原始分辨率已小于首档时无需再试更大尺寸
+    if (scale >= 1) break
+  }
+  return null
+}
+
+function tick() {
+  if (stopped) return
+  let text: string | null = null
+  try {
+    text = scanFrame()
+  } catch {
+    // 单帧失败（如设备暂时无画面）忽略，下一帧继续
+  }
+  if (text) {
+    emit('result', text)
+    return
+  }
+  timer = setTimeout(tick, 120)
+}
+
+async function toggleTorch() {
+  if (!track || !torchSupported.value) return
+  try {
+    await track.applyConstraints({ advanced: [{ torch: !torchOn.value }] } as unknown as MediaTrackConstraints)
+    torchOn.value = !torchOn.value
+  } catch {
+    torchSupported.value = false
+  }
+}
+
+function release() {
+  if (timer) clearTimeout(timer)
+  timer = null
+  if (track && torchOn.value) {
+    track.applyConstraints({ advanced: [{ torch: false }] } as unknown as MediaTrackConstraints).catch(() => {})
+  }
+  stream?.getTracks().forEach((t) => t.stop())
+  stream = null
+  track = null
+  if (videoEl.value) videoEl.value.srcObject = null
+}
+
+onMounted(start)
+onBeforeUnmount(() => {
+  stopped = true
+  release()
+})
+</script>
+
+<template>
+  <!-- 全屏置顶：扫码需要大取景区域，且要盖住底部 TabBar -->
+  <Teleport to="body">
+    <!-- z-[400] 高于 AppDialog(≤300)；pointer-events:auto 必须显式恢复：
+         reka 的 modal 弹窗会把 body 设为 pointer-events:none，只给弹窗面板恢复，
+         teleport 到 body 的本组件否则点不动（实测「从相册选择」被弹窗层拦截）。 -->
+    <div
+      class="fixed inset-0 z-[400] bg-black flex flex-col"
+      style="pointer-events: auto"
+      role="dialog"
+      aria-modal="true"
+      aria-label="扫描二维码"
+    >
+      <!-- 顶栏 -->
+      <div class="relative z-10 flex items-center gap-2 px-3 text-white" style="padding-top: calc(var(--safe-top) + 10px)">
+        <button class="w-10 h-10 flex items-center justify-center rounded-full bg-white/15 active:scale-95 transition-transform" aria-label="关闭" @click="emit('close')">
+          <X class="w-5 h-5" />
+        </button>
+        <p class="flex-1 text-center text-[15px] font-semibold">扫描二维码</p>
+        <button
+          v-if="torchSupported"
+          class="w-10 h-10 flex items-center justify-center rounded-full active:scale-95 transition-transform"
+          :class="torchOn ? 'bg-amber-300 text-amber-900' : 'bg-white/15'"
+          aria-label="手电筒"
+          @click="toggleTorch"
+        >
+          <Flashlight class="w-5 h-5" />
+        </button>
+        <span v-else class="w-10" />
+      </div>
+
+      <!-- 取景区 -->
+      <div class="relative flex-1 min-h-0 overflow-hidden">
+        <video ref="videoEl" class="absolute inset-0 w-full h-full object-cover" playsinline muted autoplay />
+
+        <!-- 取景框：仅视觉引导，识别用整帧（见 scanFrame） -->
+        <div v-if="state === 'scanning'" class="absolute inset-0 flex items-center justify-center">
+          <div class="relative w-[72%] aspect-square">
+            <div class="absolute inset-0 rounded-3xl ring-2 ring-white/70" />
+            <span class="absolute -top-px -left-px w-9 h-9 border-t-4 border-l-4 border-brand-400 rounded-tl-3xl" />
+            <span class="absolute -top-px -right-px w-9 h-9 border-t-4 border-r-4 border-brand-400 rounded-tr-3xl" />
+            <span class="absolute -bottom-px -left-px w-9 h-9 border-b-4 border-l-4 border-brand-400 rounded-bl-3xl" />
+            <span class="absolute -bottom-px -right-px w-9 h-9 border-b-4 border-r-4 border-brand-400 rounded-br-3xl" />
+            <div class="qr-laser absolute left-3 right-3 h-0.5 rounded-full bg-brand-400 shadow-[0_0_12px_2px_rgb(44_197_168/0.8)]" />
+          </div>
+        </div>
+
+        <!-- 启动中 -->
+        <div v-if="state === 'starting'" class="absolute inset-0 flex flex-col items-center justify-center text-white/90 gap-3">
+          <div class="w-9 h-9 rounded-full border-2 border-white/30 border-t-white animate-spin" />
+          <p class="text-sm">正在打开摄像头…</p>
+        </div>
+
+        <!-- 失败 -->
+        <div v-else-if="state === 'error'" class="absolute inset-0 flex flex-col items-center justify-center px-8 text-center gap-3">
+          <div class="w-14 h-14 rounded-2xl bg-white/10 flex items-center justify-center">
+            <CameraOff class="w-7 h-7 text-white/80" />
+          </div>
+          <p class="text-sm text-white/90 leading-relaxed">{{ errMsg }}</p>
+        </div>
+      </div>
+
+      <!-- 底部操作 -->
+      <div class="relative z-10 px-6 pb-[calc(env(safe-area-inset-bottom)+20px)] pt-4 text-center">
+        <p v-if="state === 'scanning'" class="text-xs text-white/70 mb-3">将二维码放入框内，自动识别</p>
+        <button
+          class="w-full h-12 rounded-full bg-white/15 text-white text-sm font-semibold flex items-center justify-center gap-2 active:scale-[0.98] transition-transform"
+          @click="emit('pick')"
+        >
+          <ImagePlus class="w-4 h-4" />
+          从相册选择图片
+        </button>
+      </div>
+    </div>
+  </Teleport>
+</template>
+
+<style scoped>
+/* 扫描线上下往复 */
+@keyframes qr-laser {
+  0%, 100% { top: 8%; }
+  50% { top: 92%; }
+}
+.qr-laser {
+  animation: qr-laser 2.4s ease-in-out infinite;
+}
+@media (prefers-reduced-motion: reduce) {
+  .qr-laser { animation: none; top: 50%; }
+}
+</style>

frondend/src/components/UpdateChecker.vue

@@ -5,8 +5,11 @@
 import { onMounted, onUnmounted, ref } from 'vue'
 import AppDialog from '@/components/ui/dialog/AppDialog.vue'
 
-const CHECK_INTERVAL = 5 * 60 * 1000 // 5 分钟
-const FIRST_DELAY = 30 * 1000 // 启动 30 秒后首次检查（避免与首屏请求抢占）
+const CHECK_INTERVAL = 2 * 60 * 1000 // 2 分钟
+const FIRST_DELAY = 10 * 1000 // 启动 10 秒后首次检查（避免与首屏请求抢占）
+// 回到前台时补查：手机浏览器/App 内 WebView 切后台会暂停定时器，用户切回来时立即检查一次；
+// 两次检查至少间隔 MIN_GAP，避免频繁切换造成请求风暴
+const MIN_GAP = 20 * 1000
 const DISMISS_KEY = 'xz_update_dismissed_version'
 
 const showUpdate = ref(false)
@@ -16,6 +19,7 @@ let timer: ReturnType<typeof setTimeout> | null = null
 let stopped = false
 let prompting = false
 let pendingVersion = ''
+let lastCheckAt = 0
 
 /** 从 HTML 文本中提取 /assets/ 下的 js/css 资源名 */
 function extractAssets(html: string): Set<string> {
@@ -43,7 +47,9 @@ function collectCurrentAssets(): Set<string> {
 }
 
 async function checkUpdate() {
-  if (stopped || prompting) return
+  if (stopped || prompting || showUpdate.value) return
+  lastCheckAt = Date.now()
+  prompting = true
   try {
     // 版本探测必须绕过 HTTP 缓存（后端 index.html 有 1 小时 MaxAge），故带时间戳参数
     const res = await fetch(`/?_v=${Date.now()}`, {
@@ -63,7 +69,6 @@ async function checkUpdate() {
     if (sessionStorage.getItem(DISMISS_KEY) === newVersion) return // 本会话已提示过
 
     pendingVersion = newVersion
-    prompting = true
     showUpdate.value = true
   } catch {
     // 网络异常静默跳过，等待下一轮
@@ -101,15 +106,30 @@ function onDialogOpenChange(value: boolean) {
   dismiss()
 }
 
+/** 页面回到前台（切回标签页 / 从后台唤起 App / bfcache 恢复）时补查一次 */
+function onForeground() {
+  if (document.visibilityState !== 'visible') return
+  if (Date.now() - lastCheckAt < MIN_GAP) return
+  void checkUpdate()
+}
+
 onMounted(() => {
   currentAssets.clear()
   collectCurrentAssets().forEach((a) => currentAssets.add(a))
+  // 刚加载的页面本身就是最新版：以挂载时刻为基线，避免首屏 focus/pageshow 立即触发探测
+  lastCheckAt = Date.now()
   schedule(FIRST_DELAY)
+  document.addEventListener('visibilitychange', onForeground)
+  window.addEventListener('focus', onForeground)
+  window.addEventListener('pageshow', onForeground)
 })
 
 onUnmounted(() => {
   stopped = true
   if (timer) clearTimeout(timer)
+  document.removeEventListener('visibilitychange', onForeground)
+  window.removeEventListener('focus', onForeground)
+  window.removeEventListener('pageshow', onForeground)
 })
 </script>
 
@@ -130,13 +150,13 @@ onUnmounted(() => {
     </p>
     <div class="flex gap-2">
       <button
-        class="flex-1 py-2.5 rounded-lg border border-gray-200 text-sm text-gray-600 active:bg-gray-50"
+        class="press flex-1 py-3 rounded-full border border-gray-200 text-sm font-semibold text-gray-600 active:bg-gray-50"
         @click="dismiss"
       >
         稍后
       </button>
       <button
-        class="flex-1 py-2.5 rounded-lg bg-blue-600 text-white text-sm font-medium active:bg-blue-700"
+        class="press flex-1 py-3 rounded-full bg-brand-gradient text-white text-sm font-semibold shadow-md shadow-brand-500/20"
         @click="reloadNow"
       >
         立即刷新

frondend/src/components/ui/button.ts

@@ -3,25 +3,25 @@ import { cva, type VariantProps } from 'class-variance-authority'
 export { default as Button } from './button.vue'
 
 export const buttonVariants = cva(
-  'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0',
+  'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-full text-sm font-semibold transition-all duration-200 active:scale-[0.97] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/60 focus-visible:ring-offset-1 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0',
   {
     variants: {
       variant: {
-        default: 'bg-primary text-primary-foreground shadow hover:bg-primary/90',
+        default: 'bg-primary text-primary-foreground shadow-md shadow-brand-500/20 hover:brightness-105',
         destructive:
-          'bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90',
+          'bg-destructive text-destructive-foreground shadow-md shadow-red-500/20 hover:brightness-105',
         outline:
-          'border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground',
+          'border border-input bg-card shadow-sm hover:bg-accent hover:text-accent-foreground',
         secondary:
-          'bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80',
+          'bg-secondary text-secondary-foreground hover:bg-gray-200',
         ghost: 'hover:bg-accent hover:text-accent-foreground',
         link: 'text-primary underline-offset-4 hover:underline',
       },
       size: {
-        default: 'h-9 px-4 py-2',
-        sm: 'h-8 rounded-md px-3 text-xs',
-        lg: 'h-10 rounded-md px-8',
-        icon: 'h-9 w-9',
+        default: 'h-10 px-5 py-2',
+        sm: 'h-8 px-3.5 text-xs',
+        lg: 'h-12 px-8 text-base',
+        icon: 'h-10 w-10',
       },
     },
     defaultVariants: {

frondend/src/components/ui/card.vue

@@ -9,7 +9,7 @@ const props = defineProps<Props>()
 </script>
 
 <template>
-  <div :class="cn('rounded-xl border bg-card text-card-foreground shadow', props.class)">
+  <div :class="cn('rounded-2xl border border-gray-100 bg-card text-card-foreground shadow-sm', props.class)">
     <slot />
   </div>
 </template>

frondend/src/components/ui/dialog/AppDialog.vue

@@ -104,7 +104,7 @@ function onEscapeKeyDown(e: KeyboardEvent) {
     <DialogPortal>
       <!-- 遮罩：reka 会自动加 pointer-events:auto 并响应「点遮罩关闭」 -->
       <DialogOverlay
-        :class="cn('fixed inset-0', props.overlayClass, props.zClass, props.fade && 'app-dialog-fade')"
+        :class="cn('fixed inset-0 app-dialog-overlay', props.overlayClass, props.zClass, props.fade && 'app-dialog-fade')"
       />
 
       <!-- 事件/焦点容器：本身不承载布局（零尺寸），只作为焦点/事件容器。
@@ -137,7 +137,7 @@ function onEscapeKeyDown(e: KeyboardEvent) {
             :class="
               cn(
                 'relative w-full bg-white flex flex-col overflow-hidden shadow-xl max-h-[85vh]',
-                props.variant === 'sheet' ? 'rounded-t-2xl sm:rounded-2xl' : 'rounded-2xl',
+                props.variant === 'sheet' ? 'rounded-t-3xl sm:rounded-3xl app-dialog-sheet' : 'rounded-3xl app-dialog-pop',
                 props.panelClass,
               )
             "
@@ -168,6 +168,42 @@ function onEscapeKeyDown(e: KeyboardEvent) {
 .app-dialog-fade[data-state='closed'] {
   animation: app-dialog-fade-out 0.2s ease;
 }
+/* 遮罩轻度虚化（iOS 弹层背景效果）；低端机仅 2px，开销可控；「减弱透明度」时关闭 */
+.app-dialog-overlay {
+  -webkit-backdrop-filter: blur(2px);
+  backdrop-filter: blur(2px);
+}
+@media (prefers-reduced-transparency: reduce) {
+  .app-dialog-overlay {
+    -webkit-backdrop-filter: none;
+    backdrop-filter: none;
+  }
+}
+/* 面板进场：sheet 自底部滑入，center 轻微放大弹出（仅进场；离场随容器一起淡出/卸载）。
+ * fill-mode 用 backwards：动画结束后不残留 transform，避免给内部 fixed 元素制造包含块。 */
+.app-dialog-sheet {
+  animation: app-dialog-sheet-in 0.36s cubic-bezier(0.22, 1, 0.36, 1) backwards;
+}
+.app-dialog-pop {
+  animation: app-dialog-pop-in 0.28s cubic-bezier(0.34, 1.36, 0.64, 1) backwards;
+}
+@media (min-width: 640px) {
+  .app-dialog-sheet {
+    animation-name: app-dialog-pop-in;
+  }
+}
+@keyframes app-dialog-sheet-in {
+  from {
+    transform: translateY(40%);
+    opacity: 0.4;
+  }
+}
+@keyframes app-dialog-pop-in {
+  from {
+    transform: scale(0.94);
+    opacity: 0;
+  }
+}
 @keyframes app-dialog-fade-in {
   from {
     opacity: 0;

frondend/src/components/ui/input.vue

@@ -31,7 +31,7 @@ function onInput(e: Event) {
     :placeholder="placeholder"
     :disabled="disabled"
     :class="cn(
-      'flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50',
+      'flex h-11 w-full rounded-xl border border-input bg-gray-50 px-3.5 py-1 text-sm transition-all file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:bg-card focus-visible:border-brand-400 focus-visible:ring-4 focus-visible:ring-brand-400/15 disabled:cursor-not-allowed disabled:opacity-50',
       props.class
     )"
     @input="onInput"

frondend/src/composables/useTheme.ts

@@ -1,21 +1,44 @@
-// 亮暗主题：按浏览器系统时间自动切换（18:00–次日 06:00 为暗色，其余亮色）。
-// 首屏防闪烁由 index.html 内联脚本完成（同一规则，渲染前预设 .dark）；
-// 本模块在应用启动后接管：立即校正一次，并按分钟轮询，跨过时间阈值时自动切换。
+// 亮暗主题：三档模式 —— auto（默认，按系统时间 18:00–次日 06:00 为暗色）/ light / dark。
+// 用户选择持久化在 localStorage（THEME_KEY）；首屏防闪烁由 index.html 内联脚本完成
+// （同一规则，渲染前预设 .dark）；本模块在应用启动后接管：立即校正一次，
+// auto 模式下按分钟轮询，跨过时间阈值时自动切换。
 // 切换载体为 <html> 上的 .dark class，配合 globals.css 中的暗色变量板生效。
+import { ref } from 'vue'
 
+export type ThemeMode = 'auto' | 'light' | 'dark'
+
+/** 与 index.html 内联脚本保持一致 */
+export const THEME_KEY = 'xz_theme'
 const DARK_START_HOUR = 18
 const DARK_END_HOUR = 6
-const THEME_COLOR_LIGHT = '#f5f5f5'
-const THEME_COLOR_DARK = '#15151f'
+const THEME_COLOR_LIGHT = '#f3faf7'
+const THEME_COLOR_DARK = '#0f1815'
 
 export function isDarkTime(date: Date = new Date()): boolean {
   const h = date.getHours()
   return h >= DARK_START_HOUR || h < DARK_END_HOUR
 }
 
-/** 应用当前时段对应主题，返回是否处于暗色 */
+function readMode(): ThemeMode {
+  try {
+    const v = localStorage.getItem(THEME_KEY)
+    if (v === 'light' || v === 'dark' || v === 'auto') return v
+  } catch {
+    // 隐私模式等场景 localStorage 不可用，按自动处理
+  }
+  return 'auto'
+}
+
+/** 当前主题模式（响应式，供设置入口绑定） */
+export const themeMode = ref<ThemeMode>(readMode())
+/** 当前是否处于暗色（响应式） */
+export const isDark = ref(false)
+
+/** 应用当前模式对应主题，返回是否处于暗色 */
 export function applyTheme(): boolean {
-  const dark = isDarkTime()
+  const mode = themeMode.value
+  const dark = mode === 'dark' || (mode === 'auto' && isDarkTime())
+  isDark.value = dark
   document.documentElement.classList.toggle('dark', dark)
   document
     .querySelector('meta[name="theme-color"]')
@@ -23,9 +46,21 @@ export function applyTheme(): boolean {
   return dark
 }
 
+/** 切换主题模式并持久化 */
+export function setThemeMode(mode: ThemeMode): void {
+  themeMode.value = mode
+  try {
+    if (mode === 'auto') localStorage.removeItem(THEME_KEY)
+    else localStorage.setItem(THEME_KEY, mode)
+  } catch {
+    // 忽略持久化失败，本次会话内仍生效
+  }
+  applyTheme()
+}
+
 let timer: ReturnType<typeof setInterval> | null = null
 
-/** 应用入口调用：立即应用主题并启动分钟级自动切换 */
+/** 应用入口调用：立即应用主题并启动分钟级自动切换（仅 auto 模式下会产生变化） */
 export function initTheme(): void {
   applyTheme()
   if (timer) return

frondend/src/layouts/MobileLayout.vue

@@ -26,6 +26,70 @@ const tabs = [
 ]
 
 const activeTab = ref(route.name as string || 'home')
+const activeTabIndex = computed(() => tabs.findIndex((t) => t.name === activeTab.value))
+
+// 悬浮顶栏：仅首页与请/销假页显示
+const showHeader = computed(() => activeTab.value === 'home' || activeTab.value === 'leave')
+
+// 问候语（按本地时间）
+const greeting = computed(() => {
+  const h = new Date().getHours()
+  if (h < 6) return '夜深了'
+  if (h < 11) return '早上好'
+  if (h < 14) return '中午好'
+  if (h < 18) return '下午好'
+  return '晚上好'
+})
+
+// 滚动联动：内容离开顶部 → 顶栏显出玻璃底；向下滚动 → 胶囊 TabBar 收窄，向上滚动 → 展开。
+// 防抖动规则（避免"刚缩就弹回"）：
+//   1. 页面可滚动距离不足 COLLAPSE_MIN_RANGE（几乎不能滚）时不收窄；只要能正常滚动，各页统一收窄；
+//   2. scrollTop 夹在 [0, max]：iOS 顶/底回弹产生的越界位移不算反向滚动；
+//   3. 同一方向连续滚动超过 DIR_THRESHOLD 才切换状态（方向改变时重设起点），
+//      小幅来回抖动不会触发；
+//   4. 回到顶部附近（< TOP_ZONE）始终展开；到达底部不再强制展开（保持当前状态）。
+const COLLAPSE_MIN_RANGE = 80
+const DIR_THRESHOLD = 24
+const TOP_ZONE = 24
+const scrollEl = ref<HTMLElement | null>(null)
+const scrolled = ref(false)
+const tabCollapsed = ref(false)
+let lastScrollTop = 0
+let dirAnchor = 0
+let lastDir = 0
+function onContentScroll() {
+  const el = scrollEl.value
+  if (!el) return
+  const max = Math.max(0, el.scrollHeight - el.clientHeight)
+  const top = Math.min(Math.max(el.scrollTop, 0), max)
+  scrolled.value = top > 4
+  if (max < COLLAPSE_MIN_RANGE || top < TOP_ZONE) {
+    tabCollapsed.value = false
+    lastScrollTop = dirAnchor = top
+    lastDir = 0
+    return
+  }
+  const dir = Math.sign(top - lastScrollTop)
+  if (dir !== 0 && dir !== lastDir) {
+    dirAnchor = lastScrollTop
+    lastDir = dir
+  }
+  if (dir > 0 && top - dirAnchor > DIR_THRESHOLD) tabCollapsed.value = true
+  else if (dir < 0 && dirAnchor - top > DIR_THRESHOLD) tabCollapsed.value = false
+  lastScrollTop = top
+}
+
+// 切页回到顶部并复位滚动联动状态（各页共享同一滚动容器）
+watch(
+  () => route.name,
+  () => {
+    if (scrollEl.value) scrollEl.value.scrollTop = 0
+    lastScrollTop = dirAnchor = lastDir = 0
+    scrolled.value = false
+    tabCollapsed.value = false
+  },
+  { flush: 'post' },
+)
 
 // 路由变化时同步底部 tab 高亮；回到首页时尝试加载公告强制弹窗（若引导已完成）
 watch(() => route.name, (name) => {
@@ -257,51 +321,93 @@ onUnmounted(() => {
 </script>
 
 <template>
-  <div class="flex flex-col h-full">
-    <!-- 顶部用户信息栏（首页与请/销假页显示，两页保持一致） -->
-    <div v-if="activeTab === 'home' || activeTab === 'leave'" class="flex-shrink-0 bg-gradient-to-r from-blue-500 to-blue-600 text-white px-4 pt-3 pb-3">
+  <div class="relative flex flex-col h-full">
+    <!-- 顶部用户信息栏（首页与请/销假页显示，两页保持一致）。
+         悬浮于内容之上：顶部时透明融入背景光斑，内容滚动后渐显液态玻璃底与细分隔线 -->
+    <div
+      v-if="showHeader"
+      class="absolute inset-x-0 top-0 z-30 px-4 pb-3 transition-[background-color,box-shadow,backdrop-filter] duration-300"
+      :class="scrolled ? 'glass-bar shadow-[0_1px_0_rgb(14_40_34/0.06)] dark:shadow-[0_1px_0_rgb(255_255_255/0.06)]' : ''"
+      style="padding-top: calc(var(--safe-top) + 16px)"
+    >
       <div v-if="userInfo" class="flex items-center gap-3">
-        <div class="w-10 h-10 rounded-full bg-white/20 flex items-center justify-center flex-shrink-0 overflow-hidden">
+        <div class="w-11 h-11 rounded-full bg-brand-gradient ring-2 ring-white shadow-md shadow-brand-500/20 flex items-center justify-center flex-shrink-0 overflow-hidden dark:ring-gray-200">
           <img v-show="userInfo.avatar && !avatarFailed" :src="userInfo.avatar" class="w-full h-full object-cover" @error="avatarFailed = true" />
-          <User v-if="!userInfo.avatar || avatarFailed" class="w-5 h-5 text-white" />
+          <span v-if="!userInfo.avatar || avatarFailed" class="text-base font-bold text-white">{{ (userInfo.realName || userInfo.username || '?')[0] }}</span>
         </div>
         <div class="flex-1 min-w-0">
-          <p class="font-semibold text-sm truncate">{{ userInfo.realName || userInfo.username }}</p>
-          <p class="text-xs text-white/70 truncate">{{ userInfo.schoolName }}</p>
+          <p class="text-xs text-gray-500 truncate">{{ greeting }} · {{ userInfo.schoolName }}</p>
+          <p class="text-[17px] font-bold text-gray-900 tracking-tight truncate">{{ userInfo.realName || userInfo.username }}</p>
         </div>
         <!-- 公告铃铛（首页与请/销假页均显示） -->
-        <button class="relative w-9 h-9 rounded-full bg-white/15 flex items-center justify-center hover:bg-white/25 transition-colors flex-shrink-0" @click="openAnnouncementPanel">
-          <Bell class="w-5 h-5 text-white" />
-          <span v-if="totalUnread > 0" class="absolute -top-0.5 -right-0.5 min-w-[16px] h-4 px-1 rounded-full bg-red-500 text-white text-[9px] font-bold flex items-center justify-center leading-none">{{ totalUnread > 99 ? '99+' : totalUnread }}</span>
+        <button class="press glass relative w-10 h-10 rounded-full flex items-center justify-center flex-shrink-0" aria-label="通知" @click="openAnnouncementPanel">
+          <Bell class="w-[18px] h-[18px] text-gray-700" />
+          <span v-if="totalUnread > 0" class="absolute -top-0.5 -right-0.5 min-w-[18px] h-[18px] px-1 rounded-full bg-red-500 text-white text-xs font-bold flex items-center justify-center leading-none ring-2 ring-white dark:ring-gray-50">{{ totalUnread > 99 ? '99+' : totalUnread }}</span>
         </button>
       </div>
       <div v-else class="flex items-center gap-3">
-        <div class="w-10 h-10 rounded-full bg-white/20 animate-pulse" />
+        <div class="w-11 h-11 rounded-full bg-gray-200 animate-pulse" />
         <div class="flex-1 space-y-1.5">
-          <div class="h-3 w-28 bg-white/20 rounded animate-pulse" />
-          <div class="h-2.5 w-40 bg-white/20 rounded animate-pulse" />
+          <div class="h-3 w-28 bg-gray-200 rounded animate-pulse" />
+          <div class="h-4 w-36 bg-gray-200 rounded animate-pulse" />
         </div>
       </div>
     </div>
 
-    <!-- 中间内容区（可滚动；bg-background 语义类，亮暗主题自动切换） -->
-    <div class="flex-1 overflow-y-auto bg-background">
-      <router-view />
+    <!-- 中间内容区（可滚动）：上下留出悬浮顶栏 / 胶囊 TabBar 的空间，内容可在玻璃层下方滚动 -->
+    <div
+      ref="scrollEl"
+      class="flex-1 overflow-y-auto overscroll-contain"
+      :style="{
+        // 预留 60 = 顶栏上内边距 16 + 头像行 44；页面自带 p-4 的 16 即头像行到首张卡片的间距 → 上下均为 16
+        paddingTop: showHeader ? 'calc(var(--safe-top) + 60px)' : undefined,
+        paddingBottom: 'calc(env(safe-area-inset-bottom) + 92px)',
+      }"
+      @scroll.passive="onContentScroll"
+    >
+      <router-view v-slot="{ Component }">
+        <!-- 切页淡入（仅 opacity：不引入 transform，避免页面内 fixed 元素临时以容器为定位基准） -->
+        <!-- grid-cols-1 = minmax(0,1fr)：列宽锁定为容器宽度，避免不换行内容（如置顶公告走马灯）撑宽整页；
+             grid 拉伸让子页面的 min-h-full 生效（我的页靠它把退出按钮推到底部） -->
+        <div :key="String(route.name)" class="page-fade min-h-full grid grid-cols-1">
+          <component :is="Component" />
+        </div>
+      </router-view>
     </div>
 
-    <!-- 底部 TabBar（env 安全区适配 iPhone/iPad 底部 Home 条） -->
-    <div class="flex-shrink-0 bg-white border-t border-gray-100 flex" style="padding-bottom: env(safe-area-inset-bottom)">
-      <button
-        v-for="tab in tabs"
-        :key="tab.name"
-        class="flex-1 flex flex-col items-center justify-center h-14 gap-0.5 transition-colors"
-        :class="activeTab === tab.name ? 'text-blue-500' : 'text-gray-400'"
-        @click="switchTab(tab.name)"
+    <!-- 底部悬浮胶囊 TabBar（液态玻璃）：滑动高亮块指示当前页；向下滚动时收窄、向上滚动时展开。
+         外层 pointer-events:none 让两侧空白处的点击穿透到内容 -->
+    <nav
+      class="absolute inset-x-0 bottom-0 z-30 flex justify-center px-5 pointer-events-none"
+      style="padding-bottom: calc(env(safe-area-inset-bottom) + 12px)"
+      aria-label="主导航"
+    >
+      <div
+        class="glass pointer-events-auto relative flex rounded-full p-1.5 transition-all duration-500 ease-[var(--ease-spring)]"
+        :class="tabCollapsed ? 'w-[64%] h-14' : 'w-full h-[66px]'"
       >
-        <component :is="tab.icon" class="w-5 h-5" />
-        <span class="text-[10px]">{{ tab.label }}</span>
-      </button>
-    </div>
+        <!-- 滑动高亮块 -->
+        <div
+          v-if="activeTabIndex >= 0"
+          class="absolute top-1.5 bottom-1.5 left-1.5 rounded-full bg-brand-500/12 dark:bg-brand-400/15 transition-transform duration-500 ease-[var(--ease-spring)]"
+          :style="{ width: `calc((100% - 12px) / ${tabs.length})`, transform: `translateX(${activeTabIndex * 100}%)` }"
+        />
+        <button
+          v-for="tab in tabs"
+          :key="tab.name"
+          class="press relative z-10 flex-1 flex flex-col items-center justify-center gap-0.5 rounded-full"
+          :class="activeTab === tab.name ? 'text-brand-500 dark:text-brand-400' : 'text-gray-500'"
+          :aria-current="activeTab === tab.name ? 'page' : undefined"
+          @click="switchTab(tab.name)"
+        >
+          <component :is="tab.icon" class="w-[22px] h-[22px] transition-transform duration-300" :class="activeTab === tab.name ? 'scale-110' : ''" :stroke-width="activeTab === tab.name ? 2.4 : 2" />
+          <span
+            class="text-xs leading-none overflow-hidden transition-all duration-300"
+            :class="[activeTab === tab.name ? 'font-semibold' : 'font-medium', tabCollapsed ? 'max-h-0 opacity-0' : 'max-h-4 opacity-100']"
+          >{{ tab.label }}</span>
+        </button>
+      </div>
+    </nav>
 
     <!-- ======== 公告面板（遮罩 + 底部面板） ======== -->
     <AppDialog
@@ -320,11 +426,11 @@ onUnmounted(() => {
       <!-- 标题栏 -->
       <div class="flex items-center justify-between px-5 py-2 flex-shrink-0">
         <div class="flex items-center gap-2">
-          <div class="w-7 h-7 rounded-lg bg-blue-100 flex items-center justify-center">
-            <Bell class="w-4 h-4 text-blue-500" />
+          <div class="w-8 h-8 rounded-xl bg-brand-gradient flex items-center justify-center shadow-sm shadow-brand-500/20">
+            <Bell class="w-4 h-4 text-white" />
           </div>
-          <span class="font-semibold text-gray-900 text-sm">通知</span>
-          <span v-if="totalUnread > 0" class="text-[10px] px-2 py-0.5 rounded-full bg-red-50 text-red-500 font-medium border border-red-100">{{ totalUnread }} 条未读</span>
+          <span class="font-bold text-gray-900 text-base">通知</span>
+          <span v-if="totalUnread > 0" class="text-xs px-2 py-0.5 rounded-full bg-red-50 text-red-500 font-medium border border-red-100">{{ totalUnread }} 条未读</span>
         </div>
         <button class="w-7 h-7 rounded-full hover:bg-gray-100 flex items-center justify-center transition-colors" @click="showAnnPanel = false">
           <X class="w-4 h-4 text-gray-400" />
@@ -338,15 +444,15 @@ onUnmounted(() => {
       <div class="flex-1 overflow-y-auto px-5 py-2">
         <!-- ===== 公告分区 ===== -->
         <div v-if="announcements.length > 0" class="mb-1">
-          <p class="text-[10px] font-medium text-gray-400 uppercase tracking-wider mb-2 mt-1">公告</p>
+          <p class="text-xs font-semibold text-gray-500 tracking-wider mb-2 mt-1">公告</p>
           <div class="space-y-2">
             <div
               v-for="item in announcements"
               :key="'ann-'+item.id"
-              class="rounded-xl p-3.5 transition-all duration-200 cursor-pointer border"
+              class="press rounded-2xl p-3.5 cursor-pointer border"
               :class="item.isRead
                 ? 'bg-white border-gray-100 hover:border-gray-200'
-                : 'bg-blue-50/50 border-blue-100 hover:border-blue-200'"
+                : 'bg-brand-50 border-brand-100 hover:border-brand-200'"
               @click="openDetail(item)"
             >
               <div class="flex items-start gap-3">
@@ -359,7 +465,7 @@ onUnmounted(() => {
                     <p class="text-sm font-medium text-gray-900 truncate">{{ item.title }}</p>
                   </div>
                   <p class="text-xs text-gray-500 leading-relaxed line-clamp-1">{{ item.content }}</p>
-                  <p class="text-[10px] text-gray-400 mt-1">{{ new Date(item.createdAt).toLocaleString('zh-CN') }}</p>
+                  <p class="text-xs text-gray-400 mt-1">{{ new Date(item.createdAt).toLocaleString('zh-CN') }}</p>
                 </div>
                 <ChevronDown class="w-4 h-4 text-gray-300 flex-shrink-0 mt-1 -rotate-90" />
               </div>
@@ -370,15 +476,15 @@ onUnmounted(() => {
         <!-- ===== 工单通知分区 ===== -->
         <div v-if="ticketNotifications.length > 0" class="mb-1">
           <div v-if="announcements.length > 0" class="border-t border-gray-100 my-3" />
-          <p class="text-[10px] font-medium text-gray-400 uppercase tracking-wider mb-2">工单通知</p>
+          <p class="text-xs font-semibold text-gray-500 tracking-wider mb-2">工单通知</p>
           <div class="space-y-2">
             <div
               v-for="n in ticketNotifications"
               :key="'tkt-'+n.id"
-              class="rounded-xl p-3.5 transition-all duration-200 cursor-pointer border"
+              class="press rounded-2xl p-3.5 cursor-pointer border"
               :class="n.isRead
                 ? 'bg-white border-gray-100 hover:border-gray-200'
-                : 'bg-rose-50/50 border-rose-100 hover:border-rose-200'"
+                : 'bg-rose-50 border-rose-100 hover:border-rose-200'"
               @click="handleTicketNotifClick(n)"
             >
               <div class="flex items-start gap-3">
@@ -392,7 +498,7 @@ onUnmounted(() => {
                     <p class="text-sm font-medium text-gray-900 truncate">{{ n.title }}</p>
                   </div>
                   <p class="text-xs text-gray-500 leading-relaxed line-clamp-1">{{ n.content }}</p>
-                  <p class="text-[10px] text-gray-400 mt-1">{{ n.createdAt }}</p>
+                  <p class="text-xs text-gray-400 mt-1">{{ n.createdAt }}</p>
                 </div>
                 <ChevronDown class="w-4 h-4 text-gray-300 flex-shrink-0 mt-1 -rotate-90" />
               </div>
@@ -430,7 +536,7 @@ onUnmounted(() => {
       :title="detailItem?.title || '公告详情'"
       @update:open="(v: boolean) => { if (!v) showDetail = false }"
     >
-      <div class="h-1.5 bg-gradient-to-r from-blue-500 to-blue-400" />
+      <div class="h-1.5 bg-gradient-to-r from-brand-400 to-sky-400" />
       <div class="p-6">
         <div class="flex items-center justify-between mb-3">
           <div class="flex items-center gap-2.5">
@@ -444,7 +550,7 @@ onUnmounted(() => {
           </button>
         </div>
         <div class="flex items-center gap-2 mb-4">
-          <span class="text-[10px] text-gray-400">{{ detailItem ? new Date(detailItem.createdAt).toLocaleString('zh-CN') : '' }}</span>
+          <span class="text-xs text-gray-400">{{ detailItem ? new Date(detailItem.createdAt).toLocaleString('zh-CN') : '' }}</span>
         </div>
         <div class="bg-gray-50 rounded-xl p-4 max-h-[50vh] overflow-y-auto">
           <p class="text-sm text-gray-600 leading-relaxed whitespace-pre-wrap">{{ detailItem?.content }}</p>
@@ -468,7 +574,7 @@ onUnmounted(() => {
       @update:open="(v: boolean) => { if (!v) handleForcePopupDismiss() }"
     >
       <!-- 顶部装饰条 -->
-      <div class="h-1.5 bg-gradient-to-r from-blue-500 to-blue-400" />
+      <div class="h-1.5 bg-gradient-to-r from-brand-400 to-sky-400" />
       <div class="p-6">
         <div class="flex items-center gap-2.5 mb-2">
             <div class="w-9 h-9 rounded-xl bg-blue-100 flex items-center justify-center">
@@ -488,7 +594,8 @@ onUnmounted(() => {
     <!-- ======== 新手引导入口（全局：所有布局内页面显示；引导展示期间隐藏） ======== -->
     <button
       v-if="!showGuide"
-      class="guide-entry fixed right-3 bottom-20 z-40 flex items-center gap-1.5 rounded-full bg-blue-500/95 pl-3 pr-3.5 py-2 text-white text-xs font-medium shadow-lg shadow-blue-500/30 hover:bg-blue-600 active:scale-95 transition-all"
+      class="guide-entry fixed right-4 z-40 flex items-center gap-1.5 rounded-full bg-brand-gradient pl-3 pr-3.5 py-2 text-white text-xs font-semibold shadow-lg shadow-brand-500/30 active:scale-95 transition-all"
+      style="bottom: calc(env(safe-area-inset-bottom) + 96px)"
       @click="restartGuide"
     >
       <Sparkles class="w-3.5 h-3.5 flex-shrink-0" />
@@ -513,6 +620,13 @@ onUnmounted(() => {
   50% { transform: translateY(-6px); }
 }
 .guide-entry {
-  animation: guide-bob 1.5s ease-in-out infinite;
+  animation: guide-bob 1.8s ease-in-out infinite;
+}
+/* 切页淡入：仅 opacity，避免 transform 让页面内 fixed 元素临时相对容器定位 */
+.page-fade {
+  animation: page-fade-in 0.32s ease backwards;
+}
+@keyframes page-fade-in {
+  from { opacity: 0; }
 }
 </style>

frondend/src/views/admin/AdminAgents.vue

@@ -10,7 +10,6 @@ import {
   Eye,
   EyeOff,
   CheckCircle,
-  XCircle,
   LoaderCircle,
   Ban,
   KeyRound,
@@ -193,37 +192,45 @@ async function handleToggleStatus(agent: adminApi.AgentUser) {
 </script>
 
 <template>
-  <div class="p-6">
+  <div class="adm-page">
     <!-- 顶部 -->
-    <div class="flex items-center justify-between mb-6">
-      <h1 class="text-xl font-bold text-gray-900">代理管理</h1>
-      <Button variant="default" size="sm" @click="showCreateModal = true">
-        <UserPlus class="w-4 h-4 mr-1" />
+    <div class="adm-head">
+      <div class="flex items-center gap-3">
+        <div class="adm-head-icon"><Users class="w-5 h-5" /></div>
+        <div>
+          <h1 class="adm-title">代理管理</h1>
+          <p class="adm-sub">共 {{ filteredAgents.length }} 个代理 · 管理费率、余额与状态</p>
+        </div>
+      </div>
+      <Button class="h-10" @click="showCreateModal = true">
+        <UserPlus class="w-4 h-4" />
         创建代理
       </Button>
     </div>
 
     <!-- 搜索 -->
-    <div class="relative mb-4">
-      <Search class="absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-400" />
-      <Input v-model="searchQuery" placeholder="搜索用户名..." class="pl-9 h-10 text-sm max-w-xs" />
+    <div class="adm-toolbar">
+      <div class="relative flex-1 min-w-[200px] max-w-sm">
+        <Search class="absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-400" />
+        <Input v-model="searchQuery" placeholder="搜索用户名..." class="pl-9 h-10 text-sm" />
+      </div>
     </div>
 
     <!-- 列表 -->
-    <div class="overflow-x-auto rounded-xl border border-gray-200 bg-white shadow">
+    <div class="adm-card overflow-x-auto">
       <div v-if="loading" class="flex items-center justify-center py-16">
-        <LoaderCircle class="w-6 h-6 animate-spin text-blue-500" />
+        <LoaderCircle class="w-6 h-6 animate-spin text-brand-500" />
       </div>
 
-      <div v-else-if="filteredAgents.length === 0" class="text-center py-16 text-sm text-gray-400">
-        <Users class="w-12 h-12 mx-auto mb-3 text-gray-200" />
-        <p>暂无代理数据</p>
-        <p class="text-xs mt-1">点击右上角"创建代理"开始</p>
+      <div v-else-if="filteredAgents.length === 0" class="adm-empty">
+        <div class="adm-empty-icon"><Users class="w-6 h-6" /></div>
+        <p class="text-sm font-medium text-gray-700">暂无代理数据</p>
+        <p class="text-xs mt-1">点击右上角「创建代理」开始</p>
       </div>
 
-      <table v-else class="w-full text-sm">
+      <table v-else class="adm-table w-full">
         <thead>
-          <tr class="bg-gray-50 text-left text-xs text-gray-500">
+          <tr>
             <th class="px-4 py-3 font-medium">用户名</th>
             <th class="px-4 py-3 font-medium">费率</th>
             <th class="px-4 py-3 font-medium">余额</th>
@@ -234,35 +241,38 @@ async function handleToggleStatus(agent: adminApi.AgentUser) {
           </tr>
         </thead>
         <tbody>
-          <tr v-for="agent in filteredAgents" :key="agent.id" class="border-t border-gray-50 hover:bg-gray-50/50 transition-colors">
-            <td class="px-4 py-3 font-medium text-gray-900 whitespace-nowrap">{{ agent.username }}</td>
+          <tr v-for="agent in filteredAgents" :key="agent.id" class="">
+            <td class="px-4 py-3 whitespace-nowrap">
+              <div class="flex items-center gap-2.5">
+                <span class="w-8 h-8 rounded-full bg-brand-50 text-brand-700 flex items-center justify-center text-xs font-bold flex-shrink-0">{{ agent.username[0]?.toUpperCase() }}</span>
+                <span class="font-semibold text-gray-900">{{ agent.username }}</span>
+              </div>
+            </td>
             <td class="px-4 py-3 whitespace-nowrap">{{ (agent.rate * 100).toFixed(0) }}%</td>
-            <td class="px-4 py-3 font-mono whitespace-nowrap">{{ agent.balance.toFixed(2) }}</td>
+            <td class="px-4 py-3 whitespace-nowrap tabular-nums font-semibold text-gray-900">¥{{ agent.balance.toFixed(2) }}</td>
             <td class="px-4 py-3 whitespace-nowrap">
               <span
-                class="inline-flex items-center gap-1 px-2 py-0.5 rounded-full text-xs font-medium whitespace-nowrap"
-                :class="agent.status === 'active' ? 'bg-green-100 text-green-700' : 'bg-red-100 text-red-700'"
+                class="adm-badge"
+                :class="agent.status === 'active' ? 'adm-badge-green' : 'adm-badge-red'"
               >
-                <CheckCircle v-if="agent.status === 'active'" class="w-3 h-3 flex-shrink-0" />
-                <XCircle v-else class="w-3 h-3 flex-shrink-0" />
                 {{ agent.status === 'active' ? '正常' : '禁用' }}
               </span>
             </td>
             <td class="px-4 py-3 text-gray-500 text-xs">
               {{ agent.parentUsername || (agent.parentId ? 'ID:'+agent.parentId : '-') }}
             </td>
-            <td class="px-4 py-3 text-gray-500 text-xs">{{ new Date(agent.createdAt).toLocaleDateString() }}</td>
+            <td class="px-4 py-3 text-gray-500 text-xs">{{ new Date(agent.createdAt).toLocaleDateString('zh-CN') }}</td>
             <td class="px-4 py-3 text-right">
               <div class="flex items-center justify-end gap-1">
                 <button
-                  class="p-1.5 rounded-lg hover:bg-blue-50 text-blue-600 transition-colors"
+                  class="w-8 h-8 inline-flex items-center justify-center rounded-lg transition-colors text-brand-600 hover:bg-brand-50"
                   title="充值"
                   @click="openRecharge(agent)"
                 >
                   <DollarSign class="w-4 h-4" />
                 </button>
                 <button
-                  class="p-1.5 rounded-lg hover:bg-green-50 text-green-600 transition-colors"
+                  class="w-8 h-8 inline-flex items-center justify-center rounded-lg transition-colors text-green-600 hover:bg-green-50"
                   title="修改费率"
                   @click="openRate(agent)"
                 >
@@ -270,7 +280,7 @@ async function handleToggleStatus(agent: adminApi.AgentUser) {
                 </button>
                 <template v-if="isAdmin">
                   <button
-                    class="p-1.5 rounded-lg hover:bg-orange-50 text-orange-600 transition-colors"
+                    class="w-8 h-8 inline-flex items-center justify-center rounded-lg transition-colors text-amber-600 hover:bg-amber-50"
                     title="修改密码"
                     @click="openPassword(agent)"
                   >

frondend/src/views/admin/AdminAnnouncements.vue

@@ -172,16 +172,16 @@ function scopeLabel(item: AnnouncementEx) {
 </script>
 
 <template>
-  <div class="p-6">
+  <div class="adm-page">
     <!-- 标题栏 -->
-    <div class="flex items-center justify-between mb-6">
+    <div class="adm-head">
       <div class="flex items-center gap-3">
-        <div class="w-10 h-10 rounded-xl bg-purple-100 flex items-center justify-center">
-          <Megaphone class="w-5 h-5 text-purple-600" />
+        <div class="adm-head-icon">
+          <Megaphone class="w-5 h-5" />
         </div>
         <div>
-          <h1 class="text-lg font-bold text-gray-900">公告管理</h1>
-          <p class="text-sm text-gray-400">发布与管理系统公告</p>
+          <h1 class="adm-title">公告管理</h1>
+          <p class="adm-sub">发布与管理系统公告</p>
         </div>
       </div>
       <Button @click="openCreate" class="h-10 text-sm">
@@ -191,51 +191,33 @@ function scopeLabel(item: AnnouncementEx) {
     </div>
 
     <!-- 筛选栏 -->
-    <div class="flex items-center justify-between mb-4">
-      <div class="flex items-center gap-2">
-        <span class="text-sm text-gray-500">来源类型：</span>
-        <button
-          class="px-3 h-8 rounded-lg text-xs font-medium transition-colors"
-          :class="sourceFilter === '' ? 'bg-blue-500 text-white' : 'bg-gray-100 text-gray-600 hover:bg-gray-200'"
-          @click="sourceFilter = ''; changeSourceFilter()"
-        >
-          全部
-        </button>
-        <button
-          class="px-3 h-8 rounded-lg text-xs font-medium transition-colors"
-          :class="sourceFilter === 'manual' ? 'bg-blue-500 text-white' : 'bg-gray-100 text-gray-600 hover:bg-gray-200'"
-          @click="sourceFilter = 'manual'; changeSourceFilter()"
-        >
-          手动创建
-        </button>
-        <button
-          class="px-3 h-8 rounded-lg text-xs font-medium transition-colors"
-          :class="sourceFilter === 'system' ? 'bg-blue-500 text-white' : 'bg-gray-100 text-gray-600 hover:bg-gray-200'"
-          @click="sourceFilter = 'system'; changeSourceFilter()"
-        >
-          系统自动
-        </button>
+    <div class="adm-toolbar">
+      <span class="text-sm text-gray-500">来源</span>
+      <div class="adm-seg">
+        <button :class="sourceFilter === '' && 'is-active'" @click="sourceFilter = ''; changeSourceFilter()">全部</button>
+        <button :class="sourceFilter === 'manual' && 'is-active'" @click="sourceFilter = 'manual'; changeSourceFilter()">手动创建</button>
+        <button :class="sourceFilter === 'system' && 'is-active'" @click="sourceFilter = 'system'; changeSourceFilter()">系统自动</button>
       </div>
     </div>
 
     <!-- 表格 -->
-    <div class="bg-white rounded-xl border border-gray-200 overflow-hidden">
+    <div class="adm-card overflow-hidden">
       <!-- 加载骨架 -->
       <div v-if="loading" class="p-6 space-y-4">
         <div v-for="i in 4" :key="i" class="h-10 bg-gray-50 rounded animate-pulse" />
       </div>
 
       <!-- 空状态 -->
-      <div v-else-if="announcements.length === 0" class="text-center py-20 text-gray-400">
-        <Megaphone class="w-12 h-12 mx-auto mb-3 opacity-30" />
-        <p class="text-sm">暂无公告</p>
+      <div v-else-if="announcements.length === 0" class="adm-empty">
+        <div class="adm-empty-icon"><Megaphone class="w-6 h-6" /></div>
+        暂无公告
       </div>
 
       <!-- 表格 -->
       <div v-else class="overflow-x-auto">
-        <table class="w-full text-sm table-fixed min-w-[1000px]">
+        <table class="adm-table w-full text-sm table-fixed min-w-[1000px]">
           <thead>
-            <tr class="bg-gray-50 text-left text-xs text-gray-500">
+            <tr>
               <th class="px-4 py-3 font-medium w-[16%]">标题</th>
               <th class="px-4 py-3 font-medium w-[22%]">内容</th>
               <th class="px-4 py-3 font-medium w-[8%]">来源</th>
@@ -251,14 +233,14 @@ function scopeLabel(item: AnnouncementEx) {
           <tr
             v-for="item in announcements"
             :key="item.id"
-            class="border-t border-gray-50 hover:bg-gray-50/50 transition-colors"
+            class=""
           >
             <!-- 标题 -->
             <td class="px-4 py-3">
               <span class="inline-flex items-center gap-1.5">
                 <span
                   v-if="item.isPinned"
-                  class="text-[10px] px-1.5 py-0.5 rounded-full font-medium bg-rose-100 text-rose-600 whitespace-nowrap"
+                  class="text-xs px-1.5 py-0.5 rounded-full font-medium bg-rose-100 text-rose-600 whitespace-nowrap"
                 >置顶</span>
                 <span class="font-medium text-gray-900 truncate">{{ item.title }}</span>
               </span>
@@ -270,8 +252,8 @@ function scopeLabel(item: AnnouncementEx) {
             <!-- 来源 -->
             <td class="px-4 py-3">
               <span
-                class="text-[10px] px-1.5 py-0.5 rounded-full font-medium whitespace-nowrap"
-                :class="item.source === 'system' ? 'bg-gray-100 text-gray-600' : 'bg-blue-100 text-blue-700'"
+                class="text-xs px-1.5 py-0.5 rounded-full font-medium whitespace-nowrap"
+                :class="item.source === 'system' ? 'bg-gray-100 text-gray-600' : 'bg-brand-50 text-brand-700'"
               >
                 <Bot v-if="item.source === 'system'" class="w-3 h-3 inline mr-0.5" />
                 {{ sourceLabel(item.source) }}
@@ -279,8 +261,8 @@ function scopeLabel(item: AnnouncementEx) {
             </td>
             <!-- 推送范围 -->
             <td class="px-4 py-3">
-              <span class="text-[10px] px-1.5 py-0.5 rounded-full font-medium whitespace-nowrap"
-                :class="item.targetUserId ? 'bg-amber-100 text-amber-700' : (item.targetType === 'agent' ? 'bg-amber-100 text-amber-700' : 'bg-blue-100 text-blue-700')"
+              <span class="text-xs px-1.5 py-0.5 rounded-full font-medium whitespace-nowrap"
+                :class="item.targetUserId ? 'bg-amber-100 text-amber-700' : (item.targetType === 'agent' ? 'bg-amber-100 text-amber-700' : 'bg-brand-50 text-brand-700')"
               >
                 <User v-if="item.targetUserId" class="w-3 h-3 inline mr-0.5" />
                 <Users v-else class="w-3 h-3 inline mr-0.5" />
@@ -300,7 +282,7 @@ function scopeLabel(item: AnnouncementEx) {
             <td class="px-4 py-3">
               <span
                 class="text-xs font-medium"
-                :class="item.loopPopup ? 'text-blue-500' : 'text-gray-400'"
+                :class="item.loopPopup ? 'text-brand-600' : 'text-gray-400'"
               >
                 {{ item.loopPopup ? '是' : '否' }}
               </span>
@@ -311,7 +293,7 @@ function scopeLabel(item: AnnouncementEx) {
                 <div class="flex-1 h-1.5 rounded-full bg-gray-100 overflow-hidden max-w-[50px]">
                   <div
                     class="h-full rounded-full transition-all"
-                    :class="item.totalTargets > 0 && item.readCount >= item.totalTargets ? 'bg-green-400' : 'bg-blue-400'"
+                    :class="item.totalTargets > 0 && item.readCount >= item.totalTargets ? 'bg-green-400' : 'bg-brand-400'"
                     :style="{ width: item.totalTargets > 0 ? (item.readCount / item.totalTargets * 100) + '%' : '0%' }"
                   />
                 </div>
@@ -324,21 +306,21 @@ function scopeLabel(item: AnnouncementEx) {
             <td class="px-4 py-3 text-center whitespace-nowrap">
               <div v-if="item.source !== 'system'" class="flex items-center justify-center gap-1">
                 <button
-                  class="inline-flex items-center gap-1 px-2 py-1 rounded-lg text-xs text-blue-500 hover:bg-blue-50 transition-colors"
+                  class="adm-link adm-link-brand"
                   @click="openEdit(item)"
                 >
                   <Pencil class="w-3.5 h-3.5" />
                   编辑
                 </button>
                 <button
-                  class="inline-flex items-center gap-1 px-2 py-1 rounded-lg text-xs text-red-500 hover:bg-red-50 transition-colors"
+                  class="adm-link adm-link-red"
                   @click="handleDelete(item.id)"
                 >
                   <Trash2 class="w-3.5 h-3.5" />
                   删除
                 </button>
               </div>
-              <span v-else class="text-xs text-gray-300">--</span>
+              <span v-else class="text-xs adm-muted">--</span>
             </td>
           </tr>
         </tbody>
@@ -350,18 +332,20 @@ function scopeLabel(item: AnnouncementEx) {
     <AppDialog
       :open="showCreateModal"
       variant="center"
-      panel-class="w-[85%] sm:max-w-md"
+      wrapper-class="px-4 py-4"
+      panel-class="w-full sm:max-w-md max-h-[calc(100dvh-32px)]"
       :title="editingId ? '编辑公告' : '新建公告'"
       @update:open="(v: boolean) => { showCreateModal = v }"
     >
-      <div class="flex items-center justify-between px-5 pt-5 pb-3">
+      <div class="flex items-center justify-between px-5 pt-5 pb-3 flex-shrink-0 border-b border-gray-100">
         <h3 class="text-base font-semibold text-gray-900">{{ editingId ? '编辑公告' : '新建公告' }}</h3>
         <button class="w-7 h-7 rounded-full bg-gray-100 flex items-center justify-center text-gray-400 hover:text-gray-600" @click="showCreateModal = false">
           <X class="w-4 h-4" />
         </button>
       </div>
 
-      <div class="px-5 pb-5 space-y-4">
+      <!-- 表单区：内容多时在此滚动，底部按钮始终可见 -->
+      <div class="flex-1 min-h-0 overflow-y-auto overscroll-contain px-5 py-4 space-y-4">
         <div>
           <label class="block text-xs font-medium text-gray-500 mb-1.5">公告标题</label>
           <Input v-model="formTitle" placeholder="请输入公告标题" class="h-10 text-sm" />
@@ -372,7 +356,7 @@ function scopeLabel(item: AnnouncementEx) {
           <textarea
             v-model="formContent"
             placeholder="请输入公告内容"
-            class="w-full h-24 px-3 py-2 text-sm border border-gray-200 rounded-lg resize-none focus:outline-none focus:ring-2 focus:ring-blue-500/20 focus:border-blue-400"
+            class="w-full h-24 px-3 py-2 text-sm border border-gray-200 rounded-lg resize-none focus:outline-none focus:ring-2 focus:ring-brand-400/20 focus:border-brand-400"
           />
         </div>
 
@@ -381,12 +365,12 @@ function scopeLabel(item: AnnouncementEx) {
           <div class="flex gap-2">
             <button
               class="flex-1 h-10 rounded-lg text-sm font-medium transition-colors"
-              :class="formTargetType === 'user' ? 'bg-blue-500 text-white' : 'bg-gray-100 text-gray-600 hover:bg-gray-200'"
+              :class="formTargetType === 'user' ? 'adm-btn-brand' : 'bg-gray-100 text-gray-600 hover:bg-gray-200'"
               @click="formTargetType = 'user'"
             >普通用户</button>
             <button
               class="flex-1 h-10 rounded-lg text-sm font-medium transition-colors"
-              :class="formTargetType === 'agent' ? 'bg-blue-500 text-white' : 'bg-gray-100 text-gray-600 hover:bg-gray-200'"
+              :class="formTargetType === 'agent' ? 'adm-btn-brand' : 'bg-gray-100 text-gray-600 hover:bg-gray-200'"
               @click="formTargetType = 'agent'; formIsPinned = false"
             >代理</button>
           </div>
@@ -397,7 +381,7 @@ function scopeLabel(item: AnnouncementEx) {
           <div class="flex gap-2">
             <button
               class="flex-1 h-10 rounded-lg text-sm font-medium transition-colors"
-              :class="formTargetMode === 'all' ? 'bg-blue-500 text-white' : 'bg-gray-100 text-gray-600 hover:bg-gray-200'"
+              :class="formTargetMode === 'all' ? 'adm-btn-brand' : 'bg-gray-100 text-gray-600 hover:bg-gray-200'"
               @click="formTargetMode = 'all'"
             >
               <Users class="w-3.5 h-3.5 inline mr-1" />
@@ -405,7 +389,7 @@ function scopeLabel(item: AnnouncementEx) {
             </button>
             <button
               class="flex-1 h-10 rounded-lg text-sm font-medium transition-colors"
-              :class="formTargetMode === 'specific' ? 'bg-blue-500 text-white' : 'bg-gray-100 text-gray-600 hover:bg-gray-200'"
+              :class="formTargetMode === 'specific' ? 'adm-btn-brand' : 'bg-gray-100 text-gray-600 hover:bg-gray-200'"
               @click="formTargetMode = 'specific'"
             >
               <User class="w-3.5 h-3.5 inline mr-1" />
@@ -423,13 +407,13 @@ function scopeLabel(item: AnnouncementEx) {
             placeholder="输入用户ID"
             class="h-10 text-sm"
           />
-          <p class="text-[10px] text-gray-400 mt-1">可以在用户管理页面查看用户ID</p>
+          <p class="text-xs text-gray-400 mt-1">可以在用户管理页面查看用户ID</p>
         </div>
 
         <div class="flex items-center gap-3">
           <button
             class="relative w-10 h-5 rounded-full transition-colors flex-shrink-0"
-            :class="formForcePopup ? 'bg-blue-500' : 'bg-gray-300'"
+            :class="formForcePopup ? 'adm-btn-brand' : 'bg-gray-300'"
             @click="formForcePopup = !formForcePopup"
           >
             <div
@@ -439,14 +423,14 @@ function scopeLabel(item: AnnouncementEx) {
           </button>
           <div>
             <label class="text-sm font-medium text-gray-700">强制弹出</label>
-            <p class="text-[10px] text-gray-400">用户未读时自动弹出公告对话框</p>
+            <p class="text-xs text-gray-400">用户未读时自动弹出公告对话框</p>
           </div>
         </div>
 
         <div class="flex items-center gap-3">
           <button
             class="relative w-10 h-5 rounded-full transition-colors flex-shrink-0"
-            :class="formLoopPopup ? 'bg-blue-500' : 'bg-gray-300'"
+            :class="formLoopPopup ? 'adm-btn-brand' : 'bg-gray-300'"
             @click="formLoopPopup = !formLoopPopup"
           >
             <div
@@ -456,14 +440,14 @@ function scopeLabel(item: AnnouncementEx) {
           </button>
           <div>
             <label class="text-sm font-medium text-gray-700">循环弹窗</label>
-            <p class="text-[10px] text-gray-400">每次刷新页面或进入首页都会强制弹窗（无视已读状态，需同时开启强制弹窗）</p>
+            <p class="text-xs text-gray-400">每次刷新页面或进入首页都会强制弹窗（无视已读状态，需同时开启强制弹窗）</p>
           </div>
         </div>
 
         <div class="flex items-center gap-3">
           <button
             class="relative w-10 h-5 rounded-full transition-colors flex-shrink-0"
-            :class="formIsPinned ? 'bg-blue-500' : 'bg-gray-300'"
+            :class="formIsPinned ? 'adm-btn-brand' : 'bg-gray-300'"
             :disabled="formTargetType !== 'user'"
             @click="formIsPinned = !formIsPinned"
           >
@@ -474,12 +458,17 @@ function scopeLabel(item: AnnouncementEx) {
           </button>
           <div>
             <label class="text-sm font-medium text-gray-700">置顶公告</label>
-            <p class="text-[10px] text-gray-400">显示在打卡页面顶部，横向循环滚动展示（仅普通用户，不进入用户公告列表）</p>
+            <p class="text-xs text-gray-400">显示在打卡页面顶部，横向循环滚动展示（仅普通用户，不进入用户公告列表）</p>
           </div>
         </div>
 
+      </div>
+
+      <!-- 底部操作栏（固定） -->
+      <div class="flex-shrink-0 flex gap-2 px-5 py-3.5 border-t border-gray-100">
+        <Button variant="outline" class="flex-1 h-11 text-sm" @click="showCreateModal = false">取消</Button>
         <Button
-          class="w-full h-10 text-sm font-medium mt-2"
+          class="flex-[2] h-11 text-sm"
           :disabled="creating"
           @click="handleCreate"
         >

frondend/src/views/admin/AdminCdks.vue

@@ -2,6 +2,8 @@
 import { ref, onMounted, computed } from 'vue'
 import {
   QrCode,
+  Crown,
+  Ticket,
   Plus,
   Search,
   X,
@@ -241,85 +243,102 @@ function statusLabel(s: string) {
 }
 
 function statusClass(s: string) {
-  if (s === 'used') return 'bg-gray-100 text-gray-600'
-  if (s === 'disabled') return 'bg-red-50 text-red-600'
-  return 'bg-green-100 text-green-700'
+  if (s === 'used') return 'adm-badge-gray'
+  if (s === 'disabled') return 'adm-badge-red'
+  return 'adm-badge-green'
 }
+
+// 状态分段筛选
+const statusOptions = [
+  { value: '', label: '全部' },
+  { value: 'unused', label: '未使用' },
+  { value: 'used', label: '已使用' },
+  { value: 'disabled', label: '已禁用' },
+]
+
+// 统计卡片（点击即按该状态筛选）
+const summaryCards = computed(() => [
+  { key: '', label: '总计', value: summary.value.total, icon: QrCode, tone: 'bg-brand-50 text-brand-600' },
+  { key: 'unused', label: '未使用', value: summary.value.unused, icon: Ticket, tone: 'bg-green-50 text-green-600' },
+  { key: 'used', label: '已使用', value: summary.value.used, icon: CheckCheck, tone: 'bg-gray-100 text-gray-600' },
+  { key: 'disabled', label: '已禁用', value: summary.value.disabled, icon: Ban, tone: 'bg-red-50 text-red-600' },
+])
 </script>
 
 <template>
-  <div class="p-6">
+  <div class="adm-page">
     <!-- 顶部 -->
-    <div class="flex items-center justify-between mb-6">
-      <h1 class="text-xl font-bold text-gray-900">CDK管理</h1>
-      <Button variant="default" size="sm" @click="openGenerateModal">
-        <Plus class="w-4 h-4 mr-1" />
-        生成CDK
+    <div class="adm-head">
+      <div class="flex items-center gap-3">
+        <div class="adm-head-icon"><QrCode class="w-5 h-5" /></div>
+        <div>
+          <h1 class="adm-title">CDK 管理</h1>
+          <p class="adm-sub">生成与管理次数卡、VIP 卡兑换码</p>
+        </div>
+      </div>
+      <Button class="h-10" @click="openGenerateModal">
+        <Plus class="w-4 h-4" />
+        生成 CDK
       </Button>
     </div>
 
-    <!-- 统计 -->
-    <div class="flex gap-4 mb-4 flex-wrap">
-      <div class="bg-white rounded-lg border border-gray-200 px-4 py-2.5 flex items-center gap-2">
-        <span class="text-xs text-gray-500">总计</span>
-        <span class="text-lg font-bold text-gray-900">{{ summary.total }}</span>
-      </div>
-      <div class="bg-white rounded-lg border border-green-200 px-4 py-2.5 flex items-center gap-2">
-        <span class="text-xs text-green-600">未使用</span>
-        <span class="text-lg font-bold text-green-700">{{ summary.unused }}</span>
-      </div>
-      <div class="bg-white rounded-lg border border-gray-200 px-4 py-2.5 flex items-center gap-2">
-        <span class="text-xs text-gray-500">已使用</span>
-        <span class="text-lg font-bold text-gray-700">{{ summary.used }}</span>
-      </div>
-      <div class="bg-white rounded-lg border border-red-200 px-4 py-2.5 flex items-center gap-2">
-        <span class="text-xs text-red-500">已禁用</span>
-        <span class="text-lg font-bold text-red-600">{{ summary.disabled }}</span>
-      </div>
+    <!-- 统计（点击即按该状态筛选） -->
+    <div class="grid grid-cols-2 lg:grid-cols-4 gap-3 mb-4">
+      <button
+        v-for="c in summaryCards"
+        :key="c.key"
+        class="adm-card adm-stat text-left transition-all hover:shadow-md"
+        :class="statusFilter === c.key && 'ring-2 ring-brand-400/50 border-brand-300'"
+        @click="statusFilter = c.key; handleStatusChange()"
+      >
+        <div class="adm-stat-icon" :class="c.tone"><component :is="c.icon" class="w-5 h-5" /></div>
+        <div class="min-w-0">
+          <p class="adm-stat-label">{{ c.label }}</p>
+          <p class="adm-stat-value">{{ c.value }}</p>
+        </div>
+      </button>
     </div>
 
     <!-- 筛选：搜索 + 状态 -->
-    <div class="flex items-center gap-3 mb-4">
-      <div class="relative flex-1 max-w-xs">
+    <div class="adm-toolbar">
+      <div class="relative flex-1 min-w-[200px] max-w-sm">
         <Search class="absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-400" />
         <Input
           v-model="keywordInput"
-          placeholder="搜索CDK码..."
+          placeholder="搜索 CDK 码..."
           class="pl-9 h-10 text-sm"
           @keyup.enter="handleSearch"
         />
       </div>
       <Button variant="outline" class="h-10" @click="handleSearch">
-        <Search class="w-4 h-4 mr-1" />
+        <Search class="w-4 h-4" />
         搜索
       </Button>
-      <select
-        v-model="statusFilter"
-        class="h-10 px-3 rounded-lg border border-gray-200 bg-white text-sm text-gray-600 focus:outline-none focus:ring-2 focus:ring-blue-500/20 focus:border-blue-400"
-        @change="handleStatusChange"
-      >
-        <option value="">全部状态</option>
-        <option value="unused">未使用</option>
-        <option value="used">已使用</option>
-        <option value="disabled">已禁用</option>
-      </select>
+      <div class="adm-seg">
+        <button
+          v-for="o in statusOptions"
+          :key="o.value"
+          :class="statusFilter === o.value && 'is-active'"
+          @click="statusFilter = o.value; handleStatusChange()"
+        >{{ o.label }}</button>
+      </div>
     </div>
 
     <!-- 列表 -->
-    <div class="overflow-x-auto rounded-xl border border-gray-200 bg-white shadow">
+    <div class="adm-card overflow-hidden"><div class="overflow-x-auto">
       <div v-if="loading" class="flex items-center justify-center py-16">
-        <LoaderCircle class="w-6 h-6 animate-spin text-blue-500" />
+        <LoaderCircle class="w-6 h-6 animate-spin text-brand-500" />
       </div>
 
-      <div v-else-if="cdks.length === 0" class="text-center py-16 text-sm text-gray-400">
-        <QrCode class="w-12 h-12 mx-auto mb-3 text-gray-200" />
-        <p>暂无CDK数据</p>
-        <p class="text-xs mt-1">点击右上角"生成CDK"开始创建</p>
+      <div v-else-if="cdks.length === 0" class="adm-empty">
+        <div class="adm-empty-icon"><QrCode class="w-6 h-6" /></div>
+        <p class="text-sm font-medium text-gray-700">暂无 CDK 数据</p>
+        <p class="text-xs mt-1">点击右上角「生成 CDK」开始创建</p>
       </div>
 
-      <table v-else class="w-full text-sm">
+      <table v-else class="adm-table w-full">
         <thead>
-          <tr class="bg-gray-50 text-left text-xs text-gray-500">
+          <tr>
             <th class="px-4 py-3 font-medium">CDK码</th>
             <th v-if="isAdmin" class="px-4 py-3 font-medium">生成代理</th>
             <th class="px-4 py-3 font-medium">售价</th>
@@ -334,11 +353,11 @@ function statusClass(s: string) {
           <tr
             v-for="(cdk, idx) in cdks"
             :key="cdk.id"
-            class="border-t border-gray-50 hover:bg-gray-50/50 transition-colors"
+            class=""
             :class="cdk.status === 'disabled' ? 'opacity-60' : ''"
           >
             <td class="px-4 py-3 whitespace-nowrap">
-              <code class="font-mono text-xs bg-gray-100 px-2 py-1 rounded">{{ cdk.code }}</code>
+              <code class="font-mono text-xs text-gray-900 bg-gray-100 px-2 py-1 rounded-lg">{{ cdk.code }}</code>
             </td>
             <td v-if="isAdmin" class="px-4 py-3 text-xs text-gray-600 whitespace-nowrap">
               {{ (cdk as any).agent?.username || cdk.agentId }}
@@ -347,11 +366,11 @@ function statusClass(s: string) {
             <td class="px-4 py-3 whitespace-nowrap">
               <span
                 v-if="cdk.type === 'vip'"
-                class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-amber-100 text-amber-700 whitespace-nowrap"
-              >⭐ VIP{{ cdk.vipDays === 7 ? '周卡' : '月卡' }}</span>
+                class="adm-badge no-dot adm-badge-amber"
+              ><Crown class="w-3 h-3" />VIP{{ cdk.vipDays === 7 ? '周卡' : '月卡' }}</span>
               <span
                 v-else
-                class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-700 whitespace-nowrap"
+                class="adm-badge no-dot adm-badge-sky"
               >次数卡</span>
             </td>
             <td class="px-4 py-3 text-xs text-gray-600 whitespace-nowrap">
@@ -359,18 +378,18 @@ function statusClass(s: string) {
             </td>
             <td class="px-4 py-3 whitespace-nowrap">
               <span
-                class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium whitespace-nowrap"
+                class="adm-badge"
                 :class="statusClass(cdk.status)"
               >
                 {{ statusLabel(cdk.status) }}
               </span>
             </td>
-            <td class="px-4 py-3 text-gray-500 text-xs whitespace-nowrap">{{ new Date(cdk.createdAt).toLocaleString() }}</td>
+            <td class="px-4 py-3 text-gray-500 text-xs whitespace-nowrap">{{ new Date(cdk.createdAt).toLocaleString('zh-CN') }}</td>
             <td class="px-4 py-3 whitespace-nowrap">
               <div class="flex items-center gap-1">
                 <button
-                  class="inline-flex items-center gap-1 px-2 py-1 rounded-lg text-xs transition-colors"
-                  :class="copiedIndex === idx ? 'bg-green-100 text-green-700' : 'bg-blue-50 text-blue-600 hover:bg-blue-100'"
+                  class="adm-link"
+                  :class="copiedIndex === idx ? 'adm-link-green' : 'adm-link-brand'"
                   @click="copyCode(cdk.code, idx)"
                 >
                   <Copy v-if="copiedIndex !== idx" class="w-3 h-3" />
@@ -379,7 +398,7 @@ function statusClass(s: string) {
                 </button>
                 <button
                   v-if="cdk.status === 'unused'"
-                  class="inline-flex items-center gap-1 px-2 py-1 rounded-lg text-xs text-red-500 hover:bg-red-50 transition-colors"
+                  class="adm-link adm-link-red"
                   @click="askDisable(cdk)"
                 >
                   <Ban class="w-3 h-3" />
@@ -387,7 +406,7 @@ function statusClass(s: string) {
                 </button>
                 <button
                   v-else-if="cdk.status === 'disabled'"
-                  class="inline-flex items-center gap-1 px-2 py-1 rounded-lg text-xs text-green-600 hover:bg-green-50 transition-colors"
+                  class="adm-link adm-link-green"
                   @click="askEnable(cdk)"
                 >
                   <RotateCcw class="w-3 h-3" />
@@ -398,17 +417,18 @@ function statusClass(s: string) {
           </tr>
         </tbody>
       </table>
+      </div>
 
       <!-- 分页 -->
       <div
         v-if="total > 0"
-        class="flex items-center justify-between px-4 py-3 border-t border-gray-100"
+        class="adm-pager"
       >
         <div class="flex items-center gap-3">
-          <span class="text-xs text-gray-400">共 {{ total }} 条</span>
+          <span>共 <b class="font-semibold text-gray-700 tabular-nums">{{ total }}</b> 条</span>
           <select
             :value="pageSize"
-            class="h-8 px-2 rounded-lg border border-gray-200 bg-white text-xs text-gray-500 focus:outline-none"
+            class="adm-select"
             @change="handlePageSize(Number(($event.target as HTMLSelectElement).value))"
           >
             <option v-for="n in pageSizeOptions" :key="n" :value="n">{{ n }} 条/页</option>
@@ -416,15 +436,15 @@ function statusClass(s: string) {
         </div>
         <div class="flex items-center gap-2">
           <button
-            class="w-8 h-8 rounded-lg flex items-center justify-center hover:bg-gray-100 disabled:opacity-30"
+            class="adm-pager-btn"
             :disabled="page <= 1"
             @click="handlePage(page - 1)"
           >
             <ChevronLeft class="w-4 h-4" />
           </button>
-          <span class="text-sm text-gray-600">{{ page }}/{{ totalPages }}</span>
+          <span class="text-sm text-gray-700 tabular-nums px-1">{{ page }} / {{ totalPages }}</span>
           <button
-            class="w-8 h-8 rounded-lg flex items-center justify-center hover:bg-gray-100 disabled:opacity-30"
+            class="adm-pager-btn"
             :disabled="page >= totalPages"
             @click="handlePage(page + 1)"
           >
@@ -543,8 +563,8 @@ function statusClass(s: string) {
           >
             <code class="font-mono text-xs text-gray-800">{{ cdk.code }}</code>
             <button
-              class="flex-shrink-0 inline-flex items-center gap-1 px-2 py-1 rounded-md text-[11px] transition-colors"
-              :class="copiedResultIdx === resultCdks.indexOf(cdk) ? 'text-green-600 bg-green-50' : 'text-blue-500 hover:bg-blue-50'"
+              class="flex-shrink-0 inline-flex items-center gap-1 px-2 py-1 rounded-md text-xs transition-colors"
+              :class="copiedResultIdx === resultCdks.indexOf(cdk) ? 'text-green-600 bg-green-50' : 'text-brand-600 hover:bg-brand-50'"
               @click="copyResultCode(cdk.code, resultCdks.indexOf(cdk))"
             >
               <Copy v-if="copiedResultIdx !== resultCdks.indexOf(cdk)" class="w-3 h-3" />
@@ -565,7 +585,7 @@ function statusClass(s: string) {
             {{ copiedAll ? '已复制全部' : '复制全部CDK' }}
           </Button>
         </div>
-        <p class="text-center text-[10px] text-gray-300 mt-2">
+        <p class="text-center text-xs adm-muted mt-2">
           提示：CDK 按行分隔，可直接粘贴到表格/文档批量分发
         </p>
       </template>

frondend/src/views/admin/AdminDashboard.vue

@@ -1,7 +1,6 @@
 <script setup lang="ts">
-import { ref, onMounted } from 'vue'
-import { Users, QrCode, DollarSign, Activity } from 'lucide-vue-next'
-import { Card } from '@/components/ui/card'
+import { ref, computed, onMounted } from 'vue'
+import { Users, QrCode, Ticket, CheckCircle2, ChevronRight } from 'lucide-vue-next'
 import { useMessage } from '@/composables/useMessage'
 import * as adminApi from '@/api/admin'
 
@@ -20,6 +19,27 @@ const stats = ref({
   rate: 1,
 })
 
+const greeting = computed(() => {
+  const h = new Date().getHours()
+  if (h < 6) return '夜深了，注意休息'
+  if (h < 11) return '早上好'
+  if (h < 14) return '中午好'
+  if (h < 18) return '下午好'
+  return '晚上好'
+})
+
+// 统计卡片（余额与费率已在欢迎横幅展示）
+const statCards = computed(() => {
+  const s = stats.value
+  const usedRate = s.totalCDKs > 0 ? Math.round((s.usedCDKs / s.totalCDKs) * 100) : 0
+  return [
+    { label: '下级代理', value: s.totalAgents, hint: `${s.activeAgents} 个活跃`, hintClass: 'text-green-600', icon: Users, tone: 'bg-purple-50 text-purple-600' },
+    { label: 'CDK 总数', value: s.totalCDKs, hint: '', hintClass: '', icon: QrCode, tone: 'bg-brand-50 text-brand-600' },
+    { label: '已使用 CDK', value: s.usedCDKs, hint: `使用率 ${usedRate}%`, hintClass: 'text-gray-500', icon: CheckCircle2, tone: 'bg-green-50 text-green-600' },
+    { label: '未使用 CDK', value: Math.max(0, s.totalCDKs - s.usedCDKs), hint: '', hintClass: '', icon: Ticket, tone: 'bg-amber-50 text-amber-600' },
+  ]
+})
+
 onMounted(async () => {
   try {
     // 并行加载
@@ -50,100 +70,95 @@ onMounted(async () => {
 </script>
 
 <template>
-  <div class="p-6">
-    <h1 class="text-xl font-bold text-gray-900 mb-6">仪表盘</h1>
+  <div class="adm-page">
+    <!-- 欢迎横幅 -->
+    <div class="adm-welcome relative overflow-hidden hero-clip rounded-3xl p-6 mb-5 text-white rise-in">
+      <div class="pointer-events-none absolute -right-10 -top-16 w-56 h-56 rounded-full bg-white/10" />
+      <div class="pointer-events-none absolute right-24 top-16 w-24 h-24 rounded-full bg-white/10" />
+      <div class="relative flex items-center justify-between gap-4 flex-wrap">
+        <div>
+          <p class="text-sm text-white/90">{{ greeting }}</p>
+          <p class="mt-1 text-2xl font-bold tracking-tight">{{ me?.username || '管理员' }}</p>
+          <p class="mt-1 text-sm text-white/90">{{ me?.role === 'admin' ? '管理员' : '代理' }} · 费率 {{ (stats.rate * 100).toFixed(0) }}%</p>
+        </div>
+        <div class="text-right">
+          <p class="text-sm text-white/90">账户余额</p>
+          <p class="mt-0.5 text-3xl font-bold tabular-nums tracking-tight">¥{{ stats.balance.toFixed(2) }}</p>
+        </div>
+      </div>
+    </div>
 
     <!-- 统计卡片 -->
-    <div class="grid grid-cols-2 lg:grid-cols-4 gap-4 mb-8">
-      <Card class="p-4">
-        <div class="flex items-center gap-3">
-          <div class="w-10 h-10 rounded-lg bg-blue-100 text-blue-600 flex items-center justify-center">
-            <DollarSign class="w-5 h-5" />
-          </div>
-          <div>
-            <p class="text-xs text-gray-500">账户余额</p>
-            <p class="text-lg font-bold text-gray-900">{{ stats.balance.toFixed(2) }} 元</p>
-          </div>
+    <div class="grid grid-cols-2 lg:grid-cols-4 gap-3 md:gap-4 mb-5">
+      <div v-for="(c, i) in statCards" :key="c.label" class="adm-card adm-stat rise-in" :style="{ animationDelay: `${(i + 1) * 40}ms` }">
+        <div class="adm-stat-icon" :class="c.tone">
+          <component :is="c.icon" class="w-5 h-5" />
         </div>
-      </Card>
-
-      <Card class="p-4">
-        <div class="flex items-center gap-3">
-          <div class="w-10 h-10 rounded-lg bg-green-100 text-green-600 flex items-center justify-center">
-            <Activity class="w-5 h-5" />
-          </div>
-          <div>
-            <p class="text-xs text-gray-500">费率</p>
-            <p class="text-lg font-bold text-gray-900">{{ (stats.rate * 100).toFixed(0) }}%</p>
-          </div>
+        <div class="min-w-0">
+          <p class="adm-stat-label">{{ c.label }}</p>
+          <p class="adm-stat-value">{{ c.value }}</p>
+          <p v-if="c.hint" class="text-xs mt-0.5" :class="c.hintClass">{{ c.hint }}</p>
         </div>
-      </Card>
-
-      <Card class="p-4">
-        <div class="flex items-center gap-3">
-          <div class="w-10 h-10 rounded-lg bg-purple-100 text-purple-600 flex items-center justify-center">
-            <Users class="w-5 h-5" />
-          </div>
-          <div>
-            <p class="text-xs text-gray-500">下级代理</p>
-            <p class="text-lg font-bold text-gray-900">{{ stats.totalAgents }}</p>
-            <p class="text-xs text-green-600">{{ stats.activeAgents }} 个活跃</p>
-          </div>
-        </div>
-      </Card>
-
-      <Card class="p-4">
-        <div class="flex items-center gap-3">
-          <div class="w-10 h-10 rounded-lg bg-orange-100 text-orange-600 flex items-center justify-center">
-            <QrCode class="w-5 h-5" />
-          </div>
-          <div>
-            <p class="text-xs text-gray-500">CDK总数</p>
-            <p class="text-lg font-bold text-gray-900">{{ stats.totalCDKs }}</p>
-            <p class="text-xs text-green-600">{{ stats.usedCDKs }} 个已使用</p>
-          </div>
-        </div>
-      </Card>
+      </div>
     </div>
 
     <!-- 最近CDK -->
-    <Card class="p-5">
-      <div class="flex items-center justify-between mb-4">
-        <h2 class="font-semibold text-gray-900">最近生成的CDK</h2>
-        <router-link to="/admin/cdks" class="text-xs text-blue-600 hover:underline">查看全部</router-link>
+    <div class="adm-card overflow-hidden">
+      <div class="adm-card-head">
+        <p class="adm-card-title">最近生成的 CDK</p>
+        <router-link to="/admin/cdks" class="adm-link adm-link-brand">查看全部<ChevronRight class="w-3.5 h-3.5" /></router-link>
       </div>
 
-      <div v-if="cdks.length === 0" class="text-center py-8 text-sm text-gray-400">
-        暂无CDK数据
+      <div v-if="cdks.length === 0" class="adm-empty">
+        <div class="adm-empty-icon"><QrCode class="w-6 h-6" /></div>
+        暂无 CDK 数据
       </div>
 
       <div v-else class="overflow-x-auto">
-        <table class="w-full text-sm">
+        <table class="adm-table w-full">
           <thead>
-            <tr class="text-left text-xs text-gray-500 border-b border-gray-100">
-              <th class="pb-2 font-medium">CDK码</th>
-              <th class="pb-2 font-medium">售价</th>
-              <th class="pb-2 font-medium">状态</th>
-              <th class="pb-2 font-medium">创建时间</th>
+            <tr>
+              <th class="px-5 py-2.5">CDK 码</th>
+              <th class="px-5 py-2.5">类型</th>
+              <th class="px-5 py-2.5">售价</th>
+              <th class="px-5 py-2.5">状态</th>
+              <th class="px-5 py-2.5">创建时间</th>
             </tr>
           </thead>
           <tbody>
-            <tr v-for="cdk in cdks.slice(0, 10)" :key="cdk.id" class="border-b border-gray-50">
-              <td class="py-2.5 font-mono text-xs">{{ cdk.code }}</td>
-              <td class="py-2.5">{{ cdk.price.toFixed(2) }} 元</td>
-              <td class="py-2.5">
-                <span
-                  class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium"
-                  :class="cdk.status === 'used' ? 'bg-gray-100 text-gray-600' : cdk.status === 'disabled' ? 'bg-red-50 text-red-600' : 'bg-green-100 text-green-700'"
-                >
+            <tr v-for="cdk in cdks.slice(0, 10)" :key="cdk.id">
+              <td class="px-5 py-3 font-mono text-xs text-gray-900">{{ cdk.code }}</td>
+              <td class="px-5 py-3">
+                <span class="adm-badge no-dot" :class="cdk.type === 'vip' ? 'adm-badge-amber' : 'adm-badge-sky'">{{ cdk.type === 'vip' ? `VIP ${cdk.vipDays} 天` : `${cdk.maxRuns} 次` }}</span>
+              </td>
+              <td class="px-5 py-3 tabular-nums">¥{{ cdk.price.toFixed(2) }}</td>
+              <td class="px-5 py-3">
+                <span class="adm-badge" :class="cdk.status === 'used' ? 'adm-badge-gray' : cdk.status === 'disabled' ? 'adm-badge-red' : 'adm-badge-green'">
                   {{ cdk.status === 'used' ? '已使用' : cdk.status === 'disabled' ? '已禁用' : '未使用' }}
                 </span>
               </td>
-              <td class="py-2.5 text-gray-500">{{ new Date(cdk.createdAt).toLocaleString() }}</td>
+              <td class="px-5 py-3 text-gray-500 whitespace-nowrap">{{ new Date(cdk.createdAt).toLocaleString('zh-CN') }}</td>
             </tr>
           </tbody>
         </table>
       </div>
-    </Card>
+    </div>
   </div>
 </template>
+
+<style scoped>
+/* 欢迎横幅：品牌渐变，右上带天空蓝 */
+.adm-welcome {
+  background-color: #0b8672;
+  /* 渐变整体压在 #0b8672 及更深，白字 ≥ 4.5:1 */
+  background-image: linear-gradient(135deg, #0b8672 0%, #0a7a6e 55%, #08604f 100%);
+  box-shadow: 0 12px 30px rgb(11 134 114 / 0.22);
+}
+</style>
+
+<style>
+html.dark .adm-welcome {
+  background-image: linear-gradient(135deg, #0c6d5d 0%, #0b5f55 60%, #094c44 100%);
+  box-shadow: none;
+}
+</style>

frondend/src/views/admin/AdminLayout.vue

@@ -50,7 +50,25 @@ const visibleNavItems = computed(() =>
   navItems.filter((item) => !item.adminOnly || adminInfo.value?.role === 'admin')
 )
 
-const activeNav = computed(() => route.name as string)
+// 详情类子路由（如工单详情）高亮其所属的列表项
+const activeNav = computed(() => {
+  const n = route.name as string
+  if (n === 'admin-ticket-detail') return 'admin-tickets'
+  return n
+})
+const currentNav = computed(() => navItems.find((i) => i.name === activeNav.value) || null)
+
+// 侧栏分组：概览 / 运营 / 系统
+const NAV_GROUPS: { title: string; names: string[] }[] = [
+  { title: '概览', names: ['admin-dashboard'] },
+  { title: '运营', names: ['admin-agents', 'admin-users', 'admin-cdks', 'admin-announcements', 'admin-tickets'] },
+  { title: '系统', names: ['admin-pending-schools', 'admin-settings'] },
+]
+const navGroups = computed(() =>
+  NAV_GROUPS.map((g) => ({ title: g.title, items: visibleNavItems.value.filter((i) => g.names.includes(i.name)) })).filter(
+    (g) => g.items.length > 0,
+  ),
+)
 
 // 公告相关（代理端）
 const showAnnPanel = ref(false)
@@ -154,122 +172,115 @@ function handleLogout() {
 </script>
 
 <template>
-  <div class="min-h-dvh bg-gray-100 flex">
-    <!-- 手机端顶栏 -->
-    <div class="fixed top-0 left-0 right-0 h-14 bg-white border-b border-gray-200 flex items-center px-4 gap-3 z-30 md:hidden">
-      <button
-        class="w-9 h-9 flex items-center justify-center rounded-lg hover:bg-gray-100 transition-colors"
-        @click="toggleSidebar"
-      >
+  <div class="adm-shell min-h-dvh flex">
+    <!-- ======== 手机端顶栏（玻璃） ======== -->
+    <div class="fixed top-0 left-0 right-0 h-14 glass-bar border-b border-gray-200/70 flex items-center px-3 gap-2 z-30 md:hidden">
+      <button class="w-10 h-10 flex items-center justify-center rounded-xl hover:bg-gray-100 transition-colors" aria-label="菜单" @click="toggleSidebar">
         <Menu v-if="!showSidebar" class="w-5 h-5 text-gray-700" />
         <X v-else class="w-5 h-5 text-gray-700" />
       </button>
-      <div class="flex items-center gap-2">
-        <div class="w-7 h-7 rounded-md bg-blue-600 flex items-center justify-center">
-          <Shield class="w-3.5 h-3.5 text-white" />
-        </div>
-        <span class="font-medium text-gray-900 text-sm">管理后台</span>
-      </div>
-      <div class="flex-1" />
-      <!-- 手机端铃铛 -->
-      <button class="relative w-8 h-8 flex items-center justify-center rounded-lg hover:bg-gray-100" @click="openAnnPanel">
+      <p class="flex-1 min-w-0 text-[15px] font-semibold text-gray-900 truncate">{{ currentNav?.label || '管理后台' }}</p>
+      <button class="relative w-10 h-10 flex items-center justify-center rounded-xl hover:bg-gray-100" aria-label="公告" @click="openAnnPanel">
         <Bell class="w-5 h-5 text-gray-600" />
-        <span v-if="unreadCount > 0" class="absolute -top-0.5 -right-0.5 min-w-[16px] h-4 px-1 rounded-full bg-red-500 text-white text-[9px] font-bold flex items-center justify-center leading-none">{{ unreadCount > 99 ? '99+' : unreadCount }}</span>
+        <span v-if="unreadCount > 0" class="absolute top-1 right-1 min-w-[18px] h-[18px] px-1 rounded-full bg-red-500 text-white text-xs font-bold flex items-center justify-center leading-none ring-2 ring-white dark:ring-gray-50">{{ unreadCount > 99 ? '99+' : unreadCount }}</span>
       </button>
     </div>
 
     <!-- 手机端遮罩层 -->
     <transition name="fade">
-      <div
-        v-if="showSidebar"
-        class="fixed inset-0 bg-black/40 z-40 md:hidden"
-        @click="showSidebar = false"
-      />
+      <div v-if="showSidebar" class="fixed inset-0 bg-black/40 z-40 md:hidden" @click="showSidebar = false" />
     </transition>
 
-    <!-- 左侧导航 -->
+    <!-- ======== 左侧导航 ======== -->
     <aside
-      class="bg-white border-r border-gray-200 flex flex-col flex-shrink-0 z-50
-             fixed inset-y-0 left-0 w-60 transition-transform duration-200 ease-in-out
-             md:relative md:inset-auto md:z-auto md:translate-x-0"
+      class="adm-aside flex flex-col flex-shrink-0 z-50 fixed inset-y-0 left-0 w-64 transition-transform duration-300 ease-[var(--ease-out-soft)]
+             md:sticky md:top-0 md:h-dvh md:translate-x-0"
       :class="showSidebar ? 'translate-x-0' : '-translate-x-full md:translate-x-0'"
     >
-        <!-- Logo（桌面） -->
-        <div class="h-16 flex items-center gap-2.5 px-5 border-b border-gray-100 hidden md:flex">
-          <div class="w-8 h-8 rounded-lg bg-blue-600 flex items-center justify-center">
-            <Shield class="w-4 h-4 text-white" />
-          </div>
-          <span class="font-semibold text-gray-900 text-sm flex-1">管理后台</span>
-          <!-- 桌面端铃铛 -->
-          <button class="relative w-8 h-8 flex items-center justify-center rounded-lg hover:bg-gray-100" @click="openAnnPanel">
-            <Bell class="w-4 h-4 text-gray-500" />
-            <span v-if="unreadCount > 0" class="absolute -top-0.5 -right-0.5 min-w-[14px] h-3.5 px-1 rounded-full bg-red-500 text-white text-[8px] font-bold flex items-center justify-center leading-none">{{ unreadCount > 99 ? '99+' : unreadCount }}</span>
-          </button>
+      <!-- 品牌区 -->
+      <div class="h-16 flex items-center gap-3 px-5 flex-shrink-0">
+        <div class="w-9 h-9 rounded-xl bg-brand-gradient flex items-center justify-center shadow-md shadow-brand-500/25">
+          <Shield class="w-[18px] h-[18px] text-white" />
         </div>
-
-        <!-- 手机端顶部关闭 -->
-        <div class="h-14 flex items-center justify-between px-4 border-b border-gray-100 md:hidden">
-          <div class="flex items-center gap-2">
-            <div class="w-7 h-7 rounded-md bg-blue-600 flex items-center justify-center">
-              <Shield class="w-3.5 h-3.5 text-white" />
-            </div>
-            <span class="font-medium text-gray-900 text-sm">管理后台</span>
-          </div>
-          <button class="w-8 h-8 flex items-center justify-center rounded-lg hover:bg-gray-100" @click="showSidebar = false">
-            <X class="w-4 h-4 text-gray-500" />
-          </button>
+        <div class="flex-1 min-w-0">
+          <p class="font-bold tracking-tight text-gray-900 text-[15px] leading-tight">小助手后台</p>
+          <p class="text-xs text-gray-500">{{ adminInfo?.role === 'admin' ? '管理员控制台' : '代理控制台' }}</p>
         </div>
+        <button class="w-8 h-8 flex items-center justify-center rounded-lg hover:bg-gray-100 md:hidden" aria-label="关闭菜单" @click="showSidebar = false">
+          <X class="w-4 h-4 text-gray-500" />
+        </button>
+      </div>
 
-        <!-- 导航菜单 -->
-        <nav class="flex-1 py-3 px-3 space-y-1 overflow-y-auto">
-          <button
-            v-for="item in visibleNavItems"
-            :key="item.name"
-            class="w-full flex items-center gap-3 px-3 py-2.5 rounded-lg text-sm transition-colors"
-            :class="activeNav === item.name
-              ? 'bg-blue-50 text-blue-700 font-medium'
-              : 'text-gray-600 hover:bg-gray-50 hover:text-gray-900'"
-            @click="navigateTo(item)"
-          >
-            <component :is="item.icon" class="w-4 h-4 flex-shrink-0" />
-            <span>{{ item.label }}</span>
-          </button>
-        </nav>
-
-        <!-- 底部用户信息 -->
-        <div class="border-t border-gray-100 p-3 relative">
-          <button
-            class="w-full flex items-center gap-3 px-3 py-2 rounded-lg hover:bg-gray-50 transition-colors"
-            @click="showUserMenu = !showUserMenu"
-          >
-            <div class="w-8 h-8 rounded-full bg-blue-100 text-blue-600 flex items-center justify-center text-sm font-medium flex-shrink-0">
-              {{ (adminInfo?.username || 'A')[0].toUpperCase() }}
-            </div>
-            <div class="flex-1 min-w-0 text-left">
-              <p class="text-sm font-medium text-gray-900 truncate">{{ adminInfo?.username }}</p>
-              <p class="text-xs text-gray-400 truncate">{{ adminInfo?.role === 'admin' ? '管理员' : '代理' }}</p>
-            </div>
-            <ChevronDown class="w-4 h-4 text-gray-400" />
-          </button>
-
-          <div
-            v-if="showUserMenu"
-            class="absolute bottom-full left-3 right-3 mb-1 bg-white rounded-lg border border-gray-200 shadow-lg overflow-hidden"
-          >
+      <!-- 导航菜单（分组） -->
+      <nav class="flex-1 px-3 pb-3 overflow-y-auto">
+        <template v-for="group in navGroups" :key="group.title">
+          <p class="px-3 pt-4 pb-1.5 text-xs font-semibold text-gray-400 tracking-wider">{{ group.title }}</p>
+          <div class="space-y-0.5">
             <button
-              class="w-full flex items-center gap-2 px-3 py-2.5 text-sm text-red-600 hover:bg-red-50 transition-colors"
-              @click="handleLogout"
+              v-for="item in group.items"
+              :key="item.name"
+              class="adm-nav-item w-full flex items-center gap-3 px-3 h-10 rounded-xl text-sm transition-colors"
+              :class="activeNav === item.name ? 'is-active' : 'text-gray-600 hover:bg-gray-100 hover:text-gray-900'"
+              :aria-current="activeNav === item.name ? 'page' : undefined"
+              @click="navigateTo(item)"
             >
-              <LogOut class="w-4 h-4" />
-              <span>退出登录</span>
+              <component :is="item.icon" class="w-[18px] h-[18px] flex-shrink-0" />
+              <span class="flex-1 text-left">{{ item.label }}</span>
             </button>
           </div>
-        </div>
-      </aside>
+        </template>
+      </nav>
 
-    <!-- 右侧内容区 -->
-    <main class="flex-1 overflow-y-auto pt-14 md:pt-0">
-      <router-view />
+      <!-- 底部用户信息 -->
+      <div class="p-3 relative flex-shrink-0 border-t border-gray-100">
+        <button
+          class="w-full flex items-center gap-3 px-2.5 py-2 rounded-xl hover:bg-gray-100 transition-colors"
+          @click="showUserMenu = !showUserMenu"
+        >
+          <div class="w-9 h-9 rounded-full bg-brand-gradient text-white flex items-center justify-center text-sm font-bold flex-shrink-0">
+            {{ (adminInfo?.username || 'A')[0].toUpperCase() }}
+          </div>
+          <div class="flex-1 min-w-0 text-left">
+            <p class="text-sm font-semibold text-gray-900 truncate">{{ adminInfo?.username }}</p>
+            <p class="text-xs text-gray-500 truncate">{{ adminInfo?.role === 'admin' ? '管理员' : '代理' }}</p>
+          </div>
+          <ChevronDown class="w-4 h-4 text-gray-400 transition-transform" :class="showUserMenu && 'rotate-180'" />
+        </button>
+
+        <div
+          v-if="showUserMenu"
+          class="absolute bottom-full left-3 right-3 mb-1 bg-white rounded-xl border border-gray-200 shadow-lg overflow-hidden"
+        >
+          <button
+            class="w-full flex items-center gap-2 px-3 py-2.5 text-sm text-red-600 hover:bg-red-50 transition-colors"
+            @click="handleLogout"
+          >
+            <LogOut class="w-4 h-4" />
+            <span>退出登录</span>
+          </button>
+        </div>
+      </div>
+    </aside>
+
+    <!-- ======== 右侧内容区 ======== -->
+    <!-- 内容区即滚动容器：html/body 为手机 H5 外壳设了 overflow:hidden，后台必须在这里滚动；
+         h-dvh 固定高度让 overflow-y-auto 生效，桌面顶栏 sticky 在此容器内吸顶 -->
+    <main class="flex-1 min-w-0 h-dvh overflow-y-auto overscroll-contain pt-14 md:pt-0 flex flex-col">
+      <!-- 桌面顶栏：面包屑 + 公告 -->
+      <div class="hidden md:flex sticky top-0 z-20 h-14 items-center gap-3 px-8 glass-bar border-b border-gray-200/70">
+        <p class="text-sm text-gray-500">管理后台</p>
+        <span class="adm-muted" aria-hidden="true">/</span>
+        <p class="text-sm font-semibold text-gray-900">{{ currentNav?.label || '' }}</p>
+        <div class="flex-1" />
+        <button class="relative h-9 px-3 flex items-center gap-1.5 rounded-xl text-sm text-gray-600 hover:bg-gray-100" @click="openAnnPanel">
+          <Bell class="w-4 h-4" />
+          公告
+          <span v-if="unreadCount > 0" class="min-w-[18px] h-[18px] px-1 rounded-full bg-red-500 text-white text-xs font-bold flex items-center justify-center leading-none">{{ unreadCount > 99 ? '99+' : unreadCount }}</span>
+        </button>
+      </div>
+      <div class="flex-1 min-w-0">
+        <router-view />
+      </div>
     </main>
 
     <!-- 公告面板遮罩 -->
@@ -279,12 +290,12 @@ function handleLogout() {
 
     <!-- 公告面板 -->
     <transition name="slide-right">
-      <div v-if="showAnnPanel" class="fixed top-0 right-0 bottom-0 z-50 w-[85%] max-w-sm bg-white shadow-xl flex flex-col">
-        <div class="flex items-center justify-between px-4 py-3 border-b border-gray-100">
+      <div v-if="showAnnPanel" class="fixed top-0 right-0 bottom-0 z-50 w-[85%] max-w-sm bg-white shadow-2xl flex flex-col rounded-l-3xl overflow-hidden">
+        <div class="flex items-center justify-between px-5 py-4 border-b border-gray-100">
           <div class="flex items-center gap-2">
-            <Bell class="w-5 h-5 text-blue-500" />
-            <span class="font-semibold text-gray-900 text-sm">公告</span>
-            <span v-if="unreadCount > 0" class="text-[10px] px-1.5 py-0.5 rounded-full bg-red-100 text-red-600 font-medium">{{ unreadCount }} 条未读</span>
+            <div class="w-8 h-8 rounded-xl bg-brand-gradient flex items-center justify-center"><Bell class="w-4 h-4 text-white" /></div>
+            <span class="font-bold text-gray-900 text-base">公告</span>
+            <span v-if="unreadCount > 0" class="text-xs px-1.5 py-0.5 rounded-full bg-red-100 text-red-600 font-medium">{{ unreadCount }} 条未读</span>
           </div>
           <button class="w-7 h-7 rounded-full hover:bg-gray-100 flex items-center justify-center" @click="showAnnPanel = false">
             <X class="w-4 h-4 text-gray-400" />
@@ -308,18 +319,18 @@ function handleLogout() {
               v-for="item in announcements"
               :key="item.id"
               class="px-4 py-3.5 hover:bg-gray-50 transition-colors cursor-pointer"
-              :class="{ 'bg-blue-50/30': !item.isRead }"
+              :class="{ 'bg-brand-50': !item.isRead }"
               @click="openAgentDetail(item)"
             >
               <div class="flex items-start gap-2.5">
                 <div class="mt-0.5 flex-shrink-0">
-                  <Circle v-if="!item.isRead" class="w-3 h-3 text-blue-500" />
+                  <Circle v-if="!item.isRead" class="w-3 h-3 text-brand-500 fill-current" />
                   <CheckCircle v-else class="w-3 h-3 text-green-400" />
                 </div>
                 <div class="flex-1 min-w-0">
                   <p class="text-sm font-medium text-gray-900" :class="{ 'font-semibold': !item.isRead }">{{ item.title }}</p>
                   <p class="text-xs text-gray-500 leading-relaxed mt-0.5 line-clamp-1">{{ item.content }}</p>
-                  <p class="text-[10px] text-gray-400 mt-1">{{ new Date(item.createdAt).toLocaleString('zh-CN') }}</p>
+                  <p class="text-xs text-gray-400 mt-1">{{ new Date(item.createdAt).toLocaleString('zh-CN') }}</p>
                 </div>
               </div>
             </div>
@@ -340,12 +351,12 @@ function handleLogout() {
       title="公告详情"
       @update:open="(v: boolean) => { if (!v) showDetail = false }"
     >
-      <div class="h-1.5 bg-gradient-to-r from-blue-500 to-blue-400" />
+      <div class="h-1.5 bg-gradient-to-r from-brand-400 to-sky-400" />
       <div class="p-6">
         <div class="flex items-center justify-between mb-3">
           <div class="flex items-center gap-2.5">
-            <div class="w-9 h-9 rounded-xl bg-blue-100 flex items-center justify-center">
-              <Bell class="w-5 h-5 text-blue-500" />
+            <div class="w-9 h-9 rounded-xl bg-brand-100 flex items-center justify-center">
+              <Bell class="w-5 h-5 text-brand-600" />
             </div>
             <h3 class="text-base font-bold text-gray-900">{{ detailItem?.title }}</h3>
           </div>
@@ -354,7 +365,7 @@ function handleLogout() {
           </button>
         </div>
         <div class="flex items-center gap-2 mb-4">
-          <span class="text-[10px] text-gray-400">{{ detailItem ? new Date(detailItem.createdAt).toLocaleString('zh-CN') : '' }}</span>
+          <span class="text-xs text-gray-400">{{ detailItem ? new Date(detailItem.createdAt).toLocaleString('zh-CN') : '' }}</span>
         </div>
         <div class="bg-gray-50 rounded-xl p-4 max-h-[50vh] overflow-y-auto">
           <p class="text-sm text-gray-600 leading-relaxed whitespace-pre-wrap">{{ detailItem?.content }}</p>
@@ -376,7 +387,7 @@ function handleLogout() {
     >
       <div class="p-6">
         <div class="flex items-center gap-2 mb-1">
-            <Bell class="w-5 h-5 text-blue-500" />
+            <Bell class="w-5 h-5 text-brand-600" />
             <h3 class="text-base font-semibold text-gray-900">{{ currentForcePopup?.title }}</h3>
           </div>
         <p class="text-sm text-gray-600 leading-relaxed mt-3 whitespace-pre-wrap">{{ currentForcePopup?.content }}</p>
@@ -405,3 +416,20 @@ function handleLogout() {
   transform: translateX(100%);
 }
 </style>
+
+<style>
+/* 后台外壳：浅薄荷灰底 + 白色侧栏（非 scoped，暗色用 html.dark 覆盖） */
+.adm-shell { background-color: #f4f8f6; }
+.adm-aside {
+  background-color: var(--color-card);
+  border-right: 1px solid var(--color-gray-200);
+}
+.adm-nav-item.is-active {
+  background-color: var(--color-brand-50);
+  color: var(--color-brand-700);
+  font-weight: 600;
+  box-shadow: inset 3px 0 0 var(--color-brand-500);
+}
+html.dark .adm-shell { background-color: #0f1815; }
+html.dark .adm-nav-item.is-active { box-shadow: inset 3px 0 0 var(--color-brand-400); }
+</style>

frondend/src/views/admin/AdminLogin.vue

@@ -49,11 +49,11 @@ async function handleLogin() {
 </script>
 
 <template>
-  <div class="min-h-dvh flex items-center justify-center bg-gradient-to-br from-blue-50 to-indigo-100 p-4">
+  <div class="min-h-dvh flex items-center justify-center bg-gradient-to-br from-brand-50 via-gray-50 to-sky-50 p-4">
     <div class="w-full max-w-md">
       <!-- 标题 -->
       <div class="text-center mb-8">
-        <div class="w-16 h-16 rounded-2xl bg-blue-600 flex items-center justify-center mx-auto mb-4 shadow-lg shadow-blue-200">
+        <div class="w-16 h-16 rounded-2xl bg-brand-gradient flex items-center justify-center mx-auto mb-4 shadow-xl shadow-brand-500/30">
           <Shield class="w-8 h-8 text-white" />
         </div>
         <h1 class="text-2xl font-bold text-gray-900">管理后台</h1>

frondend/src/views/admin/AdminPendingSchools.vue

@@ -152,43 +152,39 @@ async function copyText(text: string) {
 </script>
 
 <template>
-  <div class="p-6">
+  <div class="adm-page">
     <!-- 标题栏 -->
-    <div class="flex items-center justify-between mb-6">
+    <div class="adm-head">
       <div class="flex items-center gap-3">
-        <div class="w-10 h-10 rounded-xl bg-amber-100 flex items-center justify-center">
-          <Shield class="w-5 h-5 text-amber-600" />
+        <div class="adm-head-icon">
+          <Shield class="w-5 h-5" />
         </div>
         <div>
-          <h1 class="text-lg font-bold text-gray-900">待适配学校</h1>
-          <p class="text-sm text-gray-400">用户提交的登录失败测试账号，用于适配新学校</p>
+          <h1 class="adm-title">待适配学校</h1>
+          <p class="adm-sub">用户提交的登录失败测试账号，用于适配新学校</p>
         </div>
       </div>
-      <div class="flex items-center gap-2">
+      <div class="flex items-center gap-2 flex-wrap">
         <!-- 筛选 -->
-        <div class="flex gap-1 bg-gray-100 rounded-lg p-0.5 mr-3">
+        <div class="adm-seg">
           <button
-            class="px-3 py-1.5 text-xs font-medium rounded-md transition-colors"
-            :class="statusFilter === 'pending' ? 'bg-white text-gray-900 shadow-sm' : 'text-gray-500 hover:text-gray-700'"
+            :class="statusFilter === 'pending' && 'is-active'"
             @click="statusFilter = 'pending'; loadData()"
           >待处理</button>
           <button
-            class="px-3 py-1.5 text-xs font-medium rounded-md transition-colors"
-            :class="statusFilter === 'completed' ? 'bg-white text-gray-900 shadow-sm' : 'text-gray-500 hover:text-gray-700'"
+            :class="statusFilter === 'completed' && 'is-active'"
             @click="statusFilter = 'completed'; loadData()"
           >已完成</button>
           <button
-            class="px-3 py-1.5 text-xs font-medium rounded-md transition-colors"
-            :class="statusFilter === 'rejected' ? 'bg-white text-gray-900 shadow-sm' : 'text-gray-500 hover:text-gray-700'"
+            :class="statusFilter === 'rejected' && 'is-active'"
             @click="statusFilter = 'rejected'; loadData()"
           >已拒绝</button>
           <button
-            class="px-3 py-1.5 text-xs font-medium rounded-md transition-colors"
-            :class="statusFilter === '' ? 'bg-white text-gray-900 shadow-sm' : 'text-gray-500 hover:text-gray-700'"
+            :class="statusFilter === '' && 'is-active'"
             @click="statusFilter = ''; loadData()"
           >全部</button>
         </div>
-        <Button variant="outline" size="sm" class="h-9 text-xs" @click="loadData">
+        <Button variant="outline" class="h-10" @click="loadData">
           <RefreshCw class="w-3.5 h-3.5 mr-1" />
           刷新
         </Button>
@@ -198,43 +194,43 @@ async function copyText(text: string) {
     <!-- 已适配学校信息 -->
     <div
       v-if="adaptedSchools.size > 0 && statusFilter !== 'completed'"
-      class="mb-6 bg-green-50 border border-green-200 rounded-xl px-4 py-3"
+      class="mb-4 bg-green-50 border border-green-200 rounded-2xl px-5 py-4"
     >
       <div class="flex items-center gap-2 text-sm font-medium text-green-700 mb-1.5">
         <CheckCircle class="w-4 h-4" />
         已适配学校（{{ adaptedSchools.size }} 所）
       </div>
-      <p class="text-xs text-green-600 leading-relaxed">
+      <p class="text-xs text-green-700 leading-relaxed">
         <template v-for="(name, schoolId, i) in adaptedSchools" :key="schoolId">
           {{ name }}<span v-if="i < adaptedSchools.size - 1">、</span>
         </template>
       </p>
-      <p class="text-[10px] text-green-500 mt-1">以下学校已适配完成，若有新登录失败反馈请优先核对该学校登录流程</p>
+      <p class="text-xs text-green-700 mt-1">以下学校已适配完成，若有新登录失败反馈请优先核对该学校登录流程</p>
     </div>
 
     <!-- 搜索 -->
-    <div class="relative max-w-xs mb-6">
+    <div class="adm-toolbar"><div class="relative flex-1 min-w-[200px] max-w-sm">
       <Search class="absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-400" />
       <Input
         v-model="searchKeyword"
         placeholder="搜索学校名称..."
-        class="pl-9 h-9 text-sm"
+        class="pl-9 h-10 text-sm"
         @input="buildGroups"
       />
-    </div>
+    </div></div>
 
     <!-- 主卡片 -->
-    <div class="bg-white rounded-xl border border-gray-200 overflow-hidden">
+    <div class="adm-card overflow-hidden">
       <!-- 加载骨架 -->
       <div v-if="loading" class="p-6 space-y-4">
         <div v-for="i in 4" :key="i" class="h-10 bg-gray-50 rounded animate-pulse" />
       </div>
 
       <!-- 空状态 -->
-      <div v-else-if="groups.length === 0" class="text-center py-20 text-gray-400">
-        <Shield class="w-12 h-12 mx-auto mb-3 opacity-30" />
-        <p class="text-sm">暂无待适配学校</p>
-        <p class="text-xs text-gray-300 mt-1">当用户提交登录失败的测试账号后，将在这里显示</p>
+      <div v-else-if="groups.length === 0" class="adm-empty">
+        <div class="adm-empty-icon"><Shield class="w-6 h-6" /></div>
+        <p class="text-sm font-medium text-gray-700">暂无待适配学校</p>
+        <p class="text-xs mt-1">当用户提交登录失败的测试账号后，将在这里显示</p>
       </div>
 
       <!-- 学校列表 -->
@@ -244,26 +240,26 @@ async function copyText(text: string) {
           :key="group.schoolId"
         >
           <!-- 学校标题栏 -->
-          <div class="px-5 py-3 bg-gray-50/80 flex items-center justify-between border-b border-gray-100">
-            <div class="flex items-center gap-2.5">
-              <Shield class="w-4 h-4 text-amber-500" />
+          <div class="px-5 py-3 bg-gray-50 flex items-center justify-between gap-3 flex-wrap border-b border-gray-100">
+            <div class="flex items-center gap-2.5 flex-wrap">
+              <Shield class="w-4 h-4 text-amber-600" />
               <span class="text-sm font-semibold text-gray-900">{{ group.schoolName }}</span>
               <span
                 v-if="adaptedSchools.has(group.schoolId)"
-                class="text-[10px] px-1.5 py-0.5 rounded-full bg-green-50 text-green-600 font-medium border border-green-100"
+                class="adm-badge adm-badge-green"
               >
                 已适配
               </span>
-              <span class="text-[10px] px-1.5 py-0.5 rounded-full bg-amber-50 text-amber-600 font-medium border border-amber-100">
+              <span class="adm-badge no-dot adm-badge-amber">
                 {{ group.count }} 条
               </span>
-              <span class="text-[10px] text-gray-400 font-mono">{{ group.schoolId }}</span>
+              <span class="text-xs text-gray-500 font-mono">{{ group.schoolId }}</span>
             </div>
             <div class="flex items-center gap-1.5">
               <Button
                 v-if="statusFilter !== 'completed' && statusFilter !== 'rejected'"
                 size="sm"
-                class="h-7 text-xs whitespace-nowrap"
+                class="h-8 text-xs whitespace-nowrap"
                 @click="handleMarkDone(group.records[0])"
               >
                 <CheckCircle class="w-3 h-3 mr-1 shrink-0" />
@@ -273,7 +269,7 @@ async function copyText(text: string) {
                 v-if="statusFilter === 'pending'"
                 variant="outline"
                 size="sm"
-                class="h-7 text-xs text-red-500 border-red-200 hover:bg-red-50 whitespace-nowrap"
+                class="h-8 text-xs text-red-600 border-red-200 hover:bg-red-50 whitespace-nowrap"
                 @click="openRejectModal(group.records[0])"
               >
                 <XCircle class="w-3 h-3 mr-1 shrink-0" />
@@ -284,7 +280,7 @@ async function copyText(text: string) {
 
           <!-- 账号列表（小屏横向滚动） -->
           <div class="overflow-x-auto">
-            <table class="w-full text-sm min-w-[760px]">
+            <table class="adm-table w-full text-sm min-w-[760px]">
             <thead>
               <tr class="text-left text-xs text-gray-400 border-b border-gray-50">
                 <th class="px-5 py-2.5 font-medium w-[16%]">账号</th>
@@ -300,7 +296,7 @@ async function copyText(text: string) {
               <tr
                 v-for="r in group.records"
                 :key="r.id"
-                class="border-t border-gray-50 hover:bg-gray-50/50 transition-colors"
+                class=""
               >
                 <!-- 账号 -->
                 <td class="px-5 py-3">
@@ -317,14 +313,14 @@ async function copyText(text: string) {
                       {{ showPasswordMap[r.id] ? r.password : r.password }}
                     </span>
                     <button
-                      class="inline-flex items-center gap-0.5 text-gray-400 hover:text-blue-500 transition-colors"
+                      class="inline-flex items-center gap-0.5 text-gray-400 hover:text-brand-600 transition-colors"
                       @click="togglePassword(r.id)"
                     >
                       <Eye v-if="!showPasswordMap[r.id]" class="w-3.5 h-3.5" />
                       <EyeOff v-else class="w-3.5 h-3.5" />
                     </button>
                     <button
-                      class="inline-flex items-center gap-0.5 text-gray-400 hover:text-blue-500 transition-colors"
+                      class="inline-flex items-center gap-0.5 text-gray-400 hover:text-brand-600 transition-colors"
                       @click="copyText(r.password)"
                     >
                       <Copy class="w-3.5 h-3.5" />
@@ -334,7 +330,7 @@ async function copyText(text: string) {
                 <!-- 联系邮箱 -->
                 <td class="px-5 py-3">
                   <span v-if="r.email" class="text-gray-600 text-xs">{{ r.email }}</span>
-                  <span v-else class="text-gray-300 text-xs">--</span>
+                  <span v-else class="adm-muted text-xs">--</span>
                 </td>
                 <!-- IP -->
                 <td class="px-5 py-3">
@@ -343,14 +339,14 @@ async function copyText(text: string) {
                 <!-- 状态 -->
                 <td class="px-5 py-3">
                   <span
-                    class="inline-flex items-center px-1.5 py-0.5 rounded-full text-[10px] font-medium"
+                    class="inline-flex items-center px-1.5 py-0.5 rounded-full text-xs font-medium"
                     :class="r.status === 'pending' ? 'bg-amber-50 text-amber-600' : r.status === 'rejected' ? 'bg-red-50 text-red-600' : 'bg-green-50 text-green-600'"
                   >
                     {{ r.status === 'pending' ? '待处理' : r.status === 'rejected' ? '已拒绝' : '已完成' }}
                   </span>
                   <p
                     v-if="r.status === 'rejected' && r.rejectReason"
-                    class="text-[10px] text-red-400 mt-1 max-w-[180px] leading-snug"
+                    class="text-xs text-red-400 mt-1 max-w-[180px] leading-snug"
                     :title="r.rejectReason"
                   >理由：{{ r.rejectReason }}</p>
                 </td>
@@ -360,7 +356,7 @@ async function copyText(text: string) {
                 <td class="px-5 py-3 whitespace-nowrap">
                   <div v-if="r.status === 'pending'" class="flex items-center gap-1 whitespace-nowrap">
                     <button
-                      class="inline-flex items-center gap-1 px-2 py-1 rounded-lg text-xs whitespace-nowrap text-blue-500 hover:bg-blue-50 transition-colors"
+                      class="inline-flex items-center gap-1 px-2 py-1 rounded-lg text-xs whitespace-nowrap text-brand-600 hover:bg-brand-50 transition-colors"
                       @click="handleMarkDone(r)"
                     >
                       <CheckCircle class="w-3 h-3 shrink-0" />
@@ -408,9 +404,9 @@ async function copyText(text: string) {
         rows="4"
         maxlength="500"
         placeholder="请说明拒绝理由（必填），理由将通过邮件通知该学校的联系邮箱"
-        class="w-full rounded-lg border border-gray-200 px-3 py-2.5 text-sm text-gray-900 placeholder:text-gray-300 focus:outline-none focus:ring-2 focus:ring-red-100 focus:border-red-300 resize-none"
+        class="w-full rounded-lg border border-gray-200 px-3 py-2.5 text-sm text-gray-900 placeholder:adm-muted focus:outline-none focus:ring-2 focus:ring-red-100 focus:border-red-300 resize-none"
       ></textarea>
-      <p class="text-[11px] text-gray-400 mt-1">发送后将邮件通知该条记录的联系邮箱</p>
+      <p class="text-xs text-gray-400 mt-1">发送后将邮件通知该条记录的联系邮箱</p>
       <div class="flex justify-end gap-2 mt-5">
         <Button variant="outline" size="sm" class="h-9 text-xs" :disabled="rejectSubmitting" @click="closeRejectModal">
           取消

frondend/src/views/admin/AdminSettings.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { ref, onMounted } from 'vue'
-import { Save, LoaderCircle, Euro, Gift, Mail, Send, KeyRound, Coins } from 'lucide-vue-next'
+import { Save, LoaderCircle, Euro, Gift, Mail, Send, KeyRound, Coins, Settings as SettingsIcon, ShoppingCart } from 'lucide-vue-next'
 import { Button } from '@/components/ui/button'
 import { Input } from '@/components/ui/input'
 import { Label } from '@/components/ui/label'
@@ -36,6 +36,17 @@ const smtpFrom = ref('')
 const smtpFromName = ref('')
 const adminEmails = ref('')
 
+// CDK 购买入口设置（个人中心显眼按钮：跳转链接 + 是否展示）
+const cdkSaving = ref(false)
+const cdkBuyUrl = ref('')
+const cdkBuyVisible = ref(false)
+
+// 校验「购买 CDK」链接：空串合法（清空场景），非空必须 http(s) 开头
+function isValidHttpUrl(v: string): boolean {
+  if (!v) return true
+  return /^https?:\/\/.+\..+/.test(v)
+}
+
 onMounted(async () => {
   await loadSettings()
 })
@@ -61,6 +72,8 @@ async function loadSettings() {
     smtpFrom.value = settings['smtp_from'] || ''
     smtpFromName.value = settings['smtp_from_name'] || ''
     adminEmails.value = settings['admin_emails'] || ''
+    cdkBuyUrl.value = settings['cdk_buy_url'] || ''
+    cdkBuyVisible.value = settings['cdk_buy_visible'] === 'true'
   } catch {
     message.error('加载设置失败')
   } finally {
@@ -113,6 +126,25 @@ async function handleTestMail() {
   }
 }
 
+// ======== CDK 购买入口设置 ========
+async function handleSaveCdkBuy() {
+  const url = cdkBuyUrl.value.trim()
+  if (!isValidHttpUrl(url)) {
+    message.info('购买链接必须以 http:// 或 https:// 开头')
+    return
+  }
+  cdkSaving.value = true
+  try {
+    await adminApi.updateSetting('cdk_buy_url', url)
+    await adminApi.updateSetting('cdk_buy_visible', cdkBuyVisible.value ? 'true' : 'false')
+    message.success(cdkBuyVisible.value && url ? '已开启购买入口，用户刷新「我的」页即可看到' : '已保存')
+  } catch (e: any) {
+    message.error(e?.response?.data?.message || e?.message || '保存失败')
+  } finally {
+    cdkSaving.value = false
+  }
+}
+
 // ======== 扣款额度设置 ========
 async function handleSaveDeduct() {
   const checkin = parseFloat(deductCheckin.value)
@@ -188,58 +220,67 @@ async function handleSave() {
 </script>
 
 <template>
-  <div class="p-6">
-    <h1 class="text-xl font-bold text-gray-900 mb-6">系统设置</h1>
+  <div class="adm-page">
+    <div class="adm-head">
+      <div class="flex items-center gap-3">
+        <div class="adm-head-icon"><SettingsIcon class="w-5 h-5" /></div>
+        <div>
+          <h1 class="adm-title">系统设置</h1>
+          <p class="adm-sub">扣费、价格、邀请奖励与邮件通知</p>
+        </div>
+      </div>
+    </div>
 
-    <Card class="max-w-lg">
-      <div class="border-b border-gray-100 px-6 py-4 flex items-center gap-2">
-        <Euro class="w-4 h-4 text-blue-500" />
-        <span class="font-semibold text-gray-900 text-sm">基础扣费设置</span>
+    <div class="grid grid-cols-1 xl:grid-cols-2 gap-4 md:gap-5 items-start">
+    <Card class="adm-card shadow-none">
+      <div class="adm-card-head justify-start">
+        <span class="w-8 h-8 rounded-xl bg-brand-50 text-brand-600 flex items-center justify-center"><Euro class="w-4 h-4" /></span>
+        <span class="adm-card-title">基础扣费设置</span>
       </div>
       <div class="p-6 space-y-4">
         <div v-if="loading" class="flex items-center justify-center py-8">
-          <LoaderCircle class="w-5 h-5 animate-spin text-blue-500" />
+          <LoaderCircle class="w-5 h-5 animate-spin text-brand-500" />
         </div>
 
         <template v-else>
           <div>
-            <Label class="mb-1 block text-sm text-gray-600">每次运行基础抵扣金额（元）</Label>
+            <Label class="mb-1.5 block text-sm font-medium text-gray-700">每次运行基础抵扣金额（元）</Label>
             <Input
               v-model="baseDeduction"
               type="number"
               step="0.01"
               min="0.01"
-              class="h-10 text-sm max-w-[200px]"
+              class="h-10 text-sm max-w-[240px]"
             />
-            <p class="text-xs text-gray-400 mt-1">
+            <p class="text-xs text-gray-500 mt-1.5">
               生成CDK时的成本基价，实际成本 = 基价 × 次数 × 代理费率
             </p>
           </div>
 
           <div>
-            <Label class="mb-1 block text-sm text-gray-600">⭐ VIP 周卡售价（元 / 7天）</Label>
+            <Label class="mb-1.5 block text-sm font-medium text-gray-700">VIP 周卡售价（元 / 7天）</Label>
             <Input
               v-model="vipWeekPrice"
               type="number"
               step="0.01"
               min="0.01"
-              class="h-10 text-sm max-w-[200px]"
+              class="h-10 text-sm max-w-[240px]"
             />
-            <p class="text-xs text-gray-400 mt-1">
+            <p class="text-xs text-gray-500 mt-1.5">
               生成 VIP 周卡 CDK 的单张售价，VIP 有效期内执行任务免扣次数
             </p>
           </div>
 
           <div>
-            <Label class="mb-1 block text-sm text-gray-600">⭐ VIP 月卡售价（元 / 30天）</Label>
+            <Label class="mb-1.5 block text-sm font-medium text-gray-700">VIP 月卡售价（元 / 30天）</Label>
             <Input
               v-model="vipMonthPrice"
               type="number"
               step="0.01"
               min="0.01"
-              class="h-10 text-sm max-w-[200px]"
+              class="h-10 text-sm max-w-[240px]"
             />
-            <p class="text-xs text-gray-400 mt-1">
+            <p class="text-xs text-gray-500 mt-1.5">
               生成 VIP 月卡 CDK 的单张售价，前台开通/续费 VIP 展示此价格
             </p>
           </div>
@@ -255,30 +296,30 @@ async function handleSave() {
     </Card>
 
     <!-- 扣款额度设置 -->
-    <Card class="max-w-lg mt-6">
-      <div class="border-b border-gray-100 px-6 py-4 flex items-center gap-2">
-        <Coins class="w-4 h-4 text-amber-500" />
-        <span class="font-semibold text-gray-900 text-sm">扣款额度设置</span>
+    <Card class="adm-card shadow-none">
+      <div class="adm-card-head justify-start">
+        <span class="w-8 h-8 rounded-xl bg-brand-50 text-brand-600 flex items-center justify-center"><Coins class="w-4 h-4" /></span>
+        <span class="adm-card-title">扣款额度设置</span>
       </div>
       <div class="p-6 space-y-4">
         <p class="text-xs text-gray-400 leading-relaxed -mt-2">
           每次成功执行对应操作扣减的可签到次数，支持小数（如 0.5）与 0（0 = 不扣费）。VIP 会员有效期内始终免扣。
         </p>
         <div v-if="loading" class="flex items-center justify-center py-8">
-          <LoaderCircle class="w-5 h-5 animate-spin text-blue-500" />
+          <LoaderCircle class="w-5 h-5 animate-spin text-brand-500" />
         </div>
         <template v-else>
           <div>
-            <Label class="mb-1 block text-sm text-gray-600">打卡扣款额度（次）</Label>
-            <Input v-model="deductCheckin" type="number" step="0.1" min="0" class="h-10 text-sm max-w-[200px]" />
+            <Label class="mb-1.5 block text-sm font-medium text-gray-700">打卡扣款额度（次）</Label>
+            <Input v-model="deductCheckin" type="number" step="0.1" min="0" class="h-10 text-sm max-w-[240px]" />
           </div>
           <div>
-            <Label class="mb-1 block text-sm text-gray-600">请假扣款额度（次）</Label>
-            <Input v-model="deductLeave" type="number" step="0.1" min="0" class="h-10 text-sm max-w-[200px]" />
+            <Label class="mb-1.5 block text-sm font-medium text-gray-700">请假扣款额度（次）</Label>
+            <Input v-model="deductLeave" type="number" step="0.1" min="0" class="h-10 text-sm max-w-[240px]" />
           </div>
           <div>
-            <Label class="mb-1 block text-sm text-gray-600">销假扣款额度（次）</Label>
-            <Input v-model="deductReport" type="number" step="0.1" min="0" class="h-10 text-sm max-w-[200px]" />
+            <Label class="mb-1.5 block text-sm font-medium text-gray-700">销假扣款额度（次）</Label>
+            <Input v-model="deductReport" type="number" step="0.1" min="0" class="h-10 text-sm max-w-[240px]" />
           </div>
           <div class="flex gap-2 pt-2">
             <Button :disabled="deductSaving" @click="handleSaveDeduct">
@@ -291,43 +332,43 @@ async function handleSave() {
     </Card>
 
     <!-- 邀请奖励设置 -->
-    <Card class="max-w-lg mt-6">
-      <div class="border-b border-gray-100 px-6 py-4 flex items-center gap-2">
-        <Gift class="w-4 h-4 text-purple-500" />
-        <span class="font-semibold text-gray-900 text-sm">邀请奖励设置</span>
+    <Card class="adm-card shadow-none">
+      <div class="adm-card-head justify-start">
+        <span class="w-8 h-8 rounded-xl bg-brand-50 text-brand-600 flex items-center justify-center"><Gift class="w-4 h-4" /></span>
+        <span class="adm-card-title">邀请奖励设置</span>
       </div>
       <div class="p-6 space-y-4">
         <template v-if="!loading">
           <div>
-            <Label class="mb-1 block text-sm text-gray-600">邀请人每次获奖励积分</Label>
+            <Label class="mb-1.5 block text-sm font-medium text-gray-700">邀请人每次获奖励积分</Label>
             <div class="flex items-center gap-2">
               <Input
                 v-model="inviterReward"
                 type="number"
                 step="0.1"
                 min="0"
-                class="h-10 text-sm max-w-[200px]"
+                class="h-10 text-sm max-w-[240px]"
               />
               <span class="text-sm text-gray-500">积分</span>
             </div>
-            <p class="text-xs text-gray-400 mt-1">
+            <p class="text-xs text-gray-500 mt-1.5">
               每成功邀请一位新用户，邀请人获得的奖励积分数（满1积分可兑换1次签到）
             </p>
           </div>
 
           <div>
-            <Label class="mb-1 block text-sm text-gray-600">被邀请人每次获奖励积分</Label>
+            <Label class="mb-1.5 block text-sm font-medium text-gray-700">被邀请人每次获奖励积分</Label>
             <div class="flex items-center gap-2">
               <Input
                 v-model="inviteeReward"
                 type="number"
                 step="0.1"
                 min="0"
-                class="h-10 text-sm max-w-[200px]"
+                class="h-10 text-sm max-w-[240px]"
               />
               <span class="text-sm text-gray-500">积分</span>
             </div>
-            <p class="text-xs text-gray-400 mt-1">
+            <p class="text-xs text-gray-500 mt-1.5">
               新用户通过邀请链接注册时，新用户获得的奖励积分数（满1积分可兑换1次签到）
             </p>
           </div>
@@ -342,11 +383,60 @@ async function handleSave() {
       </div>
     </Card>
 
+    <!-- CDK 购买入口设置 -->
+    <Card class="adm-card shadow-none">
+      <div class="adm-card-head justify-start">
+        <span class="w-8 h-8 rounded-xl bg-brand-50 text-brand-600 flex items-center justify-center"><ShoppingCart class="w-4 h-4" /></span>
+        <span class="adm-card-title">CDK 购买入口</span>
+      </div>
+      <div class="p-6 space-y-4">
+        <p class="text-xs text-gray-400 leading-relaxed -mt-2">
+          开启后，用户端「我的」页顶部展示显眼的「购买 CDK」按钮，点击后在新标签页打开下方链接（如发卡/购买页）。
+          链接为空时不展示，与开关状态无关。
+        </p>
+        <div v-if="loading" class="flex items-center justify-center py-8">
+          <LoaderCircle class="w-5 h-5 animate-spin text-brand-500" />
+        </div>
+        <template v-else>
+          <div class="flex items-center justify-between gap-4">
+            <div>
+              <p class="text-sm font-medium text-gray-700">展示购买按钮</p>
+              <p class="text-xs text-gray-500 mt-1">关闭后用户端不显示该入口</p>
+            </div>
+            <button
+              type="button"
+              role="switch"
+              :aria-checked="cdkBuyVisible"
+              class="relative inline-flex flex-shrink-0 h-6 w-11 items-center rounded-full transition-colors duration-200"
+              :class="cdkBuyVisible ? 'bg-brand-500' : 'bg-gray-200'"
+              @click="cdkBuyVisible = !cdkBuyVisible"
+            >
+              <span
+                class="inline-block h-5 w-5 transform rounded-full bg-white shadow-sm transition-transform duration-200"
+                :class="cdkBuyVisible ? 'translate-x-[22px]' : 'translate-x-0.5'"
+              />
+            </button>
+          </div>
+          <div>
+            <Label class="mb-1.5 block text-sm font-medium text-gray-700">购买页跳转链接</Label>
+            <Input v-model="cdkBuyUrl" placeholder="https://example.com/buy" class="h-10 text-sm" />
+            <p class="text-xs text-gray-500 mt-1.5">需以 http:// 或 https:// 开头；留空则不展示按钮</p>
+          </div>
+          <div class="flex gap-2 pt-2">
+            <Button :disabled="cdkSaving" @click="handleSaveCdkBuy">
+              <Save class="w-4 h-4 mr-1" />
+              {{ cdkSaving ? '保存中...' : '保存设置' }}
+            </Button>
+          </div>
+        </template>
+      </div>
+    </Card>
+
     <!-- 邮件通知设置 -->
-    <Card class="max-w-2xl mt-6">
-      <div class="border-b border-gray-100 px-6 py-4 flex items-center gap-2">
-        <Mail class="w-4 h-4 text-green-500" />
-        <span class="font-semibold text-gray-900 text-sm">邮件通知设置（SMTP）</span>
+    <Card class="adm-card shadow-none xl:col-span-2">
+      <div class="adm-card-head justify-start">
+        <span class="w-8 h-8 rounded-xl bg-brand-50 text-brand-600 flex items-center justify-center"><Mail class="w-4 h-4" /></span>
+        <span class="adm-card-title">邮件通知设置（SMTP）</span>
       </div>
       <div class="p-6 space-y-4">
         <p class="text-xs text-gray-400 leading-relaxed -mt-2">
@@ -354,49 +444,49 @@ async function handleSave() {
           未配置时相关邮件通知自动跳过，不影响其他功能。
         </p>
 
-        <div class="grid grid-cols-2 gap-4">
+        <div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
           <div>
-            <Label class="mb-1 block text-sm text-gray-600">SMTP 服务器地址</Label>
+            <Label class="mb-1.5 block text-sm font-medium text-gray-700">SMTP 服务器地址</Label>
             <Input v-model="smtpHost" placeholder="smtp.qq.com" class="h-10 text-sm" />
           </div>
           <div>
-            <Label class="mb-1 block text-sm text-gray-600">SMTP 端口</Label>
+            <Label class="mb-1.5 block text-sm font-medium text-gray-700">SMTP 端口</Label>
             <Input v-model="smtpPort" placeholder="465" class="h-10 text-sm" />
-            <p class="text-xs text-gray-400 mt-1">465=SSL，587/25=STARTTLS，端口决定加密方式</p>
+            <p class="text-xs text-gray-500 mt-1.5">465=SSL，587/25=STARTTLS，端口决定加密方式</p>
           </div>
         </div>
 
-        <div class="grid grid-cols-2 gap-4">
+        <div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
           <div>
-            <Label class="mb-1 block text-sm text-gray-600">SMTP 用户名</Label>
+            <Label class="mb-1.5 block text-sm font-medium text-gray-700">SMTP 用户名</Label>
             <Input v-model="smtpUser" placeholder="your@qq.com" class="h-10 text-sm" />
           </div>
           <div>
-            <Label class="mb-1 block text-sm text-gray-600">SMTP 密码 / 授权码</Label>
+            <Label class="mb-1.5 block text-sm font-medium text-gray-700">SMTP 密码 / 授权码</Label>
             <div class="relative">
               <Input v-model="smtpPassword" type="password" placeholder="授权码" class="h-10 text-sm pr-9" />
-              <KeyRound class="absolute right-3 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-300" />
+              <KeyRound class="absolute right-3 top-1/2 -translate-y-1/2 w-4 h-4 adm-muted" />
             </div>
           </div>
         </div>
 
-        <div class="grid grid-cols-2 gap-4">
+        <div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
           <div>
-            <Label class="mb-1 block text-sm text-gray-600">发件人地址</Label>
+            <Label class="mb-1.5 block text-sm font-medium text-gray-700">发件人地址</Label>
             <Input v-model="smtpFrom" placeholder="留空则使用 SMTP 用户名" class="h-10 text-sm" />
           </div>
           <div>
-            <Label class="mb-1 block text-sm text-gray-600">发件人显示名称</Label>
+            <Label class="mb-1.5 block text-sm font-medium text-gray-700">发件人显示名称</Label>
             <Input v-model="smtpFromName" placeholder="小助手" class="h-10 text-sm" />
           </div>
         </div>
 
-        <div class="grid grid-cols-2 gap-4">
+        <div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
           <div>
-            <Label class="mb-1 block text-sm text-gray-600">加密方式</Label>
+            <Label class="mb-1.5 block text-sm font-medium text-gray-700">加密方式</Label>
             <select
               v-model="smtpSecure"
-              class="h-10 w-full px-3 rounded-lg border border-gray-200 text-sm text-gray-700 bg-white focus:outline-none focus:ring-2 focus:ring-blue-500/30 focus:border-blue-400"
+              class="h-10 w-full px-3 rounded-lg border border-gray-200 text-sm text-gray-700 bg-white focus:outline-none focus:ring-2 focus:ring-brand-400/20 focus:border-brand-400"
             >
               <option value="">自动（按端口判断）</option>
               <option value="ssl">SSL（465）</option>
@@ -405,9 +495,9 @@ async function handleSave() {
             </select>
           </div>
           <div>
-            <Label class="mb-1 block text-sm text-gray-600">管理员通知邮箱</Label>
+            <Label class="mb-1.5 block text-sm font-medium text-gray-700">管理员通知邮箱</Label>
             <Input v-model="adminEmails" placeholder="admin@qq.com（多个用逗号分隔）" class="h-10 text-sm" />
-            <p class="text-xs text-gray-400 mt-1">新待适配学校提交时提醒到此邮箱</p>
+            <p class="text-xs text-gray-500 mt-1.5">新待适配学校提交时提醒到此邮箱</p>
           </div>
         </div>
 
@@ -420,7 +510,7 @@ async function handleSave() {
             variant="outline"
             :disabled="mailTesting || mailSaving"
             @click="handleTestMail"
-            class="text-blue-500"
+            class="text-brand-600"
           >
             <Send v-if="!mailTesting" class="w-4 h-4 mr-1" />
             <LoaderCircle v-else class="w-4 h-4 mr-1 animate-spin" />
@@ -429,5 +519,6 @@ async function handleSave() {
         </div>
       </div>
     </Card>
+    </div>
   </div>
 </template>

frondend/src/views/admin/AdminSetup.vue

@@ -59,11 +59,11 @@ async function handleSetup() {
 </script>
 
 <template>
-  <div class="min-h-dvh flex items-center justify-center bg-gradient-to-br from-blue-50 to-indigo-100 p-4">
+  <div class="min-h-dvh flex items-center justify-center bg-gradient-to-br from-brand-50 via-gray-50 to-sky-50 p-4">
     <div class="w-full max-w-md">
       <!-- 标题 -->
       <div class="text-center mb-8">
-        <div class="w-16 h-16 rounded-2xl bg-blue-600 flex items-center justify-center mx-auto mb-4 shadow-lg shadow-blue-200">
+        <div class="w-16 h-16 rounded-2xl bg-brand-gradient flex items-center justify-center mx-auto mb-4 shadow-xl shadow-brand-500/30">
           <Shield class="w-8 h-8 text-white" />
         </div>
         <h1 class="text-2xl font-bold text-gray-900">初始化管理员</h1>

frondend/src/views/admin/AdminTicketDetail.vue

@@ -75,73 +75,77 @@ async function changeStatus(status: string) {
 </script>
 
 <template>
-  <div class="flex flex-col min-h-full bg-gray-50">
-    <!-- 顶部导航 -->
-    <div class="sticky top-0 z-10 bg-white border-b border-gray-100">
-      <div class="flex items-center px-4 h-12">
-        <button class="w-8 h-8 flex items-center justify-center -ml-1 text-gray-600" @click="router.back()">
+  <div class="adm-page flex flex-col">
+    <!-- 页头：返回 + 标题 -->
+    <div class="adm-head">
+      <div class="flex items-center gap-3 min-w-0">
+        <button class="w-10 h-10 flex-shrink-0 flex items-center justify-center rounded-xl border border-gray-200 bg-white text-gray-600 hover:bg-gray-50" aria-label="返回" @click="router.back()">
           <ArrowLeft class="w-5 h-5" />
         </button>
-        <h1 class="flex-1 text-base font-semibold text-gray-900 truncate mr-7">
-          {{ ticket?.title || '工单详情' }}
-        </h1>
+        <div class="min-w-0">
+          <h1 class="adm-title truncate">{{ ticket?.title || '工单详情' }}</h1>
+          <p class="adm-sub">工单 #{{ ticket?.id ?? '' }}</p>
+        </div>
       </div>
     </div>
 
     <div v-if="loading" class="flex-1 flex items-center justify-center">
-      <p class="text-sm text-gray-400">加载中...</p>
+      <p class="adm-sub">加载中...</p>
     </div>
 
-    <template v-else-if="ticket">
+    <div v-else-if="ticket" class="adm-card overflow-hidden flex flex-col">
       <!-- 用户信息卡片 -->
-      <div class="bg-white border-b border-gray-100 px-4 py-3">
+      <div class="px-5 py-4 border-b border-gray-100">
         <div class="flex items-center justify-between">
-          <div>
-            <p class="text-sm font-medium text-gray-900">{{ ticket.realName || ticket.username }}</p>
-            <p class="text-xs text-gray-400">{{ ticket.schoolName }}</p>
+          <div class="flex items-center gap-3 min-w-0">
+            <span class="w-10 h-10 rounded-full bg-sky-50 text-sky-600 flex items-center justify-center font-bold flex-shrink-0">{{ ticket.realName?.[0] || ticket.username?.[0] || '用' }}</span>
+            <div class="min-w-0">
+              <p class="text-sm font-semibold text-gray-900 truncate">{{ ticket.realName || ticket.username }}</p>
+              <p class="text-xs text-gray-500 truncate">{{ ticket.schoolName }}</p>
+            </div>
           </div>
           <div class="flex items-center gap-2">
             <span
               v-if="ticket.deleted"
-              class="inline-flex items-center px-2.5 py-1 rounded-full text-xs font-medium whitespace-nowrap bg-gray-100 text-gray-400 border border-gray-200"
+              class="adm-badge no-dot adm-badge-gray"
               title="用户已在客户端删除该工单，管理员仍可见"
             >
               用户已删除
             </span>
             <span
-              class="inline-flex items-center px-2.5 py-1 rounded-full text-xs font-medium"
-              :class="ticketApi.TICKET_STATUS_COLOR[ticket.status] || 'bg-gray-100 text-gray-600'"
+              class="adm-badge"
+              :class="ticketApi.TICKET_STATUS_COLOR[ticket.status] || 'adm-badge-gray'"
             >
               {{ ticketApi.TICKET_STATUS_MAP[ticket.status] || ticket.status }}
             </span>
           </div>
         </div>
         <!-- 状态操作按钮 -->
-        <div class="flex gap-2 mt-3">
+        <div class="flex gap-2 mt-3 flex-wrap">
           <button
             v-if="ticket.status === 'pending'"
-            class="px-3 py-1 rounded-lg text-xs font-medium bg-blue-500 text-white hover:bg-blue-600 transition-colors"
+            class="h-8 px-3.5 rounded-full text-xs font-semibold bg-brand-gradient text-white shadow-sm shadow-brand-500/20 hover:brightness-105"
             @click="changeStatus('processing')"
           >
             开始处理
           </button>
           <button
             v-if="ticket.status === 'processing'"
-            class="px-3 py-1 rounded-lg text-xs font-medium bg-green-500 text-white hover:bg-green-600 transition-colors"
+            class="h-8 px-3.5 rounded-full text-xs font-semibold adm-btn-success hover:brightness-105"
             @click="changeStatus('resolved')"
           >
             标记已解决
           </button>
           <button
             v-if="ticket.status !== 'closed' && ticket.status !== 'resolved'"
-            class="px-3 py-1 rounded-lg text-xs font-medium bg-green-100 text-green-700 hover:bg-green-200 transition-colors"
+            class="h-8 px-3.5 rounded-full text-xs font-semibold bg-green-50 text-green-700 hover:bg-green-100"
             @click="changeStatus('resolved')"
           >
             直接解决
           </button>
           <button
             v-if="ticket.status !== 'closed'"
-            class="px-3 py-1 rounded-lg text-xs font-medium bg-gray-100 text-gray-600 hover:bg-gray-200 transition-colors"
+            class="h-8 px-3.5 rounded-full text-xs font-semibold bg-gray-100 text-gray-600 hover:bg-gray-200"
             @click="changeStatus('closed')"
           >
             关闭工单
@@ -150,12 +154,12 @@ async function changeStatus(status: string) {
       </div>
 
       <!-- 消息区域 -->
-      <div class="flex-1 overflow-y-auto px-4 py-4 space-y-4">
+      <div class="flex-1 overflow-y-auto px-5 py-5 space-y-4 bg-gray-50 min-h-[320px] max-h-[60vh]">
         <!-- 初始内容 -->
         <div class="flex justify-start">
           <div class="max-w-[85%]">
             <div class="flex items-center gap-2 mb-1">
-              <span class="w-6 h-6 rounded-full bg-blue-500 text-white text-xs flex items-center justify-center font-medium">
+              <span class="w-7 h-7 rounded-full bg-sky-50 text-sky-600 text-xs flex items-center justify-center font-bold">
                 {{ ticket.realName?.[0] || ticket.username?.[0] || '用' }}
               </span>
               <span class="text-xs text-gray-400">{{ ticket.createdAt }}</span>
@@ -177,8 +181,8 @@ async function changeStatus(status: string) {
           <div class="max-w-[85%]">
             <div class="flex items-center gap-2 mb-1" :class="msg.senderType === 'user' ? 'flex-row-reverse' : ''">
               <span
-                class="w-6 h-6 rounded-full text-white text-xs flex items-center justify-center font-medium flex-shrink-0"
-                :class="msg.senderType === 'admin' ? 'bg-green-500' : 'bg-blue-500'"
+                class="w-7 h-7 rounded-full text-xs flex items-center justify-center font-bold flex-shrink-0"
+                :class="msg.senderType === 'admin' ? 'bg-brand-gradient text-white' : 'bg-sky-50 text-sky-600'"
               >
                 {{ msg.senderType === 'admin' ? '管' : ticket.realName?.[0] || ticket.username?.[0] || '用' }}
               </span>
@@ -188,8 +192,8 @@ async function changeStatus(status: string) {
               class="px-4 py-3 border shadow-sm"
               :class="
                 msg.senderType === 'admin'
-                  ? 'bg-green-50 rounded-2xl rounded-tr-sm border-green-100'
-                  : 'bg-white rounded-2xl rounded-tl-sm border-gray-100'
+                  ? 'bg-brand-50 rounded-2xl rounded-tl-sm border-brand-100'
+                  : 'bg-white rounded-2xl rounded-tr-sm border-gray-100'
               "
             >
               <p class="text-sm text-gray-700 whitespace-pre-wrap">{{ msg.content }}</p>
@@ -201,17 +205,17 @@ async function changeStatus(status: string) {
       </div>
 
       <!-- 回复输入 -->
-      <div v-if="ticket.status !== 'closed'" class="bg-white border-t border-gray-100 px-4 py-3">
+      <div v-if="ticket.status !== 'closed'" class="border-t border-gray-100 px-5 py-3.5">
         <div class="flex items-center gap-2">
           <textarea
             v-model="replyContent"
             placeholder="输入回复内容..."
-            class="flex-1 h-10 max-h-24 px-3 py-2.5 text-sm border border-gray-200 rounded-xl resize-none focus:outline-none focus:ring-2 focus:ring-blue-500/20 focus:border-blue-400"
+            class="flex-1 h-11 max-h-24 px-3.5 py-2.5 text-sm bg-gray-50 border border-gray-200 rounded-xl resize-none focus:outline-none focus:bg-card focus:border-brand-400 focus:ring-4 focus:ring-brand-400/15"
             rows="1"
             @keydown.ctrl.enter="handleReply"
           ></textarea>
           <Button
-            class="h-10 w-10 rounded-xl flex-shrink-0"
+            class="h-11 w-11 rounded-xl flex-shrink-0"
             :disabled="!replyContent.trim() || replying"
             @click="handleReply"
           >
@@ -219,6 +223,6 @@ async function changeStatus(status: string) {
           </Button>
         </div>
       </div>
-    </template>
+    </div>
   </div>
 </template>

frondend/src/views/admin/AdminTicketList.vue

@@ -62,12 +62,20 @@ function goDetail(id: number) {
 </script>
 
 <template>
-  <div class="p-6">
-    <h1 class="text-xl font-bold text-gray-900 mb-6">工单管理</h1>
+  <div class="adm-page">
+    <div class="adm-head">
+      <div class="flex items-center gap-3">
+        <div class="adm-head-icon"><MessageSquare class="w-5 h-5" /></div>
+        <div>
+          <h1 class="adm-title">工单管理</h1>
+          <p class="adm-sub">处理用户的咨询与反馈</p>
+        </div>
+      </div>
+    </div>
 
     <!-- 筛选栏 -->
-    <div class="flex flex-col sm:flex-row gap-3 mb-4">
-      <div class="relative flex-1">
+    <div class="adm-toolbar">
+      <div class="relative flex-1 min-w-[200px] max-w-sm">
         <Search class="absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-400" />
         <Input
           v-model="keyword"
@@ -75,16 +83,11 @@ function goDetail(id: number) {
           class="h-10 pl-9 text-sm"
         />
       </div>
-      <div class="flex gap-2 overflow-x-auto">
+      <div class="adm-seg overflow-x-auto max-w-full">
         <button
           v-for="opt in statusOptions"
           :key="opt.value"
-          class="px-3 py-1.5 rounded-lg text-xs font-medium whitespace-nowrap transition-colors"
-          :class="
-            filterStatus === opt.value
-              ? 'bg-blue-500 text-white'
-              : 'bg-gray-100 text-gray-600 hover:bg-gray-200'
-          "
+          :class="filterStatus === opt.value && 'is-active'"
           @click="filterStatus = opt.value"
         >
           {{ opt.label }}
@@ -93,36 +96,36 @@ function goDetail(id: number) {
     </div>
 
     <!-- 工单列表 -->
-    <div v-if="loading" class="text-center py-12 text-sm text-gray-400">加载中...</div>
-    <div v-else-if="filteredTickets.length === 0" class="text-center py-12">
-      <MessageSquare class="w-12 h-12 mx-auto text-gray-300 mb-2" />
-      <p class="text-sm text-gray-400">暂无工单</p>
+    <div v-if="loading" class="adm-card adm-empty">加载中...</div>
+    <div v-else-if="filteredTickets.length === 0" class="adm-card adm-empty">
+      <div class="adm-empty-icon"><MessageSquare class="w-6 h-6" /></div>
+      暂无工单
     </div>
-    <div v-else class="space-y-2">
+    <div v-else class="adm-card overflow-hidden divide-y divide-gray-100">
       <div
         v-for="t in filteredTickets"
         :key="t.id"
-        class="bg-white rounded-xl border border-gray-100 px-4 py-3.5 hover:bg-gray-50 transition-colors cursor-pointer"
+        class="px-5 py-4 hover:bg-gray-50 transition-colors cursor-pointer"
         @click="goDetail(t.id)"
       >
         <div class="flex items-center justify-between mb-1">
-          <h3 class="text-sm font-medium text-gray-900 truncate flex-1">{{ t.title }}</h3>
+          <h3 class="text-sm font-semibold text-gray-900 truncate flex-1">{{ t.title }}</h3>
           <span
             v-if="t.deleted"
-            class="ml-2 inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium flex-shrink-0 whitespace-nowrap bg-gray-100 text-gray-400 border border-gray-200"
+            class="ml-2 adm-badge no-dot adm-badge-gray flex-shrink-0"
             title="用户已在客户端删除该工单，管理员仍可见"
           >
             用户已删除
           </span>
           <span
-            class="ml-2 inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium flex-shrink-0"
-            :class="ticketApi.TICKET_STATUS_COLOR[t.status] || 'bg-gray-100 text-gray-600'"
+            class="ml-2 adm-badge flex-shrink-0"
+            :class="ticketApi.TICKET_STATUS_COLOR[t.status] || 'adm-badge-gray'"
           >
             {{ ticketApi.TICKET_STATUS_MAP[t.status] || t.status }}
           </span>
         </div>
-        <div class="flex items-center gap-3 text-xs text-gray-400">
-          <span class="text-gray-500 font-medium">{{ t.realName || t.username }}</span>
+        <div class="flex items-center gap-3 flex-wrap text-xs text-gray-500">
+          <span class="text-gray-700 font-medium">{{ t.realName || t.username }}</span>
           <span>{{ t.schoolName }}</span>
           <span>{{ t.createdAt }}</span>
           <span class="flex items-center gap-1">

frondend/src/views/admin/AdminUsers.vue

@@ -239,10 +239,22 @@ function taskTypeLabel(t: string) {
   if (t === 'sleep_check') return '查寝'
   if (t === 'return_register') return '返校登记'
   if (t === 'leave_apply') return '请假'
+  if (t === 'leave_extend') return '续假'
   if (t === 'leave_report') return '销假'
   return t
 }
 
+/** 执行日志类型标签配色（adm-badge 自带 nowrap，类型名不会换行） */
+function taskTypeBadge(t: string) {
+  if (t === 'sign') return 'adm-badge-brand'
+  if (t === 'sleep_check') return 'adm-badge-purple'
+  if (t === 'return_register') return 'adm-badge-sky'
+  if (t === 'leave_apply') return 'adm-badge-amber'
+  if (t === 'leave_extend') return 'adm-badge-purple'
+  if (t === 'leave_report') return 'adm-badge-green'
+  return 'adm-badge-gray'
+}
+
 const totalPages = computed(() => Math.ceil(total.value / pageSize.value) || 1)
 const pageSizeOptions = [20, 50, 100]
 
@@ -373,16 +385,16 @@ function todayStatusLabel(s: string) {
 </script>
 
 <template>
-  <div class="p-6">
+  <div class="adm-page">
     <!-- 标题栏 -->
-    <div class="flex items-center justify-between mb-6">
+    <div class="adm-head">
       <div class="flex items-center gap-3">
-        <div class="w-10 h-10 rounded-xl bg-green-100 flex items-center justify-center">
-          <Users class="w-5 h-5 text-green-600" />
+        <div class="adm-head-icon">
+          <Users class="w-5 h-5" />
         </div>
         <div>
-          <h1 class="text-lg font-bold text-gray-900">用户管理</h1>
-          <p class="text-sm text-gray-400">管理今日校园用户</p>
+          <h1 class="adm-title">用户管理</h1>
+          <p class="adm-sub">管理今日校园用户</p>
         </div>
       </div>
     </div>
@@ -390,51 +402,51 @@ function todayStatusLabel(s: string) {
     <!-- 当天统计卡片 -->
     <div class="grid grid-cols-2 lg:grid-cols-4 gap-3 mb-5">
       <div
-        class="bg-white rounded-xl border border-gray-200 p-4 flex items-center gap-3 cursor-pointer transition-all hover:border-blue-300 hover:shadow-md group"
+        class="adm-card adm-stat cursor-pointer transition-all hover:border-brand-300 hover:shadow-md group"
         title="点击查看执行日志明细"
         @click="openTodayLogs"
       >
-        <div class="w-10 h-10 rounded-xl bg-blue-100 flex items-center justify-center flex-shrink-0">
-          <Activity class="w-5 h-5 text-blue-600" />
+        <div class="adm-stat-icon bg-brand-50 text-brand-600">
+          <Activity class="w-5 h-5" />
         </div>
         <div class="min-w-0 flex-1">
-          <p class="text-xs text-gray-400">当天执行总次数</p>
-          <p class="text-xl font-bold text-gray-900 leading-tight">{{ todayStats.executeCount }}</p>
+          <p class="adm-stat-label">当天执行总次数</p>
+          <p class="adm-stat-value">{{ todayStats.executeCount }}</p>
         </div>
-        <ChevronRight class="w-4 h-4 text-gray-300 group-hover:text-blue-400 transition-colors flex-shrink-0" />
+        <ChevronRight class="w-4 h-4 adm-muted group-hover:text-brand-500 transition-colors flex-shrink-0" />
       </div>
-      <div class="bg-white rounded-xl border border-gray-200 p-4 flex items-center gap-3">
-        <div class="w-10 h-10 rounded-xl bg-green-100 flex items-center justify-center flex-shrink-0">
-          <CheckCircle2 class="w-5 h-5 text-green-600" />
+      <div class="adm-card adm-stat">
+        <div class="adm-stat-icon bg-green-50 text-green-600">
+          <CheckCircle2 class="w-5 h-5" />
         </div>
         <div class="min-w-0">
           <p class="text-xs text-gray-400">成功执行总次数</p>
-          <p class="text-xl font-bold text-gray-900 leading-tight">{{ todayStats.successCount }}</p>
+          <p class="adm-stat-value">{{ todayStats.successCount }}</p>
         </div>
       </div>
-      <div class="bg-white rounded-xl border border-gray-200 p-4 flex items-center gap-3">
-        <div class="w-10 h-10 rounded-xl bg-orange-100 flex items-center justify-center flex-shrink-0">
-          <UserPlus class="w-5 h-5 text-orange-600" />
+      <div class="adm-card adm-stat">
+        <div class="adm-stat-icon bg-amber-50 text-amber-600">
+          <UserPlus class="w-5 h-5" />
         </div>
         <div class="min-w-0">
-          <p class="text-xs text-gray-400">当天新增用户数</p>
-          <p class="text-xl font-bold text-gray-900 leading-tight">{{ todayStats.newUserCount }}</p>
+          <p class="adm-stat-label">当天新增用户数</p>
+          <p class="adm-stat-value">{{ todayStats.newUserCount }}</p>
         </div>
       </div>
-      <div class="bg-white rounded-xl border border-gray-200 p-4 flex items-center gap-3">
-        <div class="w-10 h-10 rounded-xl bg-purple-100 flex items-center justify-center flex-shrink-0">
-          <LogIn class="w-5 h-5 text-purple-600" />
+      <div class="adm-card adm-stat">
+        <div class="adm-stat-icon bg-purple-50 text-purple-600">
+          <LogIn class="w-5 h-5" />
         </div>
         <div class="min-w-0">
-          <p class="text-xs text-gray-400">当天登录用户数</p>
-          <p class="text-xl font-bold text-gray-900 leading-tight">{{ todayStats.loginUserCount }}</p>
+          <p class="adm-stat-label">当天登录用户数</p>
+          <p class="adm-stat-value">{{ todayStats.loginUserCount }}</p>
         </div>
       </div>
     </div>
 
     <!-- 搜索栏 -->
-    <div class="mb-4 flex gap-2">
-      <div class="relative flex-1 max-w-xs">
+    <div class="adm-toolbar">
+      <div class="relative flex-1 min-w-[200px] max-w-sm">
         <Search class="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-gray-400" />
         <Input
           v-model="keyword"
@@ -450,7 +462,7 @@ function todayStatusLabel(s: string) {
     </div>
 
     <!-- 表格 -->
-    <div class="bg-white rounded-xl border border-gray-200 overflow-hidden">
+    <div class="adm-card overflow-hidden">
       <!-- 加载骨架 -->
       <div v-if="loading" class="p-6 space-y-4">
         <div v-for="i in 5" :key="i" class="h-10 bg-gray-50 rounded animate-pulse" />
@@ -464,9 +476,9 @@ function todayStatusLabel(s: string) {
 
       <!-- 表格 -->
       <div v-else class="overflow-x-auto">
-        <table class="w-full text-sm table-fixed min-w-[1360px]">
+        <table class="adm-table w-full text-sm table-fixed min-w-[1360px]">
           <thead>
-            <tr class="bg-gray-50 text-left text-xs text-gray-500">
+            <tr>
               <th class="px-4 py-3 font-medium w-[10%]">学工号/姓名</th>
               <th class="px-4 py-3 font-medium w-[12%]">学校/设备码</th>
               <th class="px-4 py-3 font-medium w-[8%]">可执行/已执行</th>
@@ -483,24 +495,24 @@ function todayStatusLabel(s: string) {
           <tr
             v-for="user in users"
             :key="user.id"
-            class="border-t border-gray-50 transition-colors"
+            class=""
             :class="isTodayLogin(user.lastLoginAt)
-              ? 'bg-green-50 hover:bg-green-100/70'
-              : 'hover:bg-gray-50/50'"
+              ? 'adm-row-today'
+              : ''"
             :title="isTodayLogin(user.lastLoginAt) ? '该用户当天已登录' : undefined"
           >
             <td class="px-4 py-3">
               <p class="font-mono text-xs text-gray-700 truncate" :title="user.studentId">{{ user.studentId || '--' }}</p>
-              <p class="text-[10px] text-gray-400 truncate">{{ user.realName || '--' }}</p>
+              <p class="text-xs text-gray-400 truncate">{{ user.realName || '--' }}</p>
             </td>
             <td class="px-4 py-3">
               <p class="text-xs text-gray-700 truncate" :title="user.schoolName">{{ user.schoolName || '--' }}</p>
-              <p class="text-[10px] font-mono text-gray-400 flex items-center gap-1 min-w-0">
+              <p class="text-xs font-mono text-gray-400 flex items-center gap-1 min-w-0">
                 <span v-if="user.mobileCode" class="truncate" :title="user.mobileCode">{{ maskDeviceCode(user.mobileCode) }}</span>
                 <span v-else>未绑定</span>
                 <button
                   v-if="user.mobileCode"
-                  class="flex-shrink-0 text-gray-400 hover:text-blue-500 transition-colors"
+                  class="flex-shrink-0 text-gray-400 hover:text-brand-600 transition-colors"
                   :title="'复制完整设备码'"
                   @click="copyDeviceCode(user.mobileCode)"
                 >
@@ -510,39 +522,39 @@ function todayStatusLabel(s: string) {
             </td>
             <td class="px-4 py-3">
               <span class="font-medium text-gray-900">{{ fmtCount(user.signCount) }}</span>
-              <span class="text-gray-300 mx-0.5">/</span>
+              <span class="adm-muted mx-0.5">/</span>
               <span class="text-gray-500">{{ user.executedCount }}</span>
             </td>
             <td class="px-4 py-3">
               <span
                 v-if="user.vipStatus === 'active'"
-                class="text-[10px] px-1.5 py-0.5 rounded-full font-medium bg-amber-100 text-amber-700"
+                class="adm-badge no-dot adm-badge-amber"
                 :title="`VIP 到期时间：${user.vipExpireAt}`"
               >
                 VIP · {{ user.vipExpireAt.slice(5, 10) }}
               </span>
               <span
                 v-else-if="user.vipStatus === 'expired'"
-                class="text-[10px] px-1.5 py-0.5 rounded-full font-medium bg-gray-100 text-gray-400"
+                class="adm-badge no-dot adm-badge-gray"
                 :title="`VIP 已于 ${user.vipExpireAt} 过期`"
               >
                 VIP · 已过期
               </span>
-              <span v-else class="text-xs text-gray-300">非VIP</span>
+              <span v-else class="text-xs adm-muted">非 VIP</span>
             </td>
             <td class="px-4 py-3">
               <span class="font-medium text-gray-900">{{ user.inviteReward }}</span>
-              <span class="text-gray-300 mx-0.5">/</span>
+              <span class="adm-muted mx-0.5">/</span>
               <span class="text-gray-500">{{ user.invitedCount }}</span>
             </td>
             <td class="px-4 py-3 truncate">
               <span v-if="user.inviterName" class="text-gray-700" :title="user.inviterName">{{ user.inviterName }}</span>
-              <span v-else class="text-gray-300">--</span>
+              <span v-else class="adm-muted">--</span>
             </td>
             <td class="px-4 py-3">
               <span
-                class="text-[10px] px-1.5 py-0.5 rounded-full font-medium"
-                :class="user.todayStatus === 'success' ? 'bg-green-100 text-green-700' : user.todayStatus === 'fail' ? 'bg-red-100 text-red-700' : 'bg-gray-100 text-gray-400'"
+                class="adm-badge"
+                :class="user.todayStatus === 'success' ? 'adm-badge-green' : user.todayStatus === 'fail' ? 'adm-badge-red' : 'adm-badge-gray'"
               >
                 {{ todayStatusLabel(user.todayStatus) }}
               </span>
@@ -550,12 +562,12 @@ function todayStatusLabel(s: string) {
             <td class="px-4 py-3 text-xs text-gray-500">{{ user.createdAt }}</td>
             <td class="px-4 py-3">
               <p class="font-mono text-xs text-gray-700" :title="user.lastLoginIp || undefined">{{ user.lastLoginIp || '--' }}</p>
-              <p class="text-[10px] text-gray-400">{{ user.lastLoginAt || '未登录' }}</p>
+              <p class="text-xs text-gray-400">{{ user.lastLoginAt || '未登录' }}</p>
             </td>
             <td class="px-4 py-3 text-center whitespace-nowrap">
               <div class="flex items-center justify-center gap-1">
                 <button
-                  class="inline-flex items-center gap-1 px-2 py-1 rounded-lg text-xs text-blue-500 hover:bg-blue-50 transition-colors"
+                  class="adm-link adm-link-brand"
                   @click="openDetail(user)"
                 >
                   <Eye class="w-3.5 h-3.5" />
@@ -563,7 +575,7 @@ function todayStatusLabel(s: string) {
                 </button>
                 <button
                   v-if="user.status === 'active'"
-                  class="inline-flex items-center gap-1 px-2 py-1 rounded-lg text-xs text-red-500 hover:bg-red-50 transition-colors"
+                  class="adm-link adm-link-red"
                   @click="openDisableModal(user)"
                 >
                   <Ban class="w-3.5 h-3.5" />
@@ -571,7 +583,7 @@ function todayStatusLabel(s: string) {
                 </button>
                 <button
                   v-else
-                  class="inline-flex items-center gap-1 px-2 py-1 rounded-lg text-xs text-green-500 hover:bg-green-50 transition-colors"
+                  class="adm-link adm-link-green"
                   @click="handleEnable(user)"
                 >
                   <CheckCircle class="w-3.5 h-3.5" />
@@ -587,13 +599,13 @@ function todayStatusLabel(s: string) {
       <!-- 分页 -->
       <div
         v-if="total > 0"
-        class="flex items-center justify-between px-4 py-3 border-t border-gray-100"
+        class="adm-pager"
       >
         <div class="flex items-center gap-3">
-          <span class="text-xs text-gray-400">共 {{ total }} 条</span>
+          <span>共 <b class="font-semibold text-gray-700 tabular-nums">{{ total }}</b> 条</span>
           <select
             :value="pageSize"
-            class="h-8 px-2 rounded-lg border border-gray-200 bg-white text-xs text-gray-500 focus:outline-none"
+            class="adm-select"
             @change="handlePageSize(Number(($event.target as HTMLSelectElement).value))"
           >
             <option v-for="n in pageSizeOptions" :key="n" :value="n">{{ n }} 条/页</option>
@@ -601,15 +613,15 @@ function todayStatusLabel(s: string) {
         </div>
         <div class="flex items-center gap-2">
           <button
-            class="w-8 h-8 rounded-lg flex items-center justify-center hover:bg-gray-100 disabled:opacity-30"
+            class="adm-pager-btn"
             :disabled="page <= 1"
             @click="handlePage(page - 1)"
           >
             <ChevronLeft class="w-4 h-4" />
           </button>
-          <span class="text-sm text-gray-600">{{ page }}/{{ totalPages }}</span>
+          <span class="text-sm text-gray-700 tabular-nums px-1">{{ page }} / {{ totalPages }}</span>
           <button
-            class="w-8 h-8 rounded-lg flex items-center justify-center hover:bg-gray-100 disabled:opacity-30"
+            class="adm-pager-btn"
             :disabled="page >= totalPages"
             @click="handlePage(page + 1)"
           >
@@ -804,7 +816,7 @@ function todayStatusLabel(s: string) {
       title="执行日志明细"
       @update:open="(v: boolean) => { showLogsModal = v }"
     >
-      <div class="h-1.5 bg-gradient-to-r from-blue-500 to-cyan-400 flex-shrink-0" />
+      <div class="h-1.5 bg-gradient-to-r from-brand-400 to-sky-400 flex-shrink-0" />
 
       <!-- 头部 -->
       <div class="px-5 pt-4 pb-3 flex items-start justify-between flex-shrink-0">
@@ -825,7 +837,7 @@ function todayStatusLabel(s: string) {
         <input
           type="date"
           :value="logsDate"
-          class="h-9 px-2.5 rounded-lg border border-gray-200 text-sm text-gray-600 focus:outline-none focus:ring-2 focus:ring-blue-500/20 focus:border-blue-400"
+          class="h-9 px-2.5 rounded-lg border border-gray-200 text-sm text-gray-600 focus:outline-none focus:ring-2 focus:ring-brand-400/20 focus:border-brand-400"
           @change="handleLogsDateChange"
         />
         <div class="flex rounded-lg border border-gray-200 overflow-hidden">
@@ -833,7 +845,7 @@ function todayStatusLabel(s: string) {
             v-for="opt in logsStatusOptions"
             :key="opt.key"
             class="h-9 px-3 text-xs font-medium transition-colors"
-            :class="logsStatus === opt.key ? 'bg-blue-500 text-white' : 'bg-white text-gray-500 hover:bg-gray-50'"
+            :class="logsStatus === opt.key ? 'adm-btn-brand' : 'bg-white text-gray-500 hover:bg-gray-50'"
             @click="handleLogsStatusChange(opt.key)"
           >
             {{ opt.label }}
@@ -844,7 +856,7 @@ function todayStatusLabel(s: string) {
           <input
             v-model="logsKeyword"
             placeholder="搜索用户名/姓名/任务标题"
-            class="w-full h-9 pl-8 pr-3 text-sm border border-gray-200 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500/20 focus:border-blue-400"
+            class="w-full h-9 pl-8 pr-3 text-sm border border-gray-200 rounded-lg focus:outline-none focus:ring-2 focus:ring-brand-400/20 focus:border-brand-400"
             @keyup.enter="handleLogsSearch"
           />
         </div>
@@ -868,12 +880,12 @@ function todayStatusLabel(s: string) {
         </div>
 
         <!-- 日志表格 -->
-        <table v-else class="w-full text-sm table-fixed min-w-[640px]">
+        <table v-else class="w-full text-sm table-fixed min-w-[680px]">
           <thead>
             <tr class="bg-gray-50 text-left text-xs text-gray-500 sticky top-0">
               <th class="px-4 py-2.5 font-medium w-[80px]">时间</th>
               <th class="px-4 py-2.5 font-medium w-[130px]">用户</th>
-              <th class="px-4 py-2.5 font-medium w-[64px]">类型</th>
+              <th class="px-4 py-2.5 font-medium w-[104px]">类型</th>
               <th class="px-4 py-2.5 font-medium">任务标题</th>
               <th class="px-4 py-2.5 font-medium w-[72px]">状态</th>
               <th class="px-4 py-2.5 font-medium">说明</th>
@@ -888,10 +900,10 @@ function todayStatusLabel(s: string) {
               <td class="px-4 py-2.5 text-xs text-gray-500 whitespace-nowrap tabular-nums">{{ formatLogTime(log.createdAt) }}</td>
               <td class="px-4 py-2.5 truncate" :title="`${log.realName || ''}（${log.username}）`">
                 <p class="text-gray-900 truncate leading-tight">{{ log.realName || log.username || '--' }}</p>
-                <p class="text-[11px] text-gray-400 truncate leading-tight">{{ log.schoolName || '--' }}</p>
+                <p class="text-xs text-gray-400 truncate leading-tight">{{ log.schoolName || '--' }}</p>
               </td>
               <td class="px-4 py-2.5">
-                <span class="text-[10px] px-1.5 py-0.5 rounded-full font-medium bg-gray-100 text-gray-600">
+                <span class="adm-badge no-dot" :class="taskTypeBadge(log.taskType)">
                   {{ taskTypeLabel(log.taskType) }}
                 </span>
               </td>
@@ -901,14 +913,14 @@ function todayStatusLabel(s: string) {
               <td class="px-4 py-2.5">
                 <div class="flex flex-col items-start gap-1">
                   <span
-                    class="text-[10px] px-1.5 py-0.5 rounded-full font-medium inline-block whitespace-nowrap"
+                    class="text-xs px-1.5 py-0.5 rounded-full font-medium inline-block whitespace-nowrap"
                     :class="log.isSuccess ? 'bg-green-100 text-green-700' : 'bg-red-100 text-red-700'"
                   >
                     {{ log.isSuccess ? '成功' : '失败' }}
                   </span>
                   <span
                     v-if="log.deleted"
-                    class="text-[10px] px-1.5 py-0.5 rounded-full font-medium inline-block whitespace-nowrap bg-gray-100 text-gray-400 border border-gray-200"
+                    class="text-xs px-1.5 py-0.5 rounded-full font-medium inline-block whitespace-nowrap bg-gray-100 text-gray-400 border border-gray-200"
                     title="用户已在客户端删除该日志，后台统计仍计入"
                   >
                     已删除
@@ -917,7 +929,7 @@ function todayStatusLabel(s: string) {
               </td>
               <td class="px-4 py-2.5">
                 <span v-if="log.errorMessage" class="text-xs text-red-500 break-words">{{ log.errorMessage }}</span>
-                <span v-else class="text-xs text-gray-300">--</span>
+                <span v-else class="text-xs adm-muted">--</span>
               </td>
             </tr>
           </tbody>
@@ -932,14 +944,14 @@ function todayStatusLabel(s: string) {
         <span class="text-xs text-gray-400">第 {{ logsPage }} / {{ logsTotalPages }} 页</span>
         <div class="flex items-center gap-2">
           <button
-            class="w-8 h-8 rounded-lg flex items-center justify-center hover:bg-gray-100 disabled:opacity-30"
+            class="adm-pager-btn"
             :disabled="logsPage <= 1"
             @click="handleLogsPage(logsPage - 1)"
           >
             <ChevronLeft class="w-4 h-4" />
           </button>
           <button
-            class="w-8 h-8 rounded-lg flex items-center justify-center hover:bg-gray-100 disabled:opacity-30"
+            class="adm-pager-btn"
             :disabled="logsPage >= logsTotalPages"
             @click="handleLogsPage(logsPage + 1)"
           >

frondend/src/views/bind/BindDeviceView.vue

@@ -47,7 +47,7 @@ async function generateQrImage(url: string): Promise<string> {
   ctx.restore()
 
   // 3. 绘制蓝色手机图标（SVG → Image）
-  const svg = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#3b82f6" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="5" y="2" width="14" height="20" rx="2"/><line x1="12" y1="18" x2="12.01" y2="18"/></svg>`
+  const svg = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#0b8672" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="5" y="2" width="14" height="20" rx="2"/><line x1="12" y1="18" x2="12.01" y2="18"/></svg>`
   const svgBlob = new Blob([svg], { type: 'image/svg+xml' })
   const svgUrl = URL.createObjectURL(svgBlob)
 
@@ -160,14 +160,14 @@ onUnmounted(() => {
 </script>
 
 <template>
-  <div class="min-h-full flex flex-col bg-gradient-to-b from-blue-50 to-white">
+  <div class="min-h-full flex flex-col">
     <!-- 顶部说明 -->
-    <div class="px-6 pt-6 pb-4 text-center">
-      <div class="w-14 h-14 rounded-2xl bg-blue-500 flex items-center justify-center mx-auto mb-3 shadow-lg shadow-blue-200">
+    <div class="px-6 pb-4 text-center rise-in" style="padding-top: calc(var(--safe-top) + 32px)">
+      <div class="w-16 h-16 rounded-[20px] bg-brand-gradient flex items-center justify-center mx-auto mb-3 shadow-xl shadow-brand-500/30">
         <Smartphone class="w-7 h-7 text-white" />
       </div>
-      <h1 class="text-xl font-bold text-gray-900">绑定设备</h1>
-      <p class="text-sm text-gray-400 mt-1">请扫描二维码，绑定设备信息</p>
+      <h1 class="text-[22px] font-bold tracking-tight text-gray-900">绑定设备</h1>
+      <p class="text-sm text-gray-500 mt-1">请扫描二维码，绑定设备信息</p>
     </div>
 
     <div class="flex-1 flex flex-col items-center px-6">
@@ -179,7 +179,7 @@ onUnmounted(() => {
 
       <!-- 二维码 + 自动轮询 -->
       <div v-else-if="status === 'show-qr' || status === 'polling'" class="w-full max-w-xs">
-        <div class="bg-white rounded-2xl border border-gray-100 shadow-lg p-6 text-center">
+        <div class="bg-white rounded-3xl border border-gray-100/80 shadow-xl p-6 text-center rise-in">
           <!-- QR Code（单一合成图片，含 logo） -->
           <div class="w-48 h-48 mx-auto bg-white border-2 border-gray-100 rounded-xl flex items-center justify-center mb-4">
             <img
@@ -211,7 +211,7 @@ onUnmounted(() => {
         </div>
 
         <!-- 使用说明 -->
-        <div class="mt-4 bg-white rounded-xl border border-gray-100 p-4 shadow-sm">
+        <div class="mt-4 bg-white rounded-2xl border border-gray-100/80 p-4 shadow-sm">
           <h3 class="text-sm font-semibold text-gray-900 mb-3">操作步骤</h3>
           <div class="space-y-3">
             <div class="flex items-start gap-3">

frondend/src/views/course/CourseView.vue

@@ -13,9 +13,9 @@ function goTicket() {
 </script>
 
 <template>
-  <div class="flex flex-col min-h-full bg-gray-50">
+  <div class="flex flex-col min-h-full">
     <!-- 顶部导航 -->
-    <div class="sticky top-0 z-10 bg-white border-b border-gray-100">
+    <div class="sticky top-0 z-10 glass-bar border-b border-gray-200/60" style="padding-top: var(--safe-top)">
       <div class="flex items-center px-4 h-12">
         <h1 class="flex-1 text-center text-base font-semibold text-gray-900">网课</h1>
       </div>
@@ -34,7 +34,7 @@ function goTicket() {
 
     <!-- ======== 我有网课：右侧贴边窄竖条（样式同打卡页「收藏本站」/请假页「无法请销假」），点击跳转工单页 ======== -->
     <button
-      class="fixed right-0 bottom-32 z-40 flex flex-col items-center gap-1.5 rounded-l-md bg-rose-500/95 py-3 px-1.5 text-white text-xs font-medium shadow-lg shadow-rose-500/30 hover:bg-rose-600 active:scale-95 transition-all"
+      class="fixed right-0 bottom-40 z-40 flex flex-col items-center gap-1.5 rounded-l-xl bg-rose-500 py-3 px-1.5 text-white text-xs font-semibold shadow-lg shadow-rose-500/30 hover:bg-rose-600 active:scale-95 transition-all"
       @click="goTicket"
     >
       <MessageSquare class="w-3.5 h-3.5 flex-shrink-0" />

frondend/src/views/guide/BrowserGuideView.vue

@@ -143,7 +143,7 @@ function fallbackCopy(text: string) {
   display: flex;
   align-items: center;
   justify-content: center;
-  color: #3b82f6;
+  color: #0b8672;
   background: #eff6ff;
 }
 

frondend/src/views/leave/LeaveView.vue

@@ -2,39 +2,49 @@
   <!-- 请/销假页：上方请假+销假按钮（左右平分），下方请假/销假日志列表。
        两者均为同步执行：请假 → 填表提交；销假 → 选请假单 → 填位置 → 立即销假。 -->
   <div class="p-4 space-y-4">
-    <!-- 入口卡片：请假 / 销假 按钮并排左右平分 -->
-    <div class="bg-white rounded-xl border border-gray-100 p-4 shadow-sm">
-      <div class="flex items-center justify-between mb-3">
+    <!-- 入口卡片：请假 / 销假 按钮并排左右平分（珊瑚渐变头卡） -->
+    <div class="relative overflow-hidden hero-clip rounded-3xl p-5 text-white shadow-lg shadow-rose-500/25 leave-hero rise-in">
+      <div class="pointer-events-none absolute -right-10 -top-12 w-40 h-40 rounded-full bg-white/15" />
+      <div class="pointer-events-none absolute -right-2 top-16 w-20 h-20 rounded-full bg-white/10" />
+      <div class="relative flex items-start justify-between mb-4">
         <div>
-          <p class="text-sm font-semibold text-gray-900">请假与销假</p>
-          <p class="text-xs text-gray-400 mt-0.5">异地一键请假销假，自行设置位置</p>
+          <p class="text-lg font-bold tracking-tight">请假 · 销假 · 续假</p>
+          <p class="text-xs text-white/80 mt-0.5">异地一键请假、销假、续假，自行设置位置</p>
         </div>
-        <div class="w-10 h-10 rounded-full bg-rose-50 flex items-center justify-center">
-          <CalendarCheck class="w-5 h-5 text-rose-500" />
+        <div class="w-11 h-11 rounded-2xl bg-white/20 flex items-center justify-center">
+          <CalendarCheck class="w-5 h-5 text-white" />
         </div>
       </div>
-      <div class="flex gap-2">
+      <div class="relative flex gap-2.5">
         <button
           @click="openApplyModal"
           :disabled="executing || applying"
-          class="flex-1 flex items-center justify-center gap-2 bg-white border border-rose-300 text-rose-500 hover:bg-rose-50 disabled:opacity-40 rounded-lg py-2.5 text-sm font-medium transition-colors"
+          class="press flex-1 flex items-center justify-center gap-2 bg-white/20 ring-1 ring-white/30 text-white disabled:opacity-50 rounded-full py-3 text-sm font-semibold"
         >
           <CalendarPlus class="w-4 h-4" />
           请假
         </button>
         <button
-          @click="openPendingModal"
+          @click="openPendingModal('report')"
           :disabled="executing || applying"
-          class="flex-1 flex items-center justify-center gap-2 bg-rose-500 hover:bg-rose-600 disabled:bg-rose-300 text-white rounded-lg py-2.5 text-sm font-medium transition-colors"
+          class="press flex-1 flex items-center justify-center gap-2 bg-white text-rose-600 disabled:opacity-50 rounded-full py-3 text-sm font-semibold shadow-md shadow-black/5 dark:bg-[#fff5f7] dark:text-[#b8325a]"
         >
           <CalendarCheck class="w-4 h-4" />
           销假
         </button>
+        <button
+          @click="openPendingModal('extend')"
+          :disabled="executing || applying"
+          class="press flex-1 flex items-center justify-center gap-2 bg-white/20 ring-1 ring-white/30 text-white disabled:opacity-50 rounded-full py-3 text-sm font-semibold"
+        >
+          <CalendarClock class="w-4 h-4" />
+          续假
+        </button>
       </div>
     </div>
 
     <!-- 请假/销假日志列表 -->
-    <div class="bg-white rounded-xl border border-gray-100 p-4 shadow-sm">
+    <div class="bg-white rounded-2xl border border-gray-100/80 p-4 shadow-sm">
       <h3 class="text-sm font-semibold text-gray-900 mb-3">请假/销假日志</h3>
 
       <div v-if="loadingLogs" class="flex items-center justify-center py-6">
@@ -50,22 +60,22 @@
           <div class="flex-1 min-w-0">
             <div class="flex items-center gap-1.5">
               <span
-                class="text-[10px] px-1.5 py-0.5 rounded-full shrink-0 font-medium"
+                class="text-xs px-1.5 py-0.5 rounded-full shrink-0 font-medium"
                 :class="log.action === 'apply' ? 'bg-blue-100 text-blue-600' : 'bg-rose-100 text-rose-600'"
               >{{ log.action === 'apply' ? '请假' : '销假' }}</span>
               <span class="text-xs font-medium text-gray-900 truncate">{{ log.title }}</span>
             </div>
             <div class="flex items-center gap-2 mt-0.5">
               <span
-                class="text-[10px] px-1.5 py-0.5 rounded-full font-medium"
+                class="text-xs px-1.5 py-0.5 rounded-full font-medium"
                 :class="log.isSuccess ? 'bg-green-100 text-green-600' : 'bg-red-100 text-red-600'"
               >
                 {{ log.isSuccess ? '成功' : '失败' }}
               </span>
-              <span class="text-[10px] text-gray-400">{{ new Date(log.createdAt).toLocaleString('zh-CN') }}</span>
+              <span class="text-xs text-gray-400">{{ new Date(log.createdAt).toLocaleString('zh-CN') }}</span>
             </div>
             <div v-if="!log.isSuccess && log.errorMessage" class="mt-0.5">
-              <span class="text-[10px] text-red-500 leading-tight block">{{ log.errorMessage }}</span>
+              <span class="text-xs text-red-500 leading-tight block">{{ log.errorMessage }}</span>
             </div>
           </div>
           <button
@@ -89,12 +99,12 @@
       variant="sheet"
       panel-class="shadow-none sm:max-w-sm"
       :dismissable="true"
-      title="选择请假记录"
+      :title="pendingMode === 'extend' ? '选择要续假的请假单' : '选择要销假的请假单'"
       @update:open="onPendingOpenChange"
     >
       <!-- 标题栏 -->
       <div class="px-4 py-3 border-b border-gray-100 flex items-center justify-between shrink-0">
-        <span class="text-sm font-semibold text-gray-900">选择请假记录</span>
+        <span class="text-sm font-semibold text-gray-900">{{ pendingMode === 'extend' ? '选择要续假的请假单' : '选择要销假的请假单' }}</span>
         <button @click="closePendingModal" class="w-7 h-7 flex items-center justify-center rounded-full hover:bg-gray-100 text-gray-400">
           <X class="w-4 h-4" />
         </button>
@@ -105,30 +115,53 @@
         <div v-if="loadingLeaves" class="flex items-center justify-center py-12">
           <LoaderCircle class="w-6 h-6 text-rose-500 animate-spin" />
         </div>
-        <div v-else-if="pendingLeaves.length === 0" class="text-center py-12">
-          <CalendarCheck class="w-10 h-10 text-gray-200 mx-auto mb-3" />
-          <p class="text-sm text-gray-400">暂无待销假记录</p>
-          <p class="text-xs text-gray-300 mt-1">有正在休假或待销假的请假单时会显示在这里</p>
+        <div v-else-if="visiblePendingLeaves.length === 0" class="text-center py-12 px-2">
+          <CalendarCheck class="w-10 h-10 text-gray-300 mx-auto mb-3" />
+          <template v-if="pendingMode === 'extend'">
+            <p class="text-sm text-gray-500">暂无可续假的请假单</p>
+            <p class="text-xs text-gray-400 mt-1 leading-relaxed">只有「休假中」且学校允许续假的请假单才能续假；已销假、已结束或未到假期的请假单不能续假</p>
+          </template>
+          <template v-else>
+            <p class="text-sm text-gray-500">暂无可销假的请假单</p>
+            <p class="text-xs text-gray-400 mt-1">有正在休假或待销假的请假单时会显示在这里</p>
+          </template>
         </div>
         <div v-else class="space-y-2">
           <div
-            v-for="leave in pendingLeaves"
+            v-for="leave in visiblePendingLeaves"
             :key="leave.id"
-            @click="selectLeave(leave)"
-            class="relative p-3 rounded-lg border border-gray-100 hover:border-rose-300 hover:bg-rose-50 cursor-pointer transition-colors"
+            class="relative p-3 rounded-lg border border-gray-100"
           >
             <div class="flex items-center gap-1.5 mb-1.5">
-              <span class="text-[10px] px-1.5 py-0.5 rounded-full shrink-0 bg-amber-100 text-amber-600 font-medium">{{ leave.leaveType || '请假' }}</span>
+              <span class="text-xs px-1.5 py-0.5 rounded-full shrink-0 bg-amber-100 text-amber-600 font-medium">{{ leave.leaveType || '请假' }}</span>
               <p class="text-sm font-medium text-gray-900 flex-1 min-w-0 truncate">{{ leave.reason || '无请假原因' }}</p>
               <span
-                class="text-[10px] px-1.5 py-0.5 rounded-full shrink-0 whitespace-nowrap font-medium"
+                class="text-xs px-1.5 py-0.5 rounded-full shrink-0 whitespace-nowrap font-medium"
                 :style="{ backgroundColor: leaveStatusColor(leave.status) + '1a', color: leaveStatusColor(leave.status) }"
               >{{ leaveStatusLabelOf(leave) }}</span>
             </div>
-            <div class="text-[10px] text-gray-400 space-y-0.5">
+            <div class="text-xs text-gray-400 space-y-0.5 mb-2.5">
               <p>提交时间：{{ leave.createTime || '-' }}</p>
               <p>预计结束：{{ leave.actEndTime || '-' }}</p>
             </div>
+            <div class="flex gap-2">
+              <button
+                v-if="pendingMode === 'report'"
+                @click="selectLeave(leave)"
+                class="press flex-1 h-9 rounded-lg bg-rose-500 text-white text-sm font-semibold"
+              >
+                销假
+              </button>
+              <button
+                v-if="pendingMode === 'extend' && leave.canExtend"
+                @click="startExtend(leave)"
+                :disabled="extendPrefilling"
+                class="press flex-1 h-9 rounded-lg bg-rose-500 text-white text-sm font-semibold disabled:opacity-60 flex items-center justify-center gap-1.5"
+              >
+                <LoaderCircle v-if="extendPrefilling" class="w-4 h-4 animate-spin" />
+                续假
+              </button>
+            </div>
           </div>
         </div>
       </div>
@@ -156,17 +189,17 @@
         <!-- 请假信息 -->
         <div v-if="selectedLeave" class="rounded-lg bg-gray-50 p-3">
           <div class="flex items-center gap-1.5 mb-1">
-            <span class="text-[10px] px-1.5 py-0.5 rounded-full bg-amber-100 text-amber-600 font-medium">{{ selectedLeave.leaveType || '请假' }}</span>
+            <span class="text-xs px-1.5 py-0.5 rounded-full bg-amber-100 text-amber-600 font-medium">{{ selectedLeave.leaveType || '请假' }}</span>
             <span class="text-xs font-medium text-gray-900 truncate">{{ selectedLeave.reason || '无请假原因' }}</span>
           </div>
-          <p class="text-[10px] text-gray-400">预计结束：{{ selectedLeave.actEndTime || '-' }}</p>
+          <p class="text-xs text-gray-400">预计结束：{{ selectedLeave.actEndTime || '-' }}</p>
         </div>
 
         <!-- 规定销假位置选择（reportPlaces） -->
         <div v-if="reportPlaces.length > 0">
           <div class="flex items-start gap-1.5 rounded-lg bg-green-50 border border-green-100 p-2.5 mb-2">
             <MapPin class="w-3.5 h-3.5 text-green-500 shrink-0 mt-0.5" />
-            <p class="text-[10px] text-green-600 leading-relaxed">
+            <p class="text-xs text-green-600 leading-relaxed">
               该请假要求在学校规定位置销假，请选择您当前所在的销假位置
             </p>
           </div>
@@ -183,15 +216,15 @@
               <div class="flex items-center gap-1.5">
                 <MapPin class="w-3.5 h-3.5 shrink-0" :class="selectedPlaceIndex === idx ? 'text-rose-500' : 'text-gray-300'" />
                 <span class="text-xs font-medium text-gray-900 flex-1 min-w-0 truncate">{{ place.address }}</span>
-                <span class="text-[10px] text-gray-400 shrink-0">范围 {{ place.radius }}m</span>
+                <span class="text-xs text-gray-400 shrink-0">范围 {{ place.radius }}m</span>
               </div>
-              <p class="text-[10px] text-gray-400 mt-0.5 ml-5">经纬度：{{ place.longitude }}, {{ place.latitude }}</p>
+              <p class="text-xs text-gray-400 mt-0.5 ml-5">经纬度：{{ place.longitude }}, {{ place.latitude }}</p>
             </div>
           </div>
         </div>
         <div v-else class="flex items-start gap-1.5 rounded-lg bg-amber-50 border border-amber-100 p-2.5">
           <MapPin class="w-3.5 h-3.5 text-amber-500 shrink-0 mt-0.5" />
-          <p class="text-[10px] text-amber-600 leading-relaxed">
+          <p class="text-xs text-amber-600 leading-relaxed">
             该请假未设置规定销假位置，请手动填写当前所在位置的经纬度与地址
           </p>
         </div>
@@ -252,15 +285,15 @@
                 <div v-if="form.approverWid === a.userWid" class="w-1.5 h-1.5 rounded-full bg-rose-500"></div>
               </div>
               <span class="text-xs text-gray-900">{{ a.userName }}</span>
-              <span class="text-[10px] text-gray-400">{{ a.userId }}</span>
+              <span class="text-xs text-gray-400">{{ a.userId }}</span>
             </div>
           </div>
           <div v-else class="rounded-lg bg-amber-50 border border-amber-100 p-2.5">
-            <p class="text-[10px] text-amber-600">未获取到可选的审批人，请稍后重试</p>
+            <p class="text-xs text-amber-600">未获取到可选的审批人，请稍后重试</p>
             <button
               @click="loadApprovers"
               :disabled="loadingApprovers"
-              class="mt-1.5 text-[10px] text-rose-500 hover:text-rose-600 disabled:opacity-40"
+              class="mt-1.5 text-xs text-rose-500 hover:text-rose-600 disabled:opacity-40"
             >重新获取</button>
           </div>
         </div>
@@ -270,8 +303,8 @@
         <div>
           <label class="text-xs text-gray-500 mb-1 block">
             销假图片
-            <span v-if="selectedLeave?.enableAttach" class="text-[10px] text-gray-400">（可选）</span>
-            <span v-else class="text-[10px] text-amber-500">（部分学校销假要求上传，如提交提示需要附件请在此上传）</span>
+            <span v-if="selectedLeave?.enableAttach" class="text-xs text-gray-400">（可选）</span>
+            <span v-else class="text-xs text-amber-500">（部分学校销假要求上传，如提交提示需要附件请在此上传）</span>
           </label>
           <div v-if="form.imageUrl" class="relative inline-block">
             <img :src="form.imageUrl" class="w-20 h-20 rounded-lg object-cover border border-gray-200" />
@@ -292,13 +325,13 @@
             <LoaderCircle v-if="uploadingImage" class="w-5 h-5 text-rose-400 animate-spin" />
             <template v-else>
               <Upload class="w-5 h-5" />
-              <span class="text-[10px] mt-1">上传图片</span>
+              <span class="text-xs mt-1">上传图片</span>
             </template>
           </button>
         </div>
 
         <!-- 执行状态 -->
-        <p v-if="execMessage" class="text-[11px] leading-relaxed" :class="execStatus === 'error' ? 'text-red-500' : execStatus === 'success' ? 'text-green-600' : 'text-blue-500'">
+        <p v-if="execMessage" class="text-xs leading-relaxed" :class="execStatus === 'error' ? 'text-red-500' : execStatus === 'success' ? 'text-green-600' : 'text-blue-500'">
           {{ execMessage }}
         </p>
       </div>
@@ -331,7 +364,7 @@
     >
       <!-- 标题栏 -->
       <div class="px-4 py-3 border-b border-gray-100 flex items-center justify-between shrink-0">
-        <span class="text-sm font-semibold text-gray-900">请假申请</span>
+        <span class="text-sm font-semibold text-gray-900">{{ applyForm.isExtend ? '续假申请' : '请假申请' }}</span>
         <button @click="closeApplyModal" :disabled="applying" class="w-7 h-7 flex items-center justify-center rounded-full hover:bg-gray-100 text-gray-400 disabled:opacity-40">
           <X class="w-4 h-4" />
         </button>
@@ -357,7 +390,7 @@
                 {{ t.name }}{{ t.disableTime === 1 ? '（当前不可用）' : '' }}
               </option>
             </select>
-            <p v-if="currentType?.limitDay" class="text-[10px] text-gray-400 mt-1">单次最长可请 {{ currentType.limitDay }} 天</p>
+            <p v-if="currentType?.limitDay" class="text-xs text-gray-400 mt-1">单次最长可请 {{ currentType.limitDay }} 天</p>
           </div>
 
           <!-- 起止时间 -->
@@ -395,7 +428,7 @@
               ></span>
             </button>
           </div>
-          <p v-if="currentType?.mustOut === 1" class="text-[10px] text-gray-400 -mt-1">该请假类型要求必须离校</p>
+          <p v-if="currentType?.mustOut === 1" class="text-xs text-gray-400 -mt-1">该请假类型要求必须离校</p>
 
           <!-- 离校字段 -->
           <template v-if="applyForm.outStatus">
@@ -432,7 +465,7 @@
           <div>
             <label class="text-xs text-gray-500 mb-1 block">
               请假原因
-              <span v-if="currentType?.reasonWordLimit" class="text-[10px] text-gray-400">（最少 {{ currentType.reasonWordLimit }} 字，当前 {{ applyForm.leaveReason.length }} 字）</span>
+              <span v-if="currentType?.reasonWordLimit" class="text-xs text-gray-400">（最少 {{ currentType.reasonWordLimit }} 字，当前 {{ applyForm.leaveReason.length }} 字）</span>
             </label>
             <textarea
               v-model="applyForm.leaveReason"
@@ -449,7 +482,7 @@
               <button
                 @click="getApplyGPS"
                 :disabled="gettingApplyGPS"
-                class="text-[10px] text-rose-500 hover:text-rose-600 disabled:opacity-40 flex items-center gap-0.5"
+                class="text-xs text-rose-500 hover:text-rose-600 disabled:opacity-40 flex items-center gap-0.5"
               >
                 <LoaderCircle v-if="gettingApplyGPS" class="w-3 h-3 animate-spin" />
                 <MapPin v-else class="w-3 h-3" />
@@ -478,7 +511,7 @@
               placeholder="定位地址"
               class="w-full rounded-lg border border-gray-200 px-3 py-2 text-sm text-gray-900 placeholder-gray-300 focus:outline-none focus:border-rose-400"
             />
-            <p v-if="applyGpsError" class="text-[10px] text-amber-500 mt-1">{{ applyGpsError }}</p>
+            <p v-if="applyGpsError" class="text-xs text-amber-500 mt-1">{{ applyGpsError }}</p>
           </div>
 
           <!-- 手写承诺书签名（requireSign=1 时必填；该校要求先手写签名） -->
@@ -498,16 +531,16 @@
                 class="h-16 px-4 rounded-lg border border-dashed border-gray-300 flex flex-col items-center justify-center text-gray-400 hover:border-rose-300 hover:text-rose-400 transition-colors"
               >
                 <Edit3 class="w-4 h-4" />
-                <span class="text-[10px] mt-1">{{ signaturePreview ? '重新签名' : '点击签名' }}</span>
+                <span class="text-xs mt-1">{{ signaturePreview ? '重新签名' : '点击签名' }}</span>
               </button>
             </div>
-            <p class="text-[10px] text-gray-400 mt-1">本人已阅读知晓《请假安全承诺书》全部内容，并同意上述承诺</p>
+            <p class="text-xs text-gray-400 mt-1">本人已阅读知晓《请假安全承诺书》全部内容，并同意上述承诺</p>
           </div>
 
           <!-- 附件（enableAttach=1 或 attachmentNumberLimit>0 时显示；多图，最多 4 张且不超学校配置） -->
           <div v-if="applyAttachVisible">
             <label class="text-xs text-gray-500 mb-1 block">
-              附件（可选，最多 {{ applyAttachLimit }} 张<template v-if="applyForm.imageUrls.length">，已传 {{ applyForm.imageUrls.length }}/{{ applyAttachLimit }}</template>）
+              附件（<span v-if="currentType?.requireEvidence === 1" class="text-rose-500">必传<template v-if="currentType?.evidenceMin">，至少 {{ currentType.evidenceMin }} 张</template></span><span v-else>可选</span>，最多 {{ applyAttachLimit }} 张<template v-if="applyForm.imageUrls.length">，已传 {{ applyForm.imageUrls.length }}/{{ applyAttachLimit }}</template>）
             </label>
             <div class="flex flex-wrap gap-2">
               <div
@@ -533,18 +566,44 @@
                 <LoaderCircle v-if="uploadingApplyImage" class="w-5 h-5 text-rose-400 animate-spin" />
                 <template v-else>
                   <Upload class="w-5 h-5" />
-                  <span class="text-[10px] mt-1">上传图片</span>
+                  <span class="text-xs mt-1">上传图片</span>
                 </template>
               </button>
             </div>
           </div>
 
+          <!-- 自定义附加信息（新套 selfDefineFields，如「当天是否返校」；必填需作答） -->
+          <div v-if="currentType?.selfDefineFields?.length" class="space-y-3">
+            <div v-for="f in currentType.selfDefineFields" :key="f.fieldWid">
+              <label class="text-xs text-gray-500 mb-1 block">
+                {{ f.fieldName }}
+                <span v-if="f.isRequired" class="text-rose-500">*</span>
+              </label>
+              <select
+                v-if="f.optionList?.length"
+                v-model="selfDefineAnswers[f.fieldWid]"
+                class="w-full rounded-lg border border-gray-200 px-3 py-2 text-sm text-gray-900 focus:outline-none focus:border-rose-400 bg-white"
+              >
+                <option value="" disabled>请选择</option>
+                <!-- value 用 optionSeq（服务端要求数字），展示 optionContent -->
+                <option v-for="o in f.optionList" :key="o.optionSeq" :value="o.optionSeq">{{ o.optionContent }}</option>
+              </select>
+              <input
+                v-else
+                v-model="selfDefineAnswers[f.fieldWid]"
+                type="text"
+                :placeholder="f.fieldTip || ('请输入' + f.fieldName)"
+                class="w-full rounded-lg border border-gray-200 px-3 py-2 text-sm text-gray-900 placeholder-gray-300 focus:outline-none focus:border-rose-400"
+              />
+            </div>
+          </div>
+
           <!-- 审批人（needApproval=1 时；候选为空则不强制选择，允许直接提交） -->
           <div v-if="currentType?.needApproval === 1">
             <label class="text-xs text-gray-500 mb-1 block">
               审批人
               <span v-if="applyApprovers.length > 0" class="text-rose-500">*</span>
-              <span v-else-if="!applyApproversError" class="text-[10px] text-gray-400">（该校未配置审批人，可不选）</span>
+              <span v-else-if="!applyApproversError" class="text-xs text-gray-400">（该校未配置审批人，可不选）</span>
             </label>
             <div v-if="loadingApplyApprovers" class="flex items-center justify-center py-3">
               <LoaderCircle class="w-4 h-4 text-rose-400 animate-spin" />
@@ -566,19 +625,19 @@
                   <div v-if="applyForm.approverWid === a.userWid" class="w-1.5 h-1.5 rounded-full bg-rose-500"></div>
                 </div>
                 <span class="text-xs text-gray-900">{{ a.userName }}</span>
-                <span class="text-[10px] text-gray-400">{{ a.userId }}</span>
+                <span class="text-xs text-gray-400">{{ a.userId }}</span>
               </div>
             </div>
             <div v-else class="rounded-lg bg-amber-50 border border-amber-100 p-2.5">
-              <p v-if="applyApproversError" class="text-[10px] text-red-500">{{ applyApproversError }}</p>
-              <p v-else-if="canFetchApplyApprovers" class="text-[10px] text-amber-600">
+              <p v-if="applyApproversError" class="text-xs text-red-500">{{ applyApproversError }}</p>
+              <p v-else-if="canFetchApplyApprovers" class="text-xs text-amber-600">
                 该校该请假类型未配置审批人，无需选择，可直接提交
               </p>
-              <p v-else class="text-[10px] text-amber-600">请先选择请假类型并填写开始/结束时间，再获取审批人</p>
+              <p v-else class="text-xs text-amber-600">请先选择请假类型并填写开始/结束时间，再获取审批人</p>
               <button
                 @click="loadApplyApprovers"
                 :disabled="loadingApplyApprovers || !canFetchApplyApprovers"
-                class="mt-1.5 text-[10px] text-rose-500 hover:text-rose-600 disabled:opacity-40"
+                class="mt-1.5 text-xs text-rose-500 hover:text-rose-600 disabled:opacity-40"
               >重新获取</button>
             </div>
           </div>
@@ -587,7 +646,7 @@
           <div v-if="canFetchApplyApprovers && applyApprovers.length > 0">
             <label class="text-xs text-gray-500 mb-1 block">
               抄送人
-              <span class="text-[10px] text-gray-400">（非必填，可多选）</span>
+              <span class="text-xs text-gray-400">（非必填，可多选）</span>
             </label>
             <div class="space-y-1.5">
               <div
@@ -608,13 +667,13 @@
                   </svg>
                 </div>
                 <span class="text-xs text-gray-900">{{ a.userName }}</span>
-                <span class="text-[10px] text-gray-400">{{ a.userId }}</span>
+                <span class="text-xs text-gray-400">{{ a.userId }}</span>
               </div>
             </div>
           </div>
 
           <!-- 执行状态 -->
-          <p v-if="applyMessage" class="text-[11px] leading-relaxed" :class="applyStatus === 'error' ? 'text-red-500' : applyStatus === 'success' ? 'text-green-600' : 'text-blue-500'">
+          <p v-if="applyMessage" class="text-xs leading-relaxed" :class="applyStatus === 'error' ? 'text-red-500' : applyStatus === 'success' ? 'text-green-600' : 'text-blue-500'">
             {{ applyMessage }}
           </p>
         </template>
@@ -633,7 +692,7 @@
           class="flex-1 rounded-lg bg-rose-500 hover:bg-rose-600 disabled:bg-rose-300 py-2.5 text-sm font-medium text-white transition-colors flex items-center justify-center gap-1.5"
         >
           <LoaderCircle v-if="applying" class="w-4 h-4 animate-spin" />
-          {{ applying ? '提交中...' : '提交请假' }}
+          {{ applying ? '提交中...' : (applyForm.isExtend ? '提交续假' : '提交请假') }}
         </button>
       </div>
     </AppDialog>
@@ -663,7 +722,7 @@
             @touchend.prevent="signEnd"
           />
         </div>
-        <p v-if="signaturePreview" class="text-[10px] text-green-600 mt-2">已签名。如需重签，点「重置」后重新书写。</p>
+        <p v-if="signaturePreview" class="text-xs text-green-600 mt-2">已签名。如需重签，点「重置」后重新书写。</p>
         <div class="flex gap-2 mt-4">
           <Button variant="outline" class="flex-1 h-10 text-sm" @click="resetSignature">
             重置
@@ -709,7 +768,7 @@
     </AppDialog>
     <!-- ======== 无法请/销假：右侧贴边窄竖条（样式同打卡页「收藏本站」），点击跳转工单页 ======== -->
     <button
-      class="fixed right-0 bottom-32 z-40 flex flex-col items-center gap-1.5 rounded-l-md bg-rose-500/95 py-3 px-1.5 text-white text-xs font-medium shadow-lg shadow-rose-500/30 hover:bg-rose-600 active:scale-95 transition-all"
+      class="fixed right-0 bottom-40 z-40 flex flex-col items-center gap-1.5 rounded-l-xl bg-rose-500 py-3 px-1.5 text-white text-xs font-semibold shadow-lg shadow-rose-500/30 hover:bg-rose-600 active:scale-95 transition-all"
       @click="goTicket"
     >
       <MessageSquare class="w-3.5 h-3.5 flex-shrink-0" />
@@ -721,7 +780,7 @@
 <script setup lang="ts">
 import { ref, computed, watch, onMounted, onUnmounted } from 'vue'
 import { useRouter } from 'vue-router'
-import { CalendarCheck, CalendarPlus, LoaderCircle, Trash2, X, MapPin, Upload, MessageSquare, Smartphone, Edit3 } from 'lucide-vue-next'
+import { CalendarCheck, CalendarPlus, CalendarClock, LoaderCircle, Trash2, X, MapPin, Upload, MessageSquare, Smartphone, Edit3 } from 'lucide-vue-next'
 import * as leaveApi from '@/api/leave'
 import * as authApi from '@/api/auth'
 import type { LeaveItem, LeaveReportPlace, LeaveType } from '@/api/leave'
@@ -774,13 +833,20 @@ async function removeLog(id: number) {
 const showPendingModal = ref(false)
 const loadingLeaves = ref(false)
 const pendingLeaves = ref<LeaveItem[]>([])
+// 列表用途：report=销假（可销假的单），extend=续假（canExtend 的单）
+const pendingMode = ref<'report' | 'extend'>('report')
+// 后端列表含「可销假 或 可续假」两类，按模式过滤；销假模式排除仅可续假的单（canReport 由后端保证在列表内即可销假）
+const visiblePendingLeaves = computed(() =>
+  pendingMode.value === 'extend' ? pendingLeaves.value.filter((l) => l.canExtend) : pendingLeaves.value.filter((l) => l.canReport !== false),
+)
 
-function openPendingModal() {
-  // 未绑定设备码：弹窗引导去个人中心绑定，不进入销假流程
+function openPendingModal(mode: 'report' | 'extend' = 'report') {
+  // 未绑定设备码：弹窗引导去个人中心绑定，不进入销假/续假流程
   if (!deviceCode.value) {
     showBindDeviceDialog.value = true
     return
   }
+  pendingMode.value = mode
   showPendingModal.value = true
   loadPendingLeaves()
 }
@@ -809,18 +875,19 @@ async function loadPendingLeaves() {
   }
 }
 
-// 请假状态映射（status → 展示文案 / 颜色）
+// 请假状态映射（status → 展示文案 / 颜色）。
+// 颜色取薄荷汽水色板的中间调：作文字在亮/暗卡片上均可辨识，叠 10% 透明度作底色
 const leaveStatusMap: Record<string, { label: string; color: string }> = {
-  '1': { label: '待审批', color: '#f0a020' },
-  '2': { label: '处理中', color: '#2080f0' },
-  '3': { label: '已驳回', color: '#d03050' },
-  '4': { label: '已完成', color: '#18a058' },
-  '5': { label: '即将休假', color: '#8a2be2' },
-  '6': { label: '正在休假中', color: '#36ad6a' },
-  '7': { label: '销假逾期', color: '#ff6b6b' },
-  '8': { label: '待销假', color: '#18a058' },
-  '9': { label: '自动通过', color: '#18a058' },
-  '10': { label: '逾期自动驳回', color: '#d03050' },
+  '1': { label: '待审批', color: '#c98a00' },
+  '2': { label: '处理中', color: '#2f86d6' },
+  '3': { label: '已驳回', color: '#d94a63' },
+  '4': { label: '已完成', color: '#1f9d68' },
+  '5': { label: '即将休假', color: '#8b6ce6' },
+  '6': { label: '正在休假中', color: '#14a88d' },
+  '7': { label: '销假逾期', color: '#e8606e' },
+  '8': { label: '待销假', color: '#1f9d68' },
+  '9': { label: '自动通过', color: '#1f9d68' },
+  '10': { label: '逾期自动驳回', color: '#d94a63' },
 }
 
 function leaveStatusLabel(status: string) {
@@ -833,7 +900,7 @@ function leaveStatusLabelOf(leave: { status: string; statusText?: string }) {
 }
 
 function leaveStatusColor(status: string) {
-  return leaveStatusMap[status]?.color || '#909399'
+  return leaveStatusMap[status]?.color || '#7f908a'
 }
 
 // ======== 销假表单弹窗 ========
@@ -973,28 +1040,56 @@ async function uploadImageToObs(file: File): Promise<string | null> {
   return previewJson.data.previewUrl
 }
 
-function handleImageUpload() {
-  if (uploadingImage.value) return
-  const input = document.createElement('input')
-  input.type = 'file'
-  input.accept = 'image/png,image/jpeg,image/jpg'
-  input.onchange = async () => {
-    const file = input.files?.[0]
-    if (!file) return
-
-    uploadingImage.value = true
-    try {
-      const previewUrl = await uploadImageToObs(file)
-      if (!previewUrl) return
-      form.value.imageUrl = previewUrl
-      message.success('图片上传成功')
-    } catch (e: any) {
-      message.error('图片上传失败: ' + (e?.message || '未知错误'))
-    } finally {
-      uploadingImage.value = false
+// 打开系统文件选择器。两点与原实现不同，用于修复部分浏览器「选完图片无任何反应」：
+//  1. input 必须挂到 DOM：部分第三方内核（如 iPhone 夸克）对游离 input 不触发 onchange；
+//  2. accept 用 image/*：旧写法限定 png/jpeg，iOS 相册的 HEIC 等格式会被判为不匹配，
+//     选完拿不到 file（表现为无转圈、无预览、无报错、也无任何请求）。
+// 返回 picked=false 表示用户取消（静默返回）；picked=true 但 files 为空表示
+// 选择器返回了但不含可用文件，调用方应给出可见提示，避免再次静默失败。
+function pickImageFiles(multiple = false): Promise<{ picked: boolean; files: File[] }> {
+  return new Promise((resolve) => {
+    const input = document.createElement('input')
+    input.type = 'file'
+    input.accept = 'image/*'
+    input.multiple = multiple
+    input.style.position = 'fixed'
+    input.style.left = '-9999px'
+    let settled = false
+    const finish = (picked: boolean, files: File[]) => {
+      if (settled) return
+      settled = true
+      input.remove()
+      resolve({ picked, files })
     }
+    input.onchange = () => finish(true, Array.from(input.files || []))
+    // 用户取消：iOS 16+/现代内核会触发 cancel，提前清理避免 input 泄漏
+    input.addEventListener('cancel', () => finish(false, []))
+    document.body.appendChild(input)
+    input.click()
+  })
+}
+
+async function handleImageUpload() {
+  if (uploadingImage.value) return
+  const { picked, files } = await pickImageFiles()
+  if (!picked) return // 用户取消，静默
+  const file = files[0]
+  if (!file) {
+    message.warning('未能读取所选图片，请重试或换一张图片')
+    return
+  }
+
+  uploadingImage.value = true
+  try {
+    const previewUrl = await uploadImageToObs(file)
+    if (!previewUrl) return
+    form.value.imageUrl = previewUrl
+    message.success('图片上传成功')
+  } catch (e: any) {
+    message.error('图片上传失败: ' + (e?.message || '未知错误'))
+  } finally {
+    uploadingImage.value = false
   }
-  input.click()
 }
 
 function removeImage() {
@@ -1124,6 +1219,9 @@ const applyForm = ref({
   locationAddr: '',
   imageUrls: [] as string[],
   approverWid: '',
+  // —— 续假 ——
+  isExtend: false,
+  extendLeaveId: '',
 })
 
 const applyApprovers = ref<leaveApi.LeaveApprover[]>([])
@@ -1161,6 +1259,52 @@ const applyAttachLimit = computed(() => {
 
 const canFetchApplyApprovers = ref(false)
 
+// 自定义附加字段作答：fieldWid -> 值
+const selfDefineAnswers = ref<Record<number, string>>({})
+
+// ======== 续假（仅新套，canExtend 的假单）========
+const extendPrefilling = ref(false)
+
+/** 点击「续假」：拉预填 → 关闭列表 → 以续假模式打开请假弹窗（类型与开始时间锁定，用户只改结束时间） */
+async function startExtend(leave: leaveApi.LeaveItem) {
+  if (extendPrefilling.value) return
+  extendPrefilling.value = true
+  try {
+    const res = await leaveApi.getLeaveExtendPrefill(leave.id)
+    const d = res.data.data
+    // 先确保请假类型已加载（续假需按原 typeWid 复用类型配置）
+    if (leaveTypes.value.length === 0) {
+      await loadLeaveTypes()
+    }
+    closePendingModal()
+    // 预填表单：类型=原假单 typeWid，开始时间=原结束时间（锁定），结束时间留空待填
+    applyForm.value = {
+      leaveType: d.typeWid || Number(leave.typeWid) || 0,
+      startTime: toLocalInput(d.beginTime),
+      endTime: '',
+      leaveReason: d.leaveReason || leave.reason || '',
+      outStatus: d.isLeaveOut === '1',
+      urgencyMobile: '',
+      address: '',
+      detailAddress: '',
+      longitude: '',
+      latitude: '',
+      locationAddr: '',
+      imageUrls: [],
+      approverWid: '',
+      isExtend: true,
+      extendLeaveId: leave.id,
+    }
+    showApplyModal.value = true
+    // 定位类型配置（不走 onApplyTypeChange，避免它重置已预填的 outStatus/原因）
+    currentType.value = currentTypeOf()
+  } catch (e: any) {
+    message.error(e?.response?.data?.message || '获取续假信息失败')
+  } finally {
+    extendPrefilling.value = false
+  }
+}
+
 function openApplyModal() {
   // 未绑定设备码：弹窗引导去个人中心绑定，不进入请假流程
   if (!deviceCode.value) {
@@ -1185,6 +1329,8 @@ function openApplyModal() {
     locationAddr: '',
     imageUrls: [],
     approverWid: '',
+    isExtend: false,
+    extendLeaveId: '',
   }
   applyApprovers.value = []
   applyCcUsers.value = []
@@ -1193,6 +1339,7 @@ function openApplyModal() {
   canFetchApplyApprovers.value = false
   signatureUrl.value = ''
   signaturePreview.value = ''
+  selfDefineAnswers.value = {}
   loadLeaveTypes()
 }
 
@@ -1265,6 +1412,12 @@ function toggleOutStatus() {
   }
 }
 
+// yyyy-MM-dd HH:mm[:ss] → datetime-local 值 yyyy-MM-ddTHH:mm（续假预填用）
+function toLocalInput(v: string): string {
+  const m = (v || '').trim().match(/^(\d{4}-\d{2}-\d{2})[ T](\d{2}:\d{2})/)
+  return m ? `${m[1]}T${m[2]}` : ''
+}
+
 // datetime-local 值形如 2026-09-15T08:00 → 接口要求 yyyy-MM-dd HH:mm:ss
 function toApiTime(v: string): string {
   if (!v) return ''
@@ -1321,42 +1474,39 @@ async function loadApplyApprovers() {
   }
 }
 
-function handleApplyImageUpload() {
+async function handleApplyImageUpload() {
   if (uploadingApplyImage.value) return
-  const input = document.createElement('input')
-  input.type = 'file'
-  input.accept = 'image/png,image/jpeg,image/jpg'
-  input.multiple = true
-  input.onchange = async () => {
-    const files = Array.from(input.files || [])
-    if (files.length === 0) return
-    const remain = applyAttachLimit.value - applyForm.value.imageUrls.length
-    if (remain <= 0) {
-      message.warning(`附件最多 ${applyAttachLimit.value} 张`)
-      return
-    }
-    // 超出上限的多选文件直接丢弃（避免静默只传部分却无提示）
-    const picked = files.slice(0, remain)
-    if (files.length > remain) {
-      message.warning(`附件最多 ${applyAttachLimit.value} 张，本次仅上传前 ${picked.length} 张`)
-    }
-    uploadingApplyImage.value = true
-    try {
-      let uploaded = 0
-      for (const file of picked) {
-        const previewUrl = await uploadImageToObs(file)
-        if (!previewUrl) continue
-        applyForm.value.imageUrls = [...applyForm.value.imageUrls, previewUrl]
-        uploaded++
-      }
-      if (uploaded > 0) message.success('图片上传成功')
-    } catch (e: any) {
-      message.error('图片上传失败: ' + (e?.message || '未知错误'))
-    } finally {
-      uploadingApplyImage.value = false
-    }
+  const { picked, files } = await pickImageFiles(true)
+  if (!picked) return // 用户取消，静默
+  if (files.length === 0) {
+    message.warning('未能读取所选图片，请重试或换一张图片')
+    return
+  }
+  const remain = applyAttachLimit.value - applyForm.value.imageUrls.length
+  if (remain <= 0) {
+    message.warning(`附件最多 ${applyAttachLimit.value} 张`)
+    return
+  }
+  // 超出上限的多选文件直接丢弃（避免静默只传部分却无提示）
+  const pickedFiles = files.slice(0, remain)
+  if (files.length > remain) {
+    message.warning(`附件最多 ${applyAttachLimit.value} 张，本次仅上传前 ${pickedFiles.length} 张`)
+  }
+  uploadingApplyImage.value = true
+  try {
+    let uploaded = 0
+    for (const file of pickedFiles) {
+      const previewUrl = await uploadImageToObs(file)
+      if (!previewUrl) continue
+      applyForm.value.imageUrls = [...applyForm.value.imageUrls, previewUrl]
+      uploaded++
+    }
+    if (uploaded > 0) message.success('图片上传成功')
+  } catch (e: any) {
+    message.error('图片上传失败: ' + (e?.message || '未知错误'))
+  } finally {
+    uploadingApplyImage.value = false
   }
-  input.click()
 }
 
 function removeApplyImage(idx: number) {
@@ -1612,6 +1762,17 @@ async function submitApply() {
     openSignDialog()
     return
   }
+  // 证明材料必填（新版 isRequiredEvidenceFile）：需满足最少张数
+  if (t?.requireEvidence === 1 && f.imageUrls.length < (t?.evidenceMin || 0)) {
+    message.warning(`请上传证明材料（至少 ${t?.evidenceMin || 0} 张）`)
+    return
+  }
+  // 自定义附加字段必填校验
+  const missingSelf = (t?.selfDefineFields || []).filter((sf) => sf.isRequired && !String(selfDefineAnswers.value[sf.fieldWid] || '').trim())
+  if (missingSelf.length) {
+    message.warning('请填写：' + missingSelf.map((x) => x.fieldName).join('、'))
+    return
+  }
   // 审批人：仅当学校配置了候选审批人时必选；候选为空（未配置人员）允许不选
   if (t?.needApproval === 1 && applyApprovers.value.length > 0 && !f.approverWid) {
     message.warning('该请假类型需要选择审批人')
@@ -1643,6 +1804,17 @@ async function submitApply() {
       approverName: approver?.userName,
       ccUsers: applyCcUsers.value.length > 0 ? applyCcUsers.value : undefined,
       signatureUrl: signatureUrl.value || undefined,
+      isExtend: f.isExtend || undefined,
+      extendLeaveId: f.isExtend ? f.extendLeaveId : undefined,
+      selfDefineAnswers: (t?.selfDefineFields || []).length
+        ? (t?.selfDefineFields || []).map((sf) => {
+            const raw = selfDefineAnswers.value[sf.fieldWid]
+            // 选项字段（有 optionList）提交 optionSeq 数字；文本字段提交字符串。
+            // 实测：服务端按数字解析选项值，提交文本会存坏数据导致该单详情报 "For input string"。
+            const val = sf.optionList?.length ? Number(raw) : String(raw ?? '')
+            return { fieldWid: sf.fieldWid, fieldName: sf.fieldName, fieldValue: val as any, fieldType: sf.fieldType }
+          })
+        : undefined,
     },
     {
       onConnecting: () => {
@@ -1684,6 +1856,12 @@ async function submitApply() {
 </script>
 
 <style scoped>
+/* 请/销假头卡：珊瑚 → 粉的柔和渐变（暗色下压暗一档） */
+.leave-hero {
+  background-color: #d23c68;
+  background-image: linear-gradient(135deg, #f0708c 0%, #d9466d 55%, #c23a62 100%);
+}
+
 /* 贴边按钮竖排文字：样式与打卡页「收藏本站」一致
    （仅文字本身竖排，容器保持常规纵排：图标在上、文字在下） */
 .bookmark-vtext {
@@ -1691,3 +1869,10 @@ async function submitApply() {
   letter-spacing: 2px;
 }
 </style>
+
+<style>
+/* 请/销假头卡暗色：非 scoped（scoped 中 :global(.dark) .x 会被编译成仅 .dark，规则失效） */
+html.dark .leave-hero {
+  background-image: linear-gradient(135deg, #b8435f 0%, #9e3352 60%, #8a2c49 100%);
+}
+</style>

frondend/src/views/login/LoginView.vue

@@ -1,7 +1,8 @@
 <script setup lang="ts">
-import { ref, onMounted, watch, onUnmounted } from 'vue'
+import { ref, computed, onMounted, watch, onUnmounted } from 'vue'
 import { useRouter } from 'vue-router'
-import { Search, User, Lock, Eye, EyeOff, RefreshCw, LogIn, GraduationCap, LoaderCircle, AlertTriangle, ExternalLink, FileText, ShieldCheck, Smartphone } from 'lucide-vue-next'
+import { alertDialog } from '@/composables/useConfirm'
+import { Search, User, Lock, Eye, EyeOff, RefreshCw, GraduationCap, LoaderCircle, AlertTriangle, ExternalLink, FileText, ShieldCheck, Smartphone, ArrowRight, MessageSquareText, CheckCircle2 } from 'lucide-vue-next'
 import { Button } from '@/components/ui/button'
 import { Input } from '@/components/ui/input'
 import { Label } from '@/components/ui/label'
@@ -12,6 +13,17 @@ import * as ticketApi from '@/api/ticket'
 import type { SchoolBrief } from '@/api/auth'
 
 const router = useRouter()
+
+// 头图文案
+const heroGreeting = computed(() => {
+  const h = new Date().getHours()
+  if (h < 6) return '夜深了'
+  if (h < 11) return '早上好'
+  if (h < 14) return '中午好'
+  if (h < 18) return '下午好'
+  return '晚上好'
+})
+const heroFeatures = ['人脸签到', '一键请假', '销假续假', '查寝扫码']
 const message = useMessage()
 
 const schoolKeyword = ref('')
@@ -81,6 +93,12 @@ async function loadSmsCaptcha(target: 'send' | 'login') {
 
 function switchLoginMode(mode: 'school' | 'sms') {
   if (loginMode.value === mode) return
+  if (mode === 'sms') {
+    void alertDialog({
+      title: '手机号登录提示',
+      content: '手机号登录会导致今日校园 App 里的账号被踢下线，重新登录 App 即可，不会影响任何 App 功能。',
+    })
+  }
   loginMode.value = mode
   // 切换时清理各模式的输入态
   captchaCode.value = ''
@@ -369,26 +387,55 @@ onMounted(() => {
   loadCaptcha()
 })
 
-// 搜索学校（防抖）
-watch(schoolKeyword, async (val) => {
-  if (!val.trim()) {
-    schools.value = []
-    showSchoolList.value = false
+// 搜索学校：300ms 防抖 + 请求序号（丢弃过期响应，避免慢请求覆盖新结果）。
+// 选中学校会把输入框写成学校全名，这次变化不是用户在搜索，必须跳过，
+// 否则会以全名再搜一次并重新弹出下拉框。
+let schoolSearchTimer: ReturnType<typeof setTimeout> | null = null
+let schoolSearchSeq = 0
+
+watch(schoolKeyword, (val) => {
+  if (schoolSearchTimer) clearTimeout(schoolSearchTimer)
+  const kw = val.trim()
+  // 选中后由 selectSchool 写回的全名：不搜索
+  if (selectedSchool.value && kw === selectedSchool.value.name) {
     return
   }
-  searching.value = true
-  try {
-    const res = await authApi.searchSchools(val.trim())
-    schools.value = res.data?.data || []
-    showSchoolList.value = schools.value.length > 0
-  } catch {
-    schools.value = []
-  } finally {
-    searching.value = false
+  // 用户改动了输入：原选择作废，需重新选择
+  if (selectedSchool.value) {
+    selectedSchool.value = null
   }
+  if (!kw) {
+    schoolSearchSeq++
+    schools.value = []
+    showSchoolList.value = false
+    searching.value = false
+    return
+  }
+  schoolSearchTimer = setTimeout(async () => {
+    const seq = ++schoolSearchSeq
+    searching.value = true
+    try {
+      const res = await authApi.searchSchools(kw)
+      if (seq !== schoolSearchSeq || selectedSchool.value) return
+      schools.value = res.data?.data || []
+      showSchoolList.value = schools.value.length > 0
+    } catch {
+      if (seq === schoolSearchSeq) schools.value = []
+    } finally {
+      if (seq === schoolSearchSeq) searching.value = false
+    }
+  }, 300)
+})
+
+onUnmounted(() => {
+  if (schoolSearchTimer) clearTimeout(schoolSearchTimer)
 })
 
 function selectSchool(school: SchoolBrief) {
+  // 先清掉待执行的搜索并作废进行中的请求，再写回全名
+  if (schoolSearchTimer) clearTimeout(schoolSearchTimer)
+  schoolSearchSeq++
+  searching.value = false
   selectedSchool.value = school
   schoolKeyword.value = school.name
   showSchoolList.value = false
@@ -596,241 +643,226 @@ async function handleReportSubmit() {
 </script>
 
 <template>
-  <div class="h-full flex flex-col bg-white">
-    <!-- 顶部留白 -->
-    <div class="flex-1 flex flex-col items-center justify-center px-6">
-      <!-- Logo / 标题 -->
-      <div class="text-center mb-8">
-        <div class="w-16 h-16 rounded-2xl bg-blue-500 flex items-center justify-center mx-auto mb-4 shadow-lg shadow-blue-200">
-          <GraduationCap class="w-8 h-8 text-white" />
+  <div class="login-root h-full flex flex-col overflow-y-auto overscroll-contain">
+    <!-- ======== 品牌头图 ======== -->
+    <div class="login-hero relative overflow-hidden hero-clip flex-shrink-0 px-6 text-white" style="padding-top: calc(var(--safe-top) + 44px); padding-bottom: 76px">
+      <div class="pointer-events-none absolute -right-16 -top-20 w-72 h-72 rounded-full bg-white/10" />
+      <div class="pointer-events-none absolute -left-10 top-28 w-40 h-40 rounded-full bg-white/10" />
+      <div class="pointer-events-none absolute inset-0 login-hero-grid" />
+      <div class="relative rise-in">
+        <div class="flex items-center gap-3">
+          <div class="relative w-14 h-14 rounded-[18px] bg-white/20 ring-1 ring-white/40 flex items-center justify-center shadow-lg shadow-black/10">
+            <GraduationCap class="w-7 h-7 text-white" />
+          </div>
+          <div>
+            <p class="text-[26px] font-bold tracking-tight leading-tight">小助手</p>
+            <p class="text-sm text-white/90">你的温馨校园小助手</p>
+          </div>
+        </div>
+        <p class="mt-6 text-[22px] font-bold tracking-tight leading-snug">{{ heroGreeting }}，<br />欢迎回来</p>
+        <div class="mt-4 flex flex-wrap gap-2">
+          <span v-for="f in heroFeatures" :key="f" class="text-xs font-medium rounded-full bg-white/15 ring-1 ring-white/25 px-2.5 py-1">{{ f }}</span>
         </div>
-        <h1 class="text-xl font-bold text-gray-900">小助手</h1>
-        <p class="text-sm text-gray-400 mt-1">你的温馨小助手</p>
       </div>
+    </div>
 
-      <!-- 表单 -->
-      <div class="w-full max-w-sm space-y-4">
-        <!-- 登录方式切换 -->
-        <div class="flex gap-2 p-1 bg-gray-100 rounded-xl">
+    <!-- ======== 登录卡片（上浮压住头图） ======== -->
+    <div class="relative flex-1 px-4 -mt-12 pb-6">
+      <div class="login-card mx-auto w-full max-w-sm rounded-[28px] p-5 rise-in" style="animation-delay: 60ms">
+        <p class="text-lg font-bold text-gray-900 tracking-tight mb-4">账号登录</p>
+
+        <!-- 登录方式切换（滑块分段控件） -->
+        <div class="relative grid grid-cols-2 p-1 rounded-2xl bg-gray-100 mb-5" role="tablist" aria-label="登录方式">
+          <div
+            class="absolute top-1 bottom-1 left-1 rounded-xl bg-white shadow-sm ring-1 ring-black/5 transition-transform duration-300 ease-[var(--ease-spring)] dark:bg-gray-300 dark:ring-white/5"
+            :style="{ width: 'calc((100% - 8px) / 2)', transform: loginMode === 'sms' ? 'translateX(100%)' : 'none' }"
+          />
           <button
-            class="flex-1 h-9 rounded-lg text-sm font-medium transition-colors"
-            :class="loginMode === 'school' ? 'bg-white text-gray-900 shadow-sm' : 'text-gray-500'"
+            role="tab"
+            :aria-selected="loginMode === 'school'"
+            class="relative z-10 h-10 flex items-center justify-center gap-1.5 rounded-xl text-sm transition-colors"
+            :class="loginMode === 'school' ? 'font-semibold text-brand-600 dark:text-brand-700' : 'font-medium text-gray-500'"
             @click="switchLoginMode('school')"
           >
-            学工号登录
+            <User class="w-4 h-4" />学工号登录
           </button>
           <button
-            class="flex-1 h-9 rounded-lg text-sm font-medium transition-colors"
-            :class="loginMode === 'sms' ? 'bg-white text-gray-900 shadow-sm' : 'text-gray-500'"
+            role="tab"
+            :aria-selected="loginMode === 'sms'"
+            class="relative z-10 h-10 flex items-center justify-center gap-1.5 rounded-xl text-sm transition-colors"
+            :class="loginMode === 'sms' ? 'font-semibold text-brand-600 dark:text-brand-700' : 'font-medium text-gray-500'"
             @click="switchLoginMode('sms')"
           >
-            手机号登录
+            <Smartphone class="w-4 h-4" />手机号登录
           </button>
         </div>
 
+        <div class="space-y-3.5">
         <!-- ======== 手机号验证码登录（无需选择学校） ======== -->
         <template v-if="loginMode === 'sms'">
-          <div>
-            <Label class="mb-1.5 block text-xs font-medium text-gray-500">手机号</Label>
-            <div class="relative">
-              <Smartphone class="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-gray-400" />
-              <Input v-model="smsPhone" placeholder="请输入手机号" class="pl-9 h-10 text-sm" />
-            </div>
+          <div class="login-field">
+            <Smartphone class="login-field-icon" />
+            <input v-model="smsPhone" type="tel" inputmode="numeric" autocomplete="tel" placeholder="请输入手机号" class="login-input" aria-label="手机号" />
           </div>
 
           <!-- 图片验证码（用于「发送短信验证码」） -->
-          <div>
-            <Label class="mb-1.5 block text-xs font-medium text-gray-500">图片验证码</Label>
-            <div class="flex gap-2">
-              <Input v-model="smsSendCaptchaCode" placeholder="输入图片验证码" class="flex-1 h-10 text-sm" />
-              <div
-                class="flex-shrink-0 w-[120px] h-10 rounded-lg border border-gray-200 overflow-hidden cursor-pointer bg-gray-50 flex items-center justify-center"
+          <div class="flex gap-2">
+            <div class="login-field flex-1">
+              <ShieldCheck class="login-field-icon" />
+              <input v-model="smsSendCaptchaCode" placeholder="图片验证码" class="login-input" aria-label="发送短信用图片验证码" />
+            </div>
+            <button
+                type="button"
+                class="login-captcha press"
+                :aria-label="'刷新图片验证码'"
                 @click="loadSmsCaptcha('send')"
               >
-                <img
-                  v-if="smsSendCaptchaImage && !smsSendCaptchaLoading"
-                  :src="smsSendCaptchaImage"
-                  alt="验证码"
-                  class="w-full h-full object-cover"
-                />
-                <div v-else-if="!smsSendCaptchaLoading && smsSendCaptchaError" class="w-full h-full px-1 flex items-center justify-center">
-                  <span class="text-[10px] leading-tight text-red-400 text-center">{{ smsSendCaptchaError }}</span>
-                </div>
-                <div v-else class="w-full h-full flex items-center justify-center">
-                  <RefreshCw v-if="smsSendCaptchaLoading" class="h-4 w-4 animate-spin text-gray-400" />
-                  <span v-else class="text-xs text-gray-400">加载中</span>
-                </div>
-              </div>
-            </div>
+                <img v-if="smsSendCaptchaImage && !smsSendCaptchaLoading" :src="smsSendCaptchaImage" alt="验证码" class="w-full h-full object-cover" />
+                <span v-else-if="!smsSendCaptchaLoading && smsSendCaptchaError" class="px-1 text-xs leading-tight text-red-500 text-center">{{ smsSendCaptchaError }}</span>
+                <RefreshCw v-else class="h-4 w-4 text-gray-400" :class="smsSendCaptchaLoading && 'animate-spin'" />
+                <span v-if="smsSendCaptchaImage && !smsSendCaptchaLoading" class="login-captcha-refresh"><RefreshCw class="w-3 h-3" /></span>
+              </button>
           </div>
 
-          <div>
-            <Label class="mb-1.5 block text-xs font-medium text-gray-500">短信验证码</Label>
-            <div class="flex gap-2">
-              <Input v-model="smsCode" placeholder="请输入短信验证码" class="flex-1 h-10 text-sm" />
-              <Button
-                variant="outline"
-                class="flex-shrink-0 h-10 px-3 text-sm"
-                :disabled="smsSending || smsCountdown > 0"
-                @click="handleSendSmsCode"
-              >
-                <template v-if="smsSending">发送中...</template>
-                <template v-else-if="smsCountdown > 0">{{ smsCountdown }}s</template>
-                <template v-else>发送验证码</template>
-              </Button>
+          <div class="flex gap-2">
+            <div class="login-field flex-1">
+              <MessageSquareText class="login-field-icon" />
+              <input v-model="smsCode" inputmode="numeric" autocomplete="one-time-code" placeholder="短信验证码" class="login-input" aria-label="短信验证码" />
             </div>
+            <button
+              type="button"
+              class="login-sms-btn press"
+              :disabled="smsSending || smsCountdown > 0"
+              @click="handleSendSmsCode"
+            >
+              <template v-if="smsSending">发送中…</template>
+              <template v-else-if="smsCountdown > 0">{{ smsCountdown }}s 后重发</template>
+              <template v-else>获取验证码</template>
+            </button>
           </div>
 
           <!-- 图片验证码（用于「登录」，与发送用相互独立） -->
-          <div>
-            <Label class="mb-1.5 block text-xs font-medium text-gray-500">图片验证码</Label>
-            <div class="flex gap-2">
-              <Input v-model="smsLoginCaptchaCode" placeholder="输入图片验证码" class="flex-1 h-10 text-sm" />
-              <div
-                class="flex-shrink-0 w-[120px] h-10 rounded-lg border border-gray-200 overflow-hidden cursor-pointer bg-gray-50 flex items-center justify-center"
+          <div class="flex gap-2">
+            <div class="login-field flex-1">
+              <ShieldCheck class="login-field-icon" />
+              <input v-model="smsLoginCaptchaCode" placeholder="登录图片验证码" class="login-input" aria-label="登录用图片验证码" />
+            </div>
+            <button
+                type="button"
+                class="login-captcha press"
+                :aria-label="'刷新图片验证码'"
                 @click="loadSmsCaptcha('login')"
               >
-                <img
-                  v-if="smsLoginCaptchaImage && !smsLoginCaptchaLoading"
-                  :src="smsLoginCaptchaImage"
-                  alt="验证码"
-                  class="w-full h-full object-cover"
-                />
-                <div v-else-if="!smsLoginCaptchaLoading && smsLoginCaptchaError" class="w-full h-full px-1 flex items-center justify-center">
-                  <span class="text-[10px] leading-tight text-red-400 text-center">{{ smsLoginCaptchaError }}</span>
-                </div>
-                <div v-else class="w-full h-full flex items-center justify-center">
-                  <RefreshCw v-if="smsLoginCaptchaLoading" class="h-4 w-4 animate-spin text-gray-400" />
-                  <span v-else class="text-xs text-gray-400">加载中</span>
-                </div>
-              </div>
-            </div>
+                <img v-if="smsLoginCaptchaImage && !smsLoginCaptchaLoading" :src="smsLoginCaptchaImage" alt="验证码" class="w-full h-full object-cover" />
+                <span v-else-if="!smsLoginCaptchaLoading && smsLoginCaptchaError" class="px-1 text-xs leading-tight text-red-500 text-center">{{ smsLoginCaptchaError }}</span>
+                <RefreshCw v-else class="h-4 w-4 text-gray-400" :class="smsLoginCaptchaLoading && 'animate-spin'" />
+                <span v-if="smsLoginCaptchaImage && !smsLoginCaptchaLoading" class="login-captcha-refresh"><RefreshCw class="w-3 h-3" /></span>
+              </button>
           </div>
         </template>
 
         <!-- ======== 学校 + 学工号 + 密码登录 ======== -->
         <template v-else>
-        <!-- 学校 -->
-        <div class="relative">
-          <Label class="mb-1.5 block text-xs font-medium text-gray-500">学校</Label>
+          <!-- 学校 -->
           <div class="relative">
-            <template v-if="!selectedSchool">
-              <Search class="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-gray-400 z-10" />
-            </template>
-            <img
-              v-else-if="selectedSchool?.img"
-              :src="selectedSchool.img"
-              class="absolute left-2.5 top-1/2 -translate-y-1/2 w-5 h-5 rounded-sm object-contain z-10"
-            />
-            <GraduationCap
-              v-else
-              class="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-gray-400 z-10"
-            />
-            <Input
-              v-model="schoolKeyword"
-              :placeholder="selectedSchool ? selectedSchool.name : '搜索学校...'"
-              class="pl-9 h-10 text-sm pr-9"
-              @focus="showSchoolList = schools.length > 0"
-              @blur="handleBlur"
-            />
-            <!-- 搜索 loading -->
-            <div v-if="searching && !selectedSchool" class="absolute right-3 top-1/2 -translate-y-1/2">
-              <LoaderCircle class="w-4 h-4 text-blue-400 animate-spin" />
+            <div class="login-field" :class="selectedSchool && 'is-filled'">
+              <img v-if="selectedSchool?.img" :src="selectedSchool.img" alt="" class="login-field-icon !w-5 !h-5 rounded object-contain" />
+              <Search v-else-if="!selectedSchool" class="login-field-icon" />
+              <GraduationCap v-else class="login-field-icon" />
+              <input
+                v-model="schoolKeyword"
+                :placeholder="selectedSchool ? selectedSchool.name : '搜索你的学校'"
+                class="login-input"
+                :class="selectedSchool && 'placeholder:text-gray-900 placeholder:font-medium'"
+                aria-label="学校"
+                @focus="showSchoolList = !selectedSchool && schools.length > 0"
+                @blur="handleBlur"
+              />
+              <LoaderCircle v-if="searching && !selectedSchool" class="w-4 h-4 text-brand-500 animate-spin flex-shrink-0" />
+              <CheckCircle2 v-else-if="selectedSchool" class="w-4 h-4 text-green-500 flex-shrink-0" />
+            </div>
+            <!-- 学校列表 -->
+            <div
+              v-if="showSchoolList && schools.length > 0"
+              class="absolute z-20 mt-1.5 w-full bg-white border border-gray-100 rounded-2xl shadow-xl max-h-52 overflow-y-auto p-1"
+            >
+              <button
+                v-for="school in schools"
+                :key="school.id"
+                class="w-full text-left px-3 py-2.5 text-sm rounded-xl hover:bg-gray-50 transition-colors flex items-center gap-2.5"
+                @mousedown.prevent="selectSchool(school)"
+              >
+                <img v-if="school.img" :src="school.img" alt="" class="w-6 h-6 rounded object-contain flex-shrink-0" />
+                <span v-else class="w-6 h-6 rounded-lg bg-brand-50 flex items-center justify-center flex-shrink-0"><GraduationCap class="w-3.5 h-3.5 text-brand-600" /></span>
+                <span class="text-gray-900">{{ school.name }}</span>
+              </button>
             </div>
           </div>
-          <!-- 学校列表 -->
-          <div
-            v-if="showSchoolList && schools.length > 0"
-            class="absolute z-20 mt-1 w-full bg-white border rounded-lg shadow-lg max-h-44 overflow-y-auto"
-          >
-            <button
-              v-for="school in schools"
-              :key="school.id"
-              class="w-full text-left px-3 py-2.5 text-sm hover:bg-gray-50 transition-colors flex items-center gap-2"
-              @mousedown.prevent="selectSchool(school)"
-            >
-              <img v-if="school.img" :src="school.img" class="w-5 h-5 rounded-sm object-contain flex-shrink-0" />
-              <GraduationCap v-else class="w-4 h-4 text-gray-400 flex-shrink-0" />
-              <span>{{ school.name }}</span>
-            </button>
-          </div>
-        </div>
 
-        <!-- 学工号 -->
-        <div>
-          <Label class="mb-1.5 block text-xs font-medium text-gray-500">学工号</Label>
-          <div class="relative">
-            <User class="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-gray-400" />
-            <Input v-model="username" placeholder="请输入学工号" class="pl-9 h-10 text-sm" />
+          <!-- 学工号 -->
+          <div class="login-field">
+            <User class="login-field-icon" />
+            <input v-model="username" autocomplete="username" placeholder="请输入学工号" class="login-input" aria-label="学工号" />
           </div>
-        </div>
 
-        <!-- 密码 -->
-        <div>
-          <Label class="mb-1.5 block text-xs font-medium text-gray-500">密码</Label>
-          <div class="relative">
-            <Lock class="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-gray-400" />
-            <Input
-              :type="showPassword ? 'text' : 'password'"
+          <!-- 密码 -->
+          <div class="login-field">
+            <Lock class="login-field-icon" />
+            <input
               v-model="password"
-              placeholder="请输入密码"
-              class="pl-9 pr-9 h-10 text-sm"
+              :type="showPassword ? 'text' : 'password'"
+              autocomplete="current-password"
+              placeholder="请输入统一认证密码"
+              class="login-input"
+              aria-label="密码"
             />
             <button
               type="button"
-              class="absolute right-3 top-1/2 -translate-y-1/2 text-gray-400 hover:text-gray-600"
+              class="w-8 h-8 -mr-1 flex items-center justify-center rounded-lg text-gray-400 hover:text-gray-600"
+              :aria-label="showPassword ? '隐藏密码' : '显示密码'"
               @click="showPassword = !showPassword"
             >
               <Eye v-if="showPassword" class="h-4 w-4" />
               <EyeOff v-else class="h-4 w-4" />
             </button>
           </div>
-        </div>
 
-        <!-- 验证码 -->
-        <div>
-          <Label class="mb-1.5 block text-xs font-medium text-gray-500">验证码</Label>
+          <!-- 验证码 -->
           <div class="flex gap-2">
-            <Input v-model="captchaCode" placeholder="输入验证码" class="flex-1 h-10 text-sm" />
-            <div
-              class="flex-shrink-0 w-[120px] h-10 rounded-lg border border-gray-200 overflow-hidden cursor-pointer bg-gray-50 flex items-center justify-center"
-              @click="loadCaptcha"
-            >
-              <img
-                v-if="captchaImage && !loadingCaptcha"
-                :src="captchaImage"
-                alt="验证码"
-                class="w-full h-full object-cover"
-              />
-              <div v-else-if="!loadingCaptcha && captchaError" class="w-full h-full px-1 flex items-center justify-center">
-                <span class="text-[10px] leading-tight text-red-400 text-center">{{ captchaError }}</span>
-              </div>
-              <div v-else class="w-full h-full flex items-center justify-center">
-                <RefreshCw v-if="loadingCaptcha" class="h-4 w-4 animate-spin text-gray-400" />
-                <span v-else class="text-xs text-gray-400">加载中</span>
-              </div>
+            <div class="login-field flex-1">
+              <ShieldCheck class="login-field-icon" />
+              <input v-model="captchaCode" placeholder="请输入验证码" class="login-input" aria-label="验证码" @keyup.enter="handleLogin()" />
             </div>
+            <button
+                type="button"
+                class="login-captcha press"
+                :aria-label="'刷新图片验证码'"
+                @click="loadCaptcha"
+              >
+                <img v-if="captchaImage && !loadingCaptcha" :src="captchaImage" alt="验证码" class="w-full h-full object-cover" />
+                <span v-else-if="!loadingCaptcha && captchaError" class="px-1 text-xs leading-tight text-red-500 text-center">{{ captchaError }}</span>
+                <RefreshCw v-else class="h-4 w-4 text-gray-400" :class="loadingCaptcha && 'animate-spin'" />
+                <span v-if="captchaImage && !loadingCaptcha" class="login-captcha-refresh"><RefreshCw class="w-3 h-3" /></span>
+              </button>
           </div>
-        </div>
-
         </template>
+        </div>
 
         <!-- 登录按钮 -->
-        <Button
-          class="w-full h-11 mt-2 text-sm font-medium"
+        <button
+          type="button"
+          class="login-submit press mt-5"
           :disabled="logging"
           @click="loginMode === 'sms' ? handleSmsLogin() : handleLogin()"
         >
-          <LogIn v-if="!logging" class="h-4 w-4" />
-          <RefreshCw v-else class="h-4 w-4 animate-spin" />
-          {{ logging ? '登录中...' : '登录' }}
-        </Button>
-      </div>
-    </div>
+          <RefreshCw v-if="logging" class="h-4 w-4 animate-spin" />
+          <template v-else>登录<ArrowRight class="h-4 w-4" /></template>
+          <template v-if="logging">登录中…</template>
+        </button>
 
-    <!-- 底部版本信息 -->
-    <div class="text-center pb-5">
-      <p class="text-xs text-gray-300">copyright © 2026</p>
+      </div>
+
+      <p class="text-center text-xs text-gray-400 mt-6">copyright © 2026</p>
     </div>
 
     <!-- ======== 多因子认证（MFA）Dialog：选择验证方式 → 输入验证码 ======== -->
@@ -845,7 +877,7 @@ async function handleReportSubmit() {
       @update:open="(v: boolean) => { if (!v) closeMFADialog() }"
     >
       <!-- 顶部装饰条 -->
-      <div class="h-1.5 bg-gradient-to-r from-blue-500 to-cyan-400" />
+      <div class="h-1.5 bg-gradient-to-r from-brand-400 to-sky-400" />
       <div class="p-6">
         <!-- 标题 -->
         <div class="flex items-center gap-2.5 mb-3">
@@ -854,7 +886,7 @@ async function handleReportSubmit() {
           </div>
           <div>
             <h3 class="text-base font-bold text-gray-900">多因子认证</h3>
-            <p class="text-[10px] text-gray-400 mt-0.5">该校登录需校验动态验证码</p>
+            <p class="text-xs text-gray-400 mt-0.5">该校登录需校验动态验证码</p>
           </div>
         </div>
 
@@ -867,7 +899,7 @@ async function handleReportSubmit() {
                 {{ mfaMessage || '请选择验证方式获取验证码' }}
               </p>
             </div>
-            <p class="text-[10px] text-blue-400 mt-1.5 pl-6.5">验证会话 10 分钟内有效</p>
+            <p class="text-xs text-blue-400 mt-1.5 pl-6.5">验证会话 10 分钟内有效</p>
           </div>
 
           <!-- 验证方式列表 -->
@@ -908,7 +940,7 @@ async function handleReportSubmit() {
               <Smartphone class="w-4 h-4 text-blue-500 flex-shrink-0 mt-0.5" />
               <p class="text-sm text-blue-700 leading-relaxed">{{ mfaMessage }}</p>
             </div>
-            <p class="text-[10px] text-blue-400 mt-1.5 pl-6.5">验证会话 10 分钟内有效，输错可重新输入</p>
+            <p class="text-xs text-blue-400 mt-1.5 pl-6.5">验证会话 10 分钟内有效，输错可重新输入</p>
           </div>
 
           <!-- 验证码输入 -->
@@ -919,11 +951,11 @@ async function handleReportSubmit() {
               <Input
                 v-model="mfaCode"
                 placeholder="请输入收到的验证码"
-                class="pl-9 pr-9 h-10 text-sm tracking-widest"
+                class="pl-9 pr-9 h-11 text-sm tracking-widest"
                 maxlength="8"
                 @keyup.enter="handleMFAVerify"
               />
-              <span v-if="mfaCountdown > 0" class="absolute right-3 top-1/2 -translate-y-1/2 text-[10px] text-gray-300 tabular-nums">
+              <span v-if="mfaCountdown > 0" class="absolute right-3 top-1/2 -translate-y-1/2 text-xs text-gray-300 tabular-nums">
                 {{ Math.floor(mfaCountdown / 60) }}:{{ String(mfaCountdown % 60).padStart(2, '0') }}
               </span>
             </div>
@@ -1046,7 +1078,7 @@ async function handleReportSubmit() {
           </div>
           <div>
             <h3 class="text-base font-bold text-gray-900">提交工单</h3>
-            <p class="text-[10px] text-gray-400 mt-0.5">提交后管理员将处理该学校适配问题</p>
+            <p class="text-xs text-gray-400 mt-0.5">提交后管理员将处理该学校适配问题</p>
           </div>
         </div>
 
@@ -1081,12 +1113,12 @@ async function handleReportSubmit() {
             <Label class="mb-1 block text-xs font-medium text-gray-500">
               联系邮箱 <span class="text-red-400">*</span>
             </Label>
-            <p class="text-[10px] text-gray-400 mb-1">适配完成后将通过该邮箱联系您，仅支持国内知名邮箱</p>
+            <p class="text-xs text-gray-400 mb-1">适配完成后将通过该邮箱联系您，仅支持国内知名邮箱</p>
             <div class="flex gap-2">
               <Input
                 v-model="reportEmailPrefix"
                 placeholder="邮箱前缀"
-                class="flex-1 h-10 text-sm"
+                class="flex-1 h-11 text-sm"
               />
               <select
                 v-model="reportEmailDomain"
@@ -1101,9 +1133,9 @@ async function handleReportSubmit() {
           <div>
             <Label class="mb-1 block text-xs font-medium text-gray-500">验证码</Label>
             <div class="flex gap-2">
-              <Input v-model="reportCaptchaCode" placeholder="输入验证码" class="flex-1 h-10 text-sm" />
+              <Input v-model="reportCaptchaCode" placeholder="输入验证码" class="flex-1 h-11 text-sm" />
               <div
-                class="flex-shrink-0 w-[120px] h-10 rounded-lg border border-gray-200 overflow-hidden cursor-pointer bg-gray-50 flex items-center justify-center"
+                class="flex-shrink-0 w-[120px] h-11 rounded-xl border border-gray-200 overflow-hidden cursor-pointer bg-gray-50 flex items-center justify-center"
                 @click="loadReportCaptcha"
               >
                 <img
@@ -1113,7 +1145,7 @@ async function handleReportSubmit() {
                   class="w-full h-full object-cover"
                 />
                 <div v-else-if="!reportLoadingCaptcha && reportCaptchaError" class="w-full h-full px-1 flex items-center justify-center">
-                  <span class="text-[10px] leading-tight text-red-400 text-center">{{ reportCaptchaError }}</span>
+                  <span class="text-xs leading-tight text-red-400 text-center">{{ reportCaptchaError }}</span>
                 </div>
                 <div v-else class="w-full h-full flex items-center justify-center">
                   <RefreshCw v-if="reportLoadingCaptcha" class="h-4 w-4 animate-spin text-gray-400" />
@@ -1137,3 +1169,149 @@ async function handleReportSubmit() {
     </AppDialog>
   </div>
 </template>
+
+<style scoped>
+/* 头图：品牌渐变 + 右上天空蓝光晕 + 细网格（底部淡出），白字区整体 ≥ #0b8672 保证对比度 */
+.login-hero {
+  background-color: #0b8672;
+  background-image:
+    radial-gradient(60% 70% at 100% 0%, rgb(90 169 245 / 0.18), transparent 60%),
+    linear-gradient(160deg, #0b8672 0%, #0b8672 50%, #08604f 100%);
+}
+.login-hero-grid {
+  background-image:
+    linear-gradient(rgb(255 255 255 / 0.07) 1px, transparent 1px),
+    linear-gradient(90deg, rgb(255 255 255 / 0.07) 1px, transparent 1px);
+  background-size: 24px 24px;
+  -webkit-mask-image: linear-gradient(180deg, #000 0%, transparent 90%);
+  mask-image: linear-gradient(180deg, #000 0%, transparent 90%);
+}
+.login-card {
+  background-color: var(--color-card);
+  border: 1px solid rgb(14 40 34 / 0.06);
+  box-shadow: 0 18px 50px rgb(14 40 34 / 0.14), 0 2px 6px rgb(14 40 34 / 0.05);
+}
+/* 输入行：图标 + 原生 input（整行可点、聚焦高亮） */
+.login-field {
+  min-width: 0;
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  height: 50px;
+  padding: 0 14px;
+  border-radius: 16px;
+  background-color: var(--color-gray-50);
+  border: 1.5px solid var(--color-gray-200);
+  transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
+}
+.login-field:focus-within {
+  background-color: var(--color-card);
+  border-color: var(--color-brand-400);
+  box-shadow: 0 0 0 4px rgb(44 197 168 / 0.14);
+}
+.login-field.is-filled {
+  background-color: var(--color-brand-50);
+  border-color: var(--color-brand-200);
+}
+.login-field-icon {
+  width: 18px;
+  height: 18px;
+  flex-shrink: 0;
+  color: var(--color-gray-400);
+}
+.login-field:focus-within .login-field-icon {
+  color: var(--color-brand-500);
+}
+.login-input {
+  flex: 1;
+  min-width: 0;
+  height: 100%;
+  background: transparent;
+  border: 0;
+  outline: none;
+  font-size: 15px;
+  color: var(--color-gray-900);
+}
+.login-input::placeholder {
+  color: var(--color-gray-400);
+}
+/* 图片验证码 */
+.login-captcha {
+  position: relative;
+  width: 108px;
+  height: 50px;
+  flex-shrink: 0;
+  border-radius: 16px;
+  overflow: hidden;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: var(--color-gray-50);
+  border: 1.5px solid var(--color-gray-200);
+}
+.login-captcha-refresh {
+  position: absolute;
+  right: 4px;
+  bottom: 4px;
+  width: 18px;
+  height: 18px;
+  border-radius: 999px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: #fff;
+  background: rgb(0 0 0 / 0.35);
+}
+.login-sms-btn {
+  height: 50px;
+  min-width: 108px;
+  flex-shrink: 0;
+  padding: 0 12px;
+  border-radius: 16px;
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--color-brand-600);
+  background-color: var(--color-brand-50);
+  border: 1.5px solid var(--color-brand-200);
+  white-space: nowrap;
+}
+.login-sms-btn:disabled {
+  color: var(--color-gray-500);
+  background-color: var(--color-gray-100);
+  border-color: var(--color-gray-200);
+}
+/* 主按钮：固定品牌色（白字 ≥ 4.5:1） */
+.login-submit {
+  width: 100%;
+  height: 52px;
+  border-radius: 999px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 6px;
+  color: #fff;
+  font-size: 16px;
+  font-weight: 700;
+  letter-spacing: 0.04em;
+  background-image: linear-gradient(135deg, #0e9a82 0%, #0b8672 55%, #08604f 100%);
+  box-shadow: 0 10px 24px rgb(11 134 114 / 0.3);
+}
+.login-submit:disabled {
+  opacity: 0.6;
+}
+</style>
+
+<style>
+html.dark .login-hero {
+  background-image:
+    radial-gradient(70% 90% at 100% 0%, rgb(90 169 245 / 0.14), transparent 60%),
+    linear-gradient(160deg, #0c6d5d 0%, #0b5f55 60%, #094c44 100%);
+}
+html.dark .login-card {
+  border-color: rgb(255 255 255 / 0.06);
+  box-shadow: 0 18px 50px rgb(0 0 0 / 0.45);
+}
+html.dark .login-sms-btn {
+  color: var(--color-brand-700);
+}
+</style>

frondend/src/views/profile/ProfileView.vue

@@ -1,7 +1,8 @@
 <script setup lang="ts">
 import { ref, computed, onMounted } from 'vue'
 import { useRouter } from 'vue-router'
-import { LogOut, RefreshCw, ClipboardCheck, Gift, Share2, X, MessageSquare, Dices, TriangleAlert } from 'lucide-vue-next'
+import { LogOut, RefreshCw, Gift, X, Dices, TriangleAlert, SunMoon, Sun, Moon, Crown, Copy, ChevronRight, Smartphone, Users, Coins, UserPlus, GraduationCap, Headset, ShoppingCart, Flame } from 'lucide-vue-next'
+import { themeMode, setThemeMode, type ThemeMode } from '@/composables/useTheme'
 import { Button } from '@/components/ui/button'
 import { Input } from '@/components/ui/input'
 import AppDialog from '@/components/ui/dialog/AppDialog.vue'
@@ -10,6 +11,17 @@ import * as authApi from '@/api/auth'
 import * as ticketApi from '@/api/ticket'
 import type { UserInfo, MyInviteInfo } from '@/api/auth'
 
+// 外观：自动（按时间 18:00–06:00 暗色）/ 浅色 / 深色
+const themeOptions: { value: ThemeMode; label: string; icon: typeof Sun }[] = [
+  { value: 'auto', label: '自动', icon: SunMoon },
+  { value: 'light', label: '浅色', icon: Sun },
+  { value: 'dark', label: '深色', icon: Moon },
+]
+const themeIndex = computed(() => Math.max(0, themeOptions.findIndex((o) => o.value === themeMode.value)))
+const themeHint = computed(() =>
+  themeMode.value === 'auto' ? '跟随时间：18:00–06:00 为深色' : themeMode.value === 'dark' ? '始终使用深色' : '始终使用浅色',
+)
+
 const router = useRouter()
 const message = useMessage()
 const userInfo = ref<UserInfo | null>(null)
@@ -24,7 +36,6 @@ const inviteReward = ref(0)
 const invitedCount = ref(0)
 const canRedeem = ref(false)
 const hasInviter = ref(false)
-const generatingInvite = ref(false)
 const redeemingInvite = ref(false)
 // 填写邀请码弹窗
 const showFillInviteModal = ref(false)
@@ -72,6 +83,9 @@ const redeemKind = ref<'count' | 'vip'>('count')
 // VIP 信息
 const isVip = ref(false)
 const vipExpireAt = ref('')
+// 「购买 CDK」入口（后台系统设置控制：跳转链接 + 是否展示；visible 且 url 非空才显示）
+const cdkBuyUrl = ref('')
+const cdkBuyVisible = ref(false)
 // 验证码
 const captchaId = ref('')
 const captchaImage = ref('')
@@ -117,6 +131,31 @@ function maskDeviceCode(code: string): string {
 // 是否已绑定设备码（决定「立即绑定 / 重新绑定」按钮文案）
 const hasDeviceCode = computed(() => !!userInfo.value?.mobileCode)
 
+// 头部信息标签：学院 / 专业 / 班级（有值才显示，最多 2 个，避免挤满）
+const profileTags = computed(() => {
+  const u = userInfo.value
+  if (!u) return []
+  return [u.academy, u.className || u.major].filter((t): t is string => !!t && !!t.trim()).slice(0, 2)
+})
+
+// VIP 剩余天数（到期时间无效 / 已过期返回 null）
+const vipDaysLeft = computed(() => {
+  if (!isVip.value || !vipExpireAt.value) return null
+  const t = new Date(vipExpireAt.value).getTime()
+  if (Number.isNaN(t)) return null
+  const d = Math.ceil((t - Date.now()) / 86400000)
+  return d >= 0 ? d : null
+})
+
+// 「邀请积分」格子：积分够则直接兑换，不够提示规则（不再出现一个点不动的灰按钮）
+function onRedeemInviteTap() {
+  if (!canRedeem.value) {
+    message.info('邀请积分满 1 即可兑换 1 次执行次数')
+    return
+  }
+  void handleRedeemInvite()
+}
+
 onMounted(async () => {
   try {
     const res = await authApi.getUserInfo()
@@ -136,6 +175,8 @@ onMounted(async () => {
     const vipRes = await authApi.getVipInfo()
     isVip.value = vipRes.data.data.isVip
     vipExpireAt.value = vipRes.data.data.vipExpireAt
+    cdkBuyUrl.value = vipRes.data.data.cdkBuyUrl || ''
+    cdkBuyVisible.value = !!vipRes.data.data.cdkBuyVisible && !!cdkBuyUrl.value
   } catch {
     // VIP 信息加载失败不阻塞页面
   }
@@ -264,18 +305,6 @@ async function handleRedeem() {
 }
 
 // ---- 邀请相关 ----
-async function handleGenerateInvite() {
-  generatingInvite.value = true
-  try {
-    const res = await authApi.getMyInvite()
-    applyInviteInfo(res.data.data)
-  } catch {
-    message.error('生成邀请码失败')
-  } finally {
-    generatingInvite.value = false
-  }
-}
-
 // 复制邀请码（只复制邀请码本身，不再复制链接）
 function copyInviteCode() {
   if (!inviteCode.value) return
@@ -356,195 +385,245 @@ async function handleRedeemInvite() {
 
 <template>
   <div class="flex flex-col min-h-full">
-    <!-- 顶部大蓝色卡片：个人基础信息撑满上半部 -->
-    <div class="bg-gradient-to-r from-blue-500 to-blue-600 px-6 pt-10 pb-14 text-white text-center flex-shrink-0">
-      <!-- 头像 + VIP 徽标（头像右上角，反光动画） -->
-      <div class="relative w-20 h-20 rounded-full bg-white/20 flex items-center justify-center mx-auto mb-4 overflow-visible ring-4 ring-white/30">
-        <div class="w-full h-full rounded-full overflow-hidden flex items-center justify-center">
-          <img v-show="userInfo?.avatar && !avatarFailed" :src="userInfo?.avatar" class="w-full h-full object-cover" @error="avatarFailed = true" />
-          <span v-if="!userInfo?.avatar || avatarFailed" class="text-3xl font-bold">{{ userInfo?.realName?.[0] || userInfo?.username?.[0] || '?' }}</span>
-        </div>
-        <div v-if="isVip" class="vip-badge absolute -right-3 -top-1.5 z-10 whitespace-nowrap">VIP</div>
-      </div>
-      <p class="text-xl font-bold">{{ userInfo?.realName || userInfo?.username || '--' }}</p>
-      <p class="text-sm text-white/80 mt-1">{{ userInfo?.schoolName || '--' }}</p>
+    <!-- ======== 顶部：品牌渐变背景 + 个人信息（左对齐）+ 会员卡 ======== -->
+    <div class="relative overflow-hidden hero-clip bg-brand-gradient px-5 pb-20 text-white flex-shrink-0" style="padding-top: calc(var(--safe-top) + 28px)">
+      <!-- 装饰：柔光圆 + 细网格纹理 -->
+      <div class="pointer-events-none absolute -right-16 -top-20 w-64 h-64 rounded-full bg-white/10" />
+      <div class="pointer-events-none absolute right-10 top-24 w-28 h-28 rounded-full bg-white/10" />
+      <div class="pointer-events-none absolute inset-0 profile-hero-grid" />
 
-      <!-- VIP 状态行：到期时间 + 开通/续费按钮 -->
-      <div class="mt-3 flex items-center justify-center gap-2">
-        <span
-          v-if="isVip"
-          class="text-xs bg-white/20 rounded-full px-3 py-1.5 text-white/95"
-        >
-          {{ vipExpireShort ? `VIP 至 ${vipExpireShort}` : 'VIP 会员' }}
-        </span>
-        <span v-else class="text-xs bg-white/20 rounded-full px-3 py-1.5 text-white/95">未开通 VIP</span>
-        <button
-          data-guide="profile-vip-btn"
-          class="vip-btn text-xs font-semibold px-3.5 py-1.5 rounded-full text-amber-900 shadow"
-          @click="openRedeemModal('vip')"
-        >
-          续费 VIP
-        </button>
+      <!-- 头像 + 姓名 + 学校 -->
+      <div class="relative flex items-center gap-4 rise-in">
+        <div class="relative flex-shrink-0">
+          <div class="w-[68px] h-[68px] rounded-full overflow-hidden ring-[3px] ring-white/60 shadow-lg shadow-black/15 bg-white/20 flex items-center justify-center">
+            <img v-show="userInfo?.avatar && !avatarFailed" :src="userInfo?.avatar" class="w-full h-full object-cover" alt="头像" @error="avatarFailed = true" />
+            <span v-if="!userInfo?.avatar || avatarFailed" class="text-2xl font-bold">{{ userInfo?.realName?.[0] || userInfo?.username?.[0] || '?' }}</span>
+          </div>
+          <div v-if="isVip" class="vip-badge absolute -right-2 -bottom-1 z-10 whitespace-nowrap">VIP</div>
+        </div>
+        <div class="min-w-0 flex-1">
+          <p class="text-[22px] font-bold tracking-tight leading-tight truncate">{{ userInfo?.realName || userInfo?.username || '--' }}</p>
+          <p class="mt-1 flex items-center gap-1 text-sm text-white/90 truncate">
+            <GraduationCap class="w-3.5 h-3.5 flex-shrink-0" />
+            <span class="truncate">{{ userInfo?.schoolName || '--' }}</span>
+          </p>
+          <div v-if="profileTags.length" class="mt-2 flex flex-wrap gap-1.5">
+            <span v-for="t in profileTags" :key="t" class="max-w-[10rem] truncate text-xs rounded-md bg-white/15 ring-1 ring-white/20 px-1.5 py-0.5 text-white/95">{{ t }}</span>
+          </div>
+        </div>
       </div>
     </div>
 
-    <!-- 详情列表 -->
-    <div class="px-4 -mt-8 flex-1 flex flex-col space-y-3 pb-4">
-      <div class="bg-white rounded-xl border border-gray-100 divide-y divide-gray-50 shadow-sm">
-        <!-- 可签到次数 + 兑换按钮 -->
-        <div class="flex items-center justify-between px-4 py-3.5">
-          <div class="flex items-center gap-3">
-            <div class="w-8 h-8 rounded-full bg-green-50 flex items-center justify-center">
-              <ClipboardCheck class="w-4 h-4 text-green-500" />
-            </div>
-            <div>
-              <p class="text-xs text-gray-400">{{ isVip ? 'VIP 执行次数' : '可执行次数' }}</p>
-              <p class="text-sm font-medium text-gray-900">{{ isVip ? '无限次' : `${fmtCount(userInfo?.signCount ?? 0)} 次` }}</p>
-            </div>
+    <!-- ======== 会员卡（压在头图下沿） ======== -->
+    <div class="relative px-4 -mt-14 rise-in" style="animation-delay: 40ms">
+      <div class="member-card relative overflow-hidden hero-clip rounded-3xl p-4 shadow-xl" :class="isVip ? 'is-vip' : 'is-free'">
+        <div class="pointer-events-none absolute -right-8 -top-10 w-36 h-36 rounded-full member-card-glow" />
+        <div class="relative flex items-center gap-3">
+          <div class="member-icon w-11 h-11 rounded-2xl flex items-center justify-center flex-shrink-0">
+            <Crown class="w-5 h-5" :stroke-width="2.4" />
+          </div>
+          <div class="min-w-0 flex-1">
+            <p class="member-title text-base font-bold tracking-tight">{{ isVip ? 'VIP 会员' : '普通用户' }}</p>
+            <p class="member-sub text-xs mt-0.5 truncate">
+              <template v-if="isVip">{{ vipExpireShort ? `有效期至 ${vipExpireShort}` : '会员生效中' }}<template v-if="vipDaysLeft !== null"> · 剩 {{ vipDaysLeft }} 天</template></template>
+              <template v-else>开通后执行任务不限次数</template>
+            </p>
           </div>
           <button
-            class="flex items-center gap-1 px-3 py-1.5 rounded-full bg-gradient-to-r from-amber-400 to-orange-500 text-white text-xs font-medium shadow-sm hover:brightness-105 transition-all"
-            @click="openRedeemModal('count')"
+            data-guide="profile-vip-btn"
+            class="vip-btn press flex-shrink-0 text-sm font-semibold px-4 py-2 rounded-full shadow-md"
+            @click="openRedeemModal('vip')"
           >
-            <Gift class="w-3 h-3" />
-            兑换
+            {{ isVip ? '续费' : '开通 VIP' }}
           </button>
         </div>
-        <!-- 推广信息（邀请链接 + 邀请信息合并） -->
-        <div data-guide="profile-invite-row" class="px-4 py-3.5">
-          <div class="flex items-start justify-between gap-3">
-            <!-- 左：邀请码 + 复制 -->
-            <div class="flex items-start gap-3 flex-1 min-w-0">
-              <div class="w-8 h-8 rounded-full bg-purple-50 flex items-center justify-center flex-shrink-0 mt-0.5">
-                <Share2 class="w-4 h-4 text-purple-500" />
-              </div>
-              <div class="flex-1 min-w-0">
-                <p class="text-xs text-gray-400">推广信息</p>
-                <div v-if="inviteCode" class="mt-1 flex items-center gap-1.5">
-                  <code class="font-mono text-sm text-purple-600 bg-purple-50 px-2 py-1 rounded font-bold tracking-wider">{{ inviteCode }}</code>
-                  <button
-                    data-guide="profile-invite-copy"
-                    class="flex-shrink-0 flex items-center gap-1 px-2 py-1 rounded bg-purple-100 text-purple-600 text-xs font-medium hover:bg-purple-200 transition-colors"
-                    @click="copyInviteCode"
-                  >
-                    复制
-                  </button>
-                </div>
-                <div v-else class="mt-1">
-                  <button
-                    data-guide="profile-invite-generate"
-                    class="inline-flex items-center gap-1 px-2.5 py-1 rounded bg-purple-500 text-white text-xs font-medium hover:bg-purple-600 transition-colors"
-                    :disabled="generatingInvite"
-                    @click="handleGenerateInvite"
-                  >
-                    <RefreshCw v-if="generatingInvite" class="w-3 h-3 animate-spin" />
-                    <template v-else>生成邀请码</template>
-                  </button>
-                </div>
-                <p class="text-[10px] text-gray-400 mt-1 leading-relaxed">
-                  邀请好友即可获得
-                  <span class="text-amber-500 font-medium">{{ inviterRewardPerInvite !== null ? fmtReward(inviterRewardPerInvite) : '一定' }}</span>
-                  积分
-                </p>
-              </div>
-            </div>
-            <!-- 右：奖励积分 + 兑换 -->
-            <div class="flex flex-col items-end gap-1.5 flex-shrink-0">
-              <p class="text-xs text-gray-500">
-                奖励 <span class="text-amber-600 font-bold">{{ fmtReward(inviteReward) }}</span>/1
-              </p>
-              <button
-                v-if="inviteCode"
-                data-guide="profile-invite-redeem"
-                class="flex items-center gap-1 px-3 py-1.5 rounded-full text-xs font-medium transition-colors"
-                :class="canRedeem ? 'bg-amber-400 text-white hover:brightness-105 shadow-sm' : 'bg-gray-200 text-gray-400 cursor-not-allowed'"
-                :disabled="!canRedeem || redeemingInvite"
-                @click="handleRedeemInvite"
-              >
-                <RefreshCw v-if="redeemingInvite" class="w-3 h-3 animate-spin" />
-                <template v-else>兑换</template>
-              </button>
-            </div>
-          </div>
-          <!-- 无邀请人：可填写他人邀请码 -->
-          <button
-            v-if="!hasInviter"
-            data-guide="profile-fill-invite"
-            class="mt-2.5 w-full flex items-center justify-center gap-1 rounded-lg border border-dashed border-purple-200 py-2 text-xs text-purple-500 hover:bg-purple-50 transition-colors"
-            @click="openFillInviteModal"
-          >
-            填写邀请码
-          </button>
+      </div>
+    </div>
+
+    <div class="relative px-4 pt-3 flex-1 flex flex-col space-y-3 pb-4">
+      <!-- ======== 购买 CDK（显眼入口：后台系统设置控制显隐与链接） ========
+           用真实 <a target=_blank> 而非 window.open：手机浏览器会把程序化 window.open
+           当弹窗强制当前页打开，原生链接才能稳定新 tab（微信 WebView 等无 tab 环境除外） -->
+      <a
+        v-if="cdkBuyVisible"
+        :href="cdkBuyUrl"
+        target="_blank"
+        rel="noopener noreferrer"
+        class="cdk-buy-btn press relative w-full overflow-hidden rounded-2xl p-4 flex items-center gap-3 rise-in"
+        style="animation-delay: 80ms"
+      >
+        <div class="relative z-10 w-11 h-11 rounded-2xl bg-white/20 ring-1 ring-white/30 flex items-center justify-center flex-shrink-0">
+          <ShoppingCart class="w-5 h-5 text-white" :stroke-width="2.4" />
         </div>
-        <!-- 工单系统 -->
-        <div
-          class="flex items-center justify-between px-4 py-3.5 cursor-pointer active:bg-gray-50"
-          @click="router.push('/ticket')"
+        <div class="relative z-10 min-w-0 flex-1">
+          <p class="text-[15px] font-bold text-white leading-tight tracking-tight">购买 CDK 兑换码</p>
+          <p class="text-xs text-white/85 mt-1">次数卡 · VIP 卡 · 即买即兑</p>
+        </div>
+        <span class="cdk-buy-hot relative z-10 flex-shrink-0 flex items-center gap-0.5 px-2 py-1 rounded-full text-[10px] font-extrabold tracking-wide">
+          <Flame class="w-3 h-3" :stroke-width="2.5" />HOT
+        </span>
+        <span class="relative z-10 flex-shrink-0 w-8 h-8 rounded-full bg-white/20 flex items-center justify-center">
+          <ChevronRight class="w-[18px] h-[18px] text-white" :stroke-width="2.5" />
+        </span>
+      </a>
+
+      <!-- ======== 数据三宫格：可执行次数 / 邀请积分 / 已邀请 ======== -->
+      <div class="grid grid-cols-3 gap-2.5 rise-in" style="animation-delay: 120ms">
+        <button class="press stat-cell bg-white rounded-2xl border border-gray-100/80 shadow-sm py-3 text-center" @click="openRedeemModal('count')">
+          <p class="text-xl font-bold tabular-nums text-gray-900 leading-tight">{{ isVip ? '∞' : fmtCount(userInfo?.signCount ?? 0) }}</p>
+          <p class="text-xs text-gray-500 mt-0.5">{{ isVip ? '不限次数' : '可执行次数' }}</p>
+          <p class="mt-1.5 inline-flex items-center gap-0.5 text-xs font-semibold text-brand-600"><Gift class="w-3 h-3" />兑换</p>
+        </button>
+        <button
+          data-guide="profile-invite-redeem"
+          class="press stat-cell bg-white rounded-2xl border border-gray-100/80 shadow-sm py-3 text-center disabled:active:scale-100"
+          :disabled="redeemingInvite"
+          @click="onRedeemInviteTap"
         >
-          <div class="flex items-center gap-3">
-            <div class="w-8 h-8 rounded-full bg-rose-50 flex items-center justify-center relative">
-              <MessageSquare class="w-4 h-4 text-rose-500" />
-              <span
-                v-if="ticketUnreadCount > 0"
-                class="absolute -top-1 -right-1 min-w-[16px] h-4 px-1 rounded-full bg-red-500 text-white text-[9px] font-bold flex items-center justify-center leading-none"
-              >{{ ticketUnreadCount > 99 ? '99+' : ticketUnreadCount }}</span>
-            </div>
-            <div>
-              <p class="text-xs text-gray-400">工单系统</p>
-              <p class="text-sm font-medium text-gray-900">咨询与反馈</p>
-            </div>
-          </div>
-          <svg class="w-4 h-4 text-gray-300" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
-            <path stroke-linecap="round" stroke-linejoin="round" d="M9 5l7 7-7 7" />
-          </svg>
+          <p class="text-xl font-bold tabular-nums text-gray-900 leading-tight">{{ fmtReward(inviteReward) }}</p>
+          <p class="text-xs text-gray-500 mt-0.5">邀请积分</p>
+          <p class="mt-1.5 inline-flex items-center gap-0.5 text-xs font-semibold" :class="canRedeem ? 'text-amber-600' : 'text-gray-400'">
+            <RefreshCw v-if="redeemingInvite" class="w-3 h-3 animate-spin" />
+            <template v-else><Coins class="w-3 h-3" />{{ canRedeem ? '换次数' : '满 1 可换' }}</template>
+          </p>
+        </button>
+        <div class="stat-cell bg-white rounded-2xl border border-gray-100/80 shadow-sm py-3 text-center">
+          <p class="text-xl font-bold tabular-nums text-gray-900 leading-tight">{{ invitedCount }}</p>
+          <p class="text-xs text-gray-500 mt-0.5">已邀请</p>
+          <p class="mt-1.5 inline-flex items-center gap-0.5 text-xs font-medium text-gray-400"><Users class="w-3 h-3" />位同学</p>
         </div>
-        <!-- 真实姓名/学号已取消展示：避免在页面明文暴露敏感信息 -->
+      </div>
+
+      <!-- ======== 邀请好友卡 ======== -->
+      <div data-guide="profile-invite-row" class="invite-card relative overflow-hidden hero-clip rounded-3xl p-4 rise-in" style="animation-delay: 160ms">
+        <div class="pointer-events-none absolute -right-6 -bottom-10 w-32 h-32 rounded-full invite-glow" />
+        <div class="relative flex items-start justify-between gap-3">
+          <div class="min-w-0">
+            <p class="text-sm font-bold text-gray-900 flex items-center gap-1.5"><UserPlus class="w-4 h-4 text-purple-600" />邀请同学 一起省心</p>
+            <p class="text-xs text-gray-500 mt-1 leading-relaxed">
+              每邀请 1 人得
+              <span class="font-semibold text-purple-600">{{ inviterRewardPerInvite !== null ? fmtReward(inviterRewardPerInvite) : '一定' }}</span>
+              积分<template v-if="inviteeRewardPerInvite !== null">，TA 得 <span class="font-semibold text-purple-600">{{ fmtReward(inviteeRewardPerInvite) }}</span> 积分</template>
+            </p>
+          </div>
+        </div>
+        <!-- 邀请码 + 复制 -->
+        <div class="relative mt-3">
+          <div v-if="inviteCode" class="flex items-center gap-2 rounded-2xl bg-white/80 dark:bg-gray-100/80 ring-1 ring-purple-200 pl-4 pr-1.5 py-1.5">
+            <span class="text-xs text-gray-400 flex-shrink-0">我的邀请码</span>
+            <code class="flex-1 min-w-0 font-mono text-lg font-bold tracking-[0.18em] text-purple-600 truncate">{{ inviteCode }}</code>
+            <button
+              data-guide="profile-invite-copy"
+              class="press flex-shrink-0 flex items-center gap-1 h-9 px-3.5 rounded-xl invite-btn text-white text-sm font-semibold shadow-sm shadow-purple-500/30"
+              @click="copyInviteCode"
+            >
+              <Copy class="w-3.5 h-3.5" />复制
+            </button>
+          </div>
+          <div v-else class="flex items-center gap-2 rounded-2xl bg-white/80 dark:bg-gray-100/80 ring-1 ring-purple-200 px-4 h-12">
+            <span class="text-xs text-gray-400 flex-shrink-0">我的邀请码</span>
+            <span class="flex-1 h-4 rounded bg-purple-100 animate-pulse" aria-label="邀请码加载中" />
+          </div>
+        </div>
+        <!-- 无邀请人：可填写他人邀请码 -->
+        <button
+          v-if="!hasInviter"
+          data-guide="profile-fill-invite"
+          class="press relative mt-2.5 w-full flex items-center justify-center gap-1 h-9 rounded-xl border border-dashed border-purple-300 text-xs font-medium text-purple-600 hover:bg-white/50"
+          @click="openFillInviteModal"
+        >
+          有同学的邀请码？点此填写
+        </button>
+      </div>
+
+      <!-- ======== 功能菜单（iOS 分组列表） ======== -->
+      <div class="bg-white rounded-2xl border border-gray-100/80 shadow-sm overflow-hidden rise-in" style="animation-delay: 200ms">
         <!-- 设备码 -->
-        <div data-guide="profile-device-code" class="flex items-center justify-between px-4 py-3.5">
-          <div class="flex items-center gap-3">
-            <div class="w-8 h-8 rounded-full bg-indigo-50 flex items-center justify-center">
-              <svg class="w-4 h-4 text-indigo-500" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
-                <path stroke-linecap="round" stroke-linejoin="round" d="M12 11c0 1.657-1.343 3-3 3s-3-1.343-3-3m6 0c0-1.657-1.343-3-3-3s-3 1.343-3 3m6 0h6M5 11H3m9 0h6" />
-              </svg>
-            </div>
-            <div>
-              <p class="text-xs text-gray-400">设备码</p>
-              <p class="text-sm font-medium text-gray-900 font-mono">
-                {{ userInfo?.mobileCode ? maskDeviceCode(userInfo.mobileCode) : '未绑定' }}
-              </p>
-            </div>
+        <div data-guide="profile-device-code" class="flex items-center gap-3 px-4 py-3.5">
+          <div class="w-9 h-9 rounded-xl bg-sky-50 flex items-center justify-center flex-shrink-0">
+            <Smartphone class="w-[18px] h-[18px] text-sky-500" />
           </div>
-          <div class="flex items-center gap-2">
-            <button
-              class="text-xs text-amber-600 flex items-center gap-1 hover:text-amber-700"
-              @click="openRandomBind"
-            >
-              <Dices class="w-3 h-3" />
-              随机
+          <div class="flex-1 min-w-0">
+            <p class="text-sm font-medium text-gray-900 flex items-center gap-1.5">
+              设备码
+              <span
+                class="text-xs px-1.5 py-px rounded-md font-medium"
+                :class="!hasDeviceCode ? 'bg-red-50 text-red-600' : userInfo?.mobileType === 'manual' ? 'bg-amber-100 text-amber-700' : 'bg-green-50 text-green-600'"
+              >{{ !hasDeviceCode ? '未绑定' : userInfo?.mobileType === 'manual' ? '随机' : '已授权' }}</span>
+            </p>
+            <p class="text-xs text-gray-400 font-mono mt-0.5 truncate">{{ hasDeviceCode ? maskDeviceCode(userInfo!.mobileCode) : '绑定后才能执行签到' }}</p>
+          </div>
+          <div class="flex items-center gap-1.5 flex-shrink-0">
+            <button class="press h-8 px-2.5 rounded-full text-xs font-medium text-gray-500 bg-gray-100 flex items-center gap-1" @click="openRandomBind">
+              <Dices class="w-3.5 h-3.5" />随机
             </button>
-            <button
-              class="text-xs text-blue-500 flex items-center gap-1 hover:text-blue-600"
-              @click="goRebind"
-            >
-              <RefreshCw class="w-3 h-3" />
-              {{ hasDeviceCode ? '重新绑定' : '立即绑定' }}
+            <button class="press h-8 px-3 rounded-full text-xs font-semibold text-white bg-brand-gradient shadow-sm shadow-brand-500/20 flex items-center gap-1" @click="goRebind">
+              <RefreshCw class="w-3.5 h-3.5" />{{ hasDeviceCode ? '重绑' : '去绑定' }}
             </button>
           </div>
         </div>
+        <div class="ml-16 border-t border-gray-100" />
+        <!-- 工单 -->
+        <button class="press w-full flex items-center gap-3 px-4 py-3.5 text-left active:bg-gray-50" @click="router.push('/ticket')">
+          <div class="relative w-9 h-9 rounded-xl bg-rose-50 flex items-center justify-center flex-shrink-0">
+            <Headset class="w-[18px] h-[18px] text-rose-500" />
+            <span
+              v-if="ticketUnreadCount > 0"
+              class="absolute -top-1 -right-1 min-w-[18px] h-[18px] px-1 rounded-full bg-red-500 text-white text-xs font-bold flex items-center justify-center leading-none ring-2 ring-white dark:ring-gray-50"
+            >{{ ticketUnreadCount > 99 ? '99+' : ticketUnreadCount }}</span>
+          </div>
+          <div class="flex-1 min-w-0">
+            <p class="text-sm font-medium text-gray-900">咨询与反馈</p>
+            <p class="text-xs text-gray-400 mt-0.5">{{ ticketUnreadCount > 0 ? `${ticketUnreadCount} 条新回复` : '遇到问题提交工单，客服及时回复' }}</p>
+          </div>
+          <ChevronRight class="w-4 h-4 text-gray-300 flex-shrink-0" />
+        </button>
+      </div>
+
+      <!-- 外观（主题三档切换）：标题一行 + 整宽分段控件一行，窄屏也不挤压换行 -->
+      <div class="bg-white rounded-2xl border border-gray-100/80 shadow-sm px-4 pt-3.5 pb-4 rise-in" style="animation-delay: 240ms">
+        <div class="flex items-center gap-3">
+          <div class="w-9 h-9 rounded-xl bg-brand-50 flex items-center justify-center flex-shrink-0">
+            <SunMoon class="w-[18px] h-[18px] text-brand-500" />
+          </div>
+          <div class="min-w-0">
+            <p class="text-sm font-medium text-gray-900">外观</p>
+            <p class="text-xs text-gray-400">{{ themeHint }}</p>
+          </div>
+        </div>
+        <!-- 分段控件：滑动高亮块指示当前项 -->
+        <div class="relative mt-3 grid grid-cols-3 p-1 rounded-xl bg-gray-100" role="radiogroup" aria-label="外观">
+          <div
+            class="absolute top-1 bottom-1 left-1 rounded-lg bg-white shadow-sm ring-1 ring-black/5 transition-transform duration-300 ease-[var(--ease-spring)] dark:bg-gray-300 dark:ring-white/5"
+            :style="{ width: 'calc((100% - 8px) / 3)', transform: `translateX(${themeIndex * 100}%)` }"
+          />
+          <button
+            v-for="opt in themeOptions"
+            :key="opt.value"
+            role="radio"
+            :aria-checked="themeMode === opt.value"
+            class="relative z-10 flex items-center justify-center gap-1.5 h-9 rounded-lg text-sm whitespace-nowrap transition-colors duration-200"
+            :class="themeMode === opt.value ? 'font-semibold text-brand-600 dark:text-brand-700' : 'font-medium text-gray-500'"
+            @click="setThemeMode(opt.value)"
+          >
+            <component :is="opt.icon" class="w-4 h-4" />
+            {{ opt.label }}
+          </button>
+        </div>
       </div>
 
       <!-- 退出登录（底部，导航栏上方） -->
       <div class="flex-1" />
       <Button
         variant="outline"
-        class="w-full h-11 border-red-200 text-red-500 hover:bg-red-50 text-sm"
+        class="w-full h-12 border-red-200 bg-white text-red-500 hover:bg-red-50 text-sm"
         @click="handleLogout"
       >
         <LogOut class="w-4 h-4" />
         退出登录
       </Button>
 
-      <p class="text-center text-xs text-gray-300 pb-2">copyright © 2026</p>
+      <p class="text-center text-xs text-gray-400 pb-2">copyright © 2026</p>
     </div>
 
     <!-- 兑换弹窗遮罩 -->
@@ -611,7 +690,7 @@ async function handleRedeemInvite() {
             />
             <div
               v-else-if="captchaError"
-              class="h-10 w-[120px] rounded-lg border border-red-200 bg-red-50 flex items-center justify-center text-[10px] leading-tight text-red-400 text-center px-1 cursor-pointer"
+              class="h-10 w-[120px] rounded-lg border border-red-200 bg-red-50 flex items-center justify-center text-xs leading-tight text-red-400 text-center px-1 cursor-pointer"
               title="点击重试"
               @click="refreshCaptcha"
             >
@@ -663,7 +742,7 @@ async function handleRedeemInvite() {
             @input="fillInviteError = ''"
           />
           <p v-if="fillInviteError" class="text-xs text-red-500 mt-1">{{ fillInviteError }}</p>
-          <p class="text-[10px] text-gray-400 mt-1">填写后你与好友都将获得奖励积分（每个账号仅可填写一次）</p>
+          <p class="text-xs text-gray-400 mt-1">填写后你与好友都将获得奖励积分（每个账号仅可填写一次）</p>
         </div>
         <Button class="w-full h-10 text-sm font-medium" :disabled="bindingInvite" @click="submitFillInvite">
           {{ bindingInvite ? '提交中...' : '提交' }}
@@ -781,10 +860,96 @@ async function handleRedeemInvite() {
   }
 }
 
+/* 头图细网格纹理（极淡，增加质感） */
+.profile-hero-grid {
+  background-image:
+    linear-gradient(rgb(255 255 255 / 0.06) 1px, transparent 1px),
+    linear-gradient(90deg, rgb(255 255 255 / 0.06) 1px, transparent 1px);
+  background-size: 22px 22px;
+  -webkit-mask-image: linear-gradient(180deg, #000 0%, transparent 85%);
+  mask-image: linear-gradient(180deg, #000 0%, transparent 85%);
+}
+
+/* 会员卡：VIP 为黑金，普通用户为珍珠白（固定色，亮暗下质感一致） */
+.member-card.is-vip {
+  background: linear-gradient(135deg, #2b2418 0%, #1b1710 60%, #2d2516 100%);
+  border: 1px solid rgb(246 196 69 / 0.35);
+}
+.member-card.is-vip .member-title { color: #ffe39a; }
+.member-card.is-vip .member-sub { color: rgb(255 227 154 / 0.75); }
+.member-card.is-vip .member-icon {
+  color: #5b3a00;
+  background: linear-gradient(135deg, #ffe9a8, #f6c445 55%, #e8a020);
+}
+.member-card.is-vip .member-card-glow { background: radial-gradient(circle, rgb(246 196 69 / 0.35), transparent 70%); }
+.member-card.is-free {
+  background: linear-gradient(135deg, #ffffff 0%, #f7fbf9 100%);
+  border: 1px solid rgb(14 40 34 / 0.06);
+}
+.member-card.is-free .member-title { color: #17221f; }
+.member-card.is-free .member-sub { color: #66756f; }
+.member-card.is-free .member-icon {
+  color: #8a5a00;
+  background: linear-gradient(135deg, #fff1c7, #ffe08a);
+}
+.member-card.is-free .member-card-glow { background: radial-gradient(circle, rgb(245 189 46 / 0.22), transparent 70%); }
+
+/* 邀请卡主按钮：固定紫（白字 6:1）。不用 bg-purple-600：暗色色板把它映射为浅紫作文字色，白字会看不清 */
+.invite-btn {
+  background: linear-gradient(135deg, #7a5bdb, #6a4bcb);
+}
+
+/* 购买 CDK 入口：日落珊瑚渐变 + 周期性微光扫过（固定色，亮暗主题一致）
+   与品牌薄荷青 / VIP 金 / 邀请紫均不同色系，保证在页面中的辨识度 */
+.cdk-buy-btn {
+  color: #fff;
+  background: linear-gradient(135deg, #ff9a3d 0%, #ff5d5d 55%, #f43f5e 100%);
+  box-shadow: 0 8px 20px -6px rgb(244 63 94 / 0.45);
+}
+.cdk-buy-btn::after {
+  content: '';
+  position: absolute;
+  top: -60%;
+  left: -45%;
+  width: 30%;
+  height: 220%;
+  background: linear-gradient(
+    100deg,
+    transparent 0%,
+    rgb(255 255 255 / 0.55) 50%,
+    transparent 100%
+  );
+  transform: rotate(18deg);
+  animation: vip-shine 3s ease-in-out infinite;
+  pointer-events: none;
+}
+
+/* HOT 角标：白底珊瑚红字（固定色，在渐变底上高对比） */
+.cdk-buy-hot {
+  color: #e11d48;
+  background: #fff;
+  box-shadow: 0 2px 6px rgb(120 20 40 / 0.25);
+}
+
+/* 邀请卡：薰衣草渐变 */
+.invite-card {
+  background: linear-gradient(135deg, #f5f2ff 0%, #ede7ff 60%, #f3eefe 100%);
+  border: 1px solid rgb(139 108 230 / 0.18);
+}
+.invite-glow { background: radial-gradient(circle, rgb(139 108 230 / 0.25), transparent 70%); }
+
+/* 兑换按钮：柠檬金底 + 深棕字（固定色，亮暗主题下对比度一致 ≥ 7:1） */
+.redeem-btn {
+  color: #5b3a00;
+  background: linear-gradient(135deg, #ffe08a 0%, #f5bd2e 100%);
+}
+
 /* VIP 开通/续费按钮：金色渐变 + 周期性微光扫过 */
 .vip-btn {
   position: relative;
   overflow: hidden;
+  /* 金底固定不随主题变化，文字同样固定深棕（不用 text-amber-900：暗色下它被映射为浅色） */
+  color: #5b3a00;
   background: linear-gradient(135deg, #ffe9a8 0%, #f6c445 45%, #e8a020 100%);
 }
 .vip-btn::after {
@@ -805,3 +970,19 @@ async function handleRedeemInvite() {
   pointer-events: none;
 }
 </style>
+
+<style>
+/* 暗色覆盖：非 scoped（scoped 中 :global(.dark) .x 会编译成仅 .dark 而失效）；html.dark 提高优先级压过 .x[data-v] */
+html.dark .member-card.is-free {
+  background: linear-gradient(135deg, #1e2c28 0%, #18221f 100%);
+  border-color: rgb(255 255 255 / 0.06);
+}
+html.dark .member-card.is-free .member-title { color: #eaf2ef; }
+html.dark .member-card.is-free .member-sub { color: #98aba4; }
+html.dark .member-card.is-vip { border-color: rgb(246 196 69 / 0.28); }
+html.dark .invite-card {
+  background: linear-gradient(135deg, #262040 0%, #211b38 100%);
+  border-color: rgb(185 165 255 / 0.16);
+}
+html.dark .invite-glow { background: radial-gradient(circle, rgb(185 165 255 / 0.18), transparent 70%); }
+</style>

frondend/src/views/ticket/TicketDetail.vue

@@ -64,9 +64,9 @@ async function handleReply() {
 </script>
 
 <template>
-  <div class="flex flex-col min-h-full bg-gray-50">
+  <div class="flex flex-col min-h-full">
     <!-- 顶部导航 -->
-    <div class="sticky top-0 z-10 bg-white border-b border-gray-100">
+    <div class="sticky top-0 z-10 glass-bar border-b border-gray-200/60" style="padding-top: var(--safe-top)">
       <div class="flex items-center px-4 h-12">
         <button class="w-8 h-8 flex items-center justify-center -ml-1 text-gray-600" @click="router.back()">
           <ArrowLeft class="w-5 h-5" />
@@ -90,7 +90,7 @@ async function handleReply() {
         <div class="text-center">
           <span
             class="inline-flex items-center px-2.5 py-1 rounded-full text-xs font-medium"
-            :class="ticketApi.TICKET_STATUS_COLOR[ticket.status] || 'bg-gray-100 text-gray-600'"
+            :class="ticketApi.TICKET_STATUS_COLOR[ticket.status] || 'adm-badge-gray'"
           >
             {{ ticketApi.TICKET_STATUS_MAP[ticket.status] || ticket.status }}
           </span>

frondend/src/views/ticket/TicketList.vue

@@ -111,9 +111,9 @@ async function handleDelete(t: TicketListItem, e: Event) {
 </script>
 
 <template>
-  <div class="flex flex-col min-h-full bg-gray-50">
+  <div class="flex flex-col min-h-full">
     <!-- 顶部导航 -->
-    <div class="sticky top-0 z-10 bg-white border-b border-gray-100">
+    <div class="sticky top-0 z-10 glass-bar border-b border-gray-200/60" style="padding-top: var(--safe-top)">
       <div class="flex items-center px-4 h-12">
         <button class="w-8 h-8 flex items-center justify-center -ml-1 text-gray-600" @click="router.back()">
           <ArrowLeft class="w-5 h-5" />
@@ -124,12 +124,12 @@ async function handleDelete(t: TicketListItem, e: Event) {
 
     <!-- 新建按钮 -->
     <div class="px-4 py-3">
-      <Button class="w-full h-10 text-sm font-medium" @click="openCreate">
+      <Button class="w-full h-12 text-[15px] bg-brand-gradient" @click="openCreate">
         <Plus class="w-4 h-4 mr-1" />
         新建工单
       </Button>
       <!-- 提示 -->
-      <p class="text-center text-[10px] text-gray-400 mt-2">您最多可同时拥有 2 个未关闭的工单</p>
+      <p class="text-center text-xs text-gray-400 mt-2">您最多可同时拥有 2 个未关闭的工单</p>
     </div>
 
     <!-- 工单列表 -->
@@ -143,14 +143,14 @@ async function handleDelete(t: TicketListItem, e: Event) {
         <div
           v-for="t in tickets"
           :key="t.id"
-          class="bg-white rounded-xl border border-gray-100 px-4 py-3.5 active:bg-gray-50 transition-colors cursor-pointer"
+          class="press bg-white rounded-2xl border border-gray-100/80 shadow-sm px-4 py-3.5 active:bg-gray-50 cursor-pointer"
           @click="goDetail(t.id)"
         >
           <div class="flex items-center justify-between mb-1">
             <h3 class="text-sm font-medium text-gray-900 truncate flex-1">{{ t.title }}</h3>
             <span
               class="ml-2 inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium flex-shrink-0"
-              :class="ticketApi.TICKET_STATUS_COLOR[t.status] || 'bg-gray-100 text-gray-600'"
+              :class="ticketApi.TICKET_STATUS_COLOR[t.status] || 'adm-badge-gray'"
             >
               {{ ticketApi.TICKET_STATUS_MAP[t.status] || t.status }}
             </span>