<%@ page language="java" contentType="text/html; charset=UTF-8"
|
pageEncoding="UTF-8"%>
|
<%
|
request.setCharacterEncoding("UTF-8");
|
response.setCharacterEncoding("UTF-8");
|
response.setContentType("text/html; charset=utf-8");
|
%>
|
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
|
<html>
|
<head>
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
<title>日志</title>
|
<link rel="shortcut icon" href="../img/2.ico" />
|
<style>
|
* {
|
padding: 0%;
|
margin: 0%;
|
background-color: #D5EAFF;
|
}
|
|
#top {
|
width: 99%;
|
margin: 0 auto;
|
}
|
|
body {
|
width: 99%;
|
outline: none;
|
background-color: #D5EAFF;
|
margin: 0 auto;
|
}
|
|
#div_1 {
|
width: 99%;
|
height: 10%;
|
}
|
|
#title {
|
width: 100%;
|
border-collapse: collapse;
|
text-align: center;
|
}
|
|
#title td {
|
padding: 8px;
|
}
|
|
table input {
|
width: 100%;
|
height: 100%;
|
border: 0;
|
outline: none;
|
text-align: center;
|
}
|
|
#div_data {
|
height: 660px;
|
overflow-x: auto;
|
overflow-y: auto;
|
}
|
|
#tab_data {
|
width: 99%;
|
border-collapse: collapse;
|
text-align: center;
|
word-break: break-all;
|
}
|
|
#tab_data tr, #tab_data tr th {
|
height: 25px;
|
white-space: nowrap;
|
}
|
|
#tab_data thead th {
|
background-color: #D5EAFF;
|
z-: 9999;
|
position: relative;
|
}
|
|
#tab_data thead th, tfoot {
|
position: sticky;
|
bottom: 0;
|
}
|
|
thead {
|
position: sticky;
|
}
|
|
[v-cloak] {
|
display: none
|
}
|
|
.tr-color-0 input, .tr-color-0 td {
|
background: #efecec;
|
}
|
|
.tr-color-1 input, .tr-color-1 td {
|
background: white;
|
}
|
</style>
|
</head>
|
|
<body>
|
<%@include file="anquanma.jsp"%>
|
<%
|
String shuzu = "[";
|
String kaishi = "";
|
String jieshu = "";
|
|
String xiangmu = "";
|
%>
|
<%
|
if (request.getParameter("kaishi") != null) {
|
kaishi = request.getParameter("kaishi");
|
}
|
if (request.getParameter("jieshu") != null) {
|
jieshu = request.getParameter("jieshu");
|
}
|
|
if (request.getParameter("xiangmu") != null) {
|
xiangmu = request.getParameter("xiangmu");
|
}
|
|
|
|
//查询
|
|
//装载一个类并且对其进行实例化的操作
|
Class.forName(driverClass);{
|
Connection con1=DriverManager.getConnection( url3,user,password);
|
|
CallableStatement cs = con1.prepareCall("{call rizhichaxun(?,?,?,?,?)}");
|
cs.setString(1, kaishi);
|
cs.setString(2, jieshu);
|
|
cs.setString(3, xiangmu);
|
cs.setString(4, request.getParameter("adminid"));
|
cs.setString(5, request.getRemoteAddr());
|
ResultSet rs = cs.executeQuery();
|
int i = 1;
|
|
while (rs.next()) {
|
|
shuzu += "{xuhao:'" + i + "'," + "lie1:\""
|
+ rs.getString(1).toString().replaceAll("\n|\r\t|", "") + "\"," + "lie2:'" + rs.getString(2) + "',"
|
+ "lie3:'" + rs.getString(3) + "'," + "lie4:'" + rs.getString(4) + "'," + "lie5:'"+ rs.getString(5) + "'," + "lie6:'"
|
+ rs.getString(6) + "'," + "lie7:'" + rs.getString(7) + "'," + "trShow:true},";
|
|
i++;
|
}
|
kaishi = cs.getString(1);
|
jieshu = cs.getString(2);
|
|
xiangmu = cs.getString(3);
|
|
|
if (xiangmu.equals("n*")) {
|
xiangmu = "";
|
}
|
|
if (shuzu.length() > 1) {
|
shuzu = shuzu.substring(0, shuzu.length() - 1) + ']';
|
} else {
|
shuzu = "[]";
|
}
|
con1.close();
|
}
|
|
%>
|
|
<div id="top">
|
<form id='form_submit' method='post' onsubmit='return addsubmit();'
|
autocomplete="off">
|
<table id="title" border="1">
|
<tr style='height: 10px;'>
|
|
<th style="width: 79.5px;">开始时间:</th>
|
<td><input type="date" name="kaishi" id="" value='<%=kaishi%>'></td>
|
<th style="width: 76.5px;">结束时间:</th>
|
<td><input type="date" name="jieshu" id="" value='<%=jieshu%>'></td>
|
<th style="width: 72.6px;">操作内容:</th>
|
<td><input type="text" name="xiangmu" id=""
|
value='<%=xiangmu%>'></td>
|
|
<td style="width: 50px; height: 20px; background-color: #5CADFE;"><input
|
style="width: 50px; height: 20px; outline: 0; border: 0; background-color: #5CADFE;"
|
type="submit" id='tj' value="提交"></td>
|
<td style="width: 50px; height: 20px; background-color: #5CADFE;"><input
|
style="float: left; width: 100%; height: 100%; outline: 0; border: 0; background-color: #5CADFE;"
|
type='button' type="button" value="导出" class="Button" id='daochu'
|
onclick='tableToExcel()' /></td>
|
<!-- <span id='he'>he</span> -->
|
</tr>
|
</table>
|
</form>
|
|
<div id="div_data" style='margin-top: 20px;'
|
class='div_data JColResizer' @scroll='scrollFunc'>
|
|
<table id="tab_data" class='tab_data JColResizer' border="1">
|
<thead>
|
<tr>
|
<th @click="mouseDown1($event)"
|
style='min-width: 100px !important'>序号</th>
|
<th @click="mouseDown1($event)"
|
style='min-width: 100px !important'>操作内容</th>
|
<th @click="mouseDown1($event)"
|
style='min-width: 100px !important'>ip</th>
|
<th @click="mouseDown1($event)"
|
style='min-width: 150px !important'>工号</th>
|
<th @click="mouseDown1($event)"
|
style='min-width: 150px !important'>菜单</th>
|
<th @click="mouseDown1($event)"
|
style='min-width: 150px !important'>模块</th>
|
<th @click="mouseDown1($event)"
|
style='min-width: 150px !important'>功能</th>
|
<th @click="mouseDown1($event)"
|
style='min-width: 150px !important'>建立时间</th>
|
|
|
</tr>
|
<tr>
|
|
<th v-for="n in 8" class='input1'><input class='index1'
|
@keyup.13="chazhao" type="text"></th>
|
</tr>
|
</thead>
|
<tbody id="tbody_tata" class='JColResizer tb_body'
|
style='-moz-user-select: none; -webkit-user-select: none'>
|
<tr v-for="(obj,index1) in shuju2.slice(key1, key2)"
|
v-show="obj.trShow" :class="'tr-color-' + index1 % 2" v-cloak>
|
<td @mousedown="mouseDown($event)" class='xuhao'>{{obj.xuhao}}</td>
|
<td @mousedown="mouseDown($event)" class='lie1'><input
|
readonly='readonly' :value="obj.lie1"></td>
|
<td @mousedown="mouseDown($event)" class='lie2'>{{obj.lie2}}</td>
|
<td @mousedown="mouseDown($event)" class='lie3'>{{obj.lie3}}</td>
|
<td @mousedown="mouseDown($event)" class='lie4'>{{obj.lie4}}</td>
|
<td @mousedown="mouseDown($event)" class='lie5'>{{obj.lie5}}</td>
|
<td @mousedown="mouseDown($event)" class='lie6'>{{obj.lie6}}</td>
|
<td @mousedown="mouseDown($event)" class='lie7'>{{obj.lie7}}</td>
|
|
|
</tr>
|
<tfoot>
|
<tr>
|
<td v-for="n in 8"></td>
|
|
</tr>
|
|
</tfoot>
|
|
</tbody>
|
</table>
|
|
|
|
</div>
|
</div>
|
<script src="../../js/jquery-3.4.1.min.js"></script>
|
<script src="../../js/vue.min.js"></script>
|
<!-- <script src="../../SD/JS/colResizable-1.6.min.js"
|
type="text/javascript"></script>
|
<script src="../../SD/JS/jquery.table2excel.js" type="text/javascript"></script>
|
<script src="../../SD/JS/tableExport.js" type="text/javascript"></script> -->
|
|
<script>
|
|
|
|
|
let app = new Vue({
|
el:'#div_data',
|
data:{
|
shuju1:<%=shuzu%>,
|
shuju2:<%=shuzu%> ,
|
keyup1:[],
|
cellName:"",
|
scrollH:130,
|
key1:0,
|
key2:40,
|
scrollUp:0,
|
scrollDown:0,
|
rows1:"",
|
cell1:"",
|
moverow:"",
|
min_tr:-1 ,
|
max_tr:-1 ,
|
},
|
methods:{
|
chazhao: function() {
|
this.shuju2= [];
|
for (let i = 0; i < $('.index1').length; i++) {
|
this.keyup1[i]=$('.index1 :eq('+i+')').val();
|
}
|
|
for (let key in this.shuju1) {
|
const arr = this.shuju1[key];
|
let index1=[];
|
index1[0] = arr.lie1.indexOf(this.keyup1[0]) > -1;
|
index1[1] = arr.lie1.indexOf(this.keyup1[1]) > -1;
|
index1[2] = arr.lie2.indexOf(this.keyup1[2]) > -1;
|
index1[3] = arr.lie3.indexOf(this.keyup1[3]) > -1;
|
index1[4] = arr.lie4.indexOf(this.keyup1[4]) > -1;
|
index1[5] = arr.lie5.indexOf(this.keyup1[5]) > -1;
|
index1[6] = arr.lie6.indexOf(this.keyup1[6]) > -1;
|
index1[7] = arr.lie7.indexOf(this.keyup1[7]) > -1;
|
|
|
|
|
index1 =Array.from(new Set(index1));
|
if(index1.length>1){
|
index1[0]=false;
|
}else{
|
index1[0]=true;
|
}
|
if(!( index1[0])){
|
|
}else{
|
this.shuju2.push(this.shuju1[key]);
|
}
|
}
|
this.key1=0;
|
this.key2=100;
|
|
},
|
|
scrollFunc:function(){
|
this.scrollDown = $("#div_data").scrollTop();
|
|
let dibu =this.scrollDown+$("#div_data").prop('clientHeight');
|
let changdu = this.shuju2.length ;
|
if($('#tbody_tata tr:visible').length <30){
|
changdu = $('#tbody_tata tr:visible').length;
|
}
|
|
if(this.key2 < changdu && $("#div_data").prop('scrollHeight') <= dibu+2 ){
|
|
var shu=this.shuju2[this.shuju2.length-1].xuhao
|
if(shu<this.key2+9){
|
this.key2=this.shuju2.length;
|
}else{
|
this.key2+=9;
|
|
}
|
this.scrollH+=500;
|
$("#div_data").scrollTop(this.scrollH);
|
|
/* alert(this.scrollH);
|
alert( $("#div_data").scrollTop()); */
|
}else if( ($("#div_data").scrollTop() < 1 )&& this.key1 > 0){
|
if(0>this.key1-9){
|
/* this.key1=0;
|
this.key2=40; */
|
}else{
|
/* this.key1-=9;
|
this.key2-=9; */
|
}
|
|
|
}
|
xuanyihang();
|
djcopy();
|
},
|
onMouseup:function(){
|
$(".tb_body td").unbind('mousemove', this.onMouesemove);
|
$("body").unbind('mousemove', this.onMouseup);
|
|
},
|
//鼠标移动
|
onMouesemove:function(event){
|
let rows_max = $(event.currentTarget).parents('.tb_body').find("tr:visible").index($(event.currentTarget).parent('tr'));
|
if(rows_max<this.rows1){
|
return;
|
}
|
/* if(rows_max>=this.rows1 ){ */
|
this.min_tr=this.rows1;
|
this.max_tr=rows_max;
|
/* }else{
|
min_tr=rows_max;
|
max_tr=this.rows1;
|
} */
|
if(this.min_tr==0){
|
$('.tb_body tr:visible:eq('+(this.min_tr)+') ').find('td:eq('+this.cell1+') input,td:eq('+this.cell1+')').css('background-color',"#1E90FF");
|
$('.tb_body tr:visible:eq('+(this.min_tr)+') ').nextUntil('.tb_body tr:visible:eq('+(this.max_tr+1)+') ').find('td:eq('+this.cell1+') input,td:eq('+this.cell1+')').css('background-color',"#1E90FF");
|
}else{
|
$('.tb_body tr:visible:eq('+(this.min_tr-1)+') ').nextUntil('.tb_body tr:visible:eq('+(this.max_tr+1)+') ').find('td:eq('+this.cell1+') input,td:eq('+this.cell1+')').css('background-color',"#1E90FF");
|
}
|
$('.tb_body tr:visible:eq('+(this.max_tr)+') ').nextAll().find('td:eq('+this.cell1+') input,td:eq('+this.cell1+')').css('background-color',"");
|
|
},
|
mouseDown:function(event){
|
if(event.button!=0){
|
return;
|
}
|
$(".tb_body td").css('background-color', '');
|
$(".tb_body input").css('background-color', '');
|
this.min_tr=-1;
|
this.max_tr=-1;
|
|
this.rows1= $(event.currentTarget).parents('.tb_body').find("tr:visible").index($(event.currentTarget).parent('tr:visible')); //获取行
|
this.cell1=$(event.currentTarget).index();//获取列
|
this.cellName=$(event.currentTarget).attr('class');
|
|
$(".tb_body td").mousemove(this.onMouesemove);
|
|
$("body").mouseup(this.onMouseup);
|
|
|
// event.preventDefault(); // 阻止默认行为
|
// event.stopPropagation(); // 阻止事件冒泡
|
|
},
|
/* tableToExcel:function(){} */
|
|
|
/* tableToExcel:function(){} */
|
mouseDown1:function(event){
|
//获取元素下标
|
function compare(attr){
|
return function(a,b){
|
var val1=a[attr];
|
var val2=b[attr];
|
return val1*1 > val2*1 ?1:-1;
|
}
|
}
|
var lie=$(event.currentTarget).index();
|
this.cellName="lie"+lie;
|
if($(event.currentTarget).is('.sort')){
|
$(event.currentTarget).removeClass("sort");
|
|
this.shuju2.sort(compare(this.cellName));
|
/* this.shuju2=this.shuju2.sort((a,b)=> a.lie9 - b.lie9); */
|
this.shuju2.reverse();
|
}else{
|
this.shuju2.sort(compare(this.cellName));
|
$(event.currentTarget).addClass("sort");
|
}
|
|
|
},
|
|
},
|
|
|
watch: {
|
|
// dataSource：你需要监听的数据
|
shuju2: function () {
|
this.$nextTick(function () {
|
|
xuanyihang();
|
djcopy();
|
});
|
|
|
|
}
|
|
}
|
})
|
|
|
Vue.filter('format',function(value){
|
return value.replace(0, '');
|
|
});
|
|
|
function xuanyihang(){
|
$("#tbody_tata tr").click(function(){
|
if (event.ctrlKey==1){
|
$(this).css("background-color","rgb(30, 144, 255)");
|
$(this).find("input").css("background-color","rgb(30, 144, 255)");
|
$(this).find("td").css("background-color","rgb(30, 144, 255)");
|
$('#tj').css('background-color',"#5CADFE");
|
$('#daochu').css('background-color',"#5CADFE");
|
}else{
|
$("tr").css("background-color","");
|
$("tr").find("input").css("background-color","");
|
$(this).css("background-color","rgb(30, 144, 255)");
|
$(this).find("input").css("background-color","rgb(30, 144, 255)");
|
$(this).find("td").css("background-color","rgb(30, 144, 255)");
|
$('#tj').css('background-color',"#5CADFE");
|
$('#daochu').css('background-color',"#5CADFE");
|
}
|
|
})
|
};
|
function djcopy(){
|
$("td").dblclick("click",function(){
|
copyText($(this).text());
|
});
|
var html="<textarea id='copy' style='display:none;''></textarea>";
|
$("table:eq(0)").append(html);
|
function copyText(str) {
|
$('#copy').text(str).show();
|
var ele = document.getElementById("copy");
|
ele.select();
|
document.execCommand('copy', false, null);
|
$('#copy').hide();
|
}
|
}
|
|
|
window.onload=function(){
|
|
|
$('#tbody_tata input').prop('readOnly',true);
|
/* $('#tbody_tata tr:odd td,#tbody_tata tr:odd input').css('background-color','white');
|
$('#tbody_tata tr:even td,#tbody_tata tr:even input').css('background-color'," #efecec"); */
|
|
|
|
|
|
}
|
|
var flag=true;
|
function addsubmit(){
|
if(flag==true){
|
flag=false;
|
return true;
|
}else{
|
alert("请勿重复提交！")
|
return false;
|
}
|
}
|
|
$(function() {
|
|
// 表格列自由拖拽
|
$(".tab_data").colResizable({
|
liveDrag : true,
|
draggingClass : "dragging",
|
resizeMode : 'overflow'
|
});
|
xuanyihang()
|
// 表头固定
|
$('.div_data').on(
|
'scroll',
|
function() {
|
var scrollTop = $(this).scrollTop();
|
$('.tab_data').find('thead tr th').css(
|
{
|
'-webkit-transform' : '-webkit-translateY('
|
+ scrollTop + 'px)',
|
'-mox-transform' : '-moz-translateY('
|
+ scrollTop + 'px)',
|
'-ms-transform' : '-o-translateY(' + scrollTop
|
+ 'px)',
|
'-o-transform' : '-ms-translateY(' + scrollTop
|
+ 'px)',
|
transform : 'translateY(' + scrollTop + 'px)'
|
});
|
});
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
function tableToExcel(){
|
var jsonData = <%=shuzu%>;
|
JSONToExcelConvertor(jsonData,"发货报表")
|
}
|
function JSONToExcelConvertor(JSONData, FileName) {
|
//先转化json
|
var arrData = typeof JSONData != 'object' ? JSON.parse(JSONData) : JSONData;
|
var excel = '<table>';
|
var row = "<tr>";
|
//设置表头
|
var keys = Object.keys(JSONData[0]);
|
|
var hang=$("thead tr:eq(0) th").length;
|
var thrxt="";
|
for(var i=0;i<hang;i++){
|
thrxt=$("thead tr:eq(0) th:eq("+i+")").text()+"";
|
row += "<td>" + thrxt + '</td>';
|
}
|
row += "<td>序号</td>";
|
|
/* keys.forEach(function (item) {
|
row += "<td>" + item + '</td>';
|
}); */
|
//换行
|
excel += row + "</tr>";
|
//设置数据
|
for (var i = 0; i < arrData.length; i++) {
|
var row = "<tr>";
|
for (var index in arrData[i]) {
|
console.log(arrData[i][index]);
|
//var value = arrData[i][index] === "." ? "" : arrData[i][index];
|
row += '<td>' + arrData[i][index] + '</td>';
|
}
|
excel += row + "</tr>";
|
}
|
|
excel += "</table>";
|
|
var excelFile = "<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:x='urn:schemas-microsoft-com:office:excel' xmlns='http://www.w3.org/TR/REC-html40'>";
|
excelFile += '<meta http-equiv="content-type" content="application/vnd.ms-excel; charset=UTF-8">';
|
excelFile += '<meta http-equiv="content-type" content="application/vnd.ms-excel';
|
excelFile += '; charset=UTF-8">';
|
excelFile += "<head>";
|
excelFile += "<!--[if gte mso 9]>";
|
excelFile += "<xml>";
|
excelFile += "<x:ExcelWorkbook>";
|
excelFile += "<x:ExcelWorksheets>";
|
excelFile += "<x:ExcelWorksheet>";
|
excelFile += "<x:Name>";
|
excelFile += "{worksheet}";
|
excelFile += "</x:Name>";
|
excelFile += "<x:WorksheetOptions>";
|
excelFile += "<x:DisplayGridlines/>";
|
excelFile += "</x:WorksheetOptions>";
|
excelFile += "</x:ExcelWorksheet>";
|
excelFile += "</x:ExcelWorksheets>";
|
excelFile += "</x:ExcelWorkbook>";
|
excelFile += "</xml>";
|
excelFile += "<![endif]-->";
|
excelFile += "</head>";
|
excelFile += "<body>";
|
excelFile += excel;
|
excelFile += "</body>";
|
excelFile += "</html>";
|
|
var uri = 'data:application/vnd.ms-excel;charset=utf-8,' + encodeURIComponent(excelFile);
|
|
var link = document.createElement("a");
|
link.href = uri;
|
|
link.style = "visibility:hidden";
|
link.download = FileName + ".xls";
|
|
document.body.appendChild(link);
|
link.click();
|
document.body.removeChild(link);
|
}
|
|
|
|
|
$("td ").dblclick("click",function(){
|
copyText($(this).text().trim());
|
});
|
var html="<textarea id='copy' style='display:none;''></textarea>";
|
$("table:eq(0)").append(html);
|
function copyText(str) {
|
$('#copy').text(str).show();
|
var ele = document.getElementById("copy");
|
ele.select();
|
document.execCommand('copy', false, null);
|
$('#copy').hide();
|
}
|
|
</script>
|
</body>
|
</html>
|
