54 lines
1.8 KiB
Vue
54 lines
1.8 KiB
Vue
|
<script setup lang="ts">
|
||
|
|
import { useUserStore } from "@/pinia/stores/user"
|
||
|
|
import { useDark } from "@@/composables/useDark"
|
||
|
|
import faviconUrl from "/favicon.png?url"
|
||
|
|
|
||
|
|
const router = useRouter()
|
||
|
|
|
||
|
|
const userStore = useUserStore()
|
||
|
|
|
||
|
|
const { isDark, changeDark } = useDark()
|
||
|
|
|
||
|
|
function onClick() {
|
||
|
|
showToast("更多功能，敬请期待 ~")
|
||
|
|
}
|
||
|
|
|
||
|
|
function onLogout() {
|
||
|
|
userStore.resetToken()
|
||
|
|
router.push("/login")
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<div un-py-16px>
|
||
|
|
<van-cell-group un-mb-8px>
|
||
|
|
<van-cell size="large" is-link center @click="onClick">
|
||
|
|
<template #title>
|
||
|
|
<div un-flex-y-center un-gap-16px>
|
||
|
|
<van-image :src="faviconUrl" un-w-44px un-h-44px />
|
||
|
|
<div un-flex un-flex-col>
|
||
|
|
<span un-fw-600>{{ userStore.username }}</span>
|
||
|
|
<span un-text-14px un-color-hex-969799>个人资料</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
</van-cell>
|
||
|
|
</van-cell-group>
|
||
|
|
<van-cell-group un-mb-8px>
|
||
|
|
<van-cell title="🌗 Dark Mode 黑暗模式" center>
|
||
|
|
<template #right-icon>
|
||
|
|
<van-switch :model-value="isDark" size="min(5.333vw, 40px)" @click="changeDark" />
|
||
|
|
</template>
|
||
|
|
</van-cell>
|
||
|
|
<van-cell title="📚 Documentation 文档教程" is-link url="https://juejin.cn/column/7472609448201666599" />
|
||
|
|
<van-cell title="📦️ GitHub 代码仓库" is-link url="https://github.com/un-pany/mobvue" />
|
||
|
|
<van-cell title="☕ Donate 捐赠" is-link url="https://github.com/un-pany/mobvue/issues/1" />
|
||
|
|
<van-cell title="💰 Pay 付费服务" is-link url="https://github.com/un-pany/mobvue/issues/2" />
|
||
|
|
<van-cell title="💬 Group 交流群" is-link url="https://github.com/un-pany/mobvue/issues/3" />
|
||
|
|
</van-cell-group>
|
||
|
|
<van-button block @click="onLogout" un-b-0px un-rounded-0px>
|
||
|
|
退出登录
|
||
|
|
</van-button>
|
||
|
|
</div>
|
||
|
|
</template>
|