Browse Source

HL-5241在长春和成都的登录页面各放一个PDA端APK程序下载的二维码

hella_online_20240803
wangyufei 2 months ago
parent
commit
926488f0e7
  1. 17
      src/views/login/components/QRCodePDA.vue
  2. 3
      src/views/login/components/index.ts
  3. 7
      src/views/login/login.vue

17
src/views/login/components/QRCodePDA.vue

@ -0,0 +1,17 @@
<template>
<div style="position: absolute; bottom: 50px;right:0;display: flex; flex-direction: column;align-items: flex-end;">
<div style="position: relative;" v-show="showCode">
<Icon icon="ep:close" style="position: absolute;right: 5px;top: 5px" @click="handleClose"/>
<img alt="" style="margin-bottom: 10px;" width="120" height="120"/>
</div>
<el-button type="primary" link @click="handleClose">PDA按照程序下载链接</el-button>
</div>
</template>
<script setup lang="ts">
const showCode = ref(false)
const handleClose = ()=>{
showCode.value = !showCode.value
}
</script>
<style lang="scss" scoped></style>

3
src/views/login/components/index.ts

@ -4,5 +4,6 @@ import LoginFormTitle from './LoginFormTitle.vue'
import RegisterForm from './RegisterForm.vue' import RegisterForm from './RegisterForm.vue'
import QrCodeForm from './QrCodeForm.vue' import QrCodeForm from './QrCodeForm.vue'
import SSOLoginVue from './SSOLogin.vue' import SSOLoginVue from './SSOLogin.vue'
import QRCodePDA from './QRCodePDA.vue'
export { LoginForm, MobileForm, LoginFormTitle, RegisterForm, QrCodeForm, SSOLoginVue } export { LoginForm, MobileForm, LoginFormTitle, RegisterForm, QrCodeForm, SSOLoginVue,QRCodePDA }

7
src/views/login/login.vue

@ -43,7 +43,7 @@
</div> </div>
<!-- 右边的登录界面 --> <!-- 右边的登录界面 -->
<Transition appear enter-active-class="animate__animated animate__bounceInRight"> <Transition appear enter-active-class="animate__animated animate__bounceInRight">
<div <div style="position: relative"
class="m-auto h-full 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-full 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"
> >
<!-- 账号登录 --> <!-- 账号登录 -->
@ -56,7 +56,10 @@
<RegisterForm class="m-auto h-auto p-20px lt-xl:(rounded-3xl light:bg-white)" /> <RegisterForm class="m-auto h-auto p-20px lt-xl:(rounded-3xl light:bg-white)" />
<!-- 三方登录 --> <!-- 三方登录 -->
<SSOLoginVue class="m-auto h-auto p-20px lt-xl:(rounded-3xl light:bg-white)" /> <SSOLoginVue class="m-auto h-auto p-20px lt-xl:(rounded-3xl light:bg-white)" />
<!-- PDA端APK程序下载的二维码 -->
<!-- <QRCodePDA class="m-auto h-auto p-20px lt-xl:(rounded-3xl light:bg-white)"/> -->
</div> </div>
</Transition> </Transition>
</div> </div>
</div> </div>
@ -70,7 +73,7 @@ import { useAppStore } from '@/store/modules/app'
import { ThemeSwitch } from '@/layout/components/ThemeSwitch' import { ThemeSwitch } from '@/layout/components/ThemeSwitch'
import { LocaleDropdown } from '@/layout/components/LocaleDropdown' import { LocaleDropdown } from '@/layout/components/LocaleDropdown'
import { LoginForm, MobileForm, QrCodeForm, RegisterForm, SSOLoginVue } from './components' import { LoginForm, MobileForm, QrCodeForm, RegisterForm, SSOLoginVue,QRCodePDA } from './components'
defineOptions({ name: 'Login' }) defineOptions({ name: 'Login' })

Loading…
Cancel
Save