<template>
	<view class="page">
		<view class="item">
			<view class="itemname">项目编号</view>
			<view class="itemtext">{{result.code}}</view>
		</view>
		<view class="item">
			<view class="itemname">保养项目</view>
			<view class="itemtext">{{result.name}}</view>
		</view>
		<view class="item item_line">
			<view class="itemname">保养方法</view>
			<view class="itemtext">{{result.function}}</view>
		</view>
		<view class="item">
			<view class="itemname">保养工时</view>
			<view class="itemtext">
				<input class="iteminput timeRightMargin" type="number" placeholder="请输入工时" v-model="manHour"/>
				<view class="itemunit" style="position: absolute; right: 0px; top: 20upx;">小时</view>
			</view>
		</view>
		<view class="item">
			<view class="itemname">保养工时费</view>
			<view class="itemtext">
				<input class="iteminput timeRightMargin"  type="number"  placeholder="请输入工时费" v-model="manHourCost"/>
				<view class="itemunit" style="position: absolute; right: 0px; top: 20upx;">元</view>
			</view>
		</view>
		<view class="item item_line">
			<view class="itemname">保养结果</view>
			<view class="zc" :class="[result_btn==1?'btn_':'']" @click="result_btn=1">正常</view>
			<view class="yc" :class="[result_btn==2?'btn_':'']" @click="result_btn=2">异常</view>
		</view>
		<view class="item item_line item_textarea">
			<view class="itemname">备注</view>
			<textarea class="textarea" placeholder="备注" v-model="remark"></textarea>
		</view>
		<view class="submit_btn" @click="submit()">提交</view>
		<view class="goHome" @click='goMain()'>
			<img src="../../static/img/gohome.png">
		</view>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex'
	export default {
		computed: {
			...mapState(['keepDetails'])
		},
		data() {
			return {
				result_btn: 0,
				value: '',
				id: '',
				detailId:'',
				index:'',
				result:{},
				manHour:'',
				remark:'',
				manHourCost:''
			}
		},
		onLoad(option) {
			
			this.id = option.id;
			this.index = option.index;
			if(this.id==undefined){
				uni.reLaunch({
				    url: 'eqUpkeep'
				});
				return false;
			}
			var _this = this;
			this.$http.request({
				url: '/apis/upkeepPlan/oneRecordDetail',
				params: {
					recordId: option.id
				},
			}).then(res => {
				if (res.data.code == 0) {
					//展示界面效果。
					_this.result = res.data.data.project[_this.index];
					_this.detailId = _this.result.id;
					// if(this.keepDetails.id==this.id&&this.patrolDetails.patrolDetails[this.index].id==this.detailId){
					// 	this.value=this.patrolDetails.patrolDetails[this.index].offTime||'';
					// 	this.result_btn=this.patrolDetails.patrolDetails[this.index].result;
					// 	this.content_=this.patrolDetails.patrolDetails[this.index].content||'';
					// }
					// console.log(this.patrolDetails)
					// console.log(this.data_result_index)
				}
			}).catch(err => {});
		},
		methods: {
			...mapMutations(['setkeepDetails']),
			submit() {
				var j = {
					id: this.detailId,
					manhour: this.manHour,
					result: this.result_btn,
					remark: this.remark, // 界面没有备注，暂时写死传空处理
					manHourCost:this.manHourCost
				}
				for (var i = 0; i < this.keepDetails.keepDetails.length; i++) {
					if (this.keepDetails.keepDetails[i].id == this.detailId) {
						this.keepDetails.keepDetails[i].manhour = j.manhour;
						this.keepDetails.keepDetails[i].result = j.result;
						this.keepDetails.keepDetails[i].remark = j.remark;
						this.keepDetails.keepDetails[i].manHourCost = j.manHourCost;
					}
				}
				this.setkeepDetails({id:this.id,keepDetails:this.keepDetails.keepDetails});
				uni.redirectTo({
					url: "keepStep1?id=" + this.id
				});
			}
		}
	}
</script>

<style scoped>
	.zc,
	.yc {
		position: absolute;
		width: 138upx;
		height: 58upx;
		border-radius: 8upx;
		top: 17upx;
		line-height: 58upx;
		text-align: center;
		background-color: #D7E6FF;
		border: 1px solid #3382FF;
		box-sizing: border-box;
		color: #3382FF;
		font-size: 26upx;
		right: 200upx;
	}

	.yc {
		right: 30upx;
	}

	.btn_ {
		background-color: #3382FF;
		color: #fff;
		border: none;
	}

	.textarea {
		position: absolute;
		left: 30upx;
		right: 30upx;
		bottom: 30upx;
		top: 92upx;
		height: auto;
		width: auto;
	}

	.submit_btn {
		/* position: absolute; */
		width: 90%;
		margin:20px auto;
		/* left: 5%; */
		/* bottom: 30upx; */
		text-align: center;
		height: 90upx;
		line-height: 90upx;
		border-radius: 10upx;
		color: #fff;
		background-color: #3382FF;
		font-size: 32upx;
	}
</style>
