fix: 渠道账号群聊同步缓存 key 及成员名称兜底;统一 Docker/Maven 项目约定
This commit is contained in:
47
admin-web/REFACTOR_GUIDE.md
Normal file
47
admin-web/REFACTOR_GUIDE.md
Normal file
@@ -0,0 +1,47 @@
|
||||
# admin-web 视图重构指南
|
||||
|
||||
## 目标
|
||||
把现有 Element Plus 页面统一为新的 Sino-MCI 设计语言:现代、统一、操作便捷、信息密度高。
|
||||
|
||||
## 设计参考
|
||||
参考原型:`.stitch/designs/sino-mci-prototype.html`
|
||||
|
||||
## 通用规范
|
||||
|
||||
### 页面结构
|
||||
1. 顶部工具栏:左侧放搜索/筛选,右侧放唯一主操作按钮(新增/创建/测试发送等)。
|
||||
2. 内容区:白色卡片(`el-card` 或自定义 `.bg-white rounded-xl border`)包裹表格。
|
||||
3. 表格:
|
||||
- 删除无意义复选框;
|
||||
- 删除每行多个操作按钮;
|
||||
- 行可点击,点击后从右侧滑出抽屉(`el-drawer`)查看/编辑详情;
|
||||
- 保留状态开关、标签等必要展示字段;
|
||||
- 需要时显示分页(`el-pagination`)。
|
||||
4. 新增用弹窗(`el-dialog`),编辑用抽屉,保持两者形式统一:标题栏 + 表单 + 底部确认/取消。
|
||||
|
||||
### 视觉
|
||||
- 主色:`#2563EB`
|
||||
- 背景:`#F8FAFC`
|
||||
- 卡片/表面:`#FFFFFF`,圆角 12px,边框 `#E2E8F0`
|
||||
- 文字主色:`#0F172A`,次要:`#64748B`
|
||||
- 字号:正文 14px,标题 16-18px,辅助 12-13px
|
||||
- 间距:页面内边距 24px,卡片内部 16-20px
|
||||
|
||||
### 交互
|
||||
- 行 hover 变灰(`hover:bg-slate-50` 等效样式)。
|
||||
- 按钮层级:主操作 `type="primary"`,次级 `link` 或默认。
|
||||
- 删除操作放在抽屉底部或二次确认弹窗中,不要直接显示在列表行。
|
||||
- 状态变更尽量使用行内 `el-switch`,切换后调用 API 并刷新列表。
|
||||
|
||||
### 代码约束
|
||||
- 保留原有 API 调用和业务逻辑,只改模板和样式。
|
||||
- 使用 `<script setup lang="ts">`。
|
||||
- 继续使用 Element Plus 组件,不引入新依赖。
|
||||
- 每个视图文件底部使用 `<style scoped>` 自定义局部样式,避免污染全局。
|
||||
- TypeScript 编译不能报错;重构后应能通过 `npm run build`。
|
||||
|
||||
### 抽屉内容示例
|
||||
- 对象名称/标题
|
||||
- 基本信息(描述列表或表单)
|
||||
- 关联信息(应用、账号、标签、会话等)
|
||||
- 底部:保存 / 取消 / 删除
|
||||
Reference in New Issue
Block a user