<template>
	<u-modal width="90%" v-model="visable" :showConfirmButton="false" :showCancelButton="false" title="请填写检验单" content="操作内容">
		<u-button type="primary" class="reload-btn" @click="reloadTable" style="width: 200rpx">加载校验项</u-button>
		<u-form ref="qcForm" label-width="90px" class="addForm">
	    <u-row>
			<u-col span="4">
				<u-form-item label="检验单名称">
					{{ qcForm.iqcName }}
				</u-form-item>
			</u-col>
			<u-col span="4">
				<u-form-item label="检验单编号">
					{{ qcForm.iqcCode }}
				</u-form-item>
			</u-col>
			<u-col span="4">
				<u-form-item label="检测结果" prop="checkResult">
				<u-radio-group v-model="qcForm.checkResult">
					<u-radio :name="item.value" v-for="item in dict.type.mes_qc_result" :key="item.value">
					{{ item.label }}
					</u-radio>
				</u-radio-group>
				</u-form-item>
			</u-col>
			<u-col span="3">
				<u-form-item label="采购单号">
					{{ qcForm.purchaseNo }}
				</u-form-item>
			</u-col>
			<u-col span="3">
				<u-form-item label="采购单行号">
					{{ qcForm.purchaseLineNo }}
				</u-form-item>
			</u-col>
			<u-col span="3">
				<u-form-item label="送货单号">
					{{ qcForm.deliveryNo }}
				</u-form-item>
			</u-col>
			<u-col span="3">
				<u-form-item label="送货单行号">
					{{ qcForm.deliveryLineNo }}
				</u-form-item>
			</u-col>
			<u-col span="3">
				<u-form-item label="批次号">
					{{ qcForm.batchNo }}
				</u-form-item>
			</u-col>
			<u-col span="3">
				<u-form-item label="批次数量">
					{{ qcForm.quantity }}
				</u-form-item>
			</u-col>
			<u-col span="3">
				<u-form-item label="单位">
					{{ qcForm.unitOfMeasure }}
				</u-form-item>
			</u-col>
			<u-col span="3">
				<u-form-item label="送货日期">
					{{ qcForm.deliveryDate }}
				</u-form-item>
			</u-col>
			<u-col span="3">
				<u-form-item label="物料分类">
					{{ qcForm.itemTypeName }}
				</u-form-item>
			</u-col>
			<u-col span="3">
				<u-form-item label="物料编码">
					{{ qcForm.sapItemCode }}
				</u-form-item>
			</u-col>
			<u-col span="6">
				<u-form-item label="物料名称">
					{{ qcForm.itemName }}
				</u-form-item>
			</u-col>
	    </u-row>
	    <u-row>
	      <u-col span="4">
	        <u-form-item label="检测数量" prop="quantityCheck">
	          <u-number-box disabled v-model="qcForm.quantityCheck"></u-number-box>
	        </u-form-item>
	      </u-col>
	      <u-col span="4">
	        <u-form-item label="合格数量" prop="quantityQualified">
	          <u-number-box :min="0" v-model="qcForm.quantityQualified" @change="handleChangeQuantityCheck" :long-press="false"></u-number-box>
	        </u-form-item>
	      </u-col>
	      <u-col span="4">
	        <u-form-item label="不合格数量" prop="quantityUnqualified">
	          <u-number-box :min="0" v-model="qcForm.quantityUnqualified" @change="handleChangeQuantityCheck" :long-press="false"></u-number-box>
	        </u-form-item>
	      </u-col>
	    </u-row>
	    <u-row>
	      <u-col span="4">
	        <u-form-item label="检测人员" prop="inspectorName">
	          <u-input disabled v-model="qcForm.inspectorName"></u-input>
						<u-button @tap="userTempVisible=true" v-if="btnType !== 'firstView'" type="success" size="mini">选择人员</u-button>
	        </u-form-item>
	      </u-col>
	    </u-row>
	  </u-form>
	   <scroll-view scroll-y="true" show-scrollbar="true" class="line-content-item">
	      <uni-table ref="qcLineTable" class="line-table" border stripe :loading="loading" emptyText="未查询到数据">
	        <uni-tr>
	          <uni-th width="100px" align="center">质检项目</uni-th>
	          <uni-th width="100px" align="center">检验要求</uni-th>
	          <uni-th width="150px" align="center">检验结果</uni-th>
						<!-- <uni-th width="15px" align="center">操作</uni-th> -->
	        </uni-tr>
	        <uni-tr v-for="(line, index) in qcLines" :key="index + 'index'">
	          <uni-td align="center">{{ line.indexName }}</uni-td>
	          <uni-td align="center">{{ line.checkMethod }}</uni-td>
	          <uni-td width="150px" align="center">
	            <uni-data-checkbox v-if="line.inputType == 2" multiple v-model="line.qualityCheckResults" :localdata="line.selectValues"></uni-data-checkbox>
	            <uni-easyinput v-else v-model="line.qualityCheckResults"></uni-easyinput>
	          </uni-td>
						<!-- <uni-td width="15px" align="center">
							<view @click="del('qcAddList', index)" :style="{color: isEdit ? '#e56048' : '#ddd'}">删除</view>
						</uni-td> -->
	        </uni-tr>
	      </uni-table>
	    </scroll-view>
			<u-modal
			  title="选择人员"
			  @confirm="userDetermine()"
			  show-cancel-button
			  :title-style="{ 'background-color': '#1E3770', color: '#FFFFFF', 'line-height': '37px', 'padding-top': '0px' }"
			  v-model="userTempVisible"
			  width="1300rpx"
			>
			  <view class="feedback-card">
			    <User ref="userRef" v-if="userTempVisible" />
			  </view>
			</u-modal>
			<view class="u-model__footer u-border-top">
				<view :hover-stay-time="100" hover-class="u-model__btn--hover" class="u-model__footer__button"
					 @tap="close">
					取消
				</view>
				<view :hover-stay-time="100" hover-class="u-model__btn--hover" v-if="showIpqcConfirmButton"
					class="u-model__footer__button hairline-left" @tap="save">
					保存
				</view>
				<view :hover-stay-time="100" hover-class="u-model__btn--hover" v-if="showIpqcConfirmButton"
					class="u-model__footer__button hairline-left" @tap="submitIpqc">
					确认提交
				</view>
			</view>
	</u-modal>
</template>

<script>
	import UniEasyinput from '../../../../uni_modules/uni-easyinput/components/uni-easyinput/uni-easyinput.vue';
	import UButton from '../../../../uview-ui/components/u-button/u-button.vue';
	import SearchInput from '@/components/ScanInput/index.vue';
	import User from '@/components/User/User.vue';
	export default {
		props: ["zjVisible", "qcAddIndex", "visible", "showIpqcConfirmButton", "btnType", "curQcType", "currentItem"],
		components: {
			SearchInput,
			User,
			UniEasyinput,
			UButton
		},
		dicts: ['mes_qc_result'],
		data() {
			return {
				qcForm: {
					workorderCode: '',
					arrangeCode: '',
					processId: '',
					ipqcName: '',
					checkResult: 'REJECT',
					quantityCheck: 1,
					quantityQualified: 1,
					quantityUnqualified: 0,
					inspectorName: '',
					inspector: ''
				},
				Condition: {},
				userTempVisible: false,
				loading: false,
				visable: true,
				qcAddList: [],
				qcLines: [],
				processList: []
			}
		},
		created() {
			this.visable = true
		},
		computed: {
			isEdit () {
				return this.btnType === 'firstEdit' || !this.btnType || this.btnType === 'sjqrFinish'
			}
		},
		watch: {
			visable(){
				this.$emit('update:visible', this.visable)
			},

			currentItem: {
				handler(){
					if(this.btnType && this.currentItem) {
						if (this.curQcType === 'IQC') {
							this.getIqcInfo(this.currentItem.iqcId)
						}
					}
				},
				immediate: true
			},
			btnType () {
				if(this.btnType === 'firstEdit') {
					this.qcForm.checkResult = this.qcForm.checkResult ? this.qcForm.checkResult : 'REJECT';
					this.qcForm.quantityCheck = this.qcForm.quantityCheck ? this.qcForm.quantityCheck : 1;
					this.qcForm.quantityQualified = this.qcForm.quantityQualified ? this.qcForm.quantityQualified : 1;
					this.qcForm.quantityUnqualified = this.qcForm.quantityUnqualified ? this.qcForm.quantityUnqualified : 0;
				}
			}
		},
		methods: {
			getIqcInfo (iqcId) {
				this.$u.api
					.getIqcInfo(iqcId)
					.then((res) => {
					if (res.code === 200) {
					  console.log(res, 'rows88999655');
					  res.data['iqcId'] = this.currentItem.iqcId
					  this.qcForm = res.data
					  this.qcLines = res.data.qcIqcLineList.map((item) => {
					    let selectValues = item.selectValues;
					    let qualityCheckResults = item.qualityCheckResults;
					    if (item.inputType == 2) {
					      // selectValues = selectValues? JSON.parse(item.selectValues) : []
					      if (selectValues) {
					        const data = JSON.parse(item.selectValues);
					        selectValues = data.map((item) => {
					          return {
					            text: item.name,
					            value: item.name
					          };
					        });
					      } else {
					        selectValues = [];
					      }
					      qualityCheckResults = qualityCheckResults ? JSON.parse(item.qualityCheckResults) : [];
					    }
					    return {
					      ...item,
					      selectValues,
					      qualityCheckResults
					    };
					  });
					  console.log(this.qcLines, 'this.qcLines');
					}
					});
				},
			del(list, index){
				if(this.isEdit) {
					uni.showModal({
						title: '提示',
						content: '您确定要删除此项吗？',
						style: 'z-index: 99999',
						success: async (res) => {
							if (res.confirm) {
								this[list].splice(index, 1)
							}
						}
					})
				}
			},
			reloadTable() {
				this.$u.api
					.reloadTable({'iqcCode': this.currentItem.iqcCode})
					.then((res) => {
					if (res.code === 200) {
					  console.log(res, 'rows88999655');
					  res.data['iqcId'] = this.currentItem.iqcId
					  this.qcForm = res.data
					  this.qcLines = res.data.qcIqcLineList.map((item) => {
					    let selectValues = item.selectValues;
					    let qualityCheckResults = item.qualityCheckResults;
					    if (item.inputType == 2) {
					      // selectValues = selectValues? JSON.parse(item.selectValues) : []
					      if (selectValues) {
					        const data = JSON.parse(item.selectValues);
					        selectValues = data.map((item) => {
					          return {
					            text: item.name,
					            value: item.name
					          };
					        });
					      } else {
					        selectValues = [];
					      }
					      qualityCheckResults = qualityCheckResults ? JSON.parse(item.qualityCheckResults) : [];
					    }
					    return {
					      ...item,
					      selectValues,
					      qualityCheckResults
					    };
					  });
					}
					});
			},
			userDetermine() {
			  this.qcForm.inspectorName = this.$refs.userRef.tableSelectData[0]?.nickName;
			  this.qcForm.inspector = this.$refs.userRef.tableSelectData[0]?.userName;
			},
			handleChangeQuantityCheck(e) {
				const sum = this.qcForm.quantityQualified + this.qcForm.quantityUnqualified;
				!isNaN(sum) && this.$set(this.qcForm, 'quantityCheck', sum);
			},
			handleAddFirstEdit() {
			  this.qcAddList.push({
			    indexName: '',
			    qualityCheckResults: ''
			  })
			},
			submitIpqc() {
				this.$u.api.commitIqcInfo(this.qcForm.iqcId).then(res=>{
					if(res.code === 200) {
						this.$u.toast('提交成功')
						this.$emit('confirm')
					} else {
						this.$u.toast(res.msg || '提交失败')
						this.$emit('confirm')
					}
				})

			},
			save() {
				this.$u.api.saveIqcInfo(this.qcForm).then(res=>{
					if(res.code === 200) {
						this.$u.toast('保存成功')
					} else {
						this.$u.toast('保存失败')
					}
				})
			},
			close(){
				this.$emit('close')
			}
		}
	}
</script>

<style lang="scss" scoped>
	.line-content-item {
	  width: 100%;
	  height: 300px;
	  display: flex;
	  flex-wrap: nowrap;
	}
	.line-table {
	  display: inline-block;
	}
	.addForm {
		padding: 0 40rpx;
	}
	.btnbox {
	  // display:flex;
	  margin-bottom: 10rpx;
	  margin-top: 10rpx;
	  padding-left: 40rpx;
	  .u-btn {
	    width: 150rpx;
	  }
	}
	.del-modal{
		z-index: 99999;
	}
	.u-model__footer {
		display: flex;

		.u-model__footer__button {
			flex: 1;
			height: 100rpx;
			line-height: 100rpx;
			font-size: 32rpx;
			box-sizing: border-box;
			cursor: pointer;
			text-align: center;
			border-radius: 4rpx;
		}
	}
	.reload-btn {
		position: absolute;
		top: 15rpx;
		left: 40rpx;
	}
</style>