604 lines
		
	
	
		
			19 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
		
		
			
		
	
	
			604 lines
		
	
	
		
			19 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
|  |  | |||
|  | // plaintree - 树菜单
 | |||
|  | // tree - 智能树菜单
 | |||
|  | var _menuStyle = F.cookie('MenuStyle') || 'tree'; | |||
|  | // 主选项卡标签页
 | |||
|  | var _mainTabs = F.cookie('MainTabs') || 'multi'; | |||
|  | 
 | |||
|  | var SIDEBAR_WIDTH_CONSTANT = 260; | |||
|  | // _sidebarWidth变量会随着用户拖动分隔条而改变
 | |||
|  | var _sidebarWidth = SIDEBAR_WIDTH_CONSTANT; | |||
|  | 
 | |||
|  | 
 | |||
|  | 
 | |||
|  | function isSmallWindowWidth() { | |||
|  |     var windowWidth = $(window).width(); | |||
|  |     return windowWidth < 992; | |||
|  | } | |||
|  | 
 | |||
|  | function checkMobileView() { | |||
|  |     var bodyEl = $('body'); | |||
|  |     var isMobileView = bodyEl.hasClass('mobileview'); | |||
|  |     var needLayout = false; | |||
|  | 
 | |||
|  |     // 如果窗体宽度小于992px,则启用移动视图
 | |||
|  |     if (isSmallWindowWidth()) { | |||
|  |         if (!isMobileView) { | |||
|  |             bodyEl.addClass('mobileview'); | |||
|  |             F.viewPortExtraWidth = SIDEBAR_WIDTH_CONSTANT; | |||
|  |             needLayout = true; | |||
|  |         } | |||
|  |     } else { | |||
|  |         if (isMobileView) { | |||
|  |             bodyEl.removeClass('mobileview'); | |||
|  |             F.viewPortExtraWidth = 0; | |||
|  |             needLayout = true; | |||
|  |         } | |||
|  |     } | |||
|  | 
 | |||
|  |     if (needLayout) { | |||
|  |         if (!isMobileView) { | |||
|  |             // 更新为移动视图之前,要先展开左侧面板
 | |||
|  |             _sidebarWidth = SIDEBAR_WIDTH_CONSTANT; | |||
|  |             if (getFoldButtonStatus()) { | |||
|  |                 // 如果当前处于折叠状态
 | |||
|  |                 toggleSidebar(false); | |||
|  |             } else { | |||
|  |                 // 如果当前处于展开状态,将左侧面板的宽度还原为初始值
 | |||
|  |                 F(PARAMS.sidebarRegion).setWidth(_sidebarWidth); | |||
|  |             } | |||
|  |             setFoldButtonStatus(true); | |||
|  |         } else { | |||
|  |             // 更新为正常视图之前,要先隐藏侧边栏和遮罩层
 | |||
|  |             hideSidebarAndMask(); | |||
|  |             setFoldButtonStatus(false); | |||
|  |         } | |||
|  | 
 | |||
|  |         F(PARAMS.mainPanel).doLayout(); | |||
|  |     } | |||
|  | 
 | |||
|  |     // 第一次检查时不启用动画
 | |||
|  |     if (!bodyEl.hasClass('mobileview-transition')) { | |||
|  |         bodyEl.addClass('mobileview-transition'); | |||
|  |     } | |||
|  |      | |||
|  | } | |||
|  | 
 | |||
|  | // 移动视图 - 隐藏侧边栏和遮罩层
 | |||
|  | function hideSidebarAndMask() { | |||
|  |     $('.mainpanel').removeClass('showsidebar'); | |||
|  |     $('.bodyregion .showsidebar-mask').hide(); | |||
|  |     setFoldButtonStatus(true); | |||
|  | } | |||
|  | 
 | |||
|  | // 移动视图 - 显示侧边栏和遮罩层
 | |||
|  | function showSidebarAndMask() { | |||
|  |     $('.mainpanel').addClass('showsidebar'); | |||
|  |     $('.bodyregion .showsidebar-mask').show(); | |||
|  |     setFoldButtonStatus(false); | |||
|  | } | |||
|  | 
 | |||
|  | // 点击折叠/展开按钮
 | |||
|  | function onFoldClick(event) { | |||
|  |     // 基础版不支持移动视图
 | |||
|  |     if (!F._base && isSmallWindowWidth()) { | |||
|  |         var sidebarregionEl = $('.sidebarregion'); | |||
|  |         var bodyregionEl = $('.bodyregion'); | |||
|  | 
 | |||
|  |         // 创建遮罩层
 | |||
|  |         var maskEl = bodyregionEl.find('.showsidebar-mask'); | |||
|  |         if (!maskEl.length) { | |||
|  |             maskEl = $('<div class="showsidebar-mask"></div>').appendTo(bodyregionEl.find('>.f-panel-bodyct')); | |||
|  |             maskEl.on('click', function () { | |||
|  |                 if (isSmallWindowWidth()) { | |||
|  |                     hideSidebarAndMask(); | |||
|  |                 } | |||
|  |             }); | |||
|  | 
 | |||
|  |             sidebarregionEl.on('click', '.leftregion .f-tree-node-leaf', function () { | |||
|  |                 if (isSmallWindowWidth()) { | |||
|  |                     hideSidebarAndMask(); | |||
|  |                 } | |||
|  |             }); | |||
|  |         } | |||
|  | 
 | |||
|  |         if (getFoldButtonStatus()) { | |||
|  |             showSidebarAndMask(); | |||
|  |         } else { | |||
|  |             hideSidebarAndMask(); | |||
|  |         } | |||
|  | 
 | |||
|  |     } else { | |||
|  |         toggleSidebar(); | |||
|  |     } | |||
|  | } | |||
|  | 
 | |||
|  | // 设置折叠按钮的状态
 | |||
|  | function setFoldButtonStatus(collapsed) { | |||
|  |     var foldButton = F(PARAMS.btnCollapseSidebar); | |||
|  |     if (collapsed) { | |||
|  |         foldButton.setIconFont('f-iconfont-unfold'); | |||
|  |     } else { | |||
|  |         foldButton.setIconFont('f-iconfont-fold'); | |||
|  |     } | |||
|  | } | |||
|  | 
 | |||
|  | // 获取折叠按钮的状态
 | |||
|  | function getFoldButtonStatus() { | |||
|  |     var foldButton = F(PARAMS.btnCollapseSidebar); | |||
|  |     return foldButton.iconFont === 'f-iconfont-unfold'; | |||
|  | } | |||
|  | 
 | |||
|  | 
 | |||
|  | // 基础版下载
 | |||
|  | function onBaseDownloadClick() { | |||
|  |     window.open('http://fineui.com/fans/', '_blank'); | |||
|  | } | |||
|  | 
 | |||
|  | // 点击企业版试用
 | |||
|  | function onApplyTrialClick(event) { | |||
|  |     var windowApplyTrial = F(PARAMS.windowApplyTrial); | |||
|  |     windowApplyTrial.show(); | |||
|  |     // 删除按钮的徽标
 | |||
|  |     this.setBadge(false); | |||
|  | } | |||
|  | 
 | |||
|  | // 点击主题仓库
 | |||
|  | function onThemeSelectClick(event) { | |||
|  |     var windowThemeRoller = F(PARAMS.windowThemeRoller); | |||
|  |     windowThemeRoller.show(); | |||
|  | } | |||
|  | 
 | |||
|  | // 点击加载动画
 | |||
|  | function onLoadingSelectClick(event) { | |||
|  |     var windowLoadingSelector = F(PARAMS.windowLoadingSelector); | |||
|  |     windowLoadingSelector.show(); | |||
|  | } | |||
|  | 
 | |||
|  | // 设置长期存在的Cookie
 | |||
|  | function setCookie(name, value) { | |||
|  |     F.cookie(name, value, { | |||
|  |         expires: 100  // 单位:天
 | |||
|  |     }); | |||
|  | } | |||
|  | 
 | |||
|  | 
 | |||
|  | 
 | |||
|  | // 展开侧边栏
 | |||
|  | function expandSidebar() { | |||
|  |     toggleSidebar(false); | |||
|  | } | |||
|  | 
 | |||
|  | // 折叠侧边栏
 | |||
|  | function collapseSidebar() { | |||
|  |     toggleSidebar(true); | |||
|  | } | |||
|  | 
 | |||
|  | // 折叠/展开侧边栏
 | |||
|  | function toggleSidebar(collapsed) { | |||
|  |     var sidebarRegion = F(PARAMS.sidebarRegion); | |||
|  |     var treeMenu = F(PARAMS.treeMenu); | |||
|  |     var logoEl = sidebarRegion.el.find('.logo'); | |||
|  | 
 | |||
|  |     var currentCollapsed = getFoldButtonStatus(); | |||
|  |     if (F.isUND(collapsed)) { | |||
|  |         collapsed = !currentCollapsed; | |||
|  |     } else { | |||
|  |         if (currentCollapsed === collapsed) { | |||
|  |             return; | |||
|  |         } | |||
|  |     } | |||
|  | 
 | |||
|  |     F.noAnimation(function () { | |||
|  | 
 | |||
|  |         setFoldButtonStatus(collapsed); | |||
|  | 
 | |||
|  |         if (!collapsed) { | |||
|  |             if (_menuStyle === 'tree') { | |||
|  |                 logoEl.removeClass('short').text(logoEl.attr('title')); | |||
|  |                 sidebarRegion.setWidth(_sidebarWidth); | |||
|  |                 // 启用分隔条拖动
 | |||
|  |                 sidebarRegion.setSplitDraggable(true); | |||
|  | 
 | |||
|  |                 // 禁用树微型模式
 | |||
|  |                 treeMenu.miniMode = false; | |||
|  |                 // 重新加载树菜单
 | |||
|  |                 treeMenu.loadData(); | |||
|  |             } else { | |||
|  |                 sidebarRegion.expand(); | |||
|  |             } | |||
|  |         } else { | |||
|  |             if (_menuStyle === 'tree') { | |||
|  |                 logoEl.addClass('short').text('.'); | |||
|  |                 sidebarRegion.setWidth(60); | |||
|  |                 // 禁用分隔条拖动
 | |||
|  |                 sidebarRegion.setSplitDraggable(false); | |||
|  | 
 | |||
|  |                 // 启用树微型模式
 | |||
|  |                 treeMenu.miniMode = true; | |||
|  |                 // 重新加载树菜单
 | |||
|  |                 treeMenu.loadData(); | |||
|  |             } else { | |||
|  |                 sidebarRegion.collapse(); | |||
|  |             } | |||
|  |         } | |||
|  |     }); | |||
|  | } | |||
|  | 
 | |||
|  | // 侧边栏分隔条拖动事件
 | |||
|  | function onSidebarSplitDrag(event) { | |||
|  |     _sidebarWidth = this.width; | |||
|  | } | |||
|  | 
 | |||
|  | 
 | |||
|  | // 点击仅显示基础版示例
 | |||
|  | function onShowOnlyBaseClick(event) { | |||
|  |     var checked = this.isChecked(); | |||
|  | 
 | |||
|  |     setCookie('ShowOnlyBase', checked); | |||
|  |     top.window.location.reload(); | |||
|  | } | |||
|  | 
 | |||
|  | 
 | |||
|  | function onSearchTrigger1Click(event) { | |||
|  |     F.removeCookie('SearchText'); | |||
|  |     top.window.location.reload(); | |||
|  | } | |||
|  | 
 | |||
|  | function onSearchTrigger2Click(event) { | |||
|  |     var ttbxSearch = this; | |||
|  |     if (ttbxSearch.el.hasClass('collapsed')) { | |||
|  |         ttbxSearch.el.removeClass('collapsed').addClass('expanded').outerWidth(200); | |||
|  |     } else { | |||
|  |         var ttbxSearchValue = ttbxSearch.getValue(); | |||
|  |         if (ttbxSearchValue) { | |||
|  |             setCookie('SearchText', this.getValue()); | |||
|  |             top.window.location.reload(); | |||
|  |         } | |||
|  |     } | |||
|  | } | |||
|  | 
 | |||
|  | function onSearchBlur(event) { | |||
|  |     var ttbxSearch = this; | |||
|  |     if (!ttbxSearch.getValue()) { | |||
|  |         ttbxSearch.el.removeClass('expanded').addClass('collapsed').outerWidth(24); | |||
|  |     } | |||
|  | } | |||
|  | 
 | |||
|  | // 点击标题栏工具图标 - 查看源代码
 | |||
|  | function onToolSourceCodeClick(event) { | |||
|  |     var mainTabStrip = F(PARAMS.mainTabStrip); | |||
|  |     var windowSourceCode = F(PARAMS.windowSourceCode); | |||
|  | 
 | |||
|  | 
 | |||
|  |     var activeTab = mainTabStrip.getActiveTab(); | |||
|  |     var iframeWnd, iframeUrl; | |||
|  |     if (activeTab.iframe) { | |||
|  |         iframeWnd = activeTab.getIFrameWindow(); | |||
|  |         iframeUrl = activeTab.getIFrameUrl(); | |||
|  |     } | |||
|  | 
 | |||
|  |     var files = [iframeUrl]; | |||
|  |     var sourcefilesNode = $(iframeWnd.document).find('head meta[name=sourcefiles]'); | |||
|  |     if (sourcefilesNode.length) { | |||
|  |         $.merge(files, sourcefilesNode.attr('content').split(';')); | |||
|  |     } | |||
|  |     windowSourceCode.show(PARAMS.sourceUrl + '?files=' + encodeURIComponent(files.join(';'))); | |||
|  | 
 | |||
|  | } | |||
|  | 
 | |||
|  | // 点击标题栏工具图标 - 刷新
 | |||
|  | function onToolRefreshClick(event) { | |||
|  |     var mainTabStrip = F(PARAMS.mainTabStrip); | |||
|  | 
 | |||
|  |     var activeTab = mainTabStrip.getActiveTab(); | |||
|  |     if (activeTab.iframe) { | |||
|  |         var iframeWnd = activeTab.getIFrameWindow(); | |||
|  |         iframeWnd.location.reload(); | |||
|  |     } | |||
|  | } | |||
|  | 
 | |||
|  | // 点击标题栏工具图标 - 刷新
 | |||
|  | function onPageClick(event) { | |||
|  |     var url = "index.aspx?type=" + event.target.innerText; | |||
|  |     top.window.location.href = url; | |||
|  | } | |||
|  | 
 | |||
|  | // 点击标题栏工具图标 - 在新标签页中打开
 | |||
|  | function onToolNewWindowClick(event) { | |||
|  |     var mainTabStrip = F(PARAMS.mainTabStrip); | |||
|  | 
 | |||
|  |     var activeTab = mainTabStrip.getActiveTab(); | |||
|  |     if (activeTab.iframe) { | |||
|  |         var iframeUrl = activeTab.getIFrameUrl(); | |||
|  |         iframeUrl = PARAMS.processNewWindowUrl(iframeUrl); | |||
|  |         window.open(iframeUrl, '_blank'); | |||
|  |     } | |||
|  | } | |||
|  | 
 | |||
|  | 
 | |||
|  | // 添加示例标签页(通过href在树中查找)
 | |||
|  | // href: 选项卡对应的网址
 | |||
|  | // actived: 是否激活选项卡(默认为true)
 | |||
|  | function addExampleTabByHref(href, actived) { | |||
|  |     var mainTabStrip = F(PARAMS.mainTabStrip); | |||
|  |     var treeMenu = F(PARAMS.treeMenu); | |||
|  | 
 | |||
|  |     F.addMainTabByHref(mainTabStrip, treeMenu, href, actived); | |||
|  | } | |||
|  | 
 | |||
|  | 
 | |||
|  | // 添加示例标签页
 | |||
|  | // tabOptions: 选项卡参数
 | |||
|  | // tabOptions.id: 选项卡ID
 | |||
|  | // tabOptions.iframeUrl: 选项卡IFrame地址 
 | |||
|  | // tabOptions.title: 选项卡标题
 | |||
|  | // tabOptions.icon: 选项卡图标
 | |||
|  | // tabOptions.createToolbar: 创建选项卡前的回调函数(接受tabOptions参数)
 | |||
|  | // tabOptions.refreshWhenExist: 添加选项卡时,如果选项卡已经存在,是否刷新内部IFrame
 | |||
|  | // tabOptions.iconFont: 选项卡图标字体
 | |||
|  | // actived: 是否激活选项卡(默认为true)
 | |||
|  | function addExampleTab(tabOptions, actived) { | |||
|  | 
 | |||
|  |     if (typeof (tabOptions) === 'string') { | |||
|  |         tabOptions = { | |||
|  |             id: arguments[0], | |||
|  |             iframeUrl: arguments[1], | |||
|  |             title: arguments[2], | |||
|  |             icon: arguments[3], | |||
|  |             createToolbar: arguments[4], | |||
|  |             refreshWhenExist: arguments[5], | |||
|  |             iconFont: arguments[6] | |||
|  |         }; | |||
|  |     } | |||
|  | 
 | |||
|  |     F.addMainTab(F(PARAMS.mainTabStrip), tabOptions, actived); | |||
|  | } | |||
|  | 
 | |||
|  | 
 | |||
|  | // 移除选中标签页
 | |||
|  | function removeActiveTab() { | |||
|  |     var mainTabStrip = F(PARAMS.mainTabStrip); | |||
|  | 
 | |||
|  |     var activeTab = mainTabStrip.getActiveTab(); | |||
|  |     activeTab.hide(); | |||
|  | } | |||
|  | 
 | |||
|  | // 获取当前激活选项卡的ID
 | |||
|  | function getActiveTabId() { | |||
|  |     var mainTabStrip = F(PARAMS.mainTabStrip); | |||
|  | 
 | |||
|  |     var activeTab = mainTabStrip.getActiveTab(); | |||
|  |     if (activeTab) { | |||
|  |         return activeTab.id; | |||
|  |     } | |||
|  |     return ''; | |||
|  | } | |||
|  | 
 | |||
|  | // 激活选项卡,并刷新其中的内容,示例:表格控件->杂项->在新标签页中打开(关闭后刷新父选项卡)
 | |||
|  | function activeTabAndRefresh(tabId) { | |||
|  |     var mainTabStrip = F(PARAMS.mainTabStrip); | |||
|  |     var targetTab = mainTabStrip.getTab(tabId); | |||
|  |     var oldActiveTabId = getActiveTabId(); | |||
|  | 
 | |||
|  |     if (targetTab) { | |||
|  |         mainTabStrip.activeTab(targetTab); | |||
|  |         targetTab.refreshIFrame(); | |||
|  | 
 | |||
|  |         // 删除之前的激活选项卡
 | |||
|  |         mainTabStrip.removeTab(oldActiveTabId); | |||
|  |     } | |||
|  | } | |||
|  | 
 | |||
|  | // 激活选项卡,并刷新其中的内容,示例:表格控件->杂项->在新标签页中打开(关闭后更新父选项卡中的表格)
 | |||
|  | function activeTabAndUpdate(tabId, param1) { | |||
|  |     var mainTabStrip = F(PARAMS.mainTabStrip); | |||
|  |     var targetTab = mainTabStrip.getTab(tabId); | |||
|  |     var oldActiveTabId = getActiveTabId(); | |||
|  | 
 | |||
|  |     if (targetTab) { | |||
|  |         mainTabStrip.activeTab(targetTab); | |||
|  |         targetTab.getIFrameWindow().updatePage(param1); | |||
|  | 
 | |||
|  |         // 删除之前的激活选项卡
 | |||
|  |         mainTabStrip.removeTab(oldActiveTabId); | |||
|  |     } | |||
|  | } | |||
|  | 
 | |||
|  | // 通知框
 | |||
|  | function notify(msg) { | |||
|  |     F.notify({ | |||
|  |         message: msg, | |||
|  |         messageIcon: 'information', | |||
|  |         target: '_top', | |||
|  |         header: false, | |||
|  |         displayMilliseconds: 3 * 1000, | |||
|  |         positionX: 'center', | |||
|  |         positionY: 'center' | |||
|  |     }); | |||
|  | } | |||
|  | 
 | |||
|  | // 点击菜单样式
 | |||
|  | function onMenuStyleCheckChange(event, item, checked) { | |||
|  |     var menuStyle = item.getAttr('data-tag'); | |||
|  | 
 | |||
|  |     setCookie('MenuStyle', menuStyle); | |||
|  |     top.window.location.reload(); | |||
|  | } | |||
|  | 
 | |||
|  | // 点击显示模式
 | |||
|  | function onMenuDisplayModeCheckChange(event, item, checked) { | |||
|  |     var displayMode = item.getAttr('data-tag'); | |||
|  | 
 | |||
|  |     setCookie('DisplayMode', displayMode); | |||
|  |     top.window.location.reload(); | |||
|  | } | |||
|  | 
 | |||
|  | // 点击语言
 | |||
|  | function onMenuLangCheckChange(event, item, checked) { | |||
|  |     var lang = item.getAttr('data-tag'); | |||
|  | 
 | |||
|  |     setCookie('Language', lang); | |||
|  |     top.window.location.reload(); | |||
|  | } | |||
|  | 
 | |||
|  | // 点击选项卡标签页
 | |||
|  | function onMenuMainTabsCheckChange(event, item, checked) { | |||
|  |     var mainTabs = item.getAttr('data-tag'); | |||
|  | 
 | |||
|  |     setCookie('MainTabs', mainTabs); | |||
|  |     top.window.location.reload(); | |||
|  | } | |||
|  | 
 | |||
|  | 
 | |||
|  | 
 | |||
|  | // 示例数
 | |||
|  | function getExamplesCount() { | |||
|  |     return F(PARAMS.hfExamplesCount).getValue(); | |||
|  | } | |||
|  | 
 | |||
|  | var THEMES = ["Default", "Metro_Blue", "Metro_Dark_Blue", "Metro_Gray", "Metro_Green", "Metro_Orange", "Black_Tie", "Blitzer", "Cupertino", "Dark_Hive", "Dot_Luv", "Eggplant", "Excite_Bike", "Flick", "Hot_Sneaks", "Humanity", "Le_Frog", "Mint_Choc", "Overcast", "Pepper_Grinder", "Redmond", "Smoothness", "South_Street", "Start", "Sunny", "Swanky_Purse", "Trontastic", "UI_Darkness", "UI_Lightness", "Vader", "custom_default", "bootstrap_pure", "custom_light_green", "pure_black", "pure_green", "pure_blue", "pure_purple", "pure_orange", "pure_red", "image_black_sky", "image_green_rain", "image_green_drip", "image_green_poppy", "image_green_lotus", "image_blue_sky", "image_blue_star", "image_blue_moon", "image_blue_drip", "image_purple_fog", "image_orange_light", "image_red_dawn"]; | |||
|  | // 转到下一个主题
 | |||
|  | function nextThemePlease() { | |||
|  |     var currentTheme = F.cookie('Theme'); | |||
|  |     var currentThemeIndex = $.inArray(currentTheme, THEMES); | |||
|  |     if (currentThemeIndex !== -1) { | |||
|  |         currentThemeIndex++; | |||
|  |         if (currentThemeIndex >= THEMES.length) { | |||
|  |             currentThemeIndex = 0; | |||
|  |         } | |||
|  |         F.cookie('Theme', THEMES[currentThemeIndex], { | |||
|  |             expires: 100  // 单位:天
 | |||
|  |         }); | |||
|  |         window.location.reload(); | |||
|  |     } | |||
|  | } | |||
|  | 
 | |||
|  | function generateBreadcrumbHtml(treeMenu, nodeId) { | |||
|  |     var result = []; | |||
|  |     var nodePaths = treeMenu.getNodePath(nodeId).split('/'); | |||
|  |     if (nodePaths && nodePaths.length) { | |||
|  |         var nodePathLength = nodePaths.length; | |||
|  |         $.each(nodePaths, function (index, item) { | |||
|  |             if (item === 'root') { | |||
|  |                 //result.push('<span class="breadcrumb-root">首页</span>');
 | |||
|  |             } else { | |||
|  |                 var cls = 'breadcrumb-text'; | |||
|  |                 if (index === nodePathLength - 1) { | |||
|  |                     cls = 'breadcrumb-last'; | |||
|  |                 } | |||
|  |                 var itemData = treeMenu.getNodeData(item); | |||
|  |                 result.push('<span class="' + cls + '">' + itemData.text + '</span>'); | |||
|  |             } | |||
|  |         }); | |||
|  |     } | |||
|  |     return result.join('<span class="breadcrumb-separator">/</span>'); | |||
|  | } | |||
|  | 
 | |||
|  | 
 | |||
|  | F.ready(function () { | |||
|  |     var mainTabStrip = F(PARAMS.mainTabStrip); | |||
|  |     var treeMenu = F(PARAMS.treeMenu); | |||
|  |     if (!treeMenu) return; | |||
|  |      | |||
|  |      | |||
|  |     // 初始化主框架中的树(或者Accordion+Tree)和选项卡互动,以及地址栏的更新
 | |||
|  |     // treeMenu: 主框架中的树控件实例,或者内嵌树控件的手风琴控件实例
 | |||
|  |     // mainTabStrip: 选项卡实例
 | |||
|  |     // options: 参数
 | |||
|  |     // options.updateHash: 切换Tab时,是否更新地址栏Hash值(默认值:true)
 | |||
|  |     // options.refreshWhenExist: 添加选项卡时,如果选项卡已经存在,是否刷新内部IFrame(默认值:false)
 | |||
|  |     // options.refreshWhenTabChange: 切换选项卡时,是否刷新内部IFrame(默认值:false)
 | |||
|  |     // options.maxTabCount: 最大允许打开的选项卡数量
 | |||
|  |     // options.maxTabMessage: 超过最大允许打开选项卡数量时的提示信息
 | |||
|  |     // options.beforeNodeClick: 节点点击事件之前执行(返回false则不执行点击事件)
 | |||
|  |     // options.beforeTabAdd: 添加选项卡之前执行(返回false则不添加选项卡)
 | |||
|  |     var initOptions = { | |||
|  |         maxTabCount: 10, | |||
|  |         maxTabMessage: '请先关闭一些选项卡(最多允许打开 10 个)!', | |||
|  |         beforeNodeClick: function (event, treeNodeId) { | |||
|  |             var nodeEl = treeMenu.getNodeEl(treeNodeId); | |||
|  |             var nodeTag = nodeEl.attr('data-tag'); | |||
|  |             var nodeData = treeMenu.getNodeData(treeNodeId); | |||
|  |             if (nodeTag === 'pop-window1') { | |||
|  |                 F(PARAMS.windowThemeRoller).show(); | |||
|  |                 return false; | |||
|  |             } else if (nodeTag === 'newtab') { | |||
|  |                 window.open(nodeData.href, '_blank'); | |||
|  |                 return false; | |||
|  |             } | |||
|  |         }, | |||
|  |         beforeTabAdd: function (event, tabOptions, treeNodeId) { | |||
|  |             // 手工调用F.addMainTab也会运行到这里,由于不是点击左侧树节点触发的,所以此时treeNodeId为空
 | |||
|  |             if (!treeNodeId) { | |||
|  |                 return; | |||
|  |             } | |||
|  |             var nodeEl = treeMenu.getNodeEl(treeNodeId); | |||
|  |             var nodeTag = nodeEl.attr('data-tag'); | |||
|  |             if (nodeTag === 'custom-title') { | |||
|  |                 var parentNode = treeMenu.getParentData(treeNodeId); | |||
|  |                 tabOptions.title = parentNode.text + ' - ' + nodeEl.text(); | |||
|  |             } | |||
|  | 
 | |||
|  |             // 单标签页 - 显示当前页面所在的路径
 | |||
|  |             if (_mainTabs === 'single') { | |||
|  |                 $('#breadcrumb .breadcrumb-inner').html(generateBreadcrumbHtml(treeMenu, treeNodeId)); | |||
|  |             } | |||
|  |         } | |||
|  |     }; | |||
|  | 
 | |||
|  |     // 是否单标签页
 | |||
|  |     if (_mainTabs === 'single') { | |||
|  |         $('body').addClass('maintabs-single'); | |||
|  | 
 | |||
|  |         // 1. 单标签页标识符  2. 标签页存在则直接更新(因为只有这一个标签页)
 | |||
|  |         $.extend(initOptions, { | |||
|  |             singleTabId: PARAMS.tabHomepage, | |||
|  |             refreshWhenExist: true | |||
|  |         }); | |||
|  |     } | |||
|  | 
 | |||
|  |     F.initTreeTabStrip(treeMenu, mainTabStrip, initOptions); | |||
|  | 
 | |||
|  | 
 | |||
|  |     // 基础版不支持智能树控件和移动视图
 | |||
|  |     if (F._base) { | |||
|  |         _menuStyle = 'plaintree'; | |||
|  |     } else { | |||
|  |         // 页面打开检查是否移动视图
 | |||
|  |         checkMobileView(); | |||
|  | 
 | |||
|  |         // 根据屏幕尺寸检查是否移动视图
 | |||
|  |         F.windowResize(function () { | |||
|  |             checkMobileView(); | |||
|  |         }); | |||
|  | 
 | |||
|  |         // 如果初始启用移动视图,则检查折叠按钮的状态
 | |||
|  |         if (isSmallWindowWidth()) { | |||
|  |             setFoldButtonStatus(true); | |||
|  |         } | |||
|  | 
 | |||
|  |         // 如果地址哈希值不存在,则添加响应式首页
 | |||
|  |         var hashFragment = window.location.hash.substr(1); | |||
|  |         if (!hashFragment || hashFragment.indexOf(PARAMS.mainUrl) >= 0) { | |||
|  |             addExampleTabByHref(PARAMS.dashboardUrl); | |||
|  |         } | |||
|  |     } | |||
|  | 
 | |||
|  |     //addExampleTabByHref("/iframe/grid_iframe.aspx");
 | |||
|  |     //addExampleTabByHref("/toolbar/toolbar_multi.aspx");
 | |||
|  |     //addExampleTabByHref("/layout/vbox.aspx");
 | |||
|  |     //addExampleTabByHref("/button/button.aspx");
 | |||
|  | 
 | |||
|  |     // 下一个主题
 | |||
|  |     //:: 页面按键事件
 | |||
|  |     $(document).on('keydown', function (event) { | |||
|  |         //:: Ctrl + Shift + L
 | |||
|  |         if (event.ctrlKey && event.shiftKey && event.keyCode === 76) { | |||
|  |             nextThemePlease(); | |||
|  |         } | |||
|  |     }); | |||
|  | 
 | |||
|  | }); | |||
|  | 
 |