Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
绝世唐门三哥
Vue Manage System
提交
a9058503
Vue Manage System
项目概览
绝世唐门三哥
/
Vue Manage System
通知
3
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
Vue Manage System
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
前往新版Gitcode,体验更适合开发者的 AI 搜索 >>
提交
a9058503
编写于
8月 09, 2019
作者:
L
linxin
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
优化登录页面代码
上级
d553a75d
变更
1
隐藏空白更改
内联
并排
Showing
1 changed file
with
80 addition
and
73 deletion
+80
-73
src/components/page/Login.vue
src/components/page/Login.vue
+80
-73
未找到文件。
src/components/page/Login.vue
浏览文件 @
a9058503
...
...
@@ -2,19 +2,24 @@
<div
class=
"login-wrap"
>
<div
class=
"ms-login"
>
<div
class=
"ms-title"
>
后台管理系统
</div>
<el-form
:model=
"
ruleForm"
:rules=
"rules"
ref=
"ruleForm
"
label-width=
"0px"
class=
"ms-content"
>
<el-form
:model=
"
param"
:rules=
"rules"
ref=
"login
"
label-width=
"0px"
class=
"ms-content"
>
<el-form-item
prop=
"username"
>
<el-input
v-model=
"
ruleFor
m.username"
placeholder=
"username"
>
<el-input
v-model=
"
para
m.username"
placeholder=
"username"
>
<el-button
slot=
"prepend"
icon=
"el-icon-lx-people"
></el-button>
</el-input>
</el-form-item>
<el-form-item
prop=
"password"
>
<el-input
type=
"password"
placeholder=
"password"
v-model=
"ruleForm.password"
@
keyup.enter.native=
"submitForm('ruleForm')"
>
<el-input
type=
"password"
placeholder=
"password"
v-model=
"param.password"
@
keyup.enter.native=
"submitForm()"
>
<el-button
slot=
"prepend"
icon=
"el-icon-lx-lock"
></el-button>
</el-input>
</el-form-item>
<div
class=
"login-btn"
>
<el-button
type=
"primary"
@
click=
"submitForm(
'ruleForm'
)"
>
登录
</el-button>
<el-button
type=
"primary"
@
click=
"submitForm()"
>
登录
</el-button>
</div>
<p
class=
"login-tips"
>
Tips : 用户名和密码随便填。
</p>
</el-form>
...
...
@@ -23,79 +28,81 @@
</
template
>
<
script
>
export
default
{
data
:
function
(){
return
{
ruleForm
:
{
username
:
'
admin
'
,
password
:
'
123123
'
},
rules
:
{
username
:
[
{
required
:
true
,
message
:
'
请输入用户名
'
,
trigger
:
'
blur
'
}
],
password
:
[
{
required
:
true
,
message
:
'
请输入密码
'
,
trigger
:
'
blur
'
}
]
}
}
},
methods
:
{
submitForm
(
formName
)
{
this
.
$refs
[
formName
].
validate
((
valid
)
=>
{
if
(
valid
)
{
localStorage
.
setItem
(
'
ms_username
'
,
this
.
ruleForm
.
username
);
this
.
$router
.
push
(
'
/
'
);
}
else
{
console
.
log
(
'
error submit!!
'
);
return
false
;
}
});
export
default
{
data
:
function
()
{
return
{
param
:
{
username
:
"
admin
"
,
password
:
"
123123
"
},
rules
:
{
username
:
[
{
required
:
true
,
message
:
"
请输入用户名
"
,
trigger
:
"
blur
"
}
],
password
:
[
{
required
:
true
,
message
:
"
请输入密码
"
,
trigger
:
"
blur
"
}
]
}
};
},
methods
:
{
submitForm
()
{
this
.
$refs
.
login
.
validate
(
valid
=>
{
if
(
valid
)
{
this
.
$message
.
success
(
"
登录成功
"
);
localStorage
.
setItem
(
"
ms_username
"
,
this
.
param
.
username
);
this
.
$router
.
push
(
"
/
"
);
}
else
{
this
.
$message
.
error
(
"
请输入账号和密码
"
);
console
.
log
(
"
error submit!!
"
);
return
false
;
}
});
}
}
};
</
script
>
<
style
scoped
>
.login-wrap
{
position
:
relative
;
width
:
100%
;
height
:
100%
;
background-image
:
url(../../assets/img/login-bg.jpg)
;
background-size
:
100%
;
}
.ms-title
{
width
:
100%
;
line-height
:
50px
;
text-align
:
center
;
font-size
:
20px
;
color
:
#fff
;
border-bottom
:
1px
solid
#ddd
;
}
.ms-login
{
position
:
absolute
;
left
:
50%
;
top
:
50%
;
width
:
350px
;
margin
:
-190px
0
0
-175px
;
border-radius
:
5px
;
background
:
rgba
(
255
,
255
,
255
,
0.3
);
overflow
:
hidden
;
}
.ms-content
{
padding
:
30px
30px
;
}
.login-btn
{
text-align
:
center
;
}
.login-btn
button
{
width
:
100%
;
height
:
36px
;
margin-bottom
:
10px
;
}
.login-tips
{
font-size
:
12px
;
line-height
:
30px
;
color
:
#fff
;
}
.login-wrap
{
position
:
relative
;
width
:
100%
;
height
:
100%
;
background-image
:
url(../../assets/img/login-bg.jpg)
;
background-size
:
100%
;
}
.ms-title
{
width
:
100%
;
line-height
:
50px
;
text-align
:
center
;
font-size
:
20px
;
color
:
#fff
;
border-bottom
:
1px
solid
#ddd
;
}
.ms-login
{
position
:
absolute
;
left
:
50%
;
top
:
50%
;
width
:
350px
;
margin
:
-190px
0
0
-175px
;
border-radius
:
5px
;
background
:
rgba
(
255
,
255
,
255
,
0.3
);
overflow
:
hidden
;
}
.ms-content
{
padding
:
30px
30px
;
}
.login-btn
{
text-align
:
center
;
}
.login-btn
button
{
width
:
100%
;
height
:
36px
;
margin-bottom
:
10px
;
}
.login-tips
{
font-size
:
12px
;
line-height
:
30px
;
color
:
#fff
;
}
</
style
>
\ No newline at end of file
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录