Skip to content

Commit 29dbacd

Browse files
fluteflute
committed
login page style
1 parent db2746c commit 29dbacd

File tree

9 files changed

+100
-30
lines changed

9 files changed

+100
-30
lines changed

‎build/webpack.base.conf.js

+16-4
Original file line numberDiff line numberDiff line change
@@ -42,11 +42,23 @@ module.exports = {
4242
},
4343
{
4444
test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
45-
loader: 'url-loader',
46-
options: {
47-
limit: 10000,
45+
//loader: 'url-loader',
46+
loaders: [
47+
{
48+
loader: path.resolve(__dirname, 'cssPathResolver')
49+
},
50+
{
51+
loader: 'url-loader',
52+
query: {
53+
limit: 10000,
54+
name: utils.assetsPath('img/[name].[hash:7].[ext]'),
55+
}
56+
}
57+
]
58+
/*options: {
59+
limit: 30000,
4860
name: utils.assetsPath('img/[name].[hash:7].[ext]')
49-
}
61+
}*/
5062
},
5163
{
5264
test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,

‎src/assets/background.png

221 KB
Loading

‎src/assets/formbg.png

8.85 KB
Loading

‎src/components/Client.vue

+1
Original file line numberDiff line numberDiff line change
@@ -360,6 +360,7 @@ export default {
360360
this.clients = this.clientArr
361361
this.search = ''
362362
this.daterange = null
363+
this.pageCurrent = 1
363364
}
364365
},
365366
computed:{

‎src/components/Login.vue

+78-24
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,15 @@
11
<template>
22
<div class="login" v-show="isShowLogin">
33
<div class="login-box">
4+
<p class="login-title">好氛围管理中心</p>
5+
<div class="login-form">
6+
<p class="account"><input placeholder="请输入账号" v-model="account"></p>
7+
<p class="pwd"><input placeholder="请输入密码" type="password" v-model="pwd"></p>
8+
<p class="submit"><button @click="login()">登陆</button></p>
9+
</div>
10+
</div>
11+
12+
<!-- <div class="login-box">
413
<h3>欢迎登陆运营管理平台</h3>
514
<div class="login-form">
615
<Input v-model="account" placeholder="请输入账号">
@@ -11,7 +20,7 @@
1120
</Input>
1221
<Button type="info" class="login-btn" @click="login()">登陆</Button>
1322
</div>
14-
</div>
23+
</div> -->
1524
</div>
1625
</template>
1726

@@ -62,41 +71,86 @@ export default {
6271
<style scope>
6372
.login{
6473
position: absolute;
65-
height: 100%;
74+
top: 0;
75+
left: 0;
6676
width: 100%;
77+
height: 100%;
6778
z-index: 10;
68-
background: #f8f8f9;
69-
display: flex;
70-
justify-content: center;
71-
align-items: center;
79+
background-image: url(../assets/background.png);
80+
background-repeat: no-repeat;
81+
background-size: cover;
82+
background-position: 50% 50%;
7283
}
7384
.login-box{
74-
width: 600px;
75-
height: 300px;
85+
position: relative;
86+
height: 464px;
87+
width: 520px;
7688
margin: 0 auto;
77-
background-color: #ffffff;
78-
border: 1px solid #dddee1;
79-
border-radius: 5px;
80-
padding: 30px 0;
89+
margin-top: 11%;
90+
background-image: url(../assets/formbg.png);
91+
background-repeat: no-repeat;
92+
background-size: cover;
93+
background-position: 50% 50%;
94+
}
95+
.login-title{
96+
position: absolute;
97+
width: 100%;
98+
text-align: center;
99+
top: 160px;
100+
font-size: 24px;
101+
color: #2d8cf0;
81102
}
82103
.login-form{
83-
width: 300px;
84-
margin: 0 auto;
104+
position: absolute;
105+
display: inline-block;
106+
width: 100%;
107+
left: 0;
108+
top: 222px;
109+
}
110+
.login-form p{
111+
text-align: center;
85112
}
86-
.login-box h3{
87-
height: 60px;
88-
line-height: 60px;
113+
.login-form p input{
114+
width: 358px;
115+
height: 48px;
116+
background: transparent;
117+
border: 0;
118+
padding-left: 60px;
89119
font-size: 16px;
120+
color: rgba(0,0,0,.65);
121+
outline: none;
122+
border: 1px solid transparent
123+
}
124+
.login-form p input:focus{
125+
border: 1px solid #2d8cf0
126+
}
127+
.login-form p.pwd{
128+
margin-top: 21px;
129+
}
130+
.login-form p.submit{
131+
margin-top: 30px;
132+
}
133+
.login-form p.submit button{
134+
width: 358px;
135+
height: 46px;
136+
border: 0;
137+
font-size: 24px;
138+
color: #ffffff;
139+
background-color: #2d8cf0;
140+
cursor: pointer;
141+
outline: none;
90142
}
91-
.ivu-input-wrapper{
92-
margin-bottom: 10px;
143+
.login-form p.submit button:hover{
144+
background-color: #3091f2;
145+
opacity: 0.8
93146
}
94-
.ivu-input-group-prepend{
95-
width: 50px;
147+
input:-webkit-autofill,
148+
textarea:-webkit-autofill,
149+
select:-webkit-autofill {
150+
-webkit-box-shadow: 0 0 0 1000px transparent inset;
96151
}
97-
.login-btn{
98-
margin-top: 50px;
99-
width: 100px;
152+
input[type=text]:focus, input[type=password]:focus, textarea:focus {
153+
-webkit-box-shadow: 0 0 0 1000px transparent inset;
100154
}
101155
</style>
102156

‎src/components/Role.vue

+1
Original file line numberDiff line numberDiff line change
@@ -261,6 +261,7 @@ export default {
261261
clearSearch(){
262262
this.roles = this.roleArr
263263
this.search = ''
264+
this.pageCurrent = 1
264265
}
265266
},
266267
computed:{

‎src/components/User.vue

+1
Original file line numberDiff line numberDiff line change
@@ -348,6 +348,7 @@ export default {
348348
this.users = this.userArr
349349
this.search = ''
350350
this.daterange = null
351+
this.pageCurrent = 1
351352
}
352353
},
353354
computed:{

‎src/components/Version.vue

+1
Original file line numberDiff line numberDiff line change
@@ -354,6 +354,7 @@ export default {
354354
clearSearch(){
355355
this.versions = this.versionArr
356356
this.search = ''
357+
this.pageCurrent = 1
357358
}
358359
},
359360
computed:{

‎src/main.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -34,8 +34,8 @@ router.afterEach((to, from, next) => {
3434

3535
const store = new Vuex.Store({
3636
state:{
37-
apiUrl: 'http://127.0.0.1:3000',
38-
//apiUrl: 'http://60.205.110.195:3600',
37+
//apiUrl: 'http://127.0.0.1:3000',
38+
apiUrl: 'http://60.205.110.195:3600',
3939
isShowLogin: true,
4040
userInfo: null,
4141
permissions: null,

0 commit comments

Comments
 (0)