crm-mobile/mixins/tabbar.js

import { mapGetters } from 'vuex'

export default {
  data() {
    return {
      mixinFooterNav: [],

      footerIndex: null
    }
  },
  computed: {
    ...mapGetters({
      backlogTotal: 'base/backlogTotal',
      serviceNav: 'user/serviceNav',
			navConfig: 'user/navConfig'
    }),
    msgTabIndex() {
      return this.mixinFooterNav.findIndex(item => item.hasOwnProperty('badge'))
    },
		activeTabItem() {
			if (this.$isEmpty(this.footerIndex)) {
				return null
			}
			return this.mixinFooterNav[this.footerIndex] || null
		},
		showTabbar() {
			const arr = this.navConfig.nav || []
			return this.activeTabItem && arr.includes(this.activeTabItem.typeNum)
		}
  },
  watch: {
    backlogTotal: {
      handler() {
        this.setFooterTabBadge()
      },
      immediate: true
    },
    msgTabIndex: {
      handler() {
        this.setFooterTabBadge()
      },
      immediate: true
    },
    serviceNav: {
      handler() {
        this.mixinFooterNav = [].concat(this.serviceNav)
        this.setFooterTabBadge()
        this.setFooterIndex()
      },
      deep: true,
      immediate: true
    }
  },
  mounted() {
		this.setFooterIndex()
  },
	onShow() {
		this.setFooterIndex()
	},
  methods: {
    // 待办事项总数标记
    setFooterTabBadge() {
      if (!this.msgTabIndex || !this.mixinFooterNav[this.msgTabIndex]) return
      this.mixinFooterNav[this.msgTabIndex].badge = this.backlogTotal > 99 ? '99+' : this.backlogTotal
      this.$set(this.mixinFooterNav, this.msgTabIndex, this.mixinFooterNav[this.msgTabIndex])

			// console.log('set footer nav: ', this.mixinFooterNav)
			// console.log('set footer msgTabIndex: ', this.msgTabIndex)
			// console.log('set footer backlogTotal: ', this.backlogTotal)
    },

    /**
     * 设置默认选中的项
     */
    setFooterIndex() {
			const pages = getCurrentPages()
			if (pages.length > 0) {
				const currentPage = pages[pages.length - 1]
        const path = currentPage.route
				this.footerIndex = this.mixinFooterNav.findIndex(item => item.path.startsWith('/' + path))
			} else {
				this.footerIndex = -1
			}
    }
  }
}