dataWare.html 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>数据仓库</title>
  6. <script src="../../js/min-loader-next.js"></script>
  7. </head>
  8. <body class="content">
  9. <div class="order-body">
  10. <div class="order-tiaojian back-gray">
  11. <div class="tiaojian-part1" id = "conditions">
  12. <div class="fl f12-gray4-op">所选条件:</div>
  13. </div>
  14. <div class="tiaojian-part2 fr demoTable">
  15. <button class="order-bnt1 layui-btn" onclick="reloadSearch()" >查询</button>
  16. <button class="layui-btn order-bnt2" onclick="reset()">重置</button>
  17. <button class="order-bnt2 layui-btn" onclick="uploadExcel()">导入</button>
  18. <button class="order-bnt2 layui-btn" onclick="downLoadExcel()">导出</button>
  19. <a href="#" id="toggle" class="top">收起</a>
  20. </div>
  21. </div>
  22. <form class="layui-form" action="" id = "formRole">
  23. <div class="order-select back-border" id="content">
  24. <div class="d-dashed" style="margin: 10px 0;"></div>
  25. <div class="layui-inline">
  26. <label class="f12-gray4">上传日期:</label>
  27. <div class="layui-input-inline" style="position: relative;">
  28. <input type="text" class="layui-input" id="date" placeholder="请选择日期" readOnly/>
  29. </div>
  30. </div>
  31. <div class="layui-inline">
  32. <label class="f12-gray4">文件名称:</label>
  33. <input name="fileName" id ="fileName" autocomplete="off" placeholder="请输入文件名称" class="search-select" onchange = "changeSelectCon(1,this,'inp')">
  34. </div>
  35. <div class="layui-inline">
  36. <label class="f12-gray4">数据类型:</label>
  37. <div id = "fileTypeDiv" class="layui-inline"></div>
  38. </div>
  39. </div>
  40. </form>
  41. </div>
  42. <div class="shadow-content" style="margin:1.5rem;">
  43. <table id="tableTest" lay-filter="tableFilter"></table>
  44. </div>
  45. <script type="text/html" id="barDemo">
  46. <a class="layui-btn layui-btn-xs" lay-event="detail">详情查看</a>
  47. <a class="layui-btn layui-btn-xs" lay-event="downLoad">下载</a>
  48. <a class="layui-btn layui-btn-xs" lay-event="delete">删除</a>
  49. </script>
  50. <script>
  51. $("#toggle").click(function() {
  52. $(this).html($("#content").is(":hidden") ? "收起" + "<i class='iconfont up iconSelect_drop-down'/></i>" : "展开" +
  53. "<i class='iconfont up iconSelect_drop-down'/></i>");
  54. $("#content").slideToggle();
  55. });
  56. var pageId = "210000";
  57. var table;
  58. var form;
  59. layui.use(['table','laydate', 'form'], function(){
  60. var laydate = layui.laydate;
  61. laydate.render({
  62. elem: '#date'
  63. ,type: 'date'
  64. ,range: true
  65. ,done: function(value, date, endDate){
  66. changeSelectCon(0,"date",'date',value)
  67. }
  68. });
  69. form = layui.form;
  70. $.request({
  71. action : 'BranchFileTypeAction/branchFileTypeQuery',
  72. data : {
  73. },
  74. success : function(data) {
  75. var html = '<select id = "fileType" lay-filter="test"><option value = "">请选择</option>';
  76. var fileTypeList = data.data;
  77. for (var i = 0; i < fileTypeList.length; i ++) {
  78. var fileTypeInf = fileTypeList[i];
  79. html += '<option value = "' + fileTypeInf.id +'">' + fileTypeInf.name + '</option>';
  80. }
  81. html += '</select>';
  82. $("#fileTypeDiv").html(html);
  83. form.render();
  84. form.on('select(test)', function(data){
  85. changeSelectCon(2,data.elem,"sel")
  86. });
  87. },
  88. error : function(data2) {
  89. $.ErrorAlert(data2.MINErrorMessage);
  90. }
  91. });
  92. table = layui.table;
  93. // 加载数据
  94. table.render({
  95. id: 'tableTest'
  96. ,elem: '#tableTest'
  97. ,limit:10
  98. ,url: 'DataWareManageAction/fileInfQuery' //数据接口
  99. ,method: 'post'
  100. ,where:{MINView:"JSON"}
  101. ,page: true //开启分页
  102. ,cols: [[ //表头
  103. {field:'num', title: '序号',width:'5%', type:'numbers', align: 'center'}
  104. ,{field: 'uploadDate', title: '时间', width:'10%', sort: true}
  105. ,{field: 'typeName', title: '数据类型', width:'10%'}
  106. ,{field: 'fileName', title: '文件名称', width:'20%'}
  107. ,{field: 'userName', title: '导入人员', width:'10%'}
  108. ,{field: 'dataNum', title: '数据条数', width: '10%', sort: true}
  109. ,{field: 'operate', title: '操作', width: '25%', toolbar: '#barDemo', fixed : 'right'}
  110. ]]
  111. ,done: function(res, curr, count){
  112. }
  113. ,even: true //开启隔行背景
  114. });
  115. // 监听工具条(操作)
  116. table.on('tool(tableFilter)', function(obj){ //注:tool是工具条事件名,tableFilter是table原始容器的属性 lay-filter="对应的值"
  117. var data = obj.data; //获得当前行数据
  118. var layEvent = obj.event; //获得 lay-event 对应的值(也可以是表头的 event 参数对应的值)
  119. var tr = obj.tr; //获得当前行 tr 的DOM对象
  120. if (layEvent === 'detail'){ //查看
  121. showDetail(data);
  122. } else if(layEvent === 'downLoad'){
  123. window.open("../../DataWareManageAction/fileInfDownload?fileId=" + data.id);
  124. } else if(layEvent === 'delete'){
  125. layer.confirm('确认删除?', function(index){
  126. layer.close(index);
  127. $.request({
  128. action : 'DataWareManageAction/fileInfDelete',
  129. data : {
  130. fileId : data.id,
  131. fileType : data.type//文件类型
  132. },
  133. success : function(data1) {
  134. $.SuccAlert("操作成功!");
  135. reloadSearch();
  136. },
  137. error : function(data2) {
  138. $.ErrorAlert(data2.MINErrorMessage);
  139. }
  140. });
  141. });
  142. }
  143. });
  144. });
  145. function reloadSearch (t) {
  146. var fileName = $("#fileName").val();
  147. var date = $("#date").val();
  148. var type = $("#fileTypeDiv").find("select option:selected").val();
  149. //执行重载
  150. table.reload('tableTest', {
  151. page: {
  152. curr: 1 //重新从第 1 页开始
  153. }
  154. ,where: {
  155. date : date,
  156. fileName : fileName,
  157. type : type
  158. }
  159. });
  160. if (t == 1) {
  161. $.Alert("修改成功");
  162. }
  163. }
  164. function reset(){
  165. $('#formRole')[0].reset();
  166. $("#conditions").html('<div class="fl f12-gray4-op">所选条件:</div>');
  167. }
  168. function uploadExcel(){
  169. var openPageId = pageId + "-01";
  170. openMainTabPage(openPageId, "导入", "reprotManage/dataWareUpload.html?pageId="+openPageId, '', pageId, reloadSearch);
  171. }
  172. function downLoadExcel(){
  173. $.request({
  174. action : 'BranchFileTypeAction/branchFileTypeQuery',
  175. data : {
  176. },
  177. success : function(data) {
  178. var html = '<select><option value = "">请选择</option>';
  179. var fileTypeList = data.data;
  180. for (var i = 0; i < fileTypeList.length; i ++) {
  181. var fileTypeInf = fileTypeList[i];
  182. html += '<option value = "' + fileTypeInf.id +'">' + fileTypeInf.name + '</option>';
  183. }
  184. html += '</select>';
  185. layer.open({
  186. type: 1,
  187. skin: 'layui-layer-rim', //加上边框
  188. area: ['600px', '400px'], //宽高
  189. content: '<form class="layui-form" style = "margin-top : 20px;">' +
  190. '<div class="layui-inline" style = "margin-left : 20px;">' +
  191. '<label class="f12-gray4">数据日期:</label>' +
  192. '<div class="layui-input-inline" style="position: relative;">' +
  193. '<input type="text" class="layui-input" name = "date" placeholder="请选择日期" readOnly/>' +
  194. '</div>' +
  195. '</div>' +
  196. '<div class="layui-inline">' +
  197. '<label class="f12-gray4">文件名称:</label>' +
  198. '<div class="layui-inline">' +
  199. html +
  200. '</div>' +
  201. '</div>' +
  202. '</form>',
  203. btn: ['导出', '取消'],
  204. yes: function(index, layero){
  205. var date = $(".layui-layer").find("input[name='date']").val();
  206. var type = $(".layui-layer").find("select option:selected").val();
  207. if (isEmpty(date)) {
  208. $.ErrorAlert("请选择日期范围!");
  209. return;
  210. }
  211. if (isEmpty(type)) {
  212. $.ErrorAlert("请选择数据类型!");
  213. return;
  214. }
  215. var param = {};
  216. param.date = date;
  217. param.type = type;
  218. exportExcel("../../DataWareManageAction/fileDataDownload", param);
  219. },
  220. btn2: function(index, layero){
  221. },
  222. success: function(layero, index){
  223. form.render();
  224. var time = $(".layui-layer").attr("time");
  225. $(".layui-layer").find("input[name='date']").attr("id","date" + time);
  226. layui.use(['laydate'], function(){
  227. var laydate = layui.laydate;
  228. laydate.render({
  229. elem: '#date' + time
  230. ,type: 'date'
  231. ,range: true
  232. });
  233. })
  234. }
  235. });
  236. },
  237. error : function(data2) {
  238. $.ErrorAlert(data2.MINErrorMessage);
  239. }
  240. });
  241. }
  242. function showDetail(data){
  243. var openPageId = pageId + "-02";
  244. openMainTabPage(openPageId, "详情查看", "reprotManage/dataWareDetail.html?pageId="+openPageId+"&fileId="+data.id+"&fileType="+data.type, '', pageId, null);
  245. }
  246. function changeSelectCon(index, t, type, dateValue){
  247. if (type == "date") {
  248. if (isEmpty(dateValue)) {
  249. $("#search" + index).remove();
  250. } else {
  251. $("#search" + index).remove();
  252. if (isEmpty($("#search" + index).attr("name"))) {
  253. $("#conditions").append(getSelectConHtml(index, t, type,dateValue));
  254. }
  255. }
  256. } else if (type == 'inp') {
  257. if (isEmpty($(t).val())) {
  258. $("#search" + index).remove();
  259. } else {
  260. $("#search" + index).remove();
  261. if (isEmpty($("#search" + index).attr("name"))) {
  262. $("#conditions").append(getSelectConHtml(index, t, type));
  263. }
  264. }
  265. } else {
  266. if (isEmpty($(t).val()) && isEmpty($(t).find("select option:selected").val())) {
  267. $("#search" + index).remove();
  268. } else {
  269. $("#search" + index).remove();
  270. if (isEmpty($("#search" + index).attr("name"))) {
  271. $("#conditions").append(getSelectConHtml(index, t, type));
  272. }
  273. }
  274. }
  275. }
  276. var array = new Array('上传日期','文件名称', '数据类型');
  277. function getSelectConHtml(index, t, type,dateValue){
  278. var name;
  279. if (type == "date") {
  280. name = $("#"+t).attr("id");
  281. } else {
  282. name = $(t).attr("id");
  283. }
  284. var value;
  285. if(type == "inp"){
  286. value = t.value.substr(0,5)+"..";
  287. }
  288. if (type == "date") {
  289. value = dateValue;
  290. }
  291. if(type == "sel"){
  292. value = $(t).find("option:selected").text();
  293. }
  294. var html = '<div class="fl xuanzhong-active" id = "search' + index + '" name = "' + name + '" onclick = "removeSearch(this)">' +
  295. '<div class="fl">' + array[index] + '</div>' +
  296. ':<span>'+value+'</span>' +
  297. '<svg class="icon" aria-hidden="true">' +
  298. '<use xlink:href="#iconicon_close1"></use>' +
  299. '</svg>' +
  300. '</div>';
  301. return html;
  302. }
  303. function removeSearch(t) {
  304. if ($(t).attr("name") == 'subjects') {
  305. initSelect('stateDiv', "COMPANY_STATE", "state", '', true);
  306. form.render();
  307. $(t).remove();
  308. } else {
  309. $("#"+$(t).attr("name")).val('');
  310. var tagName = $("#"+$(t).attr("name")).get(0).tagName;
  311. if ("SELECT" == tagName) {
  312. console.log($("#"+$(t).attr("name")).next())
  313. console.log($("#"+$(t).attr("name")).next().find("input"))
  314. $($("#"+$(t).attr("name")).next().find("input")).val('');
  315. }
  316. $(t).remove();
  317. }
  318. }
  319. </script>
  320. </body>
  321. </html>