bodyTab.js 8.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196
  1. /*
  2. @Author: 请叫我马哥
  3. @Time: 2017-04
  4. @Tittle: tab
  5. @Description: 点击对应按钮添加新窗口
  6. */
  7. var tabFilter, menu = [],
  8. liIndex, curNav, delMenu;
  9. layui.define(["element", "jquery"], function (exports) {
  10. var element = layui.element,
  11. $ = layui.jquery,
  12. layId,
  13. Tab = function () {
  14. this.tabConfig = {
  15. closed: true,
  16. openTabNum: 100,
  17. tabFilter: "bodyTab"
  18. }
  19. };
  20. var _this = this;
  21. $.ajax({
  22. url: 'mainMenu?sysId=' + location.searchObj().sysId,
  23. data: {
  24. requestMode: 0
  25. },
  26. async: false,
  27. success: function (res) {
  28. //layer.closeAll('loading'); //关闭加载层
  29. if (!(res.retHead.errCode - 0)) {
  30. navs = res.retBody.list;
  31. if (!navs) {
  32. return;
  33. }
  34. //显示左侧菜单
  35. if ($(".navBar").html() == '') {
  36. $(".navBar").html(navBar(navs)).height($(window).height() - 60);
  37. $('.navBar li').find('cite').each(function () {
  38. if($(this).text()=='功能权限'){
  39. $(this).parents('li').addClass('layui-this')
  40. }
  41. });
  42. element.init(); //初始化页面元素
  43. $(window).resize(function () {
  44. $(".navBar").height($(window).height() - 60);
  45. })
  46. }
  47. } else if ((res.retHead.errCode - 0) == 1004) {
  48. top.location.href = window.hywa.jumpPage.login;
  49. }
  50. }
  51. });
  52. //参数设置
  53. Tab.prototype.set = function (option) {
  54. var _this = this;
  55. $.extend(true, _this.tabConfig, option);
  56. return _this;
  57. };
  58. //通过title获取lay-id
  59. Tab.prototype.getLayId = function (title) {
  60. $(".layui-tab-title.top_tab li").each(function () {
  61. if ($(this).find("cite").text() == title) {
  62. layId = $(this).attr("lay-id");
  63. }
  64. })
  65. return layId;
  66. }
  67. //通过title判断tab是否存在
  68. Tab.prototype.hasTab = function (title) {
  69. var tabIndex = -1;
  70. $(".layui-tab-title.top_tab li").each(function () {
  71. if ($(this).find("cite").text() == title) {
  72. tabIndex = 1;
  73. }
  74. })
  75. return tabIndex;
  76. }
  77. //右侧内容tab操作
  78. var tabIdIndex = 0;
  79. Tab.prototype.tabAdd = function (_this) {
  80. if (window.sessionStorage.getItem("menu")) {
  81. menu = JSON.parse(window.sessionStorage.getItem("menu"));
  82. }
  83. var that = this;
  84. var closed = that.tabConfig.closed,
  85. openTabNum = that.tabConfig.openTabNum;
  86. tabFilter = that.tabConfig.tabFilter;
  87. // $(".layui-nav .layui-nav-item a").on("click",function(){
  88. if (_this.find("i.iconfont,i.layui-icon").attr("data-icon") != undefined) {
  89. var title = '';
  90. if (that.hasTab(_this.find("cite").text()) == -1 && _this.siblings("dl.layui-nav-child").length ==
  91. 0) {
  92. if ($(".layui-tab-title.top_tab li").length == openTabNum) {
  93. layer.msg('只能同时打开' + openTabNum + '个选项卡哦。不然系统会卡的!');
  94. return;
  95. }
  96. tabIdIndex++;
  97. // if (_this.find("i.iconfont").attr("data-icon") != undefined) {
  98. // title += '<i class="iconfont ' + _this.find("i.iconfont").attr("data-icon") + '"></i>';
  99. // } else {
  100. // title += '<i class="layui-icon">' + _this.find("i.layui-icon").attr("data-icon") +
  101. // '</i>';
  102. // }
  103. title += '<cite>' + _this.find("cite").text() + '</cite>';
  104. title += '<i class="layui-icon layui-unselect layui-tab-close" data-id="' + tabIdIndex +
  105. '">&#x1006;</i>';
  106. element.tabAdd(tabFilter, {
  107. title: title,
  108. content: "<iframe src='" + _this.attr("data-url") + "' data-id='" + tabIdIndex +
  109. "'></frame>",
  110. id: new Date().getTime()
  111. })
  112. //当前窗口内容
  113. var curmenu = {
  114. "icon": _this.find("i.iconfont").attr("data-icon") != undefined ? _this.find(
  115. "i.iconfont").attr("data-icon") : _this.find("i.layui-icon").attr(
  116. "data-icon"),
  117. "title": _this.find("cite").text(),
  118. "href": _this.attr("data-url"),
  119. "layId": new Date().getTime()
  120. }
  121. menu.push(curmenu);
  122. window.sessionStorage.setItem("menu", JSON.stringify(menu)); //打开的窗口
  123. window.sessionStorage.setItem("curmenu", JSON.stringify(curmenu)); //当前的窗口
  124. element.tabChange(tabFilter, that.getLayId(_this.find("cite").text()));
  125. } else {
  126. //当前窗口内容
  127. var curmenu = {
  128. "icon": _this.find("i.iconfont").attr("data-icon") != undefined ? _this.find(
  129. "i.iconfont").attr("data-icon") : _this.find("i.layui-icon").attr(
  130. "data-icon"),
  131. "title": _this.find("cite").text(),
  132. "href": _this.attr("data-url"),
  133. "layId": new Date().getTime()
  134. }
  135. window.sessionStorage.setItem("curmenu", JSON.stringify(curmenu)); //当前的窗口
  136. element.tabChange(tabFilter, that.getLayId(_this.find("cite").text()));
  137. }
  138. }
  139. // })
  140. }
  141. $("body").on("click", ".top_tab li", function () {
  142. //切换后获取当前窗口的内容
  143. var curmenu = '';
  144. var menu = JSON.parse(window.sessionStorage.getItem("menu"));
  145. curmenu = menu[$(this).index() - 1];
  146. if ($(this).index() == 0) {
  147. window.sessionStorage.setItem("curmenu", '');
  148. } else {
  149. window.sessionStorage.setItem("curmenu", JSON.stringify(curmenu));
  150. if (window.sessionStorage.getItem("curmenu") == "undefined") {
  151. //如果删除的不是当前选中的tab,则将curmenu设置成当前选中的tab
  152. if (curNav != JSON.stringify(delMenu)) {
  153. window.sessionStorage.setItem("curmenu", curNav);
  154. } else {
  155. window.sessionStorage.setItem("curmenu", JSON.stringify(menu[liIndex - 1]));
  156. }
  157. }
  158. }
  159. element.tabChange(tabFilter, $(this).attr("lay-id")).init();
  160. })
  161. //删除tab
  162. $("body").on("click", ".top_tab li i.layui-tab-close", function () {
  163. //删除tab后重置session中的menu和curmenu
  164. liIndex = $(this).parent("li").index();
  165. var menu = JSON.parse(window.sessionStorage.getItem("menu"));
  166. //获取被删除元素
  167. delMenu = menu[liIndex - 1];
  168. var curmenu = window.sessionStorage.getItem("curmenu") == "undefined" ? "undefined" : window.sessionStorage
  169. .getItem("curmenu") == "" ? '' : JSON.parse(window.sessionStorage.getItem("curmenu"));
  170. if (JSON.stringify(curmenu) != JSON.stringify(menu[liIndex - 1])) { //如果删除的不是当前选中的tab
  171. // window.sessionStorage.setItem("curmenu",JSON.stringify(curmenu));
  172. curNav = JSON.stringify(curmenu);
  173. } else {
  174. if ($(this).parent("li").length > liIndex) {
  175. window.sessionStorage.setItem("curmenu", curmenu);
  176. curNav = curmenu;
  177. } else {
  178. window.sessionStorage.setItem("curmenu", JSON.stringify(menu[liIndex - 1]));
  179. curNav = JSON.stringify(menu[liIndex - 1]);
  180. }
  181. }
  182. menu.splice((liIndex - 1), 1);
  183. window.sessionStorage.setItem("menu", JSON.stringify(menu));
  184. element.tabDelete("bodyTab", $(this).parent("li").attr("lay-id")).init();
  185. })
  186. var bodyTab = new Tab();
  187. exports("bodyTab", function (option) {
  188. return bodyTab.set(option);
  189. });
  190. })