iview-admin 页面导入excel数据

小咪咪 2021-06-22 15:39 642阅读 0赞

方式一、用现成的 Upload 标签

方式二、使用xlsx

1、安装插件

npm install -S file-saver xlsx  
 npm install -D script-loader  
 npm install xlsx  
     
2、引入   import XLSX from 'xlsx'

3、页面

4、 js

data () {
                return {
                    tableData:[], 
                    tdLen:'',
                    tableColumns: [
                    ]
                }
            },         
            methods: {
            //数据提交后台
                submitData() {
                    let _this = this
                    var data = JSON.stringify(this.tableData)
                    addTbm(data).then(res => {
                        let i = res.data.data
                        alert('成功汇入'+i)
    
                    })
    
                },
                //数据导入页面
                importData(){
                    let _this = this
                    let myfile = this.$refs.myfile;
                    let files = myfile.files;
                    this.file = files[0];
                    var rABS = false; //是否将文件读取为二进制字符串
                    var f = this.file;
        
                    var reader = new FileReader();
                    FileReader.prototype.readAsBinaryString = function(f) {
                        var binary = "";
                        var rABS = false; //是否将文件读取为二进制字符串
                        var pt = this;
                        var wb; //读取完成的数据
                        var outdata;
                        var reader = new FileReader();
                        reader.onload = function(e) {
                            var bytes = new Uint8Array(reader.result);
                            var length = bytes.byteLength;
                            for (var i = 0; i < length; i++) {
                                binary += String.fromCharCode(bytes[i]);
                            }
                            //此处引入，用于解析excel
                            var XLSX = require("xlsx");
                            if (rABS) {
                                wb = XLSX.read(btoa(fixdata(binary)), {
                                //手动转化
                                type: "base64"
                                });
                            } else {
                                wb = XLSX.read(binary, {
                                type: "binary"
                                });
                            }
                            outdata = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]); 
                            //outdata就是读取的数据（不包含标题行即表头，表头会作为对象的下标）
                            //此处可对数据进行处理
                            let arr = [];
                            let cDate = _this.getCurrDate()
                            outdata.map(v => {
                                let obj = {}
                                obj.a1 = v['资产名称']
                                obj.a2 = v['资产编号']
                                arr.push(obj)
                            });
                            _this.tableData=arr;
                            _this.tdLen=arr.length;
                            return arr;
                        };
                        reader.readAsArrayBuffer(f);
                    };
                    if (rABS) {
                        reader.readAsArrayBuffer(f);
                    } else {
                        reader.readAsBinaryString(f);
                    }
    
                },
                 reset(){
                    this.$refs.myfile.value = ''
                    this.tableData = []
                }
        }