|
@@ -9,7 +9,8 @@ export default {
|
|
|
tabsList: [],
|
|
|
pages: [],
|
|
|
activeKey: '',
|
|
|
- newTabIndex: 0
|
|
|
+ newTabIndex: 0,
|
|
|
+ maxTabNums: 10
|
|
|
}
|
|
|
},
|
|
|
inject: ['reloadView'],
|
|
@@ -35,10 +36,11 @@ export default {
|
|
|
} catch (e) {
|
|
|
}
|
|
|
})
|
|
|
-
|
|
|
- this.pages.push(this.$route)
|
|
|
- this.tabsList.push(this.$route.name)
|
|
|
- this.selectedLastPath()
|
|
|
+ if (this.pages.length <= this.maxTabNums) {
|
|
|
+ this.pages.push(this.$route)
|
|
|
+ this.tabsList.push(this.$route.name)
|
|
|
+ this.selectedLastPath()
|
|
|
+ }
|
|
|
},
|
|
|
methods: {
|
|
|
onEdit (targetKey, action) {
|
|
@@ -149,16 +151,24 @@ export default {
|
|
|
this.remove(oldVal.name) // 关闭子页面
|
|
|
}
|
|
|
}
|
|
|
- this.activeKey = newVal.name
|
|
|
const index = this.tabsList.indexOf(newVal.name)
|
|
|
// 解决页面地址相同参数不同时打开多个页签问题(例 详情页id或sn不同时)
|
|
|
if (index < 0) { // 不存在
|
|
|
- this.tabsList.push(newVal.name)
|
|
|
- this.pages.push(newVal)
|
|
|
- this.$store.state.app.isNewTab = true
|
|
|
+ console.log(this.pages.length, '不存在')
|
|
|
+ if (this.pages.length < this.maxTabNums) {
|
|
|
+ this.tabsList.push(newVal.name)
|
|
|
+ this.pages.push(newVal)
|
|
|
+ this.$store.state.app.isNewTab = true
|
|
|
+ this.activeKey = newVal.name
|
|
|
+ } else {
|
|
|
+ this.$message.info('您当前打开窗口太多,请关闭一些,窗口不能超过' + this.maxTabNums + '个')
|
|
|
+ this.$router.go(-1)
|
|
|
+ }
|
|
|
} else { // 已存在
|
|
|
+ console.log(this.pages.length, '已存在')
|
|
|
this.pages.splice(index, 1, newVal)
|
|
|
this.$store.state.app.isNewTab = false
|
|
|
+ this.activeKey = newVal.name
|
|
|
}
|
|
|
},
|
|
|
activeKey: function (newPathKey) {
|
|
@@ -172,12 +182,13 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
render () {
|
|
|
- const { onEdit, onChange, refashThat, $data: { pages } } = this
|
|
|
- const panes = pages.map(page => {
|
|
|
+ const { onEdit, onChange, refashThat, $data: { pages, maxTabNums } } = this
|
|
|
+ const tabPanel = pages.length > maxTabNums ? pages.slice(0, maxTabNums - 1) : pages
|
|
|
+ const panes = tabPanel.map(page => {
|
|
|
return (
|
|
|
<a-tab-pane
|
|
|
style={{ height: 0 }}
|
|
|
- key={page.name} closable={pages.length > 1}
|
|
|
+ key={page.name} closable={tabPanel.length > 1}
|
|
|
>
|
|
|
<span slot="tab">
|
|
|
{this.renderTabPane(page.meta.customTitle || page.meta.title, page.name)}
|