Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
E
ElectricitySheep
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
黄媛媛
ElectricitySheep
Commits
f54cfca1
Commit
f54cfca1
authored
5 years ago
by
黄奎
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
页面修改
parent
92adce88
Show whitespace changes
Inline
Side-by-side
Showing
2 changed files
with
118 additions
and
84 deletions
+118
-84
Login.vue
src/components/Login.vue
+116
-83
main.js
src/main.js
+2
-1
No files found.
src/components/Login.vue
View file @
f54cfca1
<
style
>
*
{
*
{
margin
:
0
;
padding
:
0
;
}
.loginDiv
{
}
.loginDiv
{
width
:
100%
;
height
:
100%
;
background-image
:
url("../assets/img/loginBack.jpg")
;
...
...
@@ -11,8 +12,9 @@
background-size
:
cover
;
background-size
:
100%
100%
;
background-position
:
center
;
}
.loginOpacity
{
}
.loginOpacity
{
background-color
:
rgba
(
0
,
0
,
0
,
0.15
);
height
:
100%
;
width
:
100%
;
...
...
@@ -20,8 +22,9 @@
left
:
0
;
top
:
0
;
z-index
:
1
;
}
.loginDiv
.box-card
{
}
.loginDiv
.box-card
{
position
:
relative
;
border-radius
:
15px
;
z-index
:
99
;
...
...
@@ -35,38 +38,63 @@
background-position
:
center
;
background-size
:
100%
100%
;
background-image
:
url("../assets/img/loginBack.jpg")
;
}
[
flex
]
{
display
:
-webkit-box
;
display
:
-webkit-flex
;
display
:
-ms-flexbox
;
display
:
flex
}
[
flex
~=
"main:center"
]
{
-webkit-box-pack
:
center
;
-webkit-justify-content
:
center
;
-ms-flex-pack
:
center
;
justify-content
:
center
}
[
flex
~=
"cross:center"
]
{
-webkit-box-align
:
center
;
-webkit-align-items
:
center
;
-ms-flex-align
:
center
;
align-items
:
center
;}
.loginDiv
.logo
{
}
[
flex
]
{
display
:
-webkit-box
;
display
:
-webkit-flex
;
display
:
-ms-flexbox
;
display
:
flex
}
[
flex
~=
"main:center"
]
{
-webkit-box-pack
:
center
;
-webkit-justify-content
:
center
;
-ms-flex-pack
:
center
;
justify-content
:
center
}
[
flex
~=
"cross:center"
]
{
-webkit-box-align
:
center
;
-webkit-align-items
:
center
;
-ms-flex-align
:
center
;
align-items
:
center
;
}
.loginDiv
.logo
{
position
:
absolute
;
left
:
40px
;
top
:
40px
;
height
:
50px
;
}
.loginDiv
.login-form
{
}
.loginDiv
.login-form
{
padding
:
50px
45px
30px
;
height
:
480px
;
width
:
245px
;
float
:
right
;
background-color
:
#fff
;
}
.loginDiv
.form-title
{
}
.loginDiv
.form-title
{
font-size
:
26px
;
color
:
#1F4881
;
margin-bottom
:
40px
;
}
.loginDiv
.el-form-item--mini.el-form-item
,
.loginDiv
.el-form-item--small.el-form-item
{
}
.loginDiv
.el-form-item--mini.el-form-item
,
.loginDiv
.el-form-item--small.el-form-item
{
margin-bottom
:
18px
;
}
.loginDiv
.el-input
.el-input__inner
{
}
.loginDiv
.el-input
.el-input__inner
{
height
:
36px
;
border-radius
:
18px
;
background-color
:
#f7f5fb
;
border-color
:
#f7f5fb
;
}
.loginDiv
.el-input__inner
{
}
.loginDiv
.el-input__inner
{
-webkit-appearance
:
none
;
background-color
:
#FFF
;
background-image
:
none
;
...
...
@@ -81,18 +109,20 @@
line-height
:
40px
;
outline
:
0
;
padding
:
0
15px
;
-webkit-transition
:
border-color
.2s
cubic-bezier
(
.645
,
.045
,
.355
,
1
);
transition
:
border-color
.2s
cubic-bezier
(
.645
,
.045
,
.355
,
1
);
-webkit-transition
:
border-color
.2s
cubic-bezier
(
.645
,
.045
,
.355
,
1
);
transition
:
border-color
.2s
cubic-bezier
(
.645
,
.045
,
.355
,
1
);
width
:
100%
;
}
.register_box
{
}
.register_box
{
position
:
absolute
;
right
:
15%
;
bottom
:
35px
;
width
:
150px
;
font-size
:
14px
;
}
.register
{
font-size
:
14px
;
}
.register
{
display
:
inline-block
;
width
:
48%
;
height
:
15px
;
...
...
@@ -100,62 +130,53 @@
text-align
:
center
;
cursor
:
pointer
;
color
:
#4291ff
;
}
.login-btn
{
}
.login-btn
{
width
:
100%
;
border-radius
:
20px
;
height
:
38px
;
font-size
:
16px
;
background
:
linear-gradient
(
to
right
,
#2E9FFF
,
#3E79FF
);
box-shadow
:
0
4px
10px
rgba
(
0
,
123
,
255
,
.5
);
}
.loginDiv
.el-card__body
{
}
.loginDiv
.el-card__body
{
padding
:
0
;
}
}
</
style
>
<
template
>
<div
class=
"loginDiv"
>
<div
class=
"loginOpacity"
flex=
"cross:center main:center"
>
<div
class=
"el-card box-card is-always-shadow"
>
<div
class=
"el-card__body"
>
<img
alt
class=
"logo"
src=
"../assets/img/logo.png"
/>
<img
alt
class=
"logo"
src=
"../assets/img/logo.png"
/>
<form
class=
"el-form login-form"
>
<div
class=
"form-title"
>
管理员登录
</div>
<div
class=
"el-form-item is-required el-form-item--small"
>
<div
class=
"el-form-item__content"
style=
"margin-left: 0px;"
>
<div
class=
"el-input el-input--small"
>
<input
type=
"text"
autocomplete=
"off"
v-model=
"msg.UserName"
placeholder=
"请输入用户名"
class=
"el-input__inner"
/>
<input
type=
"text"
autocomplete=
"off"
v-model=
"msg.Account"
placeholder=
"请输入用户名"
class=
"el-input__inner"
maxlength=
"25"
/>
</div>
</div>
</div>
<div
class=
"el-form-item is-required el-form-item--small"
>
<div
class=
"el-form-item__content"
style=
"margin-left: 0px;"
>
<div
class=
"el-input el-input--small"
>
<input
type=
"password"
autocomplete=
"off"
placeholder=
"请输入密码"
v-model=
"msg.Password"
class=
"el-input__inner"
/>
<input
type=
"password"
autocomplete=
"off"
placeholder=
"请输入密码"
v-model=
"msg.Password"
class=
"el-input__inner"
maxlength=
"25"
/>
</div>
</div>
</div>
<div
class=
"el-form-item is-required el-form-item--small"
>
<div
class=
"el-form-item__content"
style=
"margin-left: 0px;"
>
<div
class=
"el-input el-input--small"
style=
"width: 140px;"
>
<input
type=
"text"
autocomplete=
"off"
placeholder=
"验证码"
v-model=
"msg.validataCode"
class=
"el-input__inner"
/>
<input
type=
"text"
autocomplete=
"off"
placeholder=
"验证码"
v-model=
"msg.ValidataCode"
class=
"el-input__inner"
maxlength=
"4"
/>
</div>
<img
class=
"pic-captcha"
src=
"/web/index.php?r=site%2Fpic-captcha&v=5e9e7ef6a93ac6.36592545"
/>
<img
class=
"pic-captcha"
src=
"/web/index.php?r=site%2Fpic-captcha&v=5e9e7ef6a93ac6.36592545"
/>
</div>
</div>
<div
class=
"el-form-item el-form-item--small"
>
...
...
@@ -173,11 +194,8 @@
</div>
<div
class=
"el-form-item el-form-item--small"
>
<div
class=
"el-form-item__content"
style=
"margin-left: 0px;"
>
<button
type=
"button"
@
click=
"login()"
class=
"el-button login-btn el-button--primary el-button--small is-round"
>
<button
type=
"button"
@
click=
"login()"
class=
"el-button login-btn el-button--primary el-button--small is-round"
>
<span>
登录
</span>
</button>
</div>
...
...
@@ -197,10 +215,10 @@
export
default
{
data
()
{
return
{
msg
:
{
UserName
:
''
,
Password
:
''
,
validataCode
:
''
msg
:
{
Account
:
''
,
//账号
Password
:
''
,
//密码
ValidataCode
:
''
,
//验证码
}
};
},
...
...
@@ -209,12 +227,27 @@
},
methods
:
{
//登录
login
(){
login
()
{
if
(
this
.
msg
.
Account
==
""
)
{
this
.
Info
(
"请输入用户名!"
)
}
if
(
this
.
msg
.
Password
==
""
)
{
this
.
Info
(
"请输入密码!"
)
}
if
(
this
.
msg
.
ValidataCode
==
""
)
{
this
.
Info
(
"请输入验证码!"
)
}
this
.
apipost
(
"api/user/login"
,
this
.
msg
,
res
=>
{
console
.
log
(
"res"
,
res
);
})
}
},
mounted
()
{
if
(
!
this
.
isOnline
())
{
this
.
msg
.
Account
=
"13551126755"
;
this
.
msg
.
Password
=
"123456"
;
this
.
msg
.
ValidataCode
=
"1234"
;
}
}
};
</
script
>
\ No newline at end of file
This diff is collapsed.
Click to expand it.
src/main.js
View file @
f54cfca1
...
...
@@ -3,12 +3,13 @@
import
Vue
from
'vue'
import
App
from
'./App'
import
router
from
'./router'
import
ajaxPlug
from
'./plug/index'
import
ElementUI
from
'element-ui'
;
import
'element-ui/lib/theme-chalk/index.css'
;
Vue
.
use
(
ElementUI
);
Vue
.
config
.
productionTip
=
false
Vue
.
use
(
ajaxPlug
)
/* eslint-disable no-new */
new
Vue
({
el
:
'#app'
,
...
...
This diff is collapsed.
Click to expand it.
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment