123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141 |
- import { mapMutations, mapState } from 'vuex'
- let isMac = false
- if (window && window.navigator && window.navigator.userAgent) {
- isMac = window.navigator.userAgent.indexOf('Mac') > -1
- }
- export default {
- computed: {
- ...mapState({
- activeCodes: (state) => state.bigScreen.activeCodes,
- activeChart: (state) => state.bigScreen.activeItemConfig
- })
- },
- mounted () {
-
- document.addEventListener('keydown', this.keydown)
- document.addEventListener('keyup', this.keyup)
- },
- beforeDestroy () {
- document.removeEventListener('keydown', this.keydown)
- document.removeEventListener('keyup', this.keyup)
- },
- methods: {
- ...mapMutations('bigScreen', {
- changeCtrlOrCommandDown: 'changeCtrlOrCommandDown',
- changeActivePos: 'changeActivePos',
- deleteItem: 'delItem',
- undoTimeLine: 'undoTimeLine',
- copyCharts: 'copyCharts',
- pasteCharts: 'pasteCharts'
- }),
- keydown (event) {
-
- const activeElement = document.activeElement
-
- const isInputFocused = activeElement instanceof HTMLInputElement || activeElement instanceof HTMLTextAreaElement
- if (!isInputFocused) {
-
- if (event.keyCode === 37) {
-
- event.preventDefault()
-
- this.changeActivePos({ diffX: -1, diffY: 0 })
- } else if (event.keyCode === 38) {
-
- event.preventDefault()
-
- this.changeActivePos({ diffX: 0, diffY: -1 })
- } else if (event.keyCode === 39) {
-
- event.preventDefault()
-
- this.changeActivePos({ diffX: 1, diffY: 0 })
- } else if (event.keyCode === 40) {
-
- event.preventDefault()
-
- this.changeActivePos({ diffX: 0, diffY: 1 })
- }
- }
-
- if ((event.ctrlKey || event.metaKey) && event.keyCode === 83) {
-
- event.preventDefault()
- this.$refs.PageTopSetting.save('saveLoading')
- }
-
- if ((event.ctrlKey || event.metaKey) && !event.shiftKey && event.keyCode === 90) {
- event.preventDefault()
- this.undoTimeLine(true)
- }
-
- if ((event.ctrlKey || event.metaKey) && event.shiftKey && event.keyCode === 90) {
- event.preventDefault()
- this.undoTimeLine(false)
- }
- if (isMac) {
-
- if (event.metaKey) {
- this.changeCtrlOrCommandDown(true)
- }
- } else {
-
- if (event.ctrlKey) {
- this.changeCtrlOrCommandDown(true)
- }
- }
- },
- keyup (event) {
-
- if (isMac) {
-
- if (!event.metaKey) {
- this.changeCtrlOrCommandDown(false)
- }
- } else {
-
- if (!event.ctrlKey) {
- this.changeCtrlOrCommandDown(false)
- }
- }
- },
- designKeydown (event) {
-
- if (
- (event.keyCode === 8 || event.keyCode === 46) &&
- !event.target.classList.contains('el-input__inner')
- ) {
-
- event.preventDefault()
- this.$confirm('确定删除该组件吗?', '提示', {
- confirmButtonText: '确定',
- cancelButtonText: '取消',
- type: 'warning',
- customClass: 'bs-el-message-box'
- }).then(() => {
-
- if (Array.isArray(this.activeCodes) && this.activeCodes.length > 0) {
- this.deleteItem(this.activeCodes)
- } else {
-
- this.deleteItem(this.activeChart)
- }
- }).catch(() => {})
- }
-
- if ((event.ctrlKey || event.metaKey) && event.keyCode === 67) {
- this.copyCharts()
- }
- if ((event.ctrlKey || event.metaKey) && event.keyCode === 86) {
-
- this.pasteCharts()
- }
- }
- }
- }
|