index.html 15.1 KB
<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" th:with="corp = ${@corporationService.getEnableCorporation()}">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="renderer" content="webkit">
    <title>华恒管理系统</title>
    <meta name="keywords" th:attr="content=${corp}?${corp.getName()}">
    <meta name="description" th:attr="content=${corp}?${corp.getName()}">
    <meta name="description" th:attr="content=${corp}?${corp.getName()}">
    <!--[if lt IE 9]>
    <meta http-equiv="refresh" content="0;ie.html"/>
    <![endif]-->
    <link rel="shortcut icon" href="../static/favicon.ico" th:href="${corp}?${corp.getPIcon()}:@{favicon.ico}"/>
    <!--<link th:href="@{favicon.ico}" rel="shortcut icon"/>-->
    <link th:href="@{/css/bootstrap.min.css}" rel="stylesheet"/>
    <link th:href="@{/css/font-awesome.css}" rel="stylesheet"/>
    <link th:href="@{/css/animate.css}" rel="stylesheet"/>
    <link th:href="@{/css/style.css}" rel="stylesheet"/>
    <link th:href="@{/huaheng/css/huahengUI.min.css?v=2.3.0}" rel="stylesheet"/>
    <style type="text/css">
        .dropdown-menu .divider {
            height: 1px;
            margin: 0px 0 10px 0;
            overflow: hidden;
            background-color: #e5e5e5;
        }
    </style>
</head>
<body class="fixed-sidebar full-height-layout gray-bg" style="overflow: hidden"
      th:classappend="${@config.getKey('sys.index.skinName')}">
<div id="wrapper">

    <!--左侧导航开始-->
    <nav class="navbar-default navbar-static-side" role="navigation">
        <div class="nav-close">
            <i class="fa fa-times-circle"></i>
        </div>
        <div class="sidebar-collapse">
            <ul class="nav" id="side-menu">
                <li class="nav-header">
                    <div class="dropdown profile-element">
                         <span class="pull-left" style="padding-right: 10px;">
                            <img th:src="(${user.avatar} == '') ? (${corp}?${corp.getPLogoSmall()}:'img/profile.jpg') : 'profile/' + ${user.avatar}"
                                 alt="image" class="img-circle" height="45" width="45"/>
                         </span>
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                          <span class="pull-left clear">
                              <span class="block m-t-xs"><strong class="font-bold">[[${user.userName}]]</strong></span>
                              <span class="text-muted text-xs block"><span th:if="${not #strings.isEmpty(user.dept)}">[[${user.dept.deptName}]]</span>
                                  <b class="caret"></b>
                              </span>
                          </span>
                        </a>
                        <ul class="dropdown-menu animated fadeInRight m-t-xs" style="position:absolute;top:40px;">
                            <li><a class="menuItem" th:href="@{/system/user/profile}">个人信息</a></li>
                            <li><a th:href="@{logout}">退出</a></li>
                        </ul>
                        <div class="dw"><i class="fa fa-map-marker"></i>&nbsp;<span id="warehouse_name"></span></div>
                    </div>

                </li>
                <li class="active">
                    <a href="index.html"><i class="fa fa-home"></i> <span class="nav-label">主页</span> <span
                            class="fa arrow"></span></a>
                    <ul class="nav nav-second-level">
                        <li class="active"><a class="menuItem" th:href="@{/system/main}">&nbsp;&nbsp;&nbsp;&nbsp;</a>
                        </li>
                    </ul>
                </li>
                <li th:each="menu : ${menus}">
                    <a href="#">
                        <i class="fa fa fa-bar-chart-o" th:class="${menu.icon}"></i>
                        <span class="nav-label" th:text="${menu.menuName}">一级菜单</span>
                        <span class="fa arrow"></span>
                    </a>
                    <ul class="nav nav-second-level collapse">
                        <li th:each="cmenu : ${menu.children}">
                            <a th:if="${#lists.isEmpty(cmenu.children)}" class="menuItem" th:utext="${cmenu.menuName}"
                               th:href="@{${cmenu.url}}">二级菜单</a>
                            <a th:if="${not #lists.isEmpty(cmenu.children)}" href="#">[[${cmenu.menuName}]]<span
                                    class="fa arrow"></span></a>
                            <ul th:if="${not #lists.isEmpty(cmenu.children)}" class="nav nav-third-level">
                                <li th:each="emenu : ${cmenu.children}">
                                    <a th:if="${#lists.isEmpty(emenu.children)}" class="menuItem"
                                       th:text="${emenu.menuName}" th:href="@{${emenu.url}}">三级菜单</a>
                                    <a th:if="${not #lists.isEmpty(emenu.children)}" href="#">[[${emenu.menuName}]]<span
                                            class="fa arrow"></span></a>
                                    <ul th:if="${not #lists.isEmpty(emenu.children)}" class="nav nav-four-level">
                                        <li th:each="fmenu : ${emenu.children}"><a
                                                th:if="${#lists.isEmpty(fmenu.children)}" class="menuItem"
                                                th:text="${fmenu.menuName}" th:href="@{${fmenu.url}}">四级菜单</a></li>
                                    </ul>
                                </li>
                                <!--								<li th:each="emenu : ${cmenu.children}"><a class="menuItem" th:text="${emenu.menuName}" th:href="@{${emenu.url}}">三级菜单</a></li>-->
                            </ul>
                        </li>
                    </ul>
                </li>
            </ul>
        </div>
    </nav>
    <!--左侧导航结束-->

    <!--右侧部分开始-->
    <div id="page-wrapper" class="gray-bg dashbard-1">

        <div class="row content-tabs">
            <a class="navbar-minimalize minimalize-styl-2 btn btn-default " href="#" title="收起菜单">
                <i class="fa fa-bars"></i>
            </a>
            <button class="roll-nav roll-left tabLeft">
                <i class="fa fa-backward"></i>
            </button>
            <nav class="page-tabs menuTabs">
                <div class="page-tabs-content">
                    <a href="javascript:;" class="active menuTab" data-id="system/main">首页</a>
                </div>
            </nav>
            <button class="roll-nav roll-right tabRight0">
                <i class="fa fa-forward"></i>
            </button>
            <!--<button class="roll-nav roll-right tabRight xx">
                <a href="#" data-toggle="dropdown"> <i class="fa fa-envelope"></i><sup></sup></a>
                &lt;!&ndash;<span class="label label-primary">8</span>&ndash;&gt;
            </button>-->
            <!--消息-->
            <div class="xx_box">
                <a class="dropdown-toggle count-info xx" id="dropdown" data-toggle="dropdown" href="#">
                    <i class="fa fa-envelope"></i> <sup></sup> <!--<span class="label label-warning">16</span>-->
                </a>
                <ul class="dropdown-menu dropdown-messages" id="notice">
                    <div class="col-sm-12">
                        <li>
                            <div style="float:left" class="text-left col-sm-5">
                                <a class="menuItem" th:href="@{/system/notice/mailbox}" onclick="cancelIt()">
                                    <i class="fa fa-user-circle"></i> <strong>消息中心</strong>
                                </a>
                            </div>
                            <div style="float:right" class="text-right col-sm-7">
                                <a onclick="readAll()">
                                    <i class="fa fa-envelope"></i> <strong>阅读所有消息</strong>
                                </a>
                            </div>
                        </li>
                    </div>
                    <li th:each="notice : ${notices}">
                        <div class="dropdown-messages-box" th:id="${notice.id}">
                            <a class="media-body" th:onclick="readOne([[${notice.id}]])" >
                                <p th:text="${notice.content}"
                                   style="line-height: 18px;padding-bottom: 0;margin-bottom: 0"></p>
                                <small class="text-muted" style="color:#bdbdbd"
                                       th:text="${#dates.format(notice.created, 'yyyy-MM-dd HH:mm:ss')}"></small>
                            </a>
                        </div>
                    </li>
                </ul>
            </div>
            <!--消息-->
            <div class="btn-group roll-nav roll-right">
                <button class="dropdown J_tabClose" data-toggle="dropdown">
                    页签操作<span class="caret"></span>
                </button>
                <ul role="menu" class="dropdown-menu dropdown-menu-right">
                    <li><a class="tabCloseOther" href="javascript:void(0);">关闭其他</a></li>
                    <li><a class="tabCloseCurrent" href="javascript:void(0);">关闭当前</a></li>
                    <li><a class="tabCloseAll" href="javascript:void(0);">全部关闭</a></li>
                </ul>
            </div>
            <div class="mlist">
                <ul>
                    <li><a id="fullScreen"><i class="fa fa-arrows-alt"></i> 全屏</a></li>
                    <li><a class="tabReload"><i class="fa fa-refresh"></i> 刷新</a></li>
                </ul>
            </div>

        </div>
        <div class="row mainContent" id="content-main">
            <iframe class="huaheng_iframe" name="iframe0" width="100%" height="100%" data-id="system/main"
                    th:src="@{/system/main}" frameborder="0" seamless></iframe>
        </div>
        <div class="footer">
            <div class="pull-right">© [[${copyrightYear}]] 长沙华恒机器人系统有限公司 Copyright</div>
        </div>
    </div>
    <!--右侧部分结束-->
</div>
<!-- 全局js -->
<script th:src="@{/js/jquery.min.js}"></script>
<script th:src="@{/js/bootstrap.min.js}"></script>
<script th:src="@{/js/plugins/metisMenu/jquery.metisMenu.js}"></script>
<script th:src="@{/js/plugins/slimscroll/jquery.slimscroll.min.js}"></script>
<script th:src="@{/ajax/libs/blockUI/jquery.blockUI.js}"></script>
<!--<script src="http://tajs.qq.com/stats?sId=62048022"></script>-->
<script th:src="@{/huaheng/js/huahengUI.min.js?v=2.3.0}"></script>
<script th:src="@{/huaheng/index.js}"></script>
<script th:src="@{/huaheng/js/common.js}"></script>
<script th:src="@{/ajax/libs/fullscreen/jquery.fullscreen.js}"></script>
<script>
    var warehouse_name = localStorage.getItem("warehouse_name");
    $("#warehouse_name").text(warehouse_name);
    // localStorage.removeItem("warehouse_name");

    $(".nav>li>ul>li>ul>li").on({
        mouseover: function () {
            var juli = $(this).offset().top;
            $(this).children('ul').css({
                'padding-top': juli
            })
        },
        mouseout: function () {
            $(".link").hide();
        }
    });

    let socket;

    if (typeof (WebSocket) == "undefined") {
        console.log("您的浏览器不支持WebSocket");
        alert("您的浏览器不支持WebSocket");
    } else {
        console.log("您的浏览器支持WebSocket");
        let userId = [[${@permission.getPrincipalProperty('id')}]];
        //实现化WebSocket对象,指定要连接的服务器地址与端口  建立连接
        //等同于socket = new WebSocket("ws://localhost:8888/xxxx/im/25");
        //var socketUrl="${request.contextPath}/im/"+$("#userId").val();
        let url = window.location.host;
        let socketUrl = "http://" + url + "/wms/imserver/" + userId;
        socketUrl = socketUrl.replace("https", "ws").replace("http", "ws");
        console.log(socketUrl);
        if (socket != null) {
            socket.close();
            socket = null;
        }
        socket = new WebSocket(socketUrl);
        //打开事件
        socket.onopen = function () {
            console.log("websocket已打开");
            //socket.send("这是来自客户端的消息" + location.href + new Date());
        };
        //获得消息事件
        socket.onmessage = function (msg) {
            if (msg.data !== "连接成功") {
                //向通知里插入消息
                let message = "<li><div class=\"dropdown-messages-box\"><div class=\"media-body\"><p>" + msg.data + "</p>\n" +
                    "<small class=\"text-muted\" style=\"position: relative;top:-30px;\">" + getCurrentDate(2) + "</small></div></div></li>"
            }
            console.log(msg.data);
        };
        //关闭事件
        socket.onclose = function () {
            console.log("websocket已关闭");
            $.modal.alertError("websocket已关闭");
        };
        //发生了错误事件
        socket.onerror = function () {
            console.log("websocket发生了错误");
            $.modal.alertError("websocket发生了错误");
        }
    }

    function getCurrentDate(format) {
        let now = new Date();
        let year = now.getFullYear(); //得到年份
        let month = now.getMonth();//得到月份
        let date = now.getDate();//得到日期
        let day = now.getDay();//得到周几
        let hour = now.getHours();//得到小时
        let minu = now.getMinutes();//得到分钟
        let sec = now.getSeconds();//得到秒
        month = month + 1;
        if (month < 10) month = "0" + month;
        if (date < 10) date = "0" + date;
        if (hour < 10) hour = "0" + hour;
        if (minu < 10) minu = "0" + minu;
        if (sec < 10) sec = "0" + sec;
        var time = "";
        //精确到天
        if (format == 1) {
            time = year + "-" + month + "-" + date;
        }
        //精确到分
        else if (format == 2) {
            time = year + "-" + month + "-" + date + " " + hour + ":" + minu + ":" + sec;
        }
        return time;
    }


    function cancelIt() {
        $("#dropdown").click()

    }

    function readAll() {
        $.ajax({
            url:"system/notice/readAll",
            type:"get",
            success:function (response) {
                    location.reload()
            },
            error:function (response) {
                $.modal.alertError("服务出错")
            }
        })
    }

    function readOne(id) {
        $.ajax({
            url:"system/notice/readOne",
            type:"get",
            data:{id:id},
            success:function (response) {
                if (response.code == 200){
                    $("#"+id).remove()
                    createMenuItem("system/notice/mailbox","消息中心");
                }else {
                    $.modal.alertError(response.msg)
                }
            },
            error:function (response) {
                $.modal.alertError("服务出错")
            }
        })
    }
</script>
</body>
</html>