<template>
	<view>
		<view class="padding">
			<view class="cu-form-group border-ddd border-rad margin-top-sm">
				<view class="title">
					<span style="color: red;">*</span>
					拆下日期
				</view>
				<view @tap="lowVisible = true" class="cu-form-group-text text-right" :class="!!enterLLInfo.zchdt ? '' : 'main-sub-color'">
					{{ !!enterLLInfo.zchdt ? enterLLInfo.zchdt : '请选择拆下日期' }}
				</view>
				<image :src="dateImg" class="i-down"></image>
				<w-picker
					:visible.sync="lowVisible"
					mode="date"
					startYear="2000"
					endYear="2099"
					:current="true"
					fields="day"
					@confirm="onConfirmTime($event, 'zchdt')"
					@cancel="onCancel"
					:disabled-after="false"
					ref="zchdt"
				></w-picker>
			</view>
			<view class="cu-form-group border-ddd border-rad margin-top">
				<view class="title"><span style="color: red;">*</span>短机号</view>
				<view style="margin-left: 403rpx;">B-</view>
				<textarea
					auto-height
					maxlength="5"
					class="text-right"
					v-model="enterLLInfo.zmsgrp"
					placeholder="xxxx"
					placeholder-class="text-right main-sub-color"
				/>
			</view>
			<view class="cu-form-group border-ddd border-rad margin-top">
				<view class="title"><span style="color: red;">*</span>件号</view>
				<textarea
					auto-height
					class="text-right"
					v-model="enterLLInfo.matnr"
					placeholder="请输入件号"
					placeholder-class="text-right main-sub-color"
				/>
			</view>
			<view class="cu-form-group border-ddd border-rad margin-top">
				<view class="title"><span style="color: red;">*</span>序号</view>
				<textarea
					auto-height
					class="text-right"
					v-model="enterLLInfo.sernr"
					placeholder="请输入序号"
					placeholder-class="text-right main-sub-color"
				/>
			</view>
			<block v-if="workerType == '1'">
				<!-- <view class="titles">787/737/737MAX机型:</view> -->
				<view class="titles">{{ enterLLInfoText }}机型:</view>

				<view v-if="cmcshow" class="cu-form-group border-ddd border-rad margin-top-sm flex-direction align-start">
					<view class="title">
						<span v-if="mainShow" style="color: red;">*</span>
						中心维护计算机（CMC）故障代码：
					</view>
					<view class="margin-top-xs flex flex-wrap" @click="picimgClick('ZNFFJW1')">
						<image-upload :value="imageData1" :limit="limitCount" :filePath="filePath" @delete="deleteImage"
							@add="addImage" @data="getData" @uploading="getUploading" :attfileList="attfileList">
						</image-upload>
					</view>
				</view>
				<view class="cu-form-group border-ddd border-rad margin-top-sm flex-direction align-start">
					<view class="title">
						<span style="color: red;">*</span>
						航材内置测试设备BITE出现的故障代码：
					</view>
					<view class="margin-top-xs flex flex-wrap" @click="picimgClick('ZNFFJW2')">
						<image-upload :value="imageData2" :limit="limitCount" :filePath="filePath" @delete="deleteImage"
							@add="addImage" @data="getData" @uploading="getUploading" :attfileList="attfileList">
						</image-upload>
					</view>
				</view>
				<view class="cu-form-group border-ddd border-rad margin-top-sm flex-direction align-start">
					<view class="title">
						该部件拆下所依据的故障清除手册维护流程：
					</view>
					<view class="margin-top-xs flex flex-wrap" @click="picimgClick('ZNFFJW3')">
						<image-upload :value="imageData3" :limit="limitCount" :filePath="filePath" @delete="deleteImage"
							@add="addImage" @data="getData" @uploading="getUploading" :attfileList="attfileList">
						</image-upload>
					</view>
				</view>
				<view class="cu-form-group border-ddd border-rad margin-top-sm flex-direction align-start">
					<view class="title">
						<span style="color: red;">*</span>
						故障的状态信息/咨询信息,以及关联的维护信息：
					</view>
					<view class="margin-top-xs flex flex-wrap" @click="picimgClick('ZNFFJW4')">
						<image-upload :value="imageData4" :limit="limitCount" :filePath="filePath" @delete="deleteImage"
							@add="addImage" @data="getData" @uploading="getUploading" :attfileList="attfileList">
						</image-upload>
					</view>
				</view>
			</block>
			<block v-if="workerType == '2'">
				<!-- <view class="titles">330/320机型:</view> -->
				<view class="titles">{{ enterLLInfoText }}机型:</view>
				
				<view class="cu-form-group border-ddd border-rad margin-top-sm flex-direction align-start">
					<view class="title">
						<span style="color: red;">*</span>
						PFR、TSD/BITE测试相关信息：
					</view>
					<view class="margin-top-xs flex flex-wrap" @click="picimgClick('ZNFFJW5')">
						<image-upload :value="imageData5" :limit="limitCount" :filePath="filePath" @delete="deleteImage"
							@add="addImage" @data="getData" @uploading="getUploading" :attfileList="attfileList">
						</image-upload>
					</view>
				</view>
				<view class="cu-form-group border-ddd border-rad margin-top-sm flex-direction align-start">
					<view class="title">
						<span style="color: red;">*</span>
						排故记录(英文版)：
					</view>
					<view class="margin-top-xs flex flex-wrap" @click="picimgClick('ZNFFJW6')">
						<image-upload :value="imageData6" :limit="limitCount" :filePath="filePath" @delete="deleteImage"
							@add="addImage" @data="getData" @uploading="getUploading" :attfileList="attfileList">
						</image-upload>
					</view>
				</view>
			</block>
			
			<view class="flex justify-center margin-top-xl" style="display: flex; justify-content: space-between;">
				<button class="main-button font30" style="width: 30%;" @click="save">提交</button>
				<button class="main-button font30" style="width: 30%;" @click="cancellation">取消</button>
			</view>

		</view>
		<q-loading mask="true" click="true" ref="loading"></q-loading>
	</view>
</template>

<script>
	import {
		request
	} from '../../../../utils/request';
	import DateFormat from '@/js_sdk/xfl-DateFormat/DateFormat.js';
	import dictionaryApi from '../../../../utils/dictionary';

	const delay = (function () {
		let timer = 0
		return function (callback, ms) {
			clearTimeout(timer)
			timer = setTimeout(callback, ms)
		}
	})()

	export default {
		data() {
			return {
				fileList: [],
				filePath: 'upload',
				imageData1: [],
				imageData2: [],
				imageData3: [],
				imageData4: [],
				imageData5: [],
				imageData6: [],
				attfileList: [],
				param: {
					pn: '',
					sn: '',
					snPar1: '',
					faultreportitemState: 0,
					source: 'APP',
					imgUrl: '', // 图片地址
					faultdescription: '', // 故障描述
				},
				userInfo: {
					id: '',
					name: '',
					phone: ''
				},
				dateImg: '../../../../../../../static/img/hcdb/i-date.png',
				limitCount: 1,
				lowVisible: false,
				param: {
					zchdt: ''
				},
				enterLLInfo: {
				},
				typeimg: '',
				// modelsList1: ['787','737','737MAX'],
				// modelsList2: ['330','320'],
				modelsList1: ['787','73N','73M'],
				modelsList2: ['A33','A23'],
				testModel: '', // 机型
				workerType: '0',
				enterLLInfoText: '',
				mainShow: true,
				cmcshow: true,
			};
		},
		props: {
			lmoId: {
				type: String,
				default: ''
			},
			type: {
				type: String,
				default: ''
			}
		},
		watch: {
			'enterLLInfo.zmsgrp'(newVal, oldVal){
				delay(() => {
					if(newVal){
						this.getList(newVal);
					}
				}, 1000)
			}
		},
		methods: {
			contains(arr, val){
				return arr.some(item => item === val)
			},
			getList(val){
				let vm = this;
				let str = 'B-';
				val = str + val;
				// this.enterLLInfoText = val
				vm.$refs.loading.open();
				request({
					method: 'get',
					url: 'daAcreg-getByAcno',
					data: {acno: val}
				},true)
				.then(res => {
					vm.$refs.loading.close();
					if (res.code == 0) {
						if(res.data===null){
							res.data = []
						}
						if(res.data.length == 0){
							uni.showToast({
								title: '暂无机型数据！',
								icon: 'none'
							});
						}
						this.testModel = res.data.mpActype
						// this.testModel = '73N'
						// this.testModel = '787'
						// this.testModel = '737NG'
						this.enterLLInfoText = this.testModel 

						if(this.contains(this.modelsList1, this.testModel)){
							this.workerType = 1
							if(this.testModel == '73N'){
								this.mainShow = false
								this.cmcshow = false
							}
						}
						if(this.contains(this.modelsList2, this.testModel)){
							this.workerType = 2
						}
					} else {
						uni.showToast({
							title: res.msg || '系统繁忙，请稍后重试！',
							icon: 'none'
						});
					}
				})
				.catch(res => {
					vm.$refs.loading.close();
				});
			},
			onConfirmTime(res, type) {
				let times = res.value + ' ' + '00:00:00'
                this.enterLLInfo.zchdt = times;
				this.onCancel();
			},
			onCancel() {
				this.lowVisible = false;
			},

			cancellation(){
				let that = this
				uni.showModal({
					title: '确定取消新增？',
					success: function(res){
						if(res.confirm){
							that.$emit("tjgzChange",1)
						}else if(res.cancel){

						}
					}
				})
			},
			deleteImage(data, index) {
				let arr = [];
				this.delFileList.push(data.currentImage.split('mronfs')[1])
				this.attfileList.map(ele => {
					arr.push(ele.folder);
				});
				this.param.imgUrl = arr.jon(';');
			},
			addImage(e) {},
			getUploading(res) {
				if (res) {
					this.isSubmit = false;
				} else {
					this.isSubmit = true;
				}
			},
			picimgClick(type){
				this.typeimg = type
			},
			// 获取上传图片的fileId
			getData(data, index) {
				let _this = this;
				if (data && data.length > 0) {
					data.map(item => {
						let obj = {
							pid: '',
							filep: item.fileName,
							folder: item.appUploadPath + item.fileName,
							dmtyp1: this.typeimg
						};
						_this.attfileList.push(obj);
					});
				}
			},
			tapNavigateTo(_page, _item, _index) {
				uni.navigateTo({
					url: `./flhcInfo?id=${_id}`
				});
			},
			getShowToast(text){
				uni.showToast({
					title: text,
					icon: 'none'
				});
			},
			// 新建保存
			save() {
				this.enterLLInfo.fileList = this.attfileList

				if (!this.enterLLInfo.zchdt) {
					this.getShowToast('请选择拆下日期')
					return;
				}
				if (!this.enterLLInfo.zmsgrp) {
					this.getShowToast('请输入短机号')  
					return;
				}
				if (!this.enterLLInfo.matnr) {
					this.getShowToast('请输入件号')
					return;
				}
				if (!this.enterLLInfo.sernr) {
					this.getShowToast('请输入序号')
					return;
				}

				if(this.workerType == 1){
					let len1 = this.imageData1.length
					if (len1 == 0 && this.mainShow && this.cmcshow) {
						this.getShowToast('请上传中心维护计算机（CMC）故障代码图片')
						return;
					}
					let len2 = this.imageData2.length
					if (len2 == 0) {
						this.getShowToast('请上传航材内置测试设备BITE出现的故障代码图片')
						return;
					}
					let len3 = this.imageData4.length
					if (len3 == 0) {
						this.getShowToast('请上传故障的状态信息/咨询信息,以及关联的维护信息图片')
						return;
					}
				}else if(this.workerType == 2){
					let len5 = this.imageData5.length
					if (len5 == 0) {
						this.getShowToast('请上传PFR、TSD/BITE测试相关信息图片')
						return;
					}
					let len6 = this.imageData6.length
					if (len6 == 0) {
						this.getShowToast('请上传排故记录(英文版)图片')
						return;
					}
				}
				
				let vm = this;
				vm.$refs.loading.open();
				request({
						method: 'post',
						url: 'lfl-nff',
						data: this.enterLLInfo
					})
					.then(res => {
						vm.$refs.loading.close();
						if (res.code == 0) {
							uni.showToast({
								title: '保存成功！',
								icon: 'none'
							});
							this.$emit("tjgzChange",1)
							this.initPage();
						} else {
							uni.showToast({
								title: res.msg || '系统繁忙，请稍后重试！',
								icon: 'none'
							});
						}
					})
					.catch(res => {
						vm.$refs.loading.close();
					});
			},
			initPage() {
				for (let p in this.param) {
					this.param[p] = '';
				}
				this.param.faultreportitemState = 0;
				this.param.source = 'APP';
				this.imageData = [];
				this.attfileList = [];
			}
		},
		onShow() {
			// 监听回调
		},
		mounted() {
			// this.username = uni.getStorageSync('username');
		},
		onLoad() {},
		onReady() {}
	};
</script>

<style lang="less" scoped>
	.title {
		flex-shrink: 0;
		height: auto !important;
		line-height: 1.5em !important;
	}

	.state-bar {
		padding-top: 30rpx;
		padding-bottom: 20rpx;
	}

	.yellow {
		color: rgb(255, 170, 0);
		background: linear-gradient(rgba(255, 170, 0, 0.8), #fdfdff);
	}

	.green {
		color: green;
		background: linear-gradient(rgba(4, 177, 44, 0.8), #fdfdff);
	}

	.item-center-btn {
		width: 30%;
		margin: 0 10rpx;
		height: 66rpx;
	}

	.uni-searchbar {
		width: 100%;
		padding: 0rpx 0rpx 20rpx 0rpx !important;

	}

	.rotate-right {
		transform: rotate(-90deg);
	}

	.clearImg {
		height: 70rpx;
		width: 70rpx;
		flex-shrink: 0;
	}

	.i-point {
		width: 20rpx;
		height: 20rpx;
	}

	.i-down {
		width: 32rpx;
		height: 32rpx;
		transition: all 0.2s linear;
	}

	.rotate {
		transform: rotate(180deg);
	}

	.prop-text {
		width: 20%;
		display: inline-flex;
	}

	.cu-form-group uni-picker {
		padding-right: 0rpx;
	}

	.picker-after::after {
		display: none;
	}

	.picker-text {
		padding-right: 8rpx;
	}

	.i-photo {
		width: 140rpx;
		height: 140rpx;
	}

	/deep/.uni-drawer--right {
		/* #ifdef H5 */
		padding-top: 45px;
		/* #endif */
		/* #ifdef APP-PLUS */
		padding-top: 90px;
		/* #endif */
		box-sizing: border-box;
	}

	.radio-wrap {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		box-sizing: border-box;
		padding: 0 20rpx;

		.radio-cover {
			width: 100%;
			display: flex;
			align-items: center;
			margin-bottom: 20rpx;
			padding-bottom: 20rpx;
			border-bottom: 1rpx solid #DDDDDD;

			&:last-child {
				border-bottom: 0px;
			}

			uni-radio {
				margin-right: 10rpx;
			}
		}
	}

	/deep/.checklist-group {
		justify-content: flex-end;

		.checklist-box {
			margin-right: 0rpx !important;
			margin-left: 20rpx !important;
		}
	}
	.titles{
		margin-top: 30rpx;
    	font-weight: bold;
	}
</style>
