<template>
	<view class="sharenpopnologin_overlay" v-if="visible">
		<view class="sharenpopnologin_container" @click.stop>
			<!-- 弹窗内容 -->
			<view class="popup_content">
				<!-- 标题文字 -->
				<text class="popup_title">快去查看你的权益吧</text>
				
				<!-- 3D星星角色 -->
				<view class="star_character">
					<image 
						class="star_img" 
						:src="$baseUrl + 'integral/1023/invate_star_character1023.png'" 
						mode="aspectFit"
					/>
				</view>
				
				<!-- 立即查看按钮 -->
				<view class="view_button" @click="handleViewBenefits">
					<text class="view_button_text">立即查看</text>
				</view>
			</view>
			
			<!-- 关闭按钮 -->
			<view class="close_button" @click="handleClose">
				<text class="close_icon">×</text>
			</view>
		</view>
	</view>
</template>

<script setup>
import { defineProps, defineEmits } from 'vue';
import { jump, JumpType } from '../../utils';

// Props 定义
const props = defineProps({
	visible: {
		type: Boolean,
		default: false
	}
});

// Emits 定义
const emit = defineEmits(['close', 'viewBenefits']);

// 关闭弹窗
const handleClose = () => {
	emit('close');
	gotoIntegral();
};

// 查看权益按钮点击
const handleViewBenefits = () => {
	emit('viewBenefits');
	emit('close');
	gotoIntegral();
};

const gotoIntegral = () => {
	jump({
		url: '/pages/index/index?pageType=integral',
		type: JumpType.INNER
	});
};
</script>

<style lang="less" scoped>
@import '@/components/integralArea/sharenpopnologin.less';
</style>
