<template>
	<div class="container">

		<!-- <view class="white-content"> -->
			<image style="width: 500rpx;height:500rpx" src="https://www.focusnu.com/media/directive/index/account/oldsuccess.png" />
			<view class="white-font">
				尊敬的用户，您已成功{{ ischange? '修改':"添加" }}{{ isjianhu?`监护人`: `长者` }}信息
			</view>
			<view class="bottom-font">
				<text style="color: #068DFF;">{{ seconds }}秒后</text>自动跳转到长者端 ...
				 
			</view>
		<!-- </view> -->

	</div>
</template>

<script setup>
	import {
		ref,
		reactive
	} from 'vue'
	import {
		onLoad,
		onUnload
	} from '@dcloudio/uni-app';

	const seconds = ref(6)

	const goBack = () => {
		uni.navigateBack()
	}

	let timer = null
	const ischange = ref(false)
	const isjianhu = ref(false)
	onLoad((element) => {
		// 保证每次进页面都从 6 开始
		seconds.value = 6
		// console.log("????",element)
		if(element.type){
			ischange.value = true
		}
		if(element.jianhu){
			isjianhu.value = true; 
		}
		// 每 1 秒减 1，减到 0 清理计时器（不做其他动作）
		timer = setInterval(() => {
			if (seconds.value > 0) {
				seconds.value -= 1
			} else {
				clearInterval(timer)
				timer = null;
				goToBack()
			}
		}, 1000)
	})

	// 页面卸载时清理（防止内存泄漏）
	onUnload(() => {
		if (timer) {
			clearInterval(timer)
			timer = null
		}
	})
	const goToBack = () => {
		uni.reLaunch({
			url: '/pages/oldmanindex/index'
		})
	}
</script>

<style lang="scss" scoped>
	.container {
		display: flex;
		flex-direction: column;
		min-height: 100vh;
		width: 100%;
		background-color: #F7F7F7;
		justify-content: center;
		align-items: center;

		.white-content {
			width: 70%;
			height: 600rpx;
			border-radius: 50rpx;
			background-color: #fff;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			margin-top: -50rpx;
			position: relative;

			// .white-img {
			// 	width: 100rpx;
			// 	height: 400rpx;
			// }

			.white-font {
				font-size: 38rpx;
				font-weight: 600;
				margin-top: 40rpx;
			}

			.bottom-font {
				position: absolute;
				bottom: 100rpx;
				left: 0;
				width: 100%;
				font-size: 28rpx;
				color: #666666;
				text-align: center;
			}
		}
	}
</style>