471 lines
24 KiB
Plaintext
471 lines
24 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>
|
||
|
|
|
||
|
|
<%-- mqtt依赖--%>
|
||
|
|
<script src="<%=request.getContextPath()%>/JS/mqtt/mqtt.min.js" type="text/javascript"></script>
|
||
|
|
<%-- mqtt事件--%>
|
||
|
|
<jsp:include page="/jsp/mqtt/alarm_mqtt.jsp"></jsp:include>
|
||
|
|
|
||
|
|
|
||
|
|
<style type="text/css">
|
||
|
|
</style>
|
||
|
|
<script type="text/javascript">
|
||
|
|
|
||
|
|
var client;
|
||
|
|
var regionID = '${param.regionID}';
|
||
|
|
var processsection = "";
|
||
|
|
|
||
|
|
$(function () {
|
||
|
|
let mqttStatus = '${mqttStatus}';
|
||
|
|
let mqttHostWeb = '${mqttHostWeb}';
|
||
|
|
getMqtt(mqttStatus, mqttHostWeb);
|
||
|
|
})
|
||
|
|
|
||
|
|
function getMqtt(mqttStatus, mqttHostWeb) {
|
||
|
|
try {
|
||
|
|
//初始化mqtt
|
||
|
|
if (mqttStatus == "0") {
|
||
|
|
let mqttId = "dataVisualData_hqfy_" + regionID + "_" + Math.random();
|
||
|
|
initialMqtt(mqttId, mqttHostWeb);
|
||
|
|
} else {
|
||
|
|
console.log('mq已关闭')
|
||
|
|
}
|
||
|
|
} catch (err) {
|
||
|
|
//处理错误
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
function initialMqtt(mqttId, mqttHostWeb) {
|
||
|
|
const options = {
|
||
|
|
clean: true,
|
||
|
|
// cleanSession : false,
|
||
|
|
// reconnect : true,
|
||
|
|
connectTimeout: 10000,
|
||
|
|
clientId: mqttId,
|
||
|
|
username: "admin",
|
||
|
|
password: 'public'
|
||
|
|
}
|
||
|
|
const connectUrl = mqttHostWeb;
|
||
|
|
client = mqtt.connect(connectUrl, options);
|
||
|
|
|
||
|
|
//当重新连接启动触发回调
|
||
|
|
client.on('reconnect', function () {
|
||
|
|
// console.log('正在重连.....');
|
||
|
|
});
|
||
|
|
//连接断开后触发的回调
|
||
|
|
client.on("close", function () {
|
||
|
|
console.log('客户端已断开连接.....');
|
||
|
|
});
|
||
|
|
//从broker接收到断开连接的数据包后发出。MQTT 5.0特性
|
||
|
|
client.on("disconnect", function (packet) {
|
||
|
|
console.log('从broker接收到断开连接的数据包.....' + packet);
|
||
|
|
});
|
||
|
|
//客户端脱机下线触发回调
|
||
|
|
client.on("offline", function () {
|
||
|
|
console.log('客户端脱机下线.....');
|
||
|
|
});
|
||
|
|
//当客户端无法连接或出现错误时触发回调
|
||
|
|
client.on("error", (error) => {
|
||
|
|
console.log('客户端出现错误.....' + error);
|
||
|
|
});
|
||
|
|
//当客户端发送任何数据包时发出。这包括published()包以及MQTT用于管理订阅和连接的包
|
||
|
|
client.on("packetsend", (packet) => {
|
||
|
|
// console.log('客户端已发出数据包：' + packet);
|
||
|
|
});
|
||
|
|
//当客户端接收到任何数据包时发出。这包括来自订阅主题的信息包以及MQTT用于管理订阅和连接的信息包
|
||
|
|
client.on("packetreceive", (packet) => {
|
||
|
|
// console.log('收到：' + packet);
|
||
|
|
});
|
||
|
|
|
||
|
|
//成功连接后触发的回调
|
||
|
|
client.on("connect", function (connack) {
|
||
|
|
// layer.msg('成功连接上mq服务器');
|
||
|
|
console.log('虹桥分页' + regionID + '成功连接上mqtt服务器');
|
||
|
|
//订阅某主题
|
||
|
|
/**
|
||
|
|
* client.subscribe(topic/topic array/topic object, [options], [callback])
|
||
|
|
* topic:一个string类型的topic或者一个topic数组,也可以是一个对象
|
||
|
|
* options
|
||
|
|
*/
|
||
|
|
let auto_mq_theme_in = ['dataVisualData_hqfy_' + regionID, 'dataVisualData_hqfy_alarm_' + regionID];
|
||
|
|
client.subscribe(auto_mq_theme_in, {qos: 2});
|
||
|
|
//每隔2秒发布一次数据
|
||
|
|
// setInterval(publish, 2000)
|
||
|
|
});
|
||
|
|
|
||
|
|
function publish() {
|
||
|
|
//发布数据
|
||
|
|
/**
|
||
|
|
* client.publish(topic,message,[options], [callback])
|
||
|
|
*
|
||
|
|
* message: Buffer or String
|
||
|
|
* options:{
|
||
|
|
* qos:0, //默认0
|
||
|
|
* retain:false, //默认false
|
||
|
|
* dup:false, //默认false
|
||
|
|
* properties:{}
|
||
|
|
* }
|
||
|
|
* callback:function (err){}
|
||
|
|
*/
|
||
|
|
const message = "h5 message " + Math.random() + new Date();
|
||
|
|
client.publish("testtopic/123", message, {qos: 2});
|
||
|
|
}
|
||
|
|
|
||
|
|
//当客户端接收到发布消息时触发回调
|
||
|
|
/**
|
||
|
|
* topic:收到的数据包的topic
|
||
|
|
* message:收到的数据包的负载playload
|
||
|
|
* packet:收到的数据包
|
||
|
|
*/
|
||
|
|
client.on('message', (topic, message, packet) => {
|
||
|
|
// console.log(message.getpay);
|
||
|
|
// console.log(topic)
|
||
|
|
if (topic == 'dataVisualData_hqfy_' + regionID) {
|
||
|
|
let json = JSON.parse(message.toString());
|
||
|
|
// console.log(json);
|
||
|
|
if (json.currentAlarmNum != null) {
|
||
|
|
$("#currentAlarmNum").text(json.currentAlarmNum);
|
||
|
|
}
|
||
|
|
if (json.todayAlarmNum != null) {
|
||
|
|
$("#todayAlarmNum").text(json.todayAlarmNum);
|
||
|
|
}
|
||
|
|
if (json.monthAlarmNum != null) {
|
||
|
|
$("#monthAlarmNum").text(json.monthAlarmNum);
|
||
|
|
}
|
||
|
|
if (json.now_people != null) {
|
||
|
|
$("#now_people").text(json.now_people);
|
||
|
|
}
|
||
|
|
if (json.today_in_people != null) {
|
||
|
|
$("#today_in_people").text(json.today_in_people);
|
||
|
|
}
|
||
|
|
if (json.AI_Camera != null) {
|
||
|
|
$("#AI_Camera").text(json.AI_Camera);
|
||
|
|
}
|
||
|
|
if (json.All_Camera != null) {
|
||
|
|
$("#All_Camera").text(json.All_Camera);
|
||
|
|
}
|
||
|
|
if (json.month_toBeExecuted != null) {
|
||
|
|
$("#month_toBeExecuted").text(json.month_toBeExecuted);
|
||
|
|
}
|
||
|
|
if (json.month_completed != null) {
|
||
|
|
$("#month_completed").text(json.month_completed);
|
||
|
|
}
|
||
|
|
|
||
|
|
processsection = json.processsection;
|
||
|
|
|
||
|
|
let table_people_Html = "";
|
||
|
|
if (json.table_people != null) {
|
||
|
|
for (let i = 0; i < json.table_people.length; i++) {
|
||
|
|
let content = json.table_people[i];
|
||
|
|
let stateStyle = "";
|
||
|
|
if (content.state == '区域内') {
|
||
|
|
stateStyle = "background-color:#00F6FF;color:#000000;";
|
||
|
|
}
|
||
|
|
table_people_Html += "<div style=\"float: left;width: 100%;height: 38px;line-height: 38px;text-align: center;color: #bfbfbf;padding-top: 1px;padding-bottom: 1px;" + stateStyle + "\">";
|
||
|
|
table_people_Html += "<div style=\"float: left;width: 20%;height: 100%;white-space:nowrap;text-overflow: ellipsis;overflow: hidden;\">" + content.personName + "</div>";
|
||
|
|
table_people_Html += "<div style=\"float: left;width: 20%;height: 100%;white-space:nowrap;text-overflow: ellipsis;overflow: hidden;\">" + content.jobText + "</div>";
|
||
|
|
table_people_Html += "<div style=\"float: left;width: 20%;height: 100%;white-space:nowrap;text-overflow: ellipsis;overflow: hidden;\">" + content.intime + "</div>";
|
||
|
|
table_people_Html += "<div style=\"float: left;width: 20%;height: 100%;white-space:nowrap;text-overflow: ellipsis;overflow: hidden;\">" + content.durationText + "</div>";
|
||
|
|
table_people_Html += "<div style=\"float: left;width: 20%;height: 100%;white-space:nowrap;text-overflow: ellipsis;overflow: hidden;\">" + content.state + "</div>";
|
||
|
|
table_people_Html += "</div>";
|
||
|
|
}
|
||
|
|
}
|
||
|
|
$('#table_people').html(table_people_Html);
|
||
|
|
|
||
|
|
let table_camera_Html = "";
|
||
|
|
if (json.table_camera != null) {
|
||
|
|
for (let i = 0; i < json.table_camera.length; i++) {
|
||
|
|
let content = json.table_camera[i];
|
||
|
|
table_camera_Html += "<div style=\"float: left;width: 100%;height: 38px;line-height: 38px;text-align: center;color: #bfbfbf;padding-top: 1px;padding-bottom: 1px;\">";
|
||
|
|
table_camera_Html += "<div style=\"float: left;width: 35%;height: 100%;white-space:nowrap;text-overflow: ellipsis;overflow: hidden;\">" + content.name + "</div>";
|
||
|
|
table_camera_Html += "<div style=\"float: left;width: 65%;height: 100%;white-space:nowrap;text-overflow: ellipsis;overflow: hidden;\">" + content.modelNames + "</div>";
|
||
|
|
table_camera_Html += "</div>";
|
||
|
|
}
|
||
|
|
}
|
||
|
|
$('#table_camera').html(table_camera_Html);
|
||
|
|
|
||
|
|
let table_task_Html = "";
|
||
|
|
if (json.table_task != null) {
|
||
|
|
for (let i = 0; i < json.table_task.length; i++) {
|
||
|
|
let content = json.table_task[i];
|
||
|
|
table_task_Html += "<div style=\"float: left;width: 100%;height: 38px;line-height: 38px;text-align: center;color: #bfbfbf;padding-top: 1px;padding-bottom: 1px;\">";
|
||
|
|
table_task_Html += "<div style=\"float: left;width: 30%;height: 100%;white-space:nowrap;text-overflow: ellipsis;overflow: hidden;\">" + content.name + "</div>";
|
||
|
|
table_task_Html += "<div style=\"float: left;width: 30%;height: 100%;white-space:nowrap;text-overflow: ellipsis;overflow: hidden;\">" + content.type + "</div>";
|
||
|
|
table_task_Html += "<div style=\"float: left;width: 15%;height: 100%;white-space:nowrap;text-overflow: ellipsis;overflow: hidden;\">" + content.status + "</div>";
|
||
|
|
table_task_Html += "<div style=\"float: left;width: 25%;height: 100%;white-space:nowrap;text-overflow: ellipsis;overflow: hidden;\">" + content.endTime + "</div>";
|
||
|
|
table_task_Html += "</div>";
|
||
|
|
}
|
||
|
|
}
|
||
|
|
$('#table_task').html(table_task_Html);
|
||
|
|
|
||
|
|
} else if (topic == 'dataVisualData_hqfy_alarm_' + regionID) {
|
||
|
|
let json = JSON.parse(message.toString());
|
||
|
|
// console.log(json);
|
||
|
|
if (json.A_AlarmNum != null) {
|
||
|
|
$("#A_AlarmNum").text(json.A_AlarmNum);
|
||
|
|
}
|
||
|
|
if (json.B_AlarmNum != null) {
|
||
|
|
$("#B_AlarmNum").text(json.B_AlarmNum);
|
||
|
|
}
|
||
|
|
if (json.C_AlarmNum != null) {
|
||
|
|
$("#C_AlarmNum").text(json.C_AlarmNum);
|
||
|
|
}
|
||
|
|
if (json.D_AlarmNum != null) {
|
||
|
|
$("#D_AlarmNum").text(json.D_AlarmNum);
|
||
|
|
}
|
||
|
|
|
||
|
|
let table_alarm_Html = "";
|
||
|
|
if (json.table_alarm != null) {
|
||
|
|
for (let i = 0; i < json.table_alarm.length; i++) {
|
||
|
|
let content = json.table_alarm[i];
|
||
|
|
table_alarm_Html += "<div style=\"float: left;width: 100%;height: 38px;line-height: 38px;text-align: center;color: #bfbfbf;padding-top: 1px;padding-bottom: 1px;\">";
|
||
|
|
table_alarm_Html += "<div style=\"float: left;width: 120px;height: 100%;\">" + content.time + "</div>";
|
||
|
|
table_alarm_Html += "<div title='" + content.content + "' style=\"float: left;width: calc(100% - 200px);height: 100%;white-space:nowrap;text-overflow: ellipsis;overflow: hidden;\">" + content.content + "</div>";
|
||
|
|
let levelColorStyle = "";
|
||
|
|
if (content.level == 'A') {
|
||
|
|
levelColorStyle = "background-color:#FF0000;color:#000000;";
|
||
|
|
} else if (content.level == 'B') {
|
||
|
|
levelColorStyle = "background-color:#FFC000;color:#000000;";
|
||
|
|
} else if (content.level == 'C') {
|
||
|
|
levelColorStyle = "background-color:#FFFF00;color:#000000;";
|
||
|
|
} else if (content.level == 'D') {
|
||
|
|
levelColorStyle = "background-color:#00B0F0;color:#000000;";
|
||
|
|
}
|
||
|
|
table_alarm_Html += "<div style=\"float: left;width: 80px;height: 100%;" + levelColorStyle + "\">" + content.level + "</div>";
|
||
|
|
table_alarm_Html += "</div>";
|
||
|
|
}
|
||
|
|
}
|
||
|
|
$('#table_alarm').html(table_alarm_Html);
|
||
|
|
}
|
||
|
|
|
||
|
|
});
|
||
|
|
|
||
|
|
//页面离开自动断开连接
|
||
|
|
$(window).bind("beforeunload", () => {
|
||
|
|
// console.log("客户端窗口关闭,断开连接");
|
||
|
|
client.disconnect();
|
||
|
|
})
|
||
|
|
}
|
||
|
|
|
||
|
|
function openTab(ID, name, url) {
|
||
|
|
if (ID == "HQ_Open_FY_1") {
|
||
|
|
url = url + "?selectId=" + regionID;
|
||
|
|
} else if (ID == "HQ_Open_FY_2") {
|
||
|
|
url = url + "?selectId=" + regionID;
|
||
|
|
} else if (ID == "HQ_Open_FY_3") {
|
||
|
|
url = url + "?selectId=" + processsection;
|
||
|
|
}
|
||
|
|
window.parent.parent.addTab("" + ID + "", "" + name + "", "" + url + "");
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
</script>
|
||
|
|
|
||
|
|
</head>
|
||
|
|
<body onload="initMenu()" class="hold-transition ${cu.themeclass} sidebar-mini">
|
||
|
|
|
||
|
|
<div id="main" style="background-color: #000000;width: 1920px;height: 410px;">
|
||
|
|
<div style="float:left;width: 5%;height: 100%;border-right: 2px solid #707070;padding: 20px 10px 20px 10px;">
|
||
|
|
<table style="width: 100%;height: 100%;text-align: center;">
|
||
|
|
<tr>
|
||
|
|
<td style="height: 13.3%;color:#FFFFFF;font-weight: 700;">当前报警</td>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<td id="currentAlarmNum" style="height: 20%;color:#00f6ff;font-size: 36px;font-weight: 700;"></td>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<td style="height: 13.3%;color:#FFFFFF;font-weight: 700;">今日报警</td>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<td id="todayAlarmNum" style="height: 20%;color:#00f6ff;font-size: 36px;font-weight: 700;"></td>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<td style="height: 13.3%;color:#FFFFFF;font-weight: 700;">本月报警</td>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<td id="monthAlarmNum" style="height: 20%;color:#00f6ff;font-size: 36px;font-weight: 700;"></td>
|
||
|
|
</tr>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
<div style="float:left;width: 25%;height: 100%;border-right: 2px solid #707070;">
|
||
|
|
<div style="float: left;width: 100%;height: 30px;color:#FFFFFF;font-weight: 700;line-height: 40px;padding-left: 15px;">
|
||
|
|
当前风险数量
|
||
|
|
</div>
|
||
|
|
<div style="float: left;width: 100%;height: 100px;padding-left: 20px;padding-right: 20px;">
|
||
|
|
<table style="width: 100%;height: 100%;text-align: center;">
|
||
|
|
<tr style="height: 30%;color:#FFFFFF;font-weight: 700;">
|
||
|
|
<td style="">A类风险</td>
|
||
|
|
<td style="">B类风险</td>
|
||
|
|
<td style="">C类风险</td>
|
||
|
|
<td style="">D类风险</td>
|
||
|
|
</tr>
|
||
|
|
<tr style="height: 30%;color:#00f6ff;font-size: 36px;font-weight: 700;">
|
||
|
|
<td id="A_AlarmNum" style=""></td>
|
||
|
|
<td id="B_AlarmNum" style=""></td>
|
||
|
|
<td id="C_AlarmNum" style=""></td>
|
||
|
|
<td id="D_AlarmNum" style=""></td>
|
||
|
|
</tr>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
<div style="float: left;width: 100%;height: 230px;padding-left: 20px;padding-right: 20px;">
|
||
|
|
<div style="float: left;width: 100%;height: 38px;line-height: 38px;font-weight: 700;text-align: center;color: #bfbfbf;border-bottom: 1px solid #707070;">
|
||
|
|
<div style="float: left;width: 120px;height: 100%;">
|
||
|
|
时间
|
||
|
|
</div>
|
||
|
|
<div style="float: left;width: calc(100% - 200px);height: 100%;">
|
||
|
|
报警内容
|
||
|
|
</div>
|
||
|
|
<div style="float: left;width: 80px;height: 100%;">
|
||
|
|
风险等级
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div id="table_alarm">
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div style="float: left;width: 100%;height: 40px;">
|
||
|
|
<div onclick="openTab('HQ_Open_FY_1','风险诊断记录','hqconfig/hqAlarmRecord/showList.do');"
|
||
|
|
style="float: right;cursor:pointer;width: 80px;height: 30px;margin-top: 5px;margin-right: 20px;background: #434343;border: 1px solid #707070;border-radius: 4px;text-align: center;line-height: 30px;color: #bfbfbf;">
|
||
|
|
查看详细
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
<div style="float:left;width: 25%;height: 100%;border-right: 2px solid #707070;">
|
||
|
|
<div style="float: left;width: 100%;height: 30px;color:#FFFFFF;font-weight: 700;line-height: 40px;padding-left: 15px;">
|
||
|
|
</div>
|
||
|
|
<div style="float: left;width: 100%;height: 100px;">
|
||
|
|
<table style="width: 100%;height: 100%;text-align: center;">
|
||
|
|
<tr style="height: 30%;color:#FFFFFF;font-weight: 700;">
|
||
|
|
<td style="">当前人员数</td>
|
||
|
|
<td style="">今日进入</td>
|
||
|
|
</tr>
|
||
|
|
<tr style="height: 30%;color:#00f6ff;font-size: 36px;font-weight: 700;">
|
||
|
|
<td id="now_people" style=""></td>
|
||
|
|
<td id="today_in_people" style=""></td>
|
||
|
|
</tr>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
<div style="float: left;width: 100%;height: 230px;padding-left: 20px;padding-right: 20px;">
|
||
|
|
<div style="float: left;width: 100%;height: 38px;line-height: 38px;font-weight: 700;text-align: center;color: #bfbfbf;border-bottom: 1px solid #707070;">
|
||
|
|
<div style="float: left;width: 20%;height: 100%;">
|
||
|
|
姓名
|
||
|
|
</div>
|
||
|
|
<div style="float: left;width: 20%;height: 100%;">
|
||
|
|
部门
|
||
|
|
</div>
|
||
|
|
<div style="float: left;width: 20%;height: 100%;">
|
||
|
|
进入时间
|
||
|
|
</div>
|
||
|
|
<div style="float: left;width: 20%;height: 100%;">
|
||
|
|
逗留时长
|
||
|
|
</div>
|
||
|
|
<div style="float: left;width: 20%;height: 100%;">
|
||
|
|
当前状态
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div id="table_people"></div>
|
||
|
|
</div>
|
||
|
|
<div onclick="openTab('HQ_Open_FY_2','区域进入记录','hqconfig/enterRecord/showList.do');"
|
||
|
|
style="float: left;width: 100%;height: 40px;">
|
||
|
|
<div style="float: right;cursor:pointer;width: 80px;height: 30px;margin-top: 5px;margin-right: 20px;background: #434343;border: 1px solid #707070;border-radius: 4px;text-align: center;line-height: 30px;color: #bfbfbf;">
|
||
|
|
查看详细
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div style="float:left;width: 20%;height: 100%;border-right: 2px solid #707070;">
|
||
|
|
<div style="float: left;width: 100%;height: 30px;color:#FFFFFF;font-weight: 700;line-height: 40px;padding-left: 15px;">
|
||
|
|
</div>
|
||
|
|
<div style="float: left;width: 100%;height: 100px;">
|
||
|
|
<table style="width: 100%;height: 100%;text-align: center;">
|
||
|
|
<tr style="height: 30%;color:#FFFFFF;font-weight: 700;">
|
||
|
|
<td style="">AI摄像头</td>
|
||
|
|
<td style="">摄像头</td>
|
||
|
|
</tr>
|
||
|
|
<tr style="height: 30%;color:#00f6ff;font-size: 36px;font-weight: 700;">
|
||
|
|
<td id="AI_Camera" style=""></td>
|
||
|
|
<td id="All_Camera" style=""></td>
|
||
|
|
</tr>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
<div style="float: left;width: 100%;height: 230px;padding-left: 20px;padding-right: 20px;">
|
||
|
|
<div style="float: left;width: 100%;height: 38px;line-height: 38px;font-weight: 700;text-align: center;color: #bfbfbf;border-bottom: 1px solid #707070;">
|
||
|
|
<div style="float: left;width: 35%;height: 100%;">
|
||
|
|
AI摄像头名称
|
||
|
|
</div>
|
||
|
|
<div style="float: left;width: 65%;height: 100%;">
|
||
|
|
算法名
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div id="table_camera"></div>
|
||
|
|
</div>
|
||
|
|
<div onclick="openTab('HQ_Open_FY_3','视频配置','work/camera/showList.do');"
|
||
|
|
style="float: left;width: 100%;height: 40px;">
|
||
|
|
<div style="float: right;cursor:pointer;width: 80px;height: 30px;margin-top: 5px;margin-right: 20px;background: #434343;border: 1px solid #707070;border-radius: 4px;text-align: center;line-height: 30px;color: #bfbfbf;">
|
||
|
|
查看详细
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div style="float:left;width: 25%;height: 100%;">
|
||
|
|
<div style="float: left;width: 100%;height: 30px;color:#FFFFFF;font-weight: 700;line-height: 40px;padding-left: 15px;">
|
||
|
|
</div>
|
||
|
|
<div style="float: left;width: 100%;height: 100px;">
|
||
|
|
<table style="width: 100%;height: 100%;text-align: center;">
|
||
|
|
<tr style="height: 30%;color:#FFFFFF;font-weight: 700;">
|
||
|
|
<td style="">本月待执行</td>
|
||
|
|
<td style="">本月已完成</td>
|
||
|
|
</tr>
|
||
|
|
<tr style="height: 30%;color:#00f6ff;font-size: 36px;font-weight: 700;">
|
||
|
|
<td id="month_toBeExecuted" style=""></td>
|
||
|
|
<td id="month_completed" style=""></td>
|
||
|
|
</tr>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
<div style="float: left;width: 100%;height: 230px;padding-left: 20px;padding-right: 20px;">
|
||
|
|
<div style="float: left;width: 100%;height: 38px;line-height: 38px;font-weight: 700;text-align: center;color: #bfbfbf;border-bottom: 1px solid #707070;">
|
||
|
|
<div style="float: left;width: 30%;height: 100%;">
|
||
|
|
任务名称
|
||
|
|
</div>
|
||
|
|
<div style="float: left;width: 30%;height: 100%;">
|
||
|
|
任务类型
|
||
|
|
</div>
|
||
|
|
<div style="float: left;width: 15%;height: 100%;">
|
||
|
|
状态
|
||
|
|
</div>
|
||
|
|
<div style="float: left;width: 25%;height: 100%;">
|
||
|
|
截止时间
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div id="table_task"></div>
|
||
|
|
</div>
|
||
|
|
<div style="float: left;width: 100%;height: 40px;">
|
||
|
|
<div onclick="openTab('HQ_Open_FY_4','安全任务记录','timeEfficiency/patrolRecord/showList4Safe.do');"
|
||
|
|
style="float: right;cursor:pointer;width: 80px;height: 30px;margin-top: 5px;margin-right: 20px;background: #434343;border: 1px solid #707070;border-radius: 4px;text-align: center;line-height: 30px;color: #bfbfbf;">
|
||
|
|
查看详细
|
||
|
|
</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>
|