<template>

	<view class="page-wraper">

		<view class="page-header">
			<view class="" style="margin: 10rpx;">
				<uni-segmented-control :current="current" :values="items" @clickItem="onClickItem" styleType="button"
					activeColor="#007AFF"></uni-segmented-control>
			</view>

		</view>

		<view class="page-main">
			<scroll-view scroll-y="true" class="page-main-scroll">
				<view class="uni-flex uni-row" style="flex-wrap: wrap; margin: 10rpx;">
					<view class="uni-flex" style=" width: 50%; justify-content: center; margin-top: 40rpx; "
						v-for="(item, index) in showList" :key="index">
						<uni-tag :inverted="!item.checked" :circle="false" :text="item.code+'\n'+item.desc1" type="primary"
							@click="setContainerModel(item)" />
					</view>

				</view>
			</scroll-view>
		</view>

		<view class="page-footer">
			<div class="new_bot_box">
				<win-collapse-location scanTitle='扫描目标库位' ref='comCollapseLocation'
					@getLocationCode='getDefaultToLocation' @clear='clearDefaultLocation'>
				</win-collapse-location>
				<view class="new_btn_bot bot_pos uni-flex">
					<button class="new_save_btn " style="width: 100%;" @click="submit()">提交</button>
				</view>
			</div>
		</view>


		<com-message ref="comMessage"></com-message>
	</view>
</template>
<script>
	import {
		injectIssueRequest,
		getItemCategoryList,
		locations
	} from '@/api/index.js';

	import {
		goHome,
		dateFormat,
		getContainerTypeName,
		showConfirmMsg,
		getISODateTime
	} from '@/common/basic.js';

	import winEmptyView from '@/mycomponents/wincom/winEmptyView.vue'
	import comJobTopInfo from '@/mycomponents/comjob/comJobTopInfo.vue'
	import comMessage from '@/mycomponents/common/comMessage.vue'
	import winCollapseLocation from '@/mycomponents/wincom/winCollapseLocation.vue'
	export default {
		components: {
			winEmptyView,
			comJobTopInfo,
			comMessage,
			winCollapseLocation
		},
		data() {
			return {
				items: ['保险杠', '轮眉', '车门装饰板'],
				current: 0,
				pageSize: this.modelConfig,
				pageIndex: 1,
				loadingType: "nomore",
				dataList: [],
				showList: [],
				toLocationInfo: null
			};
		},
		filters: {
			formatDate: function(val) {
				return dateFormat(val)
			},
		},

		onShow() {},
		onLoad() {
			getItemCategoryList().then(res => {
				this.dataList = res;
				this.dataList.forEach(res => {
					res.checked = true;
				})
				this.onClickItem({
					currentIndex: 0
				})
			}).catch(error => {

			})
		},
		onReachBottom() {},
		onPullDownRefresh() {},
		//后退按钮
		onBackPress(options) {
			if (options.from === 'navigateBack') {
				return false;
			}
			goHome();
			return true;
		},
		//返回首页
		onNavigationBarButtonTap(e) {
			if (e.index === 0) {
				goHome();
			} else if (e.index === 1) {
				window.location.reload();
			}
		},
		methods: {
			clearDefaultLocation() {
				this.toLocationInfo = null
			},
			//扫描默认目标库位
			getDefaultToLocation(locationCode) {
				uni.showLoading({
					title: "扫描中",
					mask: true
				});
				locations(locationCode).then(res => {
					uni.hideLoading();
					if (res) {
						this.toLocationInfo = res
					} else {
						this.showMessage('目标库位【' + locationCode + '】不存在');
					}

				}).catch(err => {
					uni.hideLoading();
					this.toLocationInfo = null
					this.showMessage(err.message);

				})
			},
			setContainerModel(item) {
				this.showList.forEach(res => {
					res.checked = false
				})
				item.checked = true;
				this.$forceUpdate()
			},
			onClickItem(item) {
				if (item.currentIndex == 0) {
					this.showList = this.dataList.filter(res => res.category == "保险杠")
				} else if (item.currentIndex == 1) {
					this.showList = this.dataList.filter(res => res.category == "轮眉")
				} else if (item.currentIndex == 2) {
					this.showList = this.dataList.filter(res => res.category == "车门装饰板")
				}
				this.showList.forEach(res => {
					res.checked = false;
				})
			},

			//查询发货任务
			showMessage(message) {
				this.$refs.comMessage.showMessage(message);
			},
			showCommitSuccessMessage() {
				this.$refs.comMessage.showCommitSuccess();
			},
			clearData() {
				this.onClickItem({
					currentIndex: 0
				})
			},
			submit(item) {
				var checked = this.showList.filter(r=>r.checked)
				if (checked.length==0) {
					this.showMessage("请选择零件")
					return;
				}	
				
				if (this.toLocationInfo == null) {
					this.showMessage("请先扫描目标库位")
					return;
				}
			

				uni.showLoading({
					title: "提交中...",
					mask: true
				});
				var params = {
					worker: localStorage.userName_CN == "" ? localStorage.userName : localStorage.userName_CN,
					activeDate: getISODateTime(),
					useOnTheWayLocation: false,
					type: "Qty",
					details: [

					]
				}
				var item = {
					remark: "",
					itemCode: checked[0].code,
					itemName: checked[0].name,
					itemDesc1:  checked[0].desc1,
					itemDesc2:  checked[0].desc2,
					uom: checked[0].basicUom,
					qty: 1,
					stdPackQty: checked[0].stdPackQty,
					toLocationCode: this.toLocationInfo.code,
					toLocationArea: this.toLocationInfo.areaCode,
					toLocationGroup: this.toLocationInfo.locationGroupCode,
					toLocationErpCode: this.toLocationInfo.erpLocationCode,
					toWarehouseCode: localStorage.warehouseCode,
					positionCode: "",
					recommendType: "B",
					boxQty: 1
				}
				params.details.push(item)
				console.log("测试", JSON.stringify(params));
				injectIssueRequest( params)
					.then(res => {
						uni.hideLoading();
						if (res) {
							this.showCommitSuccessMessage();
							this.clearData();
						}else {
							this.showMessage("提交失败");
						}
					})
					.catch(err => {
						this.showMessage(err.message);
						uni.hideLoading();
					});
			},
		}
	};
</script>