mirror of
https://gitee.com/beijing_hongye_huicheng/lilishop-ui.git
synced 2025-12-21 02:15:54 +08:00
028f32a73c
- 将iView组件统一替换为TDesign组件 - 优化表单、表格、弹窗等交互样式 - 修复路由重复添加问题 - 更新依赖版本 - 调整布局间距与响应式 - 修复表单重置方法兼容性 - 统一消息提示组件
38 lines
2.1 KiB
Markdown
38 lines
2.1 KiB
Markdown
## 目标
|
||
- 增加 Tabs 与内容的间距样式
|
||
- 将“查看”弹窗统一为右侧抽屉并用 `t-descriptions` 展示
|
||
- 修复自定义分词页面 `resetFields()` 报错为 TDesign 的 `reset()`
|
||
|
||
## 涉及页面与改动
|
||
### 1) 站内信模板
|
||
- 文件：`manager/src/views/sys/message/noticeMessageTemplate.vue`
|
||
- 改动：
|
||
- 给 `t-tabs` 增加类名（如 `notice-tabs`），样式：`::v-deep(.notice-tabs .t-tabs__content){ padding-top:16px }`
|
||
- 在每个 `t-tab-panel` 内包裹 `div.tab-content` 并设 `padding-top:16px`
|
||
- 将查看详情 `t-dialog` 改为 `t-drawer`（`placement="right" size="800px"`），内容改为 `t-descriptions` 单列展示（标题、类型、模板内容等），保留编辑/发送交互不变
|
||
|
||
### 2) 意见反馈
|
||
- 文件：`manager/src/views/page/feedback/feedback.vue`
|
||
- 改动：
|
||
- 将详情 `t-dialog` 改为 `t-drawer`（右侧展开）
|
||
- 只读内容用 `t-descriptions` 单列展示（用户名、手机、类型、内容、图片列表），移除禁用表单控件
|
||
- 分页区域由 iView `Row/Page` 改为 `t-pagination`（保持现有页码/页大小逻辑）
|
||
- 抽屉底部仅保留“返回”按钮（左对齐）
|
||
|
||
### 3) 自定义分词
|
||
- 文件：`manager/src/views/custom-words/index.vue`
|
||
- 改动：
|
||
- 在 `add()` 等调用中，将 `this.$refs.form.resetFields()` 替换为：
|
||
- `if (this.$refs.form && typeof this.$refs.form.reset === 'function') { this.$refs.form.reset(); } else { this.form = { name: '' } }`
|
||
- 初始化 `this.form` 改为显式字段对象，确保校验兼容
|
||
- 检查页面是否存在其他 iView API（如 `$Message/$Modal`），若有统一为 `MessagePlugin/DialogPlugin`
|
||
|
||
## 验证
|
||
- 打开对应页面，切换 Tabs，间距生效
|
||
- 点击“查看”→ 抽屉从右侧展开，信息以 `t-descriptions` 单列展示，底部仅“返回”按钮
|
||
- 自定义分词点击“添加”，不再出现 `resetFields` 报错，表单成功清空
|
||
- 分页切换正常且无控制台警告
|
||
|
||
## 注意
|
||
- 不改动现有业务接口与数据结构；仅替换 UI 容器与只读展示方式
|
||
- 样式值可根据视觉反馈上调（如 20px） |