167 lines
4.2 KiB
Vue
167 lines
4.2 KiB
Vue
<script setup>
|
|
import { ref, onMounted } from "vue";
|
|
import Container from "@/components/Container.vue";
|
|
import UserHeader from "@/components/UserHeader.vue";
|
|
import UserItem from "@/components/UserItem.vue";
|
|
import Avatar from "@/components/Avatar.vue";
|
|
import { canEenter } from "@/util";
|
|
import useStore from "@/store";
|
|
import { storeToRefs } from "pinia";
|
|
const store = useStore();
|
|
const { user, device, online } = storeToRefs(store);
|
|
const { updateUser } = store;
|
|
|
|
const toOrderPage = () => {
|
|
uni.navigateTo({
|
|
url: "/pages/orders",
|
|
});
|
|
};
|
|
|
|
const toFristTryPage = async () => {
|
|
if (canEenter(user.value, device.value, online.value, "/pages/first-try")) {
|
|
await uni.$checkAudio();
|
|
uni.navigateTo({
|
|
url: "/pages/first-try",
|
|
});
|
|
}
|
|
};
|
|
const toBeVipPage = () => {
|
|
uni.navigateTo({
|
|
url: "/pages/be-vip",
|
|
});
|
|
};
|
|
const toMyGrowthPage = () => {
|
|
uni.navigateTo({
|
|
url: "/pages/my-growth",
|
|
});
|
|
};
|
|
const toGradeIntroPage = () => {
|
|
uni.navigateTo({
|
|
url: "/pages/grade-intro",
|
|
});
|
|
};
|
|
const toRankIntroPage = () => {
|
|
uni.navigateTo({
|
|
url: "/pages/rank-intro",
|
|
});
|
|
};
|
|
const toAboutUsPage = () => {
|
|
uni.navigateTo({
|
|
url: "/pages/about-us",
|
|
});
|
|
};
|
|
const toAudioTestPage = () => {
|
|
uni.navigateTo({
|
|
url: "/pages/audio-test",
|
|
});
|
|
};
|
|
|
|
const showLogout = ref(false);
|
|
const logout = () => {
|
|
uni.removeStorageSync(
|
|
`${uni.getAccountInfoSync().miniProgram.envVersion}_token`
|
|
);
|
|
uni.navigateBack();
|
|
updateUser();
|
|
};
|
|
onMounted(() => {
|
|
const accountInfo = uni.getAccountInfoSync();
|
|
const envVersion = accountInfo.miniProgram.envVersion;
|
|
if (envVersion !== "release") showLogout.value = true;
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<Container title="用户信息">
|
|
<view :style="{ width: '100%', height: '100%' }">
|
|
<UserHeader />
|
|
<scroll-view
|
|
scroll-y
|
|
:show-scrollbar="false"
|
|
:enhanced="true"
|
|
class="container"
|
|
>
|
|
<view :style="{ height: '10px' }"></view>
|
|
<UserItem title="用户名">{{ user.nickName }}</UserItem>
|
|
<UserItem title="头像">
|
|
<Avatar :src="user.avatar" :size="35" />
|
|
</UserItem>
|
|
<UserItem
|
|
title="订单"
|
|
:customStyle="{
|
|
marginTop: '10px',
|
|
}"
|
|
:onClick="toOrderPage"
|
|
/>
|
|
<UserItem
|
|
title="新手试炼场"
|
|
:onClick="user.trio > 0 ? null : toFristTryPage"
|
|
>
|
|
<text v-if="user.trio > 0" :style="{ color: '#259249' }">已完成</text>
|
|
<text v-else :style="{ color: '#CC311F' }">未完成</text>
|
|
</UserItem>
|
|
<UserItem title="会员" :onClick="toBeVipPage">
|
|
已赠送6个月会员
|
|
</UserItem>
|
|
<UserItem title="等级介绍" :onClick="toGradeIntroPage">
|
|
<text :style="{ color: '#4C76FF' }">Lv{{ user.lvl }}</text>
|
|
<text
|
|
:style="{
|
|
color: '#FF7900',
|
|
marginLeft: '5px',
|
|
}"
|
|
>{{ user.lvlPoints }}</text
|
|
>
|
|
<text>点</text>
|
|
</UserItem>
|
|
<UserItem
|
|
title="段位介绍"
|
|
:customStyle="{
|
|
marginBottom: '10px',
|
|
}"
|
|
:onClick="toRankIntroPage"
|
|
>
|
|
<text :style="{ color: '#8E53EA' }">{{ user.lvlName }}</text>
|
|
<text
|
|
:style="{
|
|
color: '#FF7900',
|
|
marginLeft: '5px',
|
|
}"
|
|
>{{ user.scores }}</text
|
|
>
|
|
<text>点</text>
|
|
</UserItem>
|
|
<view class="my-grow" @click="toMyGrowthPage">
|
|
<image src="../static/my-grow.png" mode="widthFix" />
|
|
</view>
|
|
<UserItem title="关于我们" :onClick="toAboutUsPage" />
|
|
<UserItem
|
|
title="音频测试"
|
|
:onClick="toAudioTestPage"
|
|
v-if="showLogout"
|
|
/>
|
|
<UserItem
|
|
title="退出登录(仅用于测试)"
|
|
:onClick="logout"
|
|
v-if="showLogout"
|
|
/>
|
|
<view :style="{ height: '10px' }"></view>
|
|
</scroll-view>
|
|
</view>
|
|
</Container>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.container {
|
|
background-color: #f5f5f5;
|
|
height: calc(100% - 65px);
|
|
margin-top: 15px;
|
|
}
|
|
.my-grow {
|
|
width: 100%;
|
|
}
|
|
.my-grow > image {
|
|
width: 100%;
|
|
}
|
|
</style>
|