stylefeng-guns
/
src
/
main
/
webapp
/
pages
/
index.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link href="${ctxPath}/assets/expand/images/favicon.ico" rel="icon">
    <title>${constants.getSystemName()}</title>
    <link rel="stylesheet" href="${ctxPath}/assets/common/libs/layui/css/layui.css?v=${constants.getReleaseVersion()}"/>
    <link rel="stylesheet" href="${ctxPath}/assets/common/module/admin.css?v=${constants.getReleaseVersion()}"/>
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin">
    <!-- 头部 -->
    @include("/layout/_header.html"){}

    <!-- 侧边栏 -->
    @include("/layout/_sidebar.html"){}

    <!-- 主体部分 -->
    @include("/layout/_body.html"){}

    <!-- 底部 -->
    @include("/layout/_footer.html"){}

</div>

<!-- 加载动画 -->
@include("/layout/loading.html"){}

<!-- js全局变量 -->
<script type="text/javascript">
    var Feng = {
        ctxPath: "${ctxPath}",
        version: '${constants.getReleaseVersion()}',
        wsUrl: '${wsUrl}',
        userId: '${userId}'
    };
</script>
<script type="text/javascript" src="${ctxPath}/assets/common/libs/layui/layui.js?v=${constants.getReleaseVersion()}"></script>
<script type="text/javascript" src="${ctxPath}/assets/common/js/common.js?v=${constants.getReleaseVersion()}"></script>

<script>
    // 全局消息类型声明
    window.WEB_SOCKET_MSG_TYPE = {
        SERVER: {
            SYS_NOTICE_MSG_TYPE: "100001"
        },
        CLIENT: {
            USER_ADD_MSG_TYPE: "200001"
        }
    }

    // 全局消息类型和回调函数维护中心
    window.msgTypeCallBackMap = new Map()

    // 新增一个回调
    window.insertCallback = (msgType, func) => {
        msgTypeCallBackMap.set(msgType, func)
    }

    // 删除一个回调
    window.deleteCallback = (msgType) => {
        msgTypeCallBackMap.delete(msgType)
    }

    layui.use(['layer', 'element', 'admin', 'index', 'HttpRequest', 'ws', 'notice', 'i18n'], function () {
        var $ = layui.jquery;
        var layer = layui.layer;
        var admin = layui.admin;
        var index = layui.index;
        var HttpRequest = layui.HttpRequest;
        var ws = layui.ws;
        var notice = layui.notice;
        var i18n = layui.i18n;

        //获取支持的语言列表
        let languageTypes = i18n.getLanguageTypes();
        for (var i = 0; i < languageTypes.length; i++) {
            var code = languageTypes[i].code;
            var description = languageTypes[i].name;
            $("#languageDiv").append('<dd lay-unselect><a id="tran-' + code + '" href="javascript:;">' + description + '</a></dd>');

            //设置监听事件，设置点击按钮切换当前系统语言
            (function (code) {
                $('#tran-' + code).click(function () {
                    i18n.changeUserTranslation(code);
                });
            })(code);
        }

        // 记载并缓存翻译的字典
        i18n.loadAndCacheTranslation();

        // 默认加载主页
        index.loadHome({
            menuPath: $("#firstPageAction").attr('lay-href'),
            menuName: '<i class="layui-icon layui-icon-home"></i>'
        });

        // 修改密码点击事件
        $('#setPsw').click(function () {
            admin.open({
                id: 'pswForm',
                type: 2,
                title: i18n.translate('TITLE_CHANGE_PASSWORD', '修改密码'),
                shade: 0,
                content: '${ctxPath}/view/changePassword'
            });
        });

        // 退出登录点击事件
        $('#btnLogout').click(function () {
            var request = new HttpRequest(Feng.ctxPath + "/logoutAction", 'post', function (data) {
                Feng.success("退出成功!");
                window.location.href = Feng.ctxPath + "/";
            }, function (data) {
                layer.msg("退出失败！" + data.message, {icon: 5, anim: 6});
            });
            request.start();
        });

        // 全局WebSocket加载
        window.wsInst = ws.render({
            wsUrl: Feng.wsUrl, //WebSocket的地址
            connectErr: (event) => {
                console.log(event)
                //如果不支持websocket 回调
            },
            onWsError: (event) => {
                //发生连接错误回调
            },
            onWsOpen: (event) => {
                // 绑定用户
                let initMsg = {
                    "clientMsgType": WEB_SOCKET_MSG_TYPE.CLIENT.USER_ADD_MSG_TYPE,
                    "formUserId": Feng.userId,
                    "data": WEB_SOCKET_MSG_TYPE.SERVER.SYS_NOTICE_MSG_TYPE
                };
                wsInst.send(JSON.stringify(initMsg));
            },
            onWsMessage: (event) => {
                //服务器发送消息回调
                let data = event.data;
                try {
                    let originalData = JSON.parse(data)
                    let func = msgTypeCallBackMap.get(originalData.serverMsgType);
                    if (func) {
                        eval(func(originalData));
                    }
                } catch (e) {
                }
            },
            onWsClose: (event) => {
                //关闭连接回调
            },

            wsSend: (event) => {
                //发送成功后的回调
            },
        })

        // 注册系统消息监听
        window.insertCallback(window.WEB_SOCKET_MSG_TYPE.SERVER.SYS_NOTICE_MSG_TYPE, (massage) => {
            notice.info({
                title: '[' + massage.data.businessTypeValue + ']' + massage.data.messageTitle,
                message: massage.data.messageContent,
                timeout: false
            });
            $('#messageDot').show();
        })

    });
</script>
</body>

</html>