(function (vc) {
    var vm = new Vue({
        el: '#breadcrumb',
        data: {
            breadCrumbs: [],
            indexPage: 1,
            homeTab: {
                name: "首页",
                url: "",
                isHome: true
            },
            contextMenu: {
                visible: false,
                x: 0,
                y: 0,
                currentIndex: -1
            }
        },
        mounted: function () {
            this._ensureHomeTab();
            this._freshBreadCrumbByUrl();

            // 监听框架初始化事件
            document.addEventListener('initVcFrameworkFinish', (e) => {
                this._ensureHomeTab();
                this._freshBreadCrumbByUrl();
            }, false);

            // 点击页面其他区域关闭右键菜单
            document.addEventListener('click', () => {
                this.contextMenu.visible = false;
            });
        },
        methods: {
            /** 确保首页 tab 始终存在 */
            _ensureHomeTab: function () {
                let tabs = vc.getTabFromLocal?.() || [];
                const hasHome = tabs.some(t => t.url === this.homeTab.url);
                if (!hasHome) {
                    tabs.unshift(this.homeTab);
                    window.sessionStorage.setItem('vcTab', JSON.stringify(tabs));
                }
            },

            /** 刷新多页签显示 */
            _freshBreadCrumbByUrl: function () {
                let tabs = vc.getTabFromLocal?.() || [];
                if (!Array.isArray(tabs) || tabs.length === 0) {
                    this._ensureHomeTab();
                    tabs = vc.getTabFromLocal();
                }

                const _curPath = (location.hash || '').split('?')[0];

                this.breadCrumbs = tabs.map((item, index) => {
                    const _path = (item.url || '').split('?')[0];
                    return {
                        href: item.url || '',
                        pageName: item.name || '未命名页面',
                        active: _path === _curPath ? '1' : '0',
                        showClose: !item.isHome
                    };
                });
            },

            /** 点击切换 tab */
            _changeSmallTab: function (_item) {
                vcFramework.isCallBack = false;
                vc.jumpToPage(vc.getUrl() + _item.href);
            },

            /** 删除 tab */
            _deleteSmallTab: function (_item) {
                if (_item.isHome) return;

                vcFramework.isCallBack = false;
                _item.url = _item.href;
                vc.deleteTabToLocal(_item);

                if (_item.active == '0') {
                    this._freshBreadCrumbByUrl();
                    return;
                }

                let _tabs = vc.getTabFromLocal();
                vc.jumpToPage(vc.getUrl() + _tabs[0].url);
                this._freshBreadCrumbByUrl();
            },

            /** 右键事件 */
            _onRightClick: function (event, index) {
                event.preventDefault();
                this.contextMenu.visible = true;
                this.contextMenu.x = event.clientX;
                this.contextMenu.y = event.clientY;
                this.contextMenu.currentIndex = index;
            },

            /** 关闭全部 */
            _closeAllTabs: function () {
                let tabs = vc.getTabFromLocal();
                tabs = tabs.filter(t => t.isHome);
                window.sessionStorage.setItem('vcTab', JSON.stringify(tabs));
                vc.jumpToPage(vc.getUrl() + tabs[0].url);
                this._freshBreadCrumbByUrl();
                this.contextMenu.visible = false;
            },

            /** 关闭左侧 */
            _closeLeftTabs: function () {
                let tabs = vc.getTabFromLocal();
                const cur = this.contextMenu.currentIndex;
                if (cur <= 0) return;

                const currentTab = tabs[cur];
                tabs = tabs.filter((tab, index) =>
                    index >= cur || tab.isHome
                );

                window.sessionStorage.setItem('vcTab', JSON.stringify(tabs));
                this._freshBreadCrumbByUrl();
                this.contextMenu.visible = false;
            },

            /** 关闭右侧 */
            _closeRightTabs: function () {
                let tabs = vc.getTabFromLocal();
                const cur = this.contextMenu.currentIndex;
                if (cur === tabs.length - 1) return;

                const currentTab = tabs[cur];
                tabs = tabs.filter((tab, index) =>
                    index <= cur || tab.isHome
                );

                window.sessionStorage.setItem('vcTab', JSON.stringify(tabs));
                this._freshBreadCrumbByUrl();
                this.contextMenu.visible = false;
            }
        },
    });
})(window.vc);