|
|
@@ -3,6 +3,7 @@
|
|
|
<head>
|
|
|
<meta charset="utf-8">
|
|
|
<title></title>
|
|
|
+ <link rel="stylesheet" type="text/css" href="css/main.css">
|
|
|
</head>
|
|
|
<body onclick="$('#imp_item').hide();$('#search_result').html('').hide();$('#search input').val('')">
|
|
|
<div id="loading_a1"></div>
|
|
|
@@ -478,6 +479,7 @@
|
|
|
<script type="text/javascript" src="jquery-3.4.1.js"></script>
|
|
|
<script type="text/javascript" src="echarts.min.js"></script>
|
|
|
<script src="qwebchannel.js"></script>
|
|
|
+ <script src="global.js"></script>
|
|
|
<script src="Player.js"></script>
|
|
|
<script src="PlayerUtils.js"></script>
|
|
|
<script src="lottie.min.js"></script>
|
|
|
@@ -498,13 +500,9 @@
|
|
|
loop: true,
|
|
|
// 渲染的格式svg/canvas/html，svg性能更优，兼容性更好
|
|
|
renderer: "svg",
|
|
|
- });
|
|
|
- var AutoPlayer = false;//开启自动漫游
|
|
|
+ });
|
|
|
var sam0023;
|
|
|
- var SERVER_URL = "http://8.142.173.95:18100";//服务接口地址
|
|
|
- var PLAYER3D_URL= "ws://192.168.101.66:17008";//
|
|
|
- var modelsMap={}
|
|
|
- var DEV_ALAR_COLOR = "ff6c00"; //全局设备告警颜色
|
|
|
+ var modelsMap={}
|
|
|
var MODEL_LOADED = 0; //模型是否加载完成
|
|
|
var ALARM_DEVS = []; //未提醒的告警设备，将在模型加载完成时提醒
|
|
|
var LoadServerDataTimer=null;
|
|
|
@@ -1703,377 +1701,5 @@
|
|
|
</body>
|
|
|
</html>
|
|
|
<style type="text/css">
|
|
|
- body{
|
|
|
- padding: 0;
|
|
|
- margin: 0;
|
|
|
- overflow: hidden;
|
|
|
- background-color: #050C28;
|
|
|
- /*background-image: url('image/bg.jpeg');*/
|
|
|
- }
|
|
|
- thead tr{
|
|
|
- background-image: url('image/thead_bg.png');
|
|
|
- background: rgba(25,57,103,0.7);
|
|
|
- border: 1px solid #7DA2CD;
|
|
|
- height: 32px;
|
|
|
- }
|
|
|
- tbody tr{
|
|
|
- background: rgba(25,57,103,0.3);
|
|
|
- border: 1px solid #7DA2CD;
|
|
|
- height: 32px;
|
|
|
- font-size: 16px;
|
|
|
- }
|
|
|
- td{
|
|
|
- border-bottom: 1px solid #7DA2CD;
|
|
|
- }
|
|
|
- #loading{
|
|
|
- position: absolute;
|
|
|
- top: 50%;
|
|
|
- left: 50%;
|
|
|
- font-size: 18px;
|
|
|
- color: blue;
|
|
|
- z-index: 1;
|
|
|
- margin-left: -120px;
|
|
|
- width: 100%;
|
|
|
- color: #B0E1FF;
|
|
|
- letter-spacing: 7px;
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
- #loading_a1{
|
|
|
- position: absolute;
|
|
|
- z-index: 1;
|
|
|
- left: 50%;
|
|
|
- top: 40%;
|
|
|
- width: 100px;
|
|
|
- height: 100px;
|
|
|
- margin-top: -50px;
|
|
|
- margin-left: -50px;
|
|
|
- }
|
|
|
- #search{
|
|
|
- position: absolute;width: 320px;top: 12%;left: 50%;margin-left: -160px;
|
|
|
- z-index: 1;
|
|
|
- background: rgba(41,85,137,0.7);
|
|
|
- border-radius: 2px 2px 2px 2px;
|
|
|
- border: 1px solid #66AEF3;
|
|
|
- }
|
|
|
- #search input{
|
|
|
- width: 315px;height: 38px;background: rgba(41,85,137,0.7);border-radius: 2px 2px 2px 2px;border: 1px solid #66AEF3;color: #ffffff;font-size: 14px;
|
|
|
- letter-spacing: 3px;
|
|
|
- }
|
|
|
- #search_result{
|
|
|
- display: none;
|
|
|
- position: absolute;width: 310px;max-height: 256px;min-height: 32px; top: 17%;left: 50%;margin-left: -160px;opacity: 0.7;background-color: #132F5F;
|
|
|
- padding: 8px;color: #Ffffff;font-size: 14px;
|
|
|
- background: rgba(19,47,95,0.8);
|
|
|
- box-shadow: 0px 0px 12px 0px rgba(0,0,0,0.2);
|
|
|
- border-radius: 2px 2px 2px 2px;
|
|
|
- z-index: 1
|
|
|
- }
|
|
|
- #search_result .item{
|
|
|
- border-radius: 2px 2px 2px 2px;height: 30px;line-height: 30px;padding-left: 5px;cursor: pointer;
|
|
|
- }
|
|
|
- #search_result .item:hover{
|
|
|
- background: #3B6096;
|
|
|
- }
|
|
|
- #imp_item{
|
|
|
- position: absolute;
|
|
|
- width: 160px;
|
|
|
- height: 150px;
|
|
|
- background: rgba(19, 47, 95, 0.8);
|
|
|
- box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.2);
|
|
|
- border-radius: 2px 2px 2px 2px;
|
|
|
- z-index: 4;
|
|
|
- top: 60px;
|
|
|
- right: 71px;
|
|
|
- padding: 5px;
|
|
|
- display: none;
|
|
|
- }
|
|
|
- #imp_item>div{
|
|
|
- width: 144px;
|
|
|
- height: 30px;
|
|
|
- border-radius: 2px 2px 2px 2px;
|
|
|
- cursor: pointer;
|
|
|
- color: #ffffff;
|
|
|
- line-height: 30px;
|
|
|
- padding:0 5px;
|
|
|
- }
|
|
|
- #imp_item>div:hover{
|
|
|
- background: #3B6096;
|
|
|
- }
|
|
|
- #top{
|
|
|
- position: fixed;
|
|
|
- top:0;
|
|
|
- left: 0;
|
|
|
- width: 1920px;
|
|
|
- height: 95px;
|
|
|
- z-index: 1;
|
|
|
- background: #ffffff00;
|
|
|
- background-image: url('image/top.png');
|
|
|
- }
|
|
|
- #dev_state{
|
|
|
- position: absolute;
|
|
|
- z-index: 1;
|
|
|
- top:100px;
|
|
|
- left: 10px;
|
|
|
- }
|
|
|
- #dev_state .title{
|
|
|
- background-image: url('image/dev_state_title.png');
|
|
|
- background-repeat: no-repeat;
|
|
|
- background-size: auto;
|
|
|
- height: 32px;
|
|
|
- width: 416px;
|
|
|
- }
|
|
|
- #dev_state .content{
|
|
|
- margin:5px;
|
|
|
- padding: 10px;
|
|
|
- width: 400px;
|
|
|
- height: 238px;
|
|
|
- background: rgba(41,85,137,0.7);
|
|
|
- }
|
|
|
- #dev_alarm{
|
|
|
- position: absolute;
|
|
|
- z-index: 1;
|
|
|
- top:415px;
|
|
|
- left: 10px;
|
|
|
- }
|
|
|
- #dev_alarm .title{
|
|
|
- background-image: url('image/dev_alarm_title.png');
|
|
|
- background-repeat: no-repeat;
|
|
|
- background-size: auto;
|
|
|
- height: 32px;
|
|
|
- width: 416px;
|
|
|
- text-align: center;
|
|
|
- color: #f0f377;
|
|
|
- line-height: 32px;
|
|
|
- }
|
|
|
- #dev_alarm .content{
|
|
|
- margin:5px;
|
|
|
- padding: 10px;
|
|
|
- width: 400px;
|
|
|
- height: auto;
|
|
|
- background: rgba(41,85,137,0.7);
|
|
|
- }
|
|
|
|
|
|
- #dev_stop{
|
|
|
- position: absolute;
|
|
|
- z-index: 1;
|
|
|
- top:705px;
|
|
|
- left: 10px;
|
|
|
- }
|
|
|
- #dev_stop .title{
|
|
|
- background-image: url('image/stop_title.png');
|
|
|
- background-repeat: no-repeat;
|
|
|
- background-size: auto;
|
|
|
- height: 32px;
|
|
|
- width: 416px;
|
|
|
- text-align: center;
|
|
|
- color: #f0f377;
|
|
|
- line-height: 32px;
|
|
|
- }
|
|
|
- #dev_stop .content{
|
|
|
- margin:5px;
|
|
|
- padding: 10px;
|
|
|
- width: 400px;
|
|
|
- height: auto;
|
|
|
- background: rgba(41,85,137,0.7);
|
|
|
- }
|
|
|
- #dev_xiaolv{
|
|
|
- position: absolute;
|
|
|
- z-index: 1;
|
|
|
- top:100px;
|
|
|
- right: 10px;
|
|
|
- }
|
|
|
- #dev_xiaolv .title{
|
|
|
- background-image: url('image/xiaolv_title.png');
|
|
|
- background-repeat: no-repeat;
|
|
|
- background-size: auto;
|
|
|
- height: 32px;
|
|
|
- width: 416px;
|
|
|
- text-align: center;
|
|
|
- color: #f0f377;
|
|
|
- line-height: 32px;
|
|
|
- }
|
|
|
- #dev_xiaolv .content{
|
|
|
- margin:5px;
|
|
|
- padding: 10px;
|
|
|
- width: 416px;
|
|
|
- height: auto;
|
|
|
- background: rgba(41,85,137,0.7);
|
|
|
- }
|
|
|
-
|
|
|
- #dev_jiadonglv{
|
|
|
- position: absolute;
|
|
|
- z-index: 1;
|
|
|
- top:390px;
|
|
|
- right: 10px;
|
|
|
- }
|
|
|
- #dev_jiadonglv .title{
|
|
|
- background-image: url('image/dev_jiadonglv_title.png');
|
|
|
- background-repeat: no-repeat;
|
|
|
- background-size: auto;
|
|
|
- height: 32px;
|
|
|
- width: 416px;
|
|
|
- text-align: center;
|
|
|
- color: #f0f377;
|
|
|
- line-height: 32px;
|
|
|
- }
|
|
|
- #dev_jiadonglv .content{
|
|
|
- margin:5px;
|
|
|
- padding: 10px;
|
|
|
- width: 416px;
|
|
|
- height: auto;
|
|
|
- background: rgba(41,85,137,0.7);
|
|
|
- }
|
|
|
- #dev_sc_qushi{
|
|
|
- position: absolute;
|
|
|
- z-index: 1;
|
|
|
- top:625px;
|
|
|
- right: 10px;
|
|
|
- }
|
|
|
- #dev_sc_qushi .title{
|
|
|
- background-image: url('image/dev_sc_qushi_title.png');
|
|
|
- background-repeat: no-repeat;
|
|
|
- background-size: auto;
|
|
|
- height: 32px;
|
|
|
- width: 416px;
|
|
|
- text-align: center;
|
|
|
- color: #f0f377;
|
|
|
- line-height: 32px;
|
|
|
- }
|
|
|
- #dev_sc_qushi .content{
|
|
|
- margin:5px;
|
|
|
- padding: 10px;
|
|
|
- width: 416px;
|
|
|
- height: auto;
|
|
|
- background: rgba(41,85,137,0.7);
|
|
|
- }
|
|
|
- #dev_used_qushi{
|
|
|
- position: absolute;
|
|
|
- z-index: 1;
|
|
|
- top:855px;
|
|
|
- right: 10px;
|
|
|
- }
|
|
|
- #dev_used_qushi .title{
|
|
|
- background-image: url('image/dev_used_qushi_title.png');
|
|
|
- background-repeat: no-repeat;
|
|
|
- background-size: auto;
|
|
|
- height: 32px;
|
|
|
- width: 416px;
|
|
|
- text-align: center;
|
|
|
- color: #f0f377;
|
|
|
- line-height: 32px;
|
|
|
- }
|
|
|
- #dev_used_qushi .content{
|
|
|
- margin:5px;
|
|
|
- padding: 10px;
|
|
|
- width: 416px;
|
|
|
- height: auto;
|
|
|
- background: rgba(41,85,137,0.7);
|
|
|
- }
|
|
|
- .showinfo{
|
|
|
- position: absolute;
|
|
|
- width: 800px;
|
|
|
- height: 400px;
|
|
|
- left: 50%;
|
|
|
- top:50%;
|
|
|
- margin-top: -200px;
|
|
|
- margin-left:-400px;
|
|
|
- z-index: 2;
|
|
|
- background-color: rgba(9,28,67,0.9);
|
|
|
- border: 2px solid #445985;
|
|
|
- display: none;
|
|
|
- color: #7E96D9;
|
|
|
- }
|
|
|
- .newwin .title,.showinfo .title{
|
|
|
- width: 100%;
|
|
|
- height: 40px;
|
|
|
- background: linear-gradient( 90deg, #2E5097 0%, #071433 100%);
|
|
|
- }
|
|
|
- .newwin{
|
|
|
- position: absolute;
|
|
|
- width: 1330px;
|
|
|
- height: 576px;
|
|
|
- left: 50%;
|
|
|
- top:50%;
|
|
|
- margin-top: -278px;
|
|
|
- margin-left:-665px;
|
|
|
- z-index: 2;
|
|
|
- background-color: rgba(9,28,67,0.9);
|
|
|
- border: 2px solid #445985;
|
|
|
- display: block;
|
|
|
- color: #7E96D9;
|
|
|
- }
|
|
|
- .newwin .title .text,.showinfo .title .text{
|
|
|
- font-weight: 400;
|
|
|
- font-size: 24px;
|
|
|
- line-height: 28px;
|
|
|
- text-align: left;
|
|
|
- color: #AFC5FF;
|
|
|
- float: left;
|
|
|
- margin: 7px;
|
|
|
- }
|
|
|
- .newwin .btn{
|
|
|
- display: inline-block;
|
|
|
- width: 136px;
|
|
|
- height: 32px;
|
|
|
- background: linear-gradient(#2056c605, #3765c3 0%, rgba(0, 39, 118, 0) 100%);
|
|
|
- border: 1px solid;
|
|
|
- border-image: linear-gradient(360deg, rgba(168, 196, 255, 1), rgba(164, 193, 255, 0)) 1 1;
|
|
|
- margin:10px;
|
|
|
- line-height: 32px;
|
|
|
- font-size: 18px;
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
- .newwin .btn_active{
|
|
|
- background-color: #a09ef5;
|
|
|
- font-weight: bold;
|
|
|
- color: #fff;
|
|
|
- }
|
|
|
- .newwin table{
|
|
|
- width: 100%;
|
|
|
- text-align: center;
|
|
|
- border-top: 1px solid #8194BC;
|
|
|
- border-bottom: 1px solid #8194BC;
|
|
|
- color: #97BCFF;
|
|
|
- }
|
|
|
- .newwin table tr{
|
|
|
- height: 50px
|
|
|
- }
|
|
|
- .newwin .value{
|
|
|
- color: #fff;
|
|
|
- }
|
|
|
- .newwin .dataContent .no_alarm{
|
|
|
- width: 95%;
|
|
|
- height: 140px;
|
|
|
- color: #ffffff;
|
|
|
- font-size: 32px;
|
|
|
- text-align: center;
|
|
|
- line-height: 140px;
|
|
|
- }
|
|
|
- .newwin .dataContent .has_alarm{
|
|
|
- width: 95%;
|
|
|
- height: 140px;
|
|
|
- display: none;
|
|
|
- font-size: 24px;
|
|
|
- text-align: center;
|
|
|
- line-height: 140px;
|
|
|
- }
|
|
|
- .newwin .dataContent .has_alarm .alarm_span{
|
|
|
- margin: 0 20px;
|
|
|
- color: red;
|
|
|
- }
|
|
|
- .newwin .dataContent .dev_alarm_echarts{
|
|
|
- width: 95%;
|
|
|
- height: 300px;
|
|
|
- line-height: 300px;
|
|
|
- text-align: center;
|
|
|
- font-size: 24px;
|
|
|
- color: #ffffff;
|
|
|
- }
|
|
|
- .showinfo td,.newwin td{
|
|
|
- border: 0px !important;
|
|
|
- }
|
|
|
- .td_splitLine{
|
|
|
- border: 1px solid;
|
|
|
- border-image: linear-gradient(90deg, rgba(126, 150, 217, 0), rgba(126, 150, 217, 1), rgba(126, 150, 217, 0)) 1 1;
|
|
|
- }
|
|
|
</script>
|
