修改bug
This commit is contained in:
		
							
								
								
									
										62
									
								
								src/views/OperationalOverview/components/resize.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										62
									
								
								src/views/OperationalOverview/components/resize.js
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,62 @@
 | 
			
		||||
/*
 | 
			
		||||
 * @Author: zhp
 | 
			
		||||
 * @Date: 2024-02-01 15:39:22
 | 
			
		||||
 * @LastEditTime: 2024-02-01 15:39:23
 | 
			
		||||
 * @LastEditors: zhp
 | 
			
		||||
 * @Description:
 | 
			
		||||
 */
 | 
			
		||||
import { debounce } from '@/utils'
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
  data() {
 | 
			
		||||
    return {
 | 
			
		||||
      $_sidebarElm: null,
 | 
			
		||||
      $_resizeHandler: null
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  mounted() {
 | 
			
		||||
    this.$_resizeHandler = debounce(() => {
 | 
			
		||||
      if (this.chart) {
 | 
			
		||||
        this.chart.resize()
 | 
			
		||||
      }
 | 
			
		||||
    }, 100)
 | 
			
		||||
    this.$_initResizeEvent()
 | 
			
		||||
    this.$_initSidebarResizeEvent()
 | 
			
		||||
  },
 | 
			
		||||
  beforeDestroy() {
 | 
			
		||||
    this.$_destroyResizeEvent()
 | 
			
		||||
    this.$_destroySidebarResizeEvent()
 | 
			
		||||
  },
 | 
			
		||||
  // to fixed bug when cached by keep-alive
 | 
			
		||||
  // https://github.com/PanJiaChen/vue-element-admin/issues/2116
 | 
			
		||||
  activated() {
 | 
			
		||||
    this.$_initResizeEvent()
 | 
			
		||||
    this.$_initSidebarResizeEvent()
 | 
			
		||||
  },
 | 
			
		||||
  deactivated() {
 | 
			
		||||
    this.$_destroyResizeEvent()
 | 
			
		||||
    this.$_destroySidebarResizeEvent()
 | 
			
		||||
  },
 | 
			
		||||
  methods: {
 | 
			
		||||
    // use $_ for mixins properties
 | 
			
		||||
    // https://vuejs.org/v2/style-guide/index.html#Private-property-names-essential
 | 
			
		||||
    $_initResizeEvent() {
 | 
			
		||||
      window.addEventListener('resize', this.$_resizeHandler)
 | 
			
		||||
    },
 | 
			
		||||
    $_destroyResizeEvent() {
 | 
			
		||||
      window.removeEventListener('resize', this.$_resizeHandler)
 | 
			
		||||
    },
 | 
			
		||||
    $_sidebarResizeHandler(e) {
 | 
			
		||||
      if (e.propertyName === 'width') {
 | 
			
		||||
        this.$_resizeHandler()
 | 
			
		||||
      }
 | 
			
		||||
    },
 | 
			
		||||
    $_initSidebarResizeEvent() {
 | 
			
		||||
      this.$_sidebarElm = document.getElementsByClassName('sidebar-container')[0]
 | 
			
		||||
      this.$_sidebarElm && this.$_sidebarElm.addEventListener('transitionend', this.$_sidebarResizeHandler)
 | 
			
		||||
    },
 | 
			
		||||
    $_destroySidebarResizeEvent() {
 | 
			
		||||
      this.$_sidebarElm && this.$_sidebarElm.removeEventListener('transitionend', this.$_sidebarResizeHandler)
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
		Reference in New Issue
	
	Block a user