<template>
	<view>
		<view class="wBox">
			<view class="statusPo">
				<!-- 阶段 0 未提交  1 已提交  2  已付款  3 审核未通过  4 被清除  5 审核已通过  6 被取消 -->
				<text class="status s01" v-if="base.signInfo[0]?.stage=='0'">未提交</text>
				<text class="status s01" v-if="base.signInfo[0]?.stage=='1'">已提交</text>
				<text class="status s02" v-else-if="base.signInfo[0]?.stage=='5'">审核通过</text>
				<text class="status s01" v-else-if="base.signInfo[0]?.stage=='2'">审核中</text>
				<text class="status s03" v-else-if="base.signInfo[0]?.stage=='3'">审核拒绝</text>
				<text class="status s04"
					v-else-if="base.signInfo[0]?.stage=='6'||base.signInfo[0]?.stage=='4'">{{base.signInfo[0]?.stageStr}}</text>
			</view>
			<view class="title">{{base.signInfo[0]?.cptName}}</view>
			<view>
				<uni-tag :inverted="true" v-if="base.signInfo[0]?.cptSignType=='0'" text="个人报项" type="success" />
				<uni-tag :inverted="true" v-if="base.signInfo[0]?.cptSignType=='1'" text="参赛队报项" type="primary" />
				<uni-tag :inverted="true" v-if="base.signInfo[0]?.cptSignType=='2'" text="参赛队-队伍报项" type="warning" />
				<text class="time">比赛时间：{{base.signInfo[0]?.cptBeginTime?.substring(0, 10)}} ~
					{{base.signInfo[0]?.cptEndTime?.substring(0, 10)}}</text>
			</view>
		</view>

		<view class="wBox" v-for="(t,index) in list" :key="index">
			<uni-list :border='false'>
				<uni-list-item :border="false" title="姓名">
					<template v-slot:footer>
						{{t.personInfo?.realName}}
						<text style="font-size: 24rpx;" v-if="t.personInfo?.sex==0">(女)</text>
						<text style="font-size: 24rpx;" v-if="t.personInfo?.sex==1">(男)</text>
					</template>
				</uni-list-item>
				<uni-list-item :border="false" :title="t.personInfo.idcTypeStr" :rightText="t.personInfo.idcCode" />
				<uni-list-item :border="false" v-if="t.signInfo[0]?.coachNames" title="教练" :rightText="t.signInfo[0]?.coachNames" />
				<uni-list-item :border="false" v-if="t.signInfo[0]?.leaderNames" title="领队" :rightText="t.signInfo[0]?.leaderNames" />
				<view v-if="t.extraformData">
					<uni-list-item :border="false" v-show="ee.value" :title="ee.name"
						v-for="(ee,index) in t.extraformData" :key="index">
						<template v-slot:footer>
							<text v-if="ee.type=='0'||ee.type=='1'||ee.type=='4'"
								style="font-size: 24rpx;">{{ee.value}}</text>
							<image v-if="ee.type=='3'&&ee.value!=null" :src="
							ee.value?.url" mode='aspectFit'
								style="width: 200rpx;height: 200rpx;" />
							<view @click="goWebView(ee.value.url)" v-if="ee.type=='2'">
								<uni-icons type="download" size="16"></uni-icons>
								{{ee.value?.name}}
							</view>
						</template>
					</uni-list-item>
				</view>

				<!-- <uni-list-item :border="false" title="参赛团体" v-if="t.groupName" :rightText="t.groupName" /> -->
				<!-- <uni-list-item :border="false" title="队伍名称" v-if="t.teamName" :rightText="t.teamName" /> -->
				<uni-list-item :border="false" :title="'报名项目'+ (index+1)" v-for="(s,index) in t.signInfo" :key="index">
					<template v-slot:footer>
						<text style="font-size: 26rpx;max-width: 60vw;display: inline-block;">{{s.cptProjectName}}
							{{s.cptGroupName}}{{s.cptLevelName}} {{s.cptSonLevelName}} {{s.zu}}</text>
					</template>
				</uni-list-item>
			</uni-list>
		</view>


		<view style="display: flex;justify-content: center;padding: 60rpx 0 100rpx;">
			<button class="btn btn1" style="margin: 0 10px;" v-if="auditStatus!='0'" @click="download">下载凭证</button>
			
			<button style="margin: 0 10px;" v-if="(auditStatus=='0'&&payStatus=='0')||auditStatus=='3'||auditStatus=='4'"
				@click="goConti" class="btn btn1">继续报名</button>
		</view>
	</view>
</template>

<script setup>
	import {
		reactive,
		toRefs
	} from 'vue';
	import * as match from '@/common/match.js';
	import {
		onLoad
	} from '@dcloudio/uni-app';
	const data = reactive({
		list: {},
		signId: '',
		memberList: [],
		isSign: false,
		showForm: false,
		auditStatus: '',
		payStatus: '',
		base: {}
	});
	const {
		list,
		signId,
		memberList,
		isSign,
		showForm,
		payStatus,
		auditStatus,
		base
	} = toRefs(data)
	let groupId
	onLoad((option) => {
		console.log('signdetail',option)
		signId.value = option.id
		groupId = option.groupId
		auditStatus.value = option.auditStatus
		payStatus.value = option.payStatus
		getData()
	})

	function getData() {
		match.getMySignListFromBaoXiang({
			cptId: signId.value,
			groupId: groupId
		}).then(res => {
			list.value = res.data
			for (const p of list.value) {
				if (p.extraPeronInfo?.personInfo) {
					p.extraformData = JSON.parse(p.extraPeronInfo.personInfo) || [];
				}
			}
			base.value = list.value[0]
		})
	}

	function goConti() {
		if (base.value.signInfo[0].cptSignType == '0') {
			uni.navigateTo({
				url: `/pages_match/match/choose_project?matchId=${signId.value}`
			});
		} else if (base.value.signInfo[0].cptSignType == '1') {
			uni.navigateTo({
				url: `/pages_match/match/choose_sportman?matchId=${signId.value}&groupId=${groupId}&signType=${base.value.signInfo[0].cptSignType}`
			});
		} else {
			uni.navigateTo({
				url: `/pages_match/match/add_rank?matchId=${signId.value}&groupId=${groupId}&signType=${base.value.signInfo[0].cptSignType}`
			});
		}

	}
function download(){
	match.downloadpz(signId.value,groupId).then(res=>{
		goWebView(res.data)
	})
}

	function goWebView(url) {
		url = url.replace("http://", "https://")
		uni.showLoading({
			title: '下载中'
		});
		uni.downloadFile({
			url: url,
			success: function(res) {
				uni.hideLoading();
				var filePath = res.tempFilePath;
				uni.showLoading({
					title: '正在打开'
				});
				uni.openDocument({
					filePath: filePath,
					showMenu: true,
					success: function(res) {
						uni.hideLoading();
					},
					fail: function(err) {
						uni.hideLoading();
						uni.showToast({
							title: err,
							icon: 'none',
							duration: 2000
						});
					}
				});
			},
			fail: function(error) {
				uni.hideLoading();
				uni.showToast({
					title: `下载失败`,
					icon: 'none',
					duration: 2000
				});
			}
		});
	}
</script>

<style scoped lang="scss">
	.poKxBtn {
		position: absolute;
		top: -70rpx;
		right: 0;
		font-size: 24rpx;
		line-height: 2;
	}

	:deep(.uni-group__content) {
		padding: 0;
	}

	.addBtn {
		width: 700rpx;
		height: 90rpx;
		background: #ffffff;
		border: 1rpx solid #1ec886;
		color: #1ec886;
		font-size: 30rpx;
		border-radius: 15rpx;
	}

	.wBox {
		position: relative;
		background: #ffffff;
		border-radius: 15px;
		box-sizing: border-box;
		width: 700rpx;
		margin: 30rpx auto;
		padding: 30rpx;

		:deep(.uni-list-item__container) {
			padding: 10rpx 0 !important;
			padding-left: 0 !important;
		}

		:deep(.uni-list-item__extra-text) {
			font-size: 28rpx;
			color: #2B3133;
			text-align: right;
		}

		:deep(.uni-list-item__content-title) {
			font-size: 28rpx;
			color: #7B7F83;
		}

		.title {
			font-weight: 500;
			color: #000000;
			font-size: 32rpx;
			line-height: 1.6;
			margin: 0 0 20rpx;
		}

		.time {
			font-size: 24rpx;
			color: #7B7F83;
			margin: 0 20rpx;
		}
	}

	:deep(.uni-list-item__extra) {
		width: 60%;
	}

	.avatarUrl {
		width: 200rpx;
		height: 200rpx;
	}

	.avatarUrl button {
		padding: 0;
		display: block;
		line-height: 1;
	}

	.refreshIcon {
		width: 200rpx;
		height: 200rpx;
	}

	.rank-image {
		width: 90rpx;
		height: 90rpx;
		background: #f8f8f8;
		border-radius: 50%;
	}

	.statusPo {
		position: absolute;
		right: 0;
		top: -15rpx;
		color: #fff;

		.status {
			font-size: 30rpx;
			padding: 6rpx 20rpx;
			border-radius: 0 6rpx 0 6rpx;
		}
	}

	.fileName {
		font-size: 28rpx;
		text-align: right;
		color: #54e1b9;
		white-space: nowrap;
		width: 50vw;
		overflow: hidden;
		display: block;
		text-overflow: ellipsis;
	}
</style>