48 lines
5.7 KiB
JSON
48 lines
5.7 KiB
JSON
{
|
|
"schema_version": 1,
|
|
"diagram_type": "architecture",
|
|
"meta": {
|
|
"title": "MiragenFlow 前后台组件统一迁移方案",
|
|
"locale": "zh-CN",
|
|
"output": "miragenflow-ui-unification.architecture.html",
|
|
"quality_profile": "showcase",
|
|
"views": [
|
|
{ "id": "current-state", "label": "当前结构", "focus": ["user-pages", "user-adapter", "shared-tdesign", "admin-pages", "admin-tdesign"], "note": "用户端基础控件已通过 TDesign 适配层接入，Ant Design 与 Radix 普通控件仅保留在历史迁移节点；管理台继续使用 TDesign。" },
|
|
{ "id": "target-state", "label": "目标结构", "focus": ["user-pages", "user-adapter", "shared-tdesign", "admin-pages", "admin-tdesign", "lineicons"], "note": "统一 TDesign 基础组件与本地 Lineicons，页面布局、主题变量和业务边界分别保留。" },
|
|
{ "id": "migration-order", "label": "迁移顺序", "focus": ["user-adapter", "shared-tdesign", "admin-tdesign", "shared-contract", "service-api"], "note": "先建立适配层与主题桥接，再按普通控件、反馈弹层、复杂控件的顺序逐页迁移。" }
|
|
]
|
|
},
|
|
"components": [
|
|
{ "id": "user-pages", "type": "frontend", "label": "用户端页面", "sublabel": "web/src/pages + user-console", "tag": "保留页面与业务流程", "pos": [60, 170], "size": [190, 72] },
|
|
{ "id": "user-antd", "type": "external", "label": "历史 Ant Design", "sublabel": "已从当前用户端依赖清理", "tag": "历史迁移节点", "pos": [60, 300], "size": [190, 68] },
|
|
{ "id": "user-radix", "type": "external", "label": "历史 Radix 封装", "sublabel": "普通控件已收敛", "tag": "历史迁移节点", "pos": [60, 425], "size": [190, 68] },
|
|
{ "id": "user-adapter", "type": "frontend", "label": "用户端样式适配层", "sublabel": "保留用户 tokens 与页面 API", "tag": "过渡与隔离边界", "pos": [360, 170], "size": [215, 72] },
|
|
{ "id": "admin-pages", "type": "frontend", "label": "管理台页面", "sublabel": "admin/src/pages + layouts", "tag": "页面业务不变", "pos": [60, 520], "size": [190, 72] },
|
|
{ "id": "admin-tdesign", "type": "frontend", "label": "管理台 TDesign", "sublabel": "tdesign-react + 现有主题", "tag": "保持视觉不变", "pos": [360, 520], "size": [215, 72] },
|
|
{ "id": "shared-tdesign", "type": "frontend", "label": "统一 TDesign 基础层", "sublabel": "组件、弹层、交互与无障碍", "tag": "目标共享层", "pos": [660, 305], "size": [225, 78] },
|
|
{ "id": "lineicons", "type": "frontend", "label": "本地 Lineicons", "sublabel": "web 与 admin 精选子集", "tag": "两端共用图标规范", "pos": [960, 165], "size": [220, 72] },
|
|
{ "id": "shared-contract", "type": "backend", "label": "共享接口契约", "sublabel": "packages/contracts", "tag": "与 UI 解耦", "pos": [960, 365], "size": [220, 72] },
|
|
{ "id": "service-api", "type": "backend", "label": "平台服务端", "sublabel": "server/src/app/http.ts", "tag": "业务逻辑不迁移", "pos": [960, 520], "size": [220, 72] }
|
|
],
|
|
"boundaries": [
|
|
{ "kind": "region", "label": "用户端现状与历史节点", "wraps": ["user-pages", "user-adapter", "user-antd", "user-radix"] },
|
|
{ "kind": "region", "label": "现状：管理台依赖", "wraps": ["admin-pages", "admin-tdesign"] },
|
|
{ "kind": "security-group", "label": "目标：统一 TDesign 与 Lineicons", "wraps": ["user-adapter", "shared-tdesign", "lineicons"] },
|
|
{ "kind": "region", "label": "稳定业务边界", "wraps": ["shared-contract", "service-api"] }
|
|
],
|
|
"connections": [
|
|
{ "id": "user-pages-to-adapter", "from": "user-pages", "to": "user-adapter", "label": "页面 props 保留", "variant": "emphasis", "fromSide": "right", "toSide": "left", "labelDy": -20 },
|
|
{ "id": "adapter-to-shared", "from": "user-adapter", "to": "shared-tdesign", "label": "组件 API 适配", "variant": "emphasis", "fromSide": "right", "toSide": "left", "labelDy": -18 },
|
|
{ "id": "admin-pages-to-tdesign", "from": "admin-pages", "to": "admin-tdesign", "label": "当前已接入", "variant": "emphasis", "fromSide": "right", "toSide": "left", "labelDy": -20 },
|
|
{ "id": "admin-tdesign-to-shared", "from": "admin-tdesign", "to": "shared-tdesign", "label": "抽取稳定基础能力", "variant": "emphasis", "fromSide": "top", "toSide": "bottom", "labelDy": 24 },
|
|
{ "id": "shared-to-lineicons", "from": "shared-tdesign", "to": "lineicons", "label": "图标插槽统一", "variant": "emphasis", "fromSide": "right", "toSide": "left", "labelDy": -18 },
|
|
{ "id": "shared-to-contract", "from": "shared-tdesign", "to": "shared-contract", "fromSide": "right", "toSide": "left" },
|
|
{ "id": "contract-to-api", "from": "shared-contract", "to": "service-api", "variant": "emphasis", "fromSide": "bottom", "toSide": "top" }
|
|
],
|
|
"cards": [
|
|
{ "dot": "emerald", "title": "可行性结论", "items": ["可行：UI 组件替换不改变 server、contracts、路由和业务数据", "管理台 TDesign 作为视觉基准，用户端通过适配层保留现有 tokens 与布局", "统一后可减少重复弹层、表单状态和依赖加载"] },
|
|
{ "dot": "violet", "title": "保留与删除", "items": ["保留用户端页面、中文文案、主题变量、业务组件和 Lineicons", "完成等价能力后删除用户端 Ant Design 核心依赖与重复的 Radix 普通控件封装", "标签多选、搜索下拉、日期、上传和画布控件先由适配层承接"] },
|
|
{ "dot": "amber", "title": "迁移门槛", "items": ["先建立 TDesign 主题桥接和用户端适配 API，禁止新页面继续引入 Ant Design", "每类控件都要验证键盘、ESC、遮罩、主题、移动端和表单受控状态", "按普通输入/选择器、反馈弹层、复杂业务组件分批切换并逐批删除旧依赖"] }
|
|
]
|
|
}
|