sync: Add files via upload (A@cb7b0c57defc79e2dff2a711987b761de178c04f)

README.md

@@ -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项 | 扁平路由 |
+| 采购商 | PurchaserLayout | 8项 | 嵌套 Outlet |
+| 纺织厂 | TextileLayout | 5项 | 嵌套 Outlet |
+| 水洗厂 | 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/                     # 自定义Hooks（9个）
+├── hooks/                     # 自定义Hooks（10个）
 │   ├── 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 | - | 数据共享演示 |