Sink/app/components/login/index.vue
wudi 7cadbfe2b1 refactor: Migrate project files and directories to the app directory using the new compatibilityVersion: 4 feature
- Moved `app.config.ts` to the `app` directory
- Migrated `.vue` files and other assets to the `app` directory
- Updated import paths to reflect the new file locations
2025-03-24 11:05:59 +08:00

67 lines
1.5 KiB
Vue

<script setup>
import { AlertCircle } from 'lucide-vue-next'
import { toast } from 'vue-sonner'
import { z } from 'zod'
const { t } = useI18n()
const LoginSchema = z.object({
token: z.string().describe('SiteToken'),
})
const loginFieldConfig = {
token: {
inputProps: {
type: 'password',
placeholder: '********',
},
},
}
const { previewMode } = useRuntimeConfig().public
async function onSubmit(form) {
try {
localStorage.setItem('SinkSiteToken', form.token)
await useAPI('/api/verify')
navigateTo('/dashboard')
}
catch (e) {
console.error(e)
toast.error(t('login.failed'), {
description: e.message,
})
}
}
</script>
<template>
<Card class="w-full max-w-sm">
<CardHeader>
<CardTitle class="text-2xl">
{{ $t('login.title') }}
</CardTitle>
<CardDescription>
{{ $t('login.description') }}
</CardDescription>
</CardHeader>
<CardContent class="grid gap-4">
<AutoForm
class="space-y-6"
:schema="LoginSchema"
:field-config="loginFieldConfig"
@submit="onSubmit"
>
<Alert v-if="previewMode">
<AlertCircle class="w-4 h-4" />
<AlertTitle>{{ $t('login.tips') }}</AlertTitle>
<AlertDescription>
{{ $t('login.preview_token') }} <code class="font-mono text-green-500">SinkCool</code> .
</AlertDescription>
</Alert>
<Button class="w-full">
{{ $t('login.submit') }}
</Button>
</AutoForm>
</CardContent>
</Card>
</template>