从零开始实现放置游戏(六)——实现后台管理系统(4)Excel批量导入

简介: 前面我们已经实现了在后台管理系统中,对配置数据的增删查改。但每次添加只能添加一条数据,实际生产中,大量数据通过手工一条一条添加不太现实。本章我们就实现通过Excel导入配置数据的功能。这里我们还是以地图数据为例,其他配置项可参照此例。

 前面我们已经实现了在后台管理系统中,对配置数据的增删查改。但每次添加只能添加一条数据,实际生产中,大量数据通过手工一条一条添加不太现实。本章我们就实现通过Excel导入配置数据的功能。这里我们还是以地图数据为例,其他配置项可参照此例。

涉及的功能点主要有对office文档的编程、文件上传功能。流程图大致如下:


502227-20190620212815907-919213713.png


一、添加依赖项


  解析office文档推荐使用免费的开源组件POI,已经可以满足80%的功能需求。上传文件需要依赖commons-fileupload包。我们在pom中添加下列代码:


<!-- office组件 -->
<dependency>
    <groupId>org.apache.poi</groupId>
    <artifactId>poi</artifactId>
    <version>4.1.0</version>
</dependency>
<dependency>
    <groupId>org.apache.poi</groupId>
    <artifactId>poi-ooxml</artifactId>
    <version>4.1.0</version>
</dependency>
<!-- 文件上传 -->
<dependency>
    <groupId>commons-fileupload</groupId>
    <artifactId>commons-fileupload</artifactId>
    <version>1.4</version>
</dependency>


 另外,之前我们配置的mvc视图解析器只能解析简单的视图,上传文件需要支持multipart。在spring-mvc.xml中添加如下配置:


<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
    <property name="defaultEncoding" value="UTF-8"></property>
    <property name="maxUploadSize" value="10485770"></property>
    <property name="maxInMemorySize" value="10485760"></property>
</bean>


这里配置了上传最大限制10MB,对于excel上传来说足矣。


二、文件上传、解析、落库


  在MapController中,我们添加3个方法


 MapController.java


 其中,importExcel方法,时候对应前端点击导入按钮时的后端入口,在这个方法中,我们定义了临时文件上传路径,校验了文件名后缀,保存上传的文件到服务器,并在操作结束后将临时文件删除; loadExcelData方法,利用POI组件读取解析Excel数据,Excel数据怎么配我们可以自由定义,这里读取时自由调整对应的行列即可,本例使用的Excel在文末给出的源码中可以找到; saveExcelData方法,将解析到的数据列表存入数据库,这里调用的batchInsert批量添加方法,在前面讲增删查改的时候已经提前实现了。


  另外,在使用POI组件读取Excel数据时,需要先判断单元格格式,我们创建一个工具类PoiUtil来实现此功能,这种在以后的其他项目中也可以使用的工具类,我们把它提取出来,放到util模块中,作为我们的通用工具包,以便日后使用。在util模块新建包com.idlewow.util.poi,并添加PoiUtil类:


 PoiUtil.java


工具类提取到util模块后,需要在util模块也添加对Poi的依赖,并在rms模块添加对util的依赖。这里util模块中,依赖项的scope为provided即可,仅在编译阶段使用,因为在引用此工具包的模块中肯定已经引入了POI依赖,无需重复打包:


<dependencies>
    <dependency>
        <groupId>org.apache.poi</groupId>
        <artifactId>poi</artifactId>
        <version>4.1.0</version>
        <scope>provided</scope>
    </dependency>
    <dependency>
        <groupId>org.apache.poi</groupId>
        <artifactId>poi-ooxml</artifactId>
        <version>4.1.0</version>
        <scope>provided</scope>
    </dependency>
</dependencies>


三、修改前端页面


在地图列表页面list.jsp中,添加导入excel的按钮。


<form>
    …………
    …………
    <div class="layui-inline layui-show-xs-block">
        <button type="button" class="layui-btn" onclick="xadmin.open('添加地图','add',500,500)">
            <i class="layui-icon"></i>添加地图
        </button>
    </div>
    <div class="layui-upload layui-inline layui-show-xs-block">
        <button type="button" class="layui-btn layui-btn-normal" id="btnSelectFile">选择Excel</button>
        <button type="button" class="layui-btn" id="btnImport">开始导入</button>
    </div>
</form>


在列表页面的list.js中,绑定相应的按钮事件。


layui.use(['upload', 'table', 'form'], function () {
    …………
    …………
    layui.upload.render({
        elem: '#btnSelectFile',
        url: '/manage/map/importExcel',
        accept: 'file',
        exts: 'xls|xlsx',
        auto: false,
        bindAction: '#btnImport',
        done: function (result) {
            if (result.code === 1) {
                layer.alert(result.message, {icon: 6},
                    function () {
                        layui.layer.closeAll();
                        layui.table.reload('datatable');
                    });
            } else {
                layer.alert(result.message, {icon: 5});
            }
        }
    });
});


四、运行效果


  以上,excel导入的功能就全部完成了,我们运行下看下效果:


微信图片_20220423202744.gif


小结


  本章通过导入Excel文件,实现了批量录入的功能。


     下一章,预计实现添加、修改时的参数校验。



相关文章
|
1月前
|
SQL 缓存 easyexcel
面试官问10W 行级别数据的 Excel 导入如何10秒处理
面试官问10W 行级别数据的 Excel 导入如何10秒处理
58 0
|
4月前
|
前端开发 数据库
node使用node-xlsx实现excel的下载与导入,保证你看的明明白白
node使用node-xlsx实现excel的下载与导入,保证你看的明明白白
|
13天前
|
数据库
如何把Excel导入到数据库中
如何把Excel导入到数据库中
8 0
|
17天前
|
easyexcel 数据库
公司大佬对excel导入、导出的封装,那叫一个秒啊
封装公司统一使用的组件的主要目标是为了简化开发人员的调用流程,避免各个项目组重复集成和编写不规范的代码。文中提到对阿里EasyExcel进行了二次封装,提供了导入和导出功能,并支持模板的导入和导出。此外,还处理了读取数据与实际保存数据不一致的情况,通过提供自定义转换器来解决。
38 0
|
27天前
|
easyexcel 数据库
【EasyExcel】第一篇:动态导入excel,生成对应数据库表
【EasyExcel】第一篇:动态导入excel,生成对应数据库表
|
28天前
|
数据库
关于用NPOI导入Excel
关于用NPOI导入Excel
|
2月前
|
存储 数据处理 数据格式
Python中导入Excel数据:全面解析与实践
Python中导入Excel数据:全面解析与实践
42 0
|
2月前
|
存储 关系型数据库 MySQL
Python导入Excel数据到MySQL数据库
Python导入Excel数据到MySQL数据库
99 0
|
2月前
|
Java easyexcel 应用服务中间件
【二十五】springboot使用EasyExcel和线程池实现多线程导入Excel数据
【二十五】springboot使用EasyExcel和线程池实现多线程导入Excel数据
233 0
|
3月前
|
Java
POI上传excel的java后台逻辑
POI上传excel的java后台逻辑