1087 lines
53 KiB
Plaintext
1087 lines
53 KiB
Plaintext
<%@ page language="java" pageEncoding="UTF-8" %>
|
||
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c" %>
|
||
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
|
||
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
|
||
<%@ page import="com.sipai.entity.base.ServerObject" %>
|
||
<%@ taglib uri="http://www.springsecurity.org/jsp" prefix="security" %>
|
||
<%String contextPath = request.getContextPath();%>
|
||
<!DOCTYPE html>
|
||
<!-- <html lang="zh-CN"> -->
|
||
<!-- BEGIN HEAD -->
|
||
<head>
|
||
<title><%= ServerObject.atttable.get("TOPTITLE")%>
|
||
</title>
|
||
|
||
<!-- 引用页头及CSS页-->
|
||
<jsp:include page="/jsp/inc.jsp"></jsp:include>
|
||
<style type="text/css">
|
||
</style>
|
||
<script type="text/javascript">
|
||
let project_num_st1 = 'desc';
|
||
let project_num_st2 = 'desc';
|
||
let project_num_st_out = 'desc';
|
||
let project_sortName = '2';
|
||
|
||
$(function () {
|
||
let windowHeight = $(window).height();
|
||
$('#main').css("height", windowHeight + "px");
|
||
|
||
var nowTime = getNowTime().substring(0, 10);
|
||
$('#date').val(nowTime);
|
||
$('#date').datepicker({
|
||
format: 'yyyy-mm-dd',
|
||
weekStart: 1,
|
||
autoclose: true,
|
||
startView: 0,
|
||
minViewMode: 0,
|
||
maxViewMode: 'years',
|
||
forceParse: false,
|
||
language: 'zh-CN'
|
||
}).on('changeDate', doSearch);
|
||
|
||
$('#date2').val(nowTime.substring(0, 7));
|
||
$('#date2').datepicker({
|
||
format: 'yyyy-mm',
|
||
weekStart: 1,
|
||
autoclose: true,
|
||
startView: 1,
|
||
minViewMode: 1,
|
||
maxViewMode: 'years',
|
||
forceParse: false,
|
||
language: 'zh-CN'
|
||
}).on('changeDate', doSearch);
|
||
|
||
$("#table1").bootstrapTable({ // 对应table标签的id
|
||
url: ext.contextPath + '/whp/plan/WhpSamplingPlanTask/getListNoTemplate.do', // 获取表格数据的url
|
||
cache: false, // 设置为 false 禁用 AJAX 数据缓存， 默认为true
|
||
striped: true, //表格显示条纹，默认为false
|
||
pagination: true, // 在表格底部显示分页组件，默认false
|
||
pageList: [10, 20, 50], // 设置页面可以显示的数据条数
|
||
pageSize: 10, // 页面数据条数
|
||
pageNumber: 1, // 首页页码
|
||
sidePagination: 'server', // 设置为服务器端分页
|
||
queryParams: function (params) { // 请求服务器数据时发送的参数，可以在这里添加额外的查询参数，返回false则终止请求
|
||
return {
|
||
rows: params.limit, // 每页要显示的数据条数
|
||
page: params.offset / params.limit + 1, // 每页显示数据的开始页码
|
||
sort: params.sort, // 要排序的字段
|
||
order: params.order,
|
||
status: 1
|
||
}
|
||
},
|
||
sortName: 'samplingTime', // 要排序的字段
|
||
sortOrder: 'desc', // 排序规则
|
||
//detailView: true,//父子表
|
||
columns: [
|
||
{
|
||
checkbox: true, // 显示一个勾选框
|
||
},
|
||
{
|
||
field: 'planCode',
|
||
title: '采样单编号',
|
||
align: 'center',
|
||
valign: 'middle'
|
||
}, {
|
||
field: 'sampleTypeName',
|
||
title: '采样类型',
|
||
align: 'center',
|
||
valign: 'middle'
|
||
}, {
|
||
field: 'samplingTime',
|
||
title: '实际采样日期',
|
||
align: 'center',
|
||
valign: 'middle',
|
||
formatter: function (value, row, index) {
|
||
return value.substring(0, 10);
|
||
}
|
||
}, {
|
||
field: 'sampleCode',
|
||
title: '样品编号',
|
||
align: 'center',
|
||
valign: 'middle'
|
||
}, {
|
||
field: 'sampleAddress',
|
||
title: '地点',
|
||
align: 'center',
|
||
valign: 'middle'
|
||
}, {
|
||
field: 'sampleAmount',
|
||
title: '样品数量',
|
||
align: 'center',
|
||
valign: 'middle'
|
||
},
|
||
{
|
||
title: "操作",
|
||
align: 'center',
|
||
valign: 'middle',
|
||
width: 60, // 定义列的宽度，单位为像素px
|
||
formatter: function (value, row, index) {
|
||
var buts = '';
|
||
buts += '<button class="btn btn-default btn-sm" title="接单" onclick="confirmFun(\'' + row.id + '\')"><i class="glyphicon glyphicon-flash"></i><span class="hidden-md hidden-lg"> 接单</span></button>';
|
||
buts = '<div class="btn-group" >' + buts + '</div>';
|
||
return buts;
|
||
}
|
||
}
|
||
],
|
||
onLoadSuccess: function () { //加载成功时执行
|
||
adjustBootstrapTableView("table1");
|
||
}
|
||
,
|
||
onLoadError: function () { //加载失败时执行
|
||
console.info("加载数据失败");
|
||
}
|
||
})
|
||
|
||
$("#table2").bootstrapTable({ // 对应table标签的id
|
||
url: ext.contextPath + '/whp/test/WhpSamplingPlanTaskTestConfirm/getIndexTaskList.do', // 获取表格数据的url
|
||
cache: false, // 设置为 false 禁用 AJAX 数据缓存， 默认为true
|
||
striped: true, //表格显示条纹，默认为false
|
||
pagination: true, // 在表格底部显示分页组件，默认false
|
||
pageList: [10, 20, 50], // 设置页面可以显示的数据条数
|
||
pageSize: 10, // 页面数据条数
|
||
pageNumber: 1, // 首页页码
|
||
sidePagination: 'server', // 设置为服务器端分页
|
||
queryParams: function (params) { // 请求服务器数据时发送的参数，可以在这里添加额外的查询参数，返回false则终止请求
|
||
return {
|
||
rows: params.limit, // 每页要显示的数据条数
|
||
page: params.offset / params.limit + 1, // 每页显示数据的开始页码
|
||
sort: params.sort, // 要排序的字段
|
||
order: params.order,
|
||
Iswarning: 1
|
||
}
|
||
},
|
||
sortName: 'id', // 要排序的字段
|
||
sortOrder: 'desc', // 排序规则
|
||
//detailView: true,//父子表
|
||
columns: [
|
||
{
|
||
field: 'planCode', // 返回json数据中的name
|
||
title: '采样单编号', // 表格表头显示文字
|
||
align: 'center', // 左右居中
|
||
valign: 'middle' // 上下居中
|
||
}, {
|
||
field: 'testItemName', // 返回json数据中的name
|
||
title: '检测项目', // 表格表头显示文字
|
||
align: 'center', // 左右居中
|
||
valign: 'middle' // 上下居中
|
||
|
||
}, {
|
||
field: 'sampleTypeName', // 返回json数据中的name
|
||
title: '采样类型', // 表格表头显示文字
|
||
align: 'center', // 左右居中
|
||
valign: 'middle' // 上下居中
|
||
|
||
}, {
|
||
field: 'samplingDate', // 返回json数据中的name
|
||
title: '实际采样日期', // 表格表头显示文字
|
||
align: 'center', // 左右居中
|
||
valign: 'middle', // 上下居中
|
||
formatter: function (value, row, index) {
|
||
if (value != '') {
|
||
return value.substring(0, 10);
|
||
} else {
|
||
return "";
|
||
}
|
||
}
|
||
}, {
|
||
field: 'samplingTaskNumber', // 返回json数据中的name
|
||
title: '样品任务数', // 表格表头显示文字
|
||
align: 'center', // 左右居中
|
||
valign: 'middle', // 上下居中
|
||
}, {
|
||
field: 'statusName', // 返回json数据中的name
|
||
title: '计划状态', // 表格表头显示文字
|
||
align: 'center', // 左右居中
|
||
valign: 'middle', // 上下居中
|
||
formatter: function (value, row, index) {
|
||
if (row.statusName.includes("超时预警")) {
|
||
return '<span style="color:red">' + value + '</span>'
|
||
} else {
|
||
return value
|
||
}
|
||
}
|
||
}, {
|
||
title: "操作",
|
||
align: 'center',
|
||
valign: 'middle',
|
||
width: 60, // 定义列的宽度，单位为像素px
|
||
formatter: function (value, row, index) {
|
||
var buts = '';
|
||
buts += '<button class="btn btn-default btn-sm" title="检测" onclick="detectionIndexTask(\'' + row.id + '\')"><i class="glyphicon glyphicon-play"></i><span class="hidden-md hidden-lg"> 检测</span></button>';
|
||
|
||
buts = '<div class="btn-group" >' + buts + '</div>';
|
||
return buts;
|
||
}
|
||
}
|
||
],
|
||
onLoadSuccess: function () { //加载成功时执行
|
||
adjustBootstrapTableView("table2");
|
||
},
|
||
onLoadError: function () { //加载失败时执行
|
||
console.info("加载数据失败");
|
||
}
|
||
});
|
||
|
||
$("#table3").bootstrapTable({ // 对应table标签的id
|
||
url: ext.contextPath + '/whp/test/WhpSamplingPlanTaskTestConfirm/getIndexTaskList.do', // 获取表格数据的url
|
||
cache: false, // 设置为 false 禁用 AJAX 数据缓存， 默认为true
|
||
striped: true, //表格显示条纹，默认为false
|
||
pagination: true, // 在表格底部显示分页组件，默认false
|
||
pageList: [10, 20, 50], // 设置页面可以显示的数据条数
|
||
pageSize: 10, // 页面数据条数
|
||
pageNumber: 1, // 首页页码
|
||
sidePagination: 'server', // 设置为服务器端分页
|
||
queryParams: function (params) { // 请求服务器数据时发送的参数，可以在这里添加额外的查询参数，返回false则终止请求
|
||
return {
|
||
rows: params.limit, // 每页要显示的数据条数
|
||
page: params.offset / params.limit + 1, // 每页显示数据的开始页码
|
||
sort: params.sort, // 要排序的字段
|
||
order: params.order,
|
||
Iswarning: 2
|
||
}
|
||
},
|
||
sortName: 'id', // 要排序的字段
|
||
sortOrder: 'desc', // 排序规则
|
||
//detailView: true,//父子表
|
||
columns: [
|
||
{
|
||
field: 'planCode', // 返回json数据中的name
|
||
title: '采样单编号', // 表格表头显示文字
|
||
align: 'center', // 左右居中
|
||
valign: 'middle', // 上下居中
|
||
sortable: true
|
||
}, {
|
||
field: 'testItemName', // 返回json数据中的name
|
||
title: '检测项目', // 表格表头显示文字
|
||
align: 'center', // 左右居中
|
||
valign: 'middle' // 上下居中
|
||
|
||
}, {
|
||
field: 'sampleTypeName', // 返回json数据中的name
|
||
title: '采样类型', // 表格表头显示文字
|
||
align: 'center', // 左右居中
|
||
valign: 'middle' // 上下居中
|
||
|
||
}, {
|
||
field: 'samplingDate', // 返回json数据中的name
|
||
title: '实际采样日期', // 表格表头显示文字
|
||
align: 'center', // 左右居中
|
||
valign: 'middle', // 上下居中
|
||
formatter: function (value, row, index) {
|
||
if (value != '') {
|
||
return value.substring(0, 10);
|
||
} else {
|
||
return "";
|
||
}
|
||
}
|
||
}, {
|
||
field: 'samplingTaskNumber', // 返回json数据中的name
|
||
title: '样品任务数', // 表格表头显示文字
|
||
align: 'center', // 左右居中
|
||
valign: 'middle', // 上下居中
|
||
}, {
|
||
field: 'statusName', // 返回json数据中的name
|
||
title: '计划状态', // 表格表头显示文字
|
||
align: 'center', // 左右居中
|
||
valign: 'middle', // 上下居中
|
||
formatter: function (value, row, index) {
|
||
if (row.statusName.includes("超时预警")) {
|
||
return '<span style="color:red">' + value + '</span>'
|
||
} else {
|
||
return value
|
||
}
|
||
}
|
||
}, {
|
||
title: "操作",
|
||
align: 'center',
|
||
valign: 'middle',
|
||
width: 60, // 定义列的宽度，单位为像素px
|
||
formatter: function (value, row, index) {
|
||
var buts = '';
|
||
buts += '<button class="btn btn-default btn-sm" title="检测" onclick="detectionIndexTask(\'' + row.id + '\')"><i class="glyphicon glyphicon-play"></i><span class="hidden-md hidden-lg"> 检测</span></button>';
|
||
|
||
buts = '<div class="btn-group" >' + buts + '</div>';
|
||
return buts;
|
||
}
|
||
}
|
||
],
|
||
onLoadSuccess: function (data) { //加载成功时执行
|
||
adjustBootstrapTableView("table3");
|
||
// console.log(data.total)
|
||
if (data.total > 99) {
|
||
$('#table3Num').text("99+")
|
||
} else {
|
||
$('#table3Num').text(data.total)
|
||
}
|
||
|
||
},
|
||
onLoadError: function () { //加载失败时执行
|
||
console.info("加载数据失败");
|
||
}
|
||
});
|
||
|
||
$("#table4").bootstrapTable({ // 对应table标签的id
|
||
url: ext.contextPath + '/whp/plan/WhpSamplingPlanTask/getListNoTemplate.do', // 获取表格数据的url
|
||
cache: false, // 设置为 false 禁用 AJAX 数据缓存， 默认为true
|
||
striped: true, //表格显示条纹，默认为false
|
||
pagination: true, // 在表格底部显示分页组件，默认false
|
||
pageList: [10, 20, 50], // 设置页面可以显示的数据条数
|
||
pageSize: 10, // 页面数据条数
|
||
pageNumber: 1, // 首页页码
|
||
sidePagination: 'server', // 设置为服务器端分页
|
||
queryParams: function (params) { // 请求服务器数据时发送的参数，可以在这里添加额外的查询参数，返回false则终止请求
|
||
return {
|
||
rows: params.limit, // 每页要显示的数据条数
|
||
page: params.offset / params.limit + 1, // 每页显示数据的开始页码
|
||
sort: params.sort, // 要排序的字段
|
||
order: params.order,
|
||
status: '2',
|
||
|
||
}
|
||
},
|
||
sortName: 'id', // 要排序的字段
|
||
sortOrder: 'desc', // 排序规则
|
||
//detailView: true,//父子表
|
||
columns: [
|
||
// {
|
||
// checkbox: true, // 显示一个勾选框
|
||
// },
|
||
{
|
||
field: 'planCode',
|
||
title: '采样单编号',
|
||
align: 'center',
|
||
valign: 'middle'
|
||
}, {
|
||
field: 'planDate',
|
||
title: '计划采样日期',
|
||
align: 'center',
|
||
valign: 'middle',
|
||
formatter: function (value, row, index) {
|
||
return value.substring(0, 10);
|
||
}
|
||
},
|
||
{
|
||
field: 'sampleTypeName',
|
||
title: '采样类型',
|
||
align: 'center',
|
||
valign: 'middle'
|
||
}, {
|
||
field: 'reportDate',
|
||
title: '要求报告日期',
|
||
align: 'center',
|
||
valign: 'middle',
|
||
formatter: function (value, row, index) {
|
||
return value.substring(0, 10);
|
||
}
|
||
}, {
|
||
field: 'sampleCode',
|
||
title: '样品编号',
|
||
align: 'center',
|
||
valign: 'middle'
|
||
}, {
|
||
field: 'sampleAddress',
|
||
title: '地点',
|
||
align: 'center',
|
||
valign: 'middle'
|
||
}, {
|
||
field: 'samplingUserName',
|
||
title: '采样人',
|
||
align: 'center',
|
||
valign: 'middle'
|
||
}, {
|
||
field: 'samplingTime',
|
||
title: '采样时间',
|
||
align: 'center',
|
||
valign: 'middle',
|
||
formatter: function (value, row, index) {
|
||
return value.substring(0, 10);
|
||
}
|
||
},
|
||
{
|
||
title: "操作",
|
||
align: 'center',
|
||
valign: 'middle',
|
||
width: 60, // 定义列的宽度，单位为像素px
|
||
formatter: function (value, row, index) {
|
||
var buts = '';
|
||
if (row.status == 3 || row.status == 2) {
|
||
buts += '<button class="btn btn-default btn-sm" title="采样登记" onclick="editPlanTaskFun(\'' + row.id + '\')"><i class="fa fa-edit"></i><span class="hidden-md hidden-lg"> 采样登记</span></button>';
|
||
}
|
||
buts = '<div class="btn-group" >' + buts + '</div>';
|
||
return buts;
|
||
}
|
||
}
|
||
],
|
||
onLoadSuccess: function () { //加载成功时执行
|
||
adjustBootstrapTableView("table4");
|
||
}
|
||
,
|
||
onLoadError: function () { //加载失败时执行
|
||
console.info("加载数据失败");
|
||
}
|
||
}
|
||
)
|
||
|
||
doSearch();
|
||
|
||
})
|
||
|
||
var editPlanTaskFun = function (id) {
|
||
stopBubbleDefaultEvent();
|
||
$.post(ext.contextPath + '/whp/plan/WhpSamplingPlanTask/edit.do', {
|
||
id: id,
|
||
inSt: 'homePage'
|
||
}, function (data) {
|
||
$("#subDiv").html(data);
|
||
openModal('subModal');
|
||
});
|
||
};
|
||
|
||
//检测弹窗
|
||
var detectionIndexTask = function (id) {
|
||
stopBubbleDefaultEvent();
|
||
$.post(ext.contextPath + '/whp/test/WhpSamplingPlanTaskTestConfirm/showTest.do', {id: id}, function (data) {
|
||
$("#subDiv").html(data);
|
||
// debugger;
|
||
openModal('subModal1');
|
||
});
|
||
};
|
||
|
||
//接单弹窗
|
||
var confirmFun = function (id) {
|
||
stopBubbleDefaultEvent();
|
||
$.post(ext.contextPath + '/whp/plan/WhpSamplingPlanTask/showConfirm.do', {id: id}, function (data) {
|
||
$("#subDiv").html(data);
|
||
openModal('subModal');
|
||
});
|
||
};
|
||
|
||
//批量接单弹窗
|
||
var confirmBatchFun = function () {
|
||
var checkedItems = $("#table1").bootstrapTable('getSelections');
|
||
var datas = "";
|
||
var num = 0;
|
||
$.each(checkedItems, function (index, item) {
|
||
if (item.status != 1) {
|
||
num = num + 1;
|
||
|
||
}
|
||
datas += item.id + ",";
|
||
});
|
||
if (num > 0) {
|
||
showAlert('d', '请选择未接单编号', 'mainAlertdiv');
|
||
|
||
} else if (datas == "") {
|
||
showAlert('d', '请先选择记录', 'mainAlertdiv');
|
||
} else {
|
||
swal({
|
||
text: "您确定要批量接单？",
|
||
dangerMode: true,
|
||
buttons: {
|
||
cancel: {
|
||
text: "取消",
|
||
value: null,
|
||
visible: true,
|
||
className: "btn btn-default btn-sm",
|
||
closeModal: true,
|
||
},
|
||
confirm: {
|
||
text: "确定",
|
||
value: true,
|
||
visible: true,
|
||
className: "btn btn-danger btn-sm",
|
||
closeModal: true
|
||
}
|
||
}
|
||
})
|
||
.then(function (willDelete) {
|
||
if (willDelete) {
|
||
$.post(ext.contextPath + '/whp/plan/WhpSamplingPlanTask/confirms.do', {ids: datas}, function (data) {
|
||
if (data.code == 1) {
|
||
$("#table1").bootstrapTable('refresh');
|
||
} else {
|
||
showAlert('d', '接单失败', 'mainAlertdiv');
|
||
}
|
||
}, "json");
|
||
|
||
}
|
||
});
|
||
}
|
||
};
|
||
|
||
function changeDateType() {
|
||
let dateType = $('#dateType').val() + "Show";
|
||
if (dateType == 'dayShow') {
|
||
$('#monthShow').css('display', 'none');
|
||
$('#date2').attr("type", "hidden");
|
||
|
||
$('#dayShow').css('display', 'block');
|
||
$('#date').attr("type", "text");
|
||
|
||
$('#data_statistics_titleName1').text("当日采样计划");
|
||
$('#data_statistics_titleName2').text("当日样品数");
|
||
$('#data_statistics_titleName3').text("当日检测任务");
|
||
|
||
} else if (dateType == 'monthShow') {
|
||
$('#dayShow').css('display', 'none');
|
||
$('#date').attr("type", "hidden");
|
||
|
||
$('#monthShow').css('display', 'block');
|
||
$('#date2').attr("type", "text");
|
||
|
||
$('#data_statistics_titleName1').text("当月采样计划");
|
||
$('#data_statistics_titleName2').text("当月样品数");
|
||
$('#data_statistics_titleName3').text("当月检测任务");
|
||
}
|
||
|
||
doSearch();
|
||
}
|
||
|
||
let searchDate = "";
|
||
|
||
function doSearch() {
|
||
let dateType = $('#dateType').val();
|
||
|
||
if (dateType == 'day') {
|
||
searchDate = $('#date').val();
|
||
$.ajax({
|
||
type: 'GET',
|
||
url: ext.contextPath + "/whp/plan/WhpSamplingPlan/selectTypeByDate.do",
|
||
dataType: 'json',
|
||
data: {
|
||
dateBegin: searchDate
|
||
},
|
||
async: false,
|
||
error: function () {
|
||
return false;
|
||
},
|
||
success: function (data) {
|
||
// console.log(data)
|
||
for (let i = 0; i < data.length; i++) {
|
||
let content = data[i];
|
||
let code = "";
|
||
if (content.code != null) {
|
||
code = content.code;
|
||
}
|
||
let finishCount = content.finishCount;//完成数
|
||
let sampleCount = content.sampleCount;//总数
|
||
let rate = 0;
|
||
if (Number(sampleCount) > 0) {
|
||
rate = ((Number(finishCount) / Number(sampleCount)) * 100).toFixed(2);
|
||
}
|
||
|
||
let html = "";
|
||
html += "<div style=\"float: left;width: 100%;height: calc((100% - 2px)*0.4);line-height: 40px;padding-left: 15px;\">";
|
||
html += "<div style=\"float: left;width: 70px;\">采样单号：</div>";
|
||
html += "<div style=\"float: left;width: calc(100% - 70px);\">" + code + "</div>";
|
||
html += "</div>";
|
||
html += "<div style=\"float: left;width: 100%;height: calc((100% - 2px)*0.6);line-height: 40px;padding-left: 15px;\">";
|
||
html += "<div style=\"float: left;width: 80px;\">" + content.name + "</div>";
|
||
html += "<div style=\"float: left;width: calc(100% - 80px);padding-left: 10px;\">";
|
||
html += "<span>" + finishCount + "</span><span>/</span><span>" + sampleCount + "</span></div>";
|
||
html += "</div>";
|
||
html += "<div style=\"float: left;width: 100%;height: 2px;background-color: #E1E1E1;\">";
|
||
html += "<div style=\"float: left;width: " + rate + "%;height: 2px;background-color: #82CDFF;\"></div>";
|
||
html += "</div>";
|
||
|
||
$('#dayWorkOrder' + (i + 1)).html(html);
|
||
}
|
||
}
|
||
});
|
||
|
||
} else if (dateType == 'month') {
|
||
let maxDay = getMonthMaxDay($('#date2').val() + "-01");
|
||
// console.log(maxDay)
|
||
searchDate = $('#date2').val();
|
||
|
||
let xData = [];
|
||
let searchData = [];
|
||
|
||
for (let i = 0; i < maxDay; i++) {
|
||
xData.push(i + 1);
|
||
}
|
||
|
||
let realData = [];
|
||
let planData = [];
|
||
|
||
$.ajax({
|
||
type: 'GET',
|
||
url: ext.contextPath + "/whp/plan/WhpSamplingPlan/selectPlanByDate.do",
|
||
dataType: 'json',
|
||
data: {
|
||
dateBegin: searchDate
|
||
},
|
||
async: false,
|
||
error: function () {
|
||
return false;
|
||
},
|
||
success: function (data) {
|
||
// console.log(data)
|
||
for (let i = 0; i < data.length; i++) {
|
||
let content = data[i];
|
||
let realDataD = [];
|
||
let planDataD = [];
|
||
|
||
realDataD.push(content.date.substring(8, 10), content.realityCount);
|
||
planDataD.push(content.date.substring(8, 10), content.incomplete);
|
||
realData.push(realDataD);
|
||
planData.push(planDataD);
|
||
}
|
||
|
||
}
|
||
});
|
||
|
||
searchData.push({
|
||
name: '已完成采样',
|
||
type: 'bar',
|
||
stack: 'a',
|
||
data: realData
|
||
})
|
||
searchData.push({
|
||
name: '未完成采样',
|
||
type: 'bar',
|
||
stack: 'a',
|
||
data: planData
|
||
})
|
||
monthChart(xData, searchData);
|
||
}
|
||
|
||
// console.log(searchDate)
|
||
$.ajax({
|
||
type: 'GET',
|
||
url: ext.contextPath + "/whp/plan/WhpSamplingPlan/queryListPlanTj.do",
|
||
dataType: 'json',
|
||
data: {
|
||
dateBegin: searchDate
|
||
},
|
||
async: false,
|
||
error: function () {
|
||
return false;
|
||
},
|
||
success: function (data) {
|
||
// console.log(data)
|
||
$('#planCount').text(data.planCount);
|
||
$('#planSampleCount').text(data.planSampleCount);
|
||
$('#realityCount').text(data.realityCount);
|
||
$('#realityRate').text(data.realityRate);
|
||
$('#testCount').text(data.testCount);
|
||
$('#finishCount').text(data.finishCount);
|
||
}
|
||
});
|
||
|
||
getCkProject();
|
||
}
|
||
|
||
function getCkProject() {
|
||
$.ajax({
|
||
type: 'GET',
|
||
url: ext.contextPath + "/whp/plan/WhpSamplingPlan/selectItemCount.do",
|
||
dataType: 'json',
|
||
data: {
|
||
dateBegin: searchDate,
|
||
sortOrder: project_num_st_out,
|
||
sortName: project_sortName
|
||
},
|
||
async: false,
|
||
error: function () {
|
||
return false;
|
||
},
|
||
success: function (data) {
|
||
// console.log(data)
|
||
let maxValue = 0;
|
||
let html = "";
|
||
for (let i = 0; i < data.length; i++) {
|
||
let content = data[i];
|
||
let num = content.itemCount;
|
||
if (maxValue < num) {
|
||
maxValue = num;
|
||
}
|
||
}
|
||
for (let i = 0; i < data.length; i++) {
|
||
let content = data[i];
|
||
let num = content.itemCount;
|
||
let rate = ((num / maxValue) * 100).toFixed(2);
|
||
|
||
html += "<div style=\"float:left;width: 100%;height: 30px;text-align: center;line-height: 30px;\">";
|
||
html += "<div style=\"float:left;width: 25%;height: 100%;\">" + content.name + "</div>";
|
||
html += "<div style=\"float:left;width: 8%;height: 100%;color: #82CDFF;\">" + num + "</div>";
|
||
html += "<div style=\"float:left;width: 67%;height: 100%;padding-top: 10px;padding-left: 10px;\">";
|
||
html += "<div style=\"float:left;width: 100%;height: 10px;\">";
|
||
html += "<div style=\"float:left;width: " + rate + "%;height: 100%;background: #82cdff;\"></div>";
|
||
html += "</div></div></div>";
|
||
}
|
||
$('#ckProjectDiv').html(html);
|
||
}
|
||
});
|
||
}
|
||
|
||
|
||
function monthChart(xData, seriesData) {
|
||
let myChart = echarts.init(document.getElementById("monthChart"));
|
||
let option = {
|
||
color: ['#00C74F', '#B5D1B8'],
|
||
tooltip: {
|
||
trigger: 'axis',
|
||
axisPointer: {
|
||
type: 'shadow'
|
||
}
|
||
},
|
||
legend: {
|
||
left: 'right',
|
||
data: ['已完成采样', '未完成采样']
|
||
},
|
||
grid: {
|
||
left: '3%',
|
||
right: '4%',
|
||
bottom: '3%',
|
||
containLabel: true
|
||
},
|
||
xAxis: [
|
||
{
|
||
type: 'category',
|
||
data: xData
|
||
}
|
||
],
|
||
yAxis: [
|
||
{
|
||
type: 'value'
|
||
}
|
||
],
|
||
series: seriesData
|
||
};
|
||
myChart.setOption(option, true);
|
||
}
|
||
|
||
function changeProjectNumOrder(st) {
|
||
let upColor = "";
|
||
let downColor = "";
|
||
|
||
if (st == '1') {
|
||
if (project_sortName == '1') {
|
||
if (project_num_st_out == 'desc') {
|
||
upColor = 'rgb(60,141,188)';
|
||
downColor = 'rgb(210,210,210)';
|
||
project_num_st_out = 'asc';
|
||
} else if (project_num_st_out == 'asc') {
|
||
upColor = 'rgb(210,210,210)';
|
||
downColor = 'rgb(60,141,188)';
|
||
project_num_st_out = 'desc';
|
||
}
|
||
$('#project_num_up2').css('color', 'rgb(210,210,210)');
|
||
$('#project_num_down2').css('color', 'rgb(210,210,210)');
|
||
|
||
$('#project_num_up1').css('color', upColor);
|
||
$('#project_num_down1').css('color', downColor);
|
||
} else {
|
||
upColor = 'rgb(210,210,210)';
|
||
downColor = 'rgb(60,141,188)';
|
||
project_num_st_out = 'desc';
|
||
|
||
$('#project_num_up2').css('color', 'rgb(210,210,210)');
|
||
$('#project_num_down2').css('color', 'rgb(210,210,210)');
|
||
|
||
$('#project_num_up1').css('color', upColor);
|
||
$('#project_num_down1').css('color', downColor);
|
||
}
|
||
project_sortName = '1';
|
||
} else if (st == '2') {
|
||
if (project_sortName == '2') {
|
||
if (project_num_st_out == 'desc') {
|
||
upColor = 'rgb(60,141,188)';
|
||
downColor = 'rgb(210,210,210)';
|
||
project_num_st_out = 'asc';
|
||
} else if (project_num_st_out == 'asc') {
|
||
upColor = 'rgb(210,210,210)';
|
||
downColor = 'rgb(60,141,188)';
|
||
project_num_st_out = 'desc';
|
||
}
|
||
$('#project_num_up1').css('color', 'rgb(210,210,210)');
|
||
$('#project_num_down1').css('color', 'rgb(210,210,210)');
|
||
|
||
$('#project_num_up2').css('color', upColor);
|
||
$('#project_num_down2').css('color', downColor);
|
||
} else {
|
||
upColor = 'rgb(210,210,210)';
|
||
downColor = 'rgb(60,141,188)';
|
||
project_num_st_out = 'desc';
|
||
|
||
$('#project_num_up1').css('color', 'rgb(210,210,210)');
|
||
$('#project_num_down1').css('color', 'rgb(210,210,210)');
|
||
|
||
$('#project_num_up2').css('color', upColor);
|
||
$('#project_num_down2').css('color', downColor);
|
||
}
|
||
|
||
project_sortName = '2';
|
||
}
|
||
|
||
// $('#project_num_up' + st).css('color', upColor);
|
||
// $('#project_num_down' + st).css('color', downColor);
|
||
|
||
getCkProject();
|
||
}
|
||
|
||
function changemyTab1(st) {
|
||
if (st == '1') {
|
||
$("#table1").bootstrapTable('refresh');
|
||
$('#myTab2St').css('display', 'none');
|
||
} else {
|
||
$("#table4").bootstrapTable('refresh');
|
||
$('#myTab2St').css('display', 'block');
|
||
}
|
||
}
|
||
|
||
function changemyTab2(st) {
|
||
if (st == '1') {
|
||
$("#table2").bootstrapTable('refresh');
|
||
} else {
|
||
$("#table3").bootstrapTable('refresh');
|
||
}
|
||
}
|
||
|
||
</script>
|
||
|
||
</head>
|
||
<body onload="initMenu()" class="hold-transition ${cu.themeclass} sidebar-mini">
|
||
<div id="mainAlertdiv"></div>
|
||
<div id="subDiv"></div>
|
||
<div id="subEditDiv"></div>
|
||
|
||
<div id="main"
|
||
style="background-color: #ECF0F5;padding: 10px;">
|
||
<div style="float:left;width: calc((100% - 10px)*0.5);height: 100%">
|
||
<div style="float:left;width: 100%;height: calc((100% - 10px)*0.5);background-color: #FFFFFF;">
|
||
<div style="float:left;width: 100%;height: 4px;background: #5c9fd1;border-radius: 4px 4px 0px 0px;"></div>
|
||
<div style="float:left;width: 100%;height: calc(100% - 4px);">
|
||
<ul class="nav nav-tabs" id="myTab2">
|
||
<li class="active" onclick="changemyTab1('0');"><a href="#tab3" data-toggle="tab"
|
||
index="0" aria-expanded="true">任务接单</a></li>
|
||
<li class="" onclick="changemyTab1('1');"><a href="#tab4" data-toggle="tab" index="1"
|
||
style="height: 42px;"
|
||
aria-expanded="true">
|
||
<div style="float:left;width: 60px;height: 100%;">样品登记</div>
|
||
</a></li>
|
||
|
||
<div id="myTab2St" style="float:right;width: 85px;height: 40px;line-height: 40px;">
|
||
<button type="button" class="btn btn-default btn-sm" onclick="confirmBatchFun();"
|
||
style="margin-right: 15px"><i
|
||
class="fa fa-plus"></i> 批量接单
|
||
</button>
|
||
</div>
|
||
</ul>
|
||
|
||
<div class="tab-content no-padding" style="height: calc(100% - 52px);">
|
||
<div class="chart tab-pane active" id="tab3"
|
||
style="position: relative;padding:5px;overflow: auto;height: 100%;">
|
||
<table id="table1" style="width: 100%;height: 100%;"></table>
|
||
</div>
|
||
<div class=" tab-pane" id="tab4"
|
||
style="position: relative; padding:5px;overflow: auto;height: 100%;">
|
||
<table id="table4" style="width: 100%;height: 100%;"></table>
|
||
</div>
|
||
</div>
|
||
<%-- <div style="float:left;width: 100%;height: 40px;padding-left: 20px;border-bottom: 1px solid #d7dbe2;">--%>
|
||
<%-- <div style="float:left;width: 120px;height: 40px;line-height: 40px;font-size: 16px;">--%>
|
||
<%-- 任务接单--%>
|
||
<%-- </div>--%>
|
||
<%-- <div style="float:right;width: 85px;height: 40px;line-height: 40px;">--%>
|
||
<%-- <button type="button" class="btn btn-default btn-sm" onclick="confirmBatchFun();"--%>
|
||
<%-- style="margin-right: 15px"><i--%>
|
||
<%-- class="fa fa-plus"></i> 批量接单--%>
|
||
<%-- </button>--%>
|
||
<%-- </div>--%>
|
||
<%-- </div>--%>
|
||
<%-- <div style="float:left;width: 100%;height: calc(100% - 40px);overflow: auto;">--%>
|
||
<%-- <table id="table1" style="width: 100%;height: 100%;"></table>--%>
|
||
<%-- </div>--%>
|
||
</div>
|
||
</div>
|
||
<div style="float:left;width: 100%;height: 10px;"></div>
|
||
<div style="float:left;width: 100%;height: calc((100% - 10px)*0.5);background-color: #FFFFFF;">
|
||
<ul class="nav nav-tabs" id="myTab">
|
||
<li class="active" onclick="changemyTab2('0');"><a href="#tab1" data-toggle="tab"
|
||
index="0" aria-expanded="true">我的任务</a></li>
|
||
<li class="" onclick="changemyTab2('0');"><a href="#tab2" data-toggle="tab" index="1"
|
||
style="height: 42px;"
|
||
aria-expanded="true">
|
||
<div style="float:left;width: 60px;height: 100%;">任务预警</div>
|
||
<div id="table3Num"
|
||
style="float:left;text-align:center;width: 25px;height: 15px;background: #ff0000;border-radius: 2px;line-height: 15px;color: #FFFFFF;margin-top: 3px;">
|
||
</div>
|
||
</a></li>
|
||
</ul>
|
||
|
||
<div class="tab-content no-padding" style="height: calc(100% - 52px);">
|
||
<div class="chart tab-pane active" id="tab1"
|
||
style="position: relative;padding:5px;overflow: auto;height: 100%;">
|
||
<table id="table2" style="width: 100%;height: 100%;"></table>
|
||
</div>
|
||
<div class=" tab-pane" id="tab2"
|
||
style="position: relative; padding:5px;overflow: auto;height: 100%;">
|
||
<table id="table3" style="width: 100%;height: 100%;"></table>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
<div style="float:left;width: 10px;height: 100%"></div>
|
||
<div style="float:left;width: calc((100% - 10px)*0.5);height: 100%;background-color: #FFFFFF;">
|
||
<div style="float:left;width: 100%;height: 4px;background: #5c9fd1;border-radius: 4px 4px 0px 0px;"></div>
|
||
<div style="float:left;width: 100%;height: calc(100% - 4px);">
|
||
<div style="float:left;width: 100%;height: 40px;line-height: 40px;padding-left: 20px;border-bottom: 1px solid #d7dbe2;">
|
||
<div style="float:left;width: 110px;height: 100%;font-size: 16px;">数据统计</div>
|
||
<div style="float:left;width: 70px;height: 100%;color: #a0a0a0;">时间范围：</div>
|
||
<div style="float:left;width: 60px;height: 100%;">
|
||
<select id="dateType" onchange="changeDateType();"
|
||
style="border: 1px solid #d2d2d2;border-radius: 3px;width: 53px;height: 28px;text-align: center;">
|
||
<option value="day">日</option>
|
||
<option value="month">月</option>
|
||
</select>
|
||
</div>
|
||
<div style="float:left;width: 120px;height: 100%;">
|
||
<input class="form-control date-picker" id="date" name="date" autocomplete="off"
|
||
type="text" placeholder="点击选择"
|
||
style="background-color:#FFFFFF;width: 100%;height: 28px;line-height: 28px;border: 1px solid #d2d2d2;border-radius: 3px;margin-top: 6px;text-align: center;"
|
||
value="" readonly/>
|
||
<input class="form-control date-picker" id="date2" name="date2" autocomplete="off"
|
||
type="hidden" placeholder="点击选择"
|
||
style="background-color:#FFFFFF;width: 100%;height: 28px;line-height: 28px;border: 1px solid #d2d2d2;border-radius: 3px;margin-top: 6px;text-align: center;"
|
||
value="" readonly/>
|
||
</div>
|
||
</div>
|
||
<div style="float:left;width: 100%;height: 80px;border-bottom: 1px solid #d7dbe2;padding-top: 10px;padding-bottom: 10px;">
|
||
<div style="float: left;width: 16.6%;height: 100%;text-align: center;border-right: 1px solid #d7dbe2;">
|
||
<div id="data_statistics_titleName1"
|
||
style="float: left;width: 100%;height: 20px;color: #aeaeae;line-height: 25px;">
|
||
当日采样计划
|
||
</div>
|
||
<div id="planCount" style="float: left;width: 100%;height: 40px;font-size: 30px;line-height: 40px;">
|
||
</div>
|
||
</div>
|
||
<div style="float: left;width: 16.6%;height: 100%;text-align: center;border-right: 1px solid #d7dbe2;">
|
||
<div style="float: left;width: 100%;height: 20px;color: #aeaeae;line-height: 25px;">
|
||
计划采样数
|
||
</div>
|
||
<div id="planSampleCount"
|
||
style="float: left;width: 100%;height: 40px;font-size: 30px;line-height: 40px;">
|
||
</div>
|
||
</div>
|
||
<div style="float: left;width: 16.6%;height: 100%;text-align: center;border-right: 1px solid #d7dbe2;">
|
||
<div style="float: left;width: 100%;height: 20px;color: #aeaeae;line-height: 25px;">
|
||
实际采样数
|
||
</div>
|
||
<div id="realityCount"
|
||
style="float: left;width: 100%;height: 40px;font-size: 30px;line-height: 40px;color: #00c74f;">
|
||
</div>
|
||
</div>
|
||
<div style="float: left;width: 16.6%;height: 100%;text-align: center;border-right: 1px solid #d7dbe2;">
|
||
<div style="float: left;width: 100%;height: 20px;color: #aeaeae;line-height: 25px;">
|
||
采样计划完成率
|
||
</div>
|
||
<div id="realityRate"
|
||
style="float: left;width: 100%;height: 40px;font-size: 30px;line-height: 40px;color: #00c74f;">
|
||
</div>
|
||
</div>
|
||
<div style="float: left;width: 16.6%;height: 100%;text-align: center;border-right: 1px solid #d7dbe2;">
|
||
<div id="data_statistics_titleName2"
|
||
style="float: left;width: 100%;height: 20px;color: #aeaeae;line-height: 25px;">
|
||
当日样品数
|
||
</div>
|
||
<div id="testCount" style="float: left;width: 100%;height: 40px;font-size: 30px;line-height: 40px;">
|
||
</div>
|
||
</div>
|
||
<div style="float: left;width: 16.6%;height: 100%;text-align: center;">
|
||
<div id="data_statistics_titleName3"
|
||
style="float: left;width: 100%;height: 20px;color: #aeaeae;line-height: 25px;">
|
||
当日检测任务
|
||
</div>
|
||
<div id="finishCount"
|
||
style="float: left;width: 100%;height: 40px;font-size: 30px;line-height: 40px;">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div id="dayShow"
|
||
style="float:left;display: block;width: 100%;height: calc((100% - 120px)*0.4);padding-top: 20px;padding-bottom: 10px;padding-left: 10px;padding-right: 10px;">
|
||
<div style="float: left;width: 100%;height: calc((100% - 10px)*0.333);">
|
||
<div id="dayWorkOrder1"
|
||
style="float:left;width: calc((100% - 10px)*0.333);height: 100%;background: #f6f6f6;">
|
||
</div>
|
||
<div style="float:left;width: 5px;height: 100%;"></div>
|
||
<div id="dayWorkOrder2"
|
||
style="float:left;width: calc((100% - 10px)*0.333);height: 100%;background: #f6f6f6;"></div>
|
||
<div style="float:left;width: 5px;height: 100%;"></div>
|
||
<div id="dayWorkOrder3"
|
||
style="float:left;width: calc((100% - 10px)*0.333);height: 100%;background: #f6f6f6;"></div>
|
||
</div>
|
||
<div style="float:left;width: 100%;height: 5px;"></div>
|
||
<div style="float: left;width: 100%;height: calc((100% - 10px)*0.333);">
|
||
<div id="dayWorkOrder4"
|
||
style="float:left;width: calc((100% - 10px)*0.333);height: 100%;background: #f6f6f6;"></div>
|
||
<div style="float:left;width: 5px;height: 100%;"></div>
|
||
<div id="dayWorkOrder5"
|
||
style="float:left;width: calc((100% - 10px)*0.333);height: 100%;background: #f6f6f6;"></div>
|
||
<div style="float:left;width: 5px;height: 100%;"></div>
|
||
<div id="dayWorkOrder6"
|
||
style="float:left;width: calc((100% - 10px)*0.333);height: 100%;background: #f6f6f6;"></div>
|
||
</div>
|
||
<div style="float:left;width: 100%;height: 5px;"></div>
|
||
<div style="float: left;width: 100%;height: calc((100% - 10px)*0.333);">
|
||
<div id="dayWorkOrder7"
|
||
style="float:left;width: calc((100% - 10px)*0.333);height: 100%;background: #f6f6f6;"></div>
|
||
<div style="float:left;width: 5px;height: 100%;"></div>
|
||
<div id="dayWorkOrder8"
|
||
style="float:left;width: calc((100% - 10px)*0.333);height: 100%;background: #f6f6f6;"></div>
|
||
<div style="float:left;width: 5px;height: 100%;"></div>
|
||
<div id="dayWorkOrder9"
|
||
style="float:left;width: calc((100% - 10px)*0.333);height: 100%;background: #f6f6f6;"></div>
|
||
</div>
|
||
</div>
|
||
<div id="monthShow"
|
||
style="float:left;display: none;width: 100%;height: calc((100% - 120px)*0.4);padding-top: 20px;padding-bottom: 10px;padding-left: 10px;padding-right: 10px;">
|
||
<div id="monthChart" style="width: 100%;height: 100%;"></div>
|
||
</div>
|
||
<div style="float:left;width: 100%;height: calc((100% - 120px)*0.6);padding-top: 20px;padding-bottom: 10px;padding-left: 10px;padding-right: 10px;">
|
||
<div style="float:left;width: 100%;height: 40px;line-height: 40px;border-bottom: 2px solid #d7dbe2;text-align: center;">
|
||
<div style="float:left;width: 25%;height: 100%;">
|
||
<div style="float:left;width: calc(100% - 20px);height: 100%;">检测项目</div>
|
||
<div style="float:left;width: 20px;height: 100%;cursor: pointer;"
|
||
onclick="changeProjectNumOrder('1');">
|
||
<div style="float:left;width: 100%;height: 50%;line-height: 38px;">
|
||
<div id="project_num_up1" class="fa fa-sort-up" style="color: rgb(210,210,210);"></div>
|
||
</div>
|
||
<div style="float:left;width: 100%;height: 50%;line-height: 0px;">
|
||
<div id="project_num_down1" class="fa fa-sort-desc"
|
||
style="line-height: 5px;color: rgb(210,210,210);"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div style="float:left;width: 8%;height: 100%;">
|
||
<div style="float:left;width: calc(100% - 20px);height: 100%;">数量</div>
|
||
<div style="float:left;width: 20px;height: 100%;cursor: pointer;"
|
||
onclick="changeProjectNumOrder('2');">
|
||
<div style="float:left;width: 100%;height: 50%;line-height: 38px;">
|
||
<div id="project_num_up2" class="fa fa-sort-up" style="color: rgb(210,210,210);"></div>
|
||
</div>
|
||
<div style="float:left;width: 100%;height: 50%;line-height: 0px;">
|
||
<div id="project_num_down2" class="fa fa-sort-desc"
|
||
style="line-height: 5px;color: rgb(60,141,188);"></div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
<div id="ckProjectDiv"
|
||
style="float:left;width: 100%;height: calc(100% - 40px);overflow: auto;padding-top: 10px;">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</body>
|
||
<!-- 引入daterangepicker-->
|
||
<link rel="stylesheet" href="<%=request.getContextPath()%>/plugins/bootstrap-daterangepicker/daterangepicker.css"/>
|
||
<script type="text/javascript" src="<%=request.getContextPath()%>/plugins/bootstrap-daterangepicker/moment.min.js"
|
||
charset="utf-8"></script>
|
||
<script type="text/javascript" src="<%=request.getContextPath()%>/plugins/bootstrap-daterangepicker/daterangepicker.js"
|
||
charset="utf-8"></script>
|
||
</html> |