layui.define(["jquery", "miniMenu", "element","miniPage", "miniTheme","axios","store"], function (exports) { // 定义一个模块，依赖列表包括 jQuery, miniMenu, element, miniPage, miniTheme, axios, store var $ = layui.$, // 获取 jQuery 模块并赋值给变量 $ element = layui.element, // 获取 element 模块并赋值给变量 element layer = layui.layer, // 获取 layer 模块并赋值给变量 layer miniMenu = layui.miniMenu, // 获取 miniMenu 模块并赋值给变量 miniMenu miniTheme = layui.miniTheme, // 获取 miniTheme 模块并赋值给变量 miniTheme store = layui.store, // 获取 store 模块并赋值给变量 store axios = layui.axios, // 获取 axios 模块并赋值给变量 axios miniPage = layui.miniPage; if (!/http(s*):\/\//.test(location.href)) { // 检查当前页面的URL是否以http或https开头，如果不是则执行以下代码块 var tips = "请先将项目部署至web容器（Apache/Tomcat/Nginx/IIS/等），否则部分数据将无法显示"; // 定义提示信息，告知用户需要将项目部署到Web容器中 return layer.alert(tips); // 使用layer.alert方法弹出提示框，显示上述提示信息，并终止后续代码的执行 } var miniAdmin = { // 定义一个名为miniAdmin的对象，用于存放后续的代码逻辑和功能实现 render: function (options) { options.iniUrl = options.iniUrl || null; // 初始化URL，默认为null options.logoInfo = options.logoInfo || null; // Logo信息，默认为null options.homeInfo = options.homeInfo || null; // 首页信息，默认为null options.clearUrl = options.clearUrl || null; // 清除URL，默认为null options.renderPageVersion = options.renderPageVersion || false; // 是否渲染页面版本，默认为false options.bgColorDefault = options.bgColorDefault || 0; // 默认背景颜色，默认为0 options.multiModule = options.multiModule || false; // 是否支持多模块，默认为false options.menuChildOpen = options.menuChildOpen || false; // 菜单子项是否默认展开，默认为false options.loadingTime = options.loadingTime || 1; // 加载时间，默认为1秒 options.pageAnim = options.pageAnim || false; // 页面动画效果，默认为false } // 使用axios发送GET请求获取初始化数据 axios.get(options.iniUrl).then(function (data) { // 如果返回的数据为空，显示错误信息 if (data == null) { miniAdmin.error('暂无菜单信息') } else { // 渲染logo信息 miniAdmin.renderLogo(options.logoInfo); // 渲染清除按钮 miniAdmin.renderClear(options.clearUrl); // 渲染页面动画效果 miniAdmin.renderAnim(options.pageAnim); // 监听并处理首页信息和多模块信息 miniAdmin.listen({ // 监听homeInfo属性，并传递options对象中的homeInfo值 homeInfo: options.homeInfo, // 监听multiModule属性，并传递options对象中的multiModule值 multiModule: options.multiModule, }) miniMenu.render({ // 将数据列表传递给菜单渲染函数 menuList: data.data, // 传递是否支持多模块的选项 multiModule: options.multiModule, // 传递子菜单默认打开状态的选项 menuChildOpen: options.menuChildOpen }); miniPage.render({ // 设置首页信息，从options对象中获取homeInfo属性 homeInfo: options.homeInfo, // 设置菜单列表数据，从data对象的data属性中获取 menuList: data.data, // 设置是否启用多模块功能，从options对象中获取multiModule属性 multiModule: options.multiModule, // 设置页面渲染版本，从options对象中获取renderPageVersion属性 renderPageVersion: options.renderPageVersion, // 设置子菜单是否默认打开，从options对象中获取menuChildOpen属性 menuChildOpen: options.menuChildOpen, // 定义监听切换回调函数，当触发时调用miniAdmin的renderDevice方法 listenSwichCallback: function () { miniAdmin.renderDevice(); } }); miniTheme.render({ // 设置默认背景颜色 bgColorDefault: options.bgColorDefault, // 监听事件 listen: true, }); // 删除加载器，传入加载时间参数 miniAdmin.deleteLoader(options.loadingTime); } }).catch(function () { // 捕获错误并显示错误信息 miniAdmin.error('菜单接口有误'); }) }, /** * 初始化logo * @param data */ renderLogo: function (data) { // 生成包含logo图片和标题的HTML字符串 var html = 'logo

' + data.title + '

'; // 将生成的HTML字符串插入到class为layuimini-logo的元素中 $('.layuimini-logo').html(html); }, /** * 初始化缓存地址 * @param clearUrl */ renderClear: function (clearUrl) { // 将传入的URL设置为'.layuimini-clear'元素的data-href属性值 $('.layuimini-clear').attr('data-href', clearUrl); }, /** * 切换菜单动画 * @param anim */ renderAnim: function (anim) { // 检查传入的动画参数是否存在 if (anim) { // 在ID为'layuimini-bg-color'的元素之后插入一段样式代码，用于定义页面动画效果 $('#layuimini-bg-color').after(''); } }, /** * 进入全屏 */ fullScreen: function () { // 获取文档的根元素 var el = document.documentElement; // 获取不同浏览器的全屏请求方法 var rfs = el.requestFullScreen || el.webkitRequestFullScreen; // 如果支持标准的全屏请求方法，则调用该方法 if (typeof rfs != "undefined" && rfs) { rfs.call(el); } // 如果支持ActiveXObject（主要用于IE），则通过发送F11键实现全屏 else if (typeof window.ActiveXObject != "undefined") { var wscript = new ActiveXObject("WScript.Shell"); if (wscript != null) { wscript.SendKeys("{F11}"); } } // 针对IE的msRequestFullscreen方法 else if (el.msRequestFullscreen) { el.msRequestFullscreen(); } // 针对Opera的oRequestFullscreen方法 else if (el.oRequestFullscreen) { el.oRequestFullscreen(); } // 针对Webkit内核的webkitRequestFullscreen方法 else if (el.webkitRequestFullscreen) { el.webkitRequestFullscreen(); } // 针对Firefox的mozRequestFullScreen方法 else if (el.mozRequestFullScreen) { el.mozRequestFullScreen(); } // 如果以上方法都不支持，则提示用户浏览器不支持全屏调用 else { miniAdmin.error('浏览器不支持全屏调用！'); } }, /** * 退出全屏 */ exitFullScreen: function () { // 获取文档对象 var el = document; // 定义取消全屏的方法，兼容不同浏览器 var cfs = el.cancelFullScreen || el.webkitCancelFullScreen || el.exitFullScreen; // 如果存在取消全屏方法并且该方法可用 if (typeof cfs != "undefined" && cfs) { // 调用取消全屏方法 cfs.call(el); } else if (typeof window.ActiveXObject != "undefined") { // 针对IE浏览器的处理方式 var wscript = new ActiveXObject("WScript.Shell"); if (wscript != null) { // 发送F11键以退出全屏模式 wscript.SendKeys("{F11}"); } } else if (el.msExitFullscreen) { // 针对IE11及以下版本的处理方式 el.msExitFullscreen(); } else if (el.oRequestFullscreen) { // 针对Opera浏览器的处理方式 el.oCancelFullScreen(); } else if (el.mozCancelFullScreen) { // 针对Firefox浏览器的处理方式 el.mozCancelFullScreen(); } else if (el.webkitCancelFullScreen) { // 针对Webkit内核的浏览器（如Chrome和Safari）的处理方式 el.webkitCancelFullScreen(); } else { // 如果以上所有方法都不可用，提示用户浏览器不支持全屏调用 miniAdmin.error('浏览器不支持全屏调用！'); } }, /** * 初始化设备端 */ renderDevice: function () { // 如果当前是移动设备 if (miniAdmin.checkMobile()) { // 设置工具栏图标的属性为展开状态 $('.layuimini-tool i').attr('data-side-fold', 1); // 更改工具栏图标的类名为“fa fa-outdent” $('.layuimini-tool i').attr('class', 'fa fa-outdent'); // 移除布局主体的最小化样式 $('.layui-layout-body').removeClass('layuimini-mini'); // 添加布局主体的全部显示样式 $('.layui-layout-body').addClass('layuimini-all'); } }, /** * 初始化加载时间 * @param loadingTime */ deleteLoader: function (loadingTime) { // 设置一个定时器，在指定的时间后执行回调函数 setTimeout(function () { // 使用jQuery选择器找到类名为'layuimini-loader'的元素，并使其淡出 $('.layuimini-loader').fadeOut(); }, loadingTime * 1000) // 将传入的loadingTime参数转换为毫秒 }, /** * 成功 * @param title * @returns {*} */ success: function (title) { // 调用layer.msg方法显示消息提示框 // title: 要显示的消息内容 // icon: 1 表示成功图标 // shade: 使用当前对象的shade属性作为遮罩层 // scrollbar: false 表示不显示滚动条 // time: 2000 表示消息提示框显示时间为2秒 // shadeClose: true 表示点击遮罩层可以关闭提示框 return layer.msg(title, {icon: 1, shade: this.shade, scrollbar: false, time: 2000, shadeClose: true}); }, /** * 失败 * @param title * @returns {*} */ error: function (title) { // 调用layer.msg方法显示错误消息 // title: 要显示的消息内容 // icon: 2 表示使用错误图标 // shade: 使用当前对象的shade属性值 // scrollbar: false 表示不显示滚动条 // time: 3000 表示消息显示时间为3秒 // shadeClose: true 表示点击遮罩层可以关闭消息框 return layer.msg(title, {icon: 2, shade: this.shade, scrollbar: false, time: 3000, shadeClose: true}); }, /** * 判断是否为手机 * @returns {boolean} */ checkMobile: function () { // 获取用户代理字符串并转换为小写 var ua = navigator.userAgent.toLocaleLowerCase(); // 获取平台信息并转换为小写 var pf = navigator.platform.toLocaleLowerCase(); // 判断是否为Android设备 var isAndroid = (/android/i).test(ua) || ((/iPhone|iPod|iPad/i).test(ua) && (/linux/i).test(pf)) || (/ucweb.*linux/i.test(ua)); // 判断是否为iOS设备，排除Android设备 var isIOS = (/iPhone|iPod|iPad/i).test(ua) && !isAndroid; // 判断是否为Windows Phone设备 var isWinPhone = (/Windows Phone|ZuneWP7/i).test(ua); // 获取文档的宽度 var clientWidth = document.documentElement.clientWidth; // 如果既不是Android、iOS也不是Windows Phone，并且宽度大于1024，则返回false if (!isAndroid && !isIOS && !isWinPhone && clientWidth > 1024) { return false; } else { // 否则返回true return true; } }, /** * 监听 * @param options */ listen: function (options) { // 如果 options 对象中没有 homeInfo 属性，则初始化为一个空对象 options.homeInfo = options.homeInfo || {}; } /** * 清理 */ $('body').on('click', '[data-clear]', function () { // 显示加载动画，设置2秒后自动关闭 var loading = layer.load(0, {shade: false, time: 2 * 1000}); // 清空浏览器的sessionStorage sessionStorage.clear(); // 获取清理缓存的URL var clearUrl = $(this).attr('data-href'); // 如果URL存在且不为空 if (clearUrl != undefined && clearUrl != '' && clearUrl != null) { // 发送GET请求到服务器清理缓存 $.getJSON(clearUrl, function (data, status) { // 关闭加载动画 layer.close(loading); // 根据服务器返回的状态码判断是否成功 if (data.code != 1) { // 清理失败，显示错误信息 return miniAdmin.error(data.msg); } else { // 清理成功，显示成功信息 return miniAdmin.success(data.msg); } }).fail(function () { // 请求失败，关闭加载动画并显示错误信息 layer.close(loading); return miniAdmin.error('清理缓存接口有误'); }); } else { // URL不存在或为空，直接关闭加载动画并显示成功信息 layer.close(loading); return miniAdmin.success('清除缓存成功'); } }); /** * 刷新 */ $('body').on('click', '[data-refresh]', function () { // 当点击带有 data-refresh 属性的元素时，触发此事件处理函数 miniPage.refresh(options); // 调用 miniPage 对象的 refresh 方法，并传入 options 参数进行页面刷新 miniAdmin.success('刷新成功'); // 调用 miniAdmin 对象的 success 方法，显示“刷新成功”的提示信息 }); /** * 监听提示信息 */ $("body").on("mouseenter", ".layui-nav-tree .menu-li", function () { // 如果当前是移动设备，则不执行后续代码 if (miniAdmin.checkMobile()) { return false; } // 获取当前元素的class属性值 var classInfo = $(this).attr('class'), // 获取当前元素的HTML内容 tips = $(this).prop("innerHTML"), // 获取工具栏的折叠状态 isShow = $('.layuimini-tool i').attr('data-side-fold'); // 如果工具栏未折叠且tips存在 if (isShow == 0 && tips) { // 构建提示信息HTML结构 tips = ""; // 显示提示信息 window.openTips = layer.tips(tips, $(this), { tips: [2, '#2f4056'], // 设置提示信息的位置和颜色 time: 300000, // 设置提示信息的显示时间 skin:"popup-tips", // 设置提示信息的样式 // 成功回调函数 success:function (el) { // 调整提示信息的位置 var left = $(el).position().left - 10; $(el).css({ left:left }); // 重新渲染元素 element.render(); } }); } }); $("body").on("mouseleave", ".popup-tips", function () { // 当鼠标离开具有类名 'popup-tips' 的元素时触发事件 if (miniAdmin.checkMobile()) { // 如果当前设备是移动设备，则直接返回 false，不执行后续代码 return false; } // 获取具有类名 'layuimini-tool i' 的元素的 'data-side-fold' 属性值 var isShow = $('.layuimini-tool i').attr('data-side-fold'); if (isShow == 0) { // 如果 'data-side-fold' 属性值为 0，表示侧边栏未展开 try { // 尝试关闭弹出提示框 layer.close(window.openTips); } catch (e) { // 如果关闭过程中发生异常，捕获异常并打印错误信息到控制台 console.log(e.message); } } }); /** * 全屏 */ $('body').on('click', '[data-check-screen]', function () { // 获取当前元素的 data-check-screen 属性值 var check = $(this).attr('data-check-screen'); // 如果属性值为 'full'，则进入全屏模式 if (check == 'full') { // 调用 miniAdmin 的 fullScreen 方法进入全屏模式 miniAdmin.fullScreen(); // 将属性值改为 'exit' $(this).attr('data-check-screen', 'exit'); // 修改按钮图标为压缩图标 $(this).html(''); } else { // 否则退出全屏模式 miniAdmin.exitFullScreen(); // 将属性值改为 'full' $(this).attr('data-check-screen', 'full'); // 修改按钮图标为箭头图标 $(this).html(''); } }); /** * 点击遮罩层 */ $('body').on('click', '.layuimini-make', function () { // 调用 miniAdmin 的 renderDevice 方法重新渲染设备 miniAdmin.renderDevice(); }); } }; // 导出 miniAdmin 模块 exports("miniAdmin", miniAdmin); });