<template>
	<view class="add">
		<!-- 设备信息 -->
		<view class="main">
			<u--form labelPosition="left" labelAlign="center" :model="equip" ref="form1">
				<u-form-item label="设备名称" prop="equipName" labelWidth="auto" borderBottom ref="item1">
					<u--input v-model="equip.equipName" border="none" readonly></u--input>
				</u-form-item>
				<u-form-item label="设备编号" prop="equipNo" labelWidth="auto" borderBottom>
					<u--input v-model="equip.equipNo" border="none" readonly></u--input>
				</u-form-item>
				<u-form-item label="批次" prop="batch" labelWidth="auto" borderBottom>
					<u--input v-model="equip.batch" border="none" readonly></u--input>
				</u-form-item>
				<u-form-item label="出库数量" prop="num" labelWidth="auto" borderBottom>
					<u--input v-model="equip.num" border="none" type="number" readonly></u--input>
				</u-form-item>
				<u-form-item label="总价(元)" prop="totalprice" labelWidth="auto" borderBottom>
					<u--input v-model="equip.totalprice" type="number" border="none" readonly></u--input>
				</u-form-item>
				<u-form-item label="出库客户" prop="customerName" labelWidth="auto" borderBottom>
					<u--input v-model="equip.customerName" border="none" readonly></u--input>
				</u-form-item>
				<u-form-item label="出库日期" prop="outTime" labelWidth="auto" borderBottom>
					<u--input v-model="equip.outTime" border="none" readonly></u--input>
				</u-form-item>
				
				
				<u-form-item label="退回数量" prop="returnNum" labelWidth="auto" borderBottom v-if="show2">
					<u--input v-model="equip.returnNum" border="none" type="number" placeholder="请输入退回数量"></u--input>
				</u-form-item>
				<u-form-item label="退回日期" prop="untreadTime"
					labelWidth="auto" @click="thShow = true; " borderBottom ref="item1" v-if="show2">
					<u--input
							v-model="equip.untreadTime"
							disabled
							disabledColor="#ffffff"
							placeholder="请选择退回日期"
							border="none"
					></u--input>
					<u-icon
							slot="right"
							name="arrow-right"
					></u-icon>
					<u-datetime-picker
					        :show="thShow"
					        v-model="pickerTime"
					        mode="date"
							:closeOnClickOverlay="true"
							@close="thShow = false"
							@cancel="thShow = false"
							@confirm="date2Confirm"
					></u-datetime-picker>
				</u-form-item>
				<u-form-item label="退回原因" prop="untreadReason" labelWidth="auto" borderBottom ref="item1" v-if="show2">
					<u--textarea v-model="equip.untreadReason" placeholder="请输入退回原因" confirmType="done"></u--textarea>
				</u-form-item>
				
				
				<u-form-item label="报损数量" prop="returnNum" labelWidth="auto" borderBottom v-if="show3">
					<u--input v-model="equip.returnNum" border="none" type="number" placeholder="请输入报损数量"></u--input>
				</u-form-item>
				<u-form-item label="报损日期" prop="untreadTime"
					labelWidth="auto" @click="thShow = true; " borderBottom ref="item1" v-if="show3">
					<u--input
							v-model="equip.untreadTime"
							disabled
							disabledColor="#ffffff"
							placeholder="请选择报损日期"
							border="none"
					></u--input>
					<u-icon
							slot="right"
							name="arrow-right"
					></u-icon>
					<u-datetime-picker
					        :show="thShow"
					        v-model="pickerTime"
					        mode="date"
							:closeOnClickOverlay="true"
							@close="thShow = false"
							@cancel="thShow = false"
							@confirm="date2Confirm"
					></u-datetime-picker>
				</u-form-item>
				<u-form-item label="报损原因" prop="untreadReason" labelWidth="auto" borderBottom ref="item1" v-if="show3">
					<u--textarea v-model="equip.untreadReason" placeholder="请输入报损原因" confirmType="done"></u--textarea>
				</u-form-item>
				
			</u--form>

		</view>

		<view class="submit" v-if="show && equip.num >0">
			<view style='width: 140px;float: left;margin-left: 2px;'>
				<u-button  type="primary"
				 @click="handleReturn" text="退 回 设 备"></u-button>
			</view>
			
			 <view style='width: 140px;float: right;margin-right: 2px;'>
				 <u-button  type="error"
				  @click="handleDamage" text="报 损 设 备"></u-button>
			 </view>
		</view>
		
		<view class="submit" v-if="show2">
			<view style='width: 140px;float: left;margin-left: 2px;'>
				<u-button  type="primary"
				 @click="untitledEquip" text="确 认 退 回"></u-button>
			</view>
			
			 <view style='width: 140px;float: right;margin-right: 2px;'>
				 <u-button  type="error"
				  @click="cancelUntitled" text="取 消 退 回"></u-button>
			 </view>
			
		</view>
		<view class="submit" v-if="show3">
			<view style='width: 140px;float: left;margin-left: 2px;'>
				<u-button  type="primary"
				 @click="damageEquip" text="确 认 报 损"></u-button>
			</view>
			
			<view style='width: 140px;float: right;margin-right: 2px;'>
				<u-button  type="error"
				 @click="cancelDamage" text="取 消 报 损"></u-button>
			</view>
		</view>

	</view>
</template>

<script>
	export default {

		data() {
			return {
				show: true,
				show2: false,
				show3: false,
				thShow: false,
				equip: {
					id: null,
					equipNo: null,
					equipName: null,
					outTime: null,
					batch: null,
					num: null,
					totalprice: null,
					cid: null,
					customerName: null,
					// 退回 参数
					returnNum: null,
					untreadTime: null,
					untreadReason: null,
					// 报损参数
					damageNum: null,
					damageTime: null,
					damageReason: null,
					type: '0'
				},
				pickerTime: Number(new Date()),

			}
		},

		onLoad: function(options) {
			if (options.equip) {
				let data = JSON.parse(options.equip);
				this.equip = data
			}
		},

		created() {},
		filters: {},
		mounted() {
		},
		methods: {
			// 退回设备按钮
			handleReturn(){
				this.show = false
				this.show2 = true
			},
			// 报损设备按钮
			handleDamage(){
				this.show = false;
				this.show3 = true;
			},
			date2Confirm(e){
				const timeFormat = uni.$u.timeFormat
				this.thShow = false;
				this.equip.untreadTime = timeFormat(e.value, 'yyyy-mm-dd');
			},
			// 确认退回按钮
			async untitledEquip(){
				let flag = true;
				if(this.equip.returnNum==null || this.equip.returnNum=='' ){
					flag = false;
				}else{
					if(this.equip.returnNum > this.equip.num){
						flag = false;
						if(!flag) return uni.showToast({
							title: '出库数量不足！',
							icon: 'error'
						})
						return;
					}
				}
				
				if(this.equip.untreadTime==null || this.equip.untreadTime=='' ){
					flag = false;
				}
				if(this.equip.untreadReason==null || this.equip.untreadReason=='' ){
					flag = false;
				}
				if(!flag) return uni.showToast({
					title: '请补充退回内容',
					icon: 'error'
				})

				const {
					data: res
				} = await this.$http('/app/addUntitled', this.equip)
				if (res.code == 0) {
					this.equip.num = this.equip.num - this.equip.returnNum
					uni.showToast({
						title: '设备退回成功',
						icon: 'success'
					});
				} else {
					uni.showToast({
						title: "设备退回失败",
						icon: 'error'
					})
				}
				this.resetD()
				this.show = true;
				this.show2 = false;

			},
			// 取消退回按钮
			cancelUntitled(){
				this.resetD()
				this.show = true;
				this.show2 = false;
			},
			// 确认报损按钮
			async damageEquip(){
				let flag = true;
				if(this.equip.returnNum==null || this.equip.returnNum=='' ){
					flag = false;
				}else{
					if(this.equip.returnNum > this.equip.num){
						flag = false;
						if(!flag) return uni.showToast({
							title: '出库数量不足！',
							icon: 'error'
						})
						return;
					}
				}
				
				if(this.equip.untreadTime==null || this.equip.untreadTime=='' ){
					flag = false;
				}
				if(this.equip.untreadReason==null || this.equip.untreadReason=='' ){
					flag = false;
				}
				if(!flag) return uni.showToast({
					title: '请补充报损内容',
					icon: 'error'
				})
				this.equip.damageNum = this.equip.returnNum
				this.equip.damageTime = this.equip.untreadTime
				this.equip.damageReason = this.equip.untreadReason
				const {
					data: res
				} = await this.$http('/app/addEquipDamage', this.equip)
				if (res.code == 0) {
					this.equip.num = this.equip.num - this.equip.returnNum
					uni.showToast({
						title: '设备报损成功',
						icon: 'success'
					});
				} else {
					uni.showToast({
						title: "设备报损失败",
						icon: 'error'
					})
				}
				this.resetD()
				this.show = true;
				this.show3 = false;
			},
			// 取消退回按钮
			cancelDamage(){
				this.resetD()
				this.show = true;
				this.show3 = false;
			},
			resetD(){
				this.equip.returnNum = null;
				this.equip.untreadTime = null;
				this.equip.untreadReason = null;
			},
			reset() {
				this.equip = {
					id: null,
					equipNo: null,
					equipName: null,
					outTime: null,
					batch: null,
					num: null,
					totalprice: null,
					cid: null,
					customerName: null,
					// 退回 参数
					returnNum: null,
					untreadTime: null,
					untreadReason: null,
					// 报损参数
					damageNum: null,
					damageTime: null,
					damageReason: null,
					type: '0'
				}
			},
		},
		
	}
</script>

<style lang="scss">
	.submit {
		margin: 1vh 2.667vw;
	}

	.add {
		background: #f6f6f6;
		padding: 2.667vw;
		height: 95vh;

		.main {
			background: #ffffff;
			margin-bottom: 2.667vw;
			padding: 2vw;
			border-radius: 8px;

			.u-form-item__body__right {
				padding-left: 20vw;
			}

			.u-button {
				border: none !important;
				padding: 0 !important;
				justify-content: flex-start;
			}
		}
	}
</style>
