3.操作小齿轮弹窗

text
2026年7月17日阅读约 1 分钟74 字

更新于 2026年7月17日

一、整体布局结构

弹窗独立层级,弹窗内垂直分层:弹窗标题栏 → 列配置多选列表区 → 弹窗底部操作按钮组;无页面全局顶部导航、侧边菜单栏、数据表格、筛选表单、分页控件、页面底部信息区。
分组规则:配置项垂直单行均匀排布,底部按钮横向并排。

二、分区域元素拆解

(一)弹窗顶部标题栏

  1. 静态标题文本:列设置
  2. 右上角图标按钮组
    • 全屏/还原图标按钮
    • 关闭弹窗图标按钮(×)

(二)列配置多选列表区(垂直排布单行配置项)

每行统一结构:拖拽排序图标 + 勾选复选框 + 字段名称静态文本

  1. 配置项1:复选框勾选,字段名「图片标题」
  2. 配置项2:复选框勾选,字段名「人像图片」
  3. 配置项3:复选框勾选,字段名「任务名称」
  4. 配置项4:复选框勾选,字段名「审核状态」
  5. 配置项5:复选框勾选,字段名「查询状态」
  6. 配置项6:复选框勾选,字段名「案件编号」
  7. 配置项7:复选框勾选,字段名「查询事由」
  8. 配置项8:复选框勾选,字段名「提交人/提交IP」
  9. 配置项9:复选框勾选,字段名「提交单位/时间」
  10. 配置项10:复选框勾选,字段名「任务证书」

(三)弹窗底部操作按钮组(横向排布)

  1. 次按钮:重置
  2. 主按钮:确定

(四)无交互元素

页面半透明重复水印文本

三、元素类型分类汇总清单

1. 表单类输入控件

选择类控件

复选框(共10个,全部勾选,对应表格列显隐配置)

缺失表单元素

无单行输入框、多行文本域、下拉、单选、日期、上传控件

2. 按钮类元素

弹窗控制图标按钮

弹窗全屏按钮、弹窗关闭×图标按钮

配置操作按钮

重置(次按钮)、确定(主按钮)

辅助交互图标

每行左侧拖拽排序图标(用于调整列展示顺序)

3. 表格/列表类组件

无业务数据表格、数据行、分页、筛选、行操作按钮;仅表格列配置清单

4. 静态文本展示元素

弹窗标题「列设置」、各表格字段名称文本、水印背景文本

5. 缺失组件说明

无顶部全局导航、左侧树形侧边菜单、页面标签、业务查询表单、数据明细表格、批量操作按钮、图片上传区域、页面底部状态栏、新增/编辑/删除/查询功能按钮