sync: Add files via upload (A@cb7b0c57defc79e2dff2a711987b761de178c04f)

This commit is contained in:
github-actions[bot] 2026-06-05 03:34:05 +00:00
parent d06690963c
commit 3093ae18c2
2 changed files with 36 additions and 21 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.3 KiB

View File

@ -105,18 +105,31 @@ src/utils/constants.ts ← 向后兼容层状态枚举、UI映射、步骤配
5. **向后兼容**`constants.ts` 重新导出 `animationConfig`/`paginationConfig`/`progressThresholds`,旧代码无需修改
### 设计架构
- **CSS变量体系**: 完整50-900色阶、6级阴影系统、毛玻璃/滚动条美化等自定义工具类
- **动效规范**: 页面过渡(opacity+slide, 0.35s)、列表交错(stagger 0.08)、Spring弹簧交互
- **性能降级**: `usePerformance` Hook 自动检测设备性能低配设备仅使用opacity过渡
- **响应式设计**: 移动优先,断点 sm(640)/md(768)/lg(1024)/xl(1280),桌面表格↔移动卡片自动切换
- **触控优化**: 44px最小触控区域、防双击缩放、数字键盘自动唤起
#### CSS 变量体系 (`src/styles/index.css`)
- **色阶系统**: 完整的 50-900 色阶定义Primary, Success, Warning, Error, Gray
- **阴影层级**: 6级阴影系统 (`--shadow-sm` ~ `--shadow-2xl`)
- **自定义工具类**: `.glass`/`.glass-dark`(毛玻璃)、`.scrollbar-thin`/`.scrollbar-hide`(滚动条美化)、`.animate-fade-in`/`.animate-slide-in`(入场动画)、`.safe-area-top/bottom`(iOS安全区)
#### 动效规范 (Framer Motion + constants.ts)
- **页面过渡**: `opacity: 0→1`, `y: 20→0`, `scale: 0.98→1` (Duration: 0.35s)
- **列表交错**: `staggerChildren: 0.08`
- **交互反馈**: Spring 弹簧动画 (`stiffness: 200, damping: 25`)
- **性能降级**: `usePerformance` Hook 自动检测,低性能设备仅使用 opacity 过渡
- **硬件加速**: `will-change-transform` + `content-visibility-auto`
#### 响应式设计
- **断点**: `sm(640px)`, `md(768px)`, `lg(1024px)`, `xl(1280px)`
- **移动优先**: 默认样式为移动端,通过 `sm:/md:/lg:` 向上覆盖
- **触控优化**: 最小触控区域 44x44px (`@media (pointer: coarse)`)
- **布局切换**: 桌面端表格 ↔ 移动端卡片,根据屏幕宽度自动切换
### 布局架构
| 角色 | 布局组件 | 导航项数 | 路由模式 |
| 角色 | 布局组件 | 导航项数 | 路由嵌套 |
|------|---------|---------|---------|
| 采购商 | PurchaserLayout | 8项 | 嵌套 Outlet |
| 纺织厂 | TextileLayout | 5项 | 嵌套 Outlet |
| 水洗厂 | 无独立Layout | 6项 | 扁平路由 |
| 水洗厂 | WashingLayout | 6项 | 嵌套 Outlet |
### 后端服务
- **Meoo Cloud (Supabase)** - 云数据库 + 认证 + 实时订阅 + 文件存储
@ -168,11 +181,12 @@ meoo-cli cloud migrate --sql "..." --name "migration_name" --changes "变更说
```
src/
├── App.tsx # 根组件25条HashRouter路由 + PageErrorBoundary
├── components/ # 共享组件33个)
│ ├── layout/ # 布局组件(3个)
├── components/ # 共享组件35个)
│ ├── layout/ # 布局组件(4个)
│ │ ├── Sidebar.tsx # 可折叠侧边栏导航
│ │ ├── PurchaserLayout.tsx # 采购商布局8项导航 + amber主题
│ │ └── TextileLayout.tsx # 纺织厂布局5项导航 + emerald主题
│ │ ├── TextileLayout.tsx # 纺织厂布局5项导航 + emerald主题
│ │ └── WashingLayout.tsx # 水洗厂布局6项导航 + violet主题
│ ├── warehouse/ # 仓库管理组件6个
│ │ ├── WarehouseNav.tsx # 仓库类型导航
│ │ ├── ProductForm.tsx # 产品创建/编辑表单
@ -215,13 +229,13 @@ src/
│ │ ├── YarnWarehouse.tsx # 原料纱仓库(出入库记录)
│ │ ├── FabricWarehouse.tsx # 已生产坯布Realtime订阅
│ │ └── PaymentPending.tsx # 待结款
│ └── washing/ # 水洗厂页面6个扁平路由无Layout
│ └── washing/ # 水洗厂页面6个WashingLayout嵌套
│ ├── Dashboard.tsx # 首页violet主题
│ ├── PlanOverview.tsx # 水洗计划总览
│ ├── PendingFabric.tsx / CompletedFabric.tsx # 待洗/已完成
│ ├── FinishedWarehouse.tsx # 成品仓库
│ └── PaymentPending.tsx # 待结款
├── hooks/ # 自定义Hooks9个)
├── hooks/ # 自定义Hooks10个)
│ ├── useInventoryData.ts # 库存数据5秒缓存+Realtime
│ ├── usePlanData.ts # 计划数据10秒缓存+分页+Realtime
│ ├── usePlanStatusSync.ts # 计划状态自动同步10秒测试间隔
@ -230,7 +244,8 @@ src/
│ ├── useTheme.ts # 主题管理暗黑模式class策略
│ ├── usePerformance.ts # 性能检测(三档动画降级)
│ ├── useNetworkStatus.ts # 网络状态监听
│ └── useVirtualScroll.ts # 虚拟滚动
│ ├── useVirtualScroll.ts # 虚拟滚动
│ └── useErrorHandler.ts # 统一错误处理Hook
├── config/app.ts # 应用全局配置中心(环境/缓存/分页/动画/主题色/存储键等)
├── contexts/AuthContext.tsx # 认证上下文login/register/logout
├── styles/index.css # 全局样式CSS变量+工具类+移动端适配)
@ -262,12 +277,12 @@ src/
| `/textile/yarn-warehouse` | YarnWarehouse | TextileLayout | 原料纱仓库 |
| `/textile/fabric-warehouse` | FabricWarehouse | TextileLayout | 已生产坯布 |
| `/textile/payments` | PaymentPending | TextileLayout | 待结款 |
| `/washing` | WashingDashboard | - | 水洗厂首页 |
| `/washing/plans` | WashingPlanOverview | - | 水洗计划总览 |
| `/washing/pending` | PendingFabric | - | 待水洗坯布 |
| `/washing/completed` | CompletedFabric | - | 已完成水洗 |
| `/washing/finished-warehouse` | FinishedWarehouse | - | 成品仓库 |
| `/washing/payments` | WashingPaymentPending | - | 待结款 |
| `/washing` | WashingDashboard | WashingLayout | 水洗厂首页 |
| `/washing/plans` | WashingPlanOverview | WashingLayout | 水洗计划总览 |
| `/washing/pending` | PendingFabric | WashingLayout | 待水洗坯布 |
| `/washing/completed` | CompletedFabric | WashingLayout | 已完成水洗 |
| `/washing/finished-warehouse` | FinishedWarehouse | WashingLayout | 成品仓库 |
| `/washing/payments` | WashingPaymentPending | WashingLayout | 待结款 |
| `/members` | MemberManage | - | 子账号管理 |
| `/import` | ImportPlanPage | - | 分享链接导入 |
| `/demo/data-sharing` | DemoDataSharing | - | 数据共享演示 |