Files
SIPAIIS_WMS_JSSW/WebRoot/jsp/digitalProcess/waterVolumePrediction.jsp
2026-01-16 14:13:44 +08:00

2132 lines
98 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.


<%@ 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" %>
<!DOCTYPE html>
<!-- <html lang="zh-CN"> -->
<!-- BEGIN HEAD -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
<!-- <meta http-equiv="X-UA-Compatible" content="IE=edge"/> -->
<title>
<%= ServerObject.atttable.get("TOPTITLE")%>
</title>
<!-- 引用页头及CSS页-->
<jsp:include page="/jsp/inc.jsp"></jsp:include>
<script type="text/javascript"
src="<%=request.getContextPath()%>/plugins/bootstrap-daterangepicker/moment.min.js"
charset="utf-8"></script>
<style type="text/css">
.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9,
.col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9,
.col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9,
.col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
padding-right: 10px;
padding-left: 10px;
}
.row-10 {
height: 10%;
}
.row-15 {
height: 15%;
}
.row-25 {
height: 25%;
}
.row-30 {
height: 30%;
}
.row-35 {
height: 35%;
}
.row-40 {
height: 40%;
}
.row-50 {
height: 50%;
}
.row-70 {
height: 70%;
}
.row-75 {
height: 75%;
}
.row-100 {
height: 100%;
}
.content-wrapper-bg-darkblue {
background: #0d2336;
}
.content-wrapper-bg-grey {
background: #ECF0F5;
padding: 20px;
}
.bgcolor-blue {
background: #052941;
}
.padding-top-5 {
padding-top: 5px;
}
.padding-top-10 {
padding-top: 10px;
}
.padding-top-15 {
padding-top: 15px;
}
.padding-bottom-10 {
padding-bottom: 10px;
}
.line-height-08 {
line-height: 0.8;
}
.line-height-1 {
line-height: 1;
}
.line-height-2 {
line-height: 2;
}
.line-height-3 {
line-height: 3;
}
.line-height-5 {
line-height: 5;
}
.line-height-6 {
line-height: 6;
}
.font-size-12 {
font-size: 12px;
font-weight: 400;
line-height: 24px;
}
.font-size-14 {
font-size: 14px;
line-height: inherit;
}
.font-size-16 {
font-size: 16px;
}
.font-size-18 {
font-size: 18px;
}
.font-size-20 {
font-size: 20px;
}
.font-size-22 {
font-size: 22px;
}
.font-size-30 {
font-size: 30px;
}
.font-size-35 {
font-size: 35px;
}
.font-size-40 {
font-size: 40px;
line-height: normal;
}
.font-size-50 {
font-size: 50px;
line-height: 1.5;
}
.font-size-65 {
font-size: 65px;
}
.font-color-white, .font-color-dark-white {
color: #dbeeff;
}
.font-color-black {
color: #0d2336;
font-weight: 600;
}
.font-color-grey {
color: #B0B0B0;
}
.font-color-red {
color: #E7A2FF;
}
.font-color-redlight {
color: #CE00FF;
}
.font-color-blue, .font-color-dark-blue {
color: #899BFF;
}
.font-color-lightBlue, .font-color-light-blue {
color: #71D3FF;
}
.font-color-smalt {
color: #2b9dd8;
}
.font-color-lightBlack {
color: #000;
}
.font-color-lightWhite {
color: #FFFFFF;
}
.font-color-1 {
color: #fff12d;
}
.font-color-2 {
color: #d62dff;
}
.font-color-3 {
color: #9cef2e;
}
.font-color-4 {
color: #2dabff;
}
.font-color-5 {
color: #ffb536;
}
.font-color-green {
color: #00B903;
}
.font-color-yellow {
color: #FFE81D;
}
.color-blue {
color: #1472FF;
}
.margin-bottom-15 {
margin-bottom: 15px;
}
.margin-bottom-22 {
margin-bottom: 22px;
}
.text-bar {
margin-top: 5px;
max-width: 10px;
min-height: 50px;
height: 95%;
border-radius: 5px;
}
.text-bar-1 {
background: #fff12d;
}
.text-bar-2 {
background: #d62dff;
}
.text-bar-3 {
background: #9cef2e;
}
.text-bar-4 {
background: #2dabff;
}
.text-bar-5 {
background: #ffb536;
}
.border-left {
border-left: 1px solid #c1c1c1;
}
.border-right {
border-right: 1px solid #c1c1c1;
}
.border-bottom {
border-bottom: 1px solid #c1c1c1;
}
.border-leftAndRight {
border-left: 1px solid #c1c1c1;
border-right: 1px solid #c1c1c1;
}
.bgcolor-blue-light {
background: #192B73;
}
.bgcolor-transparent {
background: transparent;
border-radius: 5px;
}
.cursor-pointer{cursor: pointer;}
.nowTime {
position: absolute;
font-size: 35px;
width: 100%;
}
.echarts_lines {
height: 280px;
width: 800px;
}
.progress_bar {
background-color: #FFE81D;
padding: 5px 0;
width: 350px;
border-radius: 0 20px 20px 0;
}
.predicted-trajectory{
height: 500px;
width: 890px;
}
</style>
<script type="text/javascript">
var fontcolor_grey = '#aeaeae';
var fontcolor_black = '#0d2336';
var color_blue = '#36FFF9';
var color_blue_other = '#1D4F6D';
var img_name = '';
let websocket = null;
let modelIp = "${modelIp}";
var color = ['#71D3FF', '#899BFF', '#4ACE4B', '#2e97ff', '#ffb536'];
$(function () {
var height = $(window).height();
var width = $(window).width();
if (height < 10) {
height = window.screen.height - 150;
}
if (width < 10) {
width = window.screen.width - 150;
}
var proportion_height = height / 1080;
var proportion_width = width / 1650;
$('.echarts_lines').height($('.echarts_lines').height() * proportion_height);
$('.echarts_lines').width($('.echarts_lines').width() * proportion_width);
var bizid = unitId;
var legenddata = ['日设计产能', '日计划处理量', '日排产处理量', '日实际处理量'];
var seriesdata = [
// {
// name: legenddata[0],
// type: 'line',
// //smooth: true,
// //symbol: 'none',
// data: [['2021-10-20 00:00:00',20],['2021-10-20 01:00:00',21],['2021-10-20 02:00:00',22],['2021-10-20 03:00:00',23],['2021-10-20 04:00:00',24],['2021-10-20 05:00:00',21],['2021-10-20 06:00:00',23]
// ,['2021-10-20 07:00:00',24],['2021-10-20 08:00:00',22],['2021-10-20 09:00:00',25],['2021-10-20 10:00:00',25],['2021-10-20 11:00:00',21],['2021-10-20 12:00:00',22],['2021-10-20 13:00:00',23]
// ,['2021-10-20 14:00:00',22],['2021-10-20 15:00:00',21]]
// },
// {
// name: legenddata[1],
// type: 'line',
// //smooth: true,
// //symbol: 'none',
// data: [['2021-10-20 00:00:00',30],['2021-10-20 01:00:00',31],['2021-10-20 02:00:00',32],['2021-10-20 03:00:00',33],['2021-10-20 04:00:00',34],['2021-10-20 05:00:00',31],['2021-10-20 06:00:00',33]
// ,['2021-10-20 07:00:00',34],['2021-10-20 08:00:00',32],['2021-10-20 09:00:00',35],['2021-10-20 10:00:00',35],['2021-10-20 11:00:00',31],['2021-10-20 12:00:00',32],['2021-10-20 13:00:00',33]
// ,['2021-10-20 14:00:00',32],['2021-10-20 15:00:00',31]]
// },
// {
// name: legenddata[2],
// type: 'line',
// //smooth: true,
// //symbol: 'none',
// data: [['2021-10-20 00:00:00',10],['2021-10-20 01:00:00',11],['2021-10-20 02:00:00',12],['2021-10-20 03:00:00',13],['2021-10-20 04:00:00',14],['2021-10-20 05:00:00',11],['2021-10-20 06:00:00',13]
// ,['2021-10-20 07:00:00',14],['2021-10-20 08:00:00',12],['2021-10-20 09:00:00',15],['2021-10-20 10:00:00',15],['2021-10-20 11:00:00',11],['2021-10-20 12:00:00',12],['2021-10-20 13:00:00',13]
// ,['2021-10-20 14:00:00',12],['2021-10-20 15:00:00',11]]
// },
// {
// name: legenddata[3],
// type: 'line',
// //smooth: true,
// //symbol: 'none',
// data: [['2021-10-20 00:00:00',0],['2021-10-20 01:00:00',1],['2021-10-20 02:00:00',2],['2021-10-20 03:00:00',3],['2021-10-20 04:00:00',4],['2021-10-20 05:00:00',1],['2021-10-20 06:00:00',3]
// ,['2021-10-20 07:00:00',4],['2021-10-20 08:00:00',2],['2021-10-20 09:00:00',5],['2021-10-20 10:00:00',5],['2021-10-20 11:00:00',1],['2021-10-20 12:00:00',2],['2021-10-20 13:00:00',3]
// ,['2021-10-20 14:00:00',2],['2021-10-20 15:00:00',1]]
// }
]
// var legenddata = ['日设计产能', '日计划处理量', '日排产处理量', '日实际处理量'];
var color1 = ['#71D3FF', '#000000', '#899BFF', '#4ACE4B', '#ffb536','#2e97ff'];
echarts_line_1('plan_line', legenddata, seriesdata,color1);
legenddata = ['排产小时处理量', '实际处理量'];
seriesdata = [
// {
// name: legenddata[0],
// type: 'line',
// //smooth: true,
// //symbol: 'none',
// data: [['2021-10-20 00:00:00',20],['2021-10-20 01:00:00',21],['2021-10-20 02:00:00',22],['2021-10-20 03:00:00',23],['2021-10-20 04:00:00',24],['2021-10-20 05:00:00',21],['2021-10-20 06:00:00',23]
// ,['2021-10-20 07:00:00',24],['2021-10-20 08:00:00',22],['2021-10-20 09:00:00',25],['2021-10-20 10:00:00',25],['2021-10-20 11:00:00',21],['2021-10-20 12:00:00',22],['2021-10-20 13:00:00',23]
// ,['2021-10-20 14:00:00',22],['2021-10-20 15:00:00',21]]
// },
// {
// name: legenddata[1],
// type: 'line',
// //smooth: true,
// //symbol: 'none',
// data: [['2021-10-20 00:00:00',30],['2021-10-20 01:00:00',31],['2021-10-20 02:00:00',32],['2021-10-20 03:00:00',33],['2021-10-20 04:00:00',34],['2021-10-20 05:00:00',31],['2021-10-20 06:00:00',33]
// ,['2021-10-20 07:00:00',34],['2021-10-20 08:00:00',32],['2021-10-20 09:00:00',35],['2021-10-20 10:00:00',35],['2021-10-20 11:00:00',31],['2021-10-20 12:00:00',32],['2021-10-20 13:00:00',33]
// ,['2021-10-20 14:00:00',32],['2021-10-20 15:00:00',31]]
// }
]
var color2 = ['#899BFF', '#4ACE4B', '#71D3FF', '#000000', '#ffb536','#2e97ff'];
echarts_line_2('water_line', legenddata, seriesdata,color2);
addProgressBar('month_plan_bar', (0 / 1), color[0]);
addProgressBar('month_forecast_bar', (0 / 1), color[1]);
addProgressBar('month_actual_bar', (0 / 1), color[2]);
addProgressBar('day_plan_bar', (0 / 1), color[0]);
addProgressBar('day_forecast_bar', (0 / 1), color[1]);
addProgressBar('day_actual_bar', (0 / 1), color[2]);
echartsLinesMonth('predictedTrajectoryMonth', seriesdata);
echartsLinesDay('predictedTrajectoryDay', seriesdata);
$("#daydt").datepicker({
todayBtn : "linked",
autoclose : true,
todayHighlight : true,
toggleActive : true,
endDate : new Date(),
format:'yyyy-mm-dd',
language:'zh-CN'
}).on('changeDate',getDayDate);
$("#monthdt").datepicker({
todayBtn : "linked",
autoclose : true,
todayHighlight : true,
endDate : new Date(),
startView: 1,//开始显示时间类型 012
minViewMode: 1,//最小显示时间类型 012
format:'yyyy-mm',
language:'zh-CN'
}).on('changeDate',getMonthDate);
if ('WebSocket' in window) {
// 创建websocket对象
websocket = new WebSocket("ws://" + modelIp + "/modelComputerWebSocketEnd/");
// console.log("ws://"+modelIp+"/modelComputerWebSocketEnd/")
registerEvent(bizid);
} else {
alert('当前浏览器不支持websocket')
}
$(window).unload(function () {
console.log("websocket关闭");
websocket.close();
});
getData(bizid, "");
// setInterval("getData('" + bizid + "','')", 600000);
dispatchSheetEntryToday();
getWeather();
});
function registerEvent(bizid) {
websocket.onopen = function (event) {
console.log("已连接");
}
websocket.onmessage = function (event) {
if (event != null) {
// console.log(event.data)
let modelType = event.data;
if (modelType != 'model_status') {
getData(bizid,modelType);
}
}
};
websocket.onclose = function (event) {
console.log("已断开");
reconnect();
};
//连接发生错误的回调方法
websocket.onerror = function () {
reconnect();
};
}
function reconnect() {
websocket = new WebSocket("ws://" + modelIp + "/modelComputerWebSocketEnd/");
websocket.onopen = function (event) {
console.log("已连接");
}
websocket.onmessage = function (event) {
};
websocket.onclose = function (event) {
setTimeout("reconnect();", 8000);
};
//连接发生错误的回调方法 `1
websocket.onerror = function () {
websocket.close();
};
}
function addProgressBar(id, value, barColor) {
var width = $('#' + id).width() * value;
$('#' + id).html('<div style="background: ' + barColor + ';width: ' + width + 'px;height: 10px;border-radius: 0 20px 20px 0;"></div>');
}
function addAndRemove4Class(one, two) {
$('.' + one).addClass(two);
$('.' + one).removeClass(one);
}
function getData(unitId, modelType) {
const myDate = new Date;
const year = myDate.getFullYear(); //获取当前年
const mon = myDate.getMonth() + 1; //获取当前月
const day = myDate.getDate(); //获取当前日
const h = myDate.getHours();//获取当前小时数(0-23)
const m = myDate.getMinutes();//获取当前分钟数(0-59)
const s = myDate.getSeconds();//获取当前秒
const nowTime = year + "-" + (mon < 10 ? "0" + mon : mon) + "-" + (day < 10 ? "0" + day : day);
$('#nowDate').html(nowTime);
var jsp_id = $('#jsp_id').val();
var time_input = $('#time_input').val();
$.ajax({
type: 'GET',
url: ext.contextPath + "/digitalProcess/digitalTechnologist/getJspData.do",
dataType: 'json',
data: {
unitId: unitId, time: time_input, jspId: jsp_id, modelType: modelType
},
async: true,
error: function () {
return false;
},
success: function (data) {
var arr = data;
//console.log(arr);
var plannedHandlingCapacityDay = 0;
var plannedHandlingCapacityMonth = 0;
var plan_handle_month_totle = 0;
var forecast_handle_month_totle = 0;
var plan_handle_day_totle = 0;
var forecast_handle_day_totle = 0;
var actualHandlingCapacityDay = 0;
var actualHandlingCapacityMonth = 0;
var actualHandlingCapacityDay_dataseries = [];
var daily_energy_output_dataseries = [];
var forecastProcessingCapacityDay_dataseries = [];
var actualHandlingCapacityHour_dataseries = [];
var plannedHandlingCapacityDay_dataseries = [];
var forecastProcessingCapacityHour_dataseries = [];
var predictedTrajectoryMonth = [];
var predictedTrajectoryDay = [];
if (arr != null && arr != undefined && arr != '' && arr.length > 0) {
for (var i = 0; i < arr.length; i++) {
var value = 0;
var numtail = 0;
var dataMax = 0;
var rate = 1;
var nowdate = getNowTime();
if (arr[i].visualCacheConfig != null
&& arr[i].visualCacheConfig != undefined
&& arr[i].visualCacheConfig != '') {
var visualCacheConfig = arr[i].visualCacheConfig;
if (visualCacheConfig.numtail != null && visualCacheConfig.numtail != undefined && visualCacheConfig.numtail != '') {
numtail = visualCacheConfig.numtail;
}
}
if (arr[i].visualCacheData != null
&& arr[i].visualCacheData != undefined
&& arr[i].visualCacheData != '') {
var visualCacheData = arr[i].visualCacheData;
if (visualCacheData.inivalue != null && visualCacheData.inivalue != undefined && visualCacheData.inivalue != '') {
value = visualCacheData.inivalue;
} else {
if (visualCacheData.value != null && visualCacheData.value != undefined && visualCacheData.value != '') {
value = visualCacheData.value;
} else {
if (arr[i].mPoint != null && arr[i].mPoint != undefined && arr[i].mPoint != '') {
var mPoint = arr[i].mPoint;
if (mPoint.parmvalue != null && mPoint.parmvalue != undefined && mPoint.parmvalue != '') {
value = mPoint.parmvalue;
}
if (mPoint.alarmmax != null && mPoint.alarmmax != undefined && mPoint.alarmmax != '') {
dataMax = mPoint.alarmmax;
}
if (mPoint.numtail != null && mPoint.numtail != undefined && mPoint.numtail != '') {
numtail = mPoint.numtail;
}
if (mPoint.measuredt != null && mPoint.measuredt != undefined && mPoint.measuredt != '') {
nowdate = mPoint.measuredt;
}
}
}
}
if (visualCacheData.numtail != null && visualCacheData.numtail != undefined && visualCacheData.numtail != '') {
numtail = visualCacheData.numtail;
}
if (visualCacheData.insdt != null && visualCacheData.insdt != undefined && visualCacheData.insdt != '') {
nowdate = visualCacheData.insdt;
}
if (visualCacheData.rate != null && visualCacheData.rate != undefined && visualCacheData.rate != '') {
rate = visualCacheData.rate;
}
} else {
var mPoint = arr[i].mPoint;
if (mPoint != null && mPoint != undefined && mPoint != '') {
if (mPoint.parmvalue != null && mPoint.parmvalue != undefined && mPoint.parmvalue != '') {
value = mPoint.parmvalue;
}
if (mPoint.alarmmax != null && mPoint.alarmmax != undefined && mPoint.alarmmax != '') {
dataMax = mPoint.alarmmax;
}
if (mPoint.numtail != null && mPoint.numtail != undefined && mPoint.numtail != '') {
numtail = mPoint.numtail;
}
if (mPoint.measuredt != null && mPoint.measuredt != undefined && mPoint.measuredt != '') {
nowdate = mPoint.measuredt;
}
}
}
if (arr[i].getValueType == 'getRedisData' || arr[i].getValueType == 'getTHMonthHistoryAndRedisData') {
if (arr[i].value != null) {
let redisValue = eval("(" + arr[i].value + ")");
// console.log(redisValue)
value = redisValue.mpvalue;
if (isNumber(value)) {
if (arr[i].visualCacheData != null) {
if (arr[i].visualCacheData.numtail != null) {
value = Number(value).toFixed(Number(arr[i].visualCacheData.numtail));
}
}
//value = toThousands(value);
}
if (arr[i].visualCacheData != null) {
if (arr[i].visualCacheData.unit != null) {
value += arr[i].visualCacheData.unit;
}
}
if ($("." + arr[i].elementCode).length > 0) {
if (isNumber(value)) {
$("." + arr[i].elementCode).html(toThousands(value));
} else {
$("." + arr[i].elementCode).html(value);
}
}
} else {
$('.' + arr[i].elementCode).text('-');
}
} else {
value = parseFloat(value) * rate;
value = value.toFixed(numtail);
if ($("." + arr[i].elementCode).length > 0) {
if (isNumber(value)) {
$("." + arr[i].elementCode).html(toThousands(value));
} else {
$("." + arr[i].elementCode).html(value);
}
}
if ($("." + arr[i].elementCode).parent().find('.nowdate').length > 0) {
$("." + arr[i].elementCode).parent().find('.nowdate').html(nowdate.substring(11, 16));
}
}
if (arr[i].elementCode == 'dayOriginalProductionScheduling') {
$("#dayOriginalProductionScheduling").val(value);
}
if (arr[i].elementCode == 'plannedHandlingCapacityDay') {
plannedHandlingCapacityDay = value;
}
if (arr[i].elementCode == 'plannedHandlingCapacityMonth') {
plannedHandlingCapacityMonth = value;
}
if (arr[i].elementCode == 'plan_handle_month_totle') {
plan_handle_month_totle = value;
}
if (arr[i].elementCode == 'forecast_handle_month_totle') {
forecast_handle_month_totle = value;
}
if (arr[i].elementCode == 'plan_handle_day_totle') {
plan_handle_day_totle = value;
}
if (arr[i].elementCode == 'forecast_handle_day_totle') {
forecast_handle_day_totle = value;
}
if (arr[i].elementCode == 'actualHandlingCapacityDay') {
actualHandlingCapacityDay = value;
}
if (arr[i].elementCode == 'actualHandlingCapacityMonth') {
actualHandlingCapacityMonth = value;
}
if (arr[i].elementCode == 'actualHandlingCapacityDay2') {
//actualHandlingCapacityDay_dataseries = getdataseries(arr[i].mPointHistory,arr[i].visualCacheDataList,numtail);
actualHandlingCapacityDay_dataseries = arr[i].jsonArray;
}
if (arr[i].elementCode == 'daily_energy_output') {
//daily_energy_output_dataseries = getdataseries(arr[i].mPointHistory,arr[i].visualCacheDataList,numtail);
daily_energy_output_dataseries = arr[i].jsonArray;
}
if (arr[i].elementCode == 'forecastProcessingCapacityHour') {
//forecastProcessingCapacityHour_dataseries = getdataseries(arr[i].mPointHistory,arr[i].visualCacheDataList,numtail);
forecastProcessingCapacityHour_dataseries = arr[i].jsonArray;
}
if (arr[i].elementCode == 'actualHandlingCapacityHour') {
//actualHandlingCapacityHour_dataseries = getdataseries(arr[i].mPointHistory,arr[i].visualCacheDataList,numtail);
actualHandlingCapacityHour_dataseries = arr[i].jsonArray;
}
if (arr[i].elementCode == 'plannedHandlingCapacityDay2') {
//plannedHandlingCapacityDay_dataseries = getdataseries(arr[i].mPointHistory,arr[i].visualCacheDataList,numtail);
plannedHandlingCapacityDay_dataseries = arr[i].jsonArray;
}
if (arr[i].elementCode == 'forecastProcessingCapacityDay2') {
//forecastProcessingCapacityDay_dataseries = getdataseries(arr[i].mPointHistory,arr[i].visualCacheDataList,numtail);
forecastProcessingCapacityDay_dataseries = arr[i].jsonArray;
}
if (arr[i].elementCode == 'predictedTrajectoryMonth') {
predictedTrajectoryMonth = arr[i].jsonArray;
}
if (arr[i].elementCode == 'predictedTrajectoryDay') {
predictedTrajectoryDay = arr[i].jsonArray;
}
}
}
var legenddata = ['日设计产能', '日计划处理量', '日排产处理量', '日实际处理量'];
var xAxisStart1 = '';
var xAxisEnd1 = '';
var markLinexAxis ='';
if(forecastProcessingCapacityDay_dataseries!=null && forecastProcessingCapacityDay_dataseries!=undefined && forecastProcessingCapacityDay_dataseries.length>0){
let nowDate = getNowTime();
forecastProcessingCapacityDay_dataseries.forEach(function(value,index){
if (getCompareTime(value[0], nowDate) == 1) {
if(xAxisStart1==''){
xAxisStart1 = value[0];
}
xAxisEnd1 = value[0];
}
if (getCompareTime(value[0], nowDate) == -1) {
markLinexAxis = value[0];
}
});
}
var seriesdata = [
{
name: legenddata[0],
type: 'line',
//smooth: true,
//symbol: 'none',
data: daily_energy_output_dataseries
},
{
name: legenddata[1],
type: 'line',
//smooth: true,
//symbol: 'none',
data: plannedHandlingCapacityDay_dataseries
},
{
name: legenddata[2],
type: 'line',
//smooth: true,
//symbol: 'none',
data: forecastProcessingCapacityDay_dataseries,
markLine: {
label: { show: false },
data: [{ xAxis: markLinexAxis }]
},
markArea: {
itemStyle: {
color: 'rgba(255,155,0,0.10)'
},
data: [
[
{
xAxis: xAxisStart1
},
{
xAxis: xAxisEnd1
}
]
]
}
},
{
name: legenddata[3],
type: 'line',
//smooth: true,
//symbol: 'none',
data: actualHandlingCapacityDay_dataseries
}
]
if (daily_energy_output_dataseries != null || plannedHandlingCapacityDay_dataseries != null || forecastProcessingCapacityDay_dataseries != null || actualHandlingCapacityDay_dataseries != null) {
if (daily_energy_output_dataseries.length > 0
|| plannedHandlingCapacityDay_dataseries.length > 0
|| forecastProcessingCapacityDay_dataseries.length > 0
|| actualHandlingCapacityDay_dataseries.length > 0) {
var color1 = ['#71D3FF', '#000000', '#899BFF', '#4ACE4B', '#ffb536','#2e97ff'];
echarts_line_1('plan_line', legenddata, seriesdata,color1);
}
}
legenddata = ['排产小时处理量', '实际处理量'];
var xAxisStart2 = '';
var xAxisEnd2 = '';
var markLinexAxis2 ='';
if(forecastProcessingCapacityHour_dataseries!=null && forecastProcessingCapacityHour_dataseries!=undefined && forecastProcessingCapacityHour_dataseries.length>0){
let nowDate = getNowTime();
forecastProcessingCapacityHour_dataseries.forEach(function(value,index){
if (getCompareTime(value[0], nowDate) == 1) {
if(xAxisStart2==''){
xAxisStart2 = value[0];
}
xAxisEnd2 = value[0];
}
if (getCompareTime(value[0], nowDate) == -1) {
markLinexAxis2 = value[0];
}
});
}
/*var actualHandlingCapacityHour_dataseriesNew = [];
if(actualHandlingCapacityHour_dataseries!=null && actualHandlingCapacityHour_dataseries!=undefined && actualHandlingCapacityHour_dataseries.length>0){
for(var i=1;i<actualHandlingCapacityHour_dataseries.length;i++){
var data_0 = actualHandlingCapacityHour_dataseries[i-1];
var data_1 = actualHandlingCapacityHour_dataseries[i];
var value = (data_1[1]-data_0[1]).toFixed(4);
if(data_1[0].indexOf('10:00')!=-1){
value = data_1[1];
}
var dataseries = [data_1[0],value];
actualHandlingCapacityHour_dataseriesNew.push(dataseries);
}
}*/
seriesdata = [
{
name: legenddata[0],
type: 'line',
//smooth: true,
//symbol: 'none',
step: 'end',
data: forecastProcessingCapacityHour_dataseries,
markLine: {
label: { show: false },
data: [{ xAxis: markLinexAxis2 }]
},
markArea: {
itemStyle: {
color: 'rgba(255,155,0,0.10)'
},
data: [
[
{
xAxis: xAxisStart2
},
{
xAxis: xAxisEnd2
}
]
]
}
},
{
name: legenddata[1],
type: 'line',
//smooth: true,
symbol: 'none',
//data: actualHandlingCapacityHour_dataseriesNew
data: actualHandlingCapacityHour_dataseries
}
]
if (forecastProcessingCapacityHour_dataseries != null || actualHandlingCapacityHour_dataseries != null) {
if (forecastProcessingCapacityHour_dataseries.length > 0
|| actualHandlingCapacityHour_dataseries.length > 0) {
var color2 = ['#899BFF', '#4ACE4B', '#71D3FF', '#000000', '#ffb536','#2e97ff'];
echarts_line_2('water_line', legenddata, seriesdata,color2);
}
}
if (plannedHandlingCapacityMonth > 0) {
addProgressBar('month_plan_bar', (plan_handle_month_totle / plannedHandlingCapacityMonth), color[0]);
addProgressBar('month_forecast_bar', (forecast_handle_month_totle / plannedHandlingCapacityMonth), color[1]);
addProgressBar('month_actual_bar', (actualHandlingCapacityMonth / plannedHandlingCapacityMonth), color[2]);
}
if (plannedHandlingCapacityDay > 0) {
addProgressBar('day_plan_bar', (plan_handle_day_totle / plannedHandlingCapacityDay), color[0]);
addProgressBar('day_forecast_bar', (forecast_handle_day_totle / plannedHandlingCapacityDay), color[1]);
addProgressBar('day_actual_bar', (actualHandlingCapacityDay / plannedHandlingCapacityDay), color[2]);
}
seriesdata = [];
if(predictedTrajectoryMonth!=null && predictedTrajectoryMonth.length>0){
predictedTrajectoryMonth.forEach(function(value,index){
seriesdata[index] = {
name: '排产时间'+value.insdt.substring(5,value.insdt.indexOf(" ")),
type: 'line',
smooth: true,
showSymbol: false,
endLabel: {
show: true,
formatter: function (params) {
return params.seriesName;
}
},
data: value.data
}
});
}
echartsLinesMonth('predictedTrajectoryMonth', seriesdata);
seriesdata = [];
if(predictedTrajectoryDay!=null && predictedTrajectoryDay.length>0){
predictedTrajectoryDay.forEach(function(value,index){
seriesdata[index] = {
name: '排产时间'+value.insdt.substring(value.insdt.indexOf(" "),value.insdt.lastIndexOf(":")),
type: 'line',
smooth: true,
showSymbol: false,
endLabel: {
show: true,
formatter: function (params) {
return params.seriesName;
}
},
data: value.data
}
});
}
echartsLinesDay('predictedTrajectoryDay', seriesdata);
}
});
}
function getdataseries(mPointHistory, visualCacheDataList, numtail) {
var dataseries = [];
if (mPointHistory != null
&& mPointHistory != undefined
&& mPointHistory != '') {
var mPointHistory = mPointHistory;
for (var m = 0; m < mPointHistory.length; m++) {
var dataserie = [];
dataserie.push(mPointHistory[m].measuredt.substr(0, 16));
dataserie.push(mPointHistory[m].parmvalue.toFixed(numtail));
dataseries.push(dataserie);
}
} else {
if (visualCacheDataList != null
&& visualCacheDataList != undefined
&& visualCacheDataList != '') {
var visualCacheDataList = visualCacheDataList;
for (var m = 0; m < visualCacheDataList.length; m++) {
var dataserie = [];
dataserie.push(visualCacheDataList[m].insdt.substr(0, 16));
dataserie.push(visualCacheDataList[m].value.toFixed(numtail));
dataseries.push(dataserie);
}
}
}
return dataseries;
}
function getDayDate(ev) {
getDateData(unitId,'day',$('#daydt').val());
}
function getMonthDate(ev) {
getDateData(unitId,'month',$('#monthdt').val());
}
function getDateData(unitId,dateType,time_input) {
if(dateType=='month'){
time_input= time_input+'-01';
}
if(dateType=='day'){
time_input= time_input+' 00:00';
}
var jsp_id = "waterMonthOrDatHis";
$.ajax({
type: 'GET',
url: ext.contextPath + "/digitalProcess/digitalTechnologist/getJspData.do",
dataType: 'json',
data: {
unitId: unitId, time: time_input, jspId: jsp_id, modelType: dateType
},
async: true,
error: function () {
return false;
},
success: function (data) {
var arr = data;
//console.log(arr);
var plannedHandlingCapacityDay = 0;
var plannedHandlingCapacityMonth = 0;
var plan_handle_month_totle = 0;
var forecast_handle_month_totle = 0;
var plan_handle_day_totle = 0;
var forecast_handle_day_totle = 0;
var actualHandlingCapacityDay = 0;
var actualHandlingCapacityMonth = 0;
var actualHandlingCapacityDay_dataseries = [];
var daily_energy_output_dataseries = [];
var forecastProcessingCapacityDay_dataseries = [];
var actualHandlingCapacityHour_dataseries = [];
var plannedHandlingCapacityDay_dataseries = [];
var forecastProcessingCapacityHour_dataseries = [];
var predictedTrajectoryMonth = [];
var predictedTrajectoryDay = [];
if (arr != null && arr != undefined && arr != '' && arr.length > 0) {
for (var i = 0; i < arr.length; i++) {
var value = 0;
var numtail = 0;
var dataMax = 0;
var rate = 1;
var nowdate = getNowTime();
if (arr[i].visualCacheData != null
&& arr[i].visualCacheData != undefined
&& arr[i].visualCacheData != '') {
var visualCacheData = arr[i].visualCacheData;
if (visualCacheData.inivalue != null && visualCacheData.inivalue != undefined && visualCacheData.inivalue != '') {
value = visualCacheData.inivalue;
} else {
if (visualCacheData.value != null && visualCacheData.value != undefined && visualCacheData.value != '') {
value = visualCacheData.value;
} else {
if (arr[i].mPoint != null && arr[i].mPoint != undefined && arr[i].mPoint != '') {
var mPoint = arr[i].mPoint;
if (mPoint.parmvalue != null && mPoint.parmvalue != undefined && mPoint.parmvalue != '') {
value = mPoint.parmvalue;
}
if (mPoint.alarmmax != null && mPoint.alarmmax != undefined && mPoint.alarmmax != '') {
dataMax = mPoint.alarmmax;
}
if (mPoint.numtail != null && mPoint.numtail != undefined && mPoint.numtail != '') {
numtail = mPoint.numtail;
}
if (mPoint.measuredt != null && mPoint.measuredt != undefined && mPoint.measuredt != '') {
nowdate = mPoint.measuredt;
}
}
}
}
if (visualCacheData.numtail != null && visualCacheData.numtail != undefined && visualCacheData.numtail != '') {
numtail = visualCacheData.numtail;
}
if (visualCacheData.insdt != null && visualCacheData.insdt != undefined && visualCacheData.insdt != '') {
nowdate = visualCacheData.insdt;
}
if (visualCacheData.rate != null && visualCacheData.rate != undefined && visualCacheData.rate != '') {
rate = visualCacheData.rate;
}
} else {
var mPoint = arr[i].mPoint;
if (mPoint != null && mPoint != undefined && mPoint != '') {
if (mPoint.parmvalue != null && mPoint.parmvalue != undefined && mPoint.parmvalue != '') {
value = mPoint.parmvalue;
}
if (mPoint.alarmmax != null && mPoint.alarmmax != undefined && mPoint.alarmmax != '') {
dataMax = mPoint.alarmmax;
}
if (mPoint.numtail != null && mPoint.numtail != undefined && mPoint.numtail != '') {
numtail = mPoint.numtail;
}
if (mPoint.measuredt != null && mPoint.measuredt != undefined && mPoint.measuredt != '') {
nowdate = mPoint.measuredt;
}
}
}
if (arr[i].elementCode == 'plannedHandlingCapacityDay') {
plannedHandlingCapacityDay = value;
}
if (arr[i].elementCode == 'plannedHandlingCapacityMonth') {
plannedHandlingCapacityMonth = value;
}
if (arr[i].elementCode == 'plan_handle_month_totle') {
plan_handle_month_totle = value;
}
if (arr[i].elementCode == 'forecast_handle_month_totle') {
forecast_handle_month_totle = value;
}
if (arr[i].elementCode == 'plan_handle_day_totle') {
plan_handle_day_totle = value;
}
if (arr[i].elementCode == 'forecast_handle_day_totle') {
forecast_handle_day_totle = value;
}
if (arr[i].elementCode == 'actualHandlingCapacityDay') {
actualHandlingCapacityDay = value;
}
if (arr[i].elementCode == 'actualHandlingCapacityMonth') {
actualHandlingCapacityMonth = value;
}
if (arr[i].elementCode == 'actualHandlingCapacityDay2') {
//actualHandlingCapacityDay_dataseries = getdataseries(arr[i].mPointHistory,arr[i].visualCacheDataList,numtail);
actualHandlingCapacityDay_dataseries = arr[i].jsonArray;
}
if (arr[i].elementCode == 'daily_energy_output') {
//daily_energy_output_dataseries = getdataseries(arr[i].mPointHistory,arr[i].visualCacheDataList,numtail);
daily_energy_output_dataseries = arr[i].jsonArray;
}
if (arr[i].elementCode == 'forecastProcessingCapacityHour') {
//forecastProcessingCapacityHour_dataseries = getdataseries(arr[i].mPointHistory,arr[i].visualCacheDataList,numtail);
forecastProcessingCapacityHour_dataseries = arr[i].jsonArray;
}
if (arr[i].elementCode == 'actualHandlingCapacityHour') {
//actualHandlingCapacityHour_dataseries = getdataseries(arr[i].mPointHistory,arr[i].visualCacheDataList,numtail);
actualHandlingCapacityHour_dataseries = arr[i].jsonArray;
}
if (arr[i].elementCode == 'plannedHandlingCapacityDay2') {
//plannedHandlingCapacityDay_dataseries = getdataseries(arr[i].mPointHistory,arr[i].visualCacheDataList,numtail);
plannedHandlingCapacityDay_dataseries = arr[i].jsonArray;
}
if (arr[i].elementCode == 'forecastProcessingCapacityDay2') {
//forecastProcessingCapacityDay_dataseries = getdataseries(arr[i].mPointHistory,arr[i].visualCacheDataList,numtail);
forecastProcessingCapacityDay_dataseries = arr[i].jsonArray;
}
if (arr[i].elementCode == 'predictedTrajectoryMonth') {
predictedTrajectoryMonth = arr[i].jsonArray;
}
if (arr[i].elementCode == 'predictedTrajectoryDay') {
predictedTrajectoryDay = arr[i].jsonArray;
}
}
}
var legenddata = ['日设计产能', '日计划处理量', '日排产处理量', '日实际处理量'];
var xAxisStart1 = '';
var xAxisEnd1 = '';
var markLinexAxis ='';
if(forecastProcessingCapacityDay_dataseries!=null && forecastProcessingCapacityDay_dataseries!=undefined && forecastProcessingCapacityDay_dataseries.length>0){
let nowDate = getNowTime();
forecastProcessingCapacityDay_dataseries.forEach(function(value,index){
if (getCompareTime(value[0], nowDate) == 1) {
if(xAxisStart1==''){
xAxisStart1 = value[0];
}
xAxisEnd1 = value[0];
}
if (getCompareTime(value[0], nowDate) == -1) {
markLinexAxis = value[0];
}
});
}
var seriesdata = [
{
name: legenddata[0],
type: 'line',
//smooth: true,
//symbol: 'none',
data: daily_energy_output_dataseries
},
{
name: legenddata[1],
type: 'line',
//smooth: true,
//symbol: 'none',
data: plannedHandlingCapacityDay_dataseries
},
{
name: legenddata[2],
type: 'line',
//smooth: true,
//symbol: 'none',
data: forecastProcessingCapacityDay_dataseries,
markLine: {
label: { show: false },
data: [{ xAxis: markLinexAxis }]
},
markArea: {
itemStyle: {
color: 'rgba(255,155,0,0.10)'
},
data: [
[
{
xAxis: xAxisStart1
},
{
xAxis: xAxisEnd1
}
]
]
}
},
{
name: legenddata[3],
type: 'line',
//smooth: true,
//symbol: 'none',
data: actualHandlingCapacityDay_dataseries
}
]
console.log(seriesdata);
if (daily_energy_output_dataseries != null || plannedHandlingCapacityDay_dataseries != null
|| forecastProcessingCapacityDay_dataseries != null || actualHandlingCapacityDay_dataseries != null) {
if (daily_energy_output_dataseries.length > 0
|| plannedHandlingCapacityDay_dataseries.length > 0
|| forecastProcessingCapacityDay_dataseries.length > 0
|| actualHandlingCapacityDay_dataseries.length > 0) {
var color1 = ['#71D3FF', '#000000', '#899BFF', '#4ACE4B', '#ffb536','#2e97ff'];
echarts_line_1('plan_line', legenddata, seriesdata,color1);
}
}
legenddata = ['排产小时处理量', '实际处理量'];
var xAxisStart2 = '';
var xAxisEnd2 = '';
var markLinexAxis2 ='';
if(forecastProcessingCapacityHour_dataseries!=null && forecastProcessingCapacityHour_dataseries!=undefined && forecastProcessingCapacityHour_dataseries.length>0){
let nowDate = getNowTime();
forecastProcessingCapacityHour_dataseries.forEach(function(value,index){
if (getCompareTime(value[0], nowDate) == 1) {
if(xAxisStart2==''){
xAxisStart2 = value[0];
}
xAxisEnd2 = value[0];
}
if (getCompareTime(value[0], nowDate) == -1) {
markLinexAxis2 = value[0];
}
});
}
/*var actualHandlingCapacityHour_dataseriesNew = [];
if(actualHandlingCapacityHour_dataseries!=null && actualHandlingCapacityHour_dataseries!=undefined && actualHandlingCapacityHour_dataseries.length>0){
for(var i=1;i<actualHandlingCapacityHour_dataseries.length;i++){
var data_0 = actualHandlingCapacityHour_dataseries[i-1];
var data_1 = actualHandlingCapacityHour_dataseries[i];
var value = (data_1[1]-data_0[1]).toFixed(4);
if(data_1[0].indexOf('10:00')!=-1){
value = data_1[1];
}
var dataseries = [data_1[0],value];
actualHandlingCapacityHour_dataseriesNew.push(dataseries);
}
}*/
seriesdata = [
{
name: legenddata[0],
type: 'line',
//smooth: true,
//symbol: 'none',
step: 'end',
data: forecastProcessingCapacityHour_dataseries,
markLine: {
label: { show: false },
data: [{ xAxis: markLinexAxis2 }]
},
markArea: {
itemStyle: {
color: 'rgba(255,155,0,0.10)'
},
data: [
[
{
xAxis: xAxisStart2
},
{
xAxis: xAxisEnd2
}
]
]
}
},
{
name: legenddata[1],
type: 'line',
//smooth: true,
symbol: 'none',
//data: actualHandlingCapacityHour_dataseriesNew
data: actualHandlingCapacityHour_dataseries
}
]
if (forecastProcessingCapacityHour_dataseries != null || actualHandlingCapacityHour_dataseries != null) {
if (forecastProcessingCapacityHour_dataseries.length > 0
|| actualHandlingCapacityHour_dataseries.length > 0) {
var color2 = ['#899BFF', '#4ACE4B', '#71D3FF', '#000000', '#ffb536','#2e97ff'];
echarts_line_2('water_line', legenddata, seriesdata,color2);
}
}
seriesdata = [];
if(predictedTrajectoryMonth!=null && predictedTrajectoryMonth.length>0 && dateType=='month'){
predictedTrajectoryMonth.forEach(function(value,index){
seriesdata[index] = {
name: '排产时间'+value.insdt.substring(5,value.insdt.indexOf(" ")),
type: 'line',
smooth: true,
showSymbol: false,
endLabel: {
show: true,
formatter: function (params) {
return params.seriesName;
}
},
data: value.data
}
});
echartsLinesMonth('predictedTrajectoryMonth', seriesdata);
}
seriesdata = [];
if(predictedTrajectoryDay!=null && predictedTrajectoryDay.length>0 && dateType=='day'){
predictedTrajectoryDay.forEach(function(value,index){
seriesdata[index] = {
name: '排产时间'+value.insdt.substring(value.insdt.indexOf(" "),value.insdt.lastIndexOf(":")),
type: 'line',
smooth: true,
showSymbol: false,
endLabel: {
show: true,
formatter: function (params) {
return params.seriesName;
}
},
data: value.data
}
});
echartsLinesDay('predictedTrajectoryDay', seriesdata);
}
}
});
}
function echarts_line_1(id, legenddata, seriesdata,color1) {
if(color1==null || color1==undefined || color1==""){
color1=color;
}
var lifeChart = echarts.getInstanceByDom(document.getElementById(id));
//有的话就获取已有echarts实例的DOM节点。
if (lifeChart != null) { // 如果存在,就进行销毁。
lifeChart.dispose();
}
var option = {
color: color1,
tooltip: {
trigger: 'axis'
},
legend: {
data: legenddata,
x: 'left',
textStyle: {
color: fontcolor_grey,
fontSize: 12,
},
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
top: '15%',
containLabel: true
},
xAxis: {
type: 'time',
axisLabel: {
formatter: '{MM}-{dd}'
},
},
yAxis: {
type: 'value',
min: 0,
max: 52,
axisLine: {
show: true,
},
splitLine: {
show: true,
lineStyle: {
type: 'dashed',
}
}
},
series: seriesdata,
};
lifeChart = echarts.init(document.getElementById(id));
lifeChart.setOption(option, true);
}
function echarts_line_2(id, legenddata, seriesdata,color1) {
if(color1==null || color1==undefined || color1==""){
color1=color;
}
var lifeChart = echarts.getInstanceByDom(document.getElementById(id));
//有的话就获取已有echarts实例的DOM节点。
if (lifeChart != null) { // 如果存在,就进行销毁。
lifeChart.dispose();
}
var option = {
color: color1,
tooltip: {
trigger: 'axis'
},
legend: {
data: legenddata,
x: 'left',
textStyle: {
color: fontcolor_grey,
fontSize: 12,
},
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
top: '15%',
containLabel: true
},
xAxis: {
type: 'time',
axisLabel: {
formatter: '{MM}-{dd}\n{HH}:{mm}'
},
},
yAxis: {
type: 'value',
min: 0,
max: 5.8,
axisLine: {
show: true,
},
splitLine: {
show: true,
lineStyle: {
type: 'dashed',
}
}
},
series: seriesdata,
};
lifeChart = echarts.init(document.getElementById(id));
lifeChart.setOption(option, true);
}
function echarts_line_2y(id, legenddata, seriesdata) {
var lifeChart = echarts.getInstanceByDom(document.getElementById(id));
//有的话就获取已有echarts实例的DOM节点。
if (lifeChart != null) { // 如果存在,就进行销毁。
lifeChart.dispose();
}
var option = {
color: color,
tooltip: {
trigger: 'axis'
},
legend: {
data: legenddata,
x: 'right',
textStyle: {
color: fontcolor_grey,
fontSize: 12,
},
icon: 'roundRect'
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
top: '15%',
containLabel: true
},
xAxis: {
type: 'time',
},
yAxis: [
{
type: 'value',
axisLine: {
show: true,
},
splitLine: {
show: true,
lineStyle: {
type: 'dashed',
}
}
},
{
type: 'value',
axisLine: {
show: true,
},
splitLine: {
show: true,
lineStyle: {
type: 'dashed',
}
}
}
],
series: seriesdata,
};
lifeChart = echarts.init(document.getElementById(id));
lifeChart.setOption(option, true);
}
function doBar(id, data) {
var myChart = echarts.init(document.getElementById(id));
var option = {
/* title: [
{
text: data.value.toFixed(0),
left: '48%',
top: '35%',
textAlign: 'center',
textStyle: {
fontSize: '67',
fontWeight: '400',
color: '#69F6F9',
textAlign: 'center',
textBorderColor: 'rgba(0, 0, 0, 0)',
textShadowColor: '#000',
textShadowBlur: '0',
textShadowOffsetX: 0,
textShadowOffsetY: 1,
},
},
], */
polar: {
radius: ['65%', '75%'],
center: ['50%', '50%'],
},
angleAxis: {
max: 100,
clockwise: false,
axisLine: {
show: false,
},
axisTick: {
show: false,
},
axisLabel: {
show: false,
},
splitLine: {
show: false,
},
},
radiusAxis: {
type: 'category',
show: true,
axisLabel: {
show: false,
},
axisLine: {
show: false,
},
axisTick: {
show: false,
},
},
series: [
{
name: '',
type: 'bar',
roundCap: true,
z: 2,
showBackground: true,
data: [data.value],
coordinateSystem: 'polar',
itemStyle: {
normal: {
color: '#36FFF9'
},
},
},
],
};
myChart.clear();
myChart.setOption(option, true);
}
function doBarAndPie(id, data) {
var myChart = echarts.init(document.getElementById(id));
var option = {
color: ['#71D3FF', '#8871FF', '#F671FF', '#28EC77', '#FFFA71'],
title: [
{
text: data.value + '%',
left: '50%',
top: '43%',
textAlign: 'center',
textStyle: {
fontSize: '24',
fontWeight: '400',
color: '#69F6F9',
textAlign: 'center',
textBorderColor: 'rgba(0, 0, 0, 0)',
textShadowColor: '#000',
textShadowBlur: '0',
textShadowOffsetX: 0,
textShadowOffsetY: 1,
},
},
],
polar: {
radius: ['45%', '55%'],
center: ['50%', '50%'],
},
angleAxis: {
max: 100,
clockwise: false,
axisLine: {
show: false,
},
axisTick: {
show: false,
},
axisLabel: {
show: false,
},
splitLine: {
show: false,
},
},
radiusAxis: {
type: 'category',
show: true,
axisLabel: {
show: false,
},
axisLine: {
show: false,
},
axisTick: {
show: false,
},
},
series: [
{
name: '',
type: 'bar',
roundCap: true,
z: 2,
showBackground: true,
data: [data.value],
coordinateSystem: 'polar',
itemStyle: {
normal: {
color: '#36FFF9'
},
},
},
{
name: 'Access From',
type: 'pie',
radius: ['60%', '80%'],
label: {
color: "#fff",
},
center: ['50%', '50%'],
avoidLabelOverlap: false,
data: data.list
}
],
};
myChart.clear();
myChart.setOption(option, true);
}
function progressBar(id, data, color1, color2) {
var myChart = echarts.init(document.getElementById(id));
var option = {
grid: {
top: 0,
bottom: 0,
left: '5%',
right: '5%'
},
xAxis: {
show: false,
type: "value",
boundaryGap: [0, 0]
},
yAxis: [
{
type: "category",
data: [""],
axisLine: {show: false},
axisTick: [
{
show: false
}
]
}
],
series: [
{
name: "金额",
type: "bar",
zlevel: 1,
itemStyle: {
normal: {
barBorderRadius: 9,
color: color1
}
},
barWidth: 20,
data: [data.value1]
},
{
name: "背景",
type: "bar",
barWidth: 20,
barGap: "-100%",
data: [data.value2],
itemStyle: {
normal: {
color: color2,
barBorderRadius: 9
}
}
}
]
}
myChart.clear();
myChart.setOption(option, true);
}
function echartsLinesMonth(id, seriesdata) {
var myChart = echarts.init(document.getElementById(id));
var option = {
tooltip: {
trigger: 'axis'
},
grid: {
left: '3%',
right: '11%',
bottom: '3%',
top: '3%',
containLabel: true
},
xAxis: {
type: 'time',
boundaryGap: false,
axisLabel: {
formatter: '{MM}-{dd}'
},
},
yAxis: {
type: 'value'
},
series: seriesdata,
/*series: [
{
name: '排产时间\n11-09',
type: 'line',
endLabel: {
show: true,
formatter: function (params) {
return params.seriesName;
}
},
data: [['2022-11-01 00:00',132], ['2022-11-02 00:00',110],
['2022-11-03 00:00',134], ['2022-11-04 00:00',119], ['2022-11-05 00:00',130],
['2022-11-06 00:00',110]]
},
{
name: '排产时间\n11-08',
type: 'line',
endLabel: {
show: true,
formatter: function (params) {
return params.seriesName;
}
},
data: [['2022-11-01 00:00',20], ['2022-11-02 00:00',32], ['2022-11-03 00:00',10],
['2022-11-04 00:00',34], ['2022-11-05 00:00',9], ['2022-11-06 00:00',30],
['2022-11-07 00:00',10]]
},
]*/
};
myChart.clear();
myChart.setOption(option, true);
}function echartsLinesDay(id, seriesdata) {
var myChart = echarts.init(document.getElementById(id));
var option = {
tooltip: {
trigger: 'axis'
},
grid: {
left: '3%',
right: '11%',
bottom: '3%',
top: '3%',
containLabel: true
},
xAxis: {
type: 'time',
boundaryGap: false,
axisLabel: {
formatter: '{MM}-{dd}\n{hh}:{mm}'
},
},
yAxis: {
type: 'value'
},
series: seriesdata,
/*series: [
{
name: '排产时间\n01:00',
type: 'line',
endLabel: {
show: true,
formatter: function (params) {
return params.seriesName;
}
},
data: [['2022-11-09 02:00',132], ['2022-11-09 03:00',110],
['2022-11-09 04:00',134], ['2022-11-09 05:00',119], ['2022-11-09 06:00',130],
['2022-11-09 07:00',110]]
},
{
name: '排产时间\n02:00',
type: 'line',
endLabel: {
show: true,
formatter: function (params) {
return params.seriesName;
}
},
data: [['2022-11-09 01:00',20], ['2022-11-09 02:00',32], ['2022-11-09 03:00',10],
['2022-11-09 04:00',34], ['2022-11-09 05:00',9], ['2022-11-09 06:00',30],
['2022-11-09 07:00',10]]
},
]*/
};
myChart.clear();
myChart.setOption(option, true);
}
//添加千分位符合
function toThousands(num) {
var nums = num;
var re = /\d{1,3}(?=(\d{3})+$)/g;
var n1 = 0;
if (nums != null && nums != '' && nums != undefined) {
n1 = nums.toString().replace(/^(\d+)((\.\d+)?)$/, function (s, s1, s2) {
return s1.replace(re, "$&,") + s2;
});
}
return n1;
}
var dispatchSheetEntry = function () {
$.post(ext.contextPath + '/digitalProcess/digitalTechnologist/dispatchSheetEntry.do', {unitId: unitId}, function (data) {
$("#subDiv").html(data);
openModal('subModal');
});
};
var dispatchSheetEntryToday = function () {
let date = new Date();
let hour = date.getHours(); //小时
let startDate = "";
let endDate = "";
if(hour<8){
startDate = moment().add(-1, 'days').format('YYYY-MM-DD')+' 08:00';
endDate = moment().add(0, 'days').format('YYYY-MM-DD')+' 08:00';
}else{
startDate = moment().add(0, 'days').format('YYYY-MM-DD')+' 08:00';
endDate = moment().add(1, 'days').format('YYYY-MM-DD')+' 08:00';
}
$.post(ext.contextPath + "/digitalProcess/digitalTechnologist/dispatchSheetEntryToday.do", {unitId: unitId,startDate: startDate,endDate: endDate}, function(data) {
if (data.res >0){
$(".dispatchListNum").html(data.dispatchListNum);
$(".dispatchListTime").html(data.dispatchListTime);
$(".dispatchListContent").html(data.dispatchListContent);
}
},'json');
}
var getWeather = function () {
$.post(ext.contextPath + "/work/weather/getList.do", {page: 1,rows:1,bizid:unitId,type:0}, function(data) {
if (data.total >0){
let temp = data.rows[0].temp;
let weather = data.rows[0].weather;
let precip = data.rows[0].precip;
let wind = data.rows[0].wind;
let windPower = data.rows[0].windPower;
$(".temp").html(temp+'℃');
$(".weather").html(weather);
$(".precip").html(precip);
$(".wind").html(wind);
$(".windPower").html(windPower);
}
},'json');
}
var modelInvoke = function () {
$.get("http://" + modelIp + "/process/modeltype/modelInvoke.do?id=021THWS_MODEL1&unitId=021THWS",function(data,status){
console.log(data);
});
}
</script>
</head>
<body class="hold-transition ${cu.themeclass} sidebar-mini">
<div id="subDiv"></div>
<div class="wrapper">
<div class="content-wrapper content-wrapper-bg-grey overall-content font-color-grey">
<!-- BEGIN CONTAINER -->
<input type="hidden" name="jsp_id" id="jsp_id" value="waterVolumePrediction">
<input type="hidden" name="dayOriginalProductionScheduling" id="dayOriginalProductionScheduling" value="">
<div class="row">
<div class="col-lg-12">
<div class="box box-widget">
<!-- /.box-header -->
<div class="box-body">
<div class="row">
<div class="col-lg-2">
<div class="font-size-30 padding-top-10 line-height-2 font-color-lightBlack">泰和污水厂</div>
<span>设计处理能力 <span
class="font-size-30 font-color-lightBlack designedProcessingCapacity">0</span> 万m³/d</span>
</div>
<div class="col-lg-5 border-left">
<div class="col-lg-4 padding-bottom-10">
<div>当日计划处理量(万m³)</div>
<span class="font-size-30 font-color-lightBlack plannedHandlingCapacityDay">0</span>
</div>
<div class="col-lg-4 padding-bottom-10">
<div>当日排产处理量(万m³)</div>
<span class="font-size-30 font-color-blue forecastProcessingCapacityDay">0</span>
</div>
<div class="col-lg-4 padding-bottom-10">
<div>当日实际处理量(万m³)</div>
<span class="font-size-30 font-color-green actualHandlingCapacityDay">0</span>
</div>
<div class="col-lg-4 padding-bottom-10">
<div>当月计划处理量(万m³)</div>
<span class="font-size-30 font-color-lightBlack plannedHandlingCapacityMonth">0</span>
</div>
<div class="col-lg-4 padding-bottom-10">
<div>当月排产处理量(万m³)</div>
<span class="font-size-30 font-color-blue forecastProcessingCapacityMonth">0</span>
</div>
<div class="col-lg-4 padding-bottom-10">
<div>当月实际处理量(万m³)</div>
<span class="font-size-30 font-color-green actualHandlingCapacityMonth">0</span>
</div>
</div>
<div class="col-lg-3 border-left">
<div class="col-lg-6 padding-bottom-10">今日调度单:<span class="dispatchListNum">0</span>
</div>
<div class="col-lg-6 padding-bottom-10">
<button type="button" class="btn btn-info" onclick="dispatchSheetEntry();">调度单信息录入
</button>
</div>
<div class="col-lg-12 dispatchListTime"></div>
<div class="col-lg-12 dispatchListContent"></div>
</div>
<div class="col-lg-2 border-left">
<div class="col-lg-12 font-color-lightBlack padding-bottom-10">
<span id="nowDate">2022-11-01</span><span> 上海</span></div>
<div class="col-lg-4 padding-bottom-10">
<div>今日气温</div>
<span class="font-size-20 font-color-red temp">25℃</span>
</div>
<div class="col-lg-4 padding-bottom-10">
<div>天气</div>
<span class="font-size-20 font-color-lightBlack weather">多云</span>
</div>
<div class="col-lg-4 padding-bottom-10">
<div>降雨量</div>
<span class="font-size-20 font-color-lightBlack precip">0mm</span>
</div>
<div class="col-lg-4 padding-bottom-10">
<div>风向</div>
<span class="font-size-20 font-color-lightBlack wind">南风</span>
</div>
<div class="col-lg-4 padding-bottom-10">
<div>风力</div>
<span class="font-size-20 font-color-lightBlack windPower">2级</span>
</div>
</div>
</div>
</div>
<!-- /.box-body -->
</div>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<div class="box box-widget">
<!-- /.box-header -->
<div class="box-body">
<div class="row">
<div class="col-lg-3">
<div class="col-lg-4 padding-bottom-10">
<div class="font-color-lightBlack padding-bottom-10">月罗泵站</div>
<div class="padding-bottom-10">当前液位(m)</div>
<span class="font-color-lightBlack yl_current_level">0</span>
</div>
<div class="col-lg-4 padding-bottom-10">
<div class="font-color-lightBlack padding-bottom-10">新蕰藻浜泵站</div>
<div class="padding-bottom-10">当前液位(m)</div>
<span class="font-color-lightBlack xyzb_current_level">0</span>
</div>
<div class="col-lg-12">
<img src="<%=request.getContextPath()%>/IMG/digitalProcess/waterVolumePrediction.jpg">
</div>
</div>
<div class="col-lg-9">
<div class="row">
<div class="col-lg-8">
<div class="row">
<div class="col-lg-9">
<div class="font-size-18 font-color-lightBlack padding-bottom-10 cursor-pointer"
data-toggle="modal" data-target="#myModalMonth">当月计划分解</div>
</div>
<div class="col-lg-3">
<div class="input-group">
<input type="text" class="form-control input-sm" id="monthdt" name="monthdt" value="" readonly>
<span class="input-group-addon"><li class="fa fa-th"></li></span>
</div>
</div>
</div>
<div class="echarts_lines" id="plan_line"></div>
</div>
<div class="col-lg-4">
<div class="font-size-18 font-color-lightBlack padding-bottom-10">月度完成情况</div>
<div>当前累积计划处理量/当月计划处理量(万m³)</div>
<div><span
class="font-size-20 font-color-lightBlue plan_handle_month_totle">0</span>
/ <span class="font-size-20 font-color-yellow plannedHandlingCapacityMonth">0</span>
</div>
<div class="progress_bar" id="month_plan_bar"></div>
<div class="padding-top-10">当前累积排产处理量/当月计划处理量(万m³)</div>
<div><span
class="font-size-20 font-color-blue forecast_handle_month_totle">0</span>
/ <span class="font-size-20 font-color-yellow plannedHandlingCapacityMonth">0</span>
</div>
<div class="progress_bar" id="month_forecast_bar"></div>
<div class="padding-top-10">当前累积实际处理量/当月计划处理量(万m³)</div>
<div><span
class="font-size-20 font-color-green actualHandlingCapacityMonth">0</span>
/ <span class="font-size-20 font-color-yellow plannedHandlingCapacityMonth">0</span>
</div>
<div class="progress_bar" id="month_actual_bar"></div>
</div>
</div>
<div class="row padding-top-10">
<div class="col-lg-8">
<div class="row">
<div class="col-lg-9">
<div class="font-size-18 font-color-lightBlack padding-bottom-10 cursor-pointer"
data-toggle="modal" data-target="#myModalDay">当日水量分解</div>
</div>
<div class="col-lg-3">
<div class="input-group">
<input type="text" class="form-control input-sm" id="daydt" name="daydt" value="" readonly>
<span class="input-group-addon"><li class="fa fa-th"></li></span>
</div>
</div>
</div>
<div class="echarts_lines" id="water_line"></div>
</div>
<div class="col-lg-4">
<div class="font-size-18 font-color-lightBlack padding-bottom-10">日度完成情况</div>
<div>当前累积计划处理量/当日计划处理量(万m³)</div>
<div><span
class="font-size-20 font-color-lightBlue plan_handle_day_totle">0</span>
/
<span class="font-size-20 font-color-yellow plannedHandlingCapacityDay">0</span>
</div>
<div class="progress_bar" id="day_plan_bar"></div>
<div class="padding-top-10">当前累积排产处理量/当日计划处理量(万m³)</div>
<div><span
class="font-size-20 font-color-blue forecast_handle_day_totle">0</span>
/
<span class="font-size-20 font-color-yellow plannedHandlingCapacityDay">0</span>
</div>
<div class="progress_bar" id="day_forecast_bar"></div>
<div class="padding-top-10">当前累积实际处理量/当日计划处理量(万m³)</div>
<div><span
class="font-size-20 font-color-green actualHandlingCapacityDay">0</span>
/
<span class="font-size-20 font-color-yellow plannedHandlingCapacityDay">0</span>
</div>
<div class="progress_bar" id="day_actual_bar"></div>
</div>
</div>
</div>
</div>
</div>
<!-- /.box-body -->
</div>
</div>
</div>
</div>
</div>
<!-- Modal -->
<div class="modal fade" id="myModalMonth" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title" id="myModalLabelMonth">当月排产轨迹图</h4>
</div>
<div class="modal-body predicted-trajectory" id="predictedTrajectoryMonth">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
</div>
</div>
</div>
</div>
<!-- Modal -->
<div class="modal fade" id="myModalDay" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title" id="myModalLabelDay">当日排产轨迹图</h4>
</div>
<div class="modal-body predicted-trajectory" id="predictedTrajectoryDay">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
</div>
</div>
</div>
</div>
</body>
</html>