jiuyiUniapp/jiuyi2/components/index/teen.vue

<script setup>
	/**
	 * 青少年模式
	 * 
	 */
	import {
		ref,
		getCurrentInstance,
		defineEmits,
	} from 'vue'

	const {
		proxy
	} = getCurrentInstance()
	const emit = defineEmits(['setting'])

	// 打开
	function open() {
		proxy.$refs.teen.open()
	}

	// 关闭
	function close() {
		proxy.$refs.teen.close()
	}

	// 设置
	function handleSetting() {
		// 
		uni.navigateTo({
			url: '/pages/mine/setting/teen'
		})
		proxy.$refs.teen.close()
	}

	// 
	defineExpose({
		open,
		close,
	})
</script>

<template>
	<view>
		<uni-popup ref="teen" type="bottom">
			<view class="teenAlt popBot ptb30 bfff">
				<view class="close">
					<uni-icons type="closeempty" @click="close()" size="40rpx" />
				</view>

				<view class="main mlr30">
					<text class="txt c333 f34">为呵护未成年人健康成长，九亿推出青少年模式。该模式下设置闹铃限制观看时间，请监护人主动设置。</text>
				</view>

				<view class="button btn black mt60 mb30">
					<text class="txt tac cfff" @click="handleSetting">设置</text>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<style lang="scss" scoped>
	// 
	.close {
		position: absolute;
		top: 20rpx;
		left: 20rpx;
	}

	.main {
		margin-top: 120rpx;

		.txt {
			text-align: center;
		}
	}

	// 按钮
	.button {
		margin: 0 120rpx;
	}
</style>