描述:登录

This commit is contained in:
SelfRidicule 2024-04-08 09:06:28 +08:00
parent 5d730080aa
commit b821378355
4 changed files with 84 additions and 89 deletions

BIN
src/assets/logo-white.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

View File

@ -12,7 +12,7 @@
<!-- 1.0.0+ 版本 pro-layout 提供 API我们推荐使用这种方式进行 LOGO title 自定义 -->
<template v-slot:menuHeaderRender>
<div>
<img src="~@/assets/logo.png" style='width: 32px ; height: auto'>
<img src="~@/assets/logo-white.png" style='width: 32px ; height: auto'>
<h1>{{ title }}</h1>
</div>
</template>

View File

@ -1,29 +1,28 @@
<template>
<div id="userLayout" :class="['user-layout-wrapper', isMobile && 'mobile']">
<div class="container">
<div class="top">
<div class="header">
<a href="/">
<!-- <img src="~@/assets/logo.png" class="logo" alt="logo">-->
<img src="~@/assets/logo.png" class="logo" alt="logo">
<span class="title">园区管理系统</span>
</a>
<div id='userLayout' :class="['user-layout-wrapper', isMobile && 'mobile']">
<div class='container'>
<div class='top'>
<div class='header'>
<div class='logoView'>
<img src='~@/assets/logo.png' class='logo' alt='logo'>
<span class='title'>园区管理系统</span>
</div>
</div>
<div class="desc">
<div class='desc'>
</div>
</div>
<router-view />
<div class="footer">
<div class="links">
<a href="_self">帮助</a>
<a href="_self">隐私</a>
<a href="_self">条款</a>
<div class='footer'>
<div class='links'>
<a href='_self'>帮助</a>
<a href='_self'>隐私</a>
<a href='_self'>条款</a>
</div>
<div class="copyright">
<a target="_blank" href="https://beian.miit.gov.cn">浙ICP备2021888888号</a>
<div class='copyright'>
<a target='_blank' href='https://beian.miit.gov.cn'>浙ICP备2021888888号</a>
</div>
</div>
</div>
@ -36,62 +35,55 @@ import { deviceMixin } from '@/store/device-mixin'
export default {
name: 'UserLayout',
mixins: [deviceMixin],
mounted () {
mounted() {
document.body.classList.add('userLayout')
},
beforeDestroy () {
beforeDestroy() {
document.body.classList.remove('userLayout')
}
}
</script>
<style lang="less" scoped>
#userLayout.user-layout-wrapper {
height: 100%;
<style lang='less' scoped>
#userLayout.user-layout-wrapper {
height: 100%;
&.mobile {
.container {
.main {
max-width: 368px;
width: 98%;
}
&.mobile {
.container {
.main {
max-width: 368px;
width: 98%;
}
}
}
.container {
width: 100%;
min-height: 100%;
background: #f0f2f5 url(~@/assets/background.svg) no-repeat 50%;
background-size: 100%;
padding: 110px 0 144px;
position: relative;
.container {
width: 100%;
min-height: 100%;
background: #f0f2f5 url(~@/assets/background.svg) no-repeat 50%;
background-size: 100%;
padding: 110px 0 144px;
position: relative;
a {
text-decoration: none;
}
a {
text-decoration: none;
}
.top {
text-align: center;
.top {
text-align: center;
.header {
height: 44px;
line-height: 44px;
.header {
height: 44px;
line-height: 44px;
.badge {
position: absolute;
display: inline-block;
line-height: 1;
vertical-align: middle;
margin-left: -12px;
margin-top: -10px;
opacity: 0.8;
}
.logoView {
display: flex;
justify-content: center;
align-items: center;
.logo {
height: 44px;
vertical-align: top;
height: 34px;
margin-right: 16px;
border-style: none;
}
.title {
@ -99,48 +91,51 @@ export default {
color: rgba(0, 0, 0, .85);
font-family: Avenir, 'Helvetica Neue', Arial, Helvetica, sans-serif;
font-weight: 600;
position: relative;
top: 2px;
}
}
.desc {
font-size: 14px;
color: rgba(0, 0, 0, 0.45);
margin-top: 12px;
margin-bottom: 40px;
}
}
.main {
min-width: 260px;
width: 368px;
margin: 0 auto;
.desc {
font-size: 14px;
color: rgba(0, 0, 0, 0.45);
margin-top: 12px;
margin-bottom: 40px;
}
}
.footer {
position: absolute;
width: 100%;
bottom: 0;
padding: 0 16px;
margin: 48px 0 24px;
text-align: center;
.main {
min-width: 260px;
width: 368px;
margin: 0 auto;
}
.links {
margin-bottom: 8px;
font-size: 14px;
a {
color: rgba(0, 0, 0, 0.45);
transition: all 0.3s;
&:not(:last-child) {
margin-right: 40px;
}
.footer {
position: absolute;
width: 100%;
bottom: 0;
padding: 0 16px;
margin: 48px 0 24px;
text-align: center;
.links {
margin-bottom: 8px;
font-size: 14px;
a {
color: rgba(0, 0, 0, 0.45);
transition: all 0.3s;
&:not(:last-child) {
margin-right: 40px;
}
}
.copyright {
color: rgba(0, 0, 0, 0.45);
font-size: 14px;
}
}
.copyright {
color: rgba(0, 0, 0, 0.45);
font-size: 14px;
}
}
}
}
</style>

View File

@ -35,7 +35,7 @@
</a-input-password>
</a-form-item>
</a-tab-pane>
<a-tab-pane key="tab2" tab="手机号登录">
<a-tab-pane key="tab2" tab="手机号登录" v-if='false'>
<a-form-item>
<a-input
size="large"