104 lines
2.2 KiB
Vue
104 lines
2.2 KiB
Vue
<script setup>
|
||
// 工具库
|
||
import util from '@/common/js/util.js'
|
||
//
|
||
import api from '@/api/index.js'
|
||
import {
|
||
useStore
|
||
} from 'vuex'
|
||
import {
|
||
ref,
|
||
computed,
|
||
getCurrentInstance,
|
||
} from 'vue';
|
||
// 密码
|
||
import payPwd from '@/components/mine/payPwd.vue'
|
||
//
|
||
const {
|
||
proxy
|
||
} = getCurrentInstance();
|
||
// vuex
|
||
const store = useStore()
|
||
// 用户信息
|
||
const userinfo = computed(() => store.state.userinfo)
|
||
|
||
// 开启青少年模式
|
||
function handleUpdate() {
|
||
api.mine.adolescentOpen({}).then(rs => {
|
||
if (rs.code == 200) {
|
||
// 更新用户信息
|
||
util.getUserinfo()
|
||
return
|
||
}
|
||
util.alert({
|
||
content: rs.msg,
|
||
showCancel: false,
|
||
})
|
||
})
|
||
}
|
||
|
||
// 关闭青少年模式
|
||
function handleClose(userPassword) {
|
||
// 解除青少年模式
|
||
api.mine.adolescentClose({
|
||
path: [userPassword],
|
||
}).then(rs => {
|
||
if (rs.code == 200) {
|
||
util.alert('青少年模式已关闭')
|
||
store.commit('setState', {
|
||
key: 'userinfo',
|
||
value: {
|
||
...userinfo.value,
|
||
teenTime: null,
|
||
}
|
||
})
|
||
// 更新用户信息
|
||
util.getUserinfo()
|
||
return
|
||
}
|
||
util.alert({
|
||
content: rs.msg,
|
||
showCancel: false,
|
||
})
|
||
})
|
||
}
|
||
</script>
|
||
|
||
<template>
|
||
<view class="app">
|
||
<view class="container pr">
|
||
<image class="background" src="/static/teen.png" mode="widthFix" />
|
||
<!-- <view class="">青少年模式说明</view> -->
|
||
|
||
<view class="notice pa c333 f28">
|
||
<view class="mtb30">开启青少年模式后，将自动为您开启时间锁，单日使用时间不超过40分钟，晚上10点至早上6点无法使用九亿</view>
|
||
<view class="mtb30">青少年模式开启后，如果到了使用时间需要输入密码解锁关闭青少年模式</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="btn pro black mtb30 mlr60" v-if="userinfo.teenTime" @click="$refs.payPwdRef.open()">关闭青少年模式</view>
|
||
<view class="btn pro black mtb30 mlr60" v-else @click="handleUpdate">开启青少年模式</view>
|
||
|
||
<view class="fill" style="height: 30rpx;"></view>
|
||
|
||
<!-- 支付弹窗 -->
|
||
<payPwd ref="payPwdRef" @confirm="handleClose" />
|
||
</view>
|
||
</template>
|
||
|
||
<style lang="scss">
|
||
.app {
|
||
background-color: #eaceb9;
|
||
}
|
||
|
||
//
|
||
.background {
|
||
width: 100%;
|
||
}
|
||
|
||
// 提示
|
||
.notice {
|
||
margin: 0 120rpx;
|
||
bottom: 120rpx;
|
||
}
|
||
</style> |