<template>
	<!-- 设备报修 -->
	<view class="page_padding">
		<view class="page_content contentboxsty font14">
			<view class="content_row">
				<view class="name font_bold">值班工程师</view>
				<view class="flex1">
					<pickerSelect class="comView" @change="bindOperatorChange" :list="setMap.operatorList" :id="form.operator_id" placeholder="请选择工程师" />
				</view>
			</view>
			<view class="content_row">
				<view class="name font_bold">故障时间</view>
				<view class="flex1">
					<view class='input_date' :class="[form.failure_at && form.failure_at!=''? 'haveTime' : '']">
						<uni-datetime-picker placeholder="请选择时间" type="datetime" v-model="form.failure_at" />
					</view>
				</view>
			</view>
			<view class="content_row">
				<view class="name font_bold">报修时间</view>
				<view class="flex1">
					<view class='input_date' :class="[form.report_at && form.report_at!=''? 'haveTime' : '']">
						<uni-datetime-picker placeholder="请选择时间" type="datetime" v-model="form.report_at" />
					</view>
				</view>
			</view>
			<view class="content_row">
				<view class="name font_bold">报修人</view>
				<view class="flex1">
					<pickerSelect class="comView" @change="bindRepairChange" :list="setMap.operatorList" :id="form.report_id" placeholder="请选择报修人" />
				</view>
			</view>
			<view class="content_row">
				<view class="name font_bold">报修设备</view>
				<view class="flex1">
					<pickerSelect class="comView" @change="bindeQuipmentChange" :list="setMap.equipmentList" :id="form.equipment_id" placeholder="请选择报修设备" />
				</view>
			</view>
			<view class="textarea_row">
				<view class="name font_bold">故障描述</view>
				<textarea class="textarea" placeholder="请输入故障描述..." v-model="form.remark" cursor-spacing="180px" :auto-blur="true" placeholder-class="placeholderStyle"/>
			</view>
			<view class="img_row">
				<uploadImg limit="3" name="故障图片" :list="form.failure_photo" />
			</view>
		</view>
		<view class="bottom_but flex_layout">
			<view class="font13 but_color" @click="save">保存</view>
			<view class="font13" @click="cancel">取消</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				setMap:{
					operatorList:[],
					equipmentList:[],
				},
				form:{
					id:'',
					operator_id:'',
					failure_at:'',
					report_at:'',
					report_id:'',
					equipment_id:'',
					remark:'',
					failure_photo:[],
				},
				id:0,
				
				oss:{},
			}
		},
		onLoad(option) {
			if(option.id != undefined){
				this.getInfo(Number(option.id));
			}
		},
		mounted() {
			this.userList();
			this.equipment();
		},
		methods: {
			getInfo(id){
				this.$api.request('/equipment.repair.info',{id:id}).then(res=>{
					this.form = {
						id:id,
						operator_id:res.data.operator_id,
						failure_at:res.data.failure_at,
						report_at:res.data.report_at,
						report_id:res.data.report_id,
						equipment_id:res.data.equipment_id,
						remark:res.data.remark,
						failure_photo:res.data.failure_photo,
					}
				}).catch(err=>{})
			},
			userList(){
				this.$api.request('/user.options','').then(res=>{
					res.data.forEach(item=>{
						item.value = item.id;
					})
					this.setMap['operatorList'] = res.data;
				}).catch(err=>{})
			},
			equipment(){
				this.$api.request('/device.options','').then(res=>{
					res.data.forEach(item=>{
						item.name = item.name;
						item.value = item.id;
					})
					this.setMap['equipmentList'] = res.data;
				}).catch(err=>{})
			},
			bindOperatorChange(e){
				this.form.operator_id = e.value;
			},
			bindRepairChange(e){
				this.form.report_id = e.value;
			},
			bindeQuipmentChange(e){
				this.form.equipment_id = e.value;
			},
			save(){
				this.$api.postFuncLoading('/create.repair.notice',this.form).then(res=>{
					this.parentClick();
					this.reset();
					this.$wf.toast({type:'success',text:'保存成功'});
				}).catch(err=>{})
			},
			cancel(){
				this.reset();
			},
			reset(){
				this.form = {
					id:'',
					operator_id:'',
					failure_at:'',
					report_at:'',
					report_id:'',
					equipment_id:'',
					remark:'',
					failure_photo:[],
				}
			},
			parentClick(){
				const pages = getCurrentPages();
				if (pages.length >= 2) {
					const prevPage = pages[pages.length - 2];
					prevPage.$vm.getList();
				}
			}
		}
	}
</script>

<style scoped lang="scss">
	.page_padding{padding-bottom: 100px;}
	.page_content{padding: 0 12px 10px;}
	.content_row{display: flex;border-bottom: 1px solid #2D3A6F;height: 44px;align-items: center;
		.name{flex-basis: 96px;}
		.flex_layout{
			.contenticon{width: 20px;height: 20px;}
			.text{padding: 0 20px 0 5px;}
		}
	}
	.textarea_row{
		.name{padding: 12px 0;}
		.textarea{border-radius: 4px;background: $uni-bg-color-placeholder;padding: 10px;width: 100%;box-sizing: border-box;}
	}
	.img_row{
		padding: 12px 0 6px 0;
		height: 100%;
	}
</style>
