购物卡审批
Go to file
2025-01-21 14:23:44 +08:00
.vscode init 2025-01-20 22:20:45 +08:00
public init 2025-01-20 22:20:45 +08:00
src init 2025-01-20 22:20:45 +08:00
.env 更改正式域名 2025-01-21 14:23:44 +08:00
.gitignore init 2025-01-20 22:20:45 +08:00
index.html init 2025-01-20 22:20:45 +08:00
package-lock.json init 2025-01-20 22:20:45 +08:00
package.json init 2025-01-20 22:20:45 +08:00
postcss.config.cjs init 2025-01-20 22:20:45 +08:00
README.md first commit 2025-01-20 22:20:18 +08:00
vite.config.js init 2025-01-20 22:20:45 +08:00

购物卡审批系统

基于 Vue 3 + Vite 开发的移动端购物卡审批系统。

技术栈

  • Vue 3
  • Vite
  • Element Plus
  • Vue Router
  • Axios
  • PostCSS

功能特性

  • 移动端自适应布局
  • iOS 安全区域适配
  • 审批详情展示
  • 审批通过/驳回操作
  • 审批结果页面

开发环境要求

  • Node.js >= 16.0.0
  • npm >= 7.0.0

安装和运行

  1. 安装依赖
npm install
  1. 启动开发服务器
npm run dev
  1. 构建生产版本
npm run build

项目结构

├── src/
│   ├── api/            # API 接口
│   ├── assets/         # 静态资源
│   ├── pages/          # 页面组件
│   ├── router/         # 路由配置
│   ├── utils/          # 工具函数
│   ├── App.vue         # 根组件
│   └── main.js         # 入口文件
├── public/             # 公共资源
├── index.html          # HTML 模板
├── vite.config.js      # Vite 配置
└── package.json        # 项目配置

使用说明

  1. 审批详情页面

    • 访问路径:/approval-detail?id=xxx
    • 显示申请信息
    • 可进行通过/驳回操作
  2. 审批结果页面

    • 访问路径:/approval-result?id=xxx
    • 显示审批结果和详情

环境变量配置

.env 文件中配置以下环境变量:

VITE_API_URL=接口基础地址

移动端适配

  • 使用 postcss-pxtorem 进行单位转换
  • 使用 amfe-flexible 进行 rem 适配
  • 基准值37.5px = 1rem