<template>
	<view>
		<view class="white-card">
			<view class="list-list">
				<view class="list-title">物料编号</view>
				<view class="list-right">
					<text>{{ planInfo.product_number }}</text>
				</view>
			</view>
			<view class="list-list">
				<view class="list-title">填报日期</view>
				<view class="list-right">
					<text>{{ planInfo.production }}</text>
				</view>
			</view>
			<view class="list-list">
				<view class="list-title">线别</view>
				<view class="list-right">
					<text>{{ planInfo.line_title }}</text>
					<!-- <image class="next" src="../../static/next.png"></image> -->
				</view>
			</view>
		</view>
		<view v-for="(item, index) in froms" :key="index" class="white-card" style="margin-top: 24upx;padding-top: 30upx;padding-bottom: 30upx;">
			<view class="mid-card">
				<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 class="next" src="../../static/next.png"></image>
						</view>
					</view>
				</picker>
				<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.reason_no_id]?reason[item.reason_no_id].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.math" placeholder="请输入" /></view>
				</view>
				<view class="list-reson">
					<view class="left">不良品处置</view>
					<view class="right"><input v-model="item.remake" placeholder="请输入" /></view>
				</view>
				<view class="btn-jian" @tap="froms.splice(index, 1)" v-if="index > 0&&ifEdit!=0">
					<image src="../../static/jian.png"></image>
					<text>删除</text>
				</view>
			</view>
		</view>
		<view class="btn-jia" @tap="add" v-if="ifEdit!=0">
			<image src="../../static/jia.png"></image>
			<text>添加</text>
		</view>
		<view class="submit-btn"><button :disabled="buttonState==false?true:false" type="primary" @tap="submit">提交</button></view>
	</view>
</template>

<script>
import { reasonNo, badReasons } from '../../api/index.js';
import {noDetail} from "../../api/user.js";
export default {
	onLoad(e) {
		this.planInfo = JSON.parse(decodeURIComponent(e.badProduct));
		this.froms[0].plan_id = this.planInfo.plan_id;
		reasonNo({ status: 1 }).then(res => {
			this.reason = res;
		});
		this.getInfo()
	},
	data() {
		return {
			planInfo: {},
			ifEdit:0,
			frequency: ['白班', '夜班'],
			reason: [],
			froms: [
				{
					plan_id: 0,
					reason_no_id: 0,
					math: "",
					remake: '',
					status: 1,
					frequency: 0
				}
			],
			buttonState:true,
		};
	},
	methods: {
		frequencyChange(e, index) {
			this.froms[index].frequency = e.detail.value;
		},
		getReasonContent(id) {
			let info = this.reason.find(item => {
				return (item.id = id);
			});
			if (info) {
				return info.title;
			}
			return '请选择';
		},
		reasonChange(e, index) {
			this.froms[index].reason_no_id = e.detail.value;
		},
		add() {
			this.froms.push({
				plan_id: this.planInfo.plan_id,
				reason_no_id: 0,
				math: '',
				remake: '',
				status: 1,
				frequency: 0
			});
		},
		getInfo(){
			noDetail({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
					this.ifEdit=1
					console.log("不良品详情",this.froms)
				}
				
			})
		},
		submit() {
			let params = JSON.parse(JSON.stringify(this.froms));
			params = params.map(item => {
				item.reason_no_id = this.reason[item.reason_no_id].id;
				return item;
			});
			
			this.buttonState = false;
			this.$functions.confirm("是否进行此操作?").then(()=>{
				badReasons({data: params}).then(res => {
					this.$functions.success('提交成功').then(() => {
						uni.navigateBack();
					}).catch(res => {
						this.buttonState = true;
					});
				});
			})
			
		}
	}
};
</script>

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