<template>
	<view class="content">
		<!-- 自定义导航 -->
		<view class="navbar-box">
			<u-navbar title="物资入库" :safeAreaInsetTop="true" @leftClick="leftClick"></u-navbar>
		</view>
		<view class="wrap">
			<u-form :model="form" ref="uForm" label-width="180">
				<u-form-item label="物资">
					<view class="u-flex-1" @click="jumpPage('/pages/putin/goods/goods')"></view>
					<u-icon @click="jumpPage('/pages/putin/goods/goods')" name="plus" size="40"></u-icon>
				</u-form-item>
				<view class="datas">
					<view class="datas-item u-flex u-row-between u-border-bottom" v-for="item in form.datas" :key="item.mateId">
						<view class="info">
							<view class="name">{{item.mateName}}</view>
						</view>
						<view class="number u-flex">
							<u-input v-model="item.mateNum" type="number" :clearable="false" :border="true" />
							<view class="unitCode">{{filterUnitName(item.unitCode)}}</view>
						</view>
					</view>
				</view>
				<u-form-item label="来源">
					<u-input @click="oneSelectOpen('sourceType')" placeholder="请选择" v-model="form.sourceTypeName" disabled />
					<u-icon name="arrow-right"></u-icon>
				</u-form-item>
				<u-form-item label="来源名称">
					<u-input v-model="form.sourceName" />
				</u-form-item>
				<u-form-item label="入库仓库">
					<u-input @click="oneSelectOpen('store')" placeholder="请选择" v-model="form.storeName" disabled />
					<u-icon name="arrow-right"></u-icon>
				</u-form-item>
			</u-form>
		</view>
		<view class="fixed-button">
			<u-button type="success" @click="submit">确认入库</u-button>
		</view>
		<!-- 单列下拉选择 -->
		<u-select v-model="selectShow" :list="selectData" @confirm="selectConfirm"></u-select>
	</view>
</template>

<script>
	import {otherApiUrl} from '@/common/apiurl.js';
	export default {
		data() {
			return {
				form: {
					storeId: '',
					storeName:'',
					sourceType: '',
					sourceTypeName:'',
					sourceName: '',
					datas:[],
				},
				rules: {
					// name: [
					// 	{ 
					// 		required: true, 
					// 		message: '请输入姓名', 
					// 		// 可以单个或者同时写两个触发验证方式 
					// 		trigger: ['change','blur'],
					// 	}
					// ],
				},
				selectTag: '',
				selectShow: false,
				listMap: {
					sourceType: [],
					store: [],
				},
				selectData: [],
				unitNameList:[],
				storeList:[],
			}
		},
		onLoad() {
			this.sourceDict();
			this.unitNameDict();
			this.getStoreList();
		},
		onReady() {
			// this.$refs.uForm.setRules(this.rules);
		},
		onShow() {
			this.form.datas = [
			  ...this.putinList
			]
			console.log('this.form.datas',this.form.datas);			
		},
		computed:{
			filterUnitName(){
				return function(value){
					let v = '';
					for (let i = 0; i < this.unitNameList.length; i++){
						// console.log('value',value);
						// console.log('value',this.unitNameList[i]);
						let item = this.unitNameList[i];
						if (value == item.value) {
						  v = item.label;
						  break;
						}
					}
					return v
				}
			}
		},
		methods: {
			leftClick() {
			   let canNavBack = getCurrentPages();
			     if(canNavBack && canNavBack.length>1) {  
			       uni.navigateBack({  
			         delta: 1  
			       });  
			     } else {  
			       history.back();  
			     }
			},
			// 跳转页面
			jumpPage(url) {
				if (url) {
					uni.navigateTo({
						url: url
					});
				}
			},
			// 单列下拉选择框打开事件
			oneSelectOpen(key) {
				this.selectTag = key;
				this.selectData = this.listMap[key];
				if(key=='actiTypeList'){
					let actiTypeList  = this.listMap.actiTypeList;
					if(!actiTypeList||actiTypeList.length<1){
						this.$refs.uToast.show({
							title: '所选商品(数量)没有活动',
							// type: 'error'
						});
						return
					}
				}
				this.selectShow = true
			},
			selectConfirm(e) {
				// console.log('selectConfirm',e);
				// console.log('selectTag', this.selectTag);
				switch (this.selectTag) {
				 case 'sourceType': //业务员
						console.log('sourceType selectConfirm',e);
						this.form.sourceTypeName = e[0].label;
						this.form.sourceType = e[0].value;
						break;
					case 'store': //结账方式
						this.form.storeName = e[0].label;
						this.form.storeId = e[0].value;
						// this.$u.vuex('orderMap.payWay', e[0].value)
						break;
					default:
						// console.log('3', e);
				}
			},
			async sourceDict() {
				let { code, data, msg} = await this.$u.get(otherApiUrl.getDict + 'sys_source')
				if(code === 200) {
					this.listMap.sourceType = data.map(item => {
						return {
							label: item.dictLabel,
							value: item.dictValue
						}
					})
				}
			},
			async unitNameDict() {
				let { code, data, msg} = await this.$u.get(otherApiUrl.getDict + 'goods_unit_name')
				if(code === 200) {
					this.unitNameList = data.map(item => {
						return {
							label: item.dictLabel,
							value: item.dictValue
						}
					})
				}
			},
			async getStoreList() {
				let { code, data, msg} = await this.$u.api.storeList();
				if(code === 200) {
					this.listMap.store = data.map(item => {
						return {
							label: item.text,
							value: item.value
						}
					})
				}
			},
			async submit(){
				console.log('submit',this.form);
				console.log('submit',this.form.datas.length);
				if(this.form.datas.length<1){
					uni.showToast({
						title:'请先选择物资',
						icon:'error'
					})
					return
				}
				if(!this.form.storeId||!this.form.sourceType.length||!this.form.sourceName){
					uni.showToast({
						title:'请填完表单',
						icon:'error'
					})
					return
				}
				let {code,msg} = await this.$u.api.epiStoreIn(this.form);
				if(code=='200'){
					this.$u.vuex('putinList', [])
					this.$u.route({
						url: 'pages/succeed/succeed',
						params: {
							title: '入库完成'
						}
					})
				}else{
					uni.showToast({
						title:msg
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
.datas{
	margin-top: 24rpx;
	.datas-item{
		padding-bottom: 24rpx;
		margin-bottom: 24rpx;
	}
	.u-input{
		width: 200rpx;
		margin-right: 10rpx;
	}
}
</style>