2.批量导入

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

更新于 2026年7月17日

一、整体布局结构

弹窗独立层级,分为弹窗顶部标题栏、弹窗主体内容区,无页面顶部导航/侧边栏/列表/底部信息区等页面级组件。

  1. 顶层:弹窗标题通栏
  2. 下层:弹窗表单上传主区域(垂直分组排布:上传拖拽组件 → 格式限制提示文本 → 模板下载链接按钮)

二、分区域元素拆解

(一)弹窗顶部标题栏

  1. 静态标题文本:批量导入
  2. 右上角图标按钮组
    • 全屏/放大图标按钮
    • 关闭弹窗图标按钮(×)

(二)弹窗主体表单区(垂直分组)

1. 文件上传控件(拖拽上传组件)

  • 虚线边框容器框
  • 云+上传箭头静态图标
  • 提示静态文本:将文件拖到此处,或
  • 内嵌文字链接按钮:点击导入(触发本地文件选择弹窗,上传控件交互入口)
  • 功能属性:拖拽上传 + 点击上传双模式文件上传控件

2. 格式限制说明静态文本

文本内容:只支持.xls,.xlsx格式文件,文件大小不超过1M

3. 模板下载功能按钮

文字链接按钮:下载Excel模板

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

1. 表单类输入控件

  • 文件上传控件(支持拖拽上传、点击唤起本地文件选择)

2. 按钮/链接类元素

  1. 图标按钮
    • 弹窗最大化图标按钮
    • 弹窗关闭图标按钮
  2. 文字功能链接按钮
    • 点击导入(上传触发入口)
    • 下载Excel模板(模板下载功能)

3. 静态文本展示元素

  • 弹窗标题:批量导入
  • 上传区提示文案:将文件拖到此处,或
  • 文件格式限制说明文本:只支持.xls,.xlsx格式文件,文件大小不超过1M

4. 静态装饰元素

上传区云+箭头图标(无交互,仅视觉提示)
页面半透明水印文本(无业务交互)

5. 不存在元素说明

无顶部导航、侧边菜单栏、数据表格列表、分页控件、单选/多选/下拉/日期/文本域输入框、新增/编辑/删除/查询操作按钮、数据行操作、底部信息栏组件。