<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<%@ include file="../include/importer.jsp" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport"
          content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <title>PQS9200电压暂降系统</title>
    <link rel="shortcut icon" href="/pqs9900/images/favicon.ico" type="image/x-icon"/>
    <link rel="stylesheet" href="${ctx}/css/switchCss.css">
    <script src="${pageContext.request.contextPath}/js/plugin/layerui/layer.js"></script>
    <style>
        * {
            padding: 0;
            margin: 0;
            font-family: "微软雅黑";
        }

        .winBox {
            width: 53%;
            height: 20px;
            font-size: 13px;
            padding-top: 4px;
            margin-left: 20px;
            overflow: hidden;
            position: absolute;
            display: inline-block;
        }

        .scroll {
            /*width的大小是根据下面li的长度和多少个li而定的，需注意！*/
            width: 1500px;
            position: absolute;
            left: 2px;
            top: 4px;
        }

        .scroll li {
            /*width: 200px;*/
            float: left;
            line-height: 15px;
            text-align: center;
        }

        .layui-layer-setwin .layui-layer-close2 {
            position: absolute;
            right: -14px;
            top: -14px;
            width: 30px;
            height: 30px;
            margin-left: 0;
            background-position: -149px -31px;
        }

        .subSystem {
            /*display: block !important;*/
            top: 18px !important;
            opacity: 1 !important;
            left: -36px !important;
            padding: 5px;
            border: 1px solid;
            border-radius: 3px !important;
            width: 140px;
        }

        .subSystem a {
            color: #fff;
            font-size: 12px !important;
            display: block;
            height: 20px !important;
            line-height: 20px !important;
            width: 130px !important;
            text-align: center;
            /*border-bottom: 1 !important;*/
        }

        .small_traggle {
            width: 0;
            height: 0;
            border: 8px solid;
            border-color: transparent transparent #fff;
            position: relative;
            top: -12px;
            left: 25px;
            display: none;
        }

        .switchSystem {
            margin-right: 0px !important;
        }

        #userDiv {
            position: fixed;
            right: 10px;
            top: 10px;
            width: 53px;
        }
    </style>
</head>
<body class="bg-main">
<header id="page_header">
    <div class="logow fadeInLeft f20 fb fl mt-3" id="logo">
        <img src="/pqs9900/images/logo.png" style="height: 68px"/>
    </div>
    <div class="fl top-menu">
        <span class="ml10 disinlineb mt-6" id="bigTitle">电能质量监测系统</span>
        <span class="f14" id="smallTitle">PQS-9200暂降监测系统v1.1.0</span>
        <div id="userDiv">
            <c:if test="${false}">
            <span id="swapSystem" class="mr10">
                <ul>
                 <li class="switchSystem">
                      <i class="fa fa-exchange">
                        </i>
                        <a href="javascript:void(0)" class="menuone switchSystem">模块切换</a>
                     <div class="small_traggle"></div>
                        <div class="menutwo subSystem">
                            <c:forEach items="${webItems }" var="item">
                                <a href="javascript:void(0)" item="${item.item}">${item.name}</a>
                            </c:forEach>
                        </div>
                    </li>
                </ul>
             </span>
            </c:if>
            <span onclick="addTab('userhelp','帮助中心')" id="_help">
            <i class="fa fa-question-circle-o" style="margin-right: 3px;z-index: -10">
            </i>帮助
        </span>
        </div>
        <ul class="f20 ml10 menu">
            <input type="hidden" name="role" value="yh">
            <shiro:hasPermission name="/pqs9200/business/glindex">
                <li><a href="javascript:void(0);" onclick="addTab('glindex','概览')" class="menuone">
                    <i class="icon iconfont icon-shouye mr10"></i>概览 </a></li>
            </shiro:hasPermission>
            <shiro:hasPermission name="/pqs9200/business/monitor">
                <li><a href="javascript:void(0);" onclick="addMonitorTab()" class="menuone">
                    <i class="icon iconfont icon-jiance mr10"></i>监测点</a></li>
            </shiro:hasPermission>
            <shiro:hasPermission name="/area">
                <li><a href="javascript:void(0);" class="menuone"><i
                        class="icon iconfont icon-ditu mr10"></i>区域</a>
                    <div class="menutwo">
                        <shiro:hasPermission name="/pqs9200/business/general">
                            <a href="javascript:void(0)" onclick="addTab('general','区域概览')">区域概览</a>
                        </shiro:hasPermission>
                        <shiro:hasPermission name="/pqs9200/business/areastatistics">
                            <a href="javascript:void(0)" onclick="addTab('areastatistics','区域统计')">区域统计</a>
                        </shiro:hasPermission>
                        <shiro:hasPermission name="/pqs9200/business/vdlist">
                            <a href="javascript:void(0)" onclick="addTab('vdlist','区域暂态列表')">区域暂态列表</a>
                        </shiro:hasPermission>
                        <shiro:hasPermission name="/pqs9200/business/balancearea">
                            <a href="javascript:void(0)" onclick="addTab('balancearea','区域暂降评估')">区域暂降评估</a>
                        </shiro:hasPermission>
                        <shiro:hasPermission name="/pqs9200/business/level">
                            <%--                            <a href="javascript:void(0)" onclick="addTab('level','区域严重度')">区域严重度</a>--%>
                        </shiro:hasPermission>
                    </div>
                </li>
            </shiro:hasPermission>
            <shiro:hasPermission name="/advanced">
                <li><a href="javascript:void(0)" class="menuone"><i
                        class="icon iconfont icon-tongji mr10"></i>高级分析</a>
                    <div class="menutwo">
                        <shiro:hasPermission name="/pqs9200/business/relevance">
                            <a href="javascript:void(0)" onclick="addTab('relevance','事件关联分析')">事件关联分析</a>
                        </shiro:hasPermission>
                        <shiro:hasPermission name="/pqs9200/business/range">
                            <a href="javascript:void(0)" onclick="addTab('range','影响范围分析')">影响范围分析</a>
                        </shiro:hasPermission>
                        <shiro:hasPermission name="/pqs9200/business/eventscompare">
                            <a href="javascript:void(0)" onclick="addTab('eventscompare','事件波形分析')">事件波形分析</a>
                        </shiro:hasPermission>
<%--                        <a href="javascript:void(0)" onclick="addTab('sagDomainShow','暂降域')">暂降域</a>--%>
                    </div>
                </li>
            </shiro:hasPermission>
            <shiro:hasPermission name="/run">
                <li><a href="javascript:void(0);" class="menuone"><i
                        class="icon iconfont icon-caidan mr10"></i>运行管理</a>
                    <div class="menutwo">
                        <!-- 						<a href="javascript:void(0)" onclick="addTab('machine','终端台账管理')">终端台账管理</a> -->
                        <shiro:hasPermission name="/pqs9200/business/runtime">
                            <a href="javascript:void(0)" onclick="addTab('runtime','终端运行管理')">终端运行管理</a>
                        </shiro:hasPermission>
                        <shiro:hasPermission name="/pqs9200/business/runtimestatus">
                            <a href="javascript:void(0)" onclick="addTab('runtimestatus','终端运行统计')">终端运行统计</a>
                        </shiro:hasPermission>
                       <%-- <shiro:hasPermission name="/pqs9200/business/lineledger">--%>
                            <a href="javascript:void(0)" onclick="addTab('/pqs9200/business/lineledger','监测点台账信息')">监测点台账信息</a>
                        <%--</shiro:hasPermission>--%>
                            <%--                        <shiro:hasPermission name="/pqs9200/business/onlinerate">--%>
                            <%--                            <a href="javascript:void(0)" onclick="addTab('onlinerate','终端在线率')">终端在线率</a>--%>
                            <%--                        </shiro:hasPermission>--%>
<%--                        <shiro:hasPermission name="/pqs9200/business/terminallog">--%>
<%--                            <a href="javascript:void(0)" onclick="addTab('terminallog','终端状态更新列表')">终端状态更新列表</a>--%>
<%--                        </shiro:hasPermission>--%>
                    </div>
                </li>
            </shiro:hasPermission>
            <!-- 用户信息的处理页面 -->
            <shiro:hasPermission name="/transientreport">
                <li><a href="javascript:void(0);" class="menuone">
                    <i class="fa fa-file-excel-o mr10"></i>暂态报告</a>
                    <div class="menutwo">
                        <shiro:hasPermission name="/pqs9200/business/weeklyreport">
                            <a href="javascript:void(0)" onclick="addTab('weeklyreport','周报')">周报</a>
                        </shiro:hasPermission>
                        <shiro:hasPermission name="/pqs9200/business/report">
                            <a href="javascript:void(0)" onclick="addTab('report','监测点报告')">监测点报告</a>
                        </shiro:hasPermission>
                        <shiro:hasPermission name="/pqs9200/business/areareport">
                            <a href="javascript:void(0)" onclick="addTab('areareport','区域报告')">区域报告</a>
                        </shiro:hasPermission>
                        <shiro:hasPermission name="/pqs9200/business/eventreport">
                            <a href="javascript:void(0)" onclick="addTab('eventreport','事件报告')">事件报告</a>
                        </shiro:hasPermission>
                    </div>
                </li>
            </shiro:hasPermission>
            <shiro:hasPermission name="/pqs9200/business/sourcemanage">
                <li><a href="javascript:void(0);" onclick="addTab('sourcemanage','资源管理')" class="menuone">
                    <i class="fa fa-cloud-download" aria-hidden="true"></i>资源管理</a></li>
            </shiro:hasPermission>
        </ul>
        <ul class="user-checkout pa" style="right: 5px;z-index: -10">
            <li style="margin-right: 0px" id="selectUserUpdatePass">
                <input id="user_name" type='hidden' value=<shiro:principal property="loginName"/>/>
                <input id="user_index" type='hidden' value=<shiro:principal property="userIndex"/>/>
                <i class="fa fa-user" style="color: #fff;font-size: 12px"></i>
                <shiro:authenticated>
                    <shiro:principal property="name"/>
                </shiro:authenticated>&nbsp;
            </li>
            <li id="destory"><i class="fa fa-power-off" style="margin-right: 5px"></i>注销</li>
        </ul>
    </div>
</header>
<div class="footer-copy clearfix">
    <div class="fl f13" style="width:50%">
        <%-- 终端异常 --%>
        <a href="javascript:void(0)" onclick="onDevice()" style="color: #fff;">
            <i class="icon iconfont icon-yichang" style="margin-right:5px;color: #f0ad4e;"></i>终端异常(<em
                style="color:#f0ad4e;" class="em" id="em"></em>)</a>
        <%-- 暂降事件 --%>
        <a href="javascript:void(0)" style="color: #fff;" onclick="onWaring()">
            <i class="glyphicon glyphicon-bell"
               style="margin-right:5px;margin-left:20px;color:#f0ad4e;"></i>暂降事件</a>
        <div class="winBox" onclick="onWaring()">
            <ul class="scroll" id="scroll">
            </ul>
        </div>
    </div>
    &nbsp;&nbsp;
    <div class="fr f13"></div>
</div>

<div id="rightContent" style="position: absolute; left: 270px; right: 20px; top: 80px;">
    <div id="tabs" style="width: 100%; height: 100%;">
        <ul>
        </ul>
    </div>
</div>

<c:if test="${displayFlag eq true}">
    <img class="switchImg" src="/pqs9200/images/switchSystem/switch.png" onclick="openDiv('div1')">
    <div id="div1" class="opendiv">
        <div class="switchTitle">系统切换 <p class="closeX" onclick="tkClose()">x</p></div>
        <c:choose>
        <c:when test="${fn:length(webItems) == 2}">
        <div id="switchDiv" class="fdz2">
            </c:when>
            <c:otherwise>
            <div id="switchDiv" class="fdz1">
                </c:otherwise>
                </c:choose>
                <div class="container-fluid">
                    <div class="row">
                        <c:forEach items="${webItems}" var="item">
                        <c:choose>
                        <c:when test="${fn:length(webItems) == 2}">
                        <div class="col-md-6" style="text-align: center">
                            </c:when>
                            <c:otherwise>
                            <div class="col-md-12" style="text-align: center">
                                </c:otherwise>
                                </c:choose>
                                <c:if test="${item.item == 'pqs9000'}">
                                    <img class="dz" item="${item.item}" src="/pqs9200/images/switchSystem/pqs9000.png"/>
                                </c:if>
                                <c:if test="${item.item == 'pqs9300'}">
                                    <img class="dz" item="${item.item}" src="/pqs9200/images/switchSystem/pqs9300.png"/>
                                </c:if>
                            </div>
                            </c:forEach>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</c:if>
<div id="bgdiv"></div>
<input type="hidden" id="dataPoint" value="monitor">
<input type="hidden" id="run_Index" value="runtime">
<script src="${ctx}/js/plugin/json/json2.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/plugin/map/apiv2.0.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/jspJS/utils/positionOffset.js"></script>
<script src="${ctx}/jspJS/utils/judgeAjaxStatus.js"></script>
<script src="${pageContext.request.contextPath}/js/basic.js"></script>
<script src="${pageContext.request.contextPath}/jspJS/main.js"></script>
<script>
    $("#swapSystem").on('mouseover', function () {
        $(".small_traggle").css("display", "block")
    })
    $("#swapSystem").on('mouseleave', function () {
        $(".small_traggle").css("display", "none")
    })

    $("#switchDiv img").on("click", function () {
        window.location.href = "/sso/user/judgeLogin?item=" + $(this).attr("item");
    })


    function getDiv(id) {
        return document.getElementById(id);
    }

    function openDiv(obj) {
        if (!getDiv(obj)) return false;
        var b = getDiv('bgdiv');
        var d = getDiv(obj);
        b.style.visibility = 'visible';
        d.style.visibility = 'visible';
        var wd = window.top.document.documentElement.clientWidth - d.offsetWidth;
        var ht = window.top.document.documentElement.clientHeight - d.offsetHeight;
        d.style.left = (wd / 2) + 'px';//横向居中
        d.style.top = (ht / 2) + 'px';//垂直居中
        b.onclick = function () {
            closeDiv(obj);
            window.onresize = null;
        };  //点击背景关闭弹出层
    }

    //关闭弹出层
    function closeDiv(obj) {
        var b = getDiv('bgdiv');
        var d = getDiv(obj);
        b.style.visibility = 'hidden';
        d.style.visibility = 'hidden';
    }

    function tkClose() {
        var tk = document.getElementById("div1");
        var tk2 = document.getElementById("bgdiv");
        tk.style.visibility = 'hidden';
        tk2.style.visibility = 'hidden';
    }

</script>

</body>
</html>
