需求如标题(前端实现用户可自定义表格数据,并完成导出)
有查看过bootStarp关于导出文件源码的朋友可能知道 bootStarp虽然提供了导出文件的ui,但是功能却并不是他自己的,而是调用的其他插件的(js),而且坏会有一些其他问题 于是自己搞....
上图
用到的框架 jq啥的就不说了
bootStarp(表格)、layui(Ui)、jqueryUi(实现拖拽)
思路
1)打开这个页面后传递过来所需要的参数,请求后台(也可以写配置文件在前台)取出表的字段名(主要是为了要显示的中文,及表头)在此功能内称之为 bean
2)根据 bean 格式化bootStarp table需要的 cloum[]及设置表头 在此功能内称之为 cloum
3)设置colum 刷新表格数据
生产bean,设置bean、生产colum,设置colum 完活
左半部分的字段中文是可以拖拽改变位置的,此处可以设置成位置改变后刷新表格数据展示(但是感觉没什么必要,而且会增加服务器压力,主要是还得 看jqui代码 -_-!!)点击底部预览按钮可完成刷新操作,或者直接导出 也会先走一次 预览刷新。
代码不贴了 已经打包上传csdn了 有问题留言 大家一起讨论
代码及包下载地址 https://download.youkuaiyun.com/download/yanpengfeil/11295970