Files
shanxia2.0/openspec/changes/dict-management/specs/dict-frontend/spec.md
T

2.7 KiB

ADDED Requirements

Requirement: 字典类型列表页

系统 SHALL 提供字典类型标准列表页面,遵循 unit/index.vue 模板,包含搜索区域(关键词)、工具栏(新增按钮)、数据表格(字典名称、字典类型编码、排序号、备注、操作列)、分页器。

Scenario: 字典类型列表展示

  • WHEN 用户访问字典管理页面
  • THEN 页面显示字典类型列表,操作列包含"字典数据配置"、"编辑"、"删除"按钮

Scenario: 关键词搜索

  • WHEN 用户在搜索框输入关键词并点击搜索
  • THEN 列表按 dict_name 或 dict_type 模糊匹配过滤

Requirement: 字典类型新增/编辑弹窗

系统 SHALL 提供字典类型新增/编辑弹窗,使用 label-position="top" + .form-grid-2 布局,字段包含字典名称(dict_name)、字典类型编码(dict_type)、排序号(order_num)、备注(remark)。

Scenario: 新增字典类型

  • WHEN 用户点击"新增"按钮
  • THEN 弹窗打开,表单为空,提交后创建新字典类型

Scenario: 编辑字典类型

  • WHEN 用户点击某行"编辑"按钮
  • THEN 弹窗打开,表单回填当前行数据,提交后更新

Requirement: 字典数据配置弹窗

系统 SHALL 提供字典数据配置弹窗,当用户点击字典类型行的"字典数据配置"按钮时弹出。弹窗内展示该字典类型下的字典数据表格,支持新增、编辑、删除操作。

Scenario: 打开字典数据配置

  • WHEN 用户点击某字典类型的"字典数据配置"按钮
  • THEN 弹窗打开,标题显示"XX 字典数据配置",表格展示该类型的字典数据列表

Scenario: 弹窗内新增字典数据

  • WHEN 用户在弹窗内点击"新增"按钮
  • THEN 表格顶部出现编辑行,用户填写 dict_label、dict_value、order_num、remark 后保存

Scenario: 弹窗内编辑字典数据

  • WHEN 用户在弹窗内点击某行"编辑"
  • THEN 该行变为编辑状态,修改后保存

Scenario: 弹窗内删除字典数据

  • WHEN 用户在弹窗内点击某行"删除"并确认
  • THEN 该条字典数据被软删除,从列表移除

Requirement: 路由注册

字典管理页面 SHALL 注册到系统管理路由组下,路径为 /system/dict。

Scenario: 通过菜单访问

  • WHEN 用户点击系统管理菜单下的"字典管理"
  • THEN 路由跳转到字典类型列表页

Requirement: 列表面板标题规范

列表页面板标题 SHALL 显示"字典管理",并使用 ::before 伪元素显示 primary 色竖线。

Scenario: 标题显示

  • WHEN 页面加载完成
  • THEN 面板标题区域显示带绿色竖线的"字典管理"标题