sfms3.0-uniapp/src/pages/inventoryMove/coms/okToHoldRecordPack.vue

<template>
	<view class="">
		<u-popup v-model="showOne"  mode="bottom" border-radius="14" z-index='12'>
			<view class="title">
				<view class="title-txt">
						需求信息
				</view>
				<u-icon name="close" color="#4f4f4f" size="28"></u-icon>
			</view>
			<view class="item">
				<view class="label">来源库位：</view>
				<view class="value"><u-input v-model="fromLocationCode" @blur="fromLocationBlur"></u-input></view>
				<view class="searchIcon">
					<image src="/static/search.svg" mode=""  @click="fromLocationClick"/>
				</view>
			</view>
			<view class="item">
				<view class="label">零件：</view>
				<view class="value"><u-input v-model="itemCode"></u-input></view>
				<view class="searchIcon">
					<image src="/static/search.svg" mode=""  @click="itemCodeClick"/>
				</view>
			</view>
			<view class="item">
				<view class="label">批次：</view>
				<view class="value">
					<u-input v-model='batch'></u-input>
				</view>
				<view class="searchIcon"></view>
			</view>
			<view class="item">
				<view class="label">数量：</view>
				<view class="value1">
					<u-number-box v-model="handleQty" @change="valChange"></u-number-box>
					<view class="uom">EA</view>
				</view>
			</view>
			<view class="uni-flex uni-row hide_border">
				<button class="btn_edit_big_cancle" hover-class="btn_edit_big_after" @click="cancel()">取消</button>
				<button class="btn_edit_big_confirm" hover-class="btn_edit_big_after" @click="confirm()">确认</button>
			</view>
		</u-popup>
		
		<!-- <win-scan-location ref="scanLocationCode" title="来源库位" @getLocation='getFromLocation'
			:locationAreaTypeList="fromLocationAreaTypeList"></win-scan-location> -->
		<comMessage ref="comMessage"></comMessage>
	</view>
</template>

<script>
	import winScanLocation from "@/mycomponents/scan/winScanLocation.vue"
	import {
		getBusinessType
	} from '@/common/record.js';

	export default {
		components: {
			winScanLocation
		},
		emits: ["showFromLocationPopup",'itemCodeClick','confirm','fromLocationBlur'],
		data() {
			return {
				show:true,
				handleQty:0,
				fromLocationCode:'',
				itemCode:'',
				batch:'',
				showOne:true
			}
		},
		props: {
			fromLocationCodeProps:{
				type: String,
				default: ''
			},
			// 是否显示第一层弹窗
			showOnePop: {
				type: Boolean,
				default: false
			},
			itemCodeProps:{
				type: String,
				default: ''
			},
			batchProps:{
				type: String,
				default: ''
			},
		},
		mounted() {
		},
		methods: {
			// 打开扫描来源库位组件
			fromLocationClick(){
				// this.$refs.scanLocationCode.openScanPopup()
				this.$emit("showFromLocationPopup");
			},
			// 显示箱码
			itemCodeClick(){
				// this.$refs.scanLocationCode.openScanPopup()
				this.$emit("itemCodeClick");
			},
			confirm(){
				// this.$refs.scanLocationCode.openScanPopup()
				
				let obj = {
					fromLocationCode:this.fromLocationCode,
					itemCode:this.itemCode,
					batch:this.batch,
					handleQty:this.handleQty,
				}
				this.$emit("confirm",obj);
			},
			fromLocationBlur(){
				// this.$refs.scanLocationCode.openScanPopup()
				console.log(this.fromLocationCode)
				this.$emit("fromLocationBlur");
			},
		},
		watch: {
			fromLocationCodeProps(newVal) {
				console.log(newVal)
				this.fromLocationCode  = newVal
			},
			itemCodeProps(newVal) {
				this.itemCode  = newVal
			},
			batchProps(newVal) {
				this.batch  = newVal
			},
		}
	}
</script>

<style lang="scss">
	.title{
		padding:30rpx 20rpx;
		display: flex;
		border-bottom:1px solid rgba(230, 230, 230, 1);
		.title-txt{
			flex:1;
			font-weight: bold;
			font-size: 32rpx;
		}
		
	}
	.select{
		display: flex;
	}
	.border{
		border:1px  solid rgba(230, 230, 230, 1)
	}
	::v-deep .u-input__right-icon__clear{
		display: flex;
		align-items: center;
		justify-content: center;
		color: #a7a7a7;
	}
	.item{
		display: flex;
		align-items: center;
		padding: 20rpx;
		border-bottom: 1px solid #dedede;
		.value{
			flex:1;
			width: 0px;
			height: 80rpx;
			border: 1px solid #dedede;
			display: flex;
			align-items: center;
			font-size: 32rpx;
			padding: 0px 20rpx;
		}
		.value1{
			flex:1;
			width: 0px;
			height: 80rpx;
			display: flex;
			align-items: center;
			font-size: 32rpx;
		}
		.searchIcon{
			width: 40rpx;
			margin-left: 20rpx;
			image{
				width: 40rpx;
				height:40rpx
			}
		}
		.uom{
			margin-left: 10rpx;
		}
		
	}
</style>