You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
172 lines
4.2 KiB
172 lines
4.2 KiB
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
|
pageEncoding="UTF-8"%>
|
|
<%@ page import="com.lp.cfg.ProConfig"%>
|
|
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
|
|
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
|
|
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<%@ include file="/WEB-INF/oss/iot/common/variable.jsp"%>
|
|
<%@ include file="/WEB-INF/oss/iot/common/variable_js.jsp"%>
|
|
<%@ include file="/WEB-INF/oss/iot/common/resource_lib.jsp"%>
|
|
|
|
<link type="text/css" href="<%=basePath%>/css/oss/iot/monitor_device.css?<%=v%>" rel="stylesheet"/>
|
|
<style type="text/css">
|
|
.red-span{
|
|
background: #f44336;
|
|
padding: 2px 6px;
|
|
color: #fff;
|
|
border-radius: 4px;
|
|
cursor: pointer;
|
|
}
|
|
.span-dis{
|
|
display: inline-block;width: 300px;text-align: left;margin-right: 100px;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;overflow: hidden;
|
|
}
|
|
|
|
.blue-span{
|
|
background: #3499da;
|
|
padding: 3px 6px;
|
|
color: #fff;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.blue-span{
|
|
background: #3499da;
|
|
padding: 3px 6px;
|
|
color: #fff;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.grey-span{
|
|
background: #aaa;
|
|
padding: 3px 6px;
|
|
color: #fff;
|
|
border-radius: 4px;
|
|
opacity: 0.9;
|
|
}
|
|
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div>
|
|
|
|
<div>
|
|
<!-- 左边栏 -->
|
|
<div class="float-left index_theLeft" style="width:170px;">
|
|
<div class="prolist">
|
|
<span>项目列表</span>
|
|
</div>
|
|
<ul class="dashboard-menu scoll main-menu">
|
|
<c:forEach items="${info.data.getData()}" varStatus="status" var="obj">
|
|
<li
|
|
<c:if test="${id !=null }">
|
|
<c:if test="${obj.id ==id}">
|
|
class="active"
|
|
</c:if>
|
|
</c:if>
|
|
<c:if test="${id ==null }">
|
|
<c:if test="${status.index ==0}">
|
|
class="active"
|
|
</c:if>
|
|
</c:if>
|
|
sid="${obj.id}">
|
|
<span class="icon-stack-overflow"></span> ${obj.name }
|
|
<ul class='sub-menu'>
|
|
</ul>
|
|
</li>
|
|
</c:forEach>
|
|
</ul>
|
|
</div>
|
|
<div class="mapContainer" >
|
|
<div class="app-container">
|
|
<div class="container-layout" style="padding-top: 10px;">
|
|
<div class="box join-device-box video-box-container" style="display: none;" >
|
|
<div class="device_container"><i class="icon-file-video-o"></i> 视频监控</div>
|
|
<div class="video_container" >
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 视频类型 -->
|
|
<div id="template5" class="hide">
|
|
<div class="line" >
|
|
<div class="x3">
|
|
<img class="sensor_img" alt="image" src="<%=basePath%>/image/oss/iot/610.png">
|
|
<span class="sensor_name">{0}</span>
|
|
</div>
|
|
<div class="x3">
|
|
<!--
|
|
<p>当前状态：{1}</p>
|
|
<p>更新时间：{2}</p>
|
|
-->
|
|
</div>
|
|
<div class="x3">
|
|
{3}
|
|
</div>
|
|
<div class="x3 text-align-center">
|
|
<a href="<%=basePath%>/service/iot/video?id={4}&sid={5}">查看详情 <span class="icon-angle-double-right"></span> </a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</body>
|
|
<script type="text/javascript">
|
|
|
|
var refleshId = '' ;
|
|
var refleshSubId = '' ;
|
|
|
|
$(document).delegate(".dashboard-menu li","click",function(e){
|
|
if( $(this).hasClass('suli') ){
|
|
refleshId ="" ;
|
|
refleshSubId = $(this).attr("sid") ;
|
|
|
|
getVideoInfo(refleshSubId);
|
|
}else{
|
|
$(".dashboard-menu li").removeClass("active");
|
|
$(this).addClass("active");
|
|
refleshSubId = $(this).attr("sid") ;
|
|
|
|
getVideoInfo(refleshSubId);
|
|
}
|
|
})
|
|
|
|
//
|
|
$(document).delegate(".sub-menu li","click",function(e){
|
|
e.stopPropagation() ;
|
|
})
|
|
|
|
$(function(){
|
|
|
|
getVideoInfo($(".dashboard-menu li.active").attr("sid"));
|
|
})
|
|
|
|
function getVideoInfo(sid){
|
|
postAjax(localUrl+"/page/video.json?pageSize=300&paged=1", {scene_id:sid},function(data){
|
|
$(".video_container").empty();
|
|
if(isOK(data)){
|
|
$(".video-box-container").show();
|
|
var dataT = data.data.data ;
|
|
dataCache = dataT ;
|
|
for(var i=0;i<dataT.length;i++){
|
|
$(".video_container").append(
|
|
$("#template5").html().format(disvalue(dataT[i].name,15),
|
|
dataT[i].data.status,
|
|
timeStamp2String(dataT[i].atime,'yy/MM/dd hh:mm:ss'),
|
|
"",dataT[i].id,sid));
|
|
}
|
|
}else{
|
|
$(".video-box-container").hide();
|
|
}
|
|
});
|
|
}
|
|
|
|
</script>
|
|
|
|
</script>
|
|
</html>
|