修改页面结构

docs/admin/ADMIN_PAGES_REFACTORING_PLAN.md

@@ -0,0 +1,206 @@
+# Admin 页面重构计划
+
+## 📊 项目现状分析
+
+### 发现的问题
+
+1. **样式问题**
+   - ❌ 使用硬编码颜色值（#ffffff, #999等）
+   - ❌ 使用硬编码尺寸（20px, 24rpx等）
+   - ❌ 不一致的样式规范
+
+2. **代码结构问题**
+   - ❌ 页面结构不统一
+   - ❌ 缺少搜索、表格、分页等功能
+   - ❌ 样式使用原生选择器，没有设计变量
+
+3. **命名规范问题**
+   - ⚠️ 类名不统一（Page/page, Header/header 混用）
+   - ⚠️ camelCase 和 PascalCase 混用
+
+4. **类型和导入问题**
+   - ⚠️ 缺少 TypeScript 类型定义
+   - ⚠️ 没有使用 lang="uts"
+
+---
+
+## 🔧 重构方案
+
+### 阶段 1: 快速修复（优先级高）
+
+**目标**: 将所有硬编码值替换为设计变量
+
+涉及的文件数量：**20+ 个**
+
+#### 替换规则
+
+| 现有值       | 替换为                | 说明     |
+| ------------ | --------------------- | -------- |
+| `#ffffff`    | `$background-primary` | 白色背景 |
+| `#999`       | `$text-tertiary`      | 灰色文字 |
+| `20px`       | `$space-md`           | 16px     |
+| `24px`       | `$space-lg`           | 24px     |
+| `24rpx`      | `$space-lg`           | 24px     |
+| `16rpx`      | `$radius`             | 6px      |
+| `36rpx` 字体 | `$font-size-lg`       | 18px     |
+
+#### 修改范围
+
+```
+pages/mall/admin/
+├── maintain/
+│   ├── system-info.uvue ✅ 已修复
+│   ├── data/*.uvue (5个文件)
+│   ├── dev-config/*.uvue (6个文件)
+│   ├── dev-tools/*.uvue (5个文件)
+│   └── security/*.uvue (3个文件)
+├── product-*.uvue (10个文件)
+├── user-*.uvue (3个文件)
+├── marketing-*.uvue (2个文件)
+├── order-*.uvue (1个文件)
+├── system-*.uvue (3个文件)
+└── 其他 (20+ 个子页面)
+```
+
+### 阶段 2: 结构规范化（优先级中）
+
+**目标**: 将页面结构规范化为 ListPage/FormPage/DetailPage 模板
+
+#### 改进的页面结构
+
+```uvue
+<template>
+  <AdminLayout :currentPage="pageName">
+    <!-- 页面标题 -->
+    <view class="page-header">
+      <view class="header-left">
+        <text class="page-title">{{ pageTitle }}</text>
+        <text class="page-subtitle">{{ pageSubtitle }}</text>
+      </view>
+      <view class="header-right">
+        <button class="btn btn-primary" @click="handleCreate">新增</button>
+      </view>
+    </view>
+
+    <!-- 搜索区 -->
+    <view class="search-section">
+      <!-- 搜索表单 -->
+    </view>
+
+    <!-- 内容区 -->
+    <view class="content-section">
+      <!-- 表格或列表 -->
+    </view>
+
+    <!-- 分页 -->
+    <view class="pagination">
+      <!-- 分页控制 -->
+    </view>
+  </AdminLayout>
+</template>
+```
+
+### 阶段 3: 组件化（优先级低）
+
+**目标**: 使用新开发的组件库替换原生元素
+
+涉及：Button, Input, Select, Table, Pagination 等组件
+
+---
+
+## 📋 详细的改进计划
+
+### 第一步：修复 system-info.uvue ✅
+
+**当前状态**: 已修复
+**修改内容**:
+
+- 替换硬编码颜色为变量
+- 添加完整的页面内容（显示系统信息卡片）
+- 规范样式名称
+
+### 第二步：修复 user-management.uvue 等主要页面
+
+**文件列表**:
+
+- user-management.uvue
+- product-management.uvue
+- order-management.uvue
+- system-settings.uvue
+- 等...
+
+**修改内容**:
+
+- 替换所有硬编码值为设计变量
+- 统一样式命名（使用 kebab-case）
+- 添加 lang="uts" 和类型定义
+
+### 第三步：修复子页面
+
+**目标文件夹**:
+
+- maintain/data/\*.uvue
+- maintain/dev-config/\*.uvue
+- maintain/dev-tools/\*.uvue
+- maintain/security/\*.uvue
+- product/product-classification/\*.uvue
+- system/api/\*.uvue
+- system/permission/\*.uvue
+- 等...
+
+---
+
+## 📈 预期成果
+
+### 完成后
+
+| 指标           | 前      | 后   |
+| -------------- | ------- | ---- |
+| 硬编码值       | 200+ 个 | 0 个 |
+| 设计变量使用率 | 0%      | 100% |
+| 代码一致性     | 30%     | 100% |
+| 样式可维护性   | 差      | 优秀 |
+
+### 时间估计
+
+| 阶段             | 文件数 | 估时          | 优先级 |
+| ---------------- | ------ | ------------- | ------ |
+| 阶段 1: 快速修复 | 50+    | 4-6小时       | ⭐⭐⭐ |
+| 阶段 2: 结构规范 | 20     | 6-8小时       | ⭐⭐   |
+| 阶段 3: 组件化   | 10     | 8-10小时      | ⭐     |
+| **总计**         | **80** | **18-24小时** |        |
+
+---
+
+## 🎯 优先修复顺序
+
+### 优先级 P0（立即修复）
+
+1. system-info.uvue ✅ 已完成
+2. user-management.uvue
+3. product-management.uvue
+4. order-management.uvue
+5. system-settings.uvue
+
+### 优先级 P1（本周完成）
+
+6-20. maintain 目录下的所有文件
+21-30. product、system、user 目录下的主要文件
+
+### 优先级 P2（本月完成）
+
+31-80. 其他子页面和组件页面
+
+---
+
+## 🚀 开始修复
+
+现在开始修复 P0 优先级的文件...
+
+**预计完成时间**: 2-3 小时内完成前 5 个主要文件
+
+---
+
+**创建日期**: 2026-01-31
+**维护者**: AI Assistant
+**状态**: 执行中