new Vue({ el: '#app', data: function () { return { // iframeSrc: "../../new-quailty-manager/html/new-quailty-manager.html", loading: false, tabList: [], historyArr:[{url:'../../bigData/html/home.html',text:'测试'},], //历史记录 activeIndex:'0' , //当前历史记录选中的下标 leftTabActive:'2-0',//左边菜单中当前高亮下标 isCollapse: false, //导航栏是否隐藏 screenWidth: document.body.clientWidth,//屏幕宽度 } }, computed: { navWidth:function() { //左边菜单的的宽度 return this.isCollapse ? '51px' : '200px' }, titleTip:function() { return this.isCollapse ? '显示导航栏' : '隐藏导航栏' }, }, mounted:function() { this.resize() GlobalEventBus.$on("setLoading", function(arg) { if(arg.loading){ vm.loading = true } else{ vm.loading = false } }); GlobalEventBus.$on("setIframeUrl", function(arg) { vm.setHistory(arg.history) }); }, methods: { resize:function() { //监听页面改变大小 const that = this this.isCollapse = this.screenWidth >= 786 ? false : true; window.onresize = function() { return (function(){ window.screenWidth = document.body.clientWidth; that.screenWidth = window.screenWidth; })() } }, handleSelect: function (key) { console.log(key) var vm = this; var activeObj =null; switch (key) { case '1': this.isCollapse = !this.isCollapse; break; case '2-0': break; case '2-1': activeObj = {url:'../../bigData/html/medical.html',text:'各个'}; break; case '2-2': break; case '2-3': } this.leftTabActive=key // key=key.toString() // this.isActive = key.substring(0, 1) // var childrenIndex= key.split('-')[1]-1; // var activeObj = this.tabList[(this.isActive-1)].children[childrenIndex]; if(activeObj) vm.setHistory(activeObj) }, deleteHistory:function(index){ this.historyArr.splice(index,1); if(!this.historyArr[this.activeIndex] && this.activeIndex-1>=0){ this.activeIndex-=1 } }, setHistory:function(obj){ var vm = this; var exist = false; var index = null; if(typeof(obj)=='string'){ //有些页面直接传url过来 先检测是是左边菜单中的哪个 vm.tabList.forEach(function(v){ v.children.forEach(function(value){ if(typeof(obj)=='string' && obj.indexOf(value.url) != -1){ var obj1 =newObj(value); obj1.url=obj; obj=obj1; } }) }) } vm.historyArr= vm.historyArr.map(function(v,i){ //检测要跳转的url是否在历史记录中 if(obj.url.indexOf(v.url.split('?')[0]) != -1 ){ exist=true; index = i; if(v.url!=obj.url) v.url=obj.url //如果参数不同则重新赋值 } return v }) if(!exist){ //不存在则添加进历史记录 vm.historyArr.push(obj); this.activeIndex =vm.historyArr.length-1 } else{ //存在则直接跳转 this.activeIndex =index } if(obj.index) this.leftTabActive=obj.index //控制左边菜单选中 }, controlRouter:function(key) { debugger switch (key) { case '1': this.closeAllHistory(); break; case '2': this.closeAllHistory(true); break; } }, closeAllHistory:function(is) { //不传参则全部关闭 传参则关闭除了自己之外的 var that =this; if (is && this.activeIndex !=0) { this.historyArr = this.historyArr.filter(function(v,i) { return i == that.activeIndex || i==0 }) this.activeIndex=1 } else{ this.historyArr = this.historyArr.filter(function(v,i) { return i ==0 }) this.activeIndex=0 } }, }, watch: { screenWidth:function(value) { this.isCollapse = value >= 786 ? false : true; }, } })