1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071 |
- <template>
- <a-card size="small" :bordered="false" class="purchaseReceiptReportList-wrap">
- <a-spin :spinning="spinning" tip="Loading...">
- <!-- 标签页 -->
- <a-tabs :default-active-key="nowKey" @change="handleTabChange" class="purchaseReceiptReportList-tabs ">
- <a-tab-pane v-for="item in tabPaneData" :key="item.val">
- <span slot="tab" :id="item.val">{{ item.name }}</span>
- </a-tab-pane>
- </a-tabs>
- <purchaseReceiptOrder v-show="nowKey=='1'" @spinning="spinningFun" />
- <purchaseReceiptDetail v-show="nowKey=='2'" @spinning="spinningFun" />
- </a-spin>
- </a-card>
- </template>
- <script>
- import { commonMixin } from '@/utils/mixin'
- import purchaseReceiptOrder from './purchaseReceiptOrder.vue'
- import purchaseReceiptDetail from './purchaseReceiptDetail.vue'
- export default {
- components: { purchaseReceiptOrder, purchaseReceiptDetail },
- mixins: [commonMixin],
- data () {
- return {
- spinning: false,
- tabPaneData: [
- { name: '采购入库单报表', val: '1' },
- { name: '采购入库明细报表', val: '2' }
- ],
- nowKey: '1'
- }
- },
- methods: {
- spinningFun (val) {
- this.spinning = val
- },
- // tab切换
- handleTabChange (key) {
- this.nowKey = key
- }
- },
- mounted () {
- if (!this.$store.state.app.isNewTab) { // 页签刷新时调用
- this.nowKey = '1'
- }
- },
- activated () {
- // 如果是新页签打开,则重置当前页面
- if (this.$store.state.app.isNewTab) {
- this.nowKey = '1'
- }
- },
- beforeRouteEnter (to, from, next) {
- next(vm => {})
- }
- }
- </script>
- <style lang="less">
- .purchaseReceiptReportList-wrap{
- .purchaseReceiptReportList-tabs.ant-tabs.ant-tabs-card .ant-tabs-card-bar .ant-tabs-nav-container{
- height: 30px!important;
- }
- .purchaseReceiptReportList-tabs.ant-tabs.ant-tabs-card .ant-tabs-card-bar .ant-tabs-tab-active{
- height: 30px!important;
- }
- .purchaseReceiptReportList-tabs.ant-tabs.ant-tabs-card .ant-tabs-card-bar .ant-tabs-tab{
- line-height: 26px!important;
- height: 30px!important;
- }
- }
- </style>
|