# mathPages 目录重构方案

## 当前目录结构

```
mathPages/
├── addition/           # 页面
├── compare/            # 页面
├── countingSelect/     # 页面
├── countMatch/         # 页面
├── missingNumber/      # 页面
├── numberDecompose/    # 页面
├── numberFind/         # 页面
├── assets/             # 静态资源
├── common/             # 公共文件（mixin等）
├── components/         # 组件
└── service/            # 服务（Draw相关）
```

## 问题

- 页面和服务放在同一级，不易区分
- 目录较多，查找页面不够直观
- 公共服务散落在不同目录

## 推荐方案：使用 `shared/` 目录

### 重构后的目录结构

```
mathPages/
├── addition/           # 页面
├── compare/            # 页面
├── countingSelect/     # 页面
├── countMatch/         # 页面
├── missingNumber/      # 页面
├── numberDecompose/    # 页面
├── numberFind/         # 页面
├── assets/             # 静态资源
└── shared/             # 公共服务目录（新建）
    ├── service/        # 服务（从 service/ 移动）
    ├── common/         # 公共文件（从 common/ 移动）
    └── components/     # 组件（从 components/ 移动）
```

### 优点

1. ✅ **语义清晰**：`shared/` 明确表示共享代码
2. ✅ **结构清晰**：页面和公共服务分离，一目了然
3. ✅ **易于维护**：所有公共服务集中在一个目录下
4. ✅ **符合常见实践**：`shared/` 在很多项目中都有使用
5. ✅ **扩展性好**：未来可以添加 `shared/utils/`、`shared/types/` 等

### 需要修改的导入路径

#### 页面文件中的导入

**之前：**

```typescript
import AdditionDraw from '../service/additionDraw';
import { createMathPage } from '../common/mathPageMixin';
import MathBottomButtons from '../components/math-bottom-buttons/math-bottom-buttons';
```

**之后：**

```typescript
import AdditionDraw from '../shared/service/additionDraw';
import { createMathPage } from '../shared/common/mathPageMixin';
import MathBottomButtons from '../../components/math-bottom-buttons/math-bottom-buttons';
```

#### service 文件之间的导入

**之前：**

```typescript
import { BaseDrawService } from './baseMathDraw';
```

**之后：**

```typescript
import { BaseDrawService } from './baseMathDraw';
// 或者如果跨目录
import { BaseDrawService } from '../baseMathDraw';
```

## 备选方案：使用 `lib/` 目录

如果不想用 `shared/`，也可以考虑 `lib/`：

```
mathPages/
├── addition/
├── compare/
├── ...
├── assets/
└── lib/              # 公共服务目录
    ├── service/
    ├── common/
    └── components/
```

**优点：**

- 简洁
- 表示库文件

**缺点：**

- `lib/` 通常用于第三方库或编译产物
- 语义上不如 `shared/` 清晰

## 备选方案：使用 `core/` 目录

```
mathPages/
├── addition/
├── compare/
├── ...
├── assets/
└── core/             # 核心功能目录
    ├── service/
    ├── common/
    └── components/
```

**优点：**

- 表示核心功能

**缺点：**

- `core/` 通常用于框架核心，不太适合业务代码

## 迁移步骤

1. **创建 `shared/` 目录**
2. **移动目录**
    - `service/` → `shared/service/`
    - `common/` → `shared/common/`
    - `components/` → `shared/components/`
3. **批量更新导入路径**
    - 所有页面文件中的 `../service/` → `../shared/service/`
    - 所有页面文件中的 `../common/` → `../shared/common/`
    - 所有页面文件中的 `../components/` → `../shared/components/`
    - 检查 `shared/` 内部文件的相互导入
4. **更新配置文件**
    - 检查是否有路径配置需要更新（如 `app.json` 中的组件路径）
5. **测试验证**
    - 确保所有页面功能正常
    - 确保导入路径正确

## 推荐使用 `shared/` 目录

综合考虑，**推荐使用 `shared/` 目录**，因为：

- 语义最清晰
- 符合常见实践
- 易于理解和维护