入库木箱扫码优化

components/SearchBox.vue

@@ -19,7 +19,6 @@
 	export default {
 		data() {
 			return {
-				cur: '',
 				focusState: false
 			};
 		},
@@ -29,10 +28,6 @@
 		},
 		props: {
 			value: String,
-			seaShow: {
-			  type: Boolean,
-			  default: false
-			},
 			focused: {
 				type: Boolean,
 				default: false
@@ -54,7 +49,9 @@
 			},
 			handleBlur (e) {
 				this.$emit('input', e.target.value)
-				this.$emit('handleChange', e.target.value)
+				if (e.target.value.length) {
+					this.$emit('handleChange', e.target.value)
+				}
 				this.focusState = false
 			},
 			toDel () {
@@ -62,7 +59,9 @@
 			},
 			handleSend (e) {
 				this.$emit('input', e.target.value)
-				this.$emit('handleChange', e.target.value)
+				if (e.target.value.length) {
+					this.$emit('handleChange', e.target.value)
+				}
 			}
 		}
 	}

components/SearchBox1.vue

@@ -1,110 +0,0 @@
-<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" scoped>
-@import '../common/style/mixin.styl';
-.search_wraper
-	position relative
-	_wh(100%, 80rpx)
-.search_input
-	padding-right: 160rpx;
-.buttons_wraper
-	position absolute
-	top 0
-	right 0
-	_wh(auto, 80rpx)
-</style>

components/SearchBoxMx.vue

@@ -1,68 +1,58 @@
 <template>
 	<view class="zd-row scan_wraper">
-		<slot></slot>
+		<input 
-		<uni-icons class="mgr20" type="clear" size="24" color="#666" @tap="toDel"></uni-icons>
+		type="text" 
-		<uni-icons type="scan" size="22" :color="focused ? '#D7592F' : '#666'" @tap="toScan"></uni-icons>
+		class="zd-col-24 search_input" 
+		confirm-type="go"
+		:value="value"
+		:focus="focusState"
+		@focus="handleFocus"
+		@blur="handleBlur"
+		@confirm="handleSend"
+		@tap="handleFocus">
+		<uni-icons v-show="value.length" class="mgr20" type="clear" size="24" color="#666" @tap="toDel"></uni-icons>
+		<uni-icons type="scan" size="22" :color="focusState ? '#D7592F' : '#666'" @tap="focusState=true"></uni-icons>
 	</view>
 </template>
 
 <script>
 	import permision from "@/utils/permission.js"
 	export default {
+		data() {
+			return {
+				focusState: false
+			};
+		},
+		model: {
+			prop: 'value',
+			event: 'input'
+		},
 		props: {
-			focused: {
+			value: String
-				type: Boolean,
-				default: false
-			}
 		},
 		methods: {
+			handleFocus () {
+				this.focusState = true
+				setTimeout(() => {
+					uni.hideKeyboard()
+				}, 300)
+			},
+			handleBlur (e) {
+				this.$emit('input', e.target.value)
+				if (e.target.value.length) {
+					this.$emit('handleChange', e.target.value)
+				}
+				this.focusState = false
+			},
 			toDel () {
-				this.$emit('inputDel')
+				this.$emit('input', '')
 			},
-			toScan () {
+			handleSend (e) {
-				this.$emit('inputScan', '')
+				this.$emit('input', e.target.value)
-			},
+				if (e.target.value.length) {
-			async toPhone() {
+					this.$emit('handleChange', e.target.value)
-				// #ifdef APP-PLUS
-				let status = await this.checkPermission();
-				if (status !== 1) {
-				    return;
 				}
-				// #endif
-				uni.scanCode({
-					success: (res) => {
-						this.$emit('toPhone', 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>
@@ -77,13 +67,8 @@
 	border-radius: 10rpx;
 	padding: 0 10rpx
 .search_input
-	padding-right: 160rpx;
+	height 80rpx;
-.buttons_wraper
+	_font(28rpx, 80rpx, #606266,,)
-	position absolute
+	border: 0;
-	top 0
+	background-color: transparent;
-	right 10rpx
-	_wh(auto, 80rpx)
-	_fj(flex-end)
-.icon_scan_active
-	color $red
 </style>

pages/WarehouseManage/InStoreConfirm.vue

@@ -8,9 +8,11 @@
 						<span class="filter_label">木箱</span>
 					</view>
 					<view class="filter_input_wraper">
-						<search-box-mx :focused="focused" @inputDel="inputDel" @inputScan="inputScan" @toPhone="toPhone">
+						<search-box-mx
-							<input type="text" class="scan_input" v-model="val1" :focus="focused" @input="onKeyInput" @focus="onFocus" @blur="onBlur">
+						ref="scanChild"
-						</search-box-mx>
+						v-model="val1"
+						@handleChange="handleChange"
+						/>
 					</view>
 				</view>
 				<view class="filter_item">
@@ -93,14 +95,14 @@
 				index1: '',
 				dataList: [],
 				disabled: false,
-				disabled1: false,
+				disabled1: false
-				focused: true
 			};
 		},
 		created () {
 			this._getStorSect()
 		},
 		mounted () {
+			this.$refs.scanChild.handleFocus()
 			setTimeout(() => {
 				uni.hideKeyboard()
 			}, 500)
@@ -167,39 +169,7 @@
 					this.disabled1 = false
 				}
 			},
-			onKeyInput (event) {
+			handleChange (e) {
-				var value = event.detail.value
-				value=value.replace(/[^\w\.\/]/ig,'')
-				if (value.length !== 14) {
-				    this.$nextTick(() => {
-						this.val1 = ''
-					})
-					uni.hideKeyboard()
-					return
-				}
-				uni.hideKeyboard()
-				this._boxQuery(this.val1)
-			},
-			onFocus () {
-				this.focused = true
-				setTimeout(() => {
-					uni.hideKeyboard()
-				}, 300)
-			},
-			onBlur () {
-				this.focused = false
-			},
-			inputDel () {
-				this.val1 = ''
-			},
-			inputScan () {
-				this.focused = true
-				setTimeout(() => {
-					uni.hideKeyboard()
-				}, 300)
-			},
-			toPhone (e) {
-				this.val1 = e
 				this._boxQuery(this.val1)
 			}
 		}

pages/WarehouseManage/InStoreSplit.vue

@@ -8,9 +8,11 @@
 						<span class="filter_label">木箱</span>
 					</view>
 					<view class="filter_input_wraper">
-						<search-box-mx :focused="focused" @inputDel="inputDel" @inputScan="inputScan" @toPhone="toPhone">
+						<search-box-mx
-							<input type="text" class="scan_input" v-model="val1" :focus="focused" @input="onKeyInput" @focus="onFocus" @blur="onBlur">
+						ref="scanChild"
-						</search-box-mx>
+						v-model="val1"
+						@handleChange="handleChange"
+						/>
 					</view>
 				</view>
 				<view class="filter_item">
@@ -92,14 +94,14 @@
 				index1: '',
 				dataList: [],
 				disabled: false,
-				disabled1: false,
+				disabled1: false
-				focused: true
 			};
 		},
 		created () {
 			this._getStorSect()
 		},
 		mounted () {
+			this.$refs.scanChild.handleFocus()
 			setTimeout(() => {
 				uni.hideKeyboard()
 			}, 500)
@@ -165,39 +167,7 @@
 					this.disabled1 = false
 				}
 			},
-			onKeyInput (event) {
+			handleChange (e) {
-				var value = event.detail.value
-				value=value.replace(/[^\w\.\/]/ig,'')
-				if (value.length !== 14) {
-				    this.$nextTick(() => {
-						this.val1 = ''
-					})
-					uni.hideKeyboard()
-					return
-				}
-				uni.hideKeyboard()
-				this._boxQuery(this.val1)
-			},
-			onFocus () {
-				this.focused = true
-				setTimeout(() => {
-					uni.hideKeyboard()
-				}, 300)
-			},
-			onBlur () {
-				this.focused = false
-			},
-			inputDel () {
-				this.val1 = ''
-			},
-			inputScan () {
-				this.focused = true
-				setTimeout(() => {
-					uni.hideKeyboard()
-				}, 300)
-			},
-			toPhone (e) {
-				this.val1 = e
 				this._boxQuery(this.val1)
 			}
 		}

pages/WarehouseManage/ReturngoodsInStore.vue

@@ -8,9 +8,11 @@
 						<span class="filter_label">木箱</span>
 					</view>
 					<view class="filter_input_wraper">
-						<search-box-mx :focused="focused" @inputDel="inputDel" @inputScan="inputScan" @toPhone="toPhone">
+						<search-box-mx
-							<input type="text" class="scan_input" v-model="val1" :focus="focused" @input="onKeyInput" @focus="onFocus" @blur="onBlur">
+						ref="scanChild"
-						</search-box-mx>
+						v-model="val1"
+						@handleChange="handleChange"
+						/>
 					</view>
 				</view>
 				<view class="filter_item">
@@ -97,14 +99,14 @@
 				options1: [],
 				index1: '',
 				dataList: [],
-				disabled: false,
+				disabled: false
-				focused: true
 			};
 		},
 		created () {
 			this._getStorSect()
 		},
 		mounted () {
+			this.$refs.scanChild.handleFocus()
 			setTimeout(() => {
 				uni.hideKeyboard()
 			}, 500)
@@ -125,7 +127,6 @@
 			},
 			/** 初始化查询 */
 			async _boxQuery (e) {
-				console.log(11)
 				let res = await boxQuery(e, '3')
 				this.dataList = [...res.data]	
 			},
@@ -152,39 +153,7 @@
 					this.disabled = false
 				}
 			},
-			onKeyInput (event) {
+			handleChange (e) {
-				var value = event.detail.value
-				value=value.replace(/[^\w\.\/]/ig,'')
-				if (value.length !== 14) {
-				    this.$nextTick(() => {
-						this.val1 = ''
-					})
-					uni.hideKeyboard()
-					return
-				}
-				uni.hideKeyboard()
-				this._boxQuery(this.val1)
-			},
-			onFocus () {
-				this.focused = true
-				setTimeout(() => {
-					uni.hideKeyboard()
-				}, 300)
-			},
-			onBlur () {
-				this.focused = false
-			},
-			inputDel () {
-				this.val1 = ''
-			},
-			inputScan () {
-				this.focused = true
-				setTimeout(() => {
-					uni.hideKeyboard()
-				}, 300)
-			},
-			toPhone (e) {
-				this.val1 = e
 				this._boxQuery(this.val1)
 			}
 		}

pages/WarehouseManage/ScrapInStore.vue

@@ -8,9 +8,11 @@
 						<span class="filter_label">木箱</span>
 					</view>
 					<view class="filter_input_wraper">
-						<search-box-mx :focused="focused" @inputDel="inputDel" @inputScan="inputScan" @toPhone="toPhone">
+						<search-box-mx
-							<input type="text" class="scan_input" v-model="val1" :focus="focused" @input="onKeyInput" @focus="onFocus" @blur="onBlur">
+						ref="scanChild"
-						</search-box-mx>
+						v-model="val1"
+						@handleChange="handleChange"
+						/>
 					</view>
 				</view>
 				<view class="filter_item">
@@ -90,14 +92,14 @@
 				options1: [],
 				index1: '',
 				dataList: [],
-				disabled: false,
+				disabled: false
-				focused: true
 			};
 		},
 		created () {
 			this._getStorSect()
 		},
 		mounted () {
+			this.$refs.scanChild.handleFocus()
 			setTimeout(() => {
 				uni.hideKeyboard()
 			}, 500)
@@ -144,39 +146,7 @@
 					this.disabled = false
 				}
 			},
-			onKeyInput (event) {
+			handleChange (e) {
-				var value = event.detail.value
-				value=value.replace(/[^\w\.\/]/ig,'')
-				if (value.length !== 14) {
-				    this.$nextTick(() => {
-						this.val1 = ''
-					})
-					uni.hideKeyboard()
-					return
-				}
-				uni.hideKeyboard()
-				this._boxQuery(this.val1)
-			},
-			onFocus () {
-				this.focused = true
-				setTimeout(() => {
-					uni.hideKeyboard()
-				}, 300)
-			},
-			onBlur () {
-				this.focused = false
-			},
-			inputDel () {
-				this.val1 = ''
-			},
-			inputScan () {
-				this.focused = true
-				setTimeout(() => {
-					uni.hideKeyboard()
-				}, 300)
-			},
-			toPhone (e) {
-				this.val1 = e
 				this._boxQuery(this.val1)
 			}
 		}