<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="bindPickerChange" :list="setMap.operatorList" :id="form.repair_id" placeholder="请选择工程师" />
				</view>
			</view>
			<view class="content_row">
				<view class="name font_bold">故障解除时间</view>
				<view class="flex1">
					<view class='input_date' :class="[form.repair_at && form.repair_at!=''? 'haveTime' : '']">
						<uni-datetime-picker placeholder="请选择时间" type="datetime" v-model="form.repair_at" />
					</view>
				</view>
			</view>
			<view class="textarea_row">
				<view class="name font_bold">维修描述</view>
				<textarea class="textarea" v-model="form.repair_remark" placeholder="请输入维修描述..." cursor-spacing="180px" :auto-blur="true" placeholder-class="placeholderStyle" />
			</view>
			<view class="img_row">
				<uploadImg limit="3" name="维修照片" :list="form.repair_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:[],
				},
				form:{
					id:'',
					repair_id:'',
					repair_at:'',
					repair_remark:'',
					repair_photo:[]
				},
				
				array: ['中国', '美国', '巴西', '日本'],
				downtime:'',
			}
		},
		onLoad(option) {
			if(option.id !=undefined){
				// this.form.id = Number(option.id);
				this.getInfo(Number(option.id));
			}
		},
		mounted() {
			this.userList();
		},
		methods: {
			getInfo(id){
				this.$api.request('/equipment.repair.info',{id:id}).then(res=>{
					this.form = {
						id:id,
						repair_id:res.data.repair_id,
						repair_at:res.data.repair_at,
						repair_remark:res.data.repair_remark,
						repair_photo:res.data.repair_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=>{})
			},
			bindPickerChange(e){
				this.form.repair_id = e.value;
			},
			save(){
				this.$api.postFuncLoading('/create.equipment.repair',this.form).then(res=>{
					this.parentClick();
					this.$wf.toast({type:'success',text:'保存成功'});
				}).catch(err=>{})
			},
			cancel(){
				this.reset();
			},
			reset(){
				this.form = {
					id:'',
					repair_id:'',
					repair_at:'',
					repair_remark:'',
					repair_photo:[]
				}
			},
			parentClick(){
				const pages = getCurrentPages();
				if (pages.length >= 2) {
					const prevPage = pages[pages.length - 2];
					prevPage.$vm.getList();
				}
			}
		}
	}
</script>

<style scoped lang="scss">
	.page_content{padding: 0 12px 10px;}
	.content_row{display: flex;border-bottom: 1px solid #2D3A6F;height: 44px;align-items: center;
		.name{flex-basis: 100px;}
		.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;
		.img_but{
			display: flex;flex-direction: column;align-items: center;
			.icon{color: $uni-text-color-inverse;}
			.text{margin-top: 5px;}
		}
	}
</style>
