Nie możesz wybrać więcej, niż 25 tematów Tematy muszą się zaczynać od litery lub cyfry, mogą zawierać myślniki ('-') i mogą mieć do 35 znaków.
 
 
 
 
 
 

271 wiersze
8.2 KiB

  1. @{
  2. ViewBag.Title = "title";
  3. Layout = "~/Views/Shared/_Index.cshtml";
  4. }
  5. @Html.AppendJsFile("~/Views/LR_Content/script/lr-clientdata.js")
  6. <style type="text/css">
  7. body {
  8. padding: 10px;
  9. }
  10. .lr-desktop-panel {
  11. position: relative;
  12. width: 100%;
  13. height: 100%;
  14. background-color: #fff;
  15. border: 1px solid #ccc;
  16. padding: 15px 20px;
  17. border-radius: 3px;
  18. }
  19. .navTitle {
  20. font-size: 18px;
  21. background: #EDF6FB;
  22. color: #414045;
  23. line-height: 24px;
  24. padding: 15px;
  25. }
  26. .navTitle i {
  27. /*color: #6A9AE1;*/
  28. font-size: 18px;
  29. margin-right: 5px;
  30. position: relative;
  31. top: 2px;
  32. }
  33. .navRow {
  34. overflow: hidden;
  35. margin: 0 -8px;
  36. }
  37. .navCon {
  38. display: none;
  39. }
  40. .navCon.active{
  41. display: block;
  42. }
  43. .navClo6 {
  44. margin-top: 22px;
  45. padding: 0 8px;
  46. float: left;
  47. width: 16.666667%;
  48. }
  49. .navBox {
  50. background: #7299E4;
  51. border-radius: 6px;
  52. overflow: hidden;
  53. height: 126px;
  54. border: 1px solid #7299E4;
  55. position: relative;
  56. cursor: pointer;
  57. }
  58. .navT {
  59. padding: 20px;
  60. font-size: 18px;
  61. line-height: 24px;
  62. color: #fff;
  63. }
  64. .navT i {
  65. font-size: 18px;
  66. margin-right: 20px;
  67. position: relative;
  68. /*top: 2px;*/
  69. }
  70. .navMore {
  71. padding: 0 20px;
  72. min-height: 15px;
  73. line-height: 50px;
  74. border-bottom: 20px solid #fff;
  75. position: absolute;
  76. bottom: 0;
  77. left: 0;
  78. right: 0;
  79. text-align: right;
  80. color: #fff;
  81. }
  82. .navMore i {
  83. margin-left: 5px;
  84. }
  85. .navTitle .fa-angle-left{
  86. width: 24px;
  87. height: 24px;
  88. opacity: .3;
  89. line-height: 24px;
  90. text-align: center;
  91. background: #fff;
  92. color: #666;
  93. border-radius: 3px;
  94. margin-right: 25px;
  95. top: 0px;
  96. }
  97. .navCons .navMore{
  98. /*text-align: center;*/
  99. }
  100. .navCons .navT{
  101. text-align: right;
  102. }
  103. .navCons .navT > *{
  104. display: block;
  105. }
  106. .navCons .navT > i {
  107. font-size: 30px;
  108. margin-right: 0;
  109. margin-bottom: 10px;
  110. }
  111. .navCons .navBox{
  112. height: 156px;
  113. }
  114. </style>
  115. <div class="lr-desktop-panel lr-scroll-wrap" style="overflow: auto;">
  116. <div class="nav"></div>
  117. </div>
  118. <script>
  119. var id = request('id');
  120. var colorArr = ['#7299E4', '#52BED2', '#4EC586', '#DDC04A', '#DD964A', '#DD6D4A', '#E4474D', '#B658D1', '#8564D8',
  121. '#6467D8', '#468BD1', '#7299E4', '#52BED2', '#4EC586', '#DDC04A', '#DD964A', '#DD6D4A', '#E4474D', '#B658D1'
  122. ];
  123. var modulesTree = top.learun.clientdata.get(['modulesTree']);
  124. var parentId = '0';
  125. var modules = modulesTree[parentId] || [];
  126. //console.log(modulesTree)
  127. $('.nav').on('click', '.navMoreBox .navMore', function(){//查看更多
  128. var id = $(this).parents('.navBox').attr('id');
  129. $('.navCon').css('display', 'none').removeClass('active');
  130. $('.navCon[parentid="'+ id +'"]').addClass('active').fadeIn();
  131. //console.log($('.navRow[parentid="'+ id +'"]'))
  132. }).on('click', '.navTitle .fa-angle-left', function(){//返回上一页
  133. var id = $(this).parents('.navCon').attr('parentid');
  134. $('.navCon').css('display', 'none').removeClass('active');
  135. $('#' + id).parents('.navCon').addClass('active').fadeIn();
  136. }).on('click', '.navBox', function(){//跳转页面
  137. if(!$(this).hasClass('navMoreBox')){
  138. var $obj = $(this);
  139. var id = $obj.attr('id');
  140. var _module = top.learun.clientdata.get(['modulesMap', id]);
  141. switch (_module.F_Target) {
  142. case 'iframe':// 窗口
  143. if (top.learun.validator.isNotNull(_module.F_UrlAddress).code) {
  144. top.learun.frameTab.open(_module);
  145. }
  146. break;
  147. case 'open':// 窗口
  148. var newWin = window.open(_module.F_UrlAddress);
  149. newWin.location.replace(_module.F_UrlAddress);
  150. break;
  151. }
  152. }
  153. })
  154. var $firstmenus = $('.nav');
  155. for (var i = 0, l = modules.length; i < l; i++) {
  156. var item = modules[i];
  157. if(item.F_ModuleId == id){
  158. if (item.F_IsMenu == 1) {
  159. // 第二级菜单
  160. var secondModules = modulesTree[item.F_ModuleId] || [];
  161. var $secondMenus = $('<div class="navRow" parentid="'+ item.F_ModuleId +'"></div>');
  162. var $secondMenux = $('<div class="navCon active" num="2" parentid="'+ item.F_ModuleId +'"><div class="navTitle"><i class="'+ item.F_Icon +'"></i>'+ item.F_FullName +'</div></div>');
  163. var secondMenuHad = false;
  164. for (var j = 0, sl = secondModules.length; j < sl; j++) {
  165. var secondItem = secondModules[j];
  166. if (secondItem.F_IsMenu == 1) {
  167. secondMenuHad = true;
  168. var $secondMenuItem = $('<div class="navClo6"></div>');
  169. var color = colorArr[j];
  170. if (!!secondItem.F_Description) {
  171. $secondMenuItem.attr('title', secondItem.F_Description);
  172. }
  173. var threeModules = modulesTree[secondItem.F_ModuleId] || [];
  174. var $threeMenus = $('<div class="navRow"></div>');
  175. var $threeMenux = $('<div class="navCon navCons" num="3" parentid="'+ secondItem.F_ModuleId +'"><div class="navTitle" style="background: '+ color +';color:#fff"><i class="fa fa-angle-left"></i><i class="'+ secondItem.F_Icon +'"></i>'+ secondItem.F_FullName +'</div></div>');
  176. var threeMenuHad = false;
  177. var secondClassName = '', secondMore = '';
  178. //console.log(threeModules.length)
  179. if(threeModules.length != 0){
  180. secondClassName = 'navMoreBox', secondMore = '展开更多 <i class="fa fa-caret-right"></i>';
  181. }
  182. var secondItemHtml = '<div class="navBox '+ secondClassName +'" id="' + secondItem.F_ModuleId + '" style="background: '+ color +';border-color:'+ color +';">'+
  183. '<div class="navT">'+
  184. '<i class="'+ secondItem.F_Icon +' lr-menu-item-icon"></i><span>'+ secondItem.F_FullName +'</span>'+
  185. '</div>'+
  186. '<div class="navMore">'+ secondMore +'</div>'+
  187. '</div>';
  188. $secondMenuItem.append(secondItemHtml);
  189. // 第三级菜单
  190. for (var m = 0, tl = threeModules.length; m < tl; m++) {
  191. var threeItem = threeModules[m];
  192. if (threeItem.F_IsMenu == 1) {
  193. threeMenuHad = true;
  194. var $threeMenuItem = $('<div class="navClo6"></div>');
  195. var fourModules = modulesTree[threeItem.F_ModuleId] || [];
  196. var $fourMenus = $('<div class="navRow"></div>');
  197. var $fourMenux = $('<div class="navCon navCons" num="4" parentid="'+ threeItem.F_ModuleId +'"><div class="navTitle" style="background: '+ color +';color:#fff"><i class="fa fa-angle-left"></i><i class="'+ threeItem.F_Icon +'"></i>'+ threeItem.F_FullName +'</div></div>');
  198. var fourMenuHad = false;
  199. var threeClassName = '', threeMore = '';
  200. if(fourModules.length != 0){
  201. threeClassName = 'navMoreBox', threeMore = '展开更多 <i class="fa fa-caret-right"></i>';
  202. }
  203. var threeItemHtml = '<div class="navBox '+ threeClassName +'" id="' + threeItem.F_ModuleId + '" style="background: '+ color +';border-color:'+ color +';">'+
  204. '<div class="navT">'+
  205. '<i class="'+ threeItem.F_Icon +' lr-menu-item-icon"></i><span>'+ threeItem.F_FullName +'</span>'+
  206. '</div>'+
  207. '<div class="navMore">'+ threeMore +'</div>'+
  208. '</div>';
  209. $threeMenuItem.append(threeItemHtml);
  210. //第四级菜单
  211. for (var n = 0, fl = fourModules.length; n < fl; n++) {
  212. var fourItem = fourModules[n];
  213. if (fourItem.F_IsMenu == 1) {
  214. fourMenuHad = true;
  215. var $fourMenuItem = $('<div class="navClo6"></div>');
  216. var fourItemHtml = '<div class="navBox" id="' + fourItem.F_ModuleId + '" style="background: '+ color +';border-color:'+ color +';">'+
  217. '<div class="navT">'+
  218. '<i class="'+ fourItem.F_Icon +' lr-menu-item-icon"></i><span>'+ fourItem.F_FullName +'</span>'+
  219. '</div>'+
  220. '<div class="navMore"></div>'+
  221. '</div>';
  222. $fourMenuItem.append(fourItemHtml);
  223. $fourMenus.append($fourMenuItem);
  224. }
  225. }
  226. if (fourMenuHad) {
  227. $fourMenux.append($fourMenus);
  228. $firstmenus.append($fourMenux);
  229. }
  230. $threeMenus.append($threeMenuItem);
  231. }
  232. }
  233. if (threeMenuHad) {
  234. $threeMenux.append($threeMenus);
  235. $firstmenus.append($threeMenux);
  236. }
  237. $secondMenus.append($secondMenuItem);
  238. }
  239. }
  240. if (secondMenuHad) {
  241. $secondMenux.append($secondMenus);
  242. $firstmenus.append($secondMenux);
  243. }
  244. }
  245. break;
  246. }
  247. }
  248. </script>