layui-扩展模块开发文档
enian - 文档库

layui扩展模块 - enianWindow窗口模块 开发文档

enianWindow 多窗口模块优化了layer传统的缩小化操作，以及状态栏的显示方式，操作习惯和样式更具有win10风格。目前仅支持iframe页面，后续完善更多功能。

初始化 init：

此方法必须优先调用

完整示例
  1. enianWindow.init({
  2.     //状态栏按钮
  3.     taskBtns:{
  4.         //左侧按钮
  5.         left:[
  6.               ['sun','<i class="iconfont icon-win"></i>']
  7.               ['yi','<i class="iconfont icon-guanbi"  title="最小化"></i>']
  8.           ],
  9.         //右侧按钮
  10.           right:[
  11.             ['min-all','<i class="iconfont icon-zuixiao"  title="缩小化所有"></i>']
  12.           ]
  13.     },
  14.     //css配置
  15.     cssConfig:{
  16.         // iframe_theme_color :'#c63b36'
  17.         iframe_text_color : 'white' //文字颜色
  18.         ,iframe_text_hover_background : '#2d527e' //文字hover背景颜色
  19.         ,task_bar_project_color : '#cecece' //任务栏项目颜色
  20.         ,task_bar_project_selected_color :'white' //任务栏项目选中颜色（活动窗口）
  21.     },
  22.     taskBtnsClick:function(className){
  23.         // if(className == 'min-all'){
  24.         //     var list = enianWindow.windowsList();
  25.         //     for (var i = 0; i < list['item'].length; i++) {
  26.         //         enianWindow.min(list['item'][i]);
  27.         //     }
  28.         // }
  29.         console.log('状态栏按钮被单击',className);
  30.     },
  31.     success:function(layero,index){
  32.         console.log('窗口模块初始化完成',layero,index);
  33.     }
  34. });

打开一个新窗 open：

  1. enianWindow.open({
  2.       url:'http://enianteam.com',
  3.       title:'这是标题',
  4.       area:['700px', '500px'],
  5.       moveOut:false,
  6.       btn1:['setting-btn','<i class="layui-icon layui-icon-set-fill"></i>'],
  7.     btn2:['setting-btn','<i class="layui-icon layui-icon-set-fill"></i>'],
  8.       btnClick:function(btnClassName,index){
  9.           console.log('窗口按钮被点击',btnClassName,index)
  10.       },
  11.       end:function(){
  12.           console.log('窗口被销毁了');
  13.           //console.log('窗口列表',enianWindow.windowsList());
  14.       }
  15. })

窗口其他相关函数

  1. //获取所有窗口列表
  2. enianWindow.windowsList()
  4. //关闭窗口
  5. enianWindow.close(index)//index为窗口索引值
  7. //关闭所有窗口（为了简化模块代码并未单独加入关闭所有窗口的函数）
  8. var list = enianWindow.windowsList();
  9. for (var i = 0; i < list['item'].length; i++) {
  10.   enianWindow.close(list['item'][i]);
  11. }
  13. //设置窗口坐标
  14. //参数分别：窗口索引，顶部，左边，高度，宽度
  15. enianWindow.setWindowSize(index,top,left,height,width)
  17. //(最小化)隐藏窗口
  18. enianWindow.min(index,callback)
  20. //恢复显示窗口
  21. enianWindow.block(index,callback)

任务栏其他相关函数：

  1. //隐藏任务栏
  2. enianWindow.taskDisplay(false);
  3. //显示任务栏
  4. enianWindow.taskDisplay(true);
  6. //隐藏任务栏移动按钮
  7. enianWindow.taskBarBtnMoveDisplay(false)
  8. //显示任务栏移动按钮
  9. enianWindow.taskBarBtnMoveDisplay(true)