62 lines
1.4 KiB
Vue
62 lines
1.4 KiB
Vue
<script setup lang="tsx">
|
|
import ModalAuthentication from '~/components/ModalAuthentication.vue'
|
|
|
|
const loginState = useLoginState()
|
|
|
|
defineProps({
|
|
contentClass: {
|
|
type: String,
|
|
default: '',
|
|
},
|
|
needAdmin: {
|
|
type: Boolean,
|
|
default: false,
|
|
},
|
|
})
|
|
|
|
const overlay = useOverlay()
|
|
const modal = overlay.create(ModalAuthentication)
|
|
</script>
|
|
|
|
<template>
|
|
<ClientOnly>
|
|
<div
|
|
v-if="!loginState.is_logged_in"
|
|
class="w-full flex flex-col justify-center items-center gap-2 py-40"
|
|
>
|
|
<Icon
|
|
name="i-tabler-user-circle"
|
|
class="text-7xl text-neutral-300 dark:text-neutral-700"
|
|
/>
|
|
<p class="text-sm text-neutral-500 dark:text-neutral-400">请登录后使用</p>
|
|
<UButton
|
|
class="mt-2 font-bold"
|
|
color="primary"
|
|
size="xs"
|
|
variant="solid"
|
|
@click="modal.open()"
|
|
>
|
|
登录
|
|
</UButton>
|
|
</div>
|
|
<div
|
|
v-else-if="needAdmin && loginState.user.auth_code !== 2"
|
|
class="w-full flex flex-col justify-center items-center gap-2 py-40"
|
|
>
|
|
<Icon
|
|
class="text-7xl text-neutral-300 dark:text-neutral-700"
|
|
name="tabler:hand-stop"
|
|
/>
|
|
<p class="text-sm text-neutral-500 dark:text-neutral-400">账号没有权限</p>
|
|
</div>
|
|
<div
|
|
:class="contentClass"
|
|
v-else
|
|
>
|
|
<slot />
|
|
</div>
|
|
</ClientOnly>
|
|
</template>
|
|
|
|
<style scoped></style>
|