<template> <div class="dayReport-box"> <!-- 选项卡切换 --> <a-tabs v-model="activeKey" @change="callback" :tabBarStyle="{'background':'#fff',height:'41px',overflow:'hidden',marginBottom:'5px'}"> <a-tab-pane :key="item.id" :tab="item.name" v-for="item in tabsList" forceRender> <dTable :ref="'table'+item.id"></dTable> </a-tab-pane> </a-tabs> </div> </template> <script> import { commonMixin } from '@/utils/mixin' import dTable from './table.vue' export default { name: 'RegionTypeSalesReportList', mixins: [commonMixin], components: { dTable }, data () { return { spinning: false, activeKey: 0, // 切换显示页面值 0 各分区品类实售明细 1各区域品类实售明细 tabsList: [] // tab切换data } }, methods: { // tabs切换 change时间 callback (key) { this.activeKey = key this.$refs['table' + this.activeKey][0].pageInit(this.activeKey) }, // 初始化 pageInit () { this.tabsList = [] if (this.$hasPermissions('M_National_Sales_Daily_Report')) { this.tabsList.push({ id: 0, name: '全国销售日报' }) } if (this.$hasPermissions('M_Project_Sales_Daily_Report')) { this.tabsList.push({ id: 1, name: '项目销售日报1' }) } if (this.$hasPermissions('M_Project_Sales_Daily_Report_2')) { this.tabsList.push({ id: 2, name: '项目销售日报2' }) } if (this.$hasPermissions('M_Regional_Sales_Daily_Report')) { this.tabsList.push({ id: 3, name: '分区销售日报' }) } this.activeKey = this.tabsList[0].id this.$nextTick(() => { this.$refs['table' + this.activeKey][0].pageInit(this.activeKey) }) } }, mounted () { if (!this.$store.state.app.isNewTab) { // 页签刷新时调用 this.pageInit() } }, activated () { // 如果是新页签打开,则重置当前页面 if (this.$store.state.app.isNewTab) { this.pageInit() } }, beforeRouteEnter (to, from, next) { next(vm => {}) } } </script> <style lang="less" scoped> .dayReport-box{ min-height: calc(100vh - 90px); background: #fff; } </style>