Skip to content

H
hls-easy-ui
Commit 9a271762 authored by JingChao's avatar JingChao
Browse files
Options

keyboard

parent 81d87ab4
Hide whitespace changes
Inline Side-by-side
Showing with 131 additions and 131 deletions
packages/components/NumberKeyboard/index.vue
View file @ 9a271762
...@@ -223,154 +223,154 @@ ...@@ -223,154 +223,154 @@
</style> </style>
<script> <script>
import Key from './key' import Key from './key'
export default { export default {
name: 'NumberKeyboard', name: 'NumberKeyboard',
components: {Key}, components: {Key},
props: { props: {
show: Boolean, // eslint-disable-line show: Boolean, // eslint-disable-line
title: String, // eslint-disable-line title: String, // eslint-disable-line
closeButtonText: String, // eslint-disable-line closeButtonText: String, // eslint-disable-line
theme: { theme: {
type: String, type: String,
default: 'default', default: 'default',
},
extraKey: {
type: String,
default: '',
},
zIndex: {
type: Number,
default: 100,
},
transition: {
type: Boolean,
default: true,
},
showDeleteKey: {
type: Boolean,
default: true,
},
hideOnClickOutside: {
type: Boolean,
default: true,
},
cusClass: {
type: String,
default: '',
},
}, },
data () { extraKey: {
type: String,
default: '',
},
zIndex: {
type: Number,
default: 100,
},
transition: {
type: Boolean,
default: true,
},
showDeleteKey: {
type: Boolean,
default: true,
},
hideOnClickOutside: {
type: Boolean,
default: true,
},
cusClass: {
type: String,
default: '',
},
},
data () {
return {
keyBoardPlugin: false,
}
},
computed: {
keys () {
const keys = []
for (let i = 1; i <= 9; i++) {
keys.push({text: i})
}
keys.push(
{text: this.extraKey, type: 'gray'},
{text: 0},
{text: 'delete', type: 'delete gray'}
)
return keys
},
style () {
return { return {
keyBoardPlugin: false, zIndex: this.zIndex,
} }
}, },
computed: { showTitleClose () {
keys () { return this.closeButtonText && this.theme === 'default'
const keys = []
for (let i = 1; i <= 9; i++) {
keys.push({text: i})
}
keys.push(
{text: this.extraKey, type: 'gray'},
{text: 0},
{text: 'delete', type: 'delete gray'}
)
return keys
},
style () {
return {
zIndex: this.zIndex,
}
},
showTitleClose () {
return this.closeButtonText && this.theme === 'default'
},
}, },
watch: { },
show () { watch: {
if (!this.transition) { show () {
this.$emit(this.show ? 'show' : 'hide') if (!this.transition) {
this.$emit(this.show ? 'show' : 'hide')
}
},
},
mounted () {
this.handler(true)
this.$el.setAttribute('vum-show-keyborad', '')
},
destroyed () {
this.handler(false)
if (this.keyBoardPlugin) {
document.body.removeChild(this.$el)
}
},
activated () {
this.handler(true)
},
deactivated () {
this.handler(false)
},
methods: {
closeKeyboard () {
let vm = this
let wrapper = document.querySelector('[vum-show-keyborad]')
if (wrapper && vm.keyBoardPlugin) {
this.show = false
try {
document.body.removeChild(wrapper)
} catch (e) {
} }
}, } else if (vm.keyBoardPlugin === false && vm.hideOnClickOutside) {
this.onClose()
}
}, },
mounted () { showNumberKeyboard (options) {
this.handler(true) this.keyBoardPlugin = true
this.$el.setAttribute('vum-show-keyborad', '') this.title = options.title
this.closeButtonText = options.closeButtonText
this.extraKey = options.extraKey
this.keyDown = options.keyDown
this.keyDelete = options.keyDelete
this.show = true
}, },
destroyed () { handler (action) {
this.handler(false) if (action !== this.handlerStatus && this.hideOnClickOutside) {
if (this.keyBoardPlugin) { this.handlerStatus = action
document.body.removeChild(this.$el) document.body[(action ? 'add' : 'remove') + 'EventListener']('touchstart', this.onBlur)
} }
}, },
activated () { onBlur () {
this.handler(true) this.$emit('blur')
}, },
deactivated () { onClose () {
this.handler(false) this.$emit('close')
this.show = false
this.onBlur()
}, },
methods: { onAnimationEnd () {
closeKeyboard () { this.$emit(this.show ? 'show' : 'hide')
let vm = this },
let wrapper = document.querySelector('[vum-show-keyborad]') onPressKey (text) {
if (wrapper && vm.keyBoardPlugin) { let vm = this
this.show = false if (text === '') {
try { return
document.body.removeChild(wrapper) }
} catch (e) { if (text === 'delete') {
} this.$emit('delete')
} else if (vm.keyBoardPlugin === false && vm.hideOnClickOutside) { if (vm.keyDelete) {
this.onClose() vm.keyDelete()
}
},
showNumberKeyboard (options) {
this.keyBoardPlugin = true
this.title = options.title
this.closeButtonText = options.closeButtonText
this.extraKey = options.extraKey
this.keyDown = options.keyDown
this.keyDelete = options.keyDelete
this.show = true
},
handler (action) {
if (action !== this.handlerStatus && this.hideOnClickOutside) {
this.handlerStatus = action
document.body[(action ? 'add' : 'remove') + 'EventListener']('touchstart', this.onBlur)
}
},
onBlur () {
this.$emit('blur')
},
onClose () {
this.$emit('close')
this.show = false
this.onBlur()
},
onAnimationEnd () {
this.$emit(this.show ? 'show' : 'hide')
},
onPressKey (text) {
let vm = this
if (text === '') {
return
} }
if (text === 'delete') { } else if (text === this.closeButtonText) {
this.$emit('delete') this.onClose()
if (vm.keyDelete) { } else {
vm.keyDelete() this.$emit('input', text)
} if (vm.keyDown) {
} else if (text === this.closeButtonText) { vm.keyDown(text)
this.onClose()
} else {
this.$emit('input', text)
if (vm.keyDown) {
vm.keyDown(text)
}
} }
}, }
}, },
} },
}
</script> </script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment