app-tab-manager.js

// appTabManager is responsible for loading or closing tabs 
frameworkModule.factory('appTabManager', ['$log', 'enums', '$filter', 'constants', '$translate', '$rootScope', '$timeout', '$window', '$stickyState', 'risDialog',
    function ($log, enums, $filter, constants, $translate, $rootScope, $timeout, $window, $stickyState, risDialog) {
        'use strict';
        $log.debug('appTabManager.ctor()...');

        var broadcastTabsChangedEvent = function () {
            // use $timeout to wait for the DOM get updated completed!
            $timeout(function () {
                $rootScope.$broadcast('appTabManager:tabsChanged');
            }, 300);
        };

        /// <summary>
        ///  tab collection on application nav bar
        /// </summary>
        var tabs = [];

        var meetTabCeiling = function () {
            if (tabs.length >= constants.tabCeiling) {
                risDialog({
                    id: 'simpleDialog',
                    template:
                      '<div class="row-fluid">' +
                      ' <h4>您打开的窗口过多，这会影响工作效率，请关闭部分窗口。</h4>' +
                      ' <div>' +
                      '   <div class="codebox">' +
                      '   </div>\n' +
                      ' </div>\n' +
                      '</div>',
                    title: '提示',
                    backdrop: true
                });

                return true;
            }
            return false;
        };

        var selectOpenedTab = function (tab) {
            var list = [];
            if (tabs.length > 0) {
                angular.forEach(tabs, function (tabInfo) {
                    tabInfo.active = tabInfo.tabId === tab.tabId;
                });
            }

            return list;
        };

        tabs.insert = function (index, tab) {
            if (meetTabCeiling()) {
                return false;
            }

            tabs.splice(index, 0, tab);
            broadcastTabsChangedEvent();
            selectOpenedTab(tab);
            return true;
        };

        tabs.add = function (tab) {
            if (meetTabCeiling()) {
                return false;
            }

            tabs.push(tab);
            broadcastTabsChangedEvent();
            selectOpenedTab(tab);
            return true;
        };

        tabs.remove = function (index) {
            if (index > 0) {
                tabs.splice(index, 1);
                broadcastTabsChangedEvent();

                return true;
            }
            selectOpenedTab(tabs[0]);
            return false;
        }

    

        //get opened tabs data to save
        var getOpenedTabs = function (userId) {
            var list = [];
            if (tabs.length > 0) {
                angular.forEach(tabs, function (tabInfo, index) {
                    var tab = {};
                    tab.isWorking = tabInfo.active;
                    tab.position = index;
                    tab.tabId = tabInfo.tabId;
                    tab.tabType = tabInfo.tabType;
                    tab.userId = userId;
                    list.push(tab);
                });
            }

            return list;
        };


        // after tab closed, remove the dom element from ui-view
        var resetState = function (tab) {
            if (tab.route) {
                tab.route.tabId = '';
                tab.route.isWorking = false;
                tab.route = null;
            }

            $timeout(function () {
                $stickyState.reset(tab.state);
            }, 0);
        };

        var closeTabByIndex = function (index) {
            if (_.isNumber(index)) {
                var tab = tabs[index];
                tabs.remove(index);

                resetState(tab);

                selectOpenedTab(tabs[0]);
            } else {
                // do nothing
            }
        };

        var closeCurrentTab = function ()
        {
            _.each(tabs, function (item, index)
            {
                if (item.active)
                {
                    tabs.remove(index);
                }
            });

            selectOpenedTab(tabs[0]);
            
        };

        var closeTab = function (tabId) {
            var tab = _.findWhere(tabs, {
                tabId: tabId
            });
            if (tab) {
                var index = tabs.indexOf(tab);
                tabs.remove(index);

                resetState(tab);

                selectOpenedTab(tabs[0]);
            } else {
                // do nothing
            }
        };
 

        //main
        var createMainTab = function () {
            var mainTab = {
                tabType: enums.tabType.main,
                tabId: PWC.newGuid(),
                url: '/main',
                tabName: '主页' // just demo, need do i18n in future
            };

            return mainTab;
        };

        var loadMainTab = function (eventData, onTabLoaded) {
            var tabItem = _.findWhere(tabs, {
                tabType: enums.tabType.main
            });

            if (!tabItem)
            {
                tabItem = createMainTab();
                if (tabs.add(tabItem))
                {
                    onTabLoaded(tabItem, eventData);
                }
            } else {
                onTabLoaded(tabItem, eventData);
                selectOpenedTab(tabItem);
            }
        };

        //dashboard
        var createDashboardTab = function ()
        {
            var mainTab = {
                tabType: enums.tabType.dashboard,
                tabId: PWC.newGuid(),
                url: '/dashboard/compare',
                tabName: '数据汇总'
            };

            return mainTab;
        };

        var loadDashboardTab = function (eventData, onTabLoaded)
        {
            var tabItem = _.findWhere(tabs, {
                tabType: enums.tabType.dashboard
            });

            if (!tabItem)
            {
                tabItem = createDashboardTab();
                if (tabs.add(tabItem))
                {
                    onTabLoaded(tabItem, eventData);
                }
            }
            else
            {
                onTabLoaded(tabItem, eventData);
                selectOpenedTab(tabItem);
            }
        };

        //dashboard
        var createChartEditTab = function (chartSettingEventData)
        {
            var tabItem = {
                tabType: enums.tabType.chartEdit,
                tabId: PWC.newGuid(),
                chartId: chartSettingEventData.chartId,
                url: '/dashboardsetting/{0}'.format(chartSettingEventData.chartId), 
                tabName: $translate.instant('chartsetting')
            };

            return tabItem;
        };

        var loadChartEditTab = function (chartSettingEventData, onTabLoaded)
        {
            var tabItem = _.findWhere(tabs, {
                tabType: enums.tabType.chartEdit, chartId: chartSettingEventData.chartId
            });

            if (!tabItem)
            {
                tabItem = createChartEditTab(chartSettingEventData);
                if (tabs.add(tabItem))
                {
                    onTabLoaded(tabItem, chartSettingEventData);
                }
            } else
            {
                selectOpenedTab(tabItem);
                onTabLoaded(tabItem, chartSettingEventData);
            }
        };

        //dashboard
        var createCommonUrlTab = function (comonEventData)
        {
            var tabItem = {
                tabType: enums.tabType.commonUrl,
                tabId: PWC.newGuid(),
                url: comonEventData.url.format(comonEventData.param),
                tabName: $translate.instant(comonEventData.stateName)
            };

            return tabItem;
        };

        var loadCommonUrlTab = function (comonEventData, onTabLoaded)
        {
            var tabItem = _.findWhere(tabs, {
                url: comonEventData.url
            });

            if (!tabItem)
            {
                tabItem = createCommonUrlTab(comonEventData);
                if (tabs.add(tabItem))
                {
                    onTabLoaded(tabItem, comonEventData);
                }
            }
            else
            {
                selectOpenedTab(tabItem);
            }
        };


        return {
            tabs: tabs,
            getOpenedTabs: getOpenedTabs,
            closeTabByIndex: closeTabByIndex,
            closeTab: closeTab,
            closeCurrentTab: closeCurrentTab,
            loadMainTab: loadMainTab,
            loadDashboardTab: loadDashboardTab,
            loadChartEditTab: loadChartEditTab,
            loadCommonUrlTab: loadCommonUrlTab,
            selectOpenedTab: selectOpenedTab
        };
    }
]);