rui-frontend

睿核科技前端项目集合

项目结构

rui-frontend/
├── admin-ui/              # 管理后台（Vue 3 + Element Plus）
│   ├── src/
│   ├── package.json
│   └── ...
├── cashier-mobile/        # 收银系统移动端（占位）
│   ├── src/
│   ├── package.json
│   └── ...
├── customer-mobile/       # 收银系统顾客端（占位）
│   ├── src/
│   ├── package.json
│   └── ...
├── package.json           # 根 package.json
├── pnpm-workspace.yaml    # pnpm 工作区配置
└── README.md              # 本文档

技术栈

• 构建工具：Vite
• 框架：Vue 3 + TypeScript
• UI 组件：Element Plus（admin-ui）/ 待定（移动端）
• 状态管理：Pinia
• 包管理器：pnpm
• 工作区：pnpm workspace

快速开始

环境要求

• Node.js >= 18.0.0
• pnpm >= 8.0.0

安装依赖

# 安装所有项目依赖
pnpm install

# 或只安装某个项目
cd admin-ui
pnpm install

开发模式

# 启动管理后台
pnpm dev:admin

# 启动收银移动端
pnpm dev:cashier

# 启动顾客端
pnpm dev:customer

构建

# 构建所有项目
pnpm build:all

# 构建单个项目
pnpm build:admin
pnpm build:cashier
pnpm build:customer

项目说明

admin-ui

管理后台系统，支持多系统切换（收银、超管、运营）。

• 技术栈：Vue 3 + Element Plus + TypeScript
• 端口：3000
• 构建命令：pnpm build:admin

cashier-mobile（待开发）

收银系统移动端，供店员使用。

• 技术栈：待定（UniApp / React Native / Flutter）
• 功能：开台、点餐、结账、退款

customer-mobile（待开发）

收银系统顾客端，供顾客扫码点餐、支付。

• 技术栈：待定（微信小程序 / H5）
• 功能：扫码点餐、在线支付、订单查询

开发规范

代码规范

• 使用 TypeScript
• ESLint + Prettier 自动格式化
• 组件名使用 PascalCase
• 组合式函数使用 useXxx 命名

Git 提交规范

type(scope): 中文描述

示例：
feat(admin-ui): 添加用户管理页面
fix(cashier): 修复结账金额计算错误
docs: 更新 README

type 类型：

• feat：新功能
• fix：修复
• docs：文档
• style：格式（不影响代码运行）
• refactor：重构
• test：测试
• chore：构建/工具

目录规范

{project}/src/
├── api/              # API 接口定义
├── assets/           # 静态资源
├── components/       # 公共组件
│   └── common/       # 通用组件
├── composables/      # 组合式函数
├── layouts/          # 布局组件
├── router/           # 路由配置
├── stores/           # Pinia 状态管理
├── styles/           # 全局样式
├── types/            # TypeScript 类型定义
├── utils/            # 工具函数
└── views/            # 页面视图

与后端协作

API 接口

后端接口文档：http://{backend-host}/doc.html

前端通过 Axios 调用后端 API，基地址在 .env 文件中配置：

# .env.development
VITE_API_BASE_URL=http://localhost:8080

跨团队协作

前端与后端通过 Gitee Issue 进行协作：

1. 前端需要新接口 → 在后端仓库创建 [API-REQ] Issue
2. 后端实现后 → 在 Issue 回复 Swagger 地址
3. 前端根据 Swagger 开发/联调

详见后端仓库文档：docs/cross-team-workflow.md

CI/CD

构建流程

code push → GitHub Actions → build → deploy

部署环境

环境	分支	域名
开发	develop	dev-frontend.vifo.cc
测试	release/*	test-frontend.vifo.cc
生产	main	admin.vifo.cc

相关仓库

• 后端框架：spring-ai（backend/ + app/）
• 接口文档：http://{backend-host}/doc.html

贡献指南

1. Fork 本仓库
2. 创建功能分支：git checkout -b feat/xxx
3. 提交代码：git commit -m "feat: xxx"
4. 推送分支：git push origin feat/xxx
5. 创建 Pull Request

许可证

MIT