mirror of
https://github.com/pure-admin/vue-pure-admin.git
synced 2025-06-30 09:24:46 +08:00
refactor: login page
This commit is contained in:
xiaoxian521
parent
544e474e98
commit
aa7a073b4a
Binary file not shown.
|
Before Width: | Height: | Size: 5.6 KiB After Width: | Height: | Size: 1.2 KiB |
@ -1,8 +1,8 @@
|
||||
@font-face {
|
||||
font-family: "iconfont"; /* Project id 2208059 */
|
||||
src: url("iconfont.woff2?t=1634903299890") format("woff2"),
|
||||
url("iconfont.woff?t=1634903299890") format("woff"),
|
||||
url("iconfont.ttf?t=1634903299890") format("truetype");
|
||||
src: url("iconfont.woff2?t=1636197082361") format("woff2"),
|
||||
url("iconfont.woff?t=1636197082361") format("woff"),
|
||||
url("iconfont.ttf?t=1636197082361") format("truetype");
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
@ -13,24 +13,8 @@
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.team-iconshuifei::before {
|
||||
content: "\e62d";
|
||||
}
|
||||
|
||||
.team-iconshuiyuandi::before {
|
||||
content: "\e64e";
|
||||
}
|
||||
|
||||
.team-iconshuifei1::before {
|
||||
content: "\e616";
|
||||
}
|
||||
|
||||
.team-iconshui::before {
|
||||
content: "\e61f";
|
||||
}
|
||||
|
||||
.team-iconzuixinlianzai::before {
|
||||
content: "\e6da";
|
||||
.team-iconlogo::before {
|
||||
content: "\e620";
|
||||
}
|
||||
|
||||
.team-iconxinpin::before {
|
||||
@ -41,22 +25,6 @@
|
||||
content: "\e615";
|
||||
}
|
||||
|
||||
.team-iconinternationality::before {
|
||||
content: "\e67a";
|
||||
}
|
||||
|
||||
.team-iconshanchu::before {
|
||||
content: "\e617";
|
||||
}
|
||||
|
||||
.team-iconshow-main-container::before {
|
||||
content: "\e878";
|
||||
}
|
||||
|
||||
.team-iconhidden-main-container::before {
|
||||
content: "\e881";
|
||||
}
|
||||
|
||||
.team-iconexit-fullscreen::before {
|
||||
content: "\e62a";
|
||||
}
|
||||
|
||||
File diff suppressed because one or more lines are too long
@ -6,39 +6,11 @@
|
||||
"description": "pure-admin",
|
||||
"glyphs": [
|
||||
{
|
||||
"icon_id": "1715043",
|
||||
"name": "水费",
|
||||
"font_class": "shuifei",
|
||||
"unicode": "e62d",
|
||||
"unicode_decimal": 58925
|
||||
},
|
||||
{
|
||||
"icon_id": "7873366",
|
||||
"name": "水源地",
|
||||
"font_class": "shuiyuandi",
|
||||
"unicode": "e64e",
|
||||
"unicode_decimal": 58958
|
||||
},
|
||||
{
|
||||
"icon_id": "12257150",
|
||||
"name": "水费",
|
||||
"font_class": "shuifei1",
|
||||
"unicode": "e616",
|
||||
"unicode_decimal": 58902
|
||||
},
|
||||
{
|
||||
"icon_id": "24810949",
|
||||
"name": "水",
|
||||
"font_class": "shui",
|
||||
"unicode": "e61f",
|
||||
"unicode_decimal": 58911
|
||||
},
|
||||
{
|
||||
"icon_id": "2508809",
|
||||
"name": "最新连载",
|
||||
"font_class": "zuixinlianzai",
|
||||
"unicode": "e6da",
|
||||
"unicode_decimal": 59098
|
||||
"icon_id": "22129506",
|
||||
"name": "水能",
|
||||
"font_class": "logo",
|
||||
"unicode": "e620",
|
||||
"unicode_decimal": 58912
|
||||
},
|
||||
{
|
||||
"icon_id": "7795613",
|
||||
@ -54,34 +26,6 @@
|
||||
"unicode": "e615",
|
||||
"unicode_decimal": 58901
|
||||
},
|
||||
{
|
||||
"icon_id": "18367956",
|
||||
"name": "中英文2 中文",
|
||||
"font_class": "internationality",
|
||||
"unicode": "e67a",
|
||||
"unicode_decimal": 59002
|
||||
},
|
||||
{
|
||||
"icon_id": "6184565",
|
||||
"name": "删除",
|
||||
"font_class": "shanchu",
|
||||
"unicode": "e617",
|
||||
"unicode_decimal": 58903
|
||||
},
|
||||
{
|
||||
"icon_id": "9626913",
|
||||
"name": "全屏",
|
||||
"font_class": "show-main-container",
|
||||
"unicode": "e878",
|
||||
"unicode_decimal": 59512
|
||||
},
|
||||
{
|
||||
"icon_id": "9626952",
|
||||
"name": "退出全屏",
|
||||
"font_class": "hidden-main-container",
|
||||
"unicode": "e881",
|
||||
"unicode_decimal": 59521
|
||||
},
|
||||
{
|
||||
"icon_id": "5698509",
|
||||
"name": "全屏缩小",
|
||||
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
1
src/assets/login/avatar.svg
Normal file
1
src/assets/login/avatar.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg t="1636193306629" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1847" width="32" height="32"><path d="M410.558481 0.10861C410.558481 211.083075 109.682285 361.860579 109.682285 633.656511c0 174.943176 134.703259 316.787527 300.876196 316.787527s300.876197-141.817198 300.876197-316.787527C711.407525 361.751969 410.558481 210.974465 410.558481 0.10861z" fill="#386BF3" p-id="1848"></path><path d="M613.468671 73.664572c0 211.055922-300.876197 361.914883-300.876196 633.547901 0 174.943176 134.703259 316.787527 300.876196 316.787527s300.876197-141.817198 300.876197-316.787527c-0.054305-271.633018-300.876197-422.491979-300.876197-633.547901z" fill="#C3D2FB" p-id="1849"></path><path d="M312.592475 707.212473c0-183.713414 137.635722-312.171612 226.72288-441.390078 81.701694 106.111739 172.119322 218.740063 172.119323 367.725506a309.755045 309.755045 0 0 1-291.074166 316.516003 323.114046 323.114046 0 0 1-107.768037-242.851431z" fill="#303F5B" p-id="1850"></path></svg>
|
||||
|
After Width: | Height: | Size: 1.0 KiB |
BIN
src/assets/login/bg.png
Normal file
BIN
src/assets/login/bg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
1
src/assets/login/illustration0.svg
Normal file
1
src/assets/login/illustration0.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 20 KiB |
1
src/assets/login/illustration1.svg
Normal file
1
src/assets/login/illustration1.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 17 KiB |
1
src/assets/login/illustration2.svg
Normal file
1
src/assets/login/illustration2.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" width="896" height="529.1129" viewBox="0 0 896 529.1129" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M832.06729,623.22778s-26.37759,9.89441-38.806,32.94348S787.06,706.69574,787.06,706.69574s26.37759-9.89447,38.806-32.94348S832.06729,623.22778,832.06729,623.22778Z" transform="translate(-158 -185.8871)" fill="#3f3d56"/><path d="M867.5,657.59637s-8.64182,26.814-31.0802,40.31373-50.17651,8.57293-50.17651,8.57293,8.64175-26.81408,31.08017-40.31378S867.5,657.59637,867.5,657.59637Z" transform="translate(-158 -185.8871)" fill="#5392f0"/><rect y="527.1129" width="896" height="2" fill="#2f2e41"/><path d="M519.87238,620.97461a95.44448,95.44448,0,0,1-35.748-14.44629L485.306,604.915a93.36283,93.36283,0,0,0,34.999,14.10547c18.93164,3.40137,47.26075,1.73144,74.707-25.52735,53.41358-53.04785,104.39307-58.39062,104.90186-58.43847l.18652,1.99219c-.50146.04687-50.76806,5.31738-103.67822,57.86621-21.61328,21.46386-43.792,27.40234-61.71777,27.40234A83.49962,83.49962,0,0,1,519.87238,620.97461Z" transform="translate(-158 -185.8871)" fill="#2f2e41"/><circle cx="515.15271" cy="381.1129" r="12" fill="#2f2e41"/><circle cx="430.15271" cy="437.1129" r="12" fill="#2f2e41"/><path d="M841.5,714s-17.46191-5.41315-52.26129-10.84192L790,692.5c6-60-34-150-34-150a401.561,401.561,0,0,1,21.4693,139.0246C772.13214,672.2124,761.82056,662.16638,742,656c0,0,25.77765,22.106,33.15918,45.10175a997.84042,997.84042,0,0,0-102.02258-8.21589L682,672.5l-17,17s-7-51-22-53l11,50s-13-10-16-9l7.39746,14.79486c-49.819-.51654-109.08453,1.7356-177.76581,8.95227L476,682l-17,17s-7-51-22-53l11,50s-13-10-16-9l8.64288,17.28583Q406.9763,708.2897,370.5,714Z" transform="translate(-158 -185.8871)" fill="#3f3d56"/><path d="M565.64813,230.37817c-10.89964,11.74783,17.59745,40.25959,17.59745,40.25959s-57.70662,9.73051-53.12783,9.14083,2.20622-49.13151,2.20622-49.13151S576.54777,218.63035,565.64813,230.37817Z" transform="translate(-158 -185.8871)" fill="#a0616a"/><path d="M605.81236,356.10945l-50.139,25.6141-27.22969,15.6059s-32.09862,40.43116-38.08709,64.39234,25.92963,68.247,29.54371,72.82286a54.36088,54.36088,0,0,1,4.98908,7.42355c1.24727,1.85589,12.02944-.541,23.80342-3.06554S547.13,518.93875,547.13,518.93875s-15.02732-38.39505-16.14686-39.25912c-1.04554-.807-4.60093-7.44631-2.04309-10.35234a25.94993,25.94993,0,0,0,5.44489-8.89825,30.09064,30.09064,0,0,1,4.18709-7.94151s45.361-36.83645,59.52776-49.37835,51.82952-4.65839,51.82952-4.65839-17.78167,68.20027-22.22979,72.80616-4.929,8.70085-2.91535,16.50759,28.28157.39078,28.28157.39078L662.766,461.6996s15.74879-34.2925,24.29946-69.67451c4.27533-17.691-3.88828-28.23462-13.12073-34.35549a41.39094,41.39094,0,0,0-30.02983-5.97766l-46.34848,8.1308,32.14706-13.84923Z" transform="translate(-158 -185.8871)" fill="#2f2e41"/><path d="M420.87777,290.19133,361.02366,271.685s-24.179-31.16689-12.78824-36.6669,25.65172,26.94419,25.65172,26.94419l41.686,2.69751Z" transform="translate(-158 -185.8871)" fill="#a0616a"/><path d="M672.49431,257.78673l53.2121-33.06768s15.49333-36.27612,3.0807-38.71059-17.98787,32.56435-17.98787,32.56435l-39.64232,13.17143Z" transform="translate(-158 -185.8871)" fill="#a0616a"/><path d="M682.45318,220.40023l1.01427,39.19147-89.68779,16.025c13.19231,28.22441,9.84118,60.34675,43.04725,74.4259L524.9027,404.78717c4.9871-43.03806-15.81748-75.456-35.263-115.75876-23.68547-8.58589-51.19594-2.29078-80.33649,10.34619l-5.237-40.66416,123.87841-8.896,20.34848,7.77932,21.81842-9.17677C602.17891,238.88953,648.22076,220.77584,682.45318,220.40023Z" transform="translate(-158 -185.8871)" fill="#5392f0"/><path d="M626.64006,486.51727c-2.72,2.36681-5.25213,21.84984-5.34982,28.92023s9.21178,8.89624,14.29855,9.2494,4.47816,3.45631,7.83678,6.04854,14.39625,2.179,28.89019-2.71238-9.75274-20.92568-11.86409-21.662-11-22.78156-11-22.78156S629.36,484.15046,626.64006,486.51727Z" transform="translate(-158 -185.8871)" fill="#2f2e41"/><path d="M547.368,531.00717c3.23089,1.60043,10.61681,19.80614,12.50274,26.62107s-6.65716,10.93994-11.48848,12.5704-3.45631,4.47816-6.04855,7.83678-13.3744,5.75546-28.63472,4.696,4.13258-22.71391,5.98847-23.96118,4.86893-24.82526,4.86893-24.82526S544.13715,529.40674,547.368,531.00717Z" transform="translate(-158 -185.8871)" fill="#2f2e41"/><circle cx="389.47074" cy="35.42904" r="23.99585" fill="#a0616a"/><path d="M519.73448,218.90923a22.82668,22.82668,0,0,1-.83378-18.59281c2.35891-5.8153,7.59174-11.65569,18.87309-13.4,24.61387-3.80572,37.71267,13.43543,37.02452,19.07449s-3.99294,19.27051-3.99294,19.27051,1.47587-12.90619-4.85883-13.362-30.90178-2.37835-37.12217,4.145a14.23268,14.23268,0,0,0-3.71042,13.82977Z" transform="translate(-158 -185.8871)" fill="#2f2e41"/></svg>
|
||||
|
After Width: | Height: | Size: 4.6 KiB |
1
src/assets/login/illustration3.svg
Normal file
1
src/assets/login/illustration3.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 11 KiB |
1
src/assets/login/illustration4.svg
Normal file
1
src/assets/login/illustration4.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 12 KiB |
1
src/assets/login/illustration5.svg
Normal file
1
src/assets/login/illustration5.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 29 KiB |
1
src/assets/login/illustration6.svg
Normal file
1
src/assets/login/illustration6.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 11 KiB |
@ -118,7 +118,7 @@ onMounted(() => {
|
||||
<template>
|
||||
<div class="horizontal-header">
|
||||
<div class="horizontal-header-left" @click="backHome">
|
||||
<Icon svg :width="35" :height="35" content="team-iconshuiyuandi" />
|
||||
<Icon svg :width="35" :height="35" content="team-iconlogo" />
|
||||
<h4>{{ title }}</h4>
|
||||
</div>
|
||||
<el-menu
|
||||
|
||||
@ -19,7 +19,7 @@ const title =
|
||||
class="sidebar-logo-link"
|
||||
to="/"
|
||||
>
|
||||
<Icon svg :width="35" :height="35" content="team-iconshuiyuandi" />
|
||||
<Icon svg :width="35" :height="35" content="team-iconlogo" />
|
||||
<span class="sidebar-title">{{ title }}</span>
|
||||
</router-link>
|
||||
<router-link
|
||||
@ -29,7 +29,7 @@ const title =
|
||||
class="sidebar-logo-link"
|
||||
to="/"
|
||||
>
|
||||
<Icon svg :width="35" :height="35" content="team-iconshuiyuandi" />
|
||||
<Icon svg :width="35" :height="35" content="team-iconlogo" />
|
||||
<span class="sidebar-title">{{ title }}</span>
|
||||
</router-link>
|
||||
</transition>
|
||||
|
||||
221
src/style/login.css
Normal file
221
src/style/login.css
Normal file
@ -0,0 +1,221 @@
|
||||
.wave {
|
||||
position: fixed;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.container {
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
grid-gap: 18rem;
|
||||
padding: 0 2rem;
|
||||
}
|
||||
|
||||
.img {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.img img {
|
||||
width: 500px;
|
||||
}
|
||||
|
||||
.login-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.login-form {
|
||||
width: 360px;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.login-form h2 {
|
||||
font-size: 2.9rem;
|
||||
text-transform: uppercase;
|
||||
margin: 15px 0;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.input-group {
|
||||
position: relative;
|
||||
display: grid;
|
||||
grid-template-columns: 7% 93%;
|
||||
margin: 25px 0;
|
||||
padding: 5px 0;
|
||||
border-bottom: 2px solid #d9d9d9;
|
||||
}
|
||||
|
||||
.input-group:nth-child(1) {
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.input-group::before,
|
||||
.input-group::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: -2px;
|
||||
width: 0;
|
||||
height: 2px;
|
||||
background-color: #c5d3f7;
|
||||
transition: 0.5s;
|
||||
}
|
||||
|
||||
.input-group::after {
|
||||
right: 50%;
|
||||
}
|
||||
|
||||
.input-group::before {
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
.icon {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.icon i {
|
||||
color: #d9d9d9;
|
||||
transition: 0.5s;
|
||||
}
|
||||
|
||||
.input-group > div {
|
||||
position: relative;
|
||||
height: 45px;
|
||||
}
|
||||
|
||||
.input-group > div > h5 {
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
color: #d9d9d9;
|
||||
font-size: 18px;
|
||||
transition: 0.3s;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.input-group.focus .icon i {
|
||||
color: #5392f0;
|
||||
}
|
||||
|
||||
.input-group.focus div h5 {
|
||||
top: -5px;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.input-group.focus::after,
|
||||
.input-group.focus::before {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.input {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
border: none;
|
||||
outline: none;
|
||||
background: none;
|
||||
padding: 0.5rem 0.7rem;
|
||||
font-size: 1.2rem;
|
||||
color: #555;
|
||||
font-family: "Roboto", sans-serif;
|
||||
}
|
||||
|
||||
a {
|
||||
display: block;
|
||||
text-align: right;
|
||||
text-decoration: none;
|
||||
color: #999;
|
||||
font-size: 0.9rem;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: #5392f0;
|
||||
}
|
||||
|
||||
.btn {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
border-radius: 25px;
|
||||
margin: 1rem 0;
|
||||
font-size: 1.2rem;
|
||||
outline: none;
|
||||
border: none;
|
||||
background-image: linear-gradient(to right, #567dbe, #5392f0, #567dbe);
|
||||
cursor: pointer;
|
||||
color: #fff;
|
||||
text-transform: uppercase;
|
||||
font-family: "Roboto", sans-serif;
|
||||
background-size: 200%;
|
||||
transition: 0.5s;
|
||||
}
|
||||
|
||||
.btn:hover {
|
||||
background-position: right;
|
||||
}
|
||||
|
||||
.copyright {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
bottom: 2px;
|
||||
color: #5392f0;
|
||||
text-align: center;
|
||||
font-size: 18px;
|
||||
font-family: "Roboto", sans-serif;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1080px) {
|
||||
.container {
|
||||
grid-gap: 9rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1024px) {
|
||||
.login-form {
|
||||
width: 290px;
|
||||
}
|
||||
|
||||
.login-form h2 {
|
||||
font-size: 2.4rem;
|
||||
margin: 8px 0;
|
||||
}
|
||||
|
||||
.img img {
|
||||
width: 360px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.wave {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.img {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.container {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.login-box {
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,93 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, ref } from "vue";
|
||||
import { useRouter } from "vue-router";
|
||||
import { initRouter } from "/@/router";
|
||||
import { storageSession } from "/@/utils/storage";
|
||||
import { addClass, removeClass } from "/@/utils/operate";
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
const currentWeek = new Date().getDay();
|
||||
|
||||
let illustration = computed(() => {
|
||||
return `/@/assets/login/illustration${currentWeek}.svg`;
|
||||
});
|
||||
|
||||
let user = ref("admin");
|
||||
let pwd = ref("123456");
|
||||
|
||||
const onLogin = (): void => {
|
||||
storageSession.setItem("info", {
|
||||
username: "admin",
|
||||
accessToken: "eyJhbGciOiJIUzUxMiJ9.test"
|
||||
});
|
||||
initRouter("admin").then(() => {});
|
||||
router.push("/");
|
||||
};
|
||||
|
||||
function onUserFocus() {
|
||||
addClass(document.querySelector(".user"), "focus");
|
||||
}
|
||||
|
||||
function onUserBlur() {
|
||||
if (user.value.length === 0)
|
||||
removeClass(document.querySelector(".user"), "focus");
|
||||
}
|
||||
|
||||
function onPwdFocus() {
|
||||
addClass(document.querySelector(".pwd"), "focus");
|
||||
}
|
||||
|
||||
function onPwdBlur() {
|
||||
if (pwd.value.length === 0)
|
||||
removeClass(document.querySelector(".pwd"), "focus");
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<img src="/@/assets/login/bg.png" class="wave" />
|
||||
<div class="container">
|
||||
<div class="img"><img :src="illustration" /></div>
|
||||
<div class="login-box">
|
||||
<div class="login-form">
|
||||
<img src="/@/assets/login/avatar.svg" class="avatar" />
|
||||
<h2>Pure Admin</h2>
|
||||
<div class="input-group user focus">
|
||||
<div class="icon">
|
||||
<i class="fa fa-user"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h5>用户名</h5>
|
||||
<input
|
||||
type="text"
|
||||
class="input"
|
||||
v-model="user"
|
||||
@focus="onUserFocus"
|
||||
@blur="onUserBlur"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="input-group pwd focus">
|
||||
<div class="icon">
|
||||
<i class="fa fa-lock"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h5>密码</h5>
|
||||
<input
|
||||
type="password"
|
||||
class="input"
|
||||
v-model="pwd"
|
||||
@focus="onPwdFocus"
|
||||
@blur="onPwdBlur"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn" @click="onLogin">登录</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
@import url("/@/style/login.css");
|
||||
</style>
|
||||
Loading…
x
Reference in New Issue
Block a user