<template>
	<view>
		<!-- 	<view class="white-card">
			<view class="list-list">
				<view class="list-title">物料编号</view>
				<view class="list-right">
					<text>5651145dssdffd</text>
				</view>
			</view>
			<view class="list-list">
				<view class="list-title">填报日期</view>
				<view class="list-right">
					<text>5651145dssdffd</text>
				</view>
			</view>
			<picker @change="bindline" :value="lineIndex" :range="line">
			<view class="list-list">
				<view class="list-title">线别</view>
				<view class="list-right">
					<text>{{line[lineIndex]}}</text>
					<image class="next" src="../../static/next.png"></image>
				</view>
			</view>
			</picker>
			<picker @change="bindfrequencyIds" :value="frequencyIds" :range="frequency">
			<view class="list-list">
				<view class="list-title">班次</view>
				<view class="list-right">
					<text>{{frequency[frequencyIds]}}</text>
					<image class="next" src="../../static/next.png"></image>
				</view>
			</view>
			</picker>
		</view> -->
		<view class="white-card" v-for="(item, index) in froms" :key="index"
			style="margin-top: 24upx;padding-top: 30upx;padding-bottom: 30upx;">
			<view class="mid-card">
				<picker @change="reasonChange($event, index)" :value="item.reason_no_id" range-key="title"
					:range="reason">
					<view class="list-reson">
						<view class="left">不良原因</view>
						<view class="right">
							<text>{{ reason[item.reasonIndex] ? reason[item.reasonIndex].title : '' }}</text>
							<image src="../../static/next.png"></image>
						</view>
					</view>
				</picker>
				<view class="list-reson">
					<view class="left">物料名称</view>
					<view class="right"><input v-model="item.raw_name" placeholder="请输入" /></view>
				</view>
				<view class="list-reson">
					<view class="left">线别</view>
					<view class="right">
						<text>{{ planInfo.line_title }}</text>
						<!-- <image src="../../static/next.png"></image> -->
					</view>
				</view>
				<picker @change="frequencyChange($event, index)" :value="item.frequency" :range="frequency">
					<view class="list-reson">
						<view class="left">班次</view>
						<view class="right">
							<text>{{ frequency[item.frequency] }}</text>
							<image src="../../static/next.png"></image>
						</view>
					</view>
				</picker>
				<picker mode="date" @change="dateChange($event, index)">
					<view class="list-reson">
						<view class="left">冲压日期</view>
						<view class="right"><input v-model="item.stamping_date" disabled="" placeholder="请选择" /></view>
					</view>
				</picker>
				<!-- <view class="list-reson">
					<view class="left">不良总数</view>
					<view class="right"><input placeholder="请输入" /></view>
				</view> -->
				<view class="list-reson">
					<view class="left">返修合格数</view>
					<view class="right"><input v-model="item.repair_regular" type="number" placeholder="请输入" /></view>
				</view>
				<view class="list-reson">
					<view class="left">返修报废数</view>
					<view class="right"><input v-model="item.repair_scrap" type="number" placeholder="请输入" /></view>
				</view>
				<!-- <view class="list-reson">
					<view class="left">不良品处置</view>
					<view class="right"><input placeholder="请输入" /></view>
				</view> -->
				<view class="btn-jian" v-if="index > 0" @tap="froms.splice(index, 1)">
					<image src="../../static/jian.png"></image>
					<text>删除</text>
				</view>
			</view>
		</view>
		<view class="btn-jia" @tap="add">
			<image src="../../static/jia.png"></image>
			<text>添加</text>
		</view>
		<view class="submit-btn"><button :disabled="buttonState==false?true:false" @tap="submit"
				type="primary">提交</button></view>
	</view>
</template>

<script>
	import {
		repair,
		reasonNo
	} from '../../api/index.js';
	import {
		repairDetail
	} from "../../api/user.js"
	export default {
		onLoad(e) {
			this.planInfo = JSON.parse(decodeURIComponent(e.badProduct));
			this.froms[0].line_id = this.planInfo.line_id;
			reasonNo({
				status: 1
			}).then(res => {
				this.reason = res;
				this.getInfo();
			});
		},
		data() {
			return {
				planInfo: {},
				lineIndex: 0,
				frequency: ['白班', '夜班'],
				frequencyIds: 0,
				reason: [],
				reasonIds: 0,
				buttonState: true,
				ifEdit: 0,
				froms: [

					{
						plan_id: 0,
						raw_name: '',
						line_id: 0,
						frequency: 0,
						stamping_date: '',
						reason_no_id: 0,
						repair_regular: '',
						repair_scrap: '',
						reasonIndex:0
					}
				]
			};
		},
		methods: {
			getReasonIndex(item) {
				return this.reason.findIndex(value => {
					return value.id == item.reason_no_id;
				});
			},
			getInfo() {
				repairDetail({
					plan_id: this.planInfo.plan_id
				}).then(res => {
					if (res) {
						res.map(items => {
							console.log("不良品详情id", items.id)
							this.froms.map(its => {
								its.id = items.id
							})
						})
						this.froms = res.map(item=>{
							item.reasonIndex=this.getReasonIndex(item);
							return item;
						})
						this.ifEdit = 1
						console.log("不良品详情", this.froms)
					}

				})
			},
			add() {
				this.froms.push({
					raw_name: '',
					plan_id: this.planInfo.plan_id,
					line_id: this.planInfo.line_id,
					frequency: 0,
					stamping_date: '',
					reason_no_id: 0,
					repair_regular: '',
					repair_scrap: '',
					reasonIndex:0
				});
			},
			dateChange(e, index) {
				this.froms[index].stamping_date = e.detail.value;
			},

			reasonChange(e, index) {
				this.froms[index].reasonIndex = e.detail.value;
			},
			frequencyChange(e, index) {
				this.froms[index].frequency = e.detail.value;
			},
			submit() {
				for (let b in this.froms) {
					if (this.froms[b].raw_name == '') {
						this.$functions.error('请填写物料名称');
						return false;
					}
					if (this.froms[b].stamping_date == '') {
						this.$functions.error('请选择日期');
						return false;
					}
				}

				let params = JSON.parse(JSON.stringify(this.froms));
				params = params.map(item => {
					item.reason_no_id = this.reason[item.reasonIndex].id;
					return item;
				});
				this.buttonState = false;
				this.$functions.confirm("是否进行此操作?").then(() => {
					repair({
						data: params
					}).then(res => {
						this.$functions.success('提交成功').then(() => {
							uni.navigateBack();
						})
					}).catch(res => {
						this.buttonState = true;
					});
				}).catch(res => {
						this.buttonState = true;
					});

				// repair({ data: params }).then(res => {
				// 	this.$functions.success('提交成功').then(() => {
				// 		uni.navigateBack({});
				// 	});
				// });
			}
		}
	};
</script>

<style lang="scss">
	@import './index.scss';
</style>
