feat: 设置页新增登录管理 TAB

- Session 结构体新增 IP、UserAgent、Remark 字段，登录/注册时记录设备信息
- Store 接口新增 ListByUID、DeleteByUIDExclude 方法，MemoryStore 完整实现
- SessionManager 新增 ListByUID、DestroyOtherByUID、UpdateRemark 方法
- 新增 UA 轻量解析器（session/ua.go），提取浏览器/OS/设备类型
- 新增 settings_api_sessions.go，提供列表/踢出/一键踢出/备注 4 个 API
- 控制器层声明 sessionManager 最小接口（ISP），SettingsController 注入依赖
- Auth 中间件注入 sid 到 gin context，支持识别当前会话
- 设置页左侧导航增加登录管理入口，tab 白名单新增 sessions
- 前端实现设备列表展示（浏览器/OS/设备图标/IP/时间）、当前设备标识、备注输入、踢出按钮、一键踢出
- settings.css 新增会话管理全套样式及响应式适配

internal/controller/auth_api_login.go

@@ -81,7 +81,7 @@ func (ac *AuthController) Login(c *gin.Context) {
 	ac.rateLimiter.Clear(email, ip)
 
 	// 创建服务端 session
-	sid, err := ac.sessionManager.Create(user, req.RememberMe)
+	sid, err := ac.sessionManager.Create(user, req.RememberMe, ip, c.GetHeader("User-Agent"))
 	if err != nil {
 		common.Error(c, http.StatusInternalServerError, "登录失败，请稍后重试")
 		return
@@ -111,7 +111,7 @@ func (ac *AuthController) ConfirmRestore(c *gin.Context) {
 		return
 	}
 
-	sid, err := ac.sessionManager.Create(user, req.RememberMe)
+	sid, err := ac.sessionManager.Create(user, req.RememberMe, clientIP(c), c.GetHeader("User-Agent"))
 	if err != nil {
 		common.Error(c, http.StatusInternalServerError, "操作失败，请稍后重试")
 		return

internal/controller/auth_api_register.go

@@ -61,7 +61,7 @@ func (ac *AuthController) Register(c *gin.Context) {
 		return
 	}
 
-	sid, err := ac.sessionManager.Create(user, req.RememberMe)
+	sid, err := ac.sessionManager.Create(user, req.RememberMe, clientIP(c), c.GetHeader("User-Agent"))
 	if err != nil {
 		common.Error(c, http.StatusInternalServerError, "注册失败，请稍后重试")
 		return

internal/controller/interfaces.go

@@ -4,6 +4,7 @@ import (
 	"metazone.cc/metalab/internal/middleware"
 	"metazone.cc/metalab/internal/model"
 	"metazone.cc/metalab/internal/service"
+	"metazone.cc/metalab/internal/session"
 )
 
 // authUseCase AuthController 对 AuthService 的最小依赖（ISP：5 个方法）
@@ -51,3 +52,11 @@ type spaceUseCase interface {
 	GetSpaceUser(uid uint) (*model.User, error)
 	GetPostsByUser(uid uint, page, pageSize int) ([]model.Post, int64, error)
 }
+
+// sessionManager 登录管理对会话管理的最小依赖（ISP：4 个方法）
+type sessionManager interface {
+	ListByUID(uid uint) ([]*session.Session, error)
+	Destroy(sid string) error
+	DestroyOtherByUID(uid uint, currentSID string) error
+	UpdateRemark(sid string, uid uint, remark string) error
+}

internal/controller/settings_api_sessions.go

@@ -0,0 +1,161 @@
+package controller
+
+import (
+	"net/http"
+
+	"metazone.cc/metalab/internal/common"
+
+	"github.com/gin-gonic/gin"
+)
+
+// ListSessions 列出当前用户的所有活跃会话
+func (sc *SettingsController) ListSessions(c *gin.Context) {
+	uid, exists := c.Get("uid")
+	if !exists {
+		common.Error(c, http.StatusUnauthorized, "请先登录")
+		return
+	}
+
+	sessions, err := sc.sessionMgr.ListByUID(uid.(uint))
+	if err != nil {
+		common.Error(c, http.StatusInternalServerError, "查询失败")
+		return
+	}
+
+	currentSID, _ := c.Cookie(common.SessionCookieName)
+
+	type sessionItem struct {
+		ID         string `json:"id"`
+		IP         string `json:"ip"`
+		UserAgent  string `json:"user_agent"`
+		Remark     string `json:"remark"`
+		RememberMe bool   `json:"remember_me"`
+		CreatedAt  string `json:"created_at"`
+		LastAccess string `json:"last_access"`
+		IsCurrent  bool   `json:"is_current"`
+	}
+
+	var items []sessionItem
+	for _, s := range sessions {
+		items = append(items, sessionItem{
+			ID:         s.ID,
+			IP:         s.IP,
+			UserAgent:  s.UserAgent,
+			Remark:     s.Remark,
+			RememberMe: s.RememberMe,
+			CreatedAt:  s.CreatedAt.Format("2006-01-02 15:04:05"),
+			LastAccess: s.LastAccess.Format("2006-01-02 15:04:05"),
+			IsCurrent:  s.ID == currentSID,
+		})
+	}
+	if items == nil {
+		items = []sessionItem{}
+	}
+
+	common.Ok(c, gin.H{"sessions": items})
+}
+
+// DestroySession 踢出指定会话（需验证归属当前用户）
+func (sc *SettingsController) DestroySession(c *gin.Context) {
+	uid, exists := c.Get("uid")
+	if !exists {
+		common.Error(c, http.StatusUnauthorized, "请先登录")
+		return
+	}
+
+	sid := c.Param("sid")
+	if sid == "" {
+		common.Error(c, http.StatusBadRequest, "缺少会话 ID")
+		return
+	}
+
+	// 验证目标会话属于当前用户
+	sessions, err := sc.sessionMgr.ListByUID(uid.(uint))
+	if err != nil {
+		common.Error(c, http.StatusInternalServerError, "操作失败")
+		return
+	}
+	found := false
+	for _, s := range sessions {
+		if s.ID == sid {
+			found = true
+			break
+		}
+	}
+	if !found {
+		common.Error(c, http.StatusNotFound, "会话不存在")
+		return
+	}
+
+	// 不能踢出当前会话
+	currentSID, _ := c.Cookie(common.SessionCookieName)
+	if sid == currentSID {
+		common.Error(c, http.StatusBadRequest, "不能踢出当前设备，请使用退出登录")
+		return
+	}
+
+	if err := sc.sessionMgr.Destroy(sid); err != nil {
+		common.Error(c, http.StatusInternalServerError, "操作失败")
+		return
+	}
+
+	common.OkMessage(c, "已踢出该设备")
+}
+
+// DestroyOtherSessions 一键踢出非当前设备的所有会话
+func (sc *SettingsController) DestroyOtherSessions(c *gin.Context) {
+	uid, exists := c.Get("uid")
+	if !exists {
+		common.Error(c, http.StatusUnauthorized, "请先登录")
+		return
+	}
+
+	currentSID, _ := c.Cookie(common.SessionCookieName)
+	if currentSID == "" {
+		common.Error(c, http.StatusBadRequest, "无法识别当前会话")
+		return
+	}
+
+	if err := sc.sessionMgr.DestroyOtherByUID(uid.(uint), currentSID); err != nil {
+		common.Error(c, http.StatusInternalServerError, "操作失败")
+		return
+	}
+
+	common.OkMessage(c, "已踢出所有其他设备")
+}
+
+// UpdateSessionRemark 更新指定会话的备注
+func (sc *SettingsController) UpdateSessionRemark(c *gin.Context) {
+	uid, exists := c.Get("uid")
+	if !exists {
+		common.Error(c, http.StatusUnauthorized, "请先登录")
+		return
+	}
+
+	sid := c.Param("sid")
+	if sid == "" {
+		common.Error(c, http.StatusBadRequest, "缺少会话 ID")
+		return
+	}
+
+	var req struct {
+		Remark string `json:"remark"`
+	}
+	if err := c.ShouldBindJSON(&req); err != nil {
+		common.Error(c, http.StatusBadRequest, "请检查输入")
+		return
+	}
+
+	// 备注长度限制
+	if len(req.Remark) > 32 {
+		common.Error(c, http.StatusBadRequest, "备注不能超过 32 个字符")
+		return
+	}
+
+	if err := sc.sessionMgr.UpdateRemark(sid, uid.(uint), req.Remark); err != nil {
+		common.Error(c, http.StatusInternalServerError, "操作失败")
+		return
+	}
+
+	common.OkMessage(c, "备注已更新")
+}

internal/controller/settings_controller.go

@@ -6,6 +6,7 @@ import (
 
 	"metazone.cc/metalab/internal/common"
 	"metazone.cc/metalab/internal/model"
+	"metazone.cc/metalab/internal/session"
 
 	"github.com/gin-gonic/gin"
 )
@@ -37,11 +38,12 @@ type SettingsController struct {
 	authService   profileProvider
 	avatarService avatarProvider
 	auditService  auditSubmittable
+	sessionMgr    sessionManager
 }
 
 // NewSettingsController 构造函数
-func NewSettingsController(authService profileProvider, avatarService avatarProvider, auditService auditSubmittable) *SettingsController {
+func NewSettingsController(authService profileProvider, avatarService avatarProvider, auditService auditSubmittable, sessionMgr sessionManager) *SettingsController {
-	return &SettingsController{authService: authService, avatarService: avatarService, auditService: auditService}
+	return &SettingsController{authService: authService, avatarService: avatarService, auditService: auditService, sessionMgr: sessionMgr}
 }
 
 // SettingsPage 个人设置页面（需登录）
@@ -55,7 +57,7 @@ func (sc *SettingsController) SettingsPage(c *gin.Context) {
 	uid := uidVal.(uint)
 
 	tab := c.Param("tab")
-	if tab != "profile" && tab != "account" {
+	if tab != "profile" && tab != "account" && tab != "sessions" {
 		c.String(http.StatusNotFound, "页面不存在")
 		return
 	}
@@ -69,7 +71,7 @@ func (sc *SettingsController) SettingsPage(c *gin.Context) {
 	// 查询待审核类型（用于前端显示审核提示）
 	pendingTypes, _ := sc.auditService.GetPendingTypes(uid)
 
-	c.HTML(http.StatusOK, "settings/index.html", common.BuildPageData(c, gin.H{
+	data := gin.H{
 		"Title":        "个人设置",
 		"ExtraCSS":     "/static/css/settings.css",
 		"ActiveTab":    tab,
@@ -78,7 +80,34 @@ func (sc *SettingsController) SettingsPage(c *gin.Context) {
 		"StatusName":   model.StatusDisplayNames[user.Status],
 		"PendingTypes": pendingTypes,
 		"AuditTypes":   model.AuditTypeNames,
-	}))
+	}
+
+	// 登录管理 tab 需要额外数据
+	if tab == "sessions" {
+		sessions, _ := sc.sessionMgr.ListByUID(uid)
+		if sessions == nil {
+			sessions = []*session.Session{}
+		}
+		currentSID, _ := c.Cookie(common.SessionCookieName)
+		// 解析每个 session 的设备信息
+		type sessionView struct {
+			*session.Session
+			DeviceInfo session.DeviceInfo
+			IsCurrent  bool
+		}
+		var views []sessionView
+		for _, s := range sessions {
+			views = append(views, sessionView{
+				Session:    s,
+				DeviceInfo: session.ParseUA(s.UserAgent),
+				IsCurrent:  s.ID == currentSID,
+			})
+		}
+		data["Sessions"] = views
+		data["CurrentSID"] = currentSID
+	}
+
+	c.HTML(http.StatusOK, "settings/index.html", common.BuildPageData(c, data))
 }
 
 // AuditStatus 查询当前用户的待审核类型（需登录）

internal/middleware/auth.go

@@ -78,4 +78,5 @@ func injectSessionContext(c *gin.Context, s *session.Session) {
 	c.Set("email", s.Email)
 	c.Set("username", s.Username)
 	c.Set("role", s.Role)
+	c.Set("sid", s.ID)
 }

internal/router/api.go

@@ -19,6 +19,11 @@ func setupAPIRoutes(r *gin.Engine, cfg *config.Config, d *dependencies) {
 		settingsAPI.PUT("/password", d.settingsCtrl.ChangePassword)
 		settingsAPI.POST("/delete-account", d.settingsCtrl.DeleteAccount)
 		settingsAPI.GET("/audit-status", d.settingsCtrl.AuditStatus)
+		// 登录管理
+		settingsAPI.GET("/sessions", d.settingsCtrl.ListSessions)
+		settingsAPI.DELETE("/sessions/:sid", d.settingsCtrl.DestroySession)
+		settingsAPI.POST("/sessions/destroy-others", d.settingsCtrl.DestroyOtherSessions)
+		settingsAPI.PUT("/sessions/:sid/remark", d.settingsCtrl.UpdateSessionRemark)
 	}
 
 	// --- 消息中心 API（需登录） ---

internal/router/deps_extra.go

@@ -22,7 +22,7 @@ func buildDeps(db *gorm.DB, cfg *config.Config, siteSettings *config.SiteSetting
 
 	messageController := controller.NewMessageController(notificationService)
 
-	settingsCtrl := controller.NewSettingsController(authService, avatarSvc, auditService)
+	settingsCtrl := controller.NewSettingsController(authService, avatarSvc, auditService, sessionMgr)
 	siteSettingController := adminCtrl.NewSiteSettingController(
 		service.NewSiteSettingService(siteSettings),
 		&service.AuditDefaults{

internal/session/manager.go

@@ -26,7 +26,7 @@ func NewManager(store Store, userRepo userStore, cfg *config.Config) *Manager {
 }
 
 // Create 创建会话并写入存储
-func (m *Manager) Create(user *model.User, rememberMe bool) (string, error) {
+func (m *Manager) Create(user *model.User, rememberMe bool, ip, userAgent string) (string, error) {
 	sid, err := NewID()
 	if err != nil {
 		return "", err
@@ -39,13 +39,15 @@ func (m *Manager) Create(user *model.User, rememberMe bool) (string, error) {
 		Username:   user.Username,
 		Role:       user.Role,
 		RememberMe: rememberMe,
+		IP:         ip,
+		UserAgent:  userAgent,
 		CreatedAt:  now,
 		LastAccess: now,
 	}
 	if err := m.store.Set(s); err != nil {
 		return "", err
 	}
-	log.Printf("[SessionManager] Created sid=%s uid=%d rememberMe=%v", sid[:16]+"...", user.ID, rememberMe)
+	log.Printf("[SessionManager] Created sid=%s uid=%d rememberMe=%v ip=%s", sid[:16]+"...", user.ID, rememberMe, ip)
 	return sid, nil
 }
 
@@ -102,3 +104,26 @@ func (m *Manager) IdleTimeout(rememberMe bool) time.Duration {
 	}
 	return time.Duration(m.cfg.Session.IdleTimeout) * time.Minute
 }
+
+// ListByUID 列出某用户的所有活跃会话
+func (m *Manager) ListByUID(uid uint) ([]*Session, error) {
+	return m.store.ListByUID(uid)
+}
+
+// DestroyOtherByUID 销毁某用户除当前会话外的所有会话
+func (m *Manager) DestroyOtherByUID(uid uint, currentSID string) error {
+	return m.store.DeleteByUIDExclude(uid, currentSID)
+}
+
+// UpdateRemark 更新指定会话的备注（需验证归属）
+func (m *Manager) UpdateRemark(sid string, uid uint, remark string) error {
+	s, err := m.store.Get(sid)
+	if err != nil || s == nil {
+		return err
+	}
+	if s.UserID != uid {
+		return nil
+	}
+	s.Remark = remark
+	return m.store.Set(s)
+}

internal/session/memory_store.go

@@ -91,6 +91,59 @@ func (ms *MemoryStore) DeleteByUID(uid uint) error {
 	return nil
 }
 
+// DeleteByUIDExclude 删除某用户的所有会话，但保留 excludeSID
+func (ms *MemoryStore) DeleteByUIDExclude(uid uint, excludeSID string) error {
+	ms.mu.Lock()
+	defer ms.mu.Unlock()
+
+	sids, ok := ms.byUID[uid]
+	if !ok {
+		return nil
+	}
+	var kept []string
+	var removed int
+	for _, sid := range sids {
+		if sid == excludeSID {
+			kept = append(kept, sid)
+			continue
+		}
+		delete(ms.sessions, sid)
+		removed++
+	}
+	if len(kept) > 0 {
+		ms.byUID[uid] = kept
+	} else {
+		delete(ms.byUID, uid)
+	}
+	log.Printf("[MemoryStore] DeleteByUIDExclude uid=%d removed=%d kept=%d", uid, removed, len(kept))
+	return nil
+}
+
+// ListByUID 列出某用户的所有活跃会话（已过期的会被清理掉）
+func (ms *MemoryStore) ListByUID(uid uint) ([]*Session, error) {
+	ms.mu.RLock()
+	sids, ok := ms.byUID[uid]
+	if !ok {
+		ms.mu.RUnlock()
+		return nil, nil
+	}
+	// 复制 sid 列表避免持锁期间修改
+	sidCopy := make([]string, len(sids))
+	copy(sidCopy, sids)
+	ms.mu.RUnlock()
+
+	var result []*Session
+	for _, sid := range sidCopy {
+		// Get 会检查过期并自动清理
+		s, err := ms.Get(sid)
+		if err != nil || s == nil {
+			continue
+		}
+		result = append(result, s)
+	}
+	return result, nil
+}
+
 // Cleanup 清理过期会话（根据 RememberMe 选择对应超时）
 func (ms *MemoryStore) Cleanup() int {
 	ms.mu.Lock()

internal/session/session.go

@@ -14,6 +14,9 @@ type Session struct {
 	Username   string    // 用户名
 	Role       string    // 角色
 	RememberMe bool      // 是否持久化（决定 cookie maxAge）
+	IP         string    // 登录 IP
+	UserAgent  string    // 登录设备 User-Agent
+	Remark     string    // 用户备注（如"我的笔记本"）
 	CreatedAt  time.Time // 创建时间
 	LastAccess time.Time // 最后访问时间（滑动窗口）
 }

internal/session/store.go

@@ -14,6 +14,12 @@ type Store interface {
 	// DeleteByUID 删除某用户的所有会话（改密/注销/强制下线时调用）
 	DeleteByUID(uid uint) error
 
+	// DeleteByUIDExclude 删除某用户的所有会话，但保留指定的会话 ID
+	DeleteByUIDExclude(uid uint, excludeSID string) error
+
+	// ListByUID 列出某用户的所有活跃会话
+	ListByUID(uid uint) ([]*Session, error)
+
 	// Cleanup 清理过期会话，返回清理数量（由后台 goroutine 定期调用）
 	Cleanup() int
 }

internal/session/ua.go

@@ -0,0 +1,97 @@
+package session
+
+import "strings"
+
+// DeviceInfo 从 User-Agent 解析出的设备摘要信息
+type DeviceInfo struct {
+	Device  string // 设备类型：Desktop / Mobile / Tablet
+	OS      string // 操作系统：Windows 10 / macOS / Android 12 等
+	Browser string // 浏览器：Chrome 120 / Firefox 121 / Safari 17 等
+}
+
+// ParseUA 从原始 User-Agent 字符串解析设备信息（轻量级，不引入第三方库）
+func ParseUA(ua string) DeviceInfo {
+	info := DeviceInfo{Device: "Desktop"}
+
+	lower := strings.ToLower(ua)
+
+	// --- 操作系统 ---
+	switch {
+	case strings.Contains(lower, "windows nt 10"):
+		info.OS = "Windows 10/11"
+	case strings.Contains(lower, "windows nt 6.3"):
+		info.OS = "Windows 8.1"
+	case strings.Contains(lower, "windows nt 6.2"):
+		info.OS = "Windows 8"
+	case strings.Contains(lower, "windows nt 6.1"):
+		info.OS = "Windows 7"
+	case strings.Contains(lower, "windows"):
+		info.OS = "Windows"
+	case strings.Contains(lower, "mac os x"):
+		info.OS = "macOS"
+		if strings.Contains(lower, "iphone") {
+			info.OS = "iOS"
+			info.Device = "Mobile"
+		} else if strings.Contains(lower, "ipad") {
+			info.OS = "iPadOS"
+			info.Device = "Tablet"
+		}
+	case strings.Contains(lower, "android"):
+		info.OS = "Android"
+		info.Device = "Mobile"
+		if strings.Contains(lower, "tablet") || strings.Contains(lower, "ipad") {
+			info.Device = "Tablet"
+		}
+	case strings.Contains(lower, "iphone"):
+		info.OS = "iOS"
+		info.Device = "Mobile"
+	case strings.Contains(lower, "ipad"):
+		info.OS = "iPadOS"
+		info.Device = "Tablet"
+	case strings.Contains(lower, "linux"):
+		info.OS = "Linux"
+	case strings.Contains(lower, "cros"):
+		info.OS = "ChromeOS"
+	default:
+		info.OS = "Unknown"
+	}
+
+	// --- 浏览器 ---
+	switch {
+	case strings.Contains(lower, "edg/"):
+		info.Browser = "Edge"
+		info.Browser += extractVersion(ua, "Edg/")
+	case strings.Contains(lower, "chrome/") && !strings.Contains(lower, "edg/"):
+		info.Browser = "Chrome"
+		info.Browser += extractVersion(ua, "Chrome/")
+	case strings.Contains(lower, "firefox/"):
+		info.Browser = "Firefox"
+		info.Browser += extractVersion(ua, "Firefox/")
+	case strings.Contains(lower, "safari/") && !strings.Contains(lower, "chrome/"):
+		info.Browser = "Safari"
+		info.Browser += extractVersion(ua, "Version/")
+	default:
+		info.Browser = "Unknown"
+	}
+
+	return info
+}
+
+// extractVersion 从 UA 中提取主版本号
+func extractVersion(ua, prefix string) string {
+	idx := strings.Index(ua, prefix)
+	if idx == -1 {
+		return ""
+	}
+	rest := ua[idx+len(prefix):]
+	dot := strings.Index(rest, ".")
+	if dot == -1 {
+		// 无点号，取到空格或结尾
+		sp := strings.Index(rest, " ")
+		if sp > 0 {
+			return " " + rest[:sp]
+		}
+		return ""
+	}
+	return " " + rest[:dot]
+}

templates/MetaLab-2026/html/settings/index.html

@@ -24,6 +24,15 @@
                 </svg>
                 账号信息
             </a>
+            <a href="/settings/sessions"
+               class="settings-nav-item {{if eq .ActiveTab "sessions"}}active{{end}}">
+                <svg class="settings-nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                    <rect x="2" y="3" width="20" height="14" rx="2" ry="2"/>
+                    <line x1="8" y1="21" x2="16" y2="21"/>
+                    <line x1="12" y1="17" x2="12" y2="21"/>
+                </svg>
+                登录管理
+            </a>
         </nav>
     </aside>
 
@@ -59,6 +68,55 @@
                         <div class="avatar-upload-wrap" id="avatarWrap">
                             {{if .User.Avatar}}
                             <img src="{{.User.Avatar}}?v={{.User.UpdatedAt.Unix}}" alt="avatar" class="avatar-preview" id="avatarPreview">
+                            {{else if eq .ActiveTab "sessions"}}
+        <!-- 登录管理 -->
+        <div class="settings-card">
+            <div class="settings-card-header">
+                <h2>登录管理</h2>
+                <p class="settings-card-desc">查看和管理你的登录设备，保护账号安全</p>
+            </div>
+            <div class="settings-card-body">
+                <div class="session-list" id="sessionList">
+                    {{range .Sessions}}
+                    <div class="session-item{{if .IsCurrent}} session-current{{end}}" data-sid="{{.ID}}">
+                        <div class="session-icon">
+                            {{if eq .DeviceInfo.Device "Mobile"}}<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="24" height="24"><rect x="5" y="2" width="14" height="20" rx="2" ry="2"/><line x1="12" y1="18" x2="12.01" y2="18"/></svg>
+                            {{else if eq .DeviceInfo.Device "Tablet"}}<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="24" height="24"><rect x="4" y="2" width="16" height="20" rx="2" ry="2"/><line x1="12" y1="18" x2="12.01" y2="18"/></svg>
+                            {{else}}<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="24" height="24"><rect x="2" y="3" width="20" height="14" rx="2" ry="2"/><line x1="8" y1="21" x2="16" y2="21"/><line x1="12" y1="17" x2="12" y2="21"/></svg>
+                            {{end}}
+                        </div>
+                        <div class="session-info">
+                            <div class="session-title">
+                                <span class="session-browser">{{.DeviceInfo.Browser}}</span>
+                                <span class="session-os">/ {{.DeviceInfo.OS}}</span>
+                                {{if .IsCurrent}}<span class="session-badge">当前设备</span>{{end}}
+                            </div>
+                            <div class="session-meta">
+                                <span class="session-ip">IP: {{.IP}}</span>
+                                <span class="session-time">登录于 {{.CreatedAt.Format "2006-01-02 15:04"}}</span>
+                                <span class="session-time">最后活动 {{.LastAccess.Format "2006-01-02 15:04"}}</span>
+                            </div>
+                            <div class="session-remark-row">
+                                <input type="text" class="session-remark-input" value="{{.Remark}}" placeholder="添加备注（如"我的笔记本"）" maxlength="32" data-sid="{{.ID}}" {{if .IsCurrent}}readonly{{end}}>
+                            </div>
+                        </div>
+                        <div class="session-action">
+                            {{if not .IsCurrent}}
+                            <button class="session-kick-btn" data-sid="{{.ID}}">踢出</button>
+                            {{end}}
+                        </div>
+                    </div>
+                    {{end}}
+                    {{if not .Sessions}}
+                    <div class="session-empty">暂无活跃的登录会话</div>
+                    {{end}}
+                </div>
+            </div>
+            <div class="settings-card-footer">
+                <button id="kickOthersBtn" class="settings-danger-btn">一键踢出其他设备</button>
+                <span class="form-hint">将强制退出除当前设备外的所有登录会话</span>
+            </div>
+        </div>
         {{else}}
                             <div class="avatar-placeholder" id="avatarPreview">
                                 <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" width="24" height="24"><circle cx="12" cy="8" r="4"/><path d="M4 20c0-4 4-7 8-7s8 3 8 7"/></svg>
@@ -87,7 +145,104 @@
                 </div>
             </div>
         </div>
-        {{else}}
+        {{else if eq .ActiveTab "sessions"}}
+        <!-- 登录管理 -->
+        <div class="settings-card">
+            <div class="settings-card-header">
+                <h2>登录管理</h2>
+                <p class="settings-card-desc">查看和管理你的登录设备，保护账号安全</p>
+            </div>
+            <div class="settings-card-body">
+                <div class="session-list" id="sessionList">
+                    {{range .Sessions}}
+                    <div class="session-item{{if .IsCurrent}} session-current{{end}}" data-sid="{{.ID}}">
+                        <div class="session-icon">
+                            {{if eq .DeviceInfo.Device "Mobile"}}<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="24" height="24"><rect x="5" y="2" width="14" height="20" rx="2" ry="2"/><line x1="12" y1="18" x2="12.01" y2="18"/></svg>
+                            {{else if eq .DeviceInfo.Device "Tablet"}}<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="24" height="24"><rect x="4" y="2" width="16" height="20" rx="2" ry="2"/><line x1="12" y1="18" x2="12.01" y2="18"/></svg>
+                            {{else}}<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="24" height="24"><rect x="2" y="3" width="20" height="14" rx="2" ry="2"/><line x1="8" y1="21" x2="16" y2="21"/><line x1="12" y1="17" x2="12" y2="21"/></svg>
+                            {{end}}
+                        </div>
+                        <div class="session-info">
+                            <div class="session-title">
+                                <span class="session-browser">{{.DeviceInfo.Browser}}</span>
+                                <span class="session-os">/ {{.DeviceInfo.OS}}</span>
+                                {{if .IsCurrent}}<span class="session-badge">当前设备</span>{{end}}
+                            </div>
+                            <div class="session-meta">
+                                <span class="session-ip">IP: {{.IP}}</span>
+                                <span class="session-time">登录于 {{.CreatedAt.Format "2006-01-02 15:04"}}</span>
+                                <span class="session-time">最后活动 {{.LastAccess.Format "2006-01-02 15:04"}}</span>
+                            </div>
+                            <div class="session-remark-row">
+                                <input type="text" class="session-remark-input" value="{{.Remark}}" placeholder="添加备注（如"我的笔记本"）" maxlength="32" data-sid="{{.ID}}" {{if .IsCurrent}}readonly{{end}}>
+                            </div>
+                        </div>
+                        <div class="session-action">
+                            {{if not .IsCurrent}}
+                            <button class="session-kick-btn" data-sid="{{.ID}}">踢出</button>
+                            {{end}}
+                        </div>
+                    </div>
+                    {{end}}
+                    {{if not .Sessions}}
+                    <div class="session-empty">暂无活跃的登录会话</div>
+                    {{end}}
+                </div>
+            </div>
+            <div class="settings-card-footer">
+                <button id="kickOthersBtn" class="settings-danger-btn">一键踢出其他设备</button>
+                <span class="form-hint">将强制退出除当前设备外的所有登录会话</span>
+            </div>
+        </div>
+        {{else if eq .ActiveTab "sessions"}}
+        <!-- 登录管理 -->
+        <div class="settings-card">
+            <div class="settings-card-header">
+                <h2>登录管理</h2>
+                <p class="settings-card-desc">查看和管理你的登录设备，保护账号安全</p>
+            </div>
+            <div class="settings-card-body">
+                <div class="session-list" id="sessionList">
+                    {{range .Sessions}}
+                    <div class="session-item{{if .IsCurrent}} session-current{{end}}" data-sid="{{.ID}}">
+                        <div class="session-icon">
+                            {{if eq .DeviceInfo.Device "Mobile"}}<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="24" height="24"><rect x="5" y="2" width="14" height="20" rx="2" ry="2"/><line x1="12" y1="18" x2="12.01" y2="18"/></svg>
+                            {{else if eq .DeviceInfo.Device "Tablet"}}<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="24" height="24"><rect x="4" y="2" width="16" height="20" rx="2" ry="2"/><line x1="12" y1="18" x2="12.01" y2="18"/></svg>
+                            {{else}}<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="24" height="24"><rect x="2" y="3" width="20" height="14" rx="2" ry="2"/><line x1="8" y1="21" x2="16" y2="21"/><line x1="12" y1="17" x2="12" y2="21"/></svg>
+                            {{end}}
+                        </div>
+                        <div class="session-info">
+                            <div class="session-title">
+                                <span class="session-browser">{{.DeviceInfo.Browser}}</span>
+                                <span class="session-os">/ {{.DeviceInfo.OS}}</span>
+                                {{if .IsCurrent}}<span class="session-badge">当前设备</span>{{end}}
+                            </div>
+                            <div class="session-meta">
+                                <span class="session-ip">IP: {{.IP}}</span>
+                                <span class="session-time">登录于 {{.CreatedAt.Format "2006-01-02 15:04"}}</span>
+                                <span class="session-time">最后活动 {{.LastAccess.Format "2006-01-02 15:04"}}</span>
+                            </div>
+                            <div class="session-remark-row">
+                                <input type="text" class="session-remark-input" value="{{.Remark}}" placeholder="添加备注（如"我的笔记本"）" maxlength="32" data-sid="{{.ID}}" {{if .IsCurrent}}readonly{{end}}>
+                            </div>
+                        </div>
+                        <div class="session-action">
+                            {{if not .IsCurrent}}
+                            <button class="session-kick-btn" data-sid="{{.ID}}">踢出</button>
+                            {{end}}
+                        </div>
+                    </div>
+                    {{end}}
+                    {{if not .Sessions}}
+                    <div class="session-empty">暂无活跃的登录会话</div>
+                    {{end}}
+                </div>
+            </div>
+            <div class="settings-card-footer">
+                <button id="kickOthersBtn" class="settings-danger-btn">一键踢出其他设备</button>
+                <span class="form-hint">将强制退出除当前设备外的所有登录会话</span>
+            </div>
+        </div>
         <!-- 账号信息 -->
         <div class="settings-card">
             <div class="settings-card-header">
@@ -615,6 +770,136 @@
             }));
         });
     }
+
+    // ===== 登录管理 Tab =====
+    (function () {
+        var kickBtns = document.querySelectorAll('.session-kick-btn');
+        var kickOthersBtn = document.getElementById('kickOthersBtn');
+        var remarkInputs = document.querySelectorAll('.session-remark-input');
+        if (!kickBtns.length && !kickOthersBtn && !remarkInputs.length) return;
+
+        // ---- 踢出单个设备 ----
+        kickBtns.forEach(function (btn) {
+            btn.addEventListener('click', function () {
+                var sid = btn.getAttribute('data-sid');
+                if (!sid) return;
+                if (!confirm('确定要踢出该设备吗？')) return;
+                btn.disabled = true;
+                btn.textContent = '踢出中...';
+
+                var xhr = new XMLHttpRequest();
+                xhr.open('DELETE', '/api/settings/sessions/' + encodeURIComponent(sid), true);
+                xhr.setRequestHeader('Content-Type', 'application/json');
+                xhr.onreadystatechange = function () {
+                    if (xhr.readyState !== 4) return;
+                    btn.disabled = false;
+                    btn.textContent = '踢出';
+                    try {
+                        var res = JSON.parse(xhr.responseText);
+                        if (res.success) {
+                            showSettingsToast(res.message || '已踢出该设备');
+                            // 移除该设备行（带淡出动画）
+                            var item = btn.closest('.session-item');
+                            if (item) {
+                                item.style.transition = 'opacity .3s ease, transform .3s ease';
+                                item.style.opacity = '0';
+                                item.style.transform = 'translateX(20px)';
+                                setTimeout(function () { item.remove(); }, 300);
+                            }
+                        } else {
+                            showSettingsToast(res.message || '操作失败', true);
+                        }
+                    } catch (e) {
+                        showSettingsToast('操作失败', true);
+                    }
+                };
+                xhr.send();
+            });
+        });
+
+        // ---- 一键踢出其他设备 ----
+        if (kickOthersBtn) {
+            kickOthersBtn.addEventListener('click', function () {
+                var otherCount = document.querySelectorAll('.session-item:not(.session-current)').length;
+                if (otherCount === 0) {
+                    showSettingsToast('没有其他在线设备');
+                    return;
+                }
+                if (!confirm('确定要踢出所有其他设备（共 ' + otherCount + ' 台）吗？')) return;
+                kickOthersBtn.disabled = true;
+                kickOthersBtn.textContent = '处理中...';
+
+                var xhr = new XMLHttpRequest();
+                xhr.open('POST', '/api/settings/sessions/destroy-others', true);
+                xhr.setRequestHeader('Content-Type', 'application/json');
+                xhr.onreadystatechange = function () {
+                    if (xhr.readyState !== 4) return;
+                    kickOthersBtn.disabled = false;
+                    kickOthersBtn.textContent = '一键踢出其他设备';
+                    try {
+                        var res = JSON.parse(xhr.responseText);
+                        if (res.success) {
+                            showSettingsToast(res.message || '已踢出所有其他设备');
+                            // 移除非当前设备行
+                            var others = document.querySelectorAll('.session-item:not(.session-current)');
+                            others.forEach(function (item, i) {
+                                setTimeout(function () {
+                                    item.style.transition = 'opacity .3s ease, transform .3s ease';
+                                    item.style.opacity = '0';
+                                    item.style.transform = 'translateX(20px)';
+                                    setTimeout(function () { item.remove(); }, 300);
+                                }, i * 100);
+                            });
+                        } else {
+                            showSettingsToast(res.message || '操作失败', true);
+                        }
+                    } catch (e) {
+                        showSettingsToast('操作失败', true);
+                    }
+                };
+                xhr.send();
+            });
+        }
+
+        // ---- 备注保存 ----
+        var remarkTimers = {};
+        remarkInputs.forEach(function (input) {
+            input.addEventListener('blur', function () {
+                var sid = input.getAttribute('data-sid');
+                var remark = input.value.trim();
+                if (!sid) return;
+                saveRemark(sid, remark);
+            });
+            input.addEventListener('keydown', function (e) {
+                if (e.key === 'Enter') {
+                    input.blur();
+                }
+            });
+        });
+
+        function saveRemark(sid, remark) {
+            if (remarkTimers[sid]) clearTimeout(remarkTimers[sid]);
+            remarkTimers[sid] = setTimeout(function () {
+                var xhr = new XMLHttpRequest();
+                xhr.open('PUT', '/api/settings/sessions/' + encodeURIComponent(sid) + '/remark', true);
+                xhr.setRequestHeader('Content-Type', 'application/json');
+                xhr.onreadystatechange = function () {
+                    if (xhr.readyState !== 4) return;
+                    try {
+                        var res = JSON.parse(xhr.responseText);
+                        if (res.success) {
+                            showSettingsToast('备注已保存');
+                        } else {
+                            showSettingsToast(res.message || '保存失败', true);
+                        }
+                    } catch (e) {
+                        showSettingsToast('保存失败', true);
+                    }
+                };
+                xhr.send(JSON.stringify({ remark: remark }));
+            }, 500);
+        }
+    })();
 })();
 </script>
 </body>

templates/MetaLab-2026/static/css/settings.css

@@ -568,3 +568,200 @@ body {
     opacity: .6;
     cursor: not-allowed;
 }
+
+/* ---------- Session Management ---------- */
+.session-list {
+    display: flex;
+    flex-direction: column;
+    gap: 0;
+}
+
+.session-item {
+    display: flex;
+    align-items: flex-start;
+    gap: 1rem;
+    padding: 1.1rem 0;
+    border-bottom: 1px solid #f0f0f0;
+}
+
+.session-item:last-child {
+    border-bottom: none;
+}
+
+.session-item.session-current {
+    background: rgba(46, 204, 113, .04);
+    margin: 0 -2rem;
+    padding: 1.1rem 2rem;
+    border-radius: 6px;
+    border-bottom: none;
+}
+
+.session-icon {
+    flex-shrink: 0;
+    width: 40px;
+    height: 40px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background: #f5f7fa;
+    border-radius: 10px;
+    color: var(--color-text-light);
+    margin-top: 2px;
+}
+
+.session-current .session-icon {
+    background: rgba(46, 204, 113, .1);
+    color: #2ecc71;
+}
+
+.session-info {
+    flex: 1;
+    min-width: 0;
+}
+
+.session-title {
+    display: flex;
+    align-items: center;
+    gap: .4rem;
+    flex-wrap: wrap;
+    margin-bottom: .3rem;
+}
+
+.session-browser {
+    font-size: .92rem;
+    font-weight: 600;
+    color: var(--color-text);
+}
+
+.session-os {
+    font-size: .85rem;
+    color: var(--color-text-light);
+}
+
+.session-badge {
+    display: inline-block;
+    padding: 1px 8px;
+    border-radius: 4px;
+    font-size: .75rem;
+    font-weight: 600;
+    background: #e8f5e9;
+    color: #2e7d32;
+    margin-left: .2rem;
+}
+
+.session-meta {
+    display: flex;
+    gap: .8rem;
+    flex-wrap: wrap;
+    font-size: .8rem;
+    color: #aaa;
+    margin-bottom: .5rem;
+}
+
+.session-ip {
+    font-family: 'SF Mono', 'Menlo', 'Monaco', monospace;
+    font-size: .78rem;
+    background: #f5f5f5;
+    padding: 1px 6px;
+    border-radius: 3px;
+}
+
+.session-remark-row {
+    margin-top: .25rem;
+}
+
+.session-remark-input {
+    width: 100%;
+    max-width: 320px;
+    padding: .35rem .6rem;
+    font-size: .82rem;
+    font-family: inherit;
+    color: var(--color-text);
+    background: #f9fafb;
+    border: 1px solid var(--color-border);
+    border-radius: 5px;
+    outline: none;
+    transition: border-color .15s ease, box-shadow .15s ease;
+}
+
+.session-remark-input:focus {
+    border-color: var(--color-accent);
+    box-shadow: 0 0 0 3px rgba(52, 152, 219, .15);
+    background: #fff;
+}
+
+.session-remark-input[readonly] {
+    background: transparent;
+    border-color: transparent;
+    cursor: default;
+}
+
+.session-remark-input[readonly]:focus {
+    box-shadow: none;
+    border-color: transparent;
+}
+
+.session-action {
+    flex-shrink: 0;
+    align-self: center;
+}
+
+.session-kick-btn {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    padding: .35rem .9rem;
+    font-size: .82rem;
+    font-weight: 600;
+    font-family: inherit;
+    color: #e74c3c;
+    background: #fff5f5;
+    border: 1px solid #fecaca;
+    border-radius: 5px;
+    cursor: pointer;
+    transition: all .15s ease;
+    white-space: nowrap;
+}
+
+.session-kick-btn:hover {
+    background: #fee2e2;
+    border-color: #e74c3c;
+}
+
+.session-kick-btn:disabled {
+    opacity: .5;
+    cursor: not-allowed;
+}
+
+.session-empty {
+    text-align: center;
+    padding: 2rem 0;
+    color: #bbb;
+    font-size: .9rem;
+}
+
+/* ---------- Session Responsive ---------- */
+@media (max-width: 768px) {
+    .session-item {
+        flex-wrap: wrap;
+        gap: .75rem;
+    }
+
+    .session-item.session-current {
+        margin: 0 -1.25rem;
+        padding: 1.1rem 1.25rem;
+    }
+
+    .session-action {
+        width: 100%;
+    }
+
+    .session-kick-btn {
+        width: 100%;
+        justify-content: center;
+    }
+
+    .session-remark-input {
+        max-width: 100%;
+    }
+}