107 lines
3.2 KiB
Vue
107 lines
3.2 KiB
Vue
<template>
|
||
<AppPage :show-footer="true" bg-cover :style="{ backgroundImage: `url(${bgImg})` }">
|
||
<div
|
||
style="transform: translateY(25px)"
|
||
class="m-auto max-w-1500 min-w-750 f-c-c rounded-12 bg-white bg-opacity-80"
|
||
dark:bg-dark
|
||
>
|
||
<div w-750 px-20 style="height: 400px; padding-top: 50px; text-align: center;">
|
||
<img style="width: 371px; height: 60px; margin: auto;" src="@/assets/images/logo.png" alt="">
|
||
<div mt-50 style="text-align: center; font-size: 48px; color: #303133; line-height: 48px; font-weight: 600; ">
|
||
非遗IP价值评估系统
|
||
</div>
|
||
<div style="text-align: center; margin-top: 16px; color: #606266;">
|
||
基于深度学习算法的智能评估系统，为您的知识产权和非物质文化遗产提供专业的价值评估服务
|
||
</div>
|
||
<div mt-30>
|
||
<n-input
|
||
v-model:value="loginInfo.phone"
|
||
style="display: inline-block; width: 260px; height: 42px; text-align: left; line-height: 42px;"
|
||
placeholder="请输入手机号"
|
||
:maxlength="20"
|
||
@keypress.enter="handleRegister"
|
||
>
|
||
<template #prefix>
|
||
<img style="width: 18px; height: 18px; margin-right: 8px;" src="@/assets/images/phone.png" alt="">
|
||
</template>
|
||
</n-input>
|
||
|
||
<n-button
|
||
w-126
|
||
h-42
|
||
rounded-5
|
||
type="primary"
|
||
style="background: linear-gradient( 93deg, #880C22 0%, #A30113 100%); margin-left: 20px; font-size: 16px; border: none !important;"
|
||
@click="handleRegister"
|
||
>
|
||
立即登录
|
||
<img style="width: 18px; height: 18px; margin-left: 2px;" src="@/assets/images/go.png" alt="">
|
||
</n-button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</AppPage>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { lStorage, setToken } from '@/utils'
|
||
import bgImg from '@/assets/images/login_bg.png'
|
||
import api from '@/api'
|
||
import { addDynamicRoutes } from '@/router'
|
||
import { useI18n } from 'vue-i18n'
|
||
|
||
const router = useRouter()
|
||
const { query } = useRoute()
|
||
const { t } = useI18n({ useScope: 'global' })
|
||
|
||
const loginInfo = ref({
|
||
phone: '',
|
||
})
|
||
|
||
initLoginInfo()
|
||
|
||
function initLoginInfo() {
|
||
const localLoginInfo = lStorage.get('loginInfo')
|
||
if (localLoginInfo) {
|
||
loginInfo.value.phone = localLoginInfo.phone || ''
|
||
loginInfo.value.password = localLoginInfo.password || ''
|
||
}
|
||
}
|
||
|
||
const loading = ref(false)
|
||
|
||
async function handleRegister() {
|
||
const { phone } = loginInfo.value
|
||
if (!phone) {
|
||
$message.warning('请输入手机号')
|
||
return
|
||
}
|
||
loading.value = true
|
||
await api.registerPhone({ phone })
|
||
.then(res=>{
|
||
handleLogin()
|
||
})
|
||
.catch(res=>{
|
||
handleLogin()
|
||
})
|
||
}
|
||
|
||
async function handleLogin() {
|
||
const { phone } = loginInfo.value
|
||
loading.value = true
|
||
await api.loginPhone({ phone, password: phone.slice(5,11) }).catch(res=>{
|
||
setToken(res.error.access_token)
|
||
if (query.redirect) {
|
||
const path = query.redirect
|
||
console.log('path', { path, query })
|
||
Reflect.deleteProperty(query, 'redirect')
|
||
router.push({ path, query })
|
||
} else {
|
||
router.push('/')
|
||
}
|
||
loading.value = false
|
||
})
|
||
|
||
}
|
||
</script>
|