<%@ page contentType="text/html;charset=UTF-8"%>
|
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
|
<c:set var="ctx" value="${pageContext.request.contextPath}" />
|
|
<html>
|
<head>
|
<script type="text/javascript"
|
src="${ctx}/static/jquery/jquery-3.1.0.min.js"></script>
|
|
<script type="text/javascript">
|
//var interval = setInterval('refreshStatus()', 20000);
|
$(document).ready(function() {
|
var info = $("#info").attr("info");
|
$("#infos").html(info);
|
});
|
// 设备页面自动刷新
|
function refreshStatus() {
|
window.location.reload();
|
}
|
// 停止页面自动刷新
|
function disableAutoRefresh() {
|
clearInterval(interval);
|
}
|
function test0() {
|
let exportFileContent = document.getElementById('mtable').outerHTML;
|
let blob = new Blob([ exportFileContent ], {
|
type : 'text/plain;charset=utf-8'
|
}); // 解决中文乱码问题
|
blob = new Blob([ String.fromCharCode(0xFEFF), blob ], {
|
type : blob.type
|
});
|
// 设置链接
|
let link = window.URL.createObjectURL(blob);
|
let
|
a = document.createElement('a'); // 创建a标签
|
a.download = '流程卡切裁率报表.xls'; // 设置被下载的超链接目标（文件名）
|
a.href = link; // 设置a标签的链接
|
document.body.appendChild(a); // a标签添加到页面
|
a.click(); // 设置a标签触发单击事件
|
document.body.removeChild(a); // 移除a标签
|
|
//alert("导出成功")
|
}
|
|
var clickNum = 1;
|
function fb(){
|
clickNum++;
|
//Out.Print(clickNum);
|
//alert(clickNum%2);
|
if(clickNum%2==0){
|
//document.getElementById("tbStyle").classList.add(".tbodyStyle");
|
$("#tbStyle").addClass("tbodyStyle");
|
//$("#fontB").innerHTML = "字体还原";
|
}else{
|
$("#tbStyle").removeClass("tbodyStyle");
|
//document.getElementById("tbStyle").classList.remove(".tbodyStyle");
|
//$("#fontB").innerHTML = "字体加粗";
|
}
|
}
|
</script>
|
<style>
|
.box table tr th, .box table tr td {
|
text-align: center;
|
}
|
|
.table-stripeds>tbody>tr:nth-of-type(odd) {
|
background-color: lightblue;
|
}
|
|
/* 设置最外层容器可以左右滚动*/
|
.mtable {
|
overflow-x: scroll;
|
overflow-y: hidden;
|
position: relative;
|
width: 100%;
|
height: 700px;
|
font-size: 13px;
|
}
|
|
table {
|
border: 1px solid #eee;
|
}
|
|
/* 调节表头宽度 */
|
table thead {
|
background-color: #f5f5f5;
|
width: calc(100%);
|
}
|
|
table thead tr th {
|
background: #5CADFE;
|
}
|
|
/* 固定表头 */
|
table thead, tbody tr {
|
display: table;
|
width: 100%;
|
table-layout: fixed;
|
}
|
|
/* 控制表格滑动 */
|
table tbody {
|
display: block;
|
height: 600px;
|
overflow-y: scroll;
|
}
|
|
/* 隐藏 y轴的滚动条，仍然可以上下滚动 */
|
table tbody::-webkit-scrollbar {
|
display: none;
|
}
|
|
th, td {
|
white-space: nowrap;
|
width: 130px;
|
height: 30px;
|
text-align: center;
|
overflow: hidden;
|
border: 1px solid #f5f5f5;
|
border-width: thin;
|
}
|
|
.tbodyStyle{
|
font-weight:bold;
|
font-size:20px;
|
|
}
|
|
</style>
|
<title>流程卡切裁率报表</title>
|
</head>
|
<body>
|
<div class="content-wrapper">
|
<!-- <div style='height:20px;width:300px;background-color:#3C8DBC;float:right;'><span style = 'color:#fff;' >故障情况:</span><span id='infos'></span></div> -->
|
<section class="content-header">
|
<h1>流程卡切裁率报表</h1>
|
|
<ol class="breadcrumb">
|
|
|
</ol>
|
</section>
|
<div id="allstatu" allstatu="${allstatu}"></div>
|
<div id="info" info="${info}" ></div>
|
<!-- Main content -->
|
<section class="content container-fluid" >
|
<form action="${ctx }/reportform/liuchengkaReportForm" id="formid"
|
method="get">
|
<div style="margin-top: 20px;">
|
工程号：<input type="text" id="gckh" name="gckh" />
|
流程卡号：<input type="text" id="lckh" name="lckh" />
|
开始时间：<input type="datetime-local" id="starttime" name="starttime" value="now()"/>
|
结束时间：<input type="datetime-local" id="findtime" name="findtime" value="moment()"/>
|
<input type="submit" class="btn btn-primary " value="查询" />
|
|
<button type="button" onclick="fb()" class="btn btn-primary " id="fontB" >字体加粗</button>
|
|
<button type="button" onclick="test0()" class="btn btn-primary ">导出表格</button>
|
</div>
|
|
</form>
|
<h3>${sumhtml}</h3>
|
|
<div class="box"
|
style="height: 700px; width: 100%; margin-top: 10px;overflow-x: auto; overflow-y: auto;">
|
<table class="table table-stripeds table-hover" id="mtable"
|
style="overflow-x: auto">
|
<thead class="tbodyStyle">
|
<tr>
|
<th style="width:50px">序号</th>
|
<!--
|
<th>玻璃ID</th>
|
<th>长度</th>
|
<th>宽度</th>
|
-->
|
<th>工程号</th>
|
<th>流程卡号</th>
|
<th>厚度</th>
|
<th>颜色</th>
|
<!-- <th>是否钢化</th>
|
<th>结合</th> -->
|
<th>总数量</th>
|
<th>总面积</th>
|
<th>切裁率</th>
|
<th>完成时间</th>
|
</tr>
|
</thead>
|
<tbody id="tbStyle" class=" ">${liuchengkaReportForm}
|
</tbody>
|
</table>
|
</div>
|
</section>
|
<!-- /.content -->
|
</div>
|
<!-- /.content-wrapper -->
|
</body>
|
</html>
|
