<template>
	<view class="">
		<view class="uni-list">
			<view class="uni-list-cell " style="padding:10rpx; ">
				<view class="" style="color: red; font-size: 40rpx; ">
					*
				</view>
				<view class="uni-list-cell-left" style="font-size:35rpx">
					器具类型 :
				</view>
				<view class="uni-list-cell-db">
					<picker @change="containerTypeChange" :value="typeIndex" :range="containerTypeList"
						range-key="name">
						<view class="uni-input" style="font-size:35rpx">{{containerType}}</view>
					</picker>
				</view>
			</view>
		</view>
		<view class="uni-list">
			<view class="uni-list-cell" style="padding:10rpx">
				<view class="" style="color: red; font-size: 40rpx; ">
					*
				</view>
				<view class="uni-list-cell-left" style="font-size:35rpx">
					器具规格 :
				</view>
				<view class="uni-list-cell-db">
					<picker @change="containerModelChange" :value="modelIndex" :range="containerModelList"
						range-key="name">
						<view class="uni-input" style="font-size:35rpx">{{containerModel}}</view>
					</picker>
				</view>
			</view>
		</view>
		<view class="uni-list">
			<view class="uni-list-cell"
				style="padding-left: 15rpx; padding-top: 20rpx;padding-bottom:20rpx; padding-right: 15rpx; ; align-items: center; display: flex;">
				<view class="" style="color: red; font-size: 40rpx; ">
					*
				</view>
				<view class="uni-list-cell-left"
					style="font-size:35rpx; align-items: center;display: flex;  text-align: center;">
					呼叫库位 :
				</view>
				<view class="uni-list-cell-db" style="font-size:35rpx" @click="openScanLocation">
					<text>{{locationCode}}</text>
					<text v-if="locationName!=''">({{locationName}})</text>
				</view>
			</view>
		</view>
		<view class="new_btn_bot">
			<button class="new_save_btn" @click="submit()">提交</button>
		</view>
		<win-scan-by-code ref="scanLocation" title="库位" @getScanCode='getLocation'></win-scan-by-code>
		<com-message ref="comMessage" @afterCloseScanMessage='closeScanMessage' @afterClose='afterClose'
			@afterCloseCommitMessage='closeCommitMessage'>
		</com-message>
	</view>
</template>

<script>
	import {
		locations,
		getDictByCode,
		containerRequest
	} from '@/api/index.js';
	import {
		goHome,
		getContainerTypeArray,
		getISODateTime,
	} from '@/common/basic.js';
	import comMessage from '@/mycomponents/common/comMessage.vue'
	import winScanByCode from '@/mycomponents/wincom/winScanByCode.vue'
	export default {
		components: {
			comMessage,
			winScanByCode
		},
		data() {
			return {
				containerTypeList: [],
				containerModelList: [],
				typeIndex: 0,
				modelIndex: 0,
				location: "",
				locationCode: "请扫描库位",
				locationName: "",
				containerType: "请选择器具类型",
				containerTypeCode: "",
				containerModel: "请选择器具规格",
				containerModelCode: ""
			}
		},
		onShow() {
			this.getContainerModelList();
			this.containerTypeList = getContainerTypeArray();
		},
		//返回首页
		onNavigationBarButtonTap(e) {
			if (e.index === 0) {
				goHome();
			} else if (e.index === 1) {
				window.location.reload();
			}
		},
		methods: {
			getContainerModelList() {
				getDictByCode("ContainerSpecificationsType").then(res => {
					res.items.forEach(item => {
						item.value = item.code;
					})
					this.containerModelList = res.items;
				}).catch(error => {

				})
			},
			containerTypeChange(e) {
				this.typeIndex = e.detail.value
				var select = this.containerTypeList[this.typeIndex];
				this.containerType = select.name
				this.containerTypeCode = select.value
				console.log(select)
			},
			containerModelChange(e) {
				this.modelIndex = e.detail.value
				var select = this.containerModelList[this.modelIndex];
				this.containerModel = select.name
				this.containerModelCode = select.value
				console.log(select)
			},
			openScanLocation() {
				this.$refs.scanLocation.openScanPopup()
			},

			closeScanLocation() {
				this.$refs.scanLocation.closeScanPopup();
			},
			//扫描源库位
			getLocation(code) {
				let that = this;
				if (code == '') return;
				uni.showLoading({
					title: '扫描中...',
					mask: true
				});
				locations(code).then(res => {
					uni.hideLoading();
					if (res) {
						that.locationCode = res.code;
						that.locationName = res.name
						that.closeScanLocation();
					} else {
						that.scanPopupLoseFocus();
						that.showMessage('未查询到库位【' + code + '】');
					}

				}).catch(err => {
					uni.hideLoading();
					that.showMessage(err.message);
				});
			},
			showMessage(message) {
				this.$refs.comMessage.showMessage(message);
			},
			afterClose() {
				this.scanPopupGetFocus();
			},
			scanPopupGetFocus() {
				this.$refs.scanLocation.getfocus();
			},
			scanPopupLoseFocus() {
				this.$refs.scanLocation.losefocus();
			},
			clearData() {
				this.containerType = "请选择器具类型"
				this.containerModel = "请选择器具规格";
				this.locationCode = "请扫描库位"
				this.locationName ="";
				this.containerTypeCode = ""
				this.containerModelCode = ""
				this.modelIndex =0;
				this.typeIndex =0;

			},

			setParams() {
				var data = {
					worker: localStorage.userName_CN == "" ? localStorage.userName : localStorage.userName_CN,
					activeDate: getISODateTime(),
					containerType: this.containerTypeCode,
					specificationsType: this.containerModelCode,
					requestLocationCode: this.locationCode,
					
				}
				return data;
			},

			submit() {
				if (this.containerType == "请选择器具类型") {
					this.showMessage("请选择器具类型")
					return;
				}

				if (this.containerModel == "请选择器具规格") {
					this.showMessage("请选择器具规格")
					return;
				}

				if (this.locationCode == "请扫描库位") {
					this.showMessage("请扫描库位")
					return;
				}
				console.log(this.containerTypeCode)
				console.log(this.containerModelCode)
				console.log(this.locationCode)
				uni.showLoading({
					title: '提交中...',
					mask: true
				});
				var params = this.setParams();
				
				containerRequest(params).then(res => {
					uni.hideLoading();
					this.showMessage("提交成功");
					this.clearData();
				}).catch(err => {
					uni.hideLoading();
					this.showMessage(err.message);
				})

			}
		}
	}
</script>

<style>
</style>