mbui.define(['layer'], function (exports) { function bytesToSize(bytes) { const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB']; if (bytes === 0) return '0 Bytes'; const i = Math.floor(Math.log(bytes) / Math.log(1024)); return (bytes / Math.pow(1024, i)).toFixed(2) + ' ' + sizes[i]; } function generateUniqueID(length) { const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'; let id = ''; while (id.length < length) { id += chars.charAt(Math.floor(Math.random() * chars.length)); } return id; } var layer = mbui.layer; var config = { uploadBtn: "uploadBtn", uploadBox: "uploadBox", url: "/api/index/upload", accept: "application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.ms-powerpoint,application/vnd.openxmlformats-officedocument.presentationml.presentation,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,application/pdf,.csv,image/*,text/plain,video/*,audio/*,application/x-zip-compressed", onlyImage: false, more:true, template:function(data){ let exts = ['jpg', 'png', 'gif', 'jpeg']; let filesize = bytesToSize(data.filesize); let fileshow='
'; if(exts.includes(data.fileext)){ fileshow='
'+data.name+'
'; } return `
${fileshow}
${data.name}
${filesize},刚刚
`; }, ajaxUpload:null, loaded:0 }; // 初始化 var fileUpload = function (options) { var timestamp = generateUniqueID(10); var settings = $.extend({}, config, options); //$.extend(true, that.config, options); if(settings.onlyImage){ settings.accept = "image/jpeg,image/png,image/bmp"; } var uploadBtn = $('#'+settings.uploadBtn),uploadBox = $('#'+settings.uploadBox),fileInput = 'fileInput_'+timestamp; uploadBox.append(''); //点击上传 uploadBtn.click(function() { let newtimestamp = Date.now(); $('#'+fileInput).replaceWith($('')); if(settings.loaded == 0){ $('#'+fileInput).click(); } }); //赋值到form表单 function fileValue(){ let file_array = []; uploadBox.find('.mbui-file-div').each(function () { let $id = $(this).data('id'); file_array.push($id); }); uploadBox.find('[data-type="file"]').val(file_array.join(',')); } //删除已上传 uploadBox.on('click','.mbui-file-del',function() { $(this).parent().remove(); fileValue(); }); //附件上传 uploadBox.on('change','#'+fileInput,function() { var fileInput = $(this)[0]; var files = fileInput.files; console.log(files); //return false; if (files) { // 将文件列表转为数组 const filesArray = Array.from(files); // 使用递归方式逐个上传到服务器 function uploadNextFile(index) { if (index >= filesArray.length) { settings.loaded = 0; layer.closeAll(); return; } const file = filesArray[index]; const formData = new FormData(); formData.append('file', file); $.ajax({ url: settings.url, type: 'POST', data: formData, processData: false, contentType: false, beforeSend: function () { // 显示加载按钮 settings.loaded = 1; layer.loading('文件上传中...'); }, complete:function(){ uploadNextFile(index + 1); // 成功后上传下一个 }, success: function(res) { if(res.code==0){ if(typeof(settings.ajaxUpload) == "undefined" || settings.ajaxUpload==null){ var listItem = settings.template(res.data); console.log(index); if(settings.more==false){ uploadBox.find('.mbui-file-div').remove(); } uploadBox.append(listItem); } else{ settings.ajaxUpload(res); } fileValue(); } }, error: function(xhr, status, error) { console.log('文件上传失败'); console.log('错误信息:', error); } }); } // 开始上传第一个文件 uploadNextFile(0); } else { console.log('请选择要上传的文件'); } }); }; function copyCtrl(content) { var save = function(e){ e.clipboardData.setData('text/plain', content); e.preventDefault(); } document.addEventListener('copy', save); document.execCommand('copy'); document.removeEventListener('copy',save); if (content != '') { layer.msg('复制成功'); } } function downloadFile(url, fileName) { let link = document.createElement("a"); link.href = url; link.download = fileName; link.click(); layer.loading('文件下载中...'); } function isWeChat() { return /micromessenger/i.test(navigator.userAgent); } //查看图片 $('body').on('click','.mbui-file-icon',function(e) { e.preventDefault(); let img = $(this).find('img'); let href = img.attr('src'); if (href!=undefined && href!='') { layer.photo(href); } else { let url=window.location.origin + $(this).data('url'); let name=$(this).data('name'); if(isWeChat()){ layer.open({ type: 1, title: '温馨提示', content: '微信或企业微信不支持下载文件附件
请复制链接到手机浏览器下载查看', btn: ['复制链接'], yes:function(index){ copyCtrl(url); layer.close(index); } }); } else{ downloadFile(url,name); } } }); // 导出fileUpload模块 exports('fileupload', function (options) { return new fileUpload(options); }); });