3.导入人员信息弹窗
一、整体布局结构
弹窗独立层级,弹窗内垂直分层:弹窗标题栏 → 文件上传表单区 → 格式限制提示文本 → 模板下载功能按钮;无页面全局顶部导航、侧边菜单栏、数据列表、分页控件、页面底部信息区。
分组规则:业务模块垂直分隔,上传框居中展示,提示文字、下载按钮依次垂直排布。
二、分区域元素拆解
(一)弹窗顶部标题栏
- 静态标题文本:导入
- 右上角图标按钮组
- 全屏/还原图标按钮
- 关闭弹窗图标按钮(×)
(二)弹窗主体文件上传表单区
- 虚线边框上传容器框
- 无交互装饰图标:云+向上箭头
- 静态提示文本:将文件拖到此处,或
- 文字链接按钮:点击导入(文件上传控件交互入口,支持拖拽上传、点击唤起本地文件选择)
(三)格式限制说明静态文本
文本内容:只支持.xls、.xlsx格式文件,文件大小不超过5M
(四)模板下载功能按钮
文字链接按钮:下载Excel模板
(五)无交互元素
页面半透明重复水印文本
三、元素类型分类汇总清单
1. 表单类输入控件
文件上传控件(双模式:拖拽上传、点击唤起本地文件选择)
2. 按钮/链接类元素
弹窗控制图标按钮
弹窗全屏按钮、弹窗关闭×图标按钮
功能文字链接按钮
点击导入(上传触发入口)、下载Excel模板(模板下载功能)
3. 静态文本展示元素
弹窗标题「导入」、上传区提示文案、文件格式与大小限制说明文本、背景水印文本
4. 静态装饰元素
上传区域云+箭头图标(仅视觉提示,无交互)
5. 缺失组件说明
无顶部全局导航、侧边树形菜单、页面标签、筛选表单、数据表格/列表、分页控件、单选/多选/下拉/日期/文本域输入框、新增/编辑/删除/查询操作按钮、底部状态栏信息区、批量操作按钮