78 lines
2.2 KiB
Vue
78 lines
2.2 KiB
Vue
<script setup lang="ts">
|
||
import { Button } from '~/components/ui/button'
|
||
import { Input } from '~/components/ui/input'
|
||
import { Label } from '~/components/ui/label'
|
||
import { authCode } from '~/composables'
|
||
import { API_BASE_URL } from '~/CONSTANT'
|
||
import manba from '../../public/pack.png'
|
||
|
||
const code = ref('')
|
||
const router = useRouter()
|
||
const remember = ref(false)
|
||
|
||
function auth() {
|
||
authCode.value = code.value
|
||
const resp = baseFetch(`${API_BASE_URL}/ping`, {
|
||
})
|
||
if (!resp.error.value) {
|
||
if (remember.value) {
|
||
localStorage.setItem('authCode', code.value)
|
||
}
|
||
else {
|
||
sessionStorage.setItem('authCode', code.value)
|
||
}
|
||
router.push('/')
|
||
return
|
||
}
|
||
// eslint-disable-next-line no-alert
|
||
alert('认证失败')
|
||
}
|
||
</script>
|
||
|
||
<template>
|
||
<div class="w-full lg:grid lg:grid-cols-2 lg:min-h-[600px] xl:min-h-[800px]">
|
||
<div class="hidden p-30 lg:block">
|
||
<img
|
||
:src="manba"
|
||
alt="Image"
|
||
class="h-full w-full object-cover dark:brightness-[0.2] dark:grayscale"
|
||
>
|
||
</div>
|
||
<div class="flex items-center justify-center bg-muted py-12">
|
||
<div class="grid mx-auto w-[350px] gap-6">
|
||
<div class="grid gap-2 text-center">
|
||
<h1 class="text-3xl font-bold">
|
||
系统认证
|
||
</h1>
|
||
<p class="text-balance text-muted-foreground">
|
||
本系统仅供内部使用
|
||
</p>
|
||
</div>
|
||
<div class="grid gap-4">
|
||
<div class="grid gap-2">
|
||
<div class="flex items-center">
|
||
<Label for="password">口令</Label>
|
||
</div>
|
||
<Input id="password" v-model="code" type="password" required />
|
||
</div>
|
||
<div flex="~ items-center gap-2">
|
||
<Checkbox id="remember" v-model="remember" />
|
||
<Label for="remember" class="flex items-center">
|
||
记住我
|
||
</Label>
|
||
</div>
|
||
<Button type="submit" class="w-full" @click.prevent="auth">
|
||
认证
|
||
</Button>
|
||
</div>
|
||
<div class="mt-4 text-center text-sm">
|
||
丢失密码？请前往后端重置
|
||
<!-- <a href="#" class="underline">
|
||
Sign up
|
||
</a> -->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|