<template>
	<view class="container">
		<view class="task_bg u-absolute">
			<image class="task_bg" src="@/static/task/task_bg.png"></image>
		</view>
		<view class="icon">
			<image class="task_icon1" src="@/static/task/task_icon1.png"></image>
			<view class="icon_title">新人好礼送不停</view>
			<image class="task_icon2" src="@/static/task/task_icon2.png"></image>
		</view>

		<view class="contentTop">
			<view>
				<image src="@/static/task/renwubg.png" mode=""></image>
				<view>
					已连续签到
					<text class="num">{{ datas.signDays }}</text>
					天
				</view>
			</view>
			<view class="contentTopTwo">
				<view v-for="item in datas.signInList" :key="item.id" :style="item.status == 1 ? 'color:#EFA765' : 'color:#999'">
					<text class="" style="font-size: 28rpx">
						{{ item.status == 1 ? '已签到' : '待签到' }}
					</text>
					<view :style="item.status == 1 ? 'color:#999' : 'color:#EFA765'">
						{{ item.signDay.substr(5, 8) }}
					</view>
					<image v-if="item.status == 0" src="@/static/task/xing (1).png" mode=""></image>
					<image v-else src="@/static/task/xing (2).png" mode=""></image>
				</view>
			</view>
		</view>
		<view class="content" v-if="datas.list.length">
			<view class="cell" v-for="(item, index) in datas.list" :key="index">
				<view class="cell_left">
					<view class="cell_title">
						<view class="title" :style="{ alignSelf: item.rewardImg ? 'center' : 'flex-start' }">{{ item.title }}</view>
						<image v-if="item.rewardImg" class="cell_icon" :src="item.rewardImg" mode=""></image>
						<view class="tip">{{ item.rewardDetail }}</view>
					</view>
					<view class="subhead">{{ item.detail }}</view>
				</view>
				<view class="cell_right">
					<view v-if="item.disabled" class="btn u-font-24 text-bold" :style="{ backgroundColor: item.buttonBgColor, color: item.buttonFontColor }" @click="goNav(item)">
						{{
							item.type == 1
								? item.buttonTitle
								: item.number
								? `${item.discNumber}/${item.number}`
								: item.discNumber <= 0
								? item.buttonTitle
								: `剩余${item.discNumber}次`
						}}
					</view>
					<view v-else class="btn u-font-24 text-bold disabled">
						{{
							item.type == 1
								? item.buttonTitle
								: item.number
								? `${item.discNumber}/${item.number}`
								: item.discNumber <= 0
								? item.buttonTitle
								: `剩余${item.discNumber}次`
						}}
					</view>
					<view
						v-if="item.buttonUnderContent && item.buttonUnderUrl"
						class="u-font-22 tip"
						style="text-align: center"
						@click="goNav({ id: item.id, buttonUrl: item.buttonUnderUrl, jumpType: 1, title: item.title, disabled: item.disabled, discNumber: item.discNumber })"
					>
						{{ item.buttonUnderContent }}
					</view>
				</view>
			</view>
		</view>
		<!-- 激励视频广告 -->
		<view style="width: 0; height: 0; overflow: hidden">
			<!-- 激励视频广告 -->
			<ad-rewarded-video
				ref="adRewarded"
				:adpid="datas.adpid"
				:loadnext="true"
				:url-callback="datas.urlCallback"
				@load="onadload"
				@close="onadclose"
				@error="onaderror"
			></ad-rewarded-video>
		</view>
	</view>
	<disable-mask v-if="disableShow"></disable-mask>
</template>

<script setup>
import { useCommonStore } from '@/store/common.js';
const $common = useCommonStore();
import { selectUserMoney, selectPayDetails, canCash, state, withdraw } from '@/api/me/withdraw.js';
import { reactive, ref, getCurrentInstance, nextTick } from 'vue';
import { onShow, onReady, onReachBottom } from '@dcloudio/uni-app';
import { getUserSignData, selectTaskCenter, taskReceive } from '@/api/task/index.js';

const disableShow = ref(false);

const currentInstance = getCurrentInstance();
let datas = reactive({
	signDays: 0,
	signInList: [],
	list: [],
	urlCallback: {},
	adpid: null,
	adRewardedShow: false,
	adRewardedVideoloadNum: 0
});
const adRewarded = ref(null);
onShow(() => {
	// $common.init()
	// if ( uni.getSystemInfoSync().platform == 'android' ) {
	// datas.adpid = 1531580352
	// }
	// if ( uni.getSystemInfoSync().platform == 'ios' ) {
	datas.adpid = 1373604770;
	// }
	if (uni.getStorageSync('token')) {
		getTaskdata();
		getsignIn();
		getCanCash();
	} else {
		datas.signDays = 0;
		const dateArray = [];
		datas.signInList = [];
		for (let i = 0; i < 7; i++) {
			const date = new Date(Date.now() + i * 24 * 60 * 60 * 1000);
			const year = date.getFullYear();
			const month = date.getMonth() + 1 < 10 ? `0${date.getMonth() + 1}` : date.getMonth() + 1;
			const day = date.getDate() < 10 ? `0${date.getDate()}` : date.getDate();
			dateArray.push(`${year}-${month}-${day}`);
		}
		dateArray.forEach((ele) => {
			datas.signInList.push({
				signDay: ele,
				status: '0'
			});
		});
		datas.list = [
			{
				id: 1,
				title: '每日打卡奖励',
				type: 2,
				detail: '解锁3集视频即可领取',
				rewardDetail: '奖励666金币',
				number: 3,
				buttonTitle: '',
				jumpType: 1,
				buttonUrl: '',
				buttonUnderContent: '',
				buttonUnderUrl: '',
				updateTime: '2025-01-06 18:08:49',
				sort: 0,
				shows: 1,
				discNumber: 0,
				disabled: false
			},
			{
				id: 17,
				title: '每周打卡奖励',
				type: 2,
				detail: '当月签到满7天即可免费领取',
				rewardImg: 'https://short-video.hnsiyao.cn/20241210/8aca569a9d544e819f542ce8aa7e7ce5.png',
				rewardDetail: '',
				number: 7,
				buttonTitle: '立即领取',
				buttonBgColor: '#EC6F48',
				buttonFontColor: '#fff',
				jumpType: 1,
				buttonUrl: '/pages/task/receiveMember',
				buttonUnderContent: '',
				buttonUnderUrl: '/pages/task/receiveMember',
				createTime: '2024-12-10 17:43:42',
				updateTime: '2024-12-25 09:52:09',
				sort: 5,
				shows: 1,
				discNumber: 0,
				disabled: false
			},
			{
				id: 17,
				title: '每月打卡奖励1',
				type: 2,
				detail: '当月签到满25天即可免费领取',
				rewardImg: 'https://short-video.hnsiyao.cn/20241210/8aca569a9d544e819f542ce8aa7e7ce5.png',
				rewardDetail: '会员免费领',
				number: 25,
				buttonTitle: '立即领取',
				buttonBgColor: '#EC6F48',
				buttonFontColor: '#fff',
				jumpType: 1,
				buttonUrl: '/pages/task/receiveMember',
				buttonUnderContent: '',
				buttonUnderUrl: '/pages/task/receiveMember',
				createTime: '2024-12-10 17:43:42',
				updateTime: '2024-12-25 09:52:09',
				sort: 5,
				shows: 1,
				discNumber: 0,
				disabled: false
			},
			{
				id: 17,
				title: '每月打卡奖励2',
				type: 2,
				detail: '当月签到满25天即可免费领取',
				rewardImg: 'https://short-video.hnsiyao.cn/20241210/8aca569a9d544e819f542ce8aa7e7ce5.png',
				rewardDetail: '',
				number: 25,
				buttonTitle: '立即领取',
				buttonBgColor: '#EC6F48',
				buttonFontColor: '#fff',
				jumpType: 1,
				buttonUrl: '/pages/task/receiveMember',
				buttonUnderContent: '',
				buttonUnderUrl: '/pages/task/receiveMember',
				createTime: '2024-12-10 17:43:42',
				updateTime: '2024-12-25 09:52:09',
				sort: 5,
				shows: 1,
				discNumber: 0,
				disabled: false
			}
		];
	}
});
onReady(() => {
	nextTick(() => {
		datas.urlCallback = {
			userId: uni.getStorageSync('userInfo').userId,
			extra: uni.getStorageSync('userInfo').userId + '' + new Date().getTime()
		};
		datas.adRewardedVideoloadNum = 0;

		adRewarded.value.load();
	});
});
/**
 * 获取看广告状态
 */
async function getCanCash() {
	canCash().then((res) => {
		datas.isWithdraw = !res;
	});
}

/**
 * 广告加载失败回调
 * @param {Object} e
 */
function onaderror(e) {
	if (datas.adRewardedVideoloadNum >= 3) {
		return;
	}
	datas.adRewardedVideoloadNum++;
	setTimeout(() => {
		datas.urlCallback = {
			userId: uni.getStorageSync('userInfo').userId,
			extra: uni.getStorageSync('userInfo').userId + '' + new Date().getTime()
		};
		adRewarded.value.load();
	}, 1000); // 10
	console.log('广告加载失败');
}

/**
 * 广告数据加载成功回调
 * @param {Object} e
 */
function onadload(e) {
	datas.adRewardedShow = true;
	console.log('广告数据加载成功');
}
/**
 * 广告播放成功回调
 * @param {Object} e
 */
async function onadclose(e) {
	const detail = e.detail;
	if (detail && detail.isEnded) {
		// 正常播放结束
		let res = await state({
			extraKey: datas.urlCallback.extra
		});
		datas.urlCallback = {
			userId: uni.getStorageSync('userInfo').userId,
			extra: uni.getStorageSync('userInfo').userId + '' + new Date().getTime()
		};
		uni.showToast({
			title: '获得' + $common.freeDuration + '分钟免费时长',
			icon: 'none'
		});
	} else {
		// 播放中途退出
	}
}
async function goNav(item) {
	console.log(item, '请求参数');
	// jumpType (integer, optional): 跳转类型 1 内部路径 2 外部路径 ,
	// type (integer, optional): 任务类型 1 普通任务 2 打卡任务 9 其它 ,
	// if (url) {
	// 	let urls = ''
	// 	if (url == '/pages/task/prizeList') {
	// 		urls = url + '?source=2'
	// 	}
	// 	if (url == '/pages/task/receiveMember') {
	// 		urls = url + `?standard=${item.discNumber == null ? true : false}&taskId=${item.id}`
	// 	}
	// 	uni.navigateTo({
	// 		url: urls
	// 	})
	// } else {

	// }
	if (item.jumpType == 0) {
		if (item.buttonTitle.indexOf('领取') != -1) {
			let res = await taskReceive({
				id: item.id
			});
			if (res.code == 0) {
				uni.showToast({
					title: res.id == 15 ? '签到成功' : '领取成功',
					icon: 'none'
				});
				setTimeout(() => {
					getTaskdata();
					getsignIn();
				}, 1000);
			} else {
				uni.showToast({
					title: res.msg,
					icon: 'none'
				});
			}
		} else if (item.title.indexOf('新人福利') != -1) {
			let res = await taskReceive({
				id: item.id
			});
			if (res.code == 0) {
				uni.showToast({
					title: res.id == 15 ? '签到成功' : '领取成功',
					icon: 'none'
				});
				setTimeout(() => {
					getTaskdata();
					getsignIn();
				}, 1000);
			} else {
				uni.switchTab({
					url: '/pages/index/index'
				});
			}
		} else if (item.buttonTitle.indexOf('观看视频') != -1) {
			// 首次加载广告
			if (!datas.adRewardedShow) {
				uni.showToast({
					icon: 'none',
					title: '广告加载失败，请稍后重试'
				});
				return;
			}

			console.log(datas.urlCallback);
			adRewarded.value.show();
		} else {
			uni.switchTab({
				url: '/pages/index/index'
			});
		}
	} else if (item.jumpType == 1) {
		let buttonUrl = item.buttonUrl;
		if (item.title && item.title.indexOf('每周打卡奖励') != -1) {
			buttonUrl = item.buttonUrl + '?source=2';
		}
		if (item.title && item.title.indexOf('每月打卡奖励1') != -1) {
			buttonUrl = item.buttonUrl + '?source=3';
		}
		if (item.title && item.title.indexOf('每月打卡奖励2') != -1) {
			// let res = await taskReceive({
			// 	id: item.id
			// })
			// if (res.code == 0) {
			// 	uni.showToast({
			// 		title: res.id == 15 ? '签到成功' : '领取成功',
			// 		icon: 'none'
			// 	})
			// 	setTimeout(() => {
			// 		getTaskdata()
			// 		getsignIn()
			// 	}, 1000)
			// } else {
			// 	uni.showToast({
			// 		title: res.msg,
			// 		icon: 'none'
			// 	})
			// }

			buttonUrl = `${item.buttonUrl}?standard=${item.discNumber == null ? true : false}&taskId=${item.id}`;
		}
		uni.navigateTo({
			url: buttonUrl
		});
	} else if (item.jumpType == 3) {
		uni.switchTab({
			url: item.buttonUrl
		});
	}
}

// 获得签到
async function getsignIn() {
	try {
		let res = await getUserSignData();
		datas.signInList = res.recordList;
		datas.signDays = res.signDays;
	} catch (error) {
		if (error.code == 702) {
			disableShow.value = true;
		} else {
			disableShow.value = false;
		}
	}
}
// 获取任务列表
async function getTaskdata() {
	let res = await selectTaskCenter();
	let arrData = [];
	if (!$common.isIosExamine) {
		res.forEach((ele) => {
			if (ele.title.indexOf('分享奖励') == -1 && ele.title.indexOf('新人福利') == -1 && ele.title.indexOf('观看视频奖励') == -1) {
				arrData.push(ele);
			}
		});
		datas.list = arrData;
	} else {
		// res.forEach(ele => {
		// 	if (ele.title.indexOf('观看视频奖励') == -1) {
		// 		arrData.push(ele)
		// 	}
		// })
		datas.list = res;
	}
}
</script>

<style scoped lang="scss">
page {
	// min-height: 100vh;
}

.container {
	/* #ifdef H5 */
	min-height: calc(100vh - 96rpx);
	/* #endif */
	/* #ifndef H5 */
	min-height: 100vh;
	/* #endif */
	background-color: #f3f4f8;
	padding-top: 2rpx;
}

.u-absolute {
	position: absolute;
}

.task_bg {
	width: 100% !important;
	height: 494rpx !important;
}

.icon {
	position: absolute;
	padding: 122rpx 32rpx 32rpx 32rpx;

	.icon_title {
		color: #000000;
		margin-left: 28rpx;
		top: -20rpx;
		font-size: 32rpx;
		font-weight: bold;
		position: relative;
	}

	.task_icon1 {
		width: 74rpx !important;
		height: 78rpx !important;
		margin-left: 235rpx;
		position: relative;
	}

	.task_icon2 {
		width: 126rpx !important;
		height: 120rpx !important;
		top: -40rpx;
		position: relative;
	}
}

.contentTop {
	border-radius: 16rpx;
	// top: -115rpx;
	padding: 20rpx;
	margin-bottom: 32rpx;
	position: relative;
	background-color: #ffffff;
	color: #666666;
	margin: 282rpx 32rpx 32rpx 32rpx;

	> view:first-child {
		> image {
			width: 100%;
			height: 78rpx;
			position: absolute;
			left: 0;
			top: 0;
			z-index: 1;
		}

		> view {
			z-index: 9999;
			position: absolute;
			text-align: center;
			width: 98%;

			.num {
				color: #ec6f48;
				margin: 0 10rpx;
			}
		}
	}

	.contentTopTwo {
		margin-top: 100rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;

		> view {
			position: relative;

			> view {
				display: flex;
				margin-top: 20rpx;
				width: 100%;
				height: 94rpx;
				background: linear-gradient(180deg, #fff7e3 0%, #ffffff 100%);
				border-radius: 14rpx 14rpx 0rpx 0rpx;
			}

			> image {
				width: 52rpx;
				height: 48rpx;
				position: absolute;
				top: 110rpx;
				left: 14rpx;
			}
		}
	}
}

.content {
	border-radius: 16rpx;
	// top: -115rpx;
	padding: 28rpx;
	background-color: #ffffff;
	color: #666666;
	margin-left: 32rpx;
	margin-right: 32rpx;
	position: relative;
	border-radius: 16rpx;
	padding: 28rpx;
	margin-bottom: 32rpx;

	.cell {
		padding: 32rpx 0;
		border-bottom: 2rpx solid #ebebeb;
		display: flex;
		justify-content: space-between;

		.cell_left {
			flex-direction: column;
			margin-top: 10rpx;

			.cell_title {
				margin-bottom: 12rpx;
				color: #333;
				display: flex;

				.title {
					display: flex;
					flex-shrink: 0;
					font-size: 28rpx;
					font-weight: bold;
				}

				.cell_icon {
					width: 48rpx !important;
					height: 34rpx !important;
					margin-left: 16rpx;
				}

				.tip {
					margin-left: 22rpx;
					color: #fc5b67;
					font-size: 24rpx;
				}
			}

			.subhead {
				color: #999;
				font-size: 24rpx;
			}
		}

		.cell_right {
			flex-direction: column;
			align-items: center;
			flex-shrink: 0;
			margin-left: 20rpx;

			.btn {
				width: 148rpx;
				height: 56rpx;
				line-height: 56rpx;
				text-align: center;
				background-color: #ec6f48;
				color: #ffffff;
				border-radius: 12rpx 12rpx 12rpx 12rpx;
				font-size: 24rpx;
				font-weight: bold;
			}

			.tip {
				color: #ec6f48;
				height: 44rpx;
				line-height: 44rpx;
				margin-top: 5rpx;
				font-size: 22rpx;
			}

			.opt {
				color: #d39b7e;
				background-color: #fbf3eb;
			}

			.disabled {
				color: #999999;
				background-color: #e2e2e2;
			}
		}
	}

	.cell:last-child {
		border-bottom: none;
	}
}
</style>
