emis-sapp/components/tpx-scan-input/tpx-scan-input.vue
2024-01-29 18:48:55 +08:00

79 lines
1.3 KiB
Vue

<template>
<u-input :placeholder="placeholder" :fontSize="fontSize" :modelValue="value"
:custom-style="`border-radius: 10rpx;padding: 11rpx 20rpx;${customStyle};`"
@change="handleChange"
>
<template v-if="iconPos == 'left'" v-slot:prefix>
<u-icon @click="handleScan" name="scan" :size="fontSize*1.5"></u-icon>
</template>
<template v-if="iconPos == 'right'" v-slot:suffix>
<u-icon @click="handleScan" name="scan" :size="fontSize*1.5"></u-icon>
</template>
</u-input>
<tpx-physics-scan @onChange="handleChange"></tpx-physics-scan>
</template>
<script>
import { scanCode } from "@/common/untool"
export default {
props: {
value: {
default () {
return ''
}
},
placeholder:{
default () {
return '请输入或扫码'
}
},
fontSize: {
default () {
return 26
}
},
iconPos: {
default () {
return "left"
}
},
customStyle:{
default () {
return ''
}
},
placeholderStyle:{
default () {
return ''
}
},
},
data() {
},
created() {
},
onHide() {
},
unmounted() {},
methods: {
async handleScan() {
const res = await scanCode()
this.handleChange(res)
},
handleChange(val){
this.$emit('change', val)
this.$emit('update:value', val)
}
}
}
</script>
<style scoped lang="scss">
</style>