602 lines
26 KiB
Plaintext
602 lines
26 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" %>
|
|||
|
|
|
|||
|
|
<%@page import="com.sipai.entity.scada.ProAlarmBaseText" %>
|
|||
|
|
<%request.setAttribute("AdoptSt_True", ProAlarmBaseText.AdoptSt_True); %>
|
|||
|
|
<%request.setAttribute("AdoptSt_False", ProAlarmBaseText.AdoptSt_False); %>
|
|||
|
|
|
|||
|
|
<!DOCTYPE html>
|
|||
|
|
<!-- <html lang="zh-CN"> -->
|
|||
|
|
<!-- BEGIN HEAD -->
|
|||
|
|
|
|||
|
|
<head>
|
|||
|
|
<title><%= ServerObject.atttable.get("TOPTITLE")%>
|
|||
|
|
</title>
|
|||
|
|
<!-- 引用页头及CSS页-->
|
|||
|
|
<jsp:include page="/jsp/inc.jsp"></jsp:include>
|
|||
|
|
|
|||
|
|
<script type="text/javascript">
|
|||
|
|
var beginTimeStore = '';
|
|||
|
|
var endTimeStore = '';
|
|||
|
|
|
|||
|
|
var beginTimeStore2 = '';
|
|||
|
|
// var endTimeStore2 = '';
|
|||
|
|
|
|||
|
|
let colors = ['#3AA1FF', '#59D4D4', '#6DD48C', '#FBDB5A',
|
|||
|
|
"#2ec7c9",
|
|||
|
|
"#b6a2de",
|
|||
|
|
"#5ab1ef",
|
|||
|
|
"#ffb980",
|
|||
|
|
"#d87a80",
|
|||
|
|
"#8d98b3",
|
|||
|
|
"#e5cf0d",
|
|||
|
|
"#97b552",
|
|||
|
|
"#95706d",
|
|||
|
|
"#dc69aa",
|
|||
|
|
"#07a2a4",
|
|||
|
|
"#9a7fd1",
|
|||
|
|
"#588dd5",
|
|||
|
|
"#f5994e",
|
|||
|
|
"#c05050",
|
|||
|
|
"#59678c",
|
|||
|
|
"#c9ab00",
|
|||
|
|
"#7eb00a",
|
|||
|
|
"#6f5553",
|
|||
|
|
"#c14089"];
|
|||
|
|
|
|||
|
|
|
|||
|
|
$(function () {
|
|||
|
|
let bodyWidth = $(window).width();
|
|||
|
|
let bodyHeight = $(window).height();
|
|||
|
|
// var bodyWidth = global_width;
|
|||
|
|
// var bodyHeight = global_height;
|
|||
|
|
|
|||
|
|
$('#main').css('width', bodyWidth);
|
|||
|
|
$('#main').css('height', bodyHeight);
|
|||
|
|
|
|||
|
|
initDate();
|
|||
|
|
initDate2();
|
|||
|
|
|
|||
|
|
dosearch2();
|
|||
|
|
|
|||
|
|
$.ajax({
|
|||
|
|
type: 'GET',
|
|||
|
|
url: ext.contextPath + "/process/decisionExpertBase/get4SelectPidJson.do",
|
|||
|
|
async: false,
|
|||
|
|
globle: false,
|
|||
|
|
data: {unitId: unitId},
|
|||
|
|
dataType: 'json',
|
|||
|
|
error: function () {
|
|||
|
|
return false;
|
|||
|
|
},
|
|||
|
|
success: function (data) {
|
|||
|
|
$("#zdType").empty();
|
|||
|
|
var selelct_ = $("#zdType").select2({
|
|||
|
|
data: data,
|
|||
|
|
cache: false,
|
|||
|
|
placeholder: '请选择',//默认文字提示
|
|||
|
|
allowClear: true,//允许清空
|
|||
|
|
escapeMarkup: function (markup) {
|
|||
|
|
return markup;
|
|||
|
|
}, // 自定义格式化防止xss注入
|
|||
|
|
language: "zh-CN",
|
|||
|
|
minimumInputLength: 0,
|
|||
|
|
minimumResultsForSearch: 10,//数据超过十个启用搜索框
|
|||
|
|
formatResult: function formatRepo(repo) {
|
|||
|
|
return repo.text;
|
|||
|
|
}, // 函数用来渲染结果
|
|||
|
|
formatSelection: function formatRepoSelection(repo) {
|
|||
|
|
return repo.text;
|
|||
|
|
} // 函数用于呈现当前的选择
|
|||
|
|
});
|
|||
|
|
$(".select2-selection--single").css({'height': '30px', 'paddingTop': '4px'})
|
|||
|
|
selelct_.val('${param.zdType}').trigger("change");
|
|||
|
|
selelct_.on("change", function (e) {
|
|||
|
|
$("#table").bootstrapTable('refresh');
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
var data_adoptSt = [{ id: '${AdoptSt_True}', text: '采纳' }, { id: '${AdoptSt_False}', text: '未采纳' }];
|
|||
|
|
|
|||
|
|
var selelct_adoptSt = $("#adoptSt").select2({
|
|||
|
|
data: data_adoptSt,
|
|||
|
|
cache: false,
|
|||
|
|
placeholder: '请选择',//默认文字提示
|
|||
|
|
allowClear: true,//允许清空
|
|||
|
|
escapeMarkup: function (markup) {
|
|||
|
|
return markup;
|
|||
|
|
}, // 自定义格式化防止xss注入
|
|||
|
|
language: "zh-CN",
|
|||
|
|
minimumInputLength: 0,
|
|||
|
|
minimumResultsForSearch: 10,//数据超过十个启用搜索框
|
|||
|
|
formatResult: function formatRepo(repo) {
|
|||
|
|
return repo.text;
|
|||
|
|
}, // 函数用来渲染结果
|
|||
|
|
formatSelection: function formatRepoSelection(repo) {
|
|||
|
|
return repo.text;
|
|||
|
|
} // 函数用于呈现当前的选择
|
|||
|
|
});
|
|||
|
|
$(".select2-selection--single").css({'height': '30px', 'paddingTop': '4px'})
|
|||
|
|
selelct_adoptSt.val('${param.adoptSt}').trigger("change");
|
|||
|
|
selelct_adoptSt.on("change", function (e) {
|
|||
|
|
$("#table").bootstrapTable('refresh');
|
|||
|
|
});
|
|||
|
|
$("#table").bootstrapTable({ // 对应table标签的id
|
|||
|
|
url: ext.contextPath + '/alarm/proAlarmBaseText/getList.do', // 获取表格数据的url
|
|||
|
|
cache: false, // 设置为 false 禁用 AJAX 数据缓存， 默认为true
|
|||
|
|
striped: true, //表格显示条纹，默认为false
|
|||
|
|
pagination: true, // 在表格底部显示分页组件，默认false
|
|||
|
|
pageList: [10, 20, 50], // 设置页面可以显示的数据条数
|
|||
|
|
pageSize: 50, // 页面数据条数
|
|||
|
|
pageNumber: 1, // 首页页码
|
|||
|
|
sidePagination: 'server', // 设置为服务器端分页
|
|||
|
|
queryParams: function (params) { // 请求服务器数据时发送的参数，可以在这里添加额外的查询参数，返回false则终止请求
|
|||
|
|
return {
|
|||
|
|
rows: params.limit, // 每页要显示的数据条数
|
|||
|
|
page: params.offset / params.limit + 1, // 每页显示数据的开始页码
|
|||
|
|
sort: params.sort, // 要排序的字段
|
|||
|
|
order: params.order,
|
|||
|
|
unitId: unitId,
|
|||
|
|
sdt: beginTimeStore,
|
|||
|
|
edt: endTimeStore,
|
|||
|
|
adoptSt: $("#adoptSt").val(),
|
|||
|
|
zdType: $("#zdType").val()
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
sortName: 'insdt', // 要排序的字段
|
|||
|
|
sortOrder: 'desc', // 排序规则
|
|||
|
|
onClickRow: function (row) {//单击行事件,执行查看功能
|
|||
|
|
// viewFun(row.id);
|
|||
|
|
},
|
|||
|
|
columns: [
|
|||
|
|
// {
|
|||
|
|
// checkbox: true, // 显示一个勾选框
|
|||
|
|
// },
|
|||
|
|
{
|
|||
|
|
field: 'pointName', // 返回json数据中的name
|
|||
|
|
title: '问题项', // 表格表头显示文字
|
|||
|
|
align: 'center', // 左右居中
|
|||
|
|
valign: 'middle', // 上下居中
|
|||
|
|
formatter: function (value, row, index) {
|
|||
|
|
if (row.proAlarm != null) {
|
|||
|
|
return row.proAlarm.pointName
|
|||
|
|
} else {
|
|||
|
|
return "未关联报警点"
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
field: 'describe', // 返回json数据中的name
|
|||
|
|
title: '问题描述', // 表格表头显示文字
|
|||
|
|
align: 'center', // 左右居中
|
|||
|
|
valign: 'middle', // 上下居中
|
|||
|
|
formatter: function (value, row, index) {
|
|||
|
|
if (row.proAlarm != null) {
|
|||
|
|
return row.proAlarm.describe
|
|||
|
|
} else {
|
|||
|
|
return "未关联报警点"
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
field: 'zdTypeName', // 返回json数据中的name
|
|||
|
|
title: '诊断类型', // 表格表头显示文字
|
|||
|
|
align: 'center', // 左右居中
|
|||
|
|
valign: 'middle' // 上下居中
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
field: 'alarmTime', // 返回json数据中的name
|
|||
|
|
title: '诊断时间', // 表格表头显示文字
|
|||
|
|
align: 'center', // 左右居中
|
|||
|
|
valign: 'middle', // 上下居中
|
|||
|
|
formatter: function (value, row, index) {
|
|||
|
|
if (row.proAlarm != null) {
|
|||
|
|
return row.proAlarm.alarmTime.substring(0, 16)
|
|||
|
|
} else {
|
|||
|
|
return "未关联报警点"
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
field: 'decisionexpertbasetext', // 返回json数据中的name
|
|||
|
|
title: '专家建议', // 表格表头显示文字
|
|||
|
|
align: 'center', // 左右居中
|
|||
|
|
valign: 'middle' // 上下居中
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
field: 'adoptSt', // 返回json数据中的name
|
|||
|
|
title: '状态', // 表格表头显示文字
|
|||
|
|
align: 'center', // 左右居中
|
|||
|
|
valign: 'middle', // 上下居中
|
|||
|
|
formatter: function (value, row, index) {
|
|||
|
|
if (value == '${AdoptSt_True}') {
|
|||
|
|
return "采纳"
|
|||
|
|
} else {
|
|||
|
|
return "未采纳"
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}, {
|
|||
|
|
title: "操作",
|
|||
|
|
align: 'center',
|
|||
|
|
valign: 'middle',
|
|||
|
|
width: 120, // 定义列的宽度，单位为像素px
|
|||
|
|
formatter: function (value, row, index) {
|
|||
|
|
var buts = '';
|
|||
|
|
buts += '<button class="btn btn-default btn-sm" title="采纳" onclick="downOrder(\'' + row.id + '\')"><i class="fa fa-check"></i><span class="hidden-md hidden-lg"> 采纳</span></button>';
|
|||
|
|
buts = '<div class="btn-group" >' + buts + '</div>';
|
|||
|
|
return buts;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
onLoadSuccess: function () { //加载成功时执行
|
|||
|
|
adjustBootstrapTableView("table");
|
|||
|
|
},
|
|||
|
|
onLoadError: function () { //加载失败时执行
|
|||
|
|
console.info("加载数据失败");
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
function downOrder(id) {
|
|||
|
|
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 + "/alarm/proAlarmBaseText/downOrder.do", {
|
|||
|
|
id: id,
|
|||
|
|
unitId: unitId
|
|||
|
|
}, function (data) {
|
|||
|
|
$("#table").bootstrapTable('refresh');
|
|||
|
|
}, 'json');
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function initDate() {
|
|||
|
|
//定义locale汉化插件
|
|||
|
|
// beginTimeStore = moment().subtract(7, 'days').format('YYYY-MM-DD HH:mm');
|
|||
|
|
beginTimeStore = moment().subtract(30, 'days').format('YYYY-MM-DD') + ' 00:00';
|
|||
|
|
endTimeStore = moment().subtract(0, 'days').format('YYYY-MM-DD') + ' 23:59';
|
|||
|
|
var locale = {
|
|||
|
|
"format": 'YYYY-MM-DD HH:mm',
|
|||
|
|
"separator": " ~ ",
|
|||
|
|
"applyLabel": "确定",
|
|||
|
|
"cancelLabel": "取消",
|
|||
|
|
"fromLabel": "起始时间",
|
|||
|
|
"toLabel": "结束时间'",
|
|||
|
|
"customRangeLabel": "自定义",
|
|||
|
|
"weekLabel": "W",
|
|||
|
|
"daysOfWeek": ["日", "一", "二", "三", "四", "五", "六"],
|
|||
|
|
"monthNames": ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
|
|||
|
|
"firstDay": 1
|
|||
|
|
};
|
|||
|
|
$('#reservationtimeMain').daterangepicker({
|
|||
|
|
"timePicker": true,
|
|||
|
|
"timePicker24Hour": true,
|
|||
|
|
"linkedCalendars": false,
|
|||
|
|
"autoUpdateInput": false,
|
|||
|
|
"timePickerIncrement": 10,
|
|||
|
|
"locale": locale,
|
|||
|
|
//汉化按钮部分
|
|||
|
|
ranges: {
|
|||
|
|
// '今日': [moment(), moment().subtract(-1, 'days')],
|
|||
|
|
'昨日': [moment().subtract(1, 'days'), moment()],
|
|||
|
|
'最近7日': [moment().subtract(6, 'days'), moment().subtract(-1, 'days')],
|
|||
|
|
'本月': [moment().startOf('month'), moment().endOf('month').subtract(-1, 'days')],
|
|||
|
|
'上月': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month').subtract(-1, 'days')]
|
|||
|
|
},
|
|||
|
|
startDate: beginTimeStore,
|
|||
|
|
endDate: endTimeStore
|
|||
|
|
}, function (start, end, label) {
|
|||
|
|
beginTimeStore = start.format(this.locale.format);
|
|||
|
|
endTimeStore = end.format(this.locale.format);
|
|||
|
|
if (!this.startDate) {
|
|||
|
|
this.element.val('');
|
|||
|
|
} else {
|
|||
|
|
this.element.val(this.startDate.format(this.locale.format) + this.locale.separator + this.endDate.format(this.locale.format));
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
$('#reservationtimeMain').val(beginTimeStore + locale.separator + endTimeStore);
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
|
|||
|
|
function initDate2() {
|
|||
|
|
beginTimeStore2 = moment().subtract(0, 'days').format("YYYY");
|
|||
|
|
$('#reservationtime2').datetimepicker({
|
|||
|
|
startView: 4,//日期时间选择器打开之后首先显示的视图。 可接受的值：0 - 小时 视图，1 - 天 视图，2 - 月 视图，3 - 年 视图，4 - 十年 视图
|
|||
|
|
minView: 4,//Number, String. 默认值：0, ‘hour’，日期时间选择器所能够提供的最精确的时间选择视图
|
|||
|
|
autoclose: true,//当选择一个日期之后是否立即关闭此日期时间选择器
|
|||
|
|
todayBtn: true,//在日期时间选择器组件的底部显示一个 “Today” 按钮用以选择当前日期
|
|||
|
|
format: 'yyyy'//日期显示格式
|
|||
|
|
});
|
|||
|
|
$('#reservationtime2').val(beginTimeStore2);
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
|
|||
|
|
//模糊查询列表中的数据
|
|||
|
|
var dosearch = function () {
|
|||
|
|
$("#table").bootstrapTable('refresh');
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
|
|||
|
|
//展示数据
|
|||
|
|
var dosearch2 = function () {
|
|||
|
|
// console.log($('#reservationtime2').val() + "-01-01")
|
|||
|
|
$.post(ext.contextPath + "/alarm/proAlarmBaseText/getStatisticalData.do", {
|
|||
|
|
unitId: unitId,
|
|||
|
|
statisticalDate: $('#reservationtime2').val() + "-01-01"
|
|||
|
|
}, function (data) {
|
|||
|
|
// console.log(data)
|
|||
|
|
|
|||
|
|
let pieData = [];
|
|||
|
|
|
|||
|
|
let totalNum = 0;
|
|||
|
|
let trueNum = 0;
|
|||
|
|
let falseNum = 0;
|
|||
|
|
|
|||
|
|
for (let i = 0; i < data.length; i++) {
|
|||
|
|
let forData = data[i];
|
|||
|
|
pieData.push({
|
|||
|
|
name: forData.name,
|
|||
|
|
value: forData.totalNum
|
|||
|
|
})
|
|||
|
|
totalNum += forData.totalNum;
|
|||
|
|
trueNum += forData.trueNum;
|
|||
|
|
falseNum += forData.falseNum;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
$('#totalNum').text(totalNum);
|
|||
|
|
$('#trueNum').text(trueNum);
|
|||
|
|
if (totalNum > 0) {
|
|||
|
|
$('#truePercent').text(((trueNum / totalNum) * 100).toFixed(0));
|
|||
|
|
} else {
|
|||
|
|
$('#truePercent').text(0);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
let typeTableHtml = "";
|
|||
|
|
typeTableHtml += "<table style=\"width: 100%;height: 100%;text-align: center;\">";
|
|||
|
|
|
|||
|
|
typeTableHtml += "<tr >";
|
|||
|
|
for (let i = 0; i < data.length; i++) {
|
|||
|
|
let forData = data[i];
|
|||
|
|
typeTableHtml += "<td style='color: #9F9F9F;'>" + forData.name + "<br>采纳次数</td>";
|
|||
|
|
}
|
|||
|
|
typeTableHtml += "</tr>";
|
|||
|
|
typeTableHtml += "<tr >";
|
|||
|
|
for (let i = 0; i < data.length; i++) {
|
|||
|
|
let forData = data[i];
|
|||
|
|
typeTableHtml += "<td style=\"color: " + colors[i] + ";font-size: 30px;\">" + forData.trueNum + "</td>";
|
|||
|
|
}
|
|||
|
|
typeTableHtml += "</tr>";
|
|||
|
|
typeTableHtml += "<tr >";
|
|||
|
|
for (let i = 0; i < data.length; i++) {
|
|||
|
|
// let forData = data[i];
|
|||
|
|
typeTableHtml += "<td style='color: #9F9F9F;'>被采纳率</td>";
|
|||
|
|
}
|
|||
|
|
typeTableHtml += "</tr>";
|
|||
|
|
typeTableHtml += "<tr >";
|
|||
|
|
for (let i = 0; i < data.length; i++) {
|
|||
|
|
let forData = data[i];
|
|||
|
|
if (forData.totalNum > 0) {
|
|||
|
|
typeTableHtml += "<td ><span style='font-size: 30px;'>" + ((forData.trueNum / forData.totalNum) * 100).toFixed(0) + "</span><span style='font-size: 18px;'>%</span></td>";
|
|||
|
|
} else {
|
|||
|
|
typeTableHtml += "<td ><span style='font-size: 30px;'>0</span><span style='font-size: 18px;'>%</span></td>";
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
typeTableHtml += "</tr>";
|
|||
|
|
|
|||
|
|
typeTableHtml += "</table>";
|
|||
|
|
|
|||
|
|
$('#typeTableHtml').html(typeTableHtml);
|
|||
|
|
|
|||
|
|
|
|||
|
|
getPieChart(pieData);
|
|||
|
|
}, 'json');
|
|||
|
|
|
|||
|
|
|
|||
|
|
$.post(ext.contextPath + "/alarm/proAlarmBaseText/getBarData.do", {
|
|||
|
|
unitId: unitId,
|
|||
|
|
statisticalDate: $('#reservationtime2').val() + "-01-01"
|
|||
|
|
}, function (data) {
|
|||
|
|
// console.log(data)
|
|||
|
|
getBarChart(data[0], data[1]);
|
|||
|
|
}, 'json');
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
function getPieChart(data) {
|
|||
|
|
let myChart = echarts.init(document.getElementById("chart1"));
|
|||
|
|
let option = {
|
|||
|
|
color: colors,
|
|||
|
|
tooltip: {
|
|||
|
|
trigger: 'item'
|
|||
|
|
},
|
|||
|
|
legend: {
|
|||
|
|
bottom: '10px'
|
|||
|
|
},
|
|||
|
|
series: [
|
|||
|
|
{
|
|||
|
|
name: '问题占比',
|
|||
|
|
type: 'pie',
|
|||
|
|
radius: '50%',
|
|||
|
|
center: ['50%', '40%'],
|
|||
|
|
data: data,
|
|||
|
|
emphasis: {
|
|||
|
|
itemStyle: {
|
|||
|
|
shadowBlur: 10,
|
|||
|
|
shadowOffsetX: 0,
|
|||
|
|
shadowColor: 'rgba(0, 0, 0, 0.5)'
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
]
|
|||
|
|
};
|
|||
|
|
myChart.setOption(option, true);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function getBarChart(data1, data2) {
|
|||
|
|
let myChart = echarts.init(document.getElementById("chart2"));
|
|||
|
|
let option = {
|
|||
|
|
color: ['#DADADA', '#26B2FF'],
|
|||
|
|
tooltip: {
|
|||
|
|
trigger: 'axis'
|
|||
|
|
},
|
|||
|
|
legend: {
|
|||
|
|
bottom: '10px'
|
|||
|
|
},
|
|||
|
|
grid: {
|
|||
|
|
left: '2%', // 与容器左侧的距离
|
|||
|
|
right: '2%', // 与容器右侧的距离
|
|||
|
|
top: '8%', // 与容器顶部的距离
|
|||
|
|
bottom: '45px', // 与容器底部的距离
|
|||
|
|
containLabel: true
|
|||
|
|
},
|
|||
|
|
xAxis: [
|
|||
|
|
{
|
|||
|
|
type: 'category',
|
|||
|
|
// axisLabel:{
|
|||
|
|
// formatter:'{yyyy}-{MM}'
|
|||
|
|
// }
|
|||
|
|
data: ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12']
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
yAxis: [
|
|||
|
|
{
|
|||
|
|
type: 'value'
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
series: [
|
|||
|
|
{
|
|||
|
|
name: '建议次数',
|
|||
|
|
type: 'bar',
|
|||
|
|
data: data2
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: '被采纳次数',
|
|||
|
|
type: 'bar',
|
|||
|
|
data: data1
|
|||
|
|
}
|
|||
|
|
]
|
|||
|
|
};
|
|||
|
|
console.log(option)
|
|||
|
|
myChart.setOption(option, true);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
</script>
|
|||
|
|
</head>
|
|||
|
|
|
|||
|
|
<body onload="initMenu()" class="hold-transition ${cu.themeclass} sidebar-mini">
|
|||
|
|
<div id="main" style="background-color: #ecf0f5;padding: 5px;">
|
|||
|
|
|
|||
|
|
<div style="float:left;width: 100%;height:calc((100% - 10px)*0.4);background-color: #fff;">
|
|||
|
|
<div style="float:left;width: 30%;height:100%;">
|
|||
|
|
<div style="float:left;width: 100%;height:45px;padding-left: 20px;padding-top: 5px;">
|
|||
|
|
<div class="input-group input-group-sm">
|
|||
|
|
<input type="text" class="form-control pull-left" id="reservationtime2"
|
|||
|
|
style="width:80px">
|
|||
|
|
<div class="input-group-btn" style="float: left;">
|
|||
|
|
<button class="btn btn-default" onclick="dosearch2();"><i class="fa fa-search"></i>
|
|||
|
|
</button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div id="chart1" style="float:left;width: 100%;height:calc(100% - 45px);">
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div style="float:left;width: 30%;height:100%;padding: 10px;">
|
|||
|
|
<div style="float: left;width: 100%;height:33.3%;border-top:1px solid rgba(232, 232, 232, 1);border-bottom:1px solid rgba(232, 232, 232, 1);">
|
|||
|
|
<table style="width: 100%;height: 100%;">
|
|||
|
|
<tr style="text-align: center;">
|
|||
|
|
<td>总建议次数</td>
|
|||
|
|
<td>被采纳次数</td>
|
|||
|
|
<td>被采纳率</td>
|
|||
|
|
</tr>
|
|||
|
|
<tr style="font-size: 40px;font-weight: 700;text-align: center;">
|
|||
|
|
<td id="totalNum" style="color: #D4D4D4;"></td>
|
|||
|
|
<td id="trueNum" style="color: #00A5FF;"></td>
|
|||
|
|
<td style="color: #00A5FF;"><span id="truePercent" style="font-size: 40px;"></span><span
|
|||
|
|
style="font-size: 20px;">%</span></td>
|
|||
|
|
</tr>
|
|||
|
|
</table>
|
|||
|
|
</div>
|
|||
|
|
<div id="typeTableHtml" style="float: left;width: 100%;height:66.6%;">
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div id="chart2" style="float:left;width: 40%;height:100%;"></div>
|
|||
|
|
</div>
|
|||
|
|
<div style="float:left;width: 100%;height:10px;">
|
|||
|
|
</div>
|
|||
|
|
<div style="float:left;width: 100%;height:calc((100% - 10px)*0.6);">
|
|||
|
|
<div id="mainAlertdiv"></div>
|
|||
|
|
<div id="subDiv"></div>
|
|||
|
|
<div id="user4SelectDiv"></div>
|
|||
|
|
|
|||
|
|
<div class="form-group form-inline" style="padding:0;height: 15px;">
|
|||
|
|
<div class="form-group pull-left">
|
|||
|
|
<div class="input-group input-group-sm">
|
|||
|
|
<input type="text" class="form-control pull-left" id="reservationtimeMain"
|
|||
|
|
style="width:230px">
|
|||
|
|
<div class="input-group-btn">
|
|||
|
|
<button class="btn btn-default" onclick="dosearch();"><i class="fa fa-search"></i>
|
|||
|
|
</button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="input-group input-group-sm " style="width: 240px;">
|
|||
|
|
<label class="col-sm-4 control-label"
|
|||
|
|
style="padding:0px 10px 0px 10px;line-height:30px;">诊断类型</label>
|
|||
|
|
<div class="col-sm-8 control-label" style="padding: 0px;">
|
|||
|
|
<select class="form-control select2 " id="zdType" name="zdType"
|
|||
|
|
style="width: 130px;height: 30px;"></select>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="input-group input-group-sm " style="width: 240px;">
|
|||
|
|
<label class="col-sm-4 control-label"
|
|||
|
|
style="padding:0px 10px 0px 10px;line-height:30px;">状态</label>
|
|||
|
|
<div class="col-sm-8 control-label" style="padding: 0px;">
|
|||
|
|
<select class="form-control select2 " id="adoptSt" name="adoptSt"
|
|||
|
|
style="width: 130px;height: 30px;"></select>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
<br>
|
|||
|
|
<table id="table"></table>
|
|||
|
|
</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>
|