Skip to content

Commit 8cf279f

Browse files
yugasunPanJiaChen
authored andcommitted
perf[Login Form]: optimize eye icon style (#1545)
* optimiz: eye icon style for login form * change eye-open svg
1 parent ac8eddf commit 8cf279f

File tree

2 files changed

+18
-11
lines changed

2 files changed

+18
-11
lines changed

src/icons/svg/eye-open.svg

+1
Loading

src/views/login/index.vue

+17-11
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
<template>
22
<div class="login-container">
3-
43
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form" auto-complete="on" label-position="left">
5-
64
<div class="title-container">
7-
<h3 class="title">{{ $t('login.title') }}</h3>
8-
<lang-select class="set-language"/>
5+
<h3 class="title">
6+
{{ $t('login.title') }}
7+
</h3>
8+
<lang-select class="set-language" />
99
</div>
1010

1111
<el-form-item prop="username">
@@ -26,30 +26,37 @@
2626
<svg-icon icon-class="password" />
2727
</span>
2828
<el-input
29-
:type="passwordType"
3029
v-model="loginForm.password"
30+
:type="passwordType"
3131
:placeholder="$t('login.password')"
3232
name="password"
3333
auto-complete="on"
34-
@keyup.enter.native="handleLogin" />
34+
@keyup.enter.native="handleLogin"
35+
/>
3536
<span class="show-pwd" @click="showPwd">
36-
<svg-icon icon-class="eye" />
37+
<svg-icon :icon-class="passwordType === 'password' ? 'eye' : 'eye-open'" />
3738
</span>
3839
</el-form-item>
3940

40-
<el-button :loading="loading" type="primary" style="width:100%;margin-bottom:30px;" @click.native.prevent="handleLogin">{{ $t('login.logIn') }}</el-button>
41+
<el-button :loading="loading" type="primary" style="width:100%;margin-bottom:30px;" @click.native.prevent="handleLogin">
42+
{{ $t('login.logIn') }}
43+
</el-button>
4144

4245
<div style="position:relative">
4346
<div class="tips">
4447
<span>{{ $t('login.username') }} : admin</span>
4548
<span>{{ $t('login.password') }} : {{ $t('login.any') }}</span>
4649
</div>
4750
<div class="tips">
48-
<span style="margin-right:18px;">{{ $t('login.username') }} : editor</span>
51+
<span style="margin-right:18px;">
52+
{{ $t('login.username') }} : editor
53+
</span>
4954
<span>{{ $t('login.password') }} : {{ $t('login.any') }}</span>
5055
</div>
5156

52-
<el-button class="thirdparty-button" type="primary" @click="showDialog=true">{{ $t('login.thirdparty') }}</el-button>
57+
<el-button class="thirdparty-button" type="primary" @click="showDialog=true">
58+
{{ $t('login.thirdparty') }}
59+
</el-button>
5360
</div>
5461
</el-form>
5562

@@ -60,7 +67,6 @@
6067
<br>
6168
<social-sign />
6269
</el-dialog>
63-
6470
</div>
6571
</template>
6672

0 commit comments

Comments
 (0)