Commit 9a271762 authored by JingChao's avatar JingChao

keyboard

parent 81d87ab4
......@@ -223,154 +223,154 @@
</style>
<script>
import Key from './key'
import Key from './key'
export default {
name: 'NumberKeyboard',
components: {Key},
props: {
export default {
name: 'NumberKeyboard',
components: {Key},
props: {
show: Boolean, // eslint-disable-line
title: String, // eslint-disable-line
closeButtonText: String, // eslint-disable-line
theme: {
type: String,
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: '',
},
theme: {
type: String,
default: '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 {
keyBoardPlugin: false,
zIndex: this.zIndex,
}
},
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 {
zIndex: this.zIndex,
}
},
showTitleClose () {
return this.closeButtonText && this.theme === 'default'
},
showTitleClose () {
return this.closeButtonText && this.theme === 'default'
},
watch: {
show () {
if (!this.transition) {
this.$emit(this.show ? 'show' : 'hide')
},
watch: {
show () {
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 () {
this.handler(true)
this.$el.setAttribute('vum-show-keyborad', '')
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
},
destroyed () {
this.handler(false)
if (this.keyBoardPlugin) {
document.body.removeChild(this.$el)
handler (action) {
if (action !== this.handlerStatus && this.hideOnClickOutside) {
this.handlerStatus = action
document.body[(action ? 'add' : 'remove') + 'EventListener']('touchstart', this.onBlur)
}
},
activated () {
this.handler(true)
onBlur () {
this.$emit('blur')
},
deactivated () {
this.handler(false)
onClose () {
this.$emit('close')
this.show = false
this.onBlur()
},
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()
}
},
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
onAnimationEnd () {
this.$emit(this.show ? 'show' : 'hide')
},
onPressKey (text) {
let vm = this
if (text === '') {
return
}
if (text === 'delete') {
this.$emit('delete')
if (vm.keyDelete) {
vm.keyDelete()
}
if (text === 'delete') {
this.$emit('delete')
if (vm.keyDelete) {
vm.keyDelete()
}
} else if (text === this.closeButtonText) {
this.onClose()
} else {
this.$emit('input', text)
if (vm.keyDown) {
vm.keyDown(text)
}
} else if (text === this.closeButtonText) {
this.onClose()
} else {
this.$emit('input', text)
if (vm.keyDown) {
vm.keyDown(text)
}
},
}
},
}
},
}
</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