网页设计多个导入式 第1篇
单一的数据录入功能，不仅影响工作效率与体验感，增加数据录入成本，同时还容易加大数据录入错误几率。批量导入功能采用Excel批量整理数据，不仅可以快速复制粘贴相同字段，提高多人协作填写效率，还可以及时的对数据进行维护。达到提高效率，降低成本，控制风险的目的。
批量导入对于提高操作效率，降低人力成本，控制录入风险有重大意义。
就这个功能本身而言，一般表现出来的逻辑会比较简单：上传文件→弹出一个本地文件选择框→选择文件→完成数据导入。
但实际上需要根据产品的业务需求场景来考虑数据导入过程中的各个环节，不仅要考虑当前情况，还要考虑未来有没有可能和其他系统产生紧密的联系，否则容易出问题，影响用户操作体验。常见的数据批量导入场景包含数据批量初始化、数据批量迁移、数据批量维护等。
网页设计多个导入式 第2篇
功能设计需遵循产品整体设计规范。
B端产品一般是为企业组织服务的，终极目标是“赋能”，而批量导入功能其重要价值是提高企业的办公协同效率，释放人力，减少企业和个人的时间成本。
批量导入的交互样式因产品不同，样式也会有所差别，但功能目的是一致的，具体样式还应结合实际产品需求来设计。
注：文章中可能存在一些错误，如果各位大佬对文章中内容有更好的建议，欢迎一起交流~
网页设计多个导入式 第3篇
首先需要设计一份数据录入模板，设计前与业务方产品方沟通，确认数据录入模板里面包含的字段，同时制定相关字段维度及录入规则，确定录入数据字段格式及属性，详细告知用户录入规则。
将网页表单输入的要求映射到Excel单元格中，并着重考虑数据的完整性和规范性。一份录入规则清晰且容易维护的数据模板，不仅能提高用户填写数据的效率，同时能有效降低后期数据导入错误率。关于设计数据录入模板的问题我将从以下几个方面详细举例展开说明：具体分析可参考下面不同产品中的导入模板示例图，分别来自飞书、钉钉、有赞。有兴趣的同学可以亲自去体验一下产品。
第一种：.xlsx / .xls 格式模板 支持自由定义第二种：.csv 格式模板 仅支持文本这里展开说说关于.xlsx / .xls与.csv的格式区别，主要区别在于分隔符和编码。具体总结有三点：a、csv 是纯文本，体积小，容易导入到各种PC表格及数据库中，方便创建分发读取。b、xlsx、xls 是二进制的文件，用Excel才能打开。xls是03版Office支持的，xlsx是07版Office文件格式。c、csv 数据表字段用“半角逗号”隔开，以ascii码编码，每一行数据以回车符隔开，xls、xlsx字段之间的分割符是tab.。这块内容涉及开发知识，参考网友总结的。
结构一般由3部分组成：填写须知、表头、示例数据
（1）填写须知
如飞书管理后台-用户导入模板，填写须知是放在表格第一栏；如钉钉客户管理-企业客户_导入模板，填写须知放在另外一个sheet中；如有赞模板-批量导入客户，填写须知是逐条放在表头上方，没有示例数据部分。
实际产品中，建议还是增加示例数据，示例数据尽可能真实，这样能更好的引导用户正确填写录入数据，提高正确率。还有一些是将各个字段的填写规则备注在各个字段输入框内，这样做的优点是所见即所得，看完一条规则完成一列数据的填写，比较谨慎，不容易出错，缺点是字段填写须知是隐藏的，需要用户定位到输入框内才能看到，影响填写效率。
示例图还做了关于字段值填写失败的校验提示。关于数据验证的类型可以参考腾讯文档使用教程，里面有比较详细的解释说明。
（2）表头
这里主要强调的是表头字段格式。字段数量及具体内容根据业务需求来定，一般为锁定状态，不可更改，主要分为必填项和非必填项，必填项一般会用特别标注出来。
如飞书管理后台-用户导入模板，必填项是用暗红色背景，同时在填写须知里面说明“标红字段为必填项，黑色字段为选填项”；如钉钉客户管理-企业客户_导入模板，必填项字段文字标为红色，同时在填写须知里面说明“必填性：Excel中“红色”字段为必填字段，“黑色”字段为选填字段，是否必填是由管理员的表单设置决定的”；还有一些其他的必填样式，比如“*”号，文字标注必填等等。样式没有限制，只要能清晰的标明必填选填满足用户填写诉求就可以。对于一些关键字段要设置明确的填写规则，以引导用户高效无误的录入相关数据。如手机号字段必须是11位数字，性别必须是男、女中的一个值；
有一些字段需要精确到最小颗粒度，比如日期是用年月日YYYY-MM-DD，还是年月YYYY-MM，所在地址是用国家-省份-城市，还是直接用城市，这些都是要在填写须知里面写清楚。如果是多个字段尽量不要混在一列中，否则校验数据的时候，需要先将数据拆分，才能对单个数据进行校验，增加数据校验的复杂度。如国家、省份、城市应该分成3列，而不是一列。
一些特殊字段需要用到逗号，分号，括号等不同的符号，而中英文的符号在代码中表现不同，为了更好的识别校验，最好还是明确输入语言。如飞书管理后台-用户导入模板中”部门负责人：请填入「是」、「否」，若不填则默认为「否」，若归属于多个部门请用英文“undefined”隔开；”这里就强调了要用英文逗号隔开。对于固定选项的字段，根据业务场景特定设置的一些字段，提供选择，而非输入，这样有利于用户快速操作，比如飞书用户导入模板里面有一项是填写人员类型，在须知里面已经说明“人员类型：请从下列选项中选填一个选项：「正式」、「实习」、「外包」、「劳务」、「顾问」，若不填则默认为「正式」；”那么在模板中就可以提前设置选项，用户录入数据的时候直接选择就可以了，如下图：
文件大小看校验能力以及等待时长，目前对于上传数据条数接口没有限制，服务器有限制。
为了节省服务器的空间和提高文件传输的速度，需要限制上传文件的大小，建议不要过大。
有一些模板在填写须知里，告知相关规则，如建议最多导入5000条数据，数据量过大影响导入速度；
如果需要限制文件大小，则要在页面上明确告知用户，如“当前版本单次最多只允许上传5000条数据且文件大小不超过100M”。
这些规则将关联后面数据校验。
这里想说明的版本问题，主要有两点：
第一点是版本的兼容性因为用户使用的软件有差异，所以应该考虑各个软件版本间的兼容性。例如Office与WPS办公软件，理应支持各版本xls、xlsx格式的Excel表，一般在操作过程中，大多数人喜欢另存文件，根据本地所使用的软件不同，格式也会有差别。
第二点是模板版本迭代因为随着企业的发展，产品会进行迭代升级，功能也会相应的出现新增或删减，这个时候如果关联的字段数据发生了变化，就需要前后端对数据模板进行重新设置，为了更好的查阅历史变更记录，需要对模板版本进行存储，并提供最新的模板给用户下载，同时也要以书面形式告知用户模板版本更新了，防止用户依然用本地存储的旧模板。
命名虽然是很小的一件事，但却是很关键的一件事，清晰易辨识的文件名能够被用户快速找到，并且在上传文件的时候不易出错。
最终使用模板的不一定是专业的业务人员，B端产品很多时候是多个业务系统相互关联的，而且后期维护的时候还涉及到运营人员，所以相关规则一定要提前设置好，这样可以在产品上线后省去很多麻烦，也不易被用户挑战。
导入模板是前端导入创建数据，后端分发数据的基础，所以上面用比较大的篇幅来分析讲解数据导入模板的设计。
其次是确定数据创建的规则，这些规则的制定也需要与业务产品方沟通，同时需要考虑前后端的数据处理逻辑，必要时也需要前后端研发人员一起参与制定。创建规则主要包含数据的处理、校验、创建，下面我们就这三个方面进行具体说明。
为了能顺利的创建数据，在提供了批量导入功能后，需要提供相应的数据处理功能。根据后端响应时间，处理的方式有同步和异步两种，同步和异步是开发技术中的两个概念，计算机通过解析和运行程序完成相应的操作。虽然同步或者异步处理是数据导入时应该考虑的，但是我个人认为在了解业务需求及后台系统性能的情况下，应该提前确定好数据处理方式，以便产品设计给出最优解决方案。
同步处理
同步处理是按顺序处理，前端发起请求后，后端必须即刻响应，即时返回结果。且同一时间只执行一个简单任务，任务处理完后再执行第二个任务，同步处理适用于数据量较少时，后台校验的逻辑简单的任务。导入结果一般是在任务结束后同步返回给用户。
操作路径：用户在前端发起批量导入的请求 → 后端接收请求并处理 → 一定时间内返回处理结果 → 前端用户查看结果
优点：请求任务流程单一有序，响应时间短，用户能及时的看到结果。
缺点：如果数据量过大，导致用户等待时间过长，很有可能因为响应超时而导入失败，给用户带来负面感受，达不到用户预期；如果用户不小心关闭了页面，处理会中断，从体验上对用户不够友好。
例如创客贴里面的上传素材，TDesign中关于如何设计高频任务中的批量文件导入示例。
异步处理
异步处理是并行处理，前端发起请求后，后端先接收请求，可以在系统空闲时间处理。且同时可以处理多个任务，适用于数据量大，校验复杂，系统关联逻辑比较多的批量导入任务。导入结果一般是在单个任务或全部任务完成后以msg的形式通知用户。
操作路径：用户在前端发起批量导入的请求 → 后端接收请求 → 等待空闲时间处理 → 返回处理结果（无时间限制） → 前端用户查看结果
优点：后端处理请求的过程中，用户可关闭当前页面，去做其他事情，避免用户长时间等待；后端返回结果的时间没有限制，还能降低导入失败的概率，用户体验更好。
缺点：因用户在导入后不能马上看到结果，不能及时的修改错误数据，影响数据的快速有效创建。ps:如果对创建数据时间等完全没要求，这也算不得缺点hhhh~
例如多麦营销系统，从下图可以看出，有专门的任务列表菜单，可以随时查看导入进度，有问题的数据也会被详细记录，并提供失败报告下载功能入口。
一些企业使用像企业微信、钉钉、飞书等一些第三方平台，导入结果也会以通知消息的形式发送给用户。
比如导入成功：【XX后台系统】您“2021-07-29 19:16:39”提交的“批量导入企业客户”任务已完成，共100条数据，100条导入成功。查看详情>
比如导入失败：【XX后台系统】您“2021-07-29 19:16:39”提交的“批量导入企业客户”任务已完成，共100条数据，35条导入失败。查看详情>
数据能够被创建是需要遵循一定的校验规则的，不管是批量导入表格还是单条数据录入，校验规则必须保持一致。值得注意的是数据的追加、覆盖、删除等规则都需要写在填写须知里面告知用户，对于一些必填项但遇到无法提供字段值的情况应告知用户填写“-”或者“/”等类似符号，如果用户不填写空着，系统将会校验失败。
用户的核心诉求是快速将数据录入系统，那么我们的解决方案应充分围绕核心需求来设计。
数据批量导入时需要遵循以下几个校验规则：
通用校验规则
校验类型包含：必填校验、格式校验、范围校验
必填校验是指校验表头字段标记“*”必填星号或者背景标红(颜色自定义)的字段，字段值填写是否为空。
格式校验是指校验表头字段为日期、时间、ID、身份证号、手机号、金额、数量、链接等具有一定特殊格式的字段，字段值是否填写正确。如国内手机号仅允许填写11位，如果填写的手机号少于或多余11为，那么就会校验失败。
范围校验是指校验表头字段为时间范围、字数限制、字段取值等具有一定限制区间的字段，字段值是否填写正确。如公司今年需要招聘实习生，那么毕业时间就应该限制在2022年-2023年之间，如果填写的时间不在这个取值范围，那么就会校验失败。
有一些特殊的字段，字段逻辑比较复杂，校验顺序应该是必填校验→格式校验→数据重复校验。
特殊校验规则
数据导入时，如何报错？
用户在导入的时候无法保证录入的数据百分百正确，如果其中部分数据正确，部分数据错误，通常有两种处理方法：
第一种是数据校验有误时，不允许被导入。数据之间是相互关联的，单条数据的异常会影响其他待导入的数据，那么就应该终止导入。
第二种是允许导入校验正确的数据，错误数据提供可修改入口，用户修改后重新创建。提供错误数据修改的方式常见的有两种，如下图所示：
方式一：在显示导入结果的时候返回一个excel失败/错误报告，供用户下载。产品需提前设计错误报告表格格式。需要注意的是通常错误报告表格最后一栏会标注数据导入失败的原因，全部修改后可重新导入。失败原因那一栏可以不要求删除，但要与开发说明，读取数据的时候失败原因那一栏不读取。当一条数据有多个错误，需要用中文逗号隔开“，”。如：手机号错误，毕业日期超出规定范围，毕业状态不存在。这种方式的优势是可以处理大批量的数据，当错误数据较多时，方便用户一次性修改错误的数据。
缺点是对于用户而言操作步骤较复杂，需要用户下载错误报告，再进行修改。这里可能存在重新导入后还是有问题的情况，那就需要重复多次下载错误报告，直至数据完全正确后导入成功。