123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154 |
- // import Vue from 'vue'
- import { deviceEnquire, DEVICE_TYPE } from '@/utils/device'
- import { mapState } from 'vuex'
- // const mixinsComputed = Vue.config.optionMergeStrategies.computed
- // const mixinsMethods = Vue.config.optionMergeStrategies.methods
- const mixin = {
- computed: {
- ...mapState({
- layoutMode: state => state.app.layout,
- navTheme: state => state.app.theme,
- primaryColor: state => state.app.color,
- colorWeak: state => state.app.weak,
- fixedHeader: state => state.app.fixedHeader,
- fixSiderbar: state => state.app.fixSiderbar,
- fixSidebar: state => state.app.fixSiderbar,
- contentWidth: state => state.app.contentWidth,
- autoHideHeader: state => state.app.autoHideHeader,
- sidebarOpened: state => state.app.sidebar,
- multiTab: state => state.app.multiTab
- })
- },
- methods: {
- isTopMenu () {
- return this.layoutMode === 'topmenu'
- },
- isSideMenu () {
- return !this.isTopMenu()
- }
- }
- }
- const mixinDevice = {
- computed: {
- ...mapState({
- device: state => state.app.device
- })
- },
- methods: {
- isMobile () {
- return this.device === DEVICE_TYPE.MOBILE
- },
- isDesktop () {
- return this.device === DEVICE_TYPE.DESKTOP
- },
- isTablet () {
- return this.device === DEVICE_TYPE.TABLET
- }
- }
- }
- const AppDeviceEnquire = {
- mounted () {
- const { $store } = this
- deviceEnquire(deviceType => {
- switch (deviceType) {
- case DEVICE_TYPE.DESKTOP:
- $store.commit('TOGGLE_DEVICE', 'desktop')
- $store.dispatch('setSidebar', true)
- // 默认收起侧边栏
- // $store.dispatch('setSidebar', false)
- break
- case DEVICE_TYPE.TABLET:
- $store.commit('TOGGLE_DEVICE', 'tablet')
- $store.dispatch('setSidebar', false)
- break
- case DEVICE_TYPE.MOBILE:
- default:
- $store.commit('TOGGLE_DEVICE', 'mobile')
- $store.dispatch('setSidebar', true)
- break
- }
- })
- }
- }
- // 所有页
- const commonMixin = {
- watch: {
- '$store.state.app.loadingStatus': function (a, b) {
- if (!a) {
- if (this.disabled !== undefined) {
- this.disabled = a
- }
- if (this.spinning !== undefined) {
- this.spinning = a
- }
- }
- }
- },
- methods: {
- // 清除组件缓存
- clearCompCache (cache, keys, key) {
- if (cache[key] && cache[key].componentInstance) {
- cache[key].componentInstance.$destroy()
- if (keys.length) {
- var index = keys.indexOf(key)
- if (index > -1) {
- keys.splice(index, 1)
- }
- }
- delete cache[key]
- }
- }
- },
- beforeRouteLeave (to, from, next) {
- const newVal = to
- const oldVal = from
- // 是否时同一个父级菜单下的页面
- const mnlen = newVal.matched.length < 3
- const newMatched = newVal.matched[mnlen ? 1 : 2]
- const molen = oldVal.matched.length < 3
- const oldMatched = oldVal.matched[molen ? 1 : 2]
- const hasChildren = newMatched.name == oldMatched.name
- // 判断是否是新增,编辑,详情页
- const oa = oldVal.meta.title.indexOf('详情') >= 0
- const ob = oldVal.meta.title.indexOf('新增') >= 0
- const oc = oldVal.meta.title.indexOf('编辑') >= 0
- const oxt = oldVal.meta.replaceTab
- // console.log(hasChildren,oa||ob||oc||oxt)
- const key = this.$vnode.key
- const parentNode = this.$vnode.parent
- const cache = parentNode && parentNode.componentInstance ? parentNode.componentInstance.cache : null
- const keys = parentNode && parentNode.componentInstance ? parentNode.componentInstance.keys : null
- const closeTabPages = this.$store.state.app.closeTabPages
- const multiTab = this.$store.state.app.multiTab
- // console.log(closeTabPages,key)
- // 清空同级路由的组件缓存
- if (hasChildren && (oa || ob || oc || oxt) && cache && keys) {
- this.clearCompCache(cache, keys, key)
- // 单页签模式
- if (!multiTab) {
- this.$store.state.app.isNewTab = false
- this.$store.state.app.updateList = true
- }
- }
- // 单页签模式,并且不是同级菜单的清空组件
- if (!multiTab && !hasChildren) {
- this.clearCompCache(cache, keys, key)
- }
- // 批量清空组件缓存
- if (closeTabPages && closeTabPages.length && cache && keys) {
- for (let i = 0; i < closeTabPages.length; i++) {
- this.clearCompCache(cache, keys, closeTabPages[i])
- }
- this.$store.state.app.closeTabPages = []
- }
- // console.log(cache,keys)
- next()
- }
- }
- export { mixin, AppDeviceEnquire, mixinDevice, commonMixin }
|