<template>
	<view>
		<view class="sm-box">
			<view class="card">
				<view class="title">注:</view>
				<view class="content">1.量化的需填写真实测量数据；</view>
				<view class="content">2.无量化检查项填写检查结果，结果判定：合格的填写“OK”，不合格的填“NG”；</view>
			</view>
			<view class="content-box-card">
				<view class="content-box-card-ul-two">
					<view class="content-box-card-list">
						<view class="content-box-card-title">物料编号:</view>
						<text>{{ CyInfo.product_number }}</text>
					</view>
					<view class="content-box-card-list">
						<view class="content-box-card-title">生产日期:</view>
						<text>{{ CyInfo.production }}</text>
					</view>
				</view>
				<view class="content-box-card-ul-two">
					<view class="content-box-card-list">
						<view class="content-box-card-title">机型:</view>
						<text>{{ CyInfo.product_size }}</text>
					</view>
					<view class="content-box-card-list">
						<view class="content-box-card-title">班次:</view>
						<picker @change="bindline" :value="froms.frequency" :range="line">
							<view class="lin-div">
								<text>{{ line[froms.frequency] }}</text>
								<image src="../../static/xiala.png"></image>
							</view>
						</picker>
					</view>
				</view>
				<view class="content-box-card-ul-two">
					<!-- <view class="content-box-card-list">
						<view class="content-box-card-title">时间段:</view>
						<text>2021-07-15</text>
					</view> -->
					<!-- <view class="content-box-card-list">
						<view class="content-box-card-title">检测员:</view>
						<text>{{ info ? info.name : '' }}</text>
					</view>
					<view class="content-box-card-list">
						<view class="content-box-card-title">生产数量:</view>
						<input type="number" v-model="froms.product_number" />
					</view> -->
				</view>
				<!-- <view class="content-box-card-ul-two">
					<view class="content-box-card-list">
						<view class="content-box-card-title">不合格数:</view>
						<input type="number" v-model="froms.no_number" />
					</view>

					<view class="content-box-card-list">
						<view class="content-box-card-title">报废数:</view>
						<input type="number" v-model="froms.scrap" />
					</view>
				</view> -->
			</view>
		</view>

		<view v-for="(item, index) in configSet" :key="index">
			<view class="big-title">{{ item.status_name }}</view>
			<view v-for="(value, idx) in item.product_tcq_conf" :key="idx" class="cyxj-content">
				<view class="cyxj-content-card">
					<view class="tx-ul">
						<view class="tx-title">{{ value.spec }}</view>
						<view class="tx-in-nav">
							<view>{{value.bottom}}</view>
							<input :class="value.inputState==false?'re-bor':''" :disabled="type==2?true:false" type="number" @input="inputListener($event,index, idx)" v-model="value.input"
								placeholder="请输入" />
							<view>{{value.top}}</view>
						</view>
					</view>
					<view class="re-colo" v-if="value.inputState==false">
						请输入范围内的值
					</view>
				</view>
			</view>
		</view>
		
		<view class="cyxj-content" style="margin-top: 24upx;">
			<view class="bzqk-card"><textarea v-model="froms.remake"  placeholder="备注情况说明" /></view>
			<view class="submit-btn">
				<button v-if="type==1" type="primary" :disabled="buttonState==false?true:false" @tap="submits">提交并发起审核</button>
				<button v-if="type==3" @tap="applys()" type="primary">审核</button>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		tcqCheckAdd,
		tcqCheckDetail,
		bad,
		productTcqConf,
		tcqCheckSure
	} from '../../api/user.js';
	import {
		mapGetters,
		mapMutations
	} from 'vuex';
	export default {
		data() {
			return {
				power: [],
				jurisdiction: [],
				type: 0,
				id: 0,
				ifSubmit: false,
				line: ['夜班', '白班'],
				ifcomplete: ['OK', 'NG'],
				ifcompleteIds: 0,
				methList: [],
				methIds: 0,
				planId: 0,
				CyInfo: {},
				info: {},
				froms: {
					item: [],
					plan_id: '',
					//model: '',
					frequency: 0, //班次
					remake: '' //，备注
				},
				configSet: [],
				buttonState: true,
				productId: 0
			};
		},
		onShow() {
			this.isMenu();
		},
		computed: {
			...mapGetters(['userInfo', 'roleType'])
		
		},
		onLoad(e) {
			this.type = e.type;
			this.pId = e.plan_id;
			this.id = e.id;
			this.productId = e.product_id;
			this.froms.plan_id = this.pId;
			this.CyInfo = JSON.parse(decodeURIComponent(e.planInfo));
			this.power = this.userInfo.power
			this.getArr();
			
			if (this.type == 2||this.type == 3) {
				this.getInfo();
			}else{
				this.getConfig();
			}
			bad({}).then(res => {
				for (let b in res) {
					this.methList.push(res[b]);
				}
			});
			
		},
		methods: {
			getArr() {
				let newArr = this.power.map(item => {
					if (item.children) {
			
						item.children.map(items => {
							this.jurisdiction.push(items.title)
							return items
						})
					}
			
				})
				//console.log("xinshuzu", this.jurisdiction)
			},
			isMenu(title) {
				return this.jurisdiction.includes(title);
			},
			inputListener(e, index, idx) {
				let item = this.configSet[index].product_tcq_conf[idx];
				if (!item.input) {
					this.configSet[index].product_tcq_conf[idx].inputState = false;
				} else {
					if (item.input < item.bottom || item.input > item.top) {
						this.configSet[index].product_tcq_conf[idx].inputState = false;
					}
					 else {
						this.configSet[index].product_tcq_conf[idx].inputState = true;
					}
				}
				
			},
			getConfig() {
				productTcqConf({
					type: 1,
					product_id: this.CyInfo.product_id
				}).then(res => {
					this.configSet = res.map(item => {
						item.product_tcq_conf = item.product_tcq_conf.map(value => {
							return this.matchingConfig(value);
						});
						return item;
					});
				});
				
			},
			matchingConfig(value) {
				value.input = '';
				value.inputState = true;
				let CheckCyMsg = this.info.CheckTcqMsg ? this.info.CheckTcqMsg : [];
				for (let b in CheckCyMsg) {
					if (CheckCyMsg[b].id == value.id) {
						let json = JSON.parse(CheckCyMsg[b].json);
						console.log(value.id)
						console.log(json)
						value.input = json.input;
						break;
					}
				}
				return value;
			},

			getInfo() {
				tcqCheckDetail({
					plan_id: this.pId,
					id: this.id,
					product_id:this.productId
				}).then(res => {
					console.log("res",res)
					this.info = res;
					this.froms.plan_id = this.pId;
					//this.froms.model = res.model;
					this.froms.frequency = res.frequency;
					this.froms.remake = res.remake;
				//	this.configSet=res.CheckTcqMsg;
					
					this.getConfig();

				});
			},
			bindline: function(e) {
				
				this.froms.frequency = e.target.value;
			},
			pickerChange(e, index, idx) {
				
				this.configSet[index].product_tcq_conf[idx].situation = this.methList[e.detail.value];
			},
			submits() {
				if (!this.buttonState) {
					return false;
				}
				for (let b in this.configSet) {
					for (let i in this.configSet[b].product_tcq_conf) {
						let items = this.configSet[b].product_tcq_conf[i];
						if (!items.input) {
							this.$functions.error('请完整填写信息');
							return false;
						}

						this.froms.item.push({
							check_tcq_id: items.id,
							status:this.configSet[b].status,
							json: {
								input: items.input
							}
						});
					}
				}

				this.buttonState = false;
				tcqCheckAdd(this.froms).then(res => {
					this.$functions.success('提交成功').then(() => {
						uni.navigateBack();
					}).catch(res => {
						this.buttonState = true;
					});
				});
			},
			applys() {
				this.$functions.confirm('是否确定操作？').then(res => {
					tcqCheckSure({
						plan_id: this.info.plan_id,
						play_id: this.info.play_id,
						id:this.id
					}).then(res => {
						this.$functions.success('操作成功').then(() => {
							uni.navigateBack({});
						});
					});
				});
			}
		}
	};
</script>

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