<template>
	<view>
		<view class="contet-up-card">
			<view class="contet-up-card-cont">
				<view class="contet-up-card-cont-list">
					<view>产品名称:</view>
					<text>{{CyInfo.title}}</text>
				</view>
				<view class="contet-up-card-cont-list">
					<view>检测日期:</view>
					<text>{{CyInfo.create_time}}</text>
				</view>
				<view class="contet-up-card-cont-list">
					<view>规格型号:</view>
					<text>{{CyInfo.spec}}</text>
				</view>
				<picker @change="bindDetectionMode" :value="detectionModeIndex" :range="detectionMode">
					<view class="contet-up-card-cont-list">
						<view>检测方式:</view>
						<view class="jcfs-div">
							{{detectionMode[detectionModeIndex]}}
							<image src="../../static/xiala.png"></image>
						</view>
					</view>
				</picker>
				<view class="contet-up-card-cont-list">
					<view>供应商:</view>
					<text>{{CyInfo.supplier}}</text>
				</view>
				<view class="contet-up-card-cont-list">
					<view>送货单号:</view>
					<input type="number" v-model="froms.order_no" />
				</view>
				<view class="contet-up-card-cont-list">
					<view>到货数量:</view>
					<input type="number" v-model="froms.arrival_quantity" />
				</view>
				<view class="contet-up-card-cont-list">
					<view>检测数量:</view>
					<input v-model="froms.number_of_inspections" type="number" />
				</view>
			</view>
		</view>

		<view class="contet-up-card" style="margin-top: 20upx;">
			<view class="btitle-cc">尺寸检测数据</view>
			<!-- <view class="contet-up-card-cont">
				<view class="contet-up-card-cont-list" v-for="(item,key,index) in froms.dimensional_inspection[0]"
					:key="index">
					<view>尺寸检测数据:</view>
					<input v-model="froms.dimensional_inspection[0][key]" type="number" />
				</view>
			</view> -->
			<view class="cc-card" v-for="(item,index) in froms.dimensional_inspection" :key="index">
				<view class="pd-ul2">
					<view class="pd-title">规格</view>
					<view class="pd-list">
						<text>{{item.size}}</text>
					</view>
					<view class="pd-title">最大值</view>
					<view class="pd-list">
						<text>{{item.up}}</text>
					</view>
					<view class="pd-title">最小值</view>
					<view class="pd-list">
						<text>{{item.down}}</text>
					</view>
				</view>
				<view class="cc-input-ul">
					<view class="cc-input-list">
						<view class="title">rule</view>
						<view class="cc-input">
							<input type="number" @input="updateResult($event,index)"
								:class="item.rule!=''&&(item.rule>item.up||item.rule<item.down)?'borders':''"
								v-model="item.rule" />
						</view>
					</view>
					<view class="cc-input-list">
						<view class="title">no1</view>
						<view class="cc-input">
							<input type="number" @input="updateResult($event,index)"
								:class="item.no1!=''&&(item.no1>item.up||item.no1<item.down)?'borders':''"
								v-model="item.no1" />
						</view>
					</view>
					<view class="cc-input-list">
						<view class="title">no2</view>
						<view class="cc-input">
							<input type="number" @input="updateResult($event,index)"
								:class="item.no2!=''&&(item.no2>item.up||item.no2<item.down)?'borders':''"
								v-model="item.no2" />
						</view>
					</view>
					<view class="cc-input-list">
						<view class="title">no3</view>
						<view class="cc-input">
							<input type="number" @input="updateResult($event,index)"
								:class="item.no3!=''&&(item.no3>item.up||item.no3<item.down)?'borders':''"
								v-model="item.no3" />
						</view>
					</view>
					<view class="cc-input-list">
						<view class="title">no4</view>
						<view class="cc-input">
							<input type="number" @input="updateResult($event,index)"
								:class="item.no4!=''&&(item.no4>item.up||item.no4<item.down)?'borders':''"
								v-model="item.no4" />
						</view>
					</view>
					<view class="cc-input-list">
						<view class="title">no5</view>
						<view class="cc-input">
							<input type="number" @input="updateResult($event,index)"
								:class="item.no5!=''&&(item.no5>item.up||item.no5<item.down)?'borders':''"
								v-model="item.no5" />
						</view>
					</view>
				</view>
				<view class="pd-ul">
					<view class="pd-title">判定</view>
					<view class="pd-list">
						<image :src="item.result=='OK'?'../../static/xz.png':'../../static/wxz.png'"></image>
						<text>OK</text>
					</view>
					<view class="pd-list">
						<image :src="item.result=='NG'?'../../static/xz.png':'../../static/wxz.png'"></image>
						<text>NG</text>
					</view>
				</view>
			</view>
		</view>
		<view class="testing">
			<view v-for="(item,index) in item" :key="index">
				<view class="card">
					<view class="testing-list">
						<view class="testing-list-title">检测项:</view>
						<text>{{item.check_item}}</text>
					</view>
					<view class="testing-list">
						<view class="testing-list-title">检测工具:</view>
						<input :disabled="true" v-model="item.check_tool" />
					</view>
					<view class="testing-list">
						<view class="testing-list-title">抽样标准:</view>
						<!-- <text class="check-btn" @tap="checkBtn(index)">点击查看</text> -->
					</view>
					<view class="cybz-card">
						{{item.standard}}
					</view>
					<view class="testing-list">
						<view class="testing-list-title">检测数量:</view>
						<view>
							<input type="number" v-model="item.check_number" />
						</view>
					</view>
					<picker @change="bindDetermine($event,index)" :value="item.status" :range="determine">
						<view class="contet-up-card-cont-list">
							<view style="width: 240upx;">判定:</view>
							<view class="jcfs-div">
								{{determine[item.status]}}
								<image src="../../static/xiala.png"></image>
							</view>
						</view>
					</picker>
					<view class="testing-list" style="align-items: flex-start;">
						<view class="testing-list-title">{{detectionMode[detectionModeIndex]}}结果:</view>
						<textarea v-model="item.check_result"
							style="height: 100upx;border: 1upx solid #F1F1F1;width: 400upx;font-size: 26upx;padding-top: 10upx;padding-left: 10upx;"
							placeholder="请输入抽检结果"></textarea>
					</view>

				</view>

			</view>
			<picker @change="bindResult" :value="resltIds" :range="result">
				<view class="testing-list" style="align-items: center;font-size: 26upx;margin-left: 50upx;">
					<view>产品检验结果:</view>
					<view
						style="height: 50upx;border: 1upx solid #F1F1F1;width:200upx;font-size: 26upx;padding-top: 10upx;padding-left: 10upx;margin-left: 100upx;">
						{{result[resltIds]}}
						<image style="width: 33upx;height: 33upx;" src="../../static/xiala.png"></image>
					</view>
				</view>
			</picker>
			<view class="testing-list" v-if="resltIds==1" style="align-items: flex-start;">
				<view class="testing-list-title">检验不合格描述:</view>
				<textarea v-model="froms.result_describe"
					style="height: 100upx;border: 1upx solid #F1F1F1;width: 400upx;font-size: 26upx;padding-top: 10upx;padding-left: 10upx;"
					placeholder="请输入抽检结果"></textarea>
			</view>
			<view class="submit-btn">
				<button type="primary" @tap="submit" :disabled="buttonState==false?true:false"
					v-if="!check_status&&isMenu('原材料提交')">提交</button>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		materialItem,
		dictionary,
		materialCheckForm,
		rawFormDetail
	} from "../../api/user.js"
	import {
		mapGetters,
		mapMutations
	} from 'vuex';
	export default {
		data() {
			return {
				info: {},
				itemList: [],
				result: ["合格", "不合格"],
				resltIds: 0,
				detectionMode: ["全检", "抽检"],
				detectionModeIndex: 0,
				determine: ["合格", "不合格"],
				determineIndex: 0,
				ifCheck: false,
				sendId: -1,
				CyInfo: {},
				item: [], //检验项目列表
				crrentIds: 0,
				type: 0,
				check_status: 0,
				jyxItem: {},
				buttonState: true,
				jurisdiction: [],
				standard: {},
				tooList: [],
				power: [],
				froms: {
					result: 1,
					purchase_id: '', //采购数据ID
					name: '', //材料名字
					rule: '', //规格
					check_type: 0, //检测类型：1=抽检，2=全检
					supplier: '', //供应商
					order_no: '', //送货单号
					item: [],
					arrival_quantity: "", //到货数量
					number_of_inspections: "", //检测数量
					result_describe: '', //检验不合格描述
					dimensional_inspection: [], //尺寸
				}
			};
		},
		computed: {
			...mapGetters(['userInfo', 'roleType'])

		},
		onLoad(e) {
			this.CyInfo = JSON.parse(decodeURIComponent(e.planInfo));
			this.type = this.CyInfo.examine_status
			this.check_status = this.CyInfo.m_id
			this.power = this.userInfo.power
			this.getitem()
			this.getArr()
			this.isMenu();

			console.log('检验项', this.userInfo)
		},
		methods: {
			getArr() {
				if (this.power.length > 0) {
					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);
			},
			getitem() {
				materialItem({
					name: this.CyInfo.purchase_number
				}).then(res => {
					this.itemList = res.item;
					this.standard = res.standard;
					this.tooList = res.tool;
					for (let b in res.item) {
						this.item.push({
							check_item: res.item[b],
							standard: res.standard[b],
							check_number: '',
							status: 0,
							check_result: '',
							check_tool: res.tool[b],
							check: false
						})
					}

					if (this.check_status) {
						this.getInfo()
					}

					res.size.map(item => {
						this.froms.dimensional_inspection.push({
							rule: "",
							no1: "",
							no2: "",
							no3: "",
							no4: "",
							no5: "",
							size: item.size,
							up: item.up,
							down: item.down,
							result: 'NG'
						})
					})

				})
			},
			updateResult(e, index) {
				let item = this.froms.dimensional_inspection[index];
				if ((item.rule > item.up || item.rule < item.down) || (item.no1 >
						item.up || item.no1 < item.down) || (item.no2 > item.up || item.no2 < item
						.down) || (item.no3 > item.up || item.no3 < item
						.down) || (item.no4 > item.up || item.no4 < item
						.down) || (item.no5 > item.up || item.no5 < item
						.down)) {
					this.froms.dimensional_inspection[index].result = "NG";
				} else {
					this.froms.dimensional_inspection[index].result = "OK";
				}
			},
			getInfo() {
				rawFormDetail({
					purchase_id: this.CyInfo.id
				}).then(res => {
					this.info = res
					this.item = this.info.item.map(item => {
						for (let b in this.standard) {
							if (b == item.check_item) {
								item.standard = this.standard[b];

								break;
							}
						}
						for (let b in this.itemList) {
							if (b == item.check_item) {
								item.check_item = this.itemList[b];
								break;
							}
						}



						return item;
					})
					this.froms.dimensional_inspection = this.info.dimensional_inspection
					this.froms.order_no = this.info.data.order_no
					this.froms.arrival_quantity = this.info.data.arrival_quantity
					this.froms.number_of_inspections = this.info.data.number_of_inspections
					this.resltIds = this.info.data.result - 1
					console.log("原材料检验详情", res)
				})
			},
			bindDetectionMode: function(e) {
				this.detectionModeIndex = e.target.value;

			},
			bindDetermine: function(e, index) {

				this.determineIndex = e.target.value;
				this.item[index].status = e.target.value
			},
			bindResult(e) {
				this.resltIds = e.target.value
			},
			checkBtn(index) {
				this.item[index].check == false ? this.item[index].check = true : this
					.item[index].check = false;
				//this.sendId=index

			},
			submit() {
				this.froms.name = this.CyInfo.title;
				this.froms.supplier = this.CyInfo.supplier;
				this.froms.rule = this.CyInfo.spec;
				this.froms.purchase_id = this.CyInfo.id;
				this.froms.check_type = this.detectionModeIndex + 1
				this.froms.item = this.item;
				this.froms.result = this.resltIds + 1;
				this.item.map(item => {
					delete item.check;
					delete item.standard

				})

				let params = JSON.parse(JSON.stringify(this.froms));

				params.item = params.item.map(item => {

					for (let b in this.itemList) {
						if (item.check_item == this.itemList[b]) {
							item.check_item = b;
							break;
						}
					}

					return item;

				})
				this.buttonState = false
				this.$functions.confirm("是否进行此操作?").then(() => {
					materialCheckForm(params).then(res => {
						this.$functions.success("提交成功").then(() => {
							uni.navigateBack()
						}).catch(res => {
							this.buttonState = true
						})
					})
				})

			}
		}
	}
</script>

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