# YShop Drink Vue 管理后台 - Claude Code 配置

> 2级子项目配置 | 继承自 yshop (1级)

## 项目信息

| 属性 | 值 |
|------|-----|
| 项目名称 | yshop-drink-vue |
| 所属项目 | yshop |
| 项目类型 | frontend (管理后台) |
| 版本 | 3.2.3 |
| Node 版本 | >= 16.0.0 |
| 包管理器 | pnpm >= 8.6.0 |

## 技术栈

| 技术 | 版本 | 用途 |
|------|------|------|
| Vue | 3.4.21 | 核心框架 |
| Vite | 5.1.4 | 构建工具 |
| TypeScript | 5.3.3 | 类型系统 |
| Element Plus | 2.6.1 | UI 组件库 |
| Pinia | 2.1.7 | 状态管理 |
| Vue Router | 4.3.0 | 路由管理 |
| UnoCSS | 0.58.5 | 原子化 CSS |
| Axios | 1.6.8 | HTTP 请求 |
| ECharts | 5.5.0 | 图表 |
| BPMN.js | 8.9.0 | 流程设计 |

## 项目结构

```
yshop-drink-vue/
├── src/
│   ├── api/                   # API 接口定义
│   ├── assets/                # 静态资源
│   ├── components/            # 公共组件
│   ├── config/                # 配置
│   ├── directives/            # 自定义指令
│   ├── hooks/                 # 组合式函数
│   ├── layout/                # 布局组件
│   ├── locales/               # 国际化
│   ├── plugins/               # 插件
│   ├── router/                # 路由配置
│   ├── store/                 # Pinia 状态
│   ├── styles/                # 全局样式
│   ├── types/                 # TypeScript 类型
│   ├── utils/                 # 工具函数
│   ├── views/                 # 页面视图
│   ├── App.vue                # 根组件
│   ├── main.ts                # 入口文件
│   └── permission.ts          # 权限控制
├── public/                    # 公共资源
├── types/                     # 全局类型定义
├── vite.config.ts             # Vite 配置
├── tsconfig.json              # TS 配置
├── uno.config.ts              # UnoCSS 配置
└── package.json
```

## 页面模块

```
src/views/
├── mall/                      # 商城管理
│   ├── product/               # 商品管理
│   ├── order/                 # 订单管理
│   ├── store/                 # 门店管理
│   ├── shop/                  # 店铺设置
│   ├── desk/                  # 桌号管理
│   ├── member/                # 会员管理
│   ├── coupon/                # 优惠券
│   ├── cashier/               # 收银台
│   └── statistics/            # 数据统计
├── pay/                       # 支付管理
├── market/                    # 营销管理
├── score/                     # 积分管理
├── mp/                        # 公众号管理
├── message/                   # 消息管理
├── express/                   # 物流管理
├── system/                    # 系统设置
├── infra/                     # 基础设施
├── Login/                     # 登录页
├── Home/                      # 首页
├── Profile/                   # 个人中心
└── Error/                     # 错误页
```

## 开发命令

```bash
# 安装依赖
pnpm install

# 本地开发
pnpm dev

# 连接开发服务器
pnpm dev-server

# 类型检查
pnpm ts:check

# 构建
pnpm build:local      # 本地环境
pnpm build:dev        # 开发环境
pnpm build:test       # 测试环境
pnpm build:prod       # 生产环境

# 预览构建结果
pnpm preview

# 代码检查
pnpm lint:eslint      # ESLint
pnpm lint:format      # Prettier
pnpm lint:style       # Stylelint

# 清理
pnpm clean            # 删除 node_modules
pnpm clean:cache      # 清理缓存
```

## 环境配置

```
.env                  # 基础配置
.env.dev              # 开发环境
.env.test             # 测试环境
.env.stage            # 预发布环境
.env.prod             # 生产环境
```

## API 规范

```typescript
// src/api/mall/product/index.ts
import request from '@/config/axios'

// 获取商品列表
export const getProductPage = (params: ProductPageReqVO) => {
  return request.get({ url: '/mall/product/page', params })
}

// 创建商品
export const createProduct = (data: ProductVO) => {
  return request.post({ url: '/mall/product/create', data })
}
```

## 组件规范

```vue
<template>
  <ContentWrap>
    <!-- 内容 -->
  </ContentWrap>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue'
import * as ProductApi from '@/api/mall/product'

defineOptions({ name: 'ProductList' })

const loading = ref(false)
const list = ref([])

const getList = async () => {
  loading.value = true
  try {
    list.value = await ProductApi.getProductPage({})
  } finally {
    loading.value = false
  }
}

onMounted(() => {
  getList()
})
</script>
```

## 权限控制

```typescript
// 按钮权限
<el-button v-hasPermi="['mall:product:create']">新增</el-button>

// 路由权限 (在菜单配置中设置)
```

## 主要功能

| 模块 | 功能 |
|------|------|
| 商品管理 | CRUD、规格、分类、库存 |
| 订单管理 | 列表、详情、发货、退款 |
| 门店管理 | 门店信息、营业时间、结算 |
| 桌号管理 | 桌号、二维码 |
| 会员管理 | 会员列表、等级、余额 |
| 优惠券 | 发券、核销 |
| 收银台 | 堂食点餐 |
| 数据统计 | 销售报表、趋势图 |

## 核心文档

| 文档 | 位置 | 内容 |
|------|------|------|
| 系统架构 | `../architecture.canvas` | 整体架构图 |
| 后端 API | Swagger UI | 接口文档 |