<template>
	<view v-if="!selfexamination.hasSign">
		<view class="container" v-html="selfexamination.requirementHtml"></view>
		<view class="footer col-24">
			<button type="primary" @click="handleSign">任务签收</button>
		</view>
	</view>
	<view v-else>
		<view v-for="(item, index) in selfexamination.contents" class="content-item" @tap="open(item.id)">
			<view class="content-item-title">
				<text>{{ index + 1 }} {{ item.title }}</text>
				<uni-tag type="warning" text="待检查" :inverted="true" v-if="item.status === 'todo'" />
				<uni-tag type="success" text="已检查" :inverted="true" v-else />
			</view>
			<view class="content-item-c">{{ item.content }}</view>
		</view>
	</view>
</template>

<script>
	import {
		getTaskSelfexamination,
		signTaskSelfexamination
	} from '@/api/selfexamination'
	import { submitTask } from '@/api/task'
	
	let _this;
	export default {
		data() {
			return {
				selfexamination: {}
			}
		},
		onLoad() {
			_this = this;
		},
		onShow() {
			getTaskSelfexamination(this.$page.options.taskId).then(data => {
				this.selfexamination = data
				if (data.contents.filter(item => item.status === 'todo').length === 0) {
					uni.showModal({
						content: `本次自查内容以全部检查，\n请确认是否结束本次任务`,
						success: function (res) {
							if (res.confirm) {
								submitTask(_this.$page.options.taskId).then(data => {
									uni.navigateTo({
									    url: '/pages/task/index?taskStatus=todo'
									});
								})
							}
						}
					});
				}
			})
		},
		methods: {
			async handleSign() {
				await signTaskSelfexamination(this.$page.options.taskId)
				this.selfexamination.hasSign = true
			},
			open(conentId) {
				uni.navigateTo({
					url: `/pages/task/selfexamination/add?taskId=${this.$page.options.taskId}&contentId=${conentId}&departId=${this.selfexamination.supDepartId}`
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	.content-item {
		padding: 24rpx 0;
		margin: 0 24rpx;
		box-shadow: inset 0 -1px 0 0 #DDDDDD;
		.content-item-title {
			margin-bottom: 12rpx;
			display: flex;
			justify-content: space-between;
		}
		.content-item-c {
			font-size: 12px;
			color: #666;
		}
	}
</style>