wzp
2021-09-01 2891fe0769189be39c9634b2cbc1841dbd52d022
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
var objOkTab = "";
layui.use(["element", "layer", "okUtils", "okTab", "okLayer", "okContextMenu", "okHoliday"], function () {
    var okUtils = layui.okUtils;
    var $ = layui.jquery;
    var layer = layui.layer;
    var okLayer = layui.okLayer;
    var okHoliday = layui.okHoliday;
 
    var okTab = layui.okTab({
        // 菜单请求路径
        url: "/Permissions/Module/GetModuleList",
        // 允许同时选项卡的个数
        openTabNum: 30,
        // 如果返回的结果和navs.json中的数据结构一致可省略这个方法
        parseData: function (data) {
            return data;
        }
    });
    objOkTab = okTab;
 
    /**
     * 左侧导航渲染完成之后的操作
     */
    okTab.render(function () {
        /**tab栏的鼠标右键事件**/
        $("body .ok-tab").okContextMenu({
            width: 'auto',
            itemHeight: 30,
            menu: [
                {
                    text: "定位所在页",
                    icon: "ok-icon ok-icon-location",
                    callback: function () {
                        okTab.positionTab();
                    }
                },
                {
                    text: "关闭当前页",
                    icon: "ok-icon ok-icon-roundclose",
                    callback: function () {
                        okTab.tabClose(1);
                    }
                },
                {
                    text: "关闭其他页",
                    icon: "ok-icon ok-icon-roundclose",
                    callback: function () {
                        okTab.tabClose(2);
                    }
                },
                {
                    text: "关闭所有页",
                    icon: "ok-icon ok-icon-roundclose",
                    callback: function () {
 
                        okTab.tabClose(3);
                    }
                }
            ]
        });
    });
 
    /**
     * 添加新窗口
     */
    $("body").on("click", "#navBar .layui-nav-item a, #userInfo a", function () {
        // 如果不存在子级
        if ($(this).siblings().length == 0) {
            okTab.tabAdd($(this));
        }
        // 关闭其他展开的二级标签
        $(this).parent("li").siblings().removeClass("layui-nav-itemed");
        if (!$(this).attr("lay-id")) {
            var topLevelEle = $(this).parents("li.layui-nav-item");
            var childs = $("#navBar > li > dl.layui-nav-child").not(topLevelEle.children("dl.layui-nav-child"));
            childs.removeAttr("style");
        }
    });
 
    /**
     * 左侧菜单展开动画
     */
    $("#navBar").on("click", ".layui-nav-item a", function () {
        if (!$(this).attr("lay-id")) {
            var superEle = $(this).parent();
            var ele = $(this).next('.layui-nav-child');
            var height = ele.height();
            ele.css({ "display": "block" });
            // 是否是展开状态
            if (superEle.is(".layui-nav-itemed")) {
                ele.height(0);
                ele.animate({ height: height + "px" }, function () {
                    ele.css({ height: "auto" });
                });
            } else {
                ele.animate({ height: 0 }, function () {
                    ele.removeAttr("style");
                });
            }
        }
    });
 
    /**
     * 左边菜单显隐功能
     */
    $(".ok-menu").click(function () {
        $(".layui-layout-admin").toggleClass("ok-left-hide");
        $(this).find("i").toggleClass("ok-menu-hide");
        localStorage.setItem("isResize", false);
        setTimeout(function () {
            localStorage.setItem("isResize", true);
        }, 1200);
    });
 
    /**
     * 移动端的处理事件
     */
    $("body").on("click", ".layui-layout-admin .ok-left a[data-url], .ok-make", function () {
        if ($(".layui-layout-admin").hasClass("ok-left-hide")) {
            $(".layui-layout-admin").removeClass("ok-left-hide");
            $(".ok-menu").find('i').removeClass("ok-menu-hide");
        }
    });
 
    /**
     * tab左右移动
     */
    $("body").on("click", ".okNavMove", function () {
        var moveId = $(this).attr("data-id");
        var that = this;
        okTab.navMove(moveId, that);
    });
 
    /**
     * 刷新当前tab页
     */
    $("body").on("click", ".ok-refresh", function () {
        okTab.refresh(this);
    });
 
    /**
     * 关闭tab页
     */
    $("body").on("click", "#tabAction a", function () {
        var num = $(this).attr("data-num");
        okTab.tabClose(num);
    });
 
    /**
     * 键盘的事件监听
     */
    $("body").on("keydown", function (event) {
        event = event || window.event || arguments.callee.caller.arguments[0];
 
        // 按 Esc
        if (event && event.keyCode === 27) {
            console.log("Esc");
            $("#fullScreen").children("i").eq(0).removeClass("layui-icon-screen-restore");
        }
        // 按 F11
        if (event && event.keyCode == 122) {
            console.log("F11");
            $("#fullScreen").children("i").eq(0).addClass("layui-icon-screen-restore");
        }
    });
 
    /**
     * 全屏/退出全屏
     */
    $("body").on("click", "#fullScreen", function () {
        if ($(this).children("i").hasClass("layui-icon-screen-restore")) {
            screenFun(2).then(function () {
                $("#fullScreen").children("i").eq(0).removeClass("layui-icon-screen-restore");
            });
        } else {
            screenFun(1).then(function () {
                $("#fullScreen").children("i").eq(0).addClass("layui-icon-screen-restore");
            });
        }
    });
 
    /**
     * 全屏和退出全屏的方法
     * @param num 1代表全屏 2代表退出全屏
     * @returns {Promise}
     */
    function screenFun(num) {
        num = num || 1;
        num = num * 1;
        var docElm = document.documentElement;
 
        switch (num) {
            case 1:
                if (docElm.requestFullscreen) {
                    docElm.requestFullscreen();
                } else if (docElm.mozRequestFullScreen) {
                    docElm.mozRequestFullScreen();
                } else if (docElm.webkitRequestFullScreen) {
                    docElm.webkitRequestFullScreen();
                } else if (docElm.msRequestFullscreen) {
                    docElm.msRequestFullscreen();
                }
                break;
            case 2:
                if (document.exitFullscreen) {
                    document.exitFullscreen();
                } else if (document.mozCancelFullScreen) {
                    document.mozCancelFullScreen();
                } else if (document.webkitCancelFullScreen) {
                    document.webkitCancelFullScreen();
                } else if (document.msExitFullscreen) {
                    document.msExitFullscreen();
                }
                break;
        }
 
        return new Promise(function (res, rej) {
            res("返回值");
        });
    }
 
    /**
     * 系统公告
     */
    $(document).on("click", "#notice", noticeFun);
 
    function noticeFun() {
        var srcWidth = okUtils.getBodyWidth();
        layer.open({
            type: 0, title: "系统公告", btn: "我知道啦", btnAlign: 'c', content: getContent(),
        });
    }
 
    function getContent() {
        let content = "";
        content = "版权声明:<br/>" +
            "ok-admin 和 FineAdmin.Mvc都使用GPL-3.0开源协议,个人<span style='color:#5cb85c'>免费使用</span>,商用请联系作者<span style='color:#ff5722'>获取授权</span><br/>" +
            "作者:bobi<br/>" +
            "ok-admin开源地址:<a style='color:#ff5722;' target='_blank' href='https://gitee.com/bobi1234/ok-admin'><span>ok-admin</span></a><br/>" +
            "作者:Liu_Cabbage (我自己)<br/>" +
            "FineAdmin.Mvc开源地址:<a style='color:#ff5722;' target='_blank' href='https://gitee.com/Liu_Cabbage/FineAdmin.Mvc'><span>FineAdmin.Mvc</span></a>";
        return content;
    }
 
 
    /**
     * 弹窗皮肤
     */
    $("#alertSkin").click(function () {
        okLayer.open("皮肤动画", "/alertSkin.html", "50%", "45%", function (layero) {
        }, function () {
        });
    });
});