<template>
	<view>
		<view class="white-card">
			<view class="list-list">
				<view class="list-title">物料编号</view>
				<view class="list-right">
					<text>{{CyInfo.product_number}}</text>
				</view>
			</view>
			<view class="list-list">
				<view class="list-title">填报日期</view>
				<view class="list-right">
					<text>{{CyInfo.production}}</text>
				</view>
			</view>
			<view class="list-list">
				<view class="list-title">线别</view>
				<view class="list-right">
					<text>{{CyInfo.line_title}}</text>
					<!-- <image class="next" src="../../static/next.png"></image> -->
				</view>
			</view>
			<view class="list-list">
				<view class="list-title">班次</view>
				<view class="list-right">
					<text>{{CyInfo.line_title==0?'夜班':'白班'}}</text>
				</view>
			</view>			
			<view class="list-list" v-if="ifEdit==1">
				<view class="list-title">班次</view>
				<view class="list-right" v-if="stopInfo.data.frequency">
					<text>{{stopInfo.data.frequency==0?'夜班':'白班'}}</text>
				</view>
			</view>
		</view>
		<view class="white-card" v-if="ifEdit==0" style="margin-top: 30upx;">
			<picker @change="bindReason($event,reason)" :value="reasonIds" :range="reason" :range-key="'item'">
				<view class="list-list">
					<view class="list-title">停线原因</view>
					<view class="list-right">
						<text>{{reason[reasonIds]?reason[reasonIds].item:"请选择"}}</text>
						<image class="next" src="../../static/next.png"></image>
					</view>
				</view>
			</picker>
		</view>
		<!-- 详情 -->
		<view class="white-card" v-if="ifEdit==1" style="margin-top: 30upx;">
			<view class="list-list">
				<view class="list-title">停线原因</view>
				<view class="list-right">
					<text>{{infoResonArr[0]?infoResonArr[0].item:''}}</text>
				</view>
			</view>
		</view>
		<!-- 详情 -->
		<view class="big-titlt" v-if="crrentReson=='设备维修'&&ifEdit==0">设备维修</view>
		<view class="big-titlt" v-if="infoResonId=='2'&&ifEdit==1">设备维修</view>
		<view class="white-card" v-if="crrentReson=='设备维修'&&ifEdit==0">
			<picker @change="bindmouldIds($event,deviceNo)" :value="devIds" :range-key="'name'" :range="deviceNo">
				<view class="list-list">
					<view class="list-title">设备编号</view>
					<view class="list-right">
						<text>{{deviceNo[devIds]?deviceNo[devIds].name:"请选择"}}</text>
						<image class="next" src="../../static/next.png"></image>
					</view>
				</view>
			</picker>
			<picker @change="ycxx($event,AbnormalPhenomenon)" :value="index" :range-key="'name'"
				:range="AbnormalPhenomenon">
				<view class="list-list">
					<view class="list-title">异常现象</view>
					<view class="list-right">
						<text>{{AbnormalPhenomenon[index]?AbnormalPhenomenon[index].name:""}}</text>
						<image class="next" src="../../static/next.png"></image>
					</view>
				</view>
			</picker>
			<picker @change="decYyfx($event,deviceCauseAnalysis)" :value="devYyIds" :range-key="'name'"
				:range="deviceCauseAnalysis">
				<view class="list-list">
					<view class="list-title">原因分析</view>
					<view class="list-right">
						<text>{{deviceCauseAnalysis[devYyIds]?deviceCauseAnalysis[devYyIds].name:""}}</text>
						<image class="next" src="../../static/next.png"></image>
					</view>
				</view>
			</picker>
			<picker @change="deviceDescription($event,deviceRepairDescription)" :value="devRepairids"
				:range-key="'name'" :range="deviceRepairDescription">
				<view class="list-list">
					<view class="list-title">维修描述</view>
					<view class="list-right">
						<text>{{deviceRepairDescription[devRepairids]?deviceRepairDescription[devRepairids].name:""}}</text>
						<image class="next" src="../../static/next.png"></image>
					</view>
				</view>
			</picker>
			<!-- <view class="list-list">
				<view class="list-title">维修时长</view>
				<view class="list-right">
					<input placeholder="请输入维修时长" v-model="froms.device[0].repair_time" />
				</view>
			</view> -->
			<picker @change="deviceStaff($event,staffList)" :value="staffIdx" :range-key="'name'" :range="staffList">
				<view class="list-list">
					<view class="list-title">维修人员</view>
					<view class="list-right">
						<text>{{staffList[staffIdx]?staffList[staffIdx].name:""}}</text>
						<image class="next" src="../../static/next.png"></image>
					</view>
				</view>
			</picker>
			<view class="bzqk-card">
				<textarea value="" v-model="froms.device[0].remark" placeholder="备注情况说明" />
			</view>
		</view>
		<!-- 详情 -->
		<view class="white-card" v-if="infoResonId=='2'&&ifEdit==1">
			<view class="list-list">
				<view class="list-title">设备编号</view>
				<view class="list-right">
					<text>{{infoDev[0]?infoDev[0].name:""}}</text>
				</view>
			</view>
			<view class="list-list">
				<view class="list-title">异常现象</view>
				<view class="list-right">
					<text>{{stopInfo.device[0]?stopInfo.device[0].unusual_phenomenon:''}}</text>
				</view>
			</view>
			<view class="list-list">
				<view class="list-title">原因分析</view>
				<view class="list-right">
					<text>{{stopInfo.device[0]?stopInfo.device[0].cause_analysis:''}}</text>
				</view>
			</view>

			<view class="list-list">
				<view class="list-title">维修描述</view>
				<view class="list-right">
					<text>{{stopInfo.device[0]?stopInfo.device[0].repair_description:''}}</text>
				</view>
			</view>

			<!-- <view class="list-list">
				<view class="list-title">维修时长</view>
				<view class="list-right">
					<input placeholder="请输入维修时长" v-model="froms.device[0].repair_time" />
				</view>
			</view> -->
			<view class="list-list">
				<view class="list-title">维修人员</view>
				<view class="list-right">
					<text>{{infoStaff[0]?infoStaff[0].name:''}}</text>
				</view>
			</view>
			<view class="bzqk-card">
				<textarea disabled='true' v-model="stopInfo.device[0].remark" placeholder="备注情况说明" />
			</view>
		</view>
		<!-- 详情 -->
		<view class="big-titlt" v-if="crrentReson=='模具维修'&&ifEdit==0">模具维修</view>
		<view class="big-titlt" v-if="infoResonId=='3'&&ifEdit==1">模具维修</view>
		<view class="white-card" v-if="crrentReson=='模具维修'&&ifEdit==0">
			<picker @change="bindmodeIds($event,mould)" :value="modeIds" :range="mould" :range-key="'title'">
				<view class="list-list">
					<view class="list-title">模具编号</view>
					<view class="list-right">
						<text>{{mould[modeIds]?mould[modeIds].title:""}}</text>
						<image class="next" src="../../static/next.png"></image>
					</view>
				</view>
			</picker>
			<picker @change="modeYcxx($event,modeUnnormal)" :value="modeUnIds" :range-key="'name'"
				:range="modeUnnormal">
				<view class="list-list">
					<view class="list-title">异常现象</view>
					<view class="list-right">
						<text>{{modeUnnormal[modeUnIds]?modeUnnormal[modeUnIds].name:''}}</text>
						<image class="next" src="../../static/next.png"></image>
					</view>
				</view>
			</picker>
			<picker @change="modeYyfx($event,modeCauseAnalysis)" :value="modeYyIds" :range-key="'name'"
				:range="modeCauseAnalysis">
				<view class="list-list">
					<view class="list-title">原因分析</view>
					<view class="list-right">
						<text>{{modeCauseAnalysis[modeYyIds]?modeCauseAnalysis[modeYyIds].name:""}}</text>
						<image class="next" src="../../static/next.png"></image>
					</view>
				</view>
			</picker>
			<picker @change="modeDescription($event,modeRepairDescription)" :value="modeRepairids" :range-key="'name'"
				:range="modeRepairDescription">
				<view class="list-list">
					<view class="list-title">维修描述</view>
					<view class="list-right">
						<text>{{modeRepairDescription[modeRepairids]?modeRepairDescription[modeRepairids].name:""}}</text>
						<image class="next" src="../../static/next.png"></image>
					</view>
				</view>
			</picker>
			<!-- <view class="list-list">
				<view class="list-title">维修时长</view>
				<view class="list-right">
					<input placeholder="请输入维修时长" v-model="froms.mode[0].repair_time" />
				</view>
			</view> -->
			<picker @change="modeStaff($event,staffList)" :value="modestaffIdx" :range-key="'name'"
				:range="modestaffList">
				<view class="list-list">
					<view class="list-title">维修人员</view>
					<view class="list-right">
						<text>{{modestaffList[modestaffIdx]?modestaffList[modestaffIdx].name:""}}</text>
						<image class="next" src="../../static/next.png"></image>
					</view>
				</view>
			</picker>
		</view>
		<!-- 模具详情 -->
		<view class="white-card" v-if="infoResonId=='3'&&ifEdit==1">
			<view class="list-list">
				<view class="list-title">模具编号</view>
				<view class="list-right">
					<text>{{infoMode[0]?infoMode[0].title:""}}</text>
				</view>
			</view>

			<view class="list-list">
				<view class="list-title">异常现象</view>
				<view class="list-right">
					<text>{{stopInfo.mode[0]?stopInfo.mode[0].unusual_phenomenon:''}}</text>
				</view>
			</view>
			<view class="list-list">
				<view class="list-title">原因分析</view>
				<view class="list-right">
					<text>{{stopInfo.mode[0]?stopInfo.mode[0].cause_analysis:''}}</text>
				</view>
			</view>

			<view class="list-list">
				<view class="list-title">维修描述</view>
				<view class="list-right">
					<text>{{stopInfo.mode[0]?stopInfo.mode[0].repair_description:''}}</text>
				</view>
			</view>

			<!-- <view class="list-list">
				<view class="list-title">维修时长</view>
				<view class="list-right">
					<input placeholder="请输入维修时长" v-model="froms.mode[0].repair_time" />
				</view>
			</view> -->
			<view class="list-list">
				<view class="list-title">维修人员</view>
				<view class="list-right">
					<text>{{infoStaff[0]?infoStaff[0].name:''}}</text>
				</view>
			</view>
			<view class="bzqk-card">
				<textarea disabled='true' v-model="stopInfo.mode[0].remark" placeholder="备注情况说明" />
			</view>
		</view>
		<view class="white-card" v-if="crrentReson!='设备维修'&&crrentReson!='模具维修'&&ifEdit==0">
			<view class="list-list" style="align-items: flex-start;">
				<view class="list-title" style="padding-top: 30upx;">情况描述</view>
				<view class="list-right" style="border: 1upx solid #F1F1F1;font-size: 26upx;">
					<textarea style="font-size: 26upx;text-indent:30upx;padding-top: 30upx;" placeholder="请输入情况描述"
						v-model="froms.remake" />
				</view>
			</view>
		</view>
		<!-- 详情 -->
		<view class="white-card" v-if="infoResonId!='2'&&infoResonId!='3'&&ifEdit==1">
			<view class="list-list" style="align-items: flex-start;">
				<view class="list-title" style="padding-top: 30upx;">情况描述</view>
				<view class="list-right" style="border: 1upx solid #F1F1F1;font-size: 26upx;">
					<textarea style="font-size: 26upx;text-indent:30upx;padding-top: 30upx;" disabled="true"
						placeholder="请输入情况描述" v-model="stopInfo.data.remake" />
				</view>
			</view>
		</view>
		<!-- <view class="white-card">
			<view class="bzqk-card">
				<textarea value="" placeholder="备注" v-model="froms.remake" />
			</view>
		</view> -->

		<view class="submit-btn" v-if="ifEdit==0">
			<button type="primary" :disabled="buttonState==false?true:false" @tap="stopLine()">提交</button>
		</view>
	</view>
</template>

<script>
	import {
		stopLineReason,
		device,
		mode,
		stopRecord,
		dictionary,
		staff,
		stopDetail
	} from "../../api/user.js"
	export default {
		data() {
			return {
				line: ["夜班", "白班"],
				lineIndex: 0,
				frequency: ["白班", "夜班"],
				frequencyIds: 0,
				reason: [],
				reasonIds: 0,
				mould: [],
				mouldIds: 0,
				deviList: [],
				CyInfo: {},
				resonList: [],
				deviceNo: [],
				devIds: 0,
				modeIds: 0,
				AbnormalPhenomenon: [],
				index: 0,
				crrentReson: '',
				modeUnnormal: [],
				modeUnIds: 0,
				devYyIds: 0,
				deviceCauseAnalysis: [],
				modeYyIds: 0,
				modeCauseAnalysis: [],
				deviceRepairDescription: [],
				devRepairids: 0,
				modeRepairDescription: [],
				modeRepairids: 0,
				staffList: [],
				staffIdx: 0,
				modestaffList: [],
				modestaffIdx: 0,
				buttonState: true,
				ifEdit: 0,
				stopId: '',
				froms: {
					plan_id: "",
					frequency: '1',
					reason_id: 0,
					remake: '',

					device: [{
						device_id: 1,
						unusual_phenomenon: '',
						cause_analysis: '',
						repair_description: '',
						//repair_time: '',
						repair_staff: '',
						remark: ''
					}],
					mode: [{
						mode_id: '',
						unusual_phenomenon: '',
						cause_analysis: '',
						repair_description: '',
						//repair_time: '',
						repair_staff: '',
						remark: ''
					}],
				},
				stopInfo: {},
				infoResonId: '',
				infoResonArr: [],
				infoDev: [],
				infoStaff: [],
				infoMode: []
			};
		},
		onLoad(e) {
			this.getReson();
			this.getDevice();
			this.getMode()
			if (e.id) {
				this.stopId = e.id
			}
			this.CyInfo = JSON.parse(decodeURIComponent(e.planInfo));
			this.froms.plan_id = this.CyInfo.plan_id;
			this.crrentReson = "设备维修"
			console.log('picker发送选择改变，携带值为', this.CyInfo)
			this.getdeviceException(); //获取设备异常现象
			this.getModeException(); //获取模具异常现象
			this.getDecYyfx(); //获取设备异常原因分析
			this.getDeviceRepairDescription(); //获取设备维修描述
			this.getModeRepairDescription()
			this.getStaff();
			this.getModeYyfx();
			if (this.stopId) {
				this.getInfo()
			}
		},
		methods: {
			getInfo() {
				stopDetail({
					id: this.stopId
				}).then(res => {
					if (res) {
						// res.map(items=>{
						// 	console.log("停线id",items.id)
						// 	this.froms.map(its=>{
						// 		its.id=items.id
						// 	})
						// })
						// this.froms=res
						this.stopInfo = res
						this.infoResonId = this.stopInfo.data.reason_id
						this.infoResonArr = this.reason.filter(item => item.id == this.infoResonId)
						this.ifEdit = 1


						let infoStffid = ''
						if (this.stopInfo.device.length > 0) {
							let devId = this.stopInfo.device[0].device_id
							let infoStffid = this.stopInfo.device[0].repair_staff

							this.infoDev = this.deviceNo.filter(item => item.id == devId)
							this.infoStaff = this.staffList.filter(item => item.id == infoStffid)
						}
						if (this.stopInfo.mode.length > 0) {
							let infoStffid = this.stopInfo.mode[0].repair_staff
							let modeIdInfo = this.stopInfo.mode[0].mode_id
							this.infoMode = this.mould.filter(item => item.id = modeIdInfo)
							this.infoStaff = this.staffList.filter(item => item.id == infoStffid)
						}


					}

				})
			},
			getStaff() {
				staff().then(res => {
					this.staffList = res;
					this.modestaffList = res;

					console.log("员工", res)
				})
			},
			getDevice() {
				device().then(res => {
					this.deviceNo = res
					console.log("设备编号11", this.deviceNo)
				})
			},
			getDeviceRepairDescription() {
				dictionary({
					key: 'device_repair_description'
				}).then(res => {
					this.deviceRepairDescription = res
					console.log("设备维修描述", res)
				})
			},
			getModeRepairDescription() {
				dictionary({
					key: 'mode_repair_description'
				}).then(res => {
					this.modeRepairDescription = res
					console.log("模具维修描述", res)
				})
			},
			getDecYyfx() {
				dictionary({
					key: 'device_cause_analysis'
				}).then(res => {
					this.deviceCauseAnalysis = res
					console.log("设备异常原因分析", res)
				})
			},
			getModeYyfx() {
				dictionary({
					key: 'device_cause_analysis'
				}).then(res => {
					this.modeCauseAnalysis = res
					console.log("模具异常原因分析", res)
				})
			},
			getMode() {
				mode().then(res => {
					this.mould = res
					console.log("mode", this.mould)
				})
			},
			getdeviceException() {
				dictionary({
					key: 'device_exception'
				}).then(res => {
					this.AbnormalPhenomenon = res
					console.log("异常现象", res)
				})
			},
			getModeException() {
				dictionary({
					key: 'mode_exception'
				}).then(res => {
					this.modeUnnormal = res
					console.log("异常现象11", this.modeUnnormal)
				})
			},
			ycxx(e, storage) {
				if (storage.length > 0) {
					this.index = e.target.value

					console.log("aaa", this.froms.device[0].unusual_phenomenon)
				}

			},
			modeYcxx(e, item) {
				if (item.length > 0) {
					this.modeUnIds = e.target.value

				}

			},
			decYyfx(e, item) {
				if (item.length > 0) {
					this.devYyIds = e.detail.value;

					console.log("aaa", this.froms.device[0].cause_analysis)
				}

			},
			modeYyfx(e, item) {
				if (item.length > 0) {
					this.modeYyIds = e.detail.value;

					console.log("aaa", this.froms.mode[0].cause_analysis)
				}

			},
			deviceDescription(e, item) {
				if (item.length > 0) {
					this.devRepairids = e.detail.value;

				}

			},
			modeDescription(e, item) {
				if (item.length > 0) {
					this.modeRepairids = e.detail.value;
					this.froms.mode[0].repair_description = item[this.modeRepairids].value
				}

			},
			deviceStaff(e, items) {
				this.staffIdx = e.detail.value;
				this.froms.device[0].repair_staff = this.staffList[this.staffIdx].id;
			},
			modexStaff(e, items) {
				this.staffIdx = e.detail.value;
				this.froms.mode[0].repair_staff = this.modestaffList[this.modestaffIdx].id;
			},
			getReson() {
				stopLineReason({
					status: 1
				}).then(res => {
					let arr1 = Object.values(res)
					let arr2 = Object.keys(res)
					const f1 = (key, arr) => arr.map(item => ({
						[key]: item
					}))

					const getMaxArr = (arr1, arr2) => (arr1.length >= arr2.length) ? arr1 : arr2;
					const mergeArr = (oldArr, arr) => oldArr.map((item, index) => ({
						item,
						...arr[index]
					}))

					let list1 = f1('item', arr1)
					let list2 = f1('id', arr2)
					let newArr = mergeArr(getMaxArr(arr1, arr2), list2)
					this.reason = newArr

					console.log("停线原因", this.reason)

				})
			},
			bindline: function(e) {
				this.froms.frequency = e.target.value;

			},
			bindReason(e, items) {
				if (items.length > 0) {
					this.reasonIds = e.target.value;

					this.crrentReson = items[this.reasonIds].item;
					console.log("当前原因", this.froms.reason_id)
				}

			},
			bindmouldIds(e, item) {
				if (item.length > 0) {
					this.devIds = e.detail.value
					// this.froms.device[0].device_id =item[this.devIds].id
					// this.froms.device[0].device_id = e.target.value + 1
					console.log("设备id", this.froms.device[0].device_id)
				}

			},
			bindmodeIds(e, item) {
				if (item.length > 0) {
					this.modeIds = e.target.value;
					// this.froms.mode[0].mode_id=item[this.modeIds].id;
					console.log("磨具id", this.froms.mode[0].mode_id)
				}

			},
			stopLine() {
				this.froms.frequency=this.CyInfo.frequency
				if (this.crrentReson == '设备维修' || this.crrentReson == '模具维修') {
					delete this.froms.remake
				}
				if (this.crrentReson !== '设备维修' && this.crrentReson != '模具维修') {
					delete this.froms.mode
					delete this.froms.device
				}
				if (this.crrentReson == '设备维修') {
					this.froms.device[0].unusual_phenomenon = this.AbnormalPhenomenon[this.index].name; //设备异常现象
					this.froms.device[0].device_id = this.deviceNo[this.devIds].id; //设备id
					this.froms.device[0].cause_analysis = this.deviceCauseAnalysis[this.devYyIds].value; //设备异常原因分析
					this.froms.device[0].repair_description = this.deviceRepairDescription[this.devRepairids]
					.value; //设备维修描述
					this.froms.device[0].repair_staff = this.staffList[this.staffIdx].id; //设备维修人员
					delete this.froms.mode
				}
				if (this.crrentReson == '模具维修') {
					this.froms.mode[0].cause_analysis = this.modeCauseAnalysis[this.modeYyIds].value; //模具异常原因分析
					this.froms.mode[0].unusual_phenomenon = this.modeUnnormal[this.index].name; //模具异常现象
					this.froms.mode[0].mode_id = this.mould[this.modeIds].id; //模具id
					this.froms.mode[0].repair_description = this.modeRepairDescription[this.modeRepairids].value; //模具维修描述
					this.froms.mode[0].repair_staff = this.staffList[this.staffIdx].id; //设备维修人员
					delete this.froms.device
				}
				this.froms.reason_id = this.reason[this.reasonIds].id;
				this.buttonState = false
				this.$functions.confirm("是否进行此操作").then(() => {
					stopRecord(this.froms).then(res => {

						this.buttonState = false
						this.$functions.success("操作成功").then(() => {
							uni.navigateBack()
						})

					}).catch(res => {
						this.buttonState = true
					})
				})
			}
		}
	}
</script>

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