refactor: remove GORM FK associations, handle relations in business layer (v0.6.1)

- Remove Role association field from User model
- Remove User association field from Token model
- controller/user.go: query Role separately after loading User
- controller/token.go: query User and Role with separate DB calls
- handler/admin.go: introduce userResp type, build role info manually;
  batch-load roles in AdminListUsers to avoid N+1

🤖 Generated with [Qoder][https://qoder.com]

.gitea/workflows/build.yaml

@@ -1,59 +0,0 @@
-run-name: build ushare
-on:
-  push:
-    tags:
-      - 'v*'
-
-jobs:
-  build ushare:
-    runs-on: tencent-sg
-    steps:
-      - name: prepare enviroment
-        uses: actions/checkout@v4
-
-      - name: prints date
-        run: date '+%Y-%m-%dT%H:%M:%S'
-
-      - name: print operator
-        run: whoami
-
-      - name: print tag name
-        run: echo "Tag name = ${{ gitea.ref_name }}"
-
-      - name: build prepare config
-        run: |
-          cat << EOF > .docker.config.json
-          ${{ secrets.DOCKER_CONFIG }}
-          EOF
-
-      - name: print work dir and files
-        run: pwd & ls -alsh .
-
-      - name: build image by docker build
-        run: docker build -t gitea.loveuer.com/loveuer/build/ushare:${{ gitea.ref_name }} .
-
-      - name: login repository
-        run: echo ${{ secrets.DOCKER_REPOSITORY_PASSWORD }} | docker login --username loveuer --password-stdin gitea.loveuer.com/loveuer
-
-      - name: push image to repository
-        run: docker push gitea.loveuer.com/loveuer/build/ushare:${{ gitea.ref_name }}
-
-#      - name: build by kaniko in docker
-#        run: |
-#          docker run --rm -v $(pwd):/workspace \
-#            -v $(pwd)/.docker.config.json:/kaniko/.docker/config.json:ro \
-#            alpine:latest \
-#            ls -alsh /workspace
-#            gcr.io/kaniko-project/executor:latest \
-#            --dockerfile=/workspace/Dockerfile \
-#            --context=/workspace \
-#            --destination=gitea.loveuer.com/loveuer/build/u-api:${{ gitea.ref_name }} \
-#            --single-snapshot
-
-  clean:
-    if: always()
-    runs-on: tencent-sg
-    steps:
-      - name: clean docker config
-        run: |
-          rm -rf .docker.config.json

.gitea_backup/workflows/build.yaml

@@ -0,0 +1,22 @@
+run-name: build ushare docker image
+on:
+  push:
+    tags:
+      - 'v*'
+
+jobs:
+  build:
+    runs-on: debian
+    steps:
+      - name: prepare environment
+        uses: actions/checkout@v4
+
+      - name: print info
+        run: |
+          date '+%Y-%m-%dT%H:%M:%S'
+          whoami
+          echo "Tag = ${{ gitea.ref_name }}"
+          pwd && ls -alsh .
+
+      - name: build docker image
+        run: docker build -t ushare:${{ gitea.ref_name }} .

.gitea_backup/workflows/release.yaml

@@ -0,0 +1,90 @@
+run-name: release ushare binaries
+on:
+  push:
+    tags:
+      - 'v*'
+
+jobs:
+  release:
+    runs-on: debian
+    steps:
+      - name: prepare environment
+        uses: actions/checkout@v4
+
+      - name: print info
+        run: |
+          date '+%Y-%m-%dT%H:%M:%S'
+          echo "Tag        = ${{ gitea.ref_name }}"
+          echo "Repository = ${{ gitea.repository }}"
+          echo "Server     = ${{ gitea.server_url }}"
+
+      - name: build frontend
+        run: |
+          docker run --rm \
+            --network host \
+            -v "$(pwd)/frontend":/app/frontend \
+            -w /app/frontend \
+            node:20-alpine \
+            sh -c "npm install -g pnpm --registry=https://registry.npmmirror.com \
+                   && pnpm install --registry=https://registry.npmmirror.com \
+                   && pnpm run build"
+          mkdir -p internal/static/frontend
+          cp -r frontend/dist internal/static/frontend/dist
+
+      - name: build binaries
+        run: |
+          mkdir -p dist
+          docker run --rm \
+            --network host \
+            -v "$(pwd)":/workspace \
+            -w /workspace \
+            -e GOPROXY=https://goproxy.cn,direct \
+            golang:alpine \
+            sh -c "
+              apk add --no-cache git && \
+              go mod download && \
+              for TARGET in linux/amd64 linux/arm64 darwin/amd64 darwin/arm64 windows/amd64; do
+                OS=\$(echo \$TARGET | cut -d/ -f1)
+                ARCH=\$(echo \$TARGET | cut -d/ -f2)
+                OUTPUT=\"dist/ushare-\${OS}-\${ARCH}\"
+                [ \"\$OS\" = \"windows\" ] && OUTPUT=\"\${OUTPUT}.exe\"
+                echo \">>> Building \${OUTPUT} ...\"
+                CGO_ENABLED=0 GOOS=\$OS GOARCH=\$ARCH \
+                  go build -ldflags '-s -w' -o \$OUTPUT .
+              done
+            "
+          ls -lh dist/
+
+      - name: create release
+        run: |
+          apt-get install -y -qq jq
+
+          TAG="${{ gitea.ref_name }}"
+          SERVER="${{ gitea.server_url }}"
+          REPO="${{ gitea.repository }}"
+          TOKEN="${{ secrets.GITEA_TOKEN }}"
+
+          RESPONSE=$(curl -sf -X POST \
+            "${SERVER}/api/v1/repos/${REPO}/releases" \
+            -H "Authorization: token ${TOKEN}" \
+            -H "Content-Type: application/json" \
+            -d "{\"tag_name\":\"${TAG}\",\"name\":\"${TAG}\",\"draft\":false,\"prerelease\":false}")
+
+          echo "Release created: $(echo $RESPONSE | jq -r '.id')"
+          echo "RELEASE_ID=$(echo $RESPONSE | jq -r '.id')" >> $GITHUB_ENV
+
+      - name: upload assets
+        run: |
+          SERVER="${{ gitea.server_url }}"
+          REPO="${{ gitea.repository }}"
+          TOKEN="${{ secrets.GITEA_TOKEN }}"
+
+          for FILE in dist/ushare-*; do
+            FILENAME=$(basename "$FILE")
+            echo ">>> Uploading ${FILENAME} ..."
+            curl -sf -X POST \
+              "${SERVER}/api/v1/repos/${REPO}/releases/${RELEASE_ID}/assets?name=${FILENAME}" \
+              -H "Authorization: token ${TOKEN}" \
+              -H "Content-Type: application/octet-stream" \
+              --data-binary @"${FILE}"
+          done

.github/workflows/release.yml

@@ -0,0 +1,106 @@
+name: Release Binaries
+
+on:
+  push:
+    tags:
+      - 'v*'
+
+permissions:
+  contents: write
+
+jobs:
+  release:
+    name: Build and Release
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        include:
+          - goos: linux
+            goarch: amd64
+            suffix: linux-amd64
+          - goos: linux
+            goarch: arm64
+            suffix: linux-arm64
+          - goos: darwin
+            goarch: amd64
+            suffix: darwin-amd64
+          - goos: darwin
+            goarch: arm64
+            suffix: darwin-arm64
+          - goos: windows
+            goarch: amd64
+            suffix: windows-amd64
+            ext: .exe
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Set up Go
+        uses: actions/setup-go@v5
+        with:
+          go-version: '1.24'
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '20'
+
+      - name: Install pnpm
+        uses: pnpm/action-setup@v2
+        with:
+          version: 8
+
+      - name: Get pnpm store directory
+        id: pnpm-cache
+        shell: bash
+        run: |
+          echo "STORE_PATH=$(pnpm store path)" >> $GITHUB_OUTPUT
+
+      - name: Setup pnpm cache
+        uses: actions/cache@v3
+        with:
+          path: ${{ steps.pnpm-cache.outputs.STORE_PATH }}
+          key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
+          restore-keys: |
+            ${{ runner.os }}-pnpm-store-
+
+      - name: Print build info
+        run: |
+          echo "Tag: ${{ github.ref_name }}"
+          echo "GoOS: ${{ matrix.goos }}"
+          echo "GoArch: ${{ matrix.goarch }}"
+
+      - name: Build frontend
+        working-directory: frontend
+        run: |
+          pnpm install --registry=https://registry.npmmirror.com
+          pnpm run build
+
+      - name: Copy frontend dist for embedding
+        run: |
+          mkdir -p internal/static/frontend
+          cp -r frontend/dist internal/static/frontend/
+
+      - name: Build binary
+        env:
+          GOOS: ${{ matrix.goos }}
+          GOARCH: ${{ matrix.goarch }}
+          CGO_ENABLED: 0
+        run: |
+          OUTPUT_NAME="ushare-${{ matrix.suffix }}${{ matrix.ext }}"
+          go build -ldflags '-s -w' -o "$OUTPUT_NAME" .
+          chmod +x "$OUTPUT_NAME"
+
+      - name: Generate checksums
+        run: |
+          OUTPUT_NAME="ushare-${{ matrix.suffix }}${{ matrix.ext }}"
+          sha256sum "$OUTPUT_NAME" > "$OUTPUT_NAME.sha256"
+
+      - name: Upload to release
+        uses: softprops/action-gh-release@v1
+        with:
+          files: |
+            ushare-${{ matrix.suffix }}${{ matrix.ext }}
+            ushare-${{ matrix.suffix }}${{ matrix.ext }}.sha256
+          draft: false
+          prerelease: false

Dockerfile

@@ -17,6 +17,8 @@ COPY go.sum /app/go.sum
 RUN go mod download
 COPY main.go /app/main.go
 COPY internal /app/internal
+# 将前端构建产物复制到 go:embed 所需的路径
+COPY --from=frontend-builder /app/frontend/dist /app/internal/static/frontend/dist
 RUN go build -ldflags '-s -w' -o ushare .
 
 # 第三阶段：生成最终镜像

README.md

@@ -0,0 +1,168 @@
+# UShare
+
+一个简单易用的文件分享工具，支持大文件分片上传下载，以及局域网内 P2P 文件分享。
+
+## 功能特性
+
+- 📁 大文件分片上传下载
+- 🌐 网页端文件分享
+- 🏠 局域网 P2P 文件分享（WebRTC）
+- 📱 响应式设计，支持移动端
+- 🔐 简单的用户认证
+- 🚀 单一二进制，开箱即用
+- 🐳 Docker 支持
+
+## 快速开始
+
+### 开发模式
+
+```bash
+# 克隆仓库
+git clone https://github.com/loveuer/ushare.git
+cd ushare
+
+# 启动开发服务器
+./dev.sh
+```
+
+开发服务器会同时启动后端（http://0.0.0.0:9119）和前端（http://0.0.0.0:5173），前端支持热重载。
+
+### 生产模式
+
+#### 使用预编译二进制
+
+从 [Releases](https://github.com/loveuer/ushare/releases) 下载对应平台的二进制文件。
+
+```bash
+# Linux amd64
+wget https://github.com/loveuer/ushare/releases/download/v0.3.2/ushare-linux-amd64
+chmod +x ushare-linux-amd64
+
+# 运行
+./ushare-linux-amd64 -data ./data
+```
+
+#### 从源码构建
+
+```bash
+# 构建单一二进制（包含嵌入的前端）
+./make.sh
+
+# 运行
+./dist/ushare -data ./data
+```
+
+#### Docker 部署
+
+```bash
+docker build -t ushare:latest .
+docker run -d -p 80:80 -v $(pwd)/data:/data ushare:latest
+```
+
+## 配置
+
+### 命令行参数
+
+```bash
+ushare [options]
+
+Options:
+  -debug          启用调试模式
+  -address string  监听地址 (default "0.0.0.0:9119")
+  -data string     数据目录 (default "/data")
+  -clean int       文件清理周期，单位：小时，0 表示不自动清理 (default 24)
+```
+
+### 环境变量
+
+| 环境变量 | 说明 | 默认值 |
+|---------|------|--------|
+| `USHARE_USERNAME` | 用户名 | `admin` |
+| `USHARE_PASSWORD` | 密码 | `ushare@123` |
+
+#### 示例
+
+```bash
+# 使用默认凭据（admin / ushare@123）
+./ushare -data ./data
+
+# 使用自定义凭据
+export USHARE_USERNAME=myuser
+export USHARE_PASSWORD=mypass
+./ushare -data ./data
+```
+
+## 使用说明
+
+### 文件分享
+
+1. 访问 http://localhost:9119/share
+2. 点击"选择文件"选择要上传的文件
+3. 点击"上传文件"，等待上传完成
+4. 复制生成的下载码分享给他人
+
+### 文件下载
+
+1. 访问 http://localhost:9119/share
+2. 在"获取文件"区域输入下载码
+3. 点击"获取文件"下载文件
+
+### 局域网 P2P 分享
+
+1. 访问 http://localhost:9119
+2. 自动注册到局域网设备列表
+3. 选择要分享的设备，建立 P2P 连接
+4. 开始文件传输
+
+## 移动端支持
+
+- 响应式设计，自动适配手机、平板等设备
+- 移动端（≤768px）采用垂直布局，优化触摸操作
+- 按钮尺寸优化，适合手指点击
+
+## 开发
+
+### 目录结构
+
+```
+ushare/
+├── internal/          # 后端代码
+│   ├── api/         # HTTP API 路由
+│   ├── controller/  # 业务逻辑
+│   ├── handler/     # 请求处理器
+│   ├── model/       # 数据模型
+│   ├── opt/         # 配置管理
+│   └── pkg/         # 工具包
+├── frontend/         # 前端代码
+│   └── src/
+│       ├── api/     # API 调用
+│       ├── component/  # UI 组件
+│       ├── hook/    # 自定义 Hooks
+│       ├── page/    # 页面组件
+│       └── store/   # 状态管理
+├── .github/workflows/  # GitHub Actions
+├── dist/            # 构建输出（.gitignore）
+└── data/            # 数据目录（.gitignore）
+```
+
+### 构建
+
+```bash
+# 开发构建（前后端分离）
+./dev.sh
+
+# 生产构建（单一二进制）
+./make.sh
+```
+
+### 代码风格
+
+请参考 [AGENTS.md](./AGENTS.md) 了解代码风格指南。
+
+## License
+
+MIT License
+
+## 贡献
+
+欢迎提交 Issue 和 Pull Request！

frontend/src/api/admin.ts

@@ -0,0 +1,89 @@
+export interface Role {
+    id: number;
+    name: string;
+    label: string;
+    permissions: string;
+    created_at: string;
+    updated_at: string;
+}
+
+export interface AdminUser {
+    id: number;
+    username: string;
+    role_id: number;
+    role: Role;
+    active: boolean;
+    created_at: string;
+    updated_at: string;
+}
+
+export interface CreateUserReq {
+    username: string;
+    password: string;
+    role_id: number;
+}
+
+export interface UpdateUserReq {
+    role_id?: number;
+    active?: boolean;
+    password?: string;
+}
+
+const jsonHeaders: HeadersInit = {'Content-Type': 'application/json'};
+
+export const adminApi = {
+    listUsers: async (): Promise<AdminUser[]> => {
+        const res = await fetch('/api/admin/users', {headers: jsonHeaders});
+        if (!res.ok) {
+            const json = await res.json().catch(() => ({}));
+            throw new Error(json.msg || '查询失败');
+        }
+        return (await res.json()).data;
+    },
+
+    createUser: async (req: CreateUserReq): Promise<AdminUser> => {
+        const res = await fetch('/api/admin/users', {
+            method: 'POST',
+            headers: jsonHeaders,
+            body: JSON.stringify(req),
+        });
+        if (!res.ok) {
+            const json = await res.json().catch(() => ({}));
+            throw new Error(json.msg || '创建失败');
+        }
+        return (await res.json()).data;
+    },
+
+    updateUser: async (id: number, req: UpdateUserReq): Promise<AdminUser> => {
+        const res = await fetch(`/api/admin/users/${id}`, {
+            method: 'PUT',
+            headers: jsonHeaders,
+            body: JSON.stringify(req),
+        });
+        if (!res.ok) {
+            const json = await res.json().catch(() => ({}));
+            throw new Error(json.msg || '更新失败');
+        }
+        return (await res.json()).data;
+    },
+
+    deleteUser: async (id: number): Promise<void> => {
+        const res = await fetch(`/api/admin/users/${id}`, {
+            method: 'DELETE',
+            headers: jsonHeaders,
+        });
+        if (!res.ok) {
+            const json = await res.json().catch(() => ({}));
+            throw new Error(json.msg || '删除失败');
+        }
+    },
+
+    listRoles: async (): Promise<Role[]> => {
+        const res = await fetch('/api/admin/roles', {headers: jsonHeaders});
+        if (!res.ok) {
+            const json = await res.json().catch(() => ({}));
+            throw new Error(json.msg || '查询失败');
+        }
+        return (await res.json()).data;
+    },
+};

frontend/src/api/token.ts

@@ -0,0 +1,53 @@
+export interface ApiToken {
+    id: number;
+    user_id: number;
+    name: string;
+    created_at: string;
+    last_used_at: string | null;
+    expires_at: string | null;
+}
+
+export interface CreateTokenRes {
+    id: number;
+    name: string;
+    token: string;
+    created_at: string;
+}
+
+const jsonHeaders: HeadersInit = {'Content-Type': 'application/json'};
+
+export const tokenApi = {
+    list: async (): Promise<ApiToken[]> => {
+        const res = await fetch('/api/token', {headers: jsonHeaders});
+        if (!res.ok) {
+            const json = await res.json().catch(() => ({}));
+            throw new Error(json.msg || '查询失败');
+        }
+        return (await res.json()).data;
+    },
+
+    create: async (name: string): Promise<CreateTokenRes> => {
+        const res = await fetch('/api/token', {
+            method: 'POST',
+            headers: jsonHeaders,
+            body: JSON.stringify({name}),
+        });
+        if (!res.ok) {
+            const json = await res.json().catch(() => ({}));
+            throw new Error(json.msg || '创建失败');
+        }
+        return (await res.json()).data;
+    },
+
+    delete: async (id: number): Promise<void> => {
+        const res = await fetch('/api/token', {
+            method: 'DELETE',
+            headers: jsonHeaders,
+            body: JSON.stringify({id}),
+        });
+        if (!res.ok) {
+            const json = await res.json().catch(() => ({}));
+            throw new Error(json.msg || '删除失败');
+        }
+    },
+};

frontend/src/main.tsx

@@ -6,12 +6,16 @@ import {Login} from "./page/login.tsx";
 import {FileSharing} from "./page/share/share.tsx";
 import {LocalSharing} from "./page/local/local.tsx";
 import {TestPage} from "./page/test/test.tsx";
+import {AdminPage} from "./page/admin/admin.tsx";
+import {SelfPage} from "./page/self/self.tsx";
 
 const container = document.getElementById('root')
 const root = createRoot(container!)
 const router = createBrowserRouter([
     {path: "/login", element: <Login />},
     {path: "/share", element: <FileSharing />},
+    {path: "/admin", element: <AdminPage />},
+    {path: "/self", element: <SelfPage />},
     {path: "/test", element: <TestPage />},
     {path: "*", element: <LocalSharing />},
 ])

frontend/src/page/admin/admin.tsx

@@ -0,0 +1,533 @@
+import React, {useEffect, useState} from 'react';
+import {createUseStyles} from 'react-jss';
+import {adminApi, AdminUser, Role, UpdateUserReq} from '../../api/admin.ts';
+import {message} from '../../hook/message/u-message.tsx';
+import {UButton} from '../../component/button/u-button.tsx';
+
+const PERM_LABELS: Record<string, string> = {
+    user_manage: '用户管理',
+    upload: '上传文件',
+    token_manage: 'Token管理',
+};
+
+const useStyle = createUseStyles({
+    container: {
+        minHeight: '100vh',
+        backgroundColor: '#e3f2fd',
+        padding: '24px',
+        boxSizing: 'border-box',
+        fontFamily: "'Segoe UI', Arial, sans-serif",
+    },
+    header: {
+        display: 'flex',
+        alignItems: 'center',
+        gap: '16px',
+        marginBottom: '24px',
+    },
+    backBtn: {
+        background: 'transparent',
+        border: '2px solid #2c9678',
+        color: '#2c9678',
+        borderRadius: '6px',
+        padding: '6px 14px',
+        cursor: 'pointer',
+        fontSize: '14px',
+        transition: 'background-color 0.2s',
+        '&:hover': {backgroundColor: 'rgba(44,150,120,0.1)'},
+    },
+    title: {
+        color: '#2c9678',
+        margin: 0,
+        fontSize: '22px',
+        fontWeight: 600,
+    },
+    card: {
+        backgroundColor: '#C8E6C9',
+        boxShadow: 'inset 0 0 15px rgba(56, 142, 60, 0.15)',
+        borderRadius: '15px',
+        padding: '24px',
+        marginBottom: '24px',
+    },
+    cardHeader: {
+        display: 'flex',
+        justifyContent: 'space-between',
+        alignItems: 'center',
+        marginBottom: '16px',
+    },
+    cardTitle: {
+        color: '#2c9678',
+        margin: 0,
+        fontSize: '16px',
+        fontWeight: 600,
+    },
+    table: {
+        width: '100%',
+        borderCollapse: 'collapse',
+        backgroundColor: 'rgba(255,255,255,0.7)',
+        borderRadius: '8px',
+        overflow: 'hidden',
+    },
+    th: {
+        backgroundColor: 'rgba(44,150,120,0.15)',
+        color: '#2c9678',
+        padding: '10px 14px',
+        textAlign: 'left',
+        fontSize: '13px',
+        fontWeight: 600,
+    },
+    td: {
+        padding: '10px 14px',
+        borderBottom: '1px solid rgba(44,150,120,0.1)',
+        fontSize: '14px',
+        color: '#333',
+    },
+    badgeActive: {
+        display: 'inline-block',
+        padding: '2px 10px',
+        borderRadius: '12px',
+        fontSize: '12px',
+        fontWeight: 500,
+        backgroundColor: '#c8e6c9',
+        color: '#2e7d32',
+    },
+    badgeInactive: {
+        display: 'inline-block',
+        padding: '2px 10px',
+        borderRadius: '12px',
+        fontSize: '12px',
+        fontWeight: 500,
+        backgroundColor: '#ffcdd2',
+        color: '#c62828',
+    },
+    actionBtn: {
+        background: 'transparent',
+        border: '1px solid #2c9678',
+        color: '#2c9678',
+        borderRadius: '4px',
+        padding: '4px 10px',
+        cursor: 'pointer',
+        fontSize: '12px',
+        marginRight: '6px',
+        transition: 'background-color 0.2s',
+        '&:hover': {backgroundColor: 'rgba(44,150,120,0.1)'},
+    },
+    deleteBtn: {
+        background: 'transparent',
+        border: '1px solid #c62828',
+        color: '#c62828',
+        borderRadius: '4px',
+        padding: '4px 10px',
+        cursor: 'pointer',
+        fontSize: '12px',
+        transition: 'background-color 0.2s',
+        '&:hover': {backgroundColor: 'rgba(198,40,40,0.08)'},
+    },
+    permTag: {
+        display: 'inline-block',
+        backgroundColor: 'rgba(44,150,120,0.15)',
+        color: '#2c9678',
+        borderRadius: '10px',
+        padding: '2px 8px',
+        fontSize: '12px',
+        marginRight: '4px',
+        marginBottom: '2px',
+    },
+    overlay: {
+        position: 'fixed',
+        top: 0, left: 0, right: 0, bottom: 0,
+        backgroundColor: 'rgba(0,0,0,0.4)',
+        display: 'flex',
+        justifyContent: 'center',
+        alignItems: 'center',
+        zIndex: 1000,
+    },
+    dialog: {
+        backgroundColor: '#C8E6C9',
+        boxShadow: '0 8px 32px rgba(44,150,120,0.2)',
+        borderRadius: '15px',
+        padding: '28px',
+        width: '400px',
+        maxWidth: '90vw',
+        boxSizing: 'border-box',
+    },
+    dialogTitle: {
+        color: '#2c9678',
+        margin: '0 0 20px',
+        fontSize: '16px',
+        fontWeight: 600,
+    },
+    formRow: {
+        marginBottom: '14px',
+    },
+    label: {
+        display: 'block',
+        color: '#2c9678',
+        fontSize: '13px',
+        marginBottom: '5px',
+        fontWeight: 500,
+    },
+    input: {
+        width: '100%',
+        padding: '9px 11px',
+        border: '2px solid #ddd',
+        borderRadius: '5px',
+        fontSize: '14px',
+        boxSizing: 'border-box',
+        background: 'rgba(255,255,255,0.8)',
+        transition: 'border-color 0.2s',
+        '&:focus': {outline: 'none', borderColor: '#2c9678'},
+    },
+    select: {
+        width: '100%',
+        padding: '9px 11px',
+        border: '2px solid #ddd',
+        borderRadius: '5px',
+        fontSize: '14px',
+        boxSizing: 'border-box',
+        background: 'rgba(255,255,255,0.8)',
+        transition: 'border-color 0.2s',
+        '&:focus': {outline: 'none', borderColor: '#2c9678'},
+    },
+    checkboxRow: {
+        display: 'flex',
+        alignItems: 'center',
+        gap: '8px',
+    },
+    dialogActions: {
+        display: 'flex',
+        gap: '10px',
+        justifyContent: 'flex-end',
+        marginTop: '20px',
+    },
+    cancelBtn: {
+        background: 'transparent',
+        border: '2px solid #aaa',
+        color: '#666',
+        borderRadius: '5px',
+        padding: '8px 18px',
+        cursor: 'pointer',
+        fontSize: '14px',
+        transition: 'border-color 0.2s',
+        '&:hover': {borderColor: '#888'},
+    },
+    dangerBtn: {
+        backgroundColor: '#c62828',
+        color: 'white',
+        border: 'none',
+        borderRadius: '5px',
+        padding: '8px 18px',
+        cursor: 'pointer',
+        fontSize: '14px',
+        transition: 'background-color 0.2s',
+        '&:hover': {backgroundColor: '#b71c1c'},
+    },
+    emptyTip: {
+        textAlign: 'center',
+        color: '#999',
+        padding: '24px',
+        fontSize: '14px',
+    },
+});
+
+type DialogMode = 'create' | 'edit';
+
+interface DialogState {
+    open: boolean;
+    mode: DialogMode;
+    user?: AdminUser;
+    username: string;
+    password: string;
+    roleId: number;
+    active: boolean;
+}
+
+const emptyDialog = (defaultRoleId = 0): DialogState => ({
+    open: false,
+    mode: 'create',
+    username: '',
+    password: '',
+    roleId: defaultRoleId,
+    active: true,
+});
+
+export const AdminPage: React.FC = () => {
+    const classes = useStyle();
+    const [users, setUsers] = useState<AdminUser[]>([]);
+    const [roles, setRoles] = useState<Role[]>([]);
+    const [loading, setLoading] = useState(true);
+    const [dialog, setDialog] = useState<DialogState>(emptyDialog());
+    const [saving, setSaving] = useState(false);
+    const [deleteTarget, setDeleteTarget] = useState<AdminUser | null>(null);
+
+    const loadData = async () => {
+        try {
+            const [u, r] = await Promise.all([adminApi.listUsers(), adminApi.listRoles()]);
+            setUsers(u ?? []);
+            setRoles(r ?? []);
+        } catch (e: unknown) {
+            message.error(e instanceof Error ? e.message : '加载失败');
+        } finally {
+            setLoading(false);
+        }
+    };
+
+    useEffect(() => {
+        fetch('/api/uauth/me').then(res => {
+            if (res.status === 401) {
+                window.location.href = '/login?next=/admin';
+            } else if (res.status === 403) {
+                message.error('权限不足');
+            } else {
+                loadData();
+            }
+        }).catch(() => {
+            window.location.href = '/login?next=/admin';
+        });
+    }, []);
+
+    const openCreate = () => {
+        const defaultRoleId = roles.find(r => r.name === 'user')?.id ?? roles[0]?.id ?? 0;
+        setDialog({...emptyDialog(defaultRoleId), open: true, mode: 'create'});
+    };
+
+    const openEdit = (user: AdminUser) => {
+        setDialog({
+            open: true,
+            mode: 'edit',
+            user,
+            username: user.username,
+            password: '',
+            roleId: user.role_id,
+            active: user.active,
+        });
+    };
+
+    const closeDialog = () => setDialog(emptyDialog());
+
+    const handleSave = async () => {
+        if (dialog.mode === 'create') {
+            if (!dialog.username.trim()) return message.warning('请输入用户名');
+            if (!dialog.password) return message.warning('请输入密码');
+            if (!dialog.roleId) return message.warning('请选择角色');
+        }
+        setSaving(true);
+        try {
+            if (dialog.mode === 'create') {
+                await adminApi.createUser({
+                    username: dialog.username.trim(),
+                    password: dialog.password,
+                    role_id: dialog.roleId,
+                });
+                message.success('创建成功');
+            } else if (dialog.user) {
+                const req: UpdateUserReq = {};
+                if (dialog.roleId !== dialog.user.role_id) req.role_id = dialog.roleId;
+                if (dialog.active !== dialog.user.active) req.active = dialog.active;
+                if (dialog.password) req.password = dialog.password;
+                await adminApi.updateUser(dialog.user.id, req);
+                message.success('更新成功');
+            }
+            closeDialog();
+            await loadData();
+        } catch (e: unknown) {
+            message.error(e instanceof Error ? e.message : '操作失败');
+        } finally {
+            setSaving(false);
+        }
+    };
+
+    const handleDelete = async () => {
+        if (!deleteTarget) return;
+        try {
+            await adminApi.deleteUser(deleteTarget.id);
+            message.success('删除成功');
+            setDeleteTarget(null);
+            await loadData();
+        } catch (e: unknown) {
+            message.error(e instanceof Error ? e.message : '删除失败');
+        }
+    };
+
+    return (
+        <div className={classes.container}>
+            <div className={classes.header}>
+                <button className={classes.backBtn} onClick={() => window.location.href = '/share'}>
+                    ← 返回
+                </button>
+                <h2 className={classes.title}>管理控制台</h2>
+            </div>
+
+            {/* Users */}
+            <div className={classes.card}>
+                <div className={classes.cardHeader}>
+                    <h3 className={classes.cardTitle}>用户管理</h3>
+                    <UButton onClick={openCreate}>添加用户</UButton>
+                </div>
+                {loading ? (
+                    <div className={classes.emptyTip}>加载中...</div>
+                ) : (
+                    <table className={classes.table}>
+                        <thead>
+                        <tr>
+                            <th className={classes.th}>ID</th>
+                            <th className={classes.th}>用户名</th>
+                            <th className={classes.th}>角色</th>
+                            <th className={classes.th}>状态</th>
+                            <th className={classes.th}>创建时间</th>
+                            <th className={classes.th}>操作</th>
+                        </tr>
+                        </thead>
+                        <tbody>
+                        {users.length === 0 ? (
+                            <tr>
+                                <td className={classes.td} colSpan={6}>
+                                    <div className={classes.emptyTip}>暂无用户</div>
+                                </td>
+                            </tr>
+                        ) : users.map(u => (
+                            <tr key={u.id}>
+                                <td className={classes.td}>{u.id}</td>
+                                <td className={classes.td}>{u.username}</td>
+                                <td className={classes.td}>{u.role?.label ?? '-'}</td>
+                                <td className={classes.td}>
+                                    <span className={u.active ? classes.badgeActive : classes.badgeInactive}>
+                                        {u.active ? '启用' : '禁用'}
+                                    </span>
+                                </td>
+                                <td className={classes.td}>
+                                    {new Date(u.created_at).toLocaleDateString('zh-CN')}
+                                </td>
+                                <td className={classes.td}>
+                                    <button className={classes.actionBtn} onClick={() => openEdit(u)}>编辑</button>
+                                    <button className={classes.deleteBtn} onClick={() => setDeleteTarget(u)}>删除</button>
+                                </td>
+                            </tr>
+                        ))}
+                        </tbody>
+                    </table>
+                )}
+            </div>
+
+            {/* Roles */}
+            <div className={classes.card}>
+                <div className={classes.cardHeader}>
+                    <h3 className={classes.cardTitle}>角色权限</h3>
+                </div>
+                <table className={classes.table}>
+                    <thead>
+                    <tr>
+                        <th className={classes.th}>角色</th>
+                        <th className={classes.th}>权限</th>
+                    </tr>
+                    </thead>
+                    <tbody>
+                    {roles.map(r => (
+                        <tr key={r.id}>
+                            <td className={classes.td}>{r.label}</td>
+                            <td className={classes.td}>
+                                {r.permissions.split(',')
+                                    .map(p => p.trim())
+                                    .filter(Boolean)
+                                    .map(p => (
+                                        <span key={p} className={classes.permTag}>
+                                            {PERM_LABELS[p] ?? p}
+                                        </span>
+                                    ))}
+                            </td>
+                        </tr>
+                    ))}
+                    </tbody>
+                </table>
+            </div>
+
+            {/* Create / Edit Dialog */}
+            {dialog.open && (
+                <div className={classes.overlay} onClick={e => e.target === e.currentTarget && closeDialog()}>
+                    <div className={classes.dialog}>
+                        <h3 className={classes.dialogTitle}>
+                            {dialog.mode === 'create' ? '添加用户' : `编辑用户: ${dialog.user?.username}`}
+                        </h3>
+
+                        {dialog.mode === 'create' && (
+                            <div className={classes.formRow}>
+                                <label className={classes.label}>用户名</label>
+                                <input
+                                    className={classes.input}
+                                    placeholder="请输入用户名"
+                                    value={dialog.username}
+                                    onChange={e => setDialog(d => ({...d, username: e.target.value}))}
+                                />
+                            </div>
+                        )}
+
+                        <div className={classes.formRow}>
+                            <label className={classes.label}>
+                                {dialog.mode === 'create' ? '密码' : '新密码（留空则不修改）'}
+                            </label>
+                            <input
+                                className={classes.input}
+                                type="password"
+                                placeholder={dialog.mode === 'create' ? '请输入密码' : '留空不修改'}
+                                value={dialog.password}
+                                onChange={e => setDialog(d => ({...d, password: e.target.value}))}
+                            />
+                        </div>
+
+                        <div className={classes.formRow}>
+                            <label className={classes.label}>角色</label>
+                            <select
+                                className={classes.select}
+                                value={dialog.roleId}
+                                onChange={e => setDialog(d => ({...d, roleId: Number(e.target.value)}))}
+                            >
+                                {roles.map(r => (
+                                    <option key={r.id} value={r.id}>{r.label}</option>
+                                ))}
+                            </select>
+                        </div>
+
+                        {dialog.mode === 'edit' && (
+                            <div className={classes.formRow}>
+                                <label className={classes.label}>状态</label>
+                                <div className={classes.checkboxRow}>
+                                    <input
+                                        type="checkbox"
+                                        id="active-check"
+                                        checked={dialog.active}
+                                        onChange={e => setDialog(d => ({...d, active: e.target.checked}))}
+                                    />
+                                    <label htmlFor="active-check" style={{color: '#555', fontSize: '14px', cursor: 'pointer'}}>
+                                        {dialog.active ? '启用' : '禁用'}
+                                    </label>
+                                </div>
+                            </div>
+                        )}
+
+                        <div className={classes.dialogActions}>
+                            <button className={classes.cancelBtn} onClick={closeDialog}>取消</button>
+                            <UButton onClick={handleSave} loading={saving}>
+                                {dialog.mode === 'create' ? '创建' : '保存'}
+                            </UButton>
+                        </div>
+                    </div>
+                </div>
+            )}
+
+            {/* Delete Confirm Dialog */}
+            {deleteTarget && (
+                <div className={classes.overlay} onClick={e => e.target === e.currentTarget && setDeleteTarget(null)}>
+                    <div className={classes.dialog}>
+                        <h3 className={classes.dialogTitle}>确认删除</h3>
+                        <p style={{color: '#555', marginTop: 0, marginBottom: '20px', fontSize: '14px'}}>
+                            确定要删除用户 <strong>{deleteTarget.username}</strong> 吗？此操作不可撤销。
+                        </p>
+                        <div className={classes.dialogActions}>
+                            <button className={classes.cancelBtn} onClick={() => setDeleteTarget(null)}>取消</button>
+                            <button className={classes.dangerBtn} onClick={handleDelete}>确认删除</button>
+                        </div>
+                    </div>
+                </div>
+            )}
+        </div>
+    );
+};

frontend/src/page/self/self.tsx

@@ -0,0 +1,429 @@
+import React, {useEffect, useState} from 'react';
+import {createUseStyles} from 'react-jss';
+import {tokenApi, ApiToken, CreateTokenRes} from '../../api/token.ts';
+import {message} from '../../hook/message/u-message.tsx';
+import {UButton} from '../../component/button/u-button.tsx';
+
+const useStyle = createUseStyles({
+    container: {
+        minHeight: '100vh',
+        backgroundColor: '#e3f2fd',
+        padding: '24px',
+        boxSizing: 'border-box',
+        fontFamily: "'Segoe UI', Arial, sans-serif",
+    },
+    header: {
+        display: 'flex',
+        alignItems: 'center',
+        gap: '16px',
+        marginBottom: '24px',
+    },
+    backBtn: {
+        background: 'transparent',
+        border: '2px solid #2c9678',
+        color: '#2c9678',
+        borderRadius: '6px',
+        padding: '6px 14px',
+        cursor: 'pointer',
+        fontSize: '14px',
+        transition: 'background-color 0.2s',
+        '&:hover': {backgroundColor: 'rgba(44,150,120,0.1)'},
+    },
+    title: {
+        color: '#2c9678',
+        margin: 0,
+        fontSize: '22px',
+        fontWeight: 600,
+    },
+    card: {
+        backgroundColor: '#C8E6C9',
+        boxShadow: 'inset 0 0 15px rgba(56, 142, 60, 0.15)',
+        borderRadius: '15px',
+        padding: '24px',
+        marginBottom: '24px',
+    },
+    cardTitle: {
+        color: '#2c9678',
+        marginTop: 0,
+        marginBottom: '16px',
+        fontSize: '16px',
+        fontWeight: 600,
+    },
+    table: {
+        width: '100%',
+        borderCollapse: 'collapse',
+        fontSize: '14px',
+    },
+    th: {
+        backgroundColor: 'rgba(44,150,120,0.15)',
+        padding: '10px 12px',
+        textAlign: 'left',
+        color: '#2c9678',
+        fontWeight: 600,
+        borderBottom: '2px solid rgba(44,150,120,0.3)',
+    },
+    td: {
+        padding: '10px 12px',
+        borderBottom: '1px solid rgba(44,150,120,0.2)',
+        color: '#333',
+    },
+    trHover: {
+        '&:hover': {backgroundColor: 'rgba(44,150,120,0.05)'},
+    },
+    emptyRow: {
+        textAlign: 'center',
+        color: '#888',
+        padding: '24px',
+    },
+    actionBtn: {
+        padding: '4px 12px',
+        borderRadius: '4px',
+        border: 'none',
+        cursor: 'pointer',
+        fontSize: '13px',
+        transition: 'opacity 0.2s',
+        '&:hover': {opacity: 0.8},
+    },
+    deleteBtn: {
+        backgroundColor: '#e53935',
+        color: 'white',
+    },
+    topBar: {
+        display: 'flex',
+        justifyContent: 'space-between',
+        alignItems: 'center',
+        marginBottom: '16px',
+    },
+    // Dialog overlay
+    overlay: {
+        position: 'fixed',
+        inset: 0,
+        backgroundColor: 'rgba(0,0,0,0.4)',
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+        zIndex: 1000,
+    },
+    dialog: {
+        backgroundColor: '#C8E6C9',
+        borderRadius: '15px',
+        padding: '28px',
+        width: '440px',
+        maxWidth: '90vw',
+        boxShadow: '0 8px 32px rgba(0,0,0,0.2)',
+    },
+    dialogTitle: {
+        color: '#2c9678',
+        marginTop: 0,
+        marginBottom: '20px',
+        fontSize: '16px',
+        fontWeight: 600,
+    },
+    label: {
+        display: 'block',
+        color: '#2c9678',
+        fontSize: '13px',
+        marginBottom: '6px',
+        fontWeight: 500,
+    },
+    input: {
+        width: '100%',
+        padding: '8px 12px',
+        borderRadius: '6px',
+        border: '1px solid rgba(44,150,120,0.4)',
+        fontSize: '14px',
+        marginBottom: '16px',
+        boxSizing: 'border-box',
+        backgroundColor: 'rgba(255,255,255,0.8)',
+        outline: 'none',
+        '&:focus': {borderColor: '#2c9678'},
+    },
+    dialogFooter: {
+        display: 'flex',
+        gap: '10px',
+        justifyContent: 'flex-end',
+    },
+    cancelBtn: {
+        padding: '8px 18px',
+        borderRadius: '6px',
+        border: '2px solid #2c9678',
+        background: 'transparent',
+        color: '#2c9678',
+        cursor: 'pointer',
+        fontSize: '14px',
+        '&:hover': {backgroundColor: 'rgba(44,150,120,0.1)'},
+    },
+    tokenValueBox: {
+        backgroundColor: 'rgba(255,255,255,0.9)',
+        borderRadius: '8px',
+        padding: '12px 14px',
+        fontFamily: 'monospace',
+        fontSize: '13px',
+        wordBreak: 'break-all',
+        marginBottom: '12px',
+        color: '#1a1a2e',
+        border: '1px solid rgba(44,150,120,0.4)',
+    },
+    warningText: {
+        color: '#e53935',
+        fontSize: '12px',
+        marginBottom: '16px',
+    },
+    copyBtn: {
+        padding: '8px 18px',
+        borderRadius: '6px',
+        border: 'none',
+        background: '#2c9678',
+        color: 'white',
+        cursor: 'pointer',
+        fontSize: '14px',
+        '&:hover': {backgroundColor: '#1f6d5a'},
+    },
+    usageCard: {
+        backgroundColor: 'rgba(255,255,255,0.5)',
+        borderRadius: '10px',
+        padding: '16px 20px',
+    },
+    usageTitle: {
+        color: '#2c9678',
+        margin: '0 0 10px',
+        fontSize: '14px',
+        fontWeight: 600,
+    },
+    pre: {
+        margin: '6px 0',
+        padding: '10px 14px',
+        backgroundColor: '#1a1a2e',
+        color: '#c3e88d',
+        borderRadius: '6px',
+        fontSize: '13px',
+        overflowX: 'auto',
+        fontFamily: 'monospace',
+    },
+});
+
+interface Session {
+    user_id: number;
+    username: string;
+    role_label: string;
+    permissions: string[];
+}
+
+export const SelfPage: React.FC = () => {
+    const style = useStyle();
+    const [session, setSession] = useState<Session | null>(null);
+    const [tokens, setTokens] = useState<ApiToken[]>([]);
+    const [loading, setLoading] = useState(true);
+    const [showCreate, setShowCreate] = useState(false);
+    const [newTokenName, setNewTokenName] = useState('');
+    const [creating, setCreating] = useState(false);
+    const [createdToken, setCreatedToken] = useState<CreateTokenRes | null>(null);
+
+    useEffect(() => {
+        fetch('/api/uauth/me')
+            .then(async res => {
+                if (!res.ok) {
+                    window.location.href = '/login';
+                    return;
+                }
+                const json = await res.json();
+                const s: Session = json.data;
+                setSession(s);
+                if (!s.permissions.includes('token_manage')) {
+                    message.warning('无 Token 管理权限');
+                    return;
+                }
+                return loadTokens();
+            })
+            .catch(() => {
+                window.location.href = '/login';
+            })
+            .finally(() => setLoading(false));
+    }, []);
+
+    async function loadTokens() {
+        try {
+            const list = await tokenApi.list();
+            setTokens(list ?? []);
+        } catch (e: unknown) {
+            message.error(e instanceof Error ? e.message : '加载失败');
+        }
+    }
+
+    async function handleCreate() {
+        if (!newTokenName.trim()) {
+            message.warning('请输入 Token 名称');
+            return;
+        }
+        setCreating(true);
+        try {
+            const res = await tokenApi.create(newTokenName.trim());
+            setCreatedToken(res);
+            setNewTokenName('');
+            setShowCreate(false);
+            await loadTokens();
+        } catch (e: unknown) {
+            message.error(e instanceof Error ? e.message : '创建失败');
+        } finally {
+            setCreating(false);
+        }
+    }
+
+    async function handleDelete(id: number, name: string) {
+        if (!confirm(`确认吊销 Token「${name}」？`)) return;
+        try {
+            await tokenApi.delete(id);
+            message.success('已吊销');
+            setTokens(prev => prev.filter(t => t.id !== id));
+        } catch (e: unknown) {
+            message.error(e instanceof Error ? e.message : '操作失败');
+        }
+    }
+
+    function handleCopyToken(val: string) {
+        navigator.clipboard.writeText(val)
+            .then(() => message.success('已复制到剪贴板'))
+            .catch(() => message.warning('复制失败，请手动复制'));
+    }
+
+    function formatDate(s: string | null) {
+        if (!s) return '-';
+        return new Date(s).toLocaleString();
+    }
+
+    const hasTokenPerm = session?.permissions.includes('token_manage') ?? false;
+
+    return (
+        <div className={style.container}>
+            <div className={style.header}>
+                <button className={style.backBtn} onClick={() => window.history.back()}>← 返回</button>
+                <h2 className={style.title}>个人中心</h2>
+            </div>
+
+            {!loading && session && (
+                <>
+                    {/* User info card */}
+                    <div className={style.card}>
+                        <h3 className={style.cardTitle}>账号信息</h3>
+                        <p style={{margin: '4px 0', color: '#333', fontSize: '14px'}}>
+                            用户名：<strong>{session.username}</strong>
+                        </p>
+                        <p style={{margin: '4px 0', color: '#333', fontSize: '14px'}}>
+                            角色：<strong>{session.role_label}</strong>
+                        </p>
+                    </div>
+
+                    {/* Token management card */}
+                    {hasTokenPerm && (
+                        <div className={style.card}>
+                            <div className={style.topBar}>
+                                <h3 className={style.cardTitle} style={{margin: 0}}>API Token</h3>
+                                <UButton onClick={() => setShowCreate(true)}>+ 新建 Token</UButton>
+                            </div>
+
+                            <table className={style.table}>
+                                <thead>
+                                <tr>
+                                    <th className={style.th}>名称</th>
+                                    <th className={style.th}>创建时间</th>
+                                    <th className={style.th}>最后使用</th>
+                                    <th className={style.th}>操作</th>
+                                </tr>
+                                </thead>
+                                <tbody>
+                                {tokens.length === 0 ? (
+                                    <tr>
+                                        <td className={style.td} colSpan={4} style={{textAlign: 'center', color: '#888'}}>
+                                            暂无 Token，点击「新建 Token」创建
+                                        </td>
+                                    </tr>
+                                ) : (
+                                    tokens.map(t => (
+                                        <tr key={t.id} className={style.trHover}>
+                                            <td className={style.td}>{t.name}</td>
+                                            <td className={style.td}>{formatDate(t.created_at)}</td>
+                                            <td className={style.td}>{formatDate(t.last_used_at)}</td>
+                                            <td className={style.td}>
+                                                <button
+                                                    className={`${style.actionBtn} ${style.deleteBtn}`}
+                                                    onClick={() => handleDelete(t.id, t.name)}
+                                                >
+                                                    吊销
+                                                </button>
+                                            </td>
+                                        </tr>
+                                    ))
+                                )}
+                                </tbody>
+                            </table>
+
+                            {/* Usage guide */}
+                            <div style={{marginTop: '20px'}}>
+                                <div className={style.usageCard}>
+                                    <p className={style.usageTitle}>使用方式（curl 示例）</p>
+                                    <pre className={style.pre}>{`curl -H "Authorization: Bearer <your_token>" \\
+     -T <file_path> \\
+     https://<your_domain>/api/v1/upload/<filename>`}</pre>
+                                    <p style={{margin: '8px 0 4px', color: '#555', fontSize: '13px'}}>返回示例：</p>
+                                    <pre className={style.pre}>{`{"status":200,"data":{"code":"ABCD1234"}}`}</pre>
+                                    <p style={{margin: '8px 0 4px', color: '#555', fontSize: '13px'}}>下载文件：</p>
+                                    <pre className={style.pre}>{`https://<your_domain>/ushare/<code>`}</pre>
+                                </div>
+                            </div>
+                        </div>
+                    )}
+
+                    {!hasTokenPerm && (
+                        <div className={style.card}>
+                            <p style={{color: '#888', margin: 0}}>当前角色无 Token 管理权限</p>
+                        </div>
+                    )}
+                </>
+            )}
+
+            {/* Create token dialog */}
+            {showCreate && (
+                <div className={style.overlay} onClick={() => setShowCreate(false)}>
+                    <div className={style.dialog} onClick={e => e.stopPropagation()}>
+                        <h3 className={style.dialogTitle}>新建 API Token</h3>
+                        <label className={style.label}>Token 名称</label>
+                        <input
+                            className={style.input}
+                            placeholder="例：服务器上传脚本"
+                            value={newTokenName}
+                            onChange={e => setNewTokenName(e.target.value)}
+                            onKeyDown={e => e.key === 'Enter' && handleCreate()}
+                            autoFocus
+                        />
+                        <div className={style.dialogFooter}>
+                            <button className={style.cancelBtn} onClick={() => setShowCreate(false)}>取消</button>
+                            <UButton onClick={handleCreate} loading={creating} disabled={creating}>
+                                创建
+                            </UButton>
+                        </div>
+                    </div>
+                </div>
+            )}
+
+            {/* Newly created token display - shown only once */}
+            {createdToken && (
+                <div className={style.overlay} onClick={() => setCreatedToken(null)}>
+                    <div className={style.dialog} onClick={e => e.stopPropagation()}>
+                        <h3 className={style.dialogTitle}>Token 已创建</h3>
+                        <p className={style.warningText}>
+                            请立即复制并妥善保存，Token 值仅显示一次，关闭后无法再次查看！
+                        </p>
+                        <label className={style.label}>Token 名称：{createdToken.name}</label>
+                        <div className={style.tokenValueBox}>{createdToken.token}</div>
+                        <div className={style.dialogFooter}>
+                            <button className={style.cancelBtn} onClick={() => setCreatedToken(null)}>关闭</button>
+                            <button className={style.copyBtn} onClick={() => handleCopyToken(createdToken.token)}>
+                                复制 Token
+                            </button>
+                        </div>
+                    </div>
+                </div>
+            )}
+        </div>
+    );
+};

frontend/src/page/share/component/panel-left.tsx

@@ -1,6 +1,6 @@
 import {createUseStyles} from "react-jss";
 import {UButton} from "../../../component/button/u-button.tsx";
-import React, {useState} from "react";
+import React, {useEffect, useState} from "react";
 import {useStore} from "../../../store/share.ts";
 import {message} from "../../../hook/message/u-message.tsx";
 import {useFileUpload} from "../../../api/upload.ts";
@@ -11,6 +11,12 @@ const useUploadStyle = createUseStyles({
         display: "flex",
         justifyContent: "center",
         alignItems: "center",
+        minHeight: "50vh",
+
+        "@media (max-width: 768px)": {
+            minHeight: "auto",
+            padding: "20px 10px",
+        },
     },
     form: {
         backgroundColor: "#C8E6C9",
@@ -19,10 +25,20 @@ const useUploadStyle = createUseStyles({
         borderRadius: "15px",
         width: "70%",
         margin: "20px 60px 20px 0",
-        /*todo margin 不用 px*/
+
+        "@media (max-width: 768px)": {
+            width: "90%",
+            margin: "20px 0",
+            padding: "20px",
+        },
     },
     title: {
-        color: "#2c9678"
+        color: "#2c9678",
+
+        "@media (max-width: 768px)": {
+            fontSize: "1.5rem",
+            marginBottom: "15px",
+        },
     },
     file: {
         display: 'none',
@@ -33,13 +49,33 @@ const useUploadStyle = createUseStyles({
     },
     name: {
         color: "#2c9678",
-        marginLeft: '10px'
+        marginLeft: '10px',
+
+        "@media (max-width: 768px)": {
+            fontSize: "14px",
+        },
     },
     clean: {
         borderRadius: '50%',
         cursor: 'pointer',
         '&:hover': {}
-    }
+    },
+    adminLink: {
+        display: 'block',
+        textAlign: 'center',
+        marginTop: '16px',
+        color: '#2c9678',
+        fontSize: '12px',
+        textDecoration: 'none',
+        opacity: 0.8,
+        '&:hover': {opacity: 1, textDecoration: 'underline'},
+    },
+    navLinks: {
+        display: 'flex',
+        justifyContent: 'center',
+        gap: '16px',
+        marginTop: '16px',
+    },
 })
 
 const useShowStyle = createUseStyles({
@@ -48,14 +84,12 @@ const useShowStyle = createUseStyles({
         display: "flex",
         justifyContent: "center",
         alignItems: "center",
-        position: "relative", // 为关闭按钮提供定位基准
-    },
-    title: {
-        color: "#2c9678",
-        marginTop: 0,
-        display: "flex",
-        justifyContent: "space-between",
-        alignItems: "center",
+        minHeight: "50vh",
+
+        "@media (max-width: 768px)": {
+            minHeight: "auto",
+            padding: "20px 10px",
+        },
     },
     form: {
         backgroundColor: "#C8E6C9",
@@ -65,6 +99,25 @@ const useShowStyle = createUseStyles({
         width: "70%",
         margin: "20px 60px 20px 0",
         position: "relative",
+
+        "@media (max-width: 768px)": {
+            width: "90%",
+            margin: "20px 0",
+            padding: "20px",
+        },
+    },
+    title: {
+        color: "#2c9678",
+        marginTop: 0,
+        marginBottom: "25px",
+        display: "flex",
+        justifyContent: "space-between",
+        alignItems: "center",
+
+        "@media (max-width: 768px)": {
+            fontSize: "1.5rem",
+            marginBottom: "15px",
+        },
     },
     closeButton: {
         position: "absolute",
@@ -78,9 +131,7 @@ const useShowStyle = createUseStyles({
         height: "24px",
         cursor: "pointer",
         "&:hover": {
-            // background: "#cc0000",
             boxShadow:  "20px 20px 60px #fff, -20px -20px 60px #fff",
-            // boxShadow:  "20px 20px 60px #eee",
         },
     },
     codeWrapper: {
@@ -89,6 +140,10 @@ const useShowStyle = createUseStyles({
         borderRadius: "8px",
         margin: "15px 0",
         overflowX: "auto",
+
+        "@media (max-width: 768px)": {
+            padding: "0 10px",
+        },
     },
     pre: {
         display: 'flex',
@@ -98,6 +153,12 @@ const useShowStyle = createUseStyles({
         height: '24px',
         "& > code": {
             marginLeft: "0",
+            fontSize: "14px",
+            wordBreak: "break-all",
+
+            "@media (max-width: 768px)": {
+                fontSize: "12px",
+            },
         }
     },
     copyButton: {
@@ -112,6 +173,11 @@ const useShowStyle = createUseStyles({
         "&:hover": {
             background: "#1f6d5a",
         },
+
+        "@media (max-width: 768px)": {
+            padding: "6px 12px",
+            fontSize: "12px",
+        },
     },
 });
 
@@ -129,6 +195,19 @@ const PanelLeftUpload: React.FC<{ set_code: (code:string) => void }> = ({set_cod
     const style = useUploadStyle()
     const {file, setFile} = useStore()
     const {uploadFile, progress, loading} = useFileUpload();
+    const [isAdmin, setIsAdmin] = useState(false);
+    const [hasTokenPerm, setHasTokenPerm] = useState(false);
+
+    useEffect(() => {
+        fetch('/api/uauth/me').then(async res => {
+            if (res.ok) {
+                const json = await res.json();
+                const perms: string[] = json.data?.permissions ?? [];
+                setIsAdmin(perms.includes('user_manage'));
+                setHasTokenPerm(perms.includes('token_manage'));
+            }
+        }).catch(() => {});
+    }, []);
 
     function onFileSelect() {
         // @ts-ignore
@@ -175,6 +254,12 @@ const PanelLeftUpload: React.FC<{ set_code: (code:string) => void }> = ({set_cod
                     <div className={style.name}>{file.name}</div>
                 </div>
             }
+            {isAdmin && (
+                <a href="/admin" className={style.adminLink}>管理控制台</a>
+            )}
+            {hasTokenPerm && (
+                <a href="/self" className={style.adminLink}>个人中心 / API Token</a>
+            )}
         </div>
     </div>
 }

frontend/src/page/share/component/panel-mid.tsx

@@ -5,6 +5,10 @@ const useStyle = createUseStyles({
         backgroundColor: 'lightgray',
         position: "relative",
         overflow: "hidden",
+
+        "@media (max-width: 768px)": {
+            display: "none",
+        },
     },
     left: {
         backgroundColor: "#e3f2fd",

frontend/src/page/share/component/panel-right.tsx

@@ -1,6 +1,6 @@
-import {createUseStyles} from "react-jss";
-import {UButton} from "../../../component/button/u-button.tsx";
-import {useStore} from "../../../store/share.ts";
+import { createUseStyles } from "react-jss";
+import { UButton } from "../../../component/button/u-button.tsx";
+import { useStore } from "../../../store/share.ts";
 
 const useStyle = createUseStyles({
     container: {
@@ -8,6 +8,12 @@ const useStyle = createUseStyles({
         display: "flex",
         justifyContent: "center",
         alignItems: "center",
+        minHeight: "50vh",
+
+        "@media (max-width: 768px)": {
+            minHeight: "auto",
+            padding: "20px 10px",
+        },
     },
     form: {
         backgroundColor: "#BBDEFB",
@@ -16,25 +22,58 @@ const useStyle = createUseStyles({
         borderRadius: "15px",
         width: "70%",
         margin: "20px 0 20px 60px",
-        /*todo margin 不用 px*/
+
+        "@media (max-width: 768px)": {
+            width: "90%",
+            margin: "20px 0",
+            padding: "20px",
+        },
     },
     title: {
-        color: '#1661ab', // 靛青
+        color: '#1661ab',
+
+        "@media (max-width: 768px)": {
+            fontSize: "1.5rem",
+            marginBottom: "15px",
+        },
     },
     code: {
         padding: '11px',
-        margin: '20px 0',
+        margin: '0',
         width: '200px',
         border: '2px solid #ddd',
         borderRadius: '5px',
         '&:active': {
             border: '2px solid #1661ab',
-        }
-    }
+        },
+
+        "@media (max-width: 768px)": {
+            width: '100%',
+            boxSizing: 'border-box',
+            padding: '10px',
+            fontSize: '14px',
+        },
+    },
+    inputContainer: {
+        display: 'flex',
+        gap: '10px',
+
+        "@media (max-width: 768px)": {
+            flexDirection: 'column',
+            alignItems: 'stretch',
+        },
+    },
+    buttonContainer: {
+        display: 'flex',
+
+        "@media (max-width: 768px)": {
+            justifyContent: 'left',
+        },
+    },
 })
 export const PanelRight = () => {
     const style = useStyle()
-    const {code, setCode} = useStore()
+    const { code, setCode } = useStore()
 
     function onCodeChange(e: React.ChangeEvent<HTMLInputElement>) {
         setCode(e.currentTarget.value)
@@ -52,7 +91,7 @@ export const PanelRight = () => {
     return <div className={style.container}>
         <div className={style.form}>
             <h2 className={style.title}>获取文件</h2>
-            <div>
+            <div className={style.inputContainer}>
                 <input
                     type="text"
                     className={style.code}
@@ -60,7 +99,9 @@ export const PanelRight = () => {
                     value={code}
                     onChange={onCodeChange}
                 />
-                <UButton style={{marginLeft: '10px'}} onClick={onFetchFile}>获取文件</UButton>
+                <div className={style.buttonContainer}>
+                    <UButton onClick={onFetchFile}>获取文件</UButton>
+                </div>
             </div>
         </div>
     </div>

frontend/src/page/share/share.tsx

@@ -13,6 +13,12 @@ const useStyle = createUseStyles({
         height: "100vh",
         display: "grid",
         gridTemplateColumns: "40% 20% 40%",
+
+        "@media (max-width: 768px)": {
+            gridTemplateColumns: "100%",
+            gridTemplateRows: "auto auto",
+            overflowY: "auto",
+        },
     },
 })
 
@@ -20,7 +26,7 @@ export const FileSharing = () => {
     const style = useStyle()
         return <div className={style.container}>
         <PanelLeft />
-        <PanelMid/>
+        <PanelMid />
         <PanelRight/>
     </div>
 };

internal/api/api.go

@@ -9,6 +9,7 @@ import (
 	"github.com/loveuer/nf/nft/log"
 	"github.com/loveuer/nf/nft/tool"
 	"github.com/loveuer/ushare/internal/handler"
+	"github.com/loveuer/ushare/internal/model"
 	"github.com/loveuer/ushare/internal/opt"
 )
 
@@ -19,11 +20,16 @@ func Start(ctx context.Context) <-chan struct{} {
 		return c.SendStatus(http.StatusOK)
 	})
 
-	app.Get("/ushare/:code", handler.Fetch())
-	app.Put("/api/ushare/:filename", handler.AuthVerify(), handler.ShareNew()) // 获取上传 code, 分片大小
-	app.Post("/api/ushare/:code", handler.ShareUpload())                       // 分片上传接口
+	// Auth
 	app.Post("/api/uauth/login", handler.AuthLogin())
+	app.Get("/api/uauth/me", handler.AuthVerify(), handler.AuthMe())
 
+	// File sharing
+	app.Get("/ushare/:code", handler.Fetch())
+	app.Put("/api/ushare/:filename", handler.AuthVerify(), handler.AuthPermission(model.PermUpload), handler.ShareNew())
+	app.Post("/api/ushare/:code", handler.ShareUpload())
+
+	// Local sharing (WebRTC signaling)
 	{
 		api := app.Group("/api/ulocal")
 		api.Post("/register", handler.LocalRegister())
@@ -34,7 +40,28 @@ func Start(ctx context.Context) <-chan struct{} {
 		api.Get("/ws", handler.LocalWS())
 	}
 
-	// 静态文件服务 - 作为中间件处理
+	// Admin
+	{
+		api := app.Group("/api/admin")
+		api.Get("/users", handler.AuthVerify(), handler.AuthPermission(model.PermUserManage), handler.AdminListUsers())
+		api.Post("/users", handler.AuthVerify(), handler.AuthPermission(model.PermUserManage), handler.AdminCreateUser())
+		api.Put("/users/:id", handler.AuthVerify(), handler.AuthPermission(model.PermUserManage), handler.AdminUpdateUser())
+		api.Delete("/users/:id", handler.AuthVerify(), handler.AuthPermission(model.PermUserManage), handler.AdminDeleteUser())
+		api.Get("/roles", handler.AuthVerify(), handler.AuthPermission(model.PermUserManage), handler.AdminListRoles())
+	}
+
+	// Token management
+	{
+		api := app.Group("/api/token")
+		api.Get("", handler.AuthVerify(), handler.AuthPermission(model.PermTokenManage), handler.TokenList())
+		api.Post("", handler.AuthVerify(), handler.AuthPermission(model.PermTokenManage), handler.TokenCreate())
+		api.Delete("", handler.AuthVerify(), handler.AuthPermission(model.PermTokenManage), handler.TokenDelete())
+	}
+
+	// API v1 - token-authenticated file upload
+	app.Put("/api/v1/upload/:filename", handler.AuthVerify(), handler.AuthPermission(model.PermUpload), handler.ShareAPIUpload())
+
+	// Frontend static files
 	app.Use(handler.ServeFrontendMiddleware())
 
 	ready := make(chan struct{})

internal/controller/token.go

@@ -0,0 +1,105 @@
+package controller
+
+import (
+	"strings"
+	"time"
+
+	"github.com/loveuer/ushare/internal/model"
+	"github.com/loveuer/ushare/internal/pkg/db"
+	"github.com/loveuer/ushare/internal/pkg/tool"
+	"github.com/pkg/errors"
+)
+
+type tokenManager struct{}
+
+var TokenManager = &tokenManager{}
+
+// List returns all tokens belonging to a user (token value is not exposed).
+func (tm *tokenManager) List(userID uint) ([]model.Token, error) {
+	var tokens []model.Token
+	if err := db.Default.Session().Where("user_id = ?", userID).Order("created_at desc").Find(&tokens).Error; err != nil {
+		return nil, errors.Wrap(err, "list tokens failed")
+	}
+	return tokens, nil
+}
+
+// Create generates a new API token for the given user and returns the full token value (only shown once).
+func (tm *tokenManager) Create(userID uint, name string) (*model.Token, string, error) {
+	name = strings.TrimSpace(name)
+	if name == "" {
+		return nil, "", errors.New("token 名称不能为空")
+	}
+
+	rawToken := model.TokenPrefix + tool.RandomString(32)
+
+	t := &model.Token{
+		UserID: userID,
+		Name:   name,
+		Token:  rawToken,
+	}
+
+	if err := db.Default.Session().Create(t).Error; err != nil {
+		return nil, "", errors.Wrap(err, "create token failed")
+	}
+
+	return t, rawToken, nil
+}
+
+// Delete removes a token by ID, only if it belongs to the given user.
+func (tm *tokenManager) Delete(userID uint, tokenID uint) error {
+	result := db.Default.Session().
+		Where("id = ? AND user_id = ?", tokenID, userID).
+		Delete(&model.Token{})
+
+	if result.Error != nil {
+		return errors.Wrap(result.Error, "delete token failed")
+	}
+
+	if result.RowsAffected == 0 {
+		return errors.New("token 不存在或无权限删除")
+	}
+
+	return nil
+}
+
+// Verify looks up a DB API token and returns a Session if valid.
+func (tm *tokenManager) Verify(rawToken string) (*model.Session, error) {
+	var t model.Token
+	if err := db.Default.Session().Where("token = ?", rawToken).First(&t).Error; err != nil {
+		return nil, errors.New("无效的 API Token")
+	}
+
+	if t.ExpiresAt != nil && time.Now().After(*t.ExpiresAt) {
+		return nil, errors.New("API Token 已过期")
+	}
+
+	var user model.User
+	if err := db.Default.Session().First(&user, t.UserID).Error; err != nil {
+		return nil, errors.New("Token 关联用户不存在")
+	}
+
+	if !user.Active {
+		return nil, errors.New("账号已被禁用")
+	}
+
+	var role model.Role
+	if err := db.Default.Session().First(&role, user.RoleID).Error; err != nil {
+		return nil, errors.New("账号角色异常")
+	}
+
+	// Update last_used_at asynchronously
+	now := time.Now()
+	go db.Default.Session().Model(&t).Update("last_used_at", now) //nolint:errcheck
+
+	session := &model.Session{
+		UserID:      user.ID,
+		Username:    user.Username,
+		Role:        role.Name,
+		RoleLabel:   role.Label,
+		Permissions: role.PermissionList(),
+		LoginAt:     now.Unix(),
+		Token:       rawToken,
+	}
+
+	return session, nil
+}

internal/controller/user.go

@@ -2,75 +2,153 @@ package controller
 
 import (
 	"context"
-	"github.com/loveuer/ushare/internal/model"
-	"github.com/loveuer/ushare/internal/opt"
-	"github.com/loveuer/ushare/internal/pkg/tool"
-	"github.com/pkg/errors"
+	"strings"
 	"sync"
 	"time"
+
+	"github.com/loveuer/nf/nft/log"
+	"github.com/loveuer/ushare/internal/model"
+	"github.com/loveuer/ushare/internal/opt"
+	"github.com/loveuer/ushare/internal/pkg/db"
+	"github.com/loveuer/ushare/internal/pkg/tool"
+	"github.com/pkg/errors"
 )
 
 type userManager struct {
 	sync.Mutex
-	ctx context.Context
-	um  map[string]*model.User
+	ctx      context.Context
+	sessions map[string]*model.Session
 }
 
-func (um *userManager) Login(username string, password string) (*model.User, error) {
-	var (
-		now = time.Now()
-	)
+var UserManager = &userManager{
+	sessions: make(map[string]*model.Session),
+}
 
-	if username != opt.Cfg.Username {
-		return nil, errors.New("账号或密码错误")
+func (um *userManager) seed(ctx context.Context) error {
+	// Seed default roles if they don't exist
+	defaultRoles := []model.Role{
+		{
+			Name:        model.RoleAdmin,
+			Label:       "管理员",
+			Permissions: strings.Join([]string{model.PermUserManage, model.PermUpload, model.PermTokenManage}, ","),
+		},
+		{
+			Name:        model.RoleUser,
+			Label:       "用户",
+			Permissions: model.PermUpload,
+		},
 	}
 
-	if !tool.ComparePassword(password, opt.Cfg.Password) {
-		return nil, errors.New("账号或密码错误")
+	for i := range defaultRoles {
+		role := &defaultRoles[i]
+		var existing model.Role
+		if err := db.Default.Session(ctx).Where("name = ?", role.Name).First(&existing).Error; err != nil {
+			if err := db.Default.Session(ctx).Create(role).Error; err != nil {
+				return errors.Wrap(err, "seed role failed")
+			}
+			log.Debug("controller.userManager.seed: created role %s", role.Name)
+		}
 	}
 
-	op := &model.User{
-		Id:       1,
+	// Seed default admin user only if no users exist
+	var count int64
+	db.Default.Session(ctx).Model(&model.User{}).Count(&count)
+	if count > 0 {
+		return nil
+	}
+
+	var adminRole model.Role
+	if err := db.Default.Session(ctx).Where("name = ?", model.RoleAdmin).First(&adminRole).Error; err != nil {
+		return errors.Wrap(err, "get admin role failed")
+	}
+
+	username := opt.Cfg.Username
+	if username == "" {
+		username = "admin"
+	}
+
+	// opt.Cfg.Password is already hashed by opt.Init(); store it directly.
+	adminUser := &model.User{
 		Username: username,
-		LoginAt:  now.Unix(),
-		Token:    tool.RandomString(32),
+		Password: opt.Cfg.Password,
+		RoleID:   adminRole.ID,
+		Active:   true,
+	}
+
+	if err := db.Default.Session(ctx).Create(adminUser).Error; err != nil {
+		return errors.Wrap(err, "seed admin user failed")
+	}
+
+	log.Debug("controller.userManager.seed: created admin user %s", username)
+	return nil
+}
+
+func (um *userManager) Login(username, password string) (*model.Session, error) {
+	now := time.Now()
+
+	user := new(model.User)
+	if err := db.Default.Session().
+		Where("username = ? AND active = ?", username, true).
+		First(user).Error; err != nil {
+		return nil, errors.New("账号或密码错误")
+	}
+
+	if !tool.ComparePassword(password, user.Password) {
+		return nil, errors.New("账号或密码错误")
+	}
+
+	var role model.Role
+	if err := db.Default.Session().First(&role, user.RoleID).Error; err != nil {
+		return nil, errors.New("账号角色异常，请联系管理员")
+	}
+
+	session := &model.Session{
+		UserID:      user.ID,
+		Username:    user.Username,
+		Role:        role.Name,
+		RoleLabel:   role.Label,
+		Permissions: role.PermissionList(),
+		LoginAt:     now.Unix(),
+		Token:       tool.RandomString(32),
 	}
 
 	um.Lock()
 	defer um.Unlock()
-	um.um[op.Token] = op
+	um.sessions[session.Token] = session
 
-	return op, nil
+	return session, nil
 }
 
-func (um *userManager) Verify(token string) (*model.User, error) {
+func (um *userManager) Verify(token string) (*model.Session, error) {
 	um.Lock()
 	defer um.Unlock()
 
-	op, ok := um.um[token]
+	session, ok := um.sessions[token]
 	if !ok {
 		return nil, errors.New("未登录或凭证已失效, 请重新登录")
 	}
 
-	return op, nil
+	return session, nil
 }
 
 func (um *userManager) Start(ctx context.Context) {
 	um.ctx = ctx
 
+	if err := um.seed(ctx); err != nil {
+		log.Fatal("controller.userManager.Start: seed failed: %s", err.Error())
+	}
+
 	go func() {
-
 		ticker := time.NewTicker(time.Minute)
-
 		for {
 			select {
 			case <-um.ctx.Done():
 				return
 			case now := <-ticker.C:
 				um.Lock()
-				for _, op := range um.um {
-					if now.Sub(time.UnixMilli(op.LoginAt)) > 8*time.Hour {
-						delete(um.um, op.Token)
+				for token, session := range um.sessions {
+					if now.Unix()-session.LoginAt > 8*3600 {
+						delete(um.sessions, token)
 					}
 				}
 				um.Unlock()
@@ -78,9 +156,3 @@ func (um *userManager) Start(ctx context.Context) {
 		}
 	}()
 }
-
-var (
-	UserManager = &userManager{
-		um: make(map[string]*model.User),
-	}
-)

internal/handler/admin.go

@@ -0,0 +1,271 @@
+package handler
+
+import (
+	"net/http"
+	"strings"
+	"time"
+
+	"github.com/loveuer/nf"
+	"github.com/loveuer/nf/nft/log"
+	"github.com/loveuer/ushare/internal/model"
+	"github.com/loveuer/ushare/internal/pkg/db"
+	"github.com/loveuer/ushare/internal/pkg/tool"
+	"github.com/spf13/cast"
+)
+
+// userResp is the JSON response shape for a user including role info,
+// built manually at the business layer instead of relying on GORM associations.
+type userResp struct {
+	ID        uint       `json:"id"`
+	Username  string     `json:"username"`
+	RoleID    uint       `json:"role_id"`
+	Role      model.Role `json:"role"`
+	Active    bool       `json:"active"`
+	CreatedAt time.Time  `json:"created_at"`
+	UpdatedAt time.Time  `json:"updated_at"`
+}
+
+func toUserResp(u model.User, r model.Role) userResp {
+	return userResp{
+		ID:        u.ID,
+		Username:  u.Username,
+		RoleID:    u.RoleID,
+		Role:      r,
+		Active:    u.Active,
+		CreatedAt: u.CreatedAt,
+		UpdatedAt: u.UpdatedAt,
+	}
+}
+
+func AdminListUsers() nf.HandlerFunc {
+	return func(c *nf.Ctx) error {
+		var users []model.User
+		if err := db.Default.Session().Find(&users).Error; err != nil {
+			log.Error("handler.AdminListUsers: %s", err.Error())
+			return c.Status(http.StatusInternalServerError).JSON(map[string]string{"msg": "查询失败"})
+		}
+
+		// Collect unique role IDs and query them in one shot
+		roleIDSet := make(map[uint]struct{})
+		for _, u := range users {
+			roleIDSet[u.RoleID] = struct{}{}
+		}
+		roleIDs := make([]uint, 0, len(roleIDSet))
+		for id := range roleIDSet {
+			roleIDs = append(roleIDs, id)
+		}
+
+		var roles []model.Role
+		if err := db.Default.Session().Where("id IN ?", roleIDs).Find(&roles).Error; err != nil {
+			log.Error("handler.AdminListUsers: query roles: %s", err.Error())
+			return c.Status(http.StatusInternalServerError).JSON(map[string]string{"msg": "查询失败"})
+		}
+
+		roleMap := make(map[uint]model.Role, len(roles))
+		for _, r := range roles {
+			roleMap[r.ID] = r
+		}
+
+		resp := make([]userResp, 0, len(users))
+		for _, u := range users {
+			resp = append(resp, toUserResp(u, roleMap[u.RoleID]))
+		}
+
+		return c.Status(http.StatusOK).JSON(map[string]any{"data": resp})
+	}
+}
+
+func AdminCreateUser() nf.HandlerFunc {
+	return func(c *nf.Ctx) error {
+		type Req struct {
+			Username string `json:"username"`
+			Password string `json:"password"`
+			RoleID   uint   `json:"role_id"`
+		}
+
+		var req Req
+		if err := c.BodyParser(&req); err != nil {
+			return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": "参数错误"})
+		}
+
+		req.Username = strings.TrimSpace(req.Username)
+		if req.Username == "" {
+			return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": "用户名不能为空"})
+		}
+		if req.Password == "" {
+			return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": "密码不能为空"})
+		}
+		if req.RoleID == 0 {
+			return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": "角色不能为空"})
+		}
+
+		if err := tool.CheckPassword(req.Password); err != nil {
+			return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": err.Error()})
+		}
+
+		var count int64
+		db.Default.Session().Model(&model.User{}).Where("username = ?", req.Username).Count(&count)
+		if count > 0 {
+			return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": "用户名已存在"})
+		}
+
+		var role model.Role
+		if err := db.Default.Session().First(&role, req.RoleID).Error; err != nil {
+			return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": "无效的角色"})
+		}
+
+		user := &model.User{
+			Username: req.Username,
+			Password: tool.NewPassword(req.Password),
+			RoleID:   req.RoleID,
+			Active:   true,
+		}
+
+		if err := db.Default.Session().Create(user).Error; err != nil {
+			log.Error("handler.AdminCreateUser: %s", err.Error())
+			return c.Status(http.StatusInternalServerError).JSON(map[string]string{"msg": "创建用户失败"})
+		}
+
+		return c.Status(http.StatusOK).JSON(map[string]any{"data": toUserResp(*user, role)})
+	}
+}
+
+func AdminUpdateUser() nf.HandlerFunc {
+	return func(c *nf.Ctx) error {
+		type Req struct {
+			RoleID   *uint  `json:"role_id"`
+			Active   *bool  `json:"active"`
+			Password string `json:"password"`
+		}
+
+		id, err := cast.ToUintE(c.Param("id"))
+		if err != nil {
+			return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": "无效的用户ID"})
+		}
+
+		var req Req
+		if err := c.BodyParser(&req); err != nil {
+			return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": "参数错误"})
+		}
+
+		session := c.Locals("user").(*model.Session)
+
+		var user model.User
+		if err := db.Default.Session().First(&user, id).Error; err != nil {
+			return c.Status(http.StatusNotFound).JSON(map[string]string{"msg": "用户不存在"})
+		}
+
+		var currentRole model.Role
+		if err := db.Default.Session().First(&currentRole, user.RoleID).Error; err != nil {
+			return c.Status(http.StatusInternalServerError).JSON(map[string]string{"msg": "查询角色失败"})
+		}
+
+		updates := map[string]any{}
+
+		if req.RoleID != nil && *req.RoleID != user.RoleID {
+			var newRole model.Role
+			if err := db.Default.Session().First(&newRole, *req.RoleID).Error; err != nil {
+				return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": "无效的角色"})
+			}
+			// If demoting from admin, ensure at least one other active admin remains
+			if currentRole.Name == model.RoleAdmin && newRole.Name != model.RoleAdmin {
+				var adminCount int64
+				db.Default.Session().Model(&model.User{}).
+					Where("role_id = ? AND active = ? AND id != ?", user.RoleID, true, id).
+					Count(&adminCount)
+				if adminCount == 0 {
+					return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": "无法更改角色: 系统中至少需要一个管理员"})
+				}
+			}
+			updates["role_id"] = *req.RoleID
+			currentRole = newRole
+		}
+
+		if req.Active != nil && *req.Active != user.Active {
+			if user.ID == session.UserID && !*req.Active {
+				return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": "不能禁用自己的账号"})
+			}
+			if currentRole.Name == model.RoleAdmin && !*req.Active {
+				var adminCount int64
+				db.Default.Session().Model(&model.User{}).
+					Where("role_id = ? AND active = ? AND id != ?", user.RoleID, true, id).
+					Count(&adminCount)
+				if adminCount == 0 {
+					return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": "无法禁用: 系统中至少需要一个启用的管理员"})
+				}
+			}
+			updates["active"] = *req.Active
+		}
+
+		if req.Password != "" {
+			if err := tool.CheckPassword(req.Password); err != nil {
+				return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": err.Error()})
+			}
+			updates["password"] = tool.NewPassword(req.Password)
+		}
+
+		if len(updates) == 0 {
+			return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": "没有需要更新的字段"})
+		}
+
+		if err := db.Default.Session().Model(&user).Updates(updates).Error; err != nil {
+			log.Error("handler.AdminUpdateUser: %s", err.Error())
+			return c.Status(http.StatusInternalServerError).JSON(map[string]string{"msg": "更新失败"})
+		}
+
+		return c.Status(http.StatusOK).JSON(map[string]any{"data": toUserResp(user, currentRole)})
+	}
+}
+
+func AdminDeleteUser() nf.HandlerFunc {
+	return func(c *nf.Ctx) error {
+		id, err := cast.ToUintE(c.Param("id"))
+		if err != nil {
+			return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": "无效的用户ID"})
+		}
+
+		session := c.Locals("user").(*model.Session)
+		if session.UserID == id {
+			return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": "不能删除自己的账号"})
+		}
+
+		var user model.User
+		if err := db.Default.Session().First(&user, id).Error; err != nil {
+			return c.Status(http.StatusNotFound).JSON(map[string]string{"msg": "用户不存在"})
+		}
+
+		// Prevent deleting the last admin: check via role name
+		var userRole model.Role
+		if err := db.Default.Session().First(&userRole, user.RoleID).Error; err != nil {
+			return c.Status(http.StatusInternalServerError).JSON(map[string]string{"msg": "查询角色失败"})
+		}
+
+		if userRole.Name == model.RoleAdmin {
+			var adminCount int64
+			db.Default.Session().Model(&model.User{}).
+				Where("role_id = ? AND id != ?", user.RoleID, id).
+				Count(&adminCount)
+			if adminCount == 0 {
+				return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": "无法删除最后一个管理员"})
+			}
+		}
+
+		if err := db.Default.Session().Delete(&user).Error; err != nil {
+			log.Error("handler.AdminDeleteUser: %s", err.Error())
+			return c.Status(http.StatusInternalServerError).JSON(map[string]string{"msg": "删除失败"})
+		}
+
+		return c.Status(http.StatusOK).JSON(map[string]any{"data": "ok"})
+	}
+}
+
+func AdminListRoles() nf.HandlerFunc {
+	return func(c *nf.Ctx) error {
+		var roles []model.Role
+		if err := db.Default.Session().Find(&roles).Error; err != nil {
+			log.Error("handler.AdminListRoles: %s", err.Error())
+			return c.Status(http.StatusInternalServerError).JSON(map[string]string{"msg": "查询失败"})
+		}
+		return c.Status(http.StatusOK).JSON(map[string]any{"data": roles})
+	}
+}

internal/handler/auth.go

@@ -2,45 +2,82 @@ package handler
 
 import (
 	"fmt"
+	"net/http"
+	"strings"
+
 	"github.com/loveuer/nf"
 	"github.com/loveuer/ushare/internal/controller"
 	"github.com/loveuer/ushare/internal/model"
-	"github.com/loveuer/ushare/internal/opt"
-	"net/http"
 )
 
 func AuthVerify() nf.HandlerFunc {
 	tokenFn := func(c *nf.Ctx) (token string) {
-		if token = c.Get("Authorization"); token != "" {
-			return
+		if raw := c.Get("Authorization"); raw != "" {
+			// Strip "Bearer " prefix if present
+			if strings.HasPrefix(raw, "Bearer ") {
+				return strings.TrimPrefix(raw, "Bearer ")
+			}
+			return raw
 		}
-
 		token = c.Cookies("ushare")
-
 		return
 	}
 
 	return func(c *nf.Ctx) error {
-		if opt.Cfg.Username == "" || opt.Cfg.Password == "" {
-			return c.Next()
-		}
-
 		token := tokenFn(c)
 		if token == "" {
 			return c.Status(http.StatusUnauthorized).JSON(map[string]string{"error": "unauthorized"})
 		}
 
-		op, err := controller.UserManager.Verify(token)
+		var (
+			session *model.Session
+			err     error
+		)
+
+		// API tokens have the "ust_" prefix; session tokens do not.
+		if strings.HasPrefix(token, model.TokenPrefix) {
+			session, err = controller.TokenManager.Verify(token)
+		} else {
+			session, err = controller.UserManager.Verify(token)
+		}
+
 		if err != nil {
 			return c.Status(http.StatusUnauthorized).JSON(map[string]string{"error": "unauthorized", "msg": err.Error()})
 		}
 
-		c.Locals("user", op)
+		c.Locals("user", session)
 
 		return c.Next()
 	}
 }
 
+func AuthPermission(perm string) nf.HandlerFunc {
+	return func(c *nf.Ctx) error {
+		session, ok := c.Locals("user").(*model.Session)
+		if !ok || session == nil {
+			return c.Status(http.StatusUnauthorized).JSON(map[string]string{"error": "unauthorized"})
+		}
+
+		for _, p := range session.Permissions {
+			if p == perm {
+				return c.Next()
+			}
+		}
+
+		return c.Status(http.StatusForbidden).JSON(map[string]string{"error": "forbidden", "msg": "权限不足"})
+	}
+}
+
+func AuthMe() nf.HandlerFunc {
+	return func(c *nf.Ctx) error {
+		session, ok := c.Locals("user").(*model.Session)
+		if !ok || session == nil {
+			return c.Status(http.StatusUnauthorized).JSON(map[string]string{"error": "unauthorized"})
+		}
+		return c.Status(http.StatusOK).JSON(map[string]any{"data": session})
+	}
+}
+
 func AuthLogin() nf.HandlerFunc {
 	return func(c *nf.Ctx) error {
 		type Req struct {
@@ -49,22 +86,22 @@ func AuthLogin() nf.HandlerFunc {
 		}
 
 		var (
-			err error
-			req Req
-			op  *model.User
+			err     error
+			req     Req
+			session *model.Session
 		)
 
 		if err = c.BodyParser(&req); err != nil {
 			return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": "错误的用户名或密码<1>"})
 		}
 
-		if op, err = controller.UserManager.Login(req.Username, req.Password); err != nil {
+		if session, err = controller.UserManager.Login(req.Username, req.Password); err != nil {
 			return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": err.Error()})
 		}
 
-		header := fmt.Sprintf("ushare=%s; Path=/; Max-Age=%d", op.Token, 8*3600)
+		header := fmt.Sprintf("ushare=%s; Path=/; Max-Age=%d", session.Token, 8*3600)
 		c.SetHeader("Set-Cookie", header)
 
-		return c.Status(http.StatusOK).JSON(map[string]any{"data": op})
+		return c.Status(http.StatusOK).JSON(map[string]any{"data": session})
 	}
 }

internal/handler/share.go

@@ -2,6 +2,11 @@ package handler
 
 import (
 	"fmt"
+	"net/http"
+	"os"
+	"regexp"
+	"strings"
+
 	"github.com/loveuer/nf"
 	"github.com/loveuer/nf/nft/log"
 	"github.com/loveuer/ushare/internal/controller"
@@ -10,10 +15,6 @@ import (
 	"github.com/pkg/errors"
 	"github.com/spf13/cast"
 	"github.com/spf13/viper"
-	"net/http"
-	"os"
-	"regexp"
-	"strings"
 )
 
 func Fetch() nf.HandlerFunc {
@@ -116,3 +117,36 @@ func ShareUpload() nf.HandlerFunc {
 		return c.Status(http.StatusOK).JSON(map[string]any{"size": total, "cursor": cursor})
 	}
 }
+
+// ShareAPIUpload handles one-step file upload via API token.
+// PUT /api/v1/upload/:filename
+// Accepts the raw file body and Content-Length header, returns the download code.
+func ShareAPIUpload() nf.HandlerFunc {
+	return func(c *nf.Ctx) error {
+		filename := strings.TrimSpace(c.Param("filename"))
+		if filename == "" {
+			return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": "filename required"})
+		}
+
+		size, err := cast.ToInt64E(c.Request.ContentLength)
+		if err != nil || size <= 0 {
+			return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": "Content-Length header required"})
+		}
+
+		code, err := controller.MetaManager.New(size, filename, c.IP())
+		if err != nil {
+			return c.Status(http.StatusInternalServerError).JSON(map[string]string{"msg": "create upload failed"})
+		}
+
+		_, _, err = controller.MetaManager.Write(code, 0, size-1, c.Request.Body)
+		if err != nil {
+			log.Error("handler.ShareAPIUpload: write error: %s", err)
+			return c.Status(http.StatusInternalServerError).JSON(map[string]string{"msg": "upload failed"})
+		}
+
+		return c.Status(http.StatusOK).JSON(map[string]any{
+			"status": 200,
+			"data":   map[string]string{"code": code},
+		})
+	}
+}

internal/handler/token.go

@@ -0,0 +1,85 @@
+package handler
+
+import (
+	"net/http"
+
+	"github.com/loveuer/nf"
+	"github.com/loveuer/ushare/internal/controller"
+	"github.com/loveuer/ushare/internal/model"
+)
+
+func TokenList() nf.HandlerFunc {
+	return func(c *nf.Ctx) error {
+		session, ok := c.Locals("user").(*model.Session)
+		if !ok || session == nil {
+			return c.Status(http.StatusUnauthorized).JSON(map[string]string{"error": "unauthorized"})
+		}
+
+		tokens, err := controller.TokenManager.List(session.UserID)
+		if err != nil {
+			return c.Status(http.StatusInternalServerError).JSON(map[string]string{"msg": err.Error()})
+		}
+
+		return c.Status(http.StatusOK).JSON(map[string]any{"data": tokens})
+	}
+}
+
+func TokenCreate() nf.HandlerFunc {
+	return func(c *nf.Ctx) error {
+		session, ok := c.Locals("user").(*model.Session)
+		if !ok || session == nil {
+			return c.Status(http.StatusUnauthorized).JSON(map[string]string{"error": "unauthorized"})
+		}
+
+		type Req struct {
+			Name string `json:"name"`
+		}
+
+		var req Req
+		if err := c.BodyParser(&req); err != nil {
+			return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": "请求格式错误"})
+		}
+
+		t, rawToken, err := controller.TokenManager.Create(session.UserID, req.Name)
+		if err != nil {
+			return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": err.Error()})
+		}
+
+		return c.Status(http.StatusOK).JSON(map[string]any{
+			"data": map[string]any{
+				"id":         t.ID,
+				"name":       t.Name,
+				"token":      rawToken,
+				"created_at": t.CreatedAt,
+			},
+		})
+	}
+}
+
+func TokenDelete() nf.HandlerFunc {
+	return func(c *nf.Ctx) error {
+		session, ok := c.Locals("user").(*model.Session)
+		if !ok || session == nil {
+			return c.Status(http.StatusUnauthorized).JSON(map[string]string{"error": "unauthorized"})
+		}
+
+		type Req struct {
+			ID uint `json:"id"`
+		}
+
+		var req Req
+		if err := c.BodyParser(&req); err != nil {
+			return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": "请求格式错误"})
+		}
+
+		if req.ID == 0 {
+			return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": "token id 不能为空"})
+		}
+
+		if err := controller.TokenManager.Delete(session.UserID, req.ID); err != nil {
+			return c.Status(http.StatusBadRequest).JSON(map[string]string{"msg": err.Error()})
+		}
+
+		return c.Status(http.StatusOK).JSON(map[string]any{"data": "ok"})
+	}
+}

internal/model/role.go

@@ -0,0 +1,44 @@
+package model
+
+import (
+	"strings"
+	"time"
+)
+
+const (
+	PermUserManage  = "user_manage"
+	PermUpload      = "upload"
+	PermTokenManage = "token_manage"
+
+	RoleAdmin = "admin"
+	RoleUser  = "user"
+)
+
+type Role struct {
+	ID          uint      `gorm:"primarykey" json:"id"`
+	Name        string    `gorm:"uniqueIndex;not null" json:"name"`
+	Label       string    `gorm:"not null" json:"label"`
+	Permissions string    `gorm:"not null" json:"permissions"`
+	CreatedAt   time.Time `json:"created_at"`
+	UpdatedAt   time.Time `json:"updated_at"`
+}
+
+func (r *Role) HasPermission(perm string) bool {
+	for _, p := range r.PermissionList() {
+		if p == perm {
+			return true
+		}
+	}
+	return false
+}
+
+func (r *Role) PermissionList() []string {
+	list := make([]string, 0)
+	for _, p := range strings.Split(r.Permissions, ",") {
+		p = strings.TrimSpace(p)
+		if p != "" {
+			list = append(list, p)
+		}
+	}
+	return list
+}

internal/model/token.go

@@ -0,0 +1,18 @@
+package model
+
+import "time"
+
+// Token is a personal API token for programmatic file upload.
+// Token values are prefixed with "ust_" to distinguish them from session tokens.
+type Token struct {
+	ID         uint       `gorm:"primarykey" json:"id"`
+	UserID     uint       `gorm:"not null;index" json:"user_id"`
+	Name       string     `gorm:"not null" json:"name"`
+	Token      string     `gorm:"uniqueIndex;not null" json:"-"`
+	CreatedAt  time.Time  `json:"created_at"`
+	LastUsedAt *time.Time `json:"last_used_at"`
+	ExpiresAt  *time.Time `json:"expires_at"`
+}
+
+// TokenPrefix is the prefix for all API token values.
+const TokenPrefix = "ust_"

internal/model/user.go

@@ -1,10 +1,26 @@
 package model
 
+import "time"
+
+// User is the GORM database model for persistent user storage.
 type User struct {
-	Id       int    `json:"id"`
-	Username string `json:"username"`
-	Key      string `json:"key"`
-	Password string `json:"-"`
-	LoginAt  int64  `json:"login_at"`
-	Token    string `json:"token"`
+	ID        uint      `gorm:"primarykey" json:"id"`
+	Username  string    `gorm:"uniqueIndex;not null" json:"username"`
+	Password  string    `gorm:"not null" json:"-"`
+	RoleID    uint      `gorm:"not null" json:"role_id"`
+	Active    bool      `gorm:"default:true" json:"active"`
+	CreatedAt time.Time `json:"created_at"`
+	UpdatedAt time.Time `json:"updated_at"`
+}
+
+// Session is the in-memory representation of an authenticated user.
+// It is created on login and stored in the UserManager session map.
+type Session struct {
+	UserID      uint     `json:"user_id"`
+	Username    string   `json:"username"`
+	Role        string   `json:"role"`
+	RoleLabel   string   `json:"role_label"`
+	Permissions []string `json:"permissions"`
+	LoginAt     int64    `json:"login_at"`
+	Token       string   `json:"token"`
 }

internal/pkg/db/client.go

@@ -46,6 +46,10 @@ func (c *Client) Session(ctxs ...context.Context) *gorm.DB {
 	return session
 }
 
+func (c *Client) Migrate(models ...interface{}) error {
+	return c.cli.AutoMigrate(models...)
+}
+
 func (c *Client) Close() {
 	d, _ := c.cli.DB()
 	d.Close()

main.go

@@ -3,10 +3,15 @@ package main
 import (
 	"context"
 	"flag"
+	"os"
+	"path/filepath"
+
 	"github.com/loveuer/nf/nft/log"
 	"github.com/loveuer/ushare/internal/api"
 	"github.com/loveuer/ushare/internal/controller"
+	"github.com/loveuer/ushare/internal/model"
 	"github.com/loveuer/ushare/internal/opt"
+	"github.com/loveuer/ushare/internal/pkg/db"
 	"github.com/loveuer/ushare/internal/pkg/tool"
 	"os/signal"
 	"syscall"
@@ -32,6 +37,21 @@ func main() {
 	defer cancel()
 
 	opt.Init(ctx)
+
+	if err := os.MkdirAll(opt.Cfg.DataPath, 0755); err != nil {
+		log.Fatal("main: create data path failed: %s", err.Error())
+	}
+
+	dbPath := filepath.Join(opt.Cfg.DataPath, ".ushare.db")
+	if err := db.Init(ctx, "sqlite::"+dbPath); err != nil {
+		log.Fatal("main: init db failed: %s", err.Error())
+	}
+	log.Debug("main: db initialized at %s", dbPath)
+
+	if err := db.Default.Migrate(&model.Role{}, &model.User{}, &model.Token{}); err != nil {
+		log.Fatal("main: db migrate failed: %s", err.Error())
+	}
+
 	controller.UserManager.Start(ctx)
 	controller.MetaManager.Start(ctx)
 	controller.RoomController.Start(ctx)