<template>
	<uni-popup ref="registerPopup" :mask-click="false" type="center">
		<view class="popup-container">
			<view v-if="titleValue" class="title">
				{{ titleValue }}
			</view>
			<view class="content">
				{{ textValue }}
			</view>
			<view @click="gotoMore" class="btn">
				{{ btnValue }}
			</view>
			<image :src="$baseUrl + 'sign-up/close.png'" class="close" @click="close" />
		</view>
	</uni-popup>
</template>

<script setup lang="ts">
import { ref, defineProps, defineEmits, computed, toRefs } from 'vue'

const props = defineProps({
	textValue: {
		type: String,
		default: '',
	},
	btnValue: {
		type: String,
		default: '',
	},
	titleValue: {
		type: String,
		default: '',
	},
})
const { textValue, btnValue, titleValue } = toRefs(props)
const registerPopup = ref(null)
const emit = defineEmits([
	'goToMore',
])

const open = () => {
	registerPopup.value.open()
}
const close = () => {
	registerPopup.value.close()
	if(textValue.value == '活动不存在' || textValue.value == '活动已结束'){
		// 检查是否有上一页
		const pages = getCurrentPages()
		if (pages.length > 1) {
			// 有上一页，直接返回上一页（收藏状态已在更新时同步）
			uni.navigateBack()
		} else {
			// 没有上一页，跳转到集合页
			uni.redirectTo({
				url: `/subPackages/momclub/actList`
			})
		}
	}
}
const gotoMore = () => {
	registerPopup.value.close()
	emit('goToMore')
}
defineExpose({
	open,
	close
})
</script>

<style lang="less" scoped>
.popup-container {
	width: calc(100vw - 204rpx);
	max-height: 400rpx;
	min-height: 320rpx;
	border-radius: 38rpx;
	padding: 56rpx 72rpx 60rpx;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	position: relative;
	background: linear-gradient(180deg, #FFE9C5 -18.87%, #FFFFFF 50.63%);

	.title {
		font-weight: 600;
		font-size: 36rpx;
		color: #D3A458;
		margin-bottom: 20rpx;

	}

	.content {
		color: #54390D;
		font-size: 28rpx;
		font-weight: 600;
		text-align: center;
		margin: 30rpx 0rpx 40rpx;
	}

	.btn {
		width: 100%;
		height: 80rpx;
		line-height: 78rpx;
		border-radius: 60rpx;
		background: #D3A458;
		color: #FFFFFF;
		font-weight: 500;
		font-size: 32rpx;
		text-align: center;
	}

	.close {
		position: absolute;
		bottom: -134rpx;
		left: 50%;
		transform: translateX(-50%);
		width: 56rpx;
		height: 56rpx;
	}
}
</style>
