marketing/marketing-ui/admin-ui/CLAUDE.md

SMS Pro Admin UI - 项目说明

项目概述

这是 SMS Pro (短信平台) 的前端管理界面，用于管理和监控短信服务的各个方面。

技术栈

• 框架: Vue 3.5.12
• 构建工具: Vite 5.1.4
• UI 组件库: Element Plus 2.9.1
• 语言: TypeScript 5.3.3
• 状态管理: Pinia 2.1.7 (持久化: pinia-plugin-persistedstate)
• 路由: Vue Router 4.4.5
• 包管理器: pnpm (强制使用，版本 >= 8.6.0)
• 样式: UnoCSS + SCSS
• 国际化: Vue I18n 9.10.2

核心功能

这是一个企业级短信平台管理后台，主要功能包括：

1. 短信渠道管理 - 管理多个短信服务提供商渠道
2. 短信发送记录 - 查询和管理短信发送历史
3. 网关管理 - 处理短信请求的接收入口
4. 工作台 - 短信发送任务的实际执行
5. 租户管理 - 多租户支持
6. 系统管理 - 用户、角色、权限等系统配置

项目结构

src/
├── api/           # API 接口定义
├── assets/        # 静态资源
├── components/    # 公共组件
├── config/        # 配置文件
├── directives/    # 自定义指令
├── hooks/         # 组合式函数
├── layout/        # 布局组件
├── locales/       # 国际化文件
├── plugins/       # 插件配置
├── router/        # 路由配置
├── store/         # Pinia 状态管理
├── styles/        # 全局样式
├── types/         # TypeScript 类型定义
├── utils/         # 工具函数
└── views/         # 页面组件

开发环境要求

• Node.js >= 16.18.0
• pnpm >= 8.6.0

常用命令

# 安装依赖
pnpm install

# 本地开发
npm run dev

# 构建
npm run build:local   # 本地环境
npm run build:dev     # 开发环境
npm run build:test    # 测试环境
npm run build:stage   # 预发布环境
npm run build:prod    # 生产环境

# 代码检查
npm run lint:eslint
npm run lint:format
npm run lint:style

# 类型检查
npm run ts:check

后端服务

前端对应的后端项目位于:

• 路径: /Users/zhangyong/workspace/java/platform-sms-pro
• 技术栈: Spring Boot 2.7.18 + Java 8
• 主要模块:
  • marketing-admin-server - 主服务
  • marketing-module-system - 系统管理
  • marketing-module-channel - 短信渠道
  • marketing-module-record - 发送记录
  • marketing-module-gateway - 网关
  • marketing-module-worker - 消息处理
  • marketing-module-tenant - 租户管理

重要提示

• 项目使用 env.local、dev、test、stage、prod 等不同环境配置
• 组件自动导入: 使用 unplugin-vue-components 和 unplugin-auto-import
• 图标使用: UnoCSS 和 Iconify
• 样式采用 UnoCSS 原子化 CSS 框架

特殊功能

• BPMN 流程图编辑 (bpmn-js)
• 富文本编辑器 (wangeditor)
• 图片裁剪 (cropperjs)
• 语音录制 (benz-amr-recorder)
• 代码高亮 (highlight.js)
• 图表展示 (echarts)
• 二维码生成 (qrcode)
• 视频播放 (video.js)