这里导入分两种 ：
1.导入excel数据到后台：批量导入
2.导入excel数据到网页：单条导入
导入的excel模板如下：
报表模板
- HTML
<span onclick="doBatchImport()">批量导入</span>
<span onclick="doInputImport()">单条导入</span>
- JS
要引入dataTableExcel.js，js见文章dataTableExcel
require([ 'jquery', 'knockout' ,'dataTableExcel',
'/df/pe/commonModal/js/excel.js',
'uui','tree','grid','ip','dateZH','select2', 'jszip', 'bolb', 'xlsx', 'fileSaver'
],
function($,ko,dtExcel,Exp) {
$(function() {
ko.cleanNode($("body"));
app = u.createApp({
el : '.wrapper',
model : viewModel
});
});
}
);
- 批量导入后台
var ip = {};
doBatchImport = function(){
ip.uploadFile(getFilecallback_excel); //getFilecallback_excel回调函数
}
/**
* 文件上传
*/
ip.uploadFile = function(callback) {
// var input = '<input type="file" id="_select-file" hidden>'
var input = document.createElement('input')
input.type = 'file'
input.id = '_select-file'
input.style.display = 'none'
input.multiple = 'true'
// input.accept =
input.onchange = function(e) {
$('#_select-file').remove()
//拿到选择的excel文件
var files = [].slice.call(e.target.files, 0)
if(typeof callback === 'function') {
callback(files, e)//通过回调行数取出files
}
}
document.body.appendChild(input)
input.click()
}
//回调函数
getFilecallback_excel = function(files){//取得files
//组织数据传到后台
var data = new FormData();//重要！要定义FormData存放导入的数据
files.forEach(function(file) {//通过append存放每一条要导入的excel
data.append('files', file);
});
//传给后台
ajaxObj.import(data)
};
//交互
ajaxObj.import = function(data){
$.ajax({
async : true,
type : 'POST',
url: baseUrl+"import.do",
data : data,
beforeSend : function() {//设置等待图标
ip.loading(true);
},
complete : function() {//完成上传后，等待图标消失
ip.loading(false);
},
// 告诉jQuery不要去处理发送的数据!
processData : false,
// 告诉jQuery不要去设置Content-Type请求头!
contentType : false,
success: function(data) {
if (!data.flag) {
ip.warnJumpMsg(data.result, 0, 0, true);
return
}
ip.ipInfoJump(data.msg, "success");
}
});
}
//等待上传动态图表
ip.loading = function(flag) {
var configModal = $("#info-loading")[0];
if (!configModal) {
var innerHTML = '<div id="info-loading" class="info-loading"><img src="/df/trd/ip/image/loading.gif"></div>';
$("body").append(innerHTML);
}
if (flag) {
$("#info-loading").css("display", "block");
$("#info-loading").css("z-index", "5555"); //解决有弹窗后被遮挡问题
} else {
$("#info-loading").css("display", "none");
}
}
- 单条导入
/**
* 单条导入
*/
doInputImport = function(){
if(operate == 'detail'){
ip.ipInfoJump("详情页面不能操作！", "info");
return
}
var opt = {
"isAppend" : false,
"callback" : function(result) {//回调行数，返回处理好的excel数据
$("#import-file").val($("#dataTableExcelFileInput__").val());
exlFun.setImpProInfo(result);//填报项目信息赋值
exlFun.setImpIndexsInfo(result);//填报指标信息赋值
}
};
//获取excel导入的excel数据，以数组的形式返回数据 dtExcel所有方法见dataTableExcel.js
dtExcel.importRawFromExcel(opt);
$('#importTemplateModal').modal('hide');
};
//填充导入的excel项目信息
exlFun.setImpProInfo = function(proInfo){
console.log('导入的表格信息：');
console.log(proInfo);
var proInfoObj = {};
proInfoObj.PRJ_NAME = proInfo[4][3]?proInfo[4][3]:'';//项目名称 PRJ_NAME
var mgr_dept = proInfo[5][3]?proInfo[5][3]:'';//主管部门
var mgr_dept_name = proInfo[5][7]?proInfo[5][7]:'';
if(mgr_dept && mgr_dept_name){
var index = mgr_dept.indexOf(mgr_dept_name);
var mgr_dept_code = mgr_dept.substring(0,index);
}
proInfoObj.MGR_DEPT_CODE = mgr_dept_code?mgr_dept_code:'';//主管部门代码 MGR_DEPT_CODE
proInfoObj.MGR_DEPT_NAME = mgr_dept_name?mgr_dept_name:'';//主管部门名称 MGR_DEPT_NAME
proInfoObj.EXEC_DEPT_NAME = proInfo[5][7];//实施单位 EXEC_DEPT_NAME
proInfoObj.PRJ_KIND = proInfo[6][3];//项目属性 PRJ_KIND
proInfoObj.MTT_AMOUNT = proInfo[7][4]+'';//中期资金总额 MTT_AMOUNT
proInfoObj.MTF_AMOUNT = proInfo[8][4]+'';//其中：财政拨款 MTF_AMOUNT
proInfoObj.YF_AMOUNT = proInfo[9][4]+'';//其他资金 YF_AMOUNT
//
proInfoObj.YT_AMOUNT = proInfo[7][7]+'';//年度资金总额 YT_AMOUNT
proInfoObj.MTO_AMOUNT = proInfo[8][7]+'';//其中：财政拨款 MTO_AMOUNT
proInfoObj.YO_AMOUNT = proInfo[9][7]+'';//其他资金 YO_AMOUNT
//
proInfoObj.MT_GOAL = proInfo[11][1];//中期目标 MT_GOAL
proInfoObj.Y_GOAL = proInfo[11][5];//年度目标 Y_GOAL
proInfoObj.EN_CODE = '';//单位编号 EN_CODE
proInfoObj.EN_NAME = '';//单位名称 EN_NAME
proInfoObj.PRJ_CODE = '';//项目编号 PRJ_CODE
proInfoObj.PRJ_ORG_CODE = '';//处室编码 PRJ_ORG_CODE
proInfoObj.PRJ_ORG_NAME = '';//处室名称 PRJ_ORG_NAME
proInfoObj.REPLY_BUDGET_CURRENT = '';//当前预算 REPLY_BUDGET_CURRENT
proInfoObj.CS_NAME = '';//业务类别 CS_NAME
console.log(proInfoObj);
operateData.initEditData("inputProInfo",proInfoObj);
/*proInfoObj.CS_NAME = proInfo[6][7];//项目期
proInfoObj.PRJ_BEGIN_DATE = proInfo[1][0];//项目开始日期 PRJ_BEGIN_DATE
proInfoObj.PRJ_END_DATE = proInfo[1][0];//项目结束日期 PRJ_END_DATE*/
}
//填充导入 excel指标列表信息
exlFun.setImpIndexsInfo = function(proInfo){
var indexsArrayData = [];
for(var i = 13; i < proInfo.length; i++){
var rowData = {};
for(var j = 1; j< 9; j++){
rowData.LEVEL1_INDEX = proInfo[i][1];
rowData.LEVEL2_INDEX = proInfo[i][2];
rowData.LEVEL3_INDEX = proInfo[i][3];
rowData.INDEX_VAL = proInfo[i][4];
rowData.LEVEL2_INDEX_YEAR = proInfo[i][5];
rowData.LEVEL3_INDEX_YEAR = proInfo[i][6];
rowData.INDEX_VAL_YEAR = proInfo[i][8];
}
indexsArrayData.push(rowData);
}
console.log(indexsArrayData);
viewModel.indexsGridDataTable.setSimpleData(indexsArrayData);
}
