|
|
@@ -1,5 +1,5 @@
|
|
|
-<%@ page contentType="text/html;charset=UTF-8"%>
|
|
|
-<%@ include file="/webpage/include/taglib.jsp"%>
|
|
|
+<%@ page contentType="text/html;charset=UTF-8" %>
|
|
|
+<%@ include file="/webpage/include/taglib.jsp" %>
|
|
|
<link rel="stylesheet" href="${ctxStatic}/plugin/layui/dist/css/layui.css">
|
|
|
<script src="${pageContext.request.contextPath}/act/rest/js/common/jquery-1.8.3.js"></script>
|
|
|
<script src="${ctxStatic}/plugin/layui/dist/layui.js"></script>
|
|
|
@@ -12,14 +12,47 @@
|
|
|
<meta http-equiv=X-UA-Compatible content=IE=EmulateIE7>
|
|
|
<meta name="renderer" content="webkit">
|
|
|
<style>
|
|
|
- .layui-input{ height: 28px;margin-top: 6px;line-height: 28px}
|
|
|
- .layui-table-view .layui-table {width:100%}
|
|
|
- .myselect{border: none;padding: 5px 7px;min-height: 20px;color: #666666;line-height: 20px}
|
|
|
- .mydiv{padding: 5px 7px;min-height: 20px;border: whitesmoke;line-height: 20px}
|
|
|
- .mydiv:empty:before{content: attr(placeholder);color:#999999;}
|
|
|
- .mydiv:focus:before{content:none}
|
|
|
- .layui-table-tips-main{display:none}
|
|
|
- .layui-table-tips-c{display:none}
|
|
|
+ .layui-input {
|
|
|
+ height: 28px;
|
|
|
+ margin-top: 6px;
|
|
|
+ line-height: 28px
|
|
|
+ }
|
|
|
+
|
|
|
+ .layui-table-view .layui-table {
|
|
|
+ width: 100%
|
|
|
+ }
|
|
|
+
|
|
|
+ .myselect {
|
|
|
+ border: none;
|
|
|
+ padding: 5px 7px;
|
|
|
+ min-height: 20px;
|
|
|
+ color: #666666;
|
|
|
+ line-height: 20px
|
|
|
+ }
|
|
|
+
|
|
|
+ .mydiv {
|
|
|
+ padding: 5px 7px;
|
|
|
+ min-height: 20px;
|
|
|
+ border: whitesmoke;
|
|
|
+ line-height: 20px
|
|
|
+ }
|
|
|
+
|
|
|
+ .mydiv:empty:before {
|
|
|
+ content: attr(placeholder);
|
|
|
+ color: #999999;
|
|
|
+ }
|
|
|
+
|
|
|
+ .mydiv:focus:before {
|
|
|
+ content: none
|
|
|
+ }
|
|
|
+
|
|
|
+ .layui-table-tips-main {
|
|
|
+ display: none
|
|
|
+ }
|
|
|
+
|
|
|
+ .layui-table-tips-c {
|
|
|
+ display: none
|
|
|
+ }
|
|
|
</style>
|
|
|
</head>
|
|
|
<body style="height: 100%;line-height: 100%">
|
|
|
@@ -28,65 +61,70 @@
|
|
|
<div class="layui-row layui-col-space15">
|
|
|
<div class="layui-col-md12">
|
|
|
<div class="layui-card">
|
|
|
- <div class="layui-card-body" style="margin-top: 2px;">
|
|
|
- <div class="layui-upload">
|
|
|
- <button type="button" class="layui-btn layui-btn-normal" id="add_List">添加文件</button>
|
|
|
- <div class="layui-upload-list">
|
|
|
- <table class="layui-table" id="mytable">
|
|
|
- <thead>
|
|
|
- <tr>
|
|
|
- <th width="45%">*文件名称</th>
|
|
|
- <th width="22%" style="text-align: center">操作</th>
|
|
|
- </tr></thead>
|
|
|
- <tbody id="tbody_List">
|
|
|
- </tbody>
|
|
|
- </table>
|
|
|
- </div>
|
|
|
+ <div class="layui-card-body" style="margin-top: 2px;">
|
|
|
+ <div class="layui-upload">
|
|
|
+ <button type="button" class="layui-btn layui-btn-normal" id="add_List">添加文件</button>
|
|
|
+ <div class="layui-upload-list">
|
|
|
+ <table class="layui-table" id="mytable">
|
|
|
+ <thead>
|
|
|
+ <tr>
|
|
|
+ <th width="45%">*文件名称</th>
|
|
|
+ <th width="22%" style="text-align: center">操作</th>
|
|
|
+ </tr>
|
|
|
+ </thead>
|
|
|
+ <tbody id="tbody_List">
|
|
|
+ </tbody>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</body>
|
|
|
<script type="text/javascript">
|
|
|
/*//定义存放文件数组*/
|
|
|
- var arrayFile=[];
|
|
|
+ var arrayFile = [];
|
|
|
/*加载layui文件上传*/
|
|
|
- layui.use('upload', function(){
|
|
|
+ layui.use('upload', function () {
|
|
|
var $ = layui.jquery
|
|
|
- ,upload = layui.upload;
|
|
|
+ , upload = layui.upload;
|
|
|
//多文件列表示例
|
|
|
var tbodyListView = $('#tbody_List')
|
|
|
- ,uploadListIns = upload.render({
|
|
|
+ , uploadListIns = upload.render({
|
|
|
elem: '#add_List'
|
|
|
- ,accept: 'file'
|
|
|
- ,exts:'xls|xlsx'
|
|
|
- ,multiple: true
|
|
|
- ,auto: false
|
|
|
- ,choose: function(obj){
|
|
|
+ , accept: 'file'
|
|
|
+ , exts: 'xls|xlsx'
|
|
|
+ , multiple: true
|
|
|
+ , auto: false
|
|
|
+ , choose: function (obj) {
|
|
|
// var files = this.files = obj.pushFile(); //将每次选择的文件追加到文件队列
|
|
|
//读取本地文件
|
|
|
- obj.preview(function(index, file, result){
|
|
|
+ obj.preview(function (index, file, result) {
|
|
|
//添加 id 到数组
|
|
|
arrayFile.push(index);
|
|
|
//添加文件到数组
|
|
|
arrayFile.push(file);
|
|
|
//拼接生成表格
|
|
|
- var tr = $(['<tr id='+index+'>'
|
|
|
- ,'<td hidden><div class="td_id">'+index+'</div></td>'
|
|
|
- ,'<td readonly="readonly"><input id="myDiv" type="textarea" style="width: 100%" contenteditable="true" readonly="true" disabled="true" class="mydiv1 mydiv" placeholder="请输入项目名称" value="'+file.name.split(".")[0]+'"></input></td>'
|
|
|
+ var tr = $(['<tr id=' + index + '>'
|
|
|
+ , '<td hidden><div class="td_id">' + index + '</div></td>'
|
|
|
+ , '<td readonly="readonly"><input id="myDiv" type="textarea" style="width: 100%" contenteditable="true" readonly="true" disabled="true" class="mydiv1 mydiv" placeholder="请输入项目名称" value="' + file.name.substring(0,file.name.lastIndexOf(".")) + '"></input></td>'
|
|
|
// ,'<td>'
|
|
|
// ,' <select name="type" class="myselect"><option value="">请选择项目类型</option><option value="1">架空线路工程</option><option value="2">电缆工程</option><option value="3">变电站工程</option></select>'
|
|
|
// ,'<td><div contenteditable="true" class="mydiv2 mydiv" placeholder="请输入项目编号"></div></td>'
|
|
|
// ,'<td><div contenteditable="true" class="mydiv3 mydiv" placeholder="请输入供应商"></div></td>'
|
|
|
- ,'<td style="text-align: center">'
|
|
|
- ,'<button class="layui-btn layui-btn-xs layui-btn-danger demo-delete">删除</button>'
|
|
|
- ,'</td>'
|
|
|
- ,'</tr>'].join(''));
|
|
|
+ , '<td style="text-align: center">'
|
|
|
+ , '<button class="layui-btn layui-btn-xs layui-btn-danger demo-delete">删除</button>'
|
|
|
+ , '</td>'
|
|
|
+ , '</tr>'
|
|
|
+ ].
|
|
|
+ join('')
|
|
|
+ )
|
|
|
+ ;
|
|
|
//删除
|
|
|
- tr.find('.demo-delete').on('click', function(){
|
|
|
+ tr.find('.demo-delete').on('click', function () {
|
|
|
// delete files[index]; //删除对应的文件
|
|
|
tr.remove();//删除tr
|
|
|
//清空input file当中已经存在文件
|
|
|
@@ -106,36 +144,36 @@
|
|
|
// 获取表格id的值
|
|
|
var file = $(":file").val;
|
|
|
//获取输入的项目名称
|
|
|
- var div1 = $(".mydiv1");
|
|
|
+ var div1 = $(".mydiv1");
|
|
|
console.log(div1);
|
|
|
//判断列表中项目名称是否为空
|
|
|
- if (div1.length<=0){
|
|
|
- layer.msg("请选择文件",{icon: 3,offset:['40%','40%']});
|
|
|
+ if (div1.length <= 0) {
|
|
|
+ layer.msg("请选择文件", {icon: 3, offset: ['40%', '40%']});
|
|
|
return false;
|
|
|
}
|
|
|
//存储列表中 输入项目名称的值
|
|
|
- var divvalue=[];
|
|
|
+ var divvalue = [];
|
|
|
//存储列表中 输入项目名称的值
|
|
|
- var div_val=[];
|
|
|
+ var div_val = [];
|
|
|
//循环获取当前项目列表的项目名称
|
|
|
for (var i = 0; i < div1.length; i++) {
|
|
|
//存放到集合当中
|
|
|
- divvalue[i]=div1[i].defaultValue;
|
|
|
+ divvalue[i] = div1[i].defaultValue;
|
|
|
console.log('div1[i].defaultValue');
|
|
|
console.log(div1[i].defaultValue);
|
|
|
- div_val[i]=div1[i].defaultValue;
|
|
|
+ div_val[i] = div1[i].defaultValue;
|
|
|
}
|
|
|
//判断项目名称是否重复
|
|
|
for (var i = 0; i < divvalue.length; i++) {
|
|
|
- if(div_val[i] === divvalue[i+1]){
|
|
|
- layer.msg("选择文件重复",{icon: 5,offset:['40%','40%']});
|
|
|
+ if (div_val[i] === divvalue[i + 1]) {
|
|
|
+ layer.msg("选择文件重复", {icon: 5, offset: ['40%', '40%']});
|
|
|
throw SyntaxError;
|
|
|
}
|
|
|
}
|
|
|
//根据id获取对象文件传入后台
|
|
|
for (var j = 0; j < arrayFile.length; j++) {
|
|
|
//追加文件到表单当中
|
|
|
- formdata.append("file",arrayFile[j+1]);
|
|
|
+ formdata.append("file", arrayFile[j + 1]);
|
|
|
}
|
|
|
jp.loading(' 正在导入，请稍等...');
|
|
|
$.ajax({
|
|
|
@@ -148,8 +186,8 @@
|
|
|
cache: false,
|
|
|
timeout: 600000,
|
|
|
success: function (result) {
|
|
|
- if(result.success && result.errorCode === '-1'){
|
|
|
- jp.confirm('项目'+result.msg+'已存在，确定覆盖嘛？', function(){
|
|
|
+ if (result.success && result.errorCode === '-1') {
|
|
|
+ jp.confirm('项目' + result.msg + '已存在，确定覆盖嘛？', function () {
|
|
|
jp.loading(' 正在导入，请稍等...');
|
|
|
$.ajax({
|
|
|
type: "POST",
|
|
|
@@ -165,33 +203,33 @@
|
|
|
}
|
|
|
})
|
|
|
});
|
|
|
- }else if((result.success && result.errorCode === '0')){
|
|
|
+ } else if ((result.success && result.errorCode === '0')) {
|
|
|
fn(result)
|
|
|
}
|
|
|
},
|
|
|
- error:function(xhr, textStatus){
|
|
|
- if(xhr.status == 0){
|
|
|
+ error: function (xhr, textStatus) {
|
|
|
+ if (xhr.status == 0) {
|
|
|
jp.info("连接失败，请检查网络!")
|
|
|
- }else if(xhr.status == 404){
|
|
|
- var errDetail ="<font color='red'>404,请求地址不存在！</font>";
|
|
|
- top.layer.alert(errDetail , {
|
|
|
+ } else if (xhr.status == 404) {
|
|
|
+ var errDetail = "<font color='red'>404,请求地址不存在！</font>";
|
|
|
+ top.layer.alert(errDetail, {
|
|
|
icon: 2,
|
|
|
- area:['auto','auto'],
|
|
|
- title:"请求出错"
|
|
|
+ area: ['auto', 'auto'],
|
|
|
+ title: "请求出错"
|
|
|
})
|
|
|
- }else if(xhr.status && xhr.responseText){
|
|
|
- var errDetail ="<font color='red'>"+ xhr.responseText.replace(/[\r\n]/g,"<br>").replace(/[\r]/g,"<br>").replace(/[\n]/g,"<br>")+"</font>";
|
|
|
- top.layer.alert(errDetail , {
|
|
|
+ } else if (xhr.status && xhr.responseText) {
|
|
|
+ var errDetail = "<font color='red'>" + xhr.responseText.replace(/[\r\n]/g, "<br>").replace(/[\r]/g, "<br>").replace(/[\n]/g, "<br>") + "</font>";
|
|
|
+ top.layer.alert(errDetail, {
|
|
|
icon: 2,
|
|
|
- area:['80%','70%'],
|
|
|
- title:xhr.status+"错误"
|
|
|
+ area: ['80%', '70%'],
|
|
|
+ title: xhr.status + "错误"
|
|
|
})
|
|
|
- }else{
|
|
|
- var errDetail =xhr.responseText=="<font color='red'>未知错误!</font>";
|
|
|
- top.layer.alert(errDetail , {
|
|
|
+ } else {
|
|
|
+ var errDetail = xhr.responseText == "<font color='red'>未知错误!</font>";
|
|
|
+ top.layer.alert(errDetail, {
|
|
|
icon: 2,
|
|
|
- area:['auto','auto'],
|
|
|
- title:"真悲剧，后台抛出异常了"
|
|
|
+ area: ['auto', 'auto'],
|
|
|
+ title: "真悲剧，后台抛出异常了"
|
|
|
})
|
|
|
}
|
|
|
}
|
|
|
@@ -199,8 +237,8 @@
|
|
|
}
|
|
|
</script>
|
|
|
<script>
|
|
|
- layui.use('form',function () {
|
|
|
- var form = layui.form;
|
|
|
+ layui.use('form', function () {
|
|
|
+ var form = layui.form;
|
|
|
form.render();
|
|
|
})
|
|
|
</script>
|
[user3]