This commit is contained in:
2023-01-30 16:48:34 +08:00
parent c2e8f6436e
commit 4ac9d4dd35
3 changed files with 180 additions and 44 deletions

View File

@@ -2,7 +2,7 @@
export default {
onLaunch: function() {
// #ifdef APP-PLUS
// plus.screen.lockOrientation('landscape-primary');
plus.screen.lockOrientation('portrait-primary');
plus.navigator.setFullscreen(true);
// #endif
},

View File

@@ -4,11 +4,12 @@
type="text"
class="filter_input search_input"
:value="value"
:focus="focused"
:focus="focusState"
@blur="handleBlur($event)"
@input="handleChange($event)">
<view class="buttons_wraper">
<span class="iconfont icon-del" @tap="toDel">&#xe6dc;</span>
<span class="iconfont icon_scan" @tap="toScan">&#xe6e2;</span>
<span class="iconfont icon_scan" :class="{'icon_scan_active': focusState === true}" @tap="toScan">&#xe6e2;</span>
<span v-show="seaShow" class="iconfont icon_search" @tap="toSearch">&#xe6e1;</span>
</view>
</view>
@@ -19,7 +20,8 @@
export default {
data() {
return {
cur: ''
cur: '',
focusState: false
};
},
model: {
@@ -37,60 +39,82 @@
default: false
}
},
mounted () {
if (this.focused) {
this.focusState = true
}
},
methods: {
handleChange ($event) {
this.cur = $event.target.value
this.$emit('input', this.cur)
this.$emit('handleChange', this.cur)
if (this.focusState) {
this.focusState = false
}
},
handleBlur () {
this.focusState = false
},
toSearch () {
this.$emit('toSearch', this.cur)
},
toDel () {
this.cur = ''
this.$emit('input', '')
},
async toScan() {
// #ifdef APP-PLUS
let status = await this.checkPermission();
if (status !== 1) {
return;
}
// #endif
uni.scanCode({
success: (res) => {
this.$emit('input', res.result)
this.$emit('handleChange', res.result)
},
fail: (err) => {
// uni.showToast({
// title: '出错',
// icon: 'none'
// })
}
});
toScan () {
setTimeout(() => {
this.focusState = true
},0)
setTimeout(() => {
uni.hideKeyboard()
}, 300)
this.cur = ''
this.$emit('input', '')
}
// #ifdef APP-PLUS
,
async checkPermission(code) {
let status = permision.isIOS ? await permision.requestIOS('camera') :
await permision.requestAndroid('android.permission.CAMERA');
// async toScan() {
// // #ifdef APP-PLUS
// let status = await this.checkPermission();
// if (status !== 1) {
// return;
// }
// // #endif
// uni.scanCode({
// success: (res) => {
// this.$emit('input', res.result)
// this.$emit('handleChange', res.result)
// },
// fail: (err) => {
// // uni.showToast({
// // title: '出错',
// // icon: 'none'
// // })
// }
// });
// }
// // #ifdef APP-PLUS
// ,
// async checkPermission(code) {
// let status = permision.isIOS ? await permision.requestIOS('camera') :
// await permision.requestAndroid('android.permission.CAMERA');
if (status === null || status === 1) {
status = 1;
} else {
uni.showModal({
content: "需要相机权限",
confirmText: "设置",
success: function(res) {
if (res.confirm) {
permision.gotoAppSetting();
}
}
})
}
return status;
}
// #endif
// if (status === null || status === 1) {
// status = 1;
// } else {
// uni.showModal({
// content: "需要相机权限",
// confirmText: "设置",
// success: function(res) {
// if (res.confirm) {
// permision.gotoAppSetting();
// }
// }
// })
// }
// return status;
// }
// // #endif
}
}
</script>
@@ -107,4 +131,6 @@
top 0
right 0
_wh(auto, 70rpx)
.icon_scan_active
color $red
</style>

110
components/SearchBox1.vue Normal file
View File

@@ -0,0 +1,110 @@
<template>
<view class="search_wraper">
<input
type="text"
class="filter_input search_input"
:value="value"
:focus="focused"
@input="handleChange($event)">
<view class="buttons_wraper">
<span class="iconfont icon-del" @tap="toDel">&#xe6dc;</span>
<span class="iconfont icon_scan" @tap="toScan">&#xe6e2;</span>
<span v-show="seaShow" class="iconfont icon_search" @tap="toSearch">&#xe6e1;</span>
</view>
</view>
</template>
<script>
import permision from "@/utils/permission.js"
export default {
data() {
return {
cur: ''
};
},
model: {
prop: 'value',
event: 'input'
},
props: {
value: String,
seaShow: {
type: Boolean,
default: false
},
focused: {
type: Boolean,
default: false
}
},
methods: {
handleChange ($event) {
this.cur = $event.target.value
this.$emit('input', this.cur)
this.$emit('handleChange', this.cur)
},
toSearch () {
this.$emit('toSearch', this.cur)
},
toDel () {
this.$emit('input', '')
},
async toScan() {
// #ifdef APP-PLUS
let status = await this.checkPermission();
if (status !== 1) {
return;
}
// #endif
uni.scanCode({
success: (res) => {
this.$emit('input', res.result)
this.$emit('handleChange', res.result)
},
fail: (err) => {
// uni.showToast({
// title: '出错',
// icon: 'none'
// })
}
});
}
// #ifdef APP-PLUS
,
async checkPermission(code) {
let status = permision.isIOS ? await permision.requestIOS('camera') :
await permision.requestAndroid('android.permission.CAMERA');
if (status === null || status === 1) {
status = 1;
} else {
uni.showModal({
content: "需要相机权限",
confirmText: "设置",
success: function(res) {
if (res.confirm) {
permision.gotoAppSetting();
}
}
})
}
return status;
}
// #endif
}
}
</script>
<style lang="stylus">
@import '../common/style/mixin.styl';
.search_wraper
position relative
_wh(100%, 70rpx)
.search_input
padding-right: 160rpx;
.buttons_wraper
position absolute
top 0
right 0
_wh(auto, 70rpx)
</style>