feat(module-management): 导航状态化阶段三——概览配置完成度 checklist
- 新组件 ModuleOverviewChecklist:字段/表单/列表/查询/权限按依赖顺序排列, 状态以文案表达(缺 N/已配置 N,不只靠颜色),空态给引导文案 - 条目点击与 Enter 跳转对应分节;查询缺配提供「一键补充」 (复用 fillMissingConfigs,不冒泡为跳转);仅数据/查询模块渲染 - index.vue 补 fieldsEnabledCount/listVisibleCount/powersCount 派生统计; 表单/查询缺配复用阶段二/既有的 missingEditCount/missingQueryCount - 新 spec module-overview-checklist 7 用例:条目显隐、缺配/完整/空态文案、 跳转与一键补充事件
This commit is contained in:
1 parent
6bfa0d816f
commit
29f98494af
3 files changed
+273
No files matched your search
@@ -0,0 +1,77 @@
|
||||
/**
|
||||
* 概览完成度清单(ModuleOverviewChecklist)测试:
|
||||
* - 条目随模块类型显隐(data 含表单设计,query 不含)
|
||||
* - 缺配/完整/空态文案(状态不只靠颜色,文案本身是断言对象)
|
||||
* - 条目点击与键盘 Enter 跳转对应分节;「一键补充」不冒泡为跳转
|
||||
*/
|
||||
import { mount } from '@vue/test-utils'
|
||||
import { describe, expect, it } from 'vitest'
|
||||
import ModuleOverviewChecklist from '@/views/system/module-management/components/ModuleOverviewChecklist.vue'
|
||||
|
||||
function mountList(props) {
|
||||
return mount(ModuleOverviewChecklist, {
|
||||
props: {
|
||||
moduleType: 'data',
|
||||
fieldsEnabledCount: 5,
|
||||
editMissingCount: 0,
|
||||
listVisibleCount: 5,
|
||||
queryMissingCount: 0,
|
||||
powersCount: 3,
|
||||
...props,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
function rowOf(wrapper, label) {
|
||||
return wrapper.findAll('.mm-checklist__item').find((item) => item.text().includes(label))
|
||||
}
|
||||
|
||||
describe('ModuleOverviewChecklist', () => {
|
||||
it('data 模块渲染全部条目,按依赖顺序排列', () => {
|
||||
const wrapper = mountList({})
|
||||
const labels = wrapper.findAll('.mm-checklist__label').map((el) => el.text())
|
||||
expect(labels).toEqual(['字段定义', '表单设计', '列表配置', '查询配置', '权限'])
|
||||
})
|
||||
|
||||
it('query 模块不渲染表单设计条目', () => {
|
||||
const wrapper = mountList({ moduleType: 'query' })
|
||||
const labels = wrapper.findAll('.mm-checklist__label').map((el) => el.text())
|
||||
expect(labels).toEqual(['字段定义', '列表配置', '查询配置', '权限'])
|
||||
})
|
||||
|
||||
it('缺配状态以文案表达:表单缺 N、查询缺 N 且提供一键补充', () => {
|
||||
const wrapper = mountList({ editMissingCount: 2, queryMissingCount: 3 })
|
||||
expect(rowOf(wrapper, '表单设计').text()).toContain('缺 2 项未布局')
|
||||
const queryRow = rowOf(wrapper, '查询配置')
|
||||
expect(queryRow.text()).toContain('缺 3 项')
|
||||
expect(queryRow.find('button').exists()).toBe(true)
|
||||
})
|
||||
|
||||
it('完整状态文案与无补充按钮', () => {
|
||||
const wrapper = mountList({})
|
||||
expect(rowOf(wrapper, '表单设计').text()).toContain('均已布局')
|
||||
expect(rowOf(wrapper, '查询配置').text()).toContain('完整')
|
||||
expect(wrapper.find('button').exists()).toBe(false)
|
||||
})
|
||||
|
||||
it('空态提示:无启用字段时引导先定义字段', () => {
|
||||
const wrapper = mountList({ fieldsEnabledCount: 0, editMissingCount: 0, listVisibleCount: 0, powersCount: 0 })
|
||||
expect(rowOf(wrapper, '字段定义').text()).toContain('先去定义字段')
|
||||
expect(rowOf(wrapper, '列表配置').text()).toContain('暂无可见列')
|
||||
expect(rowOf(wrapper, '权限').text()).toContain('尚未配置权限')
|
||||
})
|
||||
|
||||
it('条目点击与 Enter 均触发 navigate,携带对应分节 key', async () => {
|
||||
const wrapper = mountList({})
|
||||
await rowOf(wrapper, '字段定义').trigger('click')
|
||||
await rowOf(wrapper, '查询配置').trigger('keydown', { key: 'Enter' })
|
||||
expect(wrapper.emitted('navigate')).toEqual([['fields'], ['query']])
|
||||
})
|
||||
|
||||
it('一键补充按钮触发 fill-missing 且不触发 navigate', async () => {
|
||||
const wrapper = mountList({ queryMissingCount: 3 })
|
||||
await rowOf(wrapper, '查询配置').find('button').trigger('click')
|
||||
expect(wrapper.emitted('fill-missing')).toHaveLength(1)
|
||||
expect(wrapper.emitted('navigate')).toBeUndefined()
|
||||
})
|
||||
})
|
||||
Reference in new issue
Block a user