<!DOCTYPE html>
|
<html lang="zh-cn">
|
|
<head>
|
<meta charset="UTF-8">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
<title>设备看板</title>
|
<link rel="stylesheet" type="text/css" href="css/index.css">
|
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
|
<link rel="stylesheet" type="text/css" href="css/bootstrap-table.min.css">
|
<link rel="stylesheet" type="text/css" href="css/index.css">
|
<link rel="stylesheet" type="text/css" href="css/Style.css">
|
<script src="js/jquery.min.js"></script>
|
<script src='js/echarts.min.js'></script>
|
<script src="js/bootstrap.min.js"></script>
|
<script src='js/bootstrap-table.min.js'></script>
|
<script src='js/bootstrap-table-zh-CN.min.js'></script>
|
<script src="js/jquery.SuperSlide.2.1.3.js"></script>
|
|
<style>
|
html {
|
background: #000000 url(img/bg_1.png) no-repeat !important;
|
background-size: cover;
|
width: 100%;
|
height: 100%;
|
}
|
|
body {
|
padding: 0;
|
}
|
|
.clock {
|
width: 450px;
|
float: left;
|
color: #fff;
|
margin-top: 65px;
|
margin-right: 5px;
|
margin-bottom: 20px;
|
color: #09d1ea;
|
}
|
|
.clock #Date {
|
font-family: 'BebasNeueRegular', Arial, Helvetica, sans-serif;
|
font-size: 20px;
|
text-align: center;
|
text-shadow: 0 0 0px #00c6ff;
|
float: left;
|
margin-right: 20px
|
}
|
|
.clock ul {
|
width: 450px;
|
margin: 0 auto;
|
padding: 0px;
|
list-style: none;
|
text-align: left;
|
margin-left: 0px;
|
}
|
|
.clock ul li {
|
display: inline;
|
font-size: 20px;
|
text-align: left;
|
font-family: 'BebasNeueRegular', Arial, Helvetica, sans-serif;
|
text-shadow: 0 0 0px #00c6ff;
|
}
|
|
.bg_header {
|
width: 100%;
|
height: 90px;
|
background: url(img/title_11.png) no-repeat;
|
background-size: 100% 100%;
|
}
|
|
.t_title {
|
width: 100%;
|
height: 100%;
|
text-align: center;
|
font-size: 3em;
|
line-height: 77px;
|
color: #09d1ea;
|
/*letter-spacing;*/
|
}
|
|
.flex {
|
display: flex;
|
display: -webkit-flex;
|
justify-content: space-between;
|
flex-direction: row;
|
flex-wrap: wrap;
|
}
|
|
.flex .flex_item {
|
width: 16%;
|
cursor: pointer;
|
margin-top: 20px;
|
margin-bottom: 20px;
|
height: 171px;
|
background-color: rgba(8, 14, 45, 0.3);
|
border-radius: 5px;
|
}
|
|
.flex_div {
|
width: 100%;
|
display: inline-block;
|
margin-right: 1%;
|
height: 208px;
|
}
|
|
.flex_div:nth-child(4n) {
|
margin-right: 0
|
}
|
|
.flex_div p {
|
text-align: left;
|
|
}
|
|
.flex_title {
|
color: #09d1ea;
|
margin-bottom: 24px;
|
display: inline-block;
|
width: 24%;
|
text-align: left;
|
}
|
|
.div_in_color_true {
|
background-color: #0e1421;
|
color: #09d1ea;
|
border-radius: 8px;
|
}
|
|
.div_in_color_false {
|
background-color: #0e1421;
|
color: #c83559;
|
border-radius: 8px;
|
}
|
|
.div_in img {
|
display: inline-block;
|
vertical-align: top;
|
margin-top: 13px;
|
}
|
|
.div_in .div_nr {
|
display: inline-block;
|
vertical-align: top;
|
|
}
|
|
.w40 {
|
width: 40%;
|
}
|
|
.w59 {
|
width: 58%;
|
}
|
|
.widget-title {
|
margin-bottom: 24px;
|
margin-top: 24px;
|
}
|
|
.widget-title span {
|
color: #09d1ea;
|
font-size: 18px;
|
}
|
|
.list_style {
|
border: 3px solid #080c1c;
|
border-radius: 5px;
|
height: 630px;
|
width: 15%;
|
overflow: hidden;
|
background-color: rgba(8, 14, 45, 0.3);
|
padding: 5px 20px 10px 20px;
|
}
|
|
.list_style li {
|
margin-bottom: 21px;
|
}
|
|
.wa {
|
width: auto;
|
padding-top: 15px;
|
width: 62%;
|
}
|
|
.f18 {
|
font-size: 18px;
|
}
|
|
.f13 {
|
font-size: 13px;
|
color: #55555e
|
}
|
|
.f15 {
|
font-size: 15px;
|
height: 21px;
|
}
|
|
.m18 {
|
margin-bottom: 17px;
|
}
|
|
.m8 {
|
margin-bottom: 5px;
|
}
|
|
.w2 li {
|
margin-bottom: 0px;
|
}
|
|
.w1 {
|
width: 15%;
|
}
|
|
.w2 {
|
width: 68%;
|
margin-left: 1%;
|
margin-right: 1%;
|
|
}
|
|
.w2 .li_style {
|
margin-right: 16px;
|
margin-bottom: 21px;
|
display: inline-block;
|
width: 18.95%;
|
}
|
|
.w2 .li_style:nth-child(5n) {
|
margin-right: 0;
|
}
|
|
/* .w2 li{
|
margin-right: 16px;
|
margin-bottom: 21px;
|
} */
|
.w3 {
|
width: 15%;
|
}
|
|
.color_border1 {
|
border: 6px solid #3f4851;
|
}
|
|
.color_border2 {
|
border: 6px solid #09d1ea;
|
}
|
|
.color_border3 {
|
border: 6px solid #c83559;
|
}
|
|
.change_color {
|
color: #09d1ea
|
}
|
|
.gj_icon {
|
|
border-radius: 5px;
|
width: 1px;
|
height: 1px;
|
display: inline-block;
|
vertical-align: 0px;
|
margin-right: 14px;
|
}
|
|
.title_p {
|
text-align: left;
|
}
|
|
.li_style {
|
height: 100px;
|
border-radius: 3px;
|
background: #0c0c18;
|
color: #55555e;
|
}
|
|
.li_style {
|
padding: 10px 5px;
|
}
|
|
.li_style p {
|
width: 155px;
|
text-align: left;
|
font-size: 14px;
|
word-break:break-all;
|
overflow: hidden;
|
text-overflow:ellipsis;
|
white-space: nowrap;
|
}
|
|
.li_style div {
|
display: inline-block;
|
vertical-align: top;
|
width: 71.3%;
|
}
|
|
.w2 .li_style :nth-child(5n) {
|
margin-right: 0;
|
}
|
|
.img_style {
|
vertical-align: top;
|
margin-right: 10px;
|
width: 24%;
|
display: inline-block;
|
}
|
|
.mb {
|
margin-bottom: 0;
|
}
|
|
.li_style div p .span_icon {
|
width: 8px;
|
height: 8px;
|
display: inline-block;
|
border-radius: 5px;
|
}
|
|
.span_icon1 {
|
border: 2px #028903 solid;
|
margin-right: 20px
|
}
|
|
.span_icon2 {
|
border: 2px #5a5a60 solid;
|
}
|
|
.span_icon3 {
|
border: 2px #5a5a60 solid;
|
margin-right: 20px
|
}
|
|
.span_icon4 {
|
border: 2px #028903 solid;
|
}
|
.span_icon5 {
|
border: 2px #ba8921 solid;
|
}
|
.span_icon6 {
|
border: 2px #ba8921 solid;
|
}
|
.change_color {
|
color: #09d1ea
|
}
|
|
.change_color1 {
|
color: #c83559
|
}
|
|
.hidden {
|
display: none;
|
}
|
|
ul {
|
overflow: hidden;
|
position: relative;
|
}
|
|
.ml {
|
margin-right: 10px;
|
display: inline-block;
|
}
|
|
.picScroll-top {
|
overflow: hidden;
|
height: 208px;
|
width: 24%;
|
}
|
|
</style>
|
<script type="text/javascript">
|
var flags=true;
|
var time =50;
|
var dateV = [];
|
var interval0;//计时器
|
var interval;//计时器
|
|
$(document).ready(function () {
|
|
// 创建两个变量，一个数组中的月和日的名称
|
var monthNames = ["1 月", "2 月", "3 月", "4 月", "5 月", "6 月", "7 月", "8 月", "9 月", "10 月", "11 月", "12 月"];
|
setInterval(function () {
|
$.ajax({
|
url: 'http://172.16.72.3:86/DaLian/DateTime',
|
dataType: "JSON",
|
type: "POST",
|
success: function (data) {
|
$('#Date').html(data[0].FULLYEAR + " 年" + " " + monthNames[data[0].FULLMONTH - 1] + ' ' + data[0].FULLDATE + " 日 " + ' ' + data[0].FULLXQ);
|
$("#sec").html(data[0].FULLSECONDS);
|
$("#min").html(data[0].FULLMINUTES);
|
$("#hours").html(data[0].FULLHOURS);
|
year = data[0].FULLSECONDS;
|
},
|
error: function (data) {
|
|
}
|
})
|
}, 1000);
|
});
|
$(function () {
|
var num =0;
|
|
AnDeng();
|
resresh();
|
//Load2();
|
// 定时器
|
interval0 = setInterval(function () {
|
AnDeng();
|
//Load2();
|
$(".picScroll-top").slide({ mainCell: ".bd ul", effect: "topLoop", autoPlay: true, vis: 2, opp: false,mouseOverStop: false });
|
}, 10000);
|
interval = setInterval(function () {
|
|
resresh();
|
num+=1
|
if(num >=20){
|
window.location.reload()
|
}
|
}, 300000);
|
$(".picScroll-top").slide({ mainCell: ".bd ul", effect: "topLoop", autoPlay: true, vis: 2, opp: false,mouseOverStop: false });
|
});
|
function AnDeng() {
|
$.ajax({
|
url: 'http://172.16.72.3:86/DaLian/AnDengDate',
|
async: false,//使用同步的方式,true为异步方式
|
dataType: "JSON",
|
type: "POST",
|
success: function (data) {
|
//console.info(data);
|
//如果为空就默认值
|
var nullData = {
|
Device_id: '',
|
Device_people: '',
|
Device_calltime: '',
|
Device_people1: '',
|
Device_time: '',
|
Device_staus: "CLOSED",
|
Workshop: ''
|
}
|
$("#Device").html('')
|
$("#Quality").html('')
|
$("#Materiel").html('');
|
$("#ExctDir").html('');
|
//呼叫设备
|
var Device = "";
|
Device += "<ul>";
|
if (data.Device == '') {
|
data.Device.push(nullData);
|
}
|
for (var i = 0; i < data.Device.length; i++) {
|
Device += "<li>";
|
Device += "<div class='flex_div'>";
|
if (data.Device[i].Device_staus == "NEW") {
|
Device += "<div class='div_in div_in_color_false'>";
|
Device += "<img src='img/sb_false.png' />";
|
}
|
else {
|
Device += "<div class='div_in div_in_color_true'>";
|
Device += "<img src='img/sb_true.png' />";
|
}
|
Device += "<div class='div_nr wa'>";
|
Device += "<div class='m18'>";
|
Device += "<p class='f13'>工位代码</p>";
|
Device += "<p class='f15'>" + data.Device[i].Device_id + "</p>";
|
Device += "</div>";
|
Device += "<div class='div_nr w59 m8'>";
|
Device += "<p class='f13'>车间代码</p>";
|
Device += "<p class='f15'>" + data.Device[i].Workshop + "</p>";
|
Device += "</div>";
|
Device += "<div class='div_nr w40 m8'>";
|
Device += "<p class='f13'>呼叫人</p>";
|
Device += "<p class='f15'>" + data.Device[i].Device_people + "</p>";
|
Device += "</div>";
|
Device += "<div class='div_nr w59 '>";
|
Device += "<p class='f13'>呼叫时间</p>";
|
Device += "<p class='f15'>" + data.Device[i].Device_calltime + "</p>";
|
Device += "</div>";
|
Device += "<div class='div_nr w40 '>";
|
Device += "<p class='f13'>状态</p>";
|
if (data.Device[i].Device_staus == "NEW") {
|
Device += "<p class='f15'>未响应</p>";
|
}
|
else {
|
Device += "<p class='f15'>已响应</p>";
|
}
|
Device += "</div>";
|
|
Device += "</div>";
|
Device += "</div>";
|
Device += "</div>";
|
Device += "</li>";
|
|
}
|
Device += "</ul>";
|
|
//呼叫质量
|
var Quality = "";
|
Quality += "<ul>";
|
if (data.Quality == '') {
|
data.Quality.push(nullData);
|
}
|
for (var j = 0; j < data.Quality.length; j++) {
|
|
Quality += "<li>";
|
Quality += "<div class='flex_div'>";
|
if (data.Quality[j].Device_staus == "NEW") {
|
Quality += "<div class='div_in div_in_color_false'>";
|
Quality += "<img src='img/zl_false.png' />";
|
}
|
else {
|
Quality += "<div class='div_in div_in_color_true'>";
|
Quality += "<img src='img/zl_true.png' />";
|
}
|
Quality += "<div class='div_nr wa'>";
|
Quality += "<div class='m18'>";
|
Quality += "<p class='f13'>工位代码</p>";
|
Quality += "<p class='f15'>" + data.Quality[j].Device_id + " </p>";
|
Quality += "</div>";
|
Quality += "<div class='div_nr w59 m8'>";
|
Quality += "<p class='f13'>车间代码</p>";
|
Quality += "<p class='f15'>" + data.Quality[j].Workshop + "</p>";
|
Quality += "</div>";
|
Quality += "<div class='div_nr w40 m8'>";
|
Quality += "<p class='f13'>呼叫人</p>";
|
Quality += "<p class='f15'>" + data.Quality[j].Device_people + "</p>";
|
Quality += "</div>";
|
Quality += "<div class='div_nr w59 '>";
|
Quality += "<p class='f13'>呼叫时间</p>";
|
Quality += "<p class='f15'>" + data.Quality[j].Device_calltime + "</p>";
|
Quality += "</div>";
|
Quality += "<div class='div_nr w40 '>";
|
Quality += "<p class='f13'>状态</p>";
|
if (data.Quality[j].Device_staus == "NEW") {
|
Quality += "<p class='f15'>未响应</p>";
|
}
|
else {
|
Quality += "<p class='f15'>已响应</p>";
|
}
|
Quality += "</div>";
|
|
Quality += "</div>";
|
Quality += "</div>";
|
Quality += "</div>";
|
Quality += "</li>";
|
|
}
|
Quality += "</ul>";
|
//呼叫物料
|
var Materiel = "";
|
Materiel += "<ul>";
|
if (data.Materiel == '') {
|
data.Materiel.push(nullData);
|
}
|
for (var k = 0; k < data.Materiel.length; k++) {
|
|
Materiel += "<li>";
|
Materiel += "<div class='flex_div'>";
|
if (data.Materiel[k].Device_staus == "NEW") {
|
Materiel += "<div class='div_in div_in_color_false'>";
|
Materiel += "<img src='img/wl_false.png' />";
|
}
|
else {
|
Materiel += "<div class='div_in div_in_color_true'>";
|
Materiel += "<img src='img/wl_true.png' />";
|
}
|
Materiel += "<div class='div_nr wa'>";
|
Materiel += "<div class='m18'>";
|
Materiel += "<p class='f13'>工位代码</p>";
|
Materiel += "<p class='f15'>" + data.Materiel[k].Device_id + "</p>";
|
Materiel += "</div>";
|
Materiel += "<div class='div_nr w59 m8'>";
|
Materiel += "<p class='f13'>车间代码</p>";
|
Materiel += "<p class='f15'>" + data.Materiel[k].Workshop + "</p>";
|
Materiel += "</div>";
|
Materiel += "<div class='div_nr w40 m8'>";
|
Materiel += "<p class='f13'>呼叫人</p>";
|
Materiel += "<p class='f15'>" + data.Materiel[k].Device_people + "</p>";
|
Materiel += "</div>";
|
Materiel += "<div class='div_nr w59 '>";
|
Materiel += "<p class='f13'>呼叫时间</p>";
|
Materiel += "<p class='f15'>" + data.Materiel[k].Device_calltime + "</p>";
|
Materiel += "</div>";
|
Materiel += "<div class='div_nr w40 '>";
|
Materiel += "<p class='f13'>状态</p>";
|
if (data.Materiel[k].Device_staus == "NEW") {
|
Materiel += "<p class='f15'>未响应</p>";
|
}
|
else {
|
Materiel += "<p class='f15'>已响应</p>";
|
}
|
Materiel += "</div>";
|
|
Materiel += "</div>";
|
Materiel += "</div>";
|
Materiel += "</div>";
|
Materiel += "</li>";
|
|
}
|
Materiel += "</ul>";
|
//呼叫主管
|
var ExctDir = "";
|
ExctDir += "<ul>";
|
if (data.ExctDir == '') {
|
data.ExctDir.push(nullData);
|
}
|
for (var m = 0; m < data.ExctDir.length; m++) {
|
|
ExctDir += "<li>";
|
ExctDir += "<div class='flex_div'>";
|
if (data.ExctDir[m].Device_staus == "NEW") {
|
ExctDir += "<div class='div_in div_in_color_false'>";
|
ExctDir += "<img src='img/zg_false.png' />";
|
}
|
else {
|
ExctDir += "<div class='div_in div_in_color_true'>";
|
ExctDir += "<img src='img/zg_true.png' />";
|
}
|
ExctDir += "<div class='div_nr wa'>";
|
ExctDir += "<div class='m18'>";
|
ExctDir += "<p class='f13'>工位代码</p>";
|
ExctDir += "<p class='f15'>" + data.ExctDir[m].Device_id + "</p>";
|
ExctDir += "</div>";
|
ExctDir += "<div class='div_nr w59 m8'>";
|
ExctDir += "<p class='f13'>车间代码</p>";
|
ExctDir += "<p class='f15'>" + data.ExctDir[m].Workshop + "</p>";
|
ExctDir += "</div>";
|
ExctDir += "<div class='div_nr w40 m8'>";
|
ExctDir += "<p class='f13'>呼叫人</p>";
|
ExctDir += "<p class='f15'>" + data.ExctDir[m].Device_people + "</p>";
|
ExctDir += "</div>";
|
ExctDir += "<div class='div_nr w59 '>";
|
ExctDir += "<p class='f13'>呼叫时间</p>";
|
ExctDir += "<p class='f15'>" + data.ExctDir[m].Device_calltime + "</p>";
|
ExctDir += "</div>";
|
ExctDir += "<div class='div_nr w40 '>";
|
ExctDir += "<p class='f13'>状态</p>";
|
if (data.ExctDir[m].Device_staus == "NEW") {
|
ExctDir += "<p class='f15'>未响应</p>";
|
}
|
else {
|
ExctDir += "<p class='f15'>已响应</p>";
|
}
|
ExctDir += "</div>";
|
|
ExctDir += "</div>";
|
ExctDir += "</div>";
|
ExctDir += "</div>";
|
ExctDir += "</li>";
|
|
}
|
ExctDir += "</ul>";
|
// $("#Device").empty();
|
// $("#Quality").empty();
|
// $("#Materiel").empty();
|
// $("#ExctDir").empty();
|
// $("#Device").html('')
|
// $("#Quality").html('')
|
// $("#Materiel").html('');
|
// $("#ExctDir").html('');
|
|
$("#Device").append(Device);
|
$("#Quality").append(Quality);
|
$("#Materiel").append(Materiel);
|
$("#ExctDir").append(ExctDir);
|
|
},
|
error: function (data) {
|
//alert("" + data.messager + "");
|
}
|
})
|
}
|
function Load2() {
|
$.ajax({
|
url: 'http://172.16.72.3:86/DaLian/AnDengStaus',
|
dataType: "JSON",
|
type: "POST",
|
success: function (data) {
|
var n = 0;
|
for (var i = 0; i < data.length; i++) {
|
if (data[i].STATUS == "NEW") {
|
n++;
|
}
|
}
|
if (n > 0) { //播放音乐
|
document.getElementById("media").play();
|
$('#warning_img').show();
|
$('.warning_no').hide();
|
}
|
else { //停止播放
|
document.getElementById("media").pause();
|
$('#warning_img').hide();
|
$('.warning_no').show();
|
}
|
},
|
error: function (data) {
|
// $.iMessager.alert("提示", "" + data1.messager + "", "messager-warning");
|
}
|
})
|
}
|
function getColor(val,standard){
|
if(standard=="0") return '#09d1ea'
|
else if(val <= standard) return 'green'
|
else if (val > standard && val <= standard * 1.2) return 'yellow'
|
else return '#c83559'
|
}
|
function resresh() {
|
$.ajax({
|
url: 'http://172.16.72.3:86/DaLian/DeviceData',
|
async: true,//使用同步的方式,true为异步方式
|
dataType: "JSON",
|
type: "POST",
|
success: function (data) {
|
//console.info(data);
|
$("#left1").html("");
|
$("#left2").html("");
|
$("#left3").html("");
|
|
|
//跟新设备信息
|
//关机设备
|
var htmleft = "";
|
htmleft += "<ul>";
|
for (var j = 0; j < data.dt1.dt_0.length; j++) {
|
data.dt1.dt_0[j].color = getColor(data.dt1.dt_0[j].STAND_VAL,data.dt1.dt_0[j].CURRDAY_OPCVALUE)
|
htmleft += "<li>";
|
htmleft += "<div class='li_style'>";
|
htmleft += "<img src='img/icon_1.png' class='img_style' />";
|
htmleft += "<div>";
|
htmleft += "<p>设备：" + data.dt1.dt_0[j].EQP_NAME_ + "</p>";
|
htmleft += "<p>点检：";
|
if (data.dt1.dt_0[j].CHECK_ == "T") { //已点检
|
htmleft += "<span class='span_icon span_icon1'></span>";
|
}
|
if (data.dt1.dt_0[j].CHECK_ == "F") { //未点检
|
htmleft += "<span class='span_icon span_icon3'></span>";
|
}
|
if (data.dt1.dt_0[j].CHECK_ == "N") { //点检不正常
|
htmleft += "<span class='span_icon span_icon5'></span>";
|
}
|
htmleft += " 保养：";
|
if (data.dt1.dt_0[j].CREATE_== "T") { //已保养
|
htmleft += "<span class='span_icon span_icon4'></span>";
|
}
|
if (data.dt1.dt_0[j].CREATE_ == "F") { //未保养
|
htmleft += "<span class='span_icon span_icon2'></span>";
|
}
|
if (data.dt1.dt_0[j].CREATE_ == "N") { //保养不正常
|
htmleft += "<span class='span_icon span_icon6'></span>";
|
}
|
|
htmleft += "</p>";
|
htmleft += "<p class='mb'>节拍：<span class='ml' style='color:" + data.dt1.dt_0[j]['color'] + "'>" + data.dt1.dt_0[j].STAND_VAL + "秒</span></p>";
|
htmleft += "</div>";
|
htmleft += "</div>";
|
htmleft += "</li>";
|
|
}
|
htmleft += "</ul>";
|
$("#left1").append(htmleft);
|
//运行
|
var NumberAA = Math.ceil(data.dt1.dt_1.length / 5);
|
var countInLine = 5;//一行几个
|
var nn = 0;
|
var htmleft1 = "";
|
htmleft1 += "<ul>";
|
for (var mm = 0; mm < NumberAA; mm++) {
|
htmleft1 += "<li>";
|
for (var nn = nn; nn < data.dt1.dt_1.length; nn++) {
|
data.dt1.dt_1[nn].color = getColor(data.dt1.dt_1[nn].STAND_VAL,data.dt1.dt_1[nn].CURRDAY_OPCVALUE)
|
if ((nn + 1) % countInLine == 0) {
|
htmleft1 += "<div class='li_style'>";
|
htmleft1 += "<img src='img/icon_2.png' class='img_style' />";
|
htmleft1 += "<div>";
|
htmleft1 += "<p class='change_color'>设备：" + data.dt1.dt_1[nn].EQP_NAME_ + "</p>";
|
htmleft1 += "<p>点检：";
|
if (data.dt1.dt_1[nn].CHECK_ == "T") { //已点检
|
htmleft1 += "<span class='span_icon span_icon1'></span>";
|
}
|
if (data.dt1.dt_1[nn].CHECK_ == "F") { //未点检
|
htmleft1 += "<span class='span_icon span_icon3'></span>";
|
}
|
if (data.dt1.dt_1[nn].CHECK_ == "N") { //点检不正常
|
htmleft1 += "<span class='span_icon span_icon5'></span>";
|
}
|
htmleft1 += " 保养：";
|
if (data.dt1.dt_1[nn].CREATE_ == "T") { //已保养
|
htmleft1 += "<span class='span_icon span_icon4'></span>";
|
}
|
if (data.dt1.dt_1[nn].CREATE_ == "F") { //未保养
|
htmleft1 += "<span class='span_icon span_icon2'></span>";
|
}
|
if (data.dt1.dt_1[nn].CREATE_ == "N") { //保养不正常
|
htmleft1 += "<span class='span_icon span_icon6'></span>";
|
}
|
htmleft1 += "<p class='mb'>节拍：<span class='change_color ml' style='color:" + data.dt1.dt_1[nn].color + "'>" + data.dt1.dt_1[nn].STAND_VAL + "秒</span></p>";
|
htmleft1 += "</div>";
|
htmleft1 += "</div>";
|
nn = nn + 1;
|
break;
|
}
|
else {
|
htmleft1 += "<div class='li_style'>";
|
htmleft1 += "<img src='img/icon_2.png' class='img_style' />";
|
htmleft1 += "<div>";
|
htmleft1 += "<p class='change_color'>设备：" + data.dt1.dt_1[nn].EQP_NAME_+ "</p>";
|
htmleft1 += "<p>点检：";
|
if (data.dt1.dt_1[nn].CHECK_ == "T") { //已点检
|
htmleft1 += "<span class='span_icon span_icon1'></span>";
|
}
|
if (data.dt1.dt_1[nn].CHECK_ == "F") { //未点检
|
htmleft1 += "<span class='span_icon span_icon3'></span>";
|
}
|
if (data.dt1.dt_1[nn].CHECK_ == "N") { //点检不正常
|
htmleft1 += "<span class='span_icon span_icon5'></span>";
|
}
|
htmleft1 += " 保养：";
|
if (data.dt1.dt_1[nn].CREATE_ == "T") { //已保养
|
htmleft1 += "<span class='span_icon span_icon4'></span>";
|
}
|
if (data.dt1.dt_1[nn].CREATE_ == "F") { //未保养
|
htmleft1 += "<span class='span_icon span_icon2'></span>";
|
}
|
if (data.dt1.dt_1[nn].CREATE_ == "N") { //保养不正常
|
htmleft1 += "<span class='span_icon span_icon6'></span>";
|
}
|
htmleft1 += "<p class='mb'>节拍：<span class='change_color ml' style='color:" + data.dt1.dt_1[nn].color + "'>" + data.dt1.dt_1[nn].STAND_VAL + "秒</span></p>";
|
htmleft1 += "</div>";
|
htmleft1 += "</div>";
|
}
|
}
|
htmleft1 += "</li>";
|
}
|
htmleft1 += "</ul>";
|
|
$("#left2").append(htmleft1);
|
// //故障
|
var htmleft2 = "";
|
htmleft2 += "<ul>";
|
for (var m = 0; m < data.dt1.dt_2.length; m++) {
|
data.dt1.dt_2[m].color = getColor(data.dt1.dt_2[m].STAND_VAL,data.dt1.dt_2[m].CURRDAY_OPCVALUE)
|
htmleft2 += "<li>";
|
htmleft2 += "<div class='li_style'>";
|
htmleft2 += "<img src='img/icon_3.png' class='img_style' />";
|
htmleft2 += "<div>";
|
htmleft2 += "<p class='change_color1'>设备：" + data.dt1.dt_2[m].EQP_NAME_ + "</p>";
|
htmleft2 += "<p>点检：";
|
if (data.dt1.dt_2[m].CHECK_ == "T") { //已点检
|
htmleft2 += "<span class='span_icon span_icon1'></span>";
|
}
|
if (data.dt1.dt_2[m].CHECK_ == "F") { //未点检
|
htmleft2 += "<span class='span_icon span_icon3'></span>";
|
}
|
if (data.dt1.dt_2[m].CHECK_ == "N") { //点检不正常
|
htmleft2 += "<span class='span_icon span_icon5'></span>";
|
}
|
htmleft2 += " 保养：";
|
if (data.dt1.dt_2[m].CREATE_ == "T") { //已保养
|
htmleft2 += "<span class='span_icon span_icon4'></span>";
|
}
|
if (data.dt1.dt_2[m].CREATE_ == "F") { //未保养
|
htmleft2 += "<span class='span_icon span_icon2'></span>";
|
}
|
if (data.dt1.dt_2[m].CREATE_ == "N") { //保养不正常
|
htmleft2 += "<span class='span_icon span_icon6'></span>";
|
}
|
|
htmleft2 += "</p>";
|
htmleft2 += "<p class='mb'>节拍：<span class='change_color1 ml' style='color:" + data.dt1.dt_2[m].color + "'>" + data.dt1.dt_2[m].STAND_VAL + "秒</span></p>";
|
htmleft2 += "</div>";
|
htmleft2 += "</div>";
|
htmleft2 += "</li>";
|
|
}
|
htmleft2 += "</ul>";
|
$("#left3").append(htmleft2);
|
$(".list_style").slide({ mainCell: ".hd ul", autoPlay: true, effect: "topMarquee", opp: false, vis: 6, interTime: time, mouseOverStop: false });
|
},
|
error: function (data) {
|
//alert("" + data.messager + "");
|
}
|
})
|
}
|
</script>
|
</head>
|
|
<body>
|
<audio id="media" src="Mp3/xc.mp3" loop="loop"></audio>
|
<div class="col-sm-12">
|
<div class="header">
|
<div class="clock">
|
<ul>
|
<li id="Date"></li>
|
<li id="hours"> </li>
|
<li id="point">:</li>
|
<li id="min"> </li>
|
<li id="point">:</li>
|
<li id="sec"> </li>
|
</ul>
|
</div>
|
<!-- <div class="bg_header">
|
<div class="header_nav fl t_title">
|
数字化工厂驾驶舱
|
</div>
|
|
</div> -->
|
</div>
|
</div>
|
<div class="col-sm-12">
|
<div class='flex'>
|
<p class='flex_title f18'>呼叫设备</p>
|
<p class='flex_title f18'>呼叫质量</p>
|
<p class='flex_title f18'>呼叫物料</p>
|
<p class='flex_title f18'>呼叫主管</p>
|
</div>
|
<div>
|
<!-- 暂时放着 数据隐藏后去掉 -->
|
<div id="main1" class='flex_item hidden'></div>
|
<div id="main2" class='flex_item hidden'></div>
|
<div id="main3" class='flex_item hidden'></div>
|
<div id="main4" class='flex_item hidden'></div>
|
<div id="main5" class='flex_item hidden'></div>
|
<div id="main6" class='flex_item hidden'></div>
|
|
<div class='flex'>
|
<div class='picScroll-top top1'>
|
<div class='bd' id="Device">
|
<!-- <ul>
|
|
</ul> -->
|
</div>
|
</div>
|
<div class='picScroll-top top2'>
|
<div class='bd' id="Quality">
|
<!-- <ul>
|
|
</ul> -->
|
</div>
|
</div>
|
<div class='picScroll-top top3'>
|
<div class='bd' id="Materiel">
|
<!-- <ul>
|
|
</ul> -->
|
</div>
|
</div>
|
<div class='picScroll-top top4'>
|
<div class='bd' id="ExctDir">
|
<!-- <ul>
|
|
</ul> -->
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="col-sm-12">
|
<div class="widget-box">
|
<div class="widget-title">
|
<span>设备运行监控</span>
|
</span>
|
</div>
|
|
<div class="panel-body flex">
|
<div class='list_style w1'>
|
<p class='title_p'><span class='gj_icon color_border1'></span>关机</p>
|
<div class='hd' id='left1'>
|
|
</div>
|
</div>
|
<div class='list_style w2'>
|
<p class='title_p'><span class='gj_icon color_border2'></span>开机</p>
|
<div class='hd' id="left2">
|
|
</div>
|
</div>
|
|
<div class='list_style w3'>
|
<p class='title_p'><span class='gj_icon color_border3'></span>故障</p>
|
<div class='hd' id='left3'>
|
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</body>
|
|
</html>
|
