rosercode
e49b6b7b81
- 新增通知配置、渠道、发送日志三张表（MySQL/SQLite 双建表脚本）及实体、Mapper、Service、Controller - 支持邮箱（SMTP）与 Server 酱两种推送渠道，抽象 NotificationSender 工厂统一发送 - 新增 NotificationScheduler 定时任务，按每天/每周/每月周期检查并推送账单导入提醒 - 新增全局通知链接地址配置（/api/app/notification-url），随提醒一并下发 - 前端系统设置页新增「定时通知」面板，支持周期配置、渠道增删改测、立即发送与发送日志 - 新增 /bill-import 直达页，供提醒链接一键打开账单上传弹窗 - 登录支持 redirect 回跳，仅允许站内路径以防开放重定向
97 lines
3.3 KiB
Vue
97 lines
3.3 KiB
Vue
<script setup lang="ts">
|
|
// 登录页面组件：提供用户名/密码表单，验证后跳转至首页
|
|
import { ref, computed, onMounted } from 'vue'
|
|
import { useRouter, useRoute } from 'vue-router'
|
|
import { useI18n } from 'vue-i18n'
|
|
import { useMessage, NCard, NForm, NFormItem, NInput, NButton, NSpace } from 'naive-ui'
|
|
import { login } from '../api/user'
|
|
import { useUserStore } from '../store/user'
|
|
import { useRegistrationStore } from '../store/registration'
|
|
import LocaleSwitch from '../components/LocaleSwitch.vue'
|
|
|
|
const router = useRouter()
|
|
const route = useRoute()
|
|
const message = useMessage() // 消息提示工具
|
|
const userStore = useUserStore() // 用户状态管理
|
|
const registrationStore = useRegistrationStore() // 注册状态管理
|
|
const { t } = useI18n() // 国际化
|
|
|
|
// 是否显示注册入口：注册开关开启或系统尚无用户时显示
|
|
const canRegister = computed(() => registrationStore.status?.allowed ?? false)
|
|
|
|
onMounted(async () => {
|
|
if (!registrationStore.loaded) {
|
|
await registrationStore.load()
|
|
}
|
|
})
|
|
|
|
// 登录表单数据
|
|
const form = ref({
|
|
username: '',
|
|
password: '',
|
|
})
|
|
const loading = ref(false) // 登录按钮加载状态
|
|
|
|
/** 解析登录后的回跳地址：仅允许站内路径，避免开放重定向 */
|
|
function resolveRedirect(): string {
|
|
const redirect = route.query.redirect
|
|
const target = Array.isArray(redirect) ? redirect[0] : redirect
|
|
if (typeof target === 'string' && target.startsWith('/') && !target.startsWith('//')) {
|
|
return target
|
|
}
|
|
return '/dashboard'
|
|
}
|
|
|
|
/** 处理登录操作：校验表单 -> 调用登录接口 -> 保存 token -> 跳转首页 */
|
|
async function handleLogin() {
|
|
if (!form.value.username || !form.value.password) {
|
|
message.warning(t('login.fillRequired'))
|
|
return
|
|
}
|
|
loading.value = true
|
|
try {
|
|
const res: any = await login(form.value)
|
|
userStore.setToken(res.data.token) // 保存 token
|
|
userStore.setUserInfo(res.data.user.nickname, res.data.user.id) // 保存用户信息
|
|
message.success(t('login.success'))
|
|
router.push(resolveRedirect()) // 跳转到来源页或统计面板
|
|
} catch (e: any) {
|
|
message.error(e.message || t('login.failed'))
|
|
} finally {
|
|
loading.value = false
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="login-container">
|
|
<NCard :title="t('login.title')" style="width: 400px" :bordered="true">
|
|
<template #header-extra>
|
|
<LocaleSwitch />
|
|
</template>
|
|
<NForm>
|
|
<NFormItem :label="t('login.username')">
|
|
<NInput v-model:value="form.username" :placeholder="t('login.usernamePlaceholder')" @keyup.enter="handleLogin" />
|
|
</NFormItem>
|
|
<NFormItem :label="t('login.password')">
|
|
<NInput v-model:value="form.password" type="password" show-password-on="click" :placeholder="t('login.passwordPlaceholder')" @keyup.enter="handleLogin" />
|
|
</NFormItem>
|
|
<NSpace vertical>
|
|
<NButton type="primary" block :loading="loading" @click="handleLogin">{{ t('login.submit') }}</NButton>
|
|
<NButton v-if="canRegister" text type="info" @click="router.push('/register')">{{ t('login.toRegister') }}</NButton>
|
|
</NSpace>
|
|
</NForm>
|
|
</NCard>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.login-container {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
height: 100vh;
|
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|
}
|
|
</style>
|