# Schedule Invest Plan

Vue 3 + TypeScript 前端项目，技术栈：Vite、Vue Router、Pinia、Axios、vue-i18n、Sass、Element Plus。

## 开发

```bash
npm install
npm run dev
```

## 构建

```bash
npm run build
npm run preview
```

## 目录说明

| 路径 | 说明 |
|------|------|
| `src/api/http.ts` | Axios 实例与拦截器 |
| `src/i18n/` | 国际化配置（简体 / 繁体 / 英文） |
| `src/router/` | 路由 |
| `src/stores/` | Pinia 状态 |
| `src/styles/` | 全局 Sass 与变量 |
| `src/views/RecurringInvestmentView.vue` | 定期投资首页 |
| `src/element-plus/locale.ts` | Element Plus 语言与 URL `lang` 映射 |
| `src/types/components.d.ts` | 组件自动导入类型（构建生成） |

### Element Plus

- 通过 `unplugin-vue-components` + `unplugin-auto-import` 按需引入组件。
- 根节点 `el-config-provider` 语言随 URL `lang` 同步（简/繁/英）。
- 深色模式：`theme=dark` 时为 `html` 增加 `dark` 类，并加载 Element Plus 深色 CSS 变量。

## 环境变量

开发环境见 `.env.development`：`VITE_API_BASE_URL` 为接口基础路径（默认 `/api`）。

## URL 参数（语言与主题）

语言与主题**仅通过 URL 查询参数**控制（不再使用 `localStorage`）。

| 参数 | 取值 | 缺省 |
|------|------|------|
| `lang` | `zh-TW` / `zh-CN` / `en-US`（亦支持 `locale`） | `zh-TW` |
| `theme` | `dark` / `light`（亦支持 `night` / `day`） | `dark` |

示例：

- `http://localhost:5173/?lang=zh-TW&theme=dark`
- `http://localhost:5173/?lang=en-US&theme=light`

顶栏切换语言或主题时会同步更新当前地址栏中的 `lang`、`theme`。

## PC / 移动端适配

开发与评审须遵循 **[docs/RESPONSIVE_SPEC.md](./docs/RESPONSIVE_SPEC.md)**（断点、布局壳层、Sass mixin、`useBreakpoint`、Element Plus 栅格与表单约定）。

Cursor 已配置项目规则：`.cursor/rules/`（核心约定、响应式、Vue SFC 写法）。