<template>
	<view>
		<uni-nav-bar fixed="true" statusBar="true" left-icon="back" leftText="报工" @clickLeft="back"></uni-nav-bar>
		<!-- 待处理 -->
		<template v-if="detailsIng.length">
			<CellTip title="待处理"> </CellTip>
			<uni-collapse ref="collapse" v-for="item in detailsIng" :key="item.id">
				<uni-collapse-item :open="false" :typeOpen="false" titleStyle="background-color: #ffffff">
					<OrderDetail slot="typeOpenShow" :value1="item.equipmentName" :value2="item.equipmentPlace"
						:value3="item.maintainPart" :value4="'null'" :value5="worksheetInfo.executor.name"
						:value6="'null'">
					</OrderDetail>
					<view class="content-status" @click.stop>
						<view class="title cell font-grey">
							保养项目
						</view>
						<view class="tip cell border-bottom">
							{{item.equipmentName}}{{item.equipmentPlace}}
							<text>{{item.maintainType == '1' ? '普通保养' : '润滑保养'}}</text>
						</view>
						<!-- 没有做过事项处理 -->

						<view class="cell " style="margin-top: 20rpx;">
							<text class="font-grey">保养周期：</text>
							<text>{{item.maintainCycle}}{{item.maintainCycleUnit}}</text>
						</view>
						<view class="cell ">
							<text class="font-grey">操作标准：</text>
							<!-- <text>{{item.maintainStandard}}</text> -->
						</view>
						<view class="cell ">
							<text class="font-grey">验收标准：</text>
							<text>{{item.maintainStandard}}</text>
						</view>

						<view class="cell ">
							<text class="font-grey">选择的备件：</text>
							<view v-for="items in item.maintainSpare">
								<Cell :title="items.spareName +'/'+ items.model" :more="'x'+ items.mun + items.unit">
								</Cell>
							</view>
						</view>

						<view class="btn-status">
							<view class="">
								照片
							</view>
							<view>
								<text class="btn btn-warning">
									报修
								</text>
								<text class="btn btn-success">
									选择备品备件
								</text>
								<text class="btn btn-primary" @click="">
									保养完成
								</text>
							</view>
						</view>

					</view>

				</uni-collapse-item>
			</uni-collapse>
			
		</template>

		<!-- 已处理 -->
		<template v-if="detailsEd.length">
			<CellTip title="已处理"> </CellTip>
			<uni-collapse ref="collapse" v-for="item in detailsEd" :key="item.id">
				<uni-collapse-item :open="false" :typeOpen="false" titleStyle="background-color: #ffffff">
					<OrderDetail slot="typeOpenShow" :value1="item.equipmentName" :value2="item.equipmentPlace"
						:value3="item.maintainPart" :value4="'null'" :value5="worksheetInfo.executor.name"
						:value6="'null'">
					</OrderDetail>
					<view class="content-status" @click.stop>
						<view class="title cell font-grey">
							保养项目
						</view>
						<view class="tip cell border-bottom">
							{{item.equipmentName}}{{item.equipmentPlace}}
							<text>{{item.maintainType == '1' ? '普通保养' : '润滑保养'}}</text>
						</view>
						<!-- 没有做过事项处理 -->

						<view class="cell " style="margin-top: 20rpx;">
							<text class="font-grey">保养周期：</text>
							<text>{{item.maintainCycle}}{{item.maintainCycleUnit}}</text>
						</view>
						<view class="cell ">
							<text class="font-grey">操作标准：</text>
							<!-- <text>{{item.maintainStandard}}</text> -->
						</view>
						<view class="cell ">
							<text class="font-grey">验收标准：</text>
							<text>{{item.maintainStandard}}</text>
						</view>

						<view class="cell ">
							<text class="font-grey">选择的备件：</text>
							<view v-for="items in item.maintainSpare">
								<Cell :title="items.spareName +'/'+ items.model" :more="'x'+ items.mun + items.unit">
								</Cell>
							</view>
						</view>

						<view class="btn-status">
							<view class="">
								照片
							</view>
							<view>
								<text class="btn btn-warning">
									报修
								</text>
								<text class="btn btn-success">
									选择备品备件
								</text>
								<text class="btn btn-primary" @click="">
									保养完成
								</text>
							</view>
						</view>

					</view>

				</uni-collapse-item>
			</uni-collapse>

		</template>

	</view>
</template>

<script>
	import {
		get
	} from "@/utils/api.js"
	import Cell from '@/components/Cell.vue'
	import CellTip from '@/components/CellTip.vue'
	import OrderDetail from '../components/OrderDetail.vue'
	export default {
		components: {
			Cell,
			CellTip,
			OrderDetail
		},
		data() {
			return {
				worksheetInfo: null,
				detailsIng: [],
				detailsEd: []
			}
		},
		onLoad(options) {
			this.pageId = options.id;
			this.getInfo();
		},
		methods: {
			getInfo(id) {
				get(this.apiUrl + "/maintain/worksheet/info", {
					id: this.pageId
				}).then(res => {
					console.log(res)
					let worksheetInfo = res.data;
					this.worksheetInfo = worksheetInfo;
					let details = worksheetInfo.details;
					//未处理
					this.detailsIng = details.filter(el => {
						return el.status.id == 0
					})

					this.detailsEd = details.filter(el => {
						return el.status.id == 1
					})
				})
			},

		}
	}
</script>

<style lang="scss" scoped>
	.content-status {

		padding: 20rpx 0 40rpx;
		background-color: $page-bg;
		line-height: 1.5;
		font-size: $uni-font-size-base;
		color: $uni-text-color;

		.cell-box {
			.tip {
				position: relative;
				margin-bottom: 20rpx;
			}

			.tip text {
				position: absolute;
				right: 0;
				color: $uni-text-color-grey;
			}

			margin-bottom: 20rpx;
		}

		.cell {
			padding: 10rpx 30rpx;
		}

		.status-info {
			padding: 10rpx 30rpx;
			position: relative;
			border-top: 1px solid #D8D8D8;
		}

		.title {
			margin-bottom: 20rpx;
			font-weight: 700;
			text-indent: 0;
		}

		.font-grey {
			color: $uni-text-color-grey;
		}
	}

	.btn-status {
		padding: 30rpx 30rpx 20rpx;
		display: flex;
		justify-content: space-between;
		font-size: $uni-font-size-base;
	}
</style>
