zianxin/Friendship-and-chat-pc
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

11

Browse Source
This commit is contained in:
yangmf_0726 committed 2025-09-26 14:04:47 +08:00
1 parent 08ac9db5eb
commit b5ef61a601
2 files changed
+26 -75
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/views/Login/SocialLogin.vue
+22 -71
View File
@@ -1,12 +1,8 @@
<template>
<div
:class="prefixCls"
class="relative h-[100%] lt-md:px-10px lt-sm:px-10px lt-xl:px-10px lt-xl:px-10px"
>
<div :class="prefixCls" class="relative h-[100%] lt-md:px-10px lt-sm:px-10px lt-xl:px-10px lt-xl:px-10px">
<div class="relative mx-auto h-full flex">
<div
:class="`${prefixCls}__left flex-1 bg-gray-500 bg-opacity-20 relative p-30px lt-xl:hidden overflow-x-hidden overflow-y-auto`"
>
:class="`${prefixCls}__left flex-1 bg-gray-500 bg-opacity-20 relative p-30px lt-xl:hidden overflow-x-hidden overflow-y-auto`">
<!-- 左上角的 logo + 系统标题 -->
<div class="relative flex items-center text-white">
<img alt="" class="mr-10px h-48px w-48px" src="@/assets/imgs/logo.png" />
@@ -14,11 +10,7 @@
</div>
<!-- 左边的背景图 + 欢迎语 -->
<div class="h-[calc(100%-60px)] flex items-center justify-center">
<TransitionGroup
appear
enter-active-class="animate__animated animate__bounceInLeft"
tag="div"
>
<TransitionGroup appear enter-active-class="animate__animated animate__bounceInLeft" tag="div">
<img key="1" alt="" class="w-350px" src="@/assets/svgs/login-box-bg.svg" />
<div key="2" class="text-3xl text-white">{{ t('login.welcome') }}</div>
<div key="3" class="mt-5 text-14px font-normal text-white">
@@ -28,12 +20,9 @@
</div>
</div>
<div
class="relative flex-1 p-30px dark:bg-[var(--login-bg-color)] lt-sm:p-10px overflow-x-hidden overflow-y-auto"
>
class="relative flex-1 p-30px dark:bg-[var(--login-bg-color)] lt-sm:p-10px overflow-x-hidden overflow-y-auto">
<!-- 右上角的主题、语言选择 -->
<div
class="flex items-center justify-between text-white at-2xl:justify-end at-xl:justify-end"
>
<div class="flex items-center justify-between text-white at-2xl:justify-end at-xl:justify-end">
<div class="flex items-center at-2xl:hidden at-xl:hidden">
<img alt="" class="mr-10px h-48px w-48px" src="@/assets/imgs/logo.png" />
<span class="text-20px font-bold">{{ underlineToHump(appStore.getTitle) }}</span>
@@ -46,19 +35,10 @@
<!-- 右边的登录界面 -->
<Transition appear enter-active-class="animate__animated animate__bounceInRight">
<div
class="m-auto h-[calc(100%-60px)] w-[100%] flex items-center at-2xl:max-w-500px at-lg:max-w-500px at-md:max-w-500px at-xl:max-w-500px"
>
class="m-auto h-[calc(100%-60px)] w-[100%] flex items-center at-2xl:max-w-500px at-lg:max-w-500px at-md:max-w-500px at-xl:max-w-500px">
<!-- 账号登录 -->
<el-form
v-show="getShow"
ref="formLogin"
:model="loginData.loginForm"
:rules="LoginRules"
class="login-form"
label-position="top"
label-width="120px"
size="large"
>
<el-form v-show="getShow" ref="formLogin" :model="loginData.loginForm" :rules="LoginRules"
class="login-form" label-position="top" label-width="120px" size="large">
<el-row style="margin-right: -10px; margin-left: -10px">
<el-col :span="24" style="padding-right: 10px; padding-left: 10px">
<el-form-item>
@@ -67,45 +47,28 @@
</el-col>
<el-col :span="24" style="padding-right: 10px; padding-left: 10px">
<el-form-item v-if="loginData.tenantEnable" prop="tenantName">
<el-input
v-model="loginData.loginForm.tenantName"
:placeholder="t('login.tenantNamePlaceholder')"
:prefix-icon="iconHouse"
link
type="primary"
/>
<el-input v-model="loginData.loginForm.tenantName" :placeholder="t('login.tenantNamePlaceholder')"
:prefix-icon="iconHouse" link type="primary" />
</el-form-item>
</el-col>
<el-col :span="24" style="padding-right: 10px; padding-left: 10px">
<el-form-item prop="username">
<el-input
v-model="loginData.loginForm.username"
:placeholder="t('login.usernamePlaceholder')"
:prefix-icon="iconAvatar"
/>
<el-input v-model="loginData.loginForm.username" :placeholder="t('login.usernamePlaceholder')"
:prefix-icon="iconAvatar" />
</el-form-item>
</el-col>
<el-col :span="24" style="padding-right: 10px; padding-left: 10px">
<el-form-item prop="password">
<el-input
v-model="loginData.loginForm.password"
:placeholder="t('login.passwordPlaceholder')"
:prefix-icon="iconLock"
show-password
type="password"
@keyup.enter="getCode()"
/>
<el-input v-model="loginData.loginForm.password" :placeholder="t('login.passwordPlaceholder')"
:prefix-icon="iconLock" show-password type="password" @keyup.enter="getCode()" />
</el-form-item>
</el-col>
<el-col
:span="24"
style="
<el-col :span="24" style="
padding-right: 10px;
padding-left: 10px;
margin-top: -20px;
margin-bottom: -20px;
"
>
">
<el-form-item>
<el-row justify="space-between" style="width: 100%">
<el-col :span="6">
@@ -114,8 +77,7 @@
</el-checkbox>
</el-col>
<el-col :offset="6" :span="12">
<el-link style="float: right" type="primary"
>{{ t('login.forgetPassword') }}
<el-link style="float: right" type="primary">{{ t('login.forgetPassword') }}
</el-link>
</el-col>
</el-row>
@@ -123,23 +85,12 @@
</el-col>
<el-col :span="24" style="padding-right: 10px; padding-left: 10px">
<el-form-item>
<XButton
:loading="loginLoading"
:title="t('login.login')"
class="w-[100%]"
type="primary"
@click="getCode()"
/>
<XButton :loading="loginLoading" :title="t('login.login')" class="w-[100%]" type="primary"
@click="getCode()" />
</el-form-item>
</el-col>
<Verify
v-if="loginData.captchaEnable === 'true'"
ref="verify"
:captchaType="captchaType"
:imgSize="{ width: '400px', height: '200px' }"
mode="pop"
@success="handleLogin"
/>
<Verify v-if="loginData.captchaEnable === 'true'" ref="verify" :captchaType="captchaType"
:imgSize="{ width: '400px', height: '200px' }" mode="pop" @success="handleLogin" />
</el-row>
</el-form>
</div>
@@ -258,7 +209,7 @@ const tryLogin = async () => {
authUtil.setToken(res)
router.push({ path: redirect || '/' })
} catch (err) {}
} catch (err) { }
}
// 登录
src/views/Login/components/LoginForm.vue
+4 -4
View File
@@ -47,9 +47,9 @@
@click="getCode()" />
</el-form-item>
</el-col>
<!-- <Verify v-if="loginData.captchaEnable === 'true'" ref="verify" :captchaType="captchaType"
<Verify v-if="loginData.captchaEnable === 'true'" ref="verify" :captchaType="captchaType"
:imgSize="{ width: '400px', height: '200px' }" mode="pop" @success="handleLogin" />
<el-col :span="24" style="padding-right: 10px; padding-left: 10px">
<!-- <el-col :span="24" style="padding-right: 10px; padding-left: 10px">
<el-form-item>
<el-row :gutter="5" justify="space-between" style="width: 100%">
<el-col :span="8">
@@ -64,8 +64,8 @@
</el-col>
</el-row>
</el-form-item>
</el-col>
<el-divider content-position="center">{{ t('login.otherLogin') }}</el-divider>
</el-col> -->
<!-- <el-divider content-position="center">{{ t('login.otherLogin') }}</el-divider>
<el-col :span="24" style="padding-right: 10px; padding-left: 10px">
<el-form-item>
<div class="w-[100%] flex justify-between">