<template>
	<view class="detail">
		<view class="card">
			<view class="title">查看详细</view>
			<view class="row">
				<label>工作岗位：</label>
				<label>{{detail.postName}}</label>
			</view>
			<view class="row">
				<label>工作日期：</label>
				<label>{{detail.workDate}}</label>
			</view>
			<view class="row">
				<label class="col-5">工作时长/{{ detail.postType == '固定岗位A' ? '天' : '小时' }}：</label>
				<view class="col-15">
					<uni-easyinput v-model="detail.workTime" type="number" />
					<text style="color: red;">*工作时长可修改</text>
				</view>
			</view>
			<view class="row">
				<label>主要工作：</label>
				<label>{{detail.mainWork}}</label>
			</view>
			<view class="row">
				<label>附件：</label>
				<view class="photos">
					<image @tap="previewImg(attachment,index)" v-for="(img,index) in attachment" :src="basePath+img"
						mode="aspectFill"></image>
				</view>
			</view>
			<view class="row">
				<label>审核意见：</label>
				<uni-data-checkbox v-model="detail.zdlsCmt" :localdata="zdlsCmt" />
			</view>
			<button @click="doAudit" type="primary" plain>审核</button>
		</view>
	</view>
</template>

<script>
	import {
		CheckImgExists,
		isEmpty
	} from "@/api/helpFunc";
	import {
		baseUrl
	} from "@/config.js";
	import {
		previewImg
	} from "@/utils/uploadImg.js"
	import {
		doAudit,
		listZdls as getList,
		manyAudit
	} from "@/api/workStudy/worklog";
	export default {
		data() {
			return {
				detail: null,
				attachment: [],
				basePath: baseUrl,
				zdlsCmt: [{
					text: '通过',
					value: '通过'
				}, {
					text: '不通过',
					value: '不通过'
				}],
			}
		},
		onLoad(option) {
			this.detail = JSON.parse(option.detailData);
			console.log(this.detail);
			this.attachment = this.detail.workMaterial.split(",");
			console.log(this.attachment);
		},
		methods: {
			async doAudit() {
				let sdata = {
					...this.detail
				};

				if (isEmpty(sdata.workTime)) {
					uni.showToast({
						title: "请输入工作时间",
						icon: "error"
					});
					return;
				}

				if (sdata.workTime <= 0 || sdata.workTime > 24) {
					uni.showToast({
						title: "请输入正确的工作时间",
						icon: "error"
					});
					return;
				}
				if (isEmpty(sdata.zdlsCmt)) {
					uni.showToast({
						title: "请选择是否通过",
						icon: "error"
					});
					return;
				}

				// if (isEmpty(sdata.zdlsSign)) {
				// 	uni.showToast({
				// 		title: "请上传签章",
				// 		icon: "error"
				// 	});
				// 	return;
				// }

				console.log(sdata)
				
				uni.showLoading({
					title: "正在提交",
					success: async () => {
						try {
							let res = await doAudit(sdata);
							if (res.code == 200) {
								uni.showToast({
									title: "提交成功"
								});
								setTimeout(() => {
									uni.navigateBack({
										success: () => {
											const pages = getCurrentPages();
											if (pages.length > 0) {
												const prevPage = pages[pages.length -
													2]
												console.log(prevPage);
												if (prevPage && typeof prevPage
													.getList ===
													'function') {
													prevPage.queryParams.pageNum = 1;
													prevPage.getList();
												}
											}
										}
									})
								}, 1000)
							}
						} catch (error) {} finally {
							this.isSubmitting = false;
						}
					}
				})
				// if (!CheckImgExists(this.baseurl + sdata.zdlsSign)) {
				// 	this.$message.info("签名失效，请重新上传");
				// 	return;
				// }

				// let res = await doAudit(sdata);
				// if (res.code == 200) {
				// 	uni.showToast({
				// 		title: res.msg,
				// 		icon: "success"
				// 	});
				// 	this.getList();
				// 	this.lookV = false;
				// }
			},
			previewImg(imgs, index) {
				let images = imgs.map(img => {
					return {
						path: baseUrl + img
					}
				})
				previewImg(images, index);
			}
		}
	}
</script>

<style scoped lang="scss">
	.detail {
		height: calc(100vh - 44px);
		background-color: #F5F5F7;
		padding: 20rpx 30rpx 0;

		.card {
			margin: 30rpx 0rpx 0;
			padding: 30rpx;
			background-color: white;
			border-radius: 20rpx;

			.title {
				font-weight: bold;
				color: #202020;
				display: inline-block;
				font-size: 30rpx;
				margin-bottom: 30rpx;
			}

			.row {
				margin-bottom: 30rpx;

				&>label:first-child {
					color: #9C9C9C;
					margin-right: 40rpx;
				}

				.photos {
					margin-top: 10rpx;
					display: flex;
					flex-wrap: wrap;

					image {
						margin-bottom: 10rpx;
						width: 23.5%;
						border-radius: 8rpx;
						height: 136rpx;

						&:not(:nth-child(4n)) {
							margin-right: 2%;
						}
					}
				}
			}
		}
	}
</style>