Files
login_task_web/README_LINKS.md

4.6 KiB
Raw Blame History

链接管理功能

功能概述

链接管理页面提供了批量生成链接的功能支持设置生成次数和每次生成的链接数量。根据您提供的API接口系统会调用 POST /api/link/generate 接口来生成链接。

主要功能

1. 批量生成链接

  • 生成次数: 1-100次
  • 每次链接数量: 1-50个
  • 支持表单验证
  • 生成成功后自动刷新列表

2. 链接列表管理

  • 分页显示已生成的链接批次
  • 显示批次ID、机器编号、扣除积分、过期时间
  • 支持查看、删除操作
  • 根据过期时间自动判断链接状态
  • 支持导出CSV数据

3. 二维码功能

  • 根据机器编号生成对应的链接二维码
  • 支持下载二维码图片
  • 使用在线二维码生成服务
  • 自动生成游戏链接地址

4. 权限控制

  • 管理员:拥有所有权限(生成、查看、删除、导出)
  • 代理商:只有查看权限

API接口

生成链接

POST /api/link/generate
Authorization: Bearer {token}
Content-Type: application/json

{
  "times": 10,        // 生成次数
  "linkCount": 5      // 每次链接数量
}

返回数据示例:

{
  "batchId": 6,
  "deductPoints": 50,
  "expireAt": "2025-08-26T12:29:13.63955",
  "codeNos": [
    "X3T9ND84"
  ]
}

获取链接列表

GET /api/link/list?page=1&pageSize=20
Authorization: Bearer {token}

删除链接

DELETE /api/link/{id}
Authorization: Bearer {token}

页面路由

  • 路径: /links
  • 名称: Links
  • 权限: LINK_VIEW

文件结构

src/
├── api/
│   └── links.js              # 链接相关API接口
├── views/links/
│   └── LinkGenerate.vue      # 链接生成页面
├── utils/
│   └── links.js              # 链接管理工具函数
├── config/
│   └── links.js              # 链接管理配置文件
├── router/
│   └── index.js              # 路由配置(已更新)
├── layouts/
│   └── AdminLayout.vue       # 导航菜单(已更新)
└── utils/
    └── permission.js         # 权限配置(已更新)

使用说明

1. 生成链接

  1. 在"生成次数"输入框中输入要生成的次数1-100
  2. 在"每次链接数量"输入框中输入每次生成的链接数量1-50
  3. 点击"开始生成"按钮
  4. 系统会调用API生成链接成功后显示提示信息

2. 管理链接

  • 查看已生成的链接列表
  • 点击"查看二维码"查看链接对应的二维码
  • 点击"删除"删除不需要的链接
  • 使用"导出CSV"功能导出链接数据

3. 权限说明

  • 管理员可以执行所有操作
  • 代理商只能查看链接列表,无法生成或删除链接

注意事项

  1. API地址: 确保后端API地址配置正确当前配置为 http://localhost:18080
  2. 认证: 需要有效的Bearer Token才能访问API
  3. 二维码: 使用在线二维码生成服务,确保网络连接正常
  4. 批量限制: 单次最多生成50个链接避免API压力过大
  5. 链接地址: 系统会自动根据机器编号生成游戏链接地址,格式为 https://yourdomain.com/play?code={机器编号}
  6. 状态判断: 链接状态根据过期时间自动判断(正常/即将过期/已过期)
  7. 配置自定义: 可以在 src/config/links.js 中自定义链接地址生成规则和状态配置

配置说明

链接地址配置 (src/config/links.js)

export const LINK_CONFIG = {
  // 基础域名
  BASE_URL: 'https://yourdomain.com',
  
  // 游戏页面路径
  GAME_PATH: '/play',
  
  // 机器编号参数名
  CODE_PARAM: 'code',
  
  // 链接地址模板
  getLinkUrl: (codeNo) => {
    return `${LINK_CONFIG.BASE_URL}${LINK_CONFIG.GAME_PATH}?${LINK_CONFIG.CODE_PARAM}=${codeNo}`
  }
}

状态配置

export const STATUS_CONFIG = {
  // 状态标签类型
  LABEL_TYPES: {
    NORMAL: 'success',      // 正常
    EXPIRING: 'warning',    // 即将过期
    EXPIRED: 'danger',      // 已过期
    UNKNOWN: 'info'         // 未知
  },
  
  // 过期时间阈值(毫秒)
  EXPIRING_THRESHOLD: 24 * 60 * 60 * 1000, // 24小时
}

扩展功能

可以根据需要添加以下功能:

  • 链接状态切换(启用/禁用)
  • 链接过期时间设置
  • 链接使用统计
  • 自定义链接模板
  • 批量操作(批量删除、批量导出等)
  • 链接访问统计和监控

技术特点

  • 使用Vue 3 Composition API
  • Element Plus UI组件库
  • 响应式设计
  • 权限控制集成
  • 错误处理和用户提示
  • 支持CSV导出