Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
FLIPPED-AURORA
gin-vue-admin
提交
d883f403
G
gin-vue-admin
项目概览
FLIPPED-AURORA
/
gin-vue-admin
大约 1 年 前同步成功
通知
332
Star
18154
Fork
5505
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
G
gin-vue-admin
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
d883f403
编写于
5月 01, 2020
作者:
Mr.奇淼(
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
修复top栏样式问题
上级
9718593a
变更
3
隐藏空白更改
内联
并排
Showing
3 changed file
with
152 addition
and
143 deletion
+152
-143
web/src/view/layout/aside/historyComponent/history.vue
web/src/view/layout/aside/historyComponent/history.vue
+13
-3
web/src/view/layout/aside/index.vue
web/src/view/layout/aside/index.vue
+1
-4
web/src/view/layout/index.vue
web/src/view/layout/index.vue
+138
-136
未找到文件。
web/src/view/layout/aside/historyComponent/history.vue
浏览文件 @
d883f403
...
...
@@ -36,6 +36,7 @@ export default {
left
:
0
,
top
:
0
,
isCollapse
:
false
,
isMobile
:
false
,
rightActive
:
''
}
},
...
...
@@ -53,9 +54,15 @@ export default {
this
.
setTab
(
this
.
$route
)
},
mounted
()
{
this
.
$bus
.
on
(
'
totalCollapse
'
,
()
=>
{
this
.
isCollapse
=
!
this
.
isCollapse
this
.
$bus
.
on
(
'
collapse
'
,(
isCollapse
)
=>
{
this
.
isCollapse
=
isCollapse
})
this
.
$bus
.
on
(
'
mobile
'
),(
isMobile
)
=>
{
this
.
isMobile
=
isMobile
}
},
beforeDestroy
(){
this
.
$bus
.
off
(
'
collapse
'
)
},
methods
:
{
openContextMenu
(
e
)
{
...
...
@@ -66,10 +73,13 @@ export default {
this
.
contextMenuVisible
=
true
let
width
if
(
this
.
isCollapse
)
{
width
=
60
width
=
54
}
else
{
width
=
220
}
if
(
this
.
isMobile
){
width
=
0
}
this
.
left
=
e
.
clientX
-
width
this
.
top
=
e
.
clientY
+
10
this
.
rightActive
=
e
.
srcElement
.
id
.
split
(
'
-
'
)[
1
]
...
...
web/src/view/layout/aside/index.vue
浏览文件 @
d883f403
...
...
@@ -50,9 +50,7 @@ export default {
if
(
screenWidth
<
1000
){
this
.
isCollapse
=
!
this
.
isCollapse
}
this
.
$bus
.
on
(
'
totalCollapse
'
,
()
=>
{
this
.
isCollapse
=
!
this
.
isCollapse
})
this
.
$bus
.
on
(
'
collapse
'
,
(
item
)
=>
{
this
.
isCollapse
=
item
})
...
...
@@ -64,7 +62,6 @@ export default {
}
},
beforeDestroy
()
{
this
.
$bus
.
off
(
'
totalCollapse
'
)
this
.
$bus
.
off
(
'
collapse
'
)
}
}
...
...
web/src/view/layout/index.vue
浏览文件 @
d883f403
...
...
@@ -8,45 +8,47 @@
<!-- 分块滑动功能 -->
<el-main
class=
"main-cont main-right"
>
<transition
mode=
"out-in"
name=
"el-fade-in-linear"
>
<div
class=
"topfix"
:style=
"
{width: `calc(100% - ${isCollapse?'54px':'220px'})`}">
<el-header
class=
"header-cont"
>
<div
@
click=
"totalCollapse"
class=
"menu-total"
>
<i
class=
"el-icon-s-unfold"
v-if=
"isCollapse"
></i>
<i
class=
"el-icon-s-fold"
v-else
></i>
</div>
<el-breadcrumb
class=
"breadcrumb"
separator-class=
"el-icon-arrow-right"
>
<el-breadcrumb-item
:key=
"item.path"
v-for=
"item in matched.slice(1,matched.length)"
>
{{
item
.
meta
.
title
}}
</el-breadcrumb-item>
</el-breadcrumb>
<div
class=
"fl-right right-box"
>
<el-dropdown>
<span
class=
"el-dropdown-link"
>
<img
:src=
"userInfo.headerImg"
height=
"30"
width=
"30"
/>
{{
userInfo
.
title
}}
<i
class=
"el-icon-arrow-down"
></i>
</span>
<el-dropdown-menu
class=
"dropdown-group"
slot=
"dropdown"
>
<el-dropdown-item>
<span>
更多信息
<el-badge
is-dot
/>
<div
class=
"topfix"
:style=
"
{width: `calc(100% - ${isMobile?'0px':isCollapse?'54px':'220px'})`}"
>
<el-header
class=
"header-cont"
>
<div
@
click=
"totalCollapse"
class=
"menu-total"
>
<i
class=
"el-icon-s-unfold"
v-if=
"isCollapse"
></i>
<i
class=
"el-icon-s-fold"
v-else
></i>
</div>
<el-breadcrumb
class=
"breadcrumb"
separator-class=
"el-icon-arrow-right"
>
<el-breadcrumb-item
:key=
"item.path"
v-for=
"item in matched.slice(1,matched.length)"
>
{{
item
.
meta
.
title
}}
</el-breadcrumb-item>
</el-breadcrumb>
<div
class=
"fl-right right-box"
>
<el-dropdown>
<span
class=
"el-dropdown-link"
>
<img
:src=
"userInfo.headerImg"
height=
"30"
width=
"30"
/>
{{
userInfo
.
title
}}
<i
class=
"el-icon-arrow-down"
></i>
</span>
</el-dropdown-item>
<el-dropdown-item
@
click.native=
"showPassword=true"
icon=
"el-icon-s-custom"
>
修改密码
</el-dropdown-item>
<el-dropdown-item
@
click.native=
"toPerson"
icon=
"el-icon-s-custom"
>
个人信息
</el-dropdown-item>
<el-dropdown-item
@
click.native=
"LoginOut"
icon=
"el-icon-table-lamp"
>
登 出
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<el-dropdown-menu
class=
"dropdown-group"
slot=
"dropdown"
>
<el-dropdown-item>
<span>
更多信息
<el-badge
is-dot
/>
</span>
</el-dropdown-item>
<el-dropdown-item
@
click.native=
"showPassword=true"
icon=
"el-icon-s-custom"
>
修改密码
</el-dropdown-item>
<el-dropdown-item
@
click.native=
"toPerson"
icon=
"el-icon-s-custom"
>
个人信息
</el-dropdown-item>
<el-dropdown-item
@
click.native=
"LoginOut"
icon=
"el-icon-table-lamp"
>
登 出
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
</el-header>
<!-- 当前面包屑用路由自动生成可根据需求修改 -->
<!--
:to="
{ path: item.path }" 暂时注释不用-->
<HistoryComponent
/>
</div>
</el-header>
<!-- 当前面包屑用路由自动生成可根据需求修改 -->
<!--
:to="
{ path: item.path }" 暂时注释不用-->
<HistoryComponent
/>
</div>
</transition>
<transition
mode=
"out-in"
name=
"el-fade-in-linear"
>
<keep-alive>
...
...
@@ -54,43 +56,38 @@
</keep-alive>
</transition>
<transition
mode=
"out-in"
name=
"el-fade-in-linear"
>
<router-view
v-if=
"!$route.meta.keepAlive"
class=
"admin-box"
></router-view>
<router-view
v-if=
"!$route.meta.keepAlive"
class=
"admin-box"
></router-view>
</transition>
</el-main>
</el-container>
<el-dialog
title=
"修改密码"
:visible.sync=
"showPassword"
@
close=
"clearPassword"
width=
"360px"
>
<el-form
ref=
"modifyPwdForm"
:model=
"pwdModify"
:rules=
"rules"
label-width=
"80px"
>
<el-form-item
prop=
"password"
:minlength=
"6"
label=
"原密码"
>
<el-input
v-model=
"pwdModify.password"
show-password
></el-input>
</el-form-item>
<el-form-item
prop=
"newPassword"
:minlength=
"6"
label=
"新密码"
>
<el-input
v-model=
"pwdModify.newPassword"
show-password
></el-input>
</el-form-item>
<el-form-item
prop=
"confirmPassword"
:minlength=
"6"
label=
"确认密码"
>
<el-input
v-model=
"pwdModify.confirmPassword"
show-password
></el-input>
</el-form-item>
</el-form>
<div
slot=
"footer"
class=
"dialog-footer"
>
<el-button
@
click=
"showPassword=false"
>
取 消
</el-button>
<el-button
type=
"primary"
@
click=
"savePassword"
>
确 定
</el-button>
</div>
</el-dialog>
<el-dialog
title=
"修改密码"
:visible.sync=
"showPassword"
@
close=
"clearPassword"
width=
"360px"
>
<el-form
ref=
"modifyPwdForm"
:model=
"pwdModify"
:rules=
"rules"
label-width=
"80px"
>
<el-form-item
prop=
"password"
:minlength=
"6"
label=
"原密码"
>
<el-input
v-model=
"pwdModify.password"
show-password
></el-input>
</el-form-item>
<el-form-item
prop=
"newPassword"
:minlength=
"6"
label=
"新密码"
>
<el-input
v-model=
"pwdModify.newPassword"
show-password
></el-input>
</el-form-item>
<el-form-item
prop=
"confirmPassword"
:minlength=
"6"
label=
"确认密码"
>
<el-input
v-model=
"pwdModify.confirmPassword"
show-password
></el-input>
</el-form-item>
</el-form>
<div
slot=
"footer"
class=
"dialog-footer"
>
<el-button
@
click=
"showPassword=false"
>
取 消
</el-button>
<el-button
type=
"primary"
@
click=
"savePassword"
>
确 定
</el-button>
</div>
</el-dialog>
</el-container>
</
template
>
<
script
>
import
Aside
from
'
@/view/layout/aside
'
import
HistoryComponent
from
'
@/view/layout/aside/historyComponent/history
'
import
Aside
from
"
@/view/layout/aside
"
;
import
HistoryComponent
from
"
@/view/layout/aside/historyComponent/history
"
;
import
{
mapGetters
,
mapActions
}
from
'
vuex
'
import
{
changePassword
}
from
'
@/api/user
'
import
{
mapGetters
,
mapActions
}
from
"
vuex
"
;
import
{
changePassword
}
from
"
@/api/user
"
;
export
default
{
name
:
'
Layout
'
,
name
:
"
Layout
"
,
data
()
{
return
{
isCollapse
:
false
,
...
...
@@ -101,59 +98,49 @@ export default {
pwdModify
:
{},
rules
:
{
password
:
[
{
required
:
true
,
message
:
'
请输入密码
'
,
trigger
:
'
blur
'
},
{
min
:
6
,
message
:
'
最少6个字符
'
,
trigger
:
'
blur
'
}
{
required
:
true
,
message
:
"
请输入密码
"
,
trigger
:
"
blur
"
},
{
min
:
6
,
message
:
"
最少6个字符
"
,
trigger
:
"
blur
"
}
],
newPassword
:
[
{
required
:
true
,
message
:
'
请输入新密码
'
,
trigger
:
'
blur
'
},
{
min
:
6
,
message
:
'
最少6个字符
'
,
trigger
:
'
blur
'
}
{
required
:
true
,
message
:
"
请输入新密码
"
,
trigger
:
"
blur
"
},
{
min
:
6
,
message
:
"
最少6个字符
"
,
trigger
:
"
blur
"
}
],
confirmPassword
:
[
{
required
:
true
,
message
:
'
请输入确认密码
'
,
trigger
:
'
blur
'
},
{
min
:
6
,
message
:
'
最少6个字符
'
,
trigger
:
'
blur
'
},
{
required
:
true
,
message
:
"
请输入确认密码
"
,
trigger
:
"
blur
"
},
{
min
:
6
,
message
:
"
最少6个字符
"
,
trigger
:
"
blur
"
},
{
validator
:
(
rule
,
value
,
callback
)
=>
{
if
(
value
!==
this
.
pwdModify
.
newPassword
)
{
callback
(
new
Error
(
'
两次密码不一致
'
))
callback
(
new
Error
(
"
两次密码不一致
"
));
}
else
{
callback
()
callback
()
;
}
},
trigger
:
'
blur
'
trigger
:
"
blur
"
}
]
},
}
}
};
},
components
:
{
Aside
,
HistoryComponent
},
created
()
{
let
screenWidth
=
document
.
body
.
clientWidth
if
(
screenWidth
<
1000
)
{
this
.
isMobile
=
true
this
.
isSider
=
false
this
.
isCollapse
=
!
this
.
isCollapse
}
else
{
this
.
isMobile
=
false
}
Aside
,
HistoryComponent
},
methods
:
{
...
mapActions
(
'
user
'
,
[
'
LoginOut
'
]),
...
mapActions
(
"
user
"
,
[
"
LoginOut
"
]),
totalCollapse
()
{
this
.
isCollapse
=
!
this
.
isCollapse
this
.
isSider
=
!
this
.
isCollapse
this
.
isShadowBg
=
!
this
.
isCollapse
this
.
$bus
.
emit
(
'
totalCollapse
'
)
this
.
isCollapse
=
!
this
.
isCollapse
;
this
.
isSider
=
!
this
.
isCollapse
;
this
.
isShadowBg
=
!
this
.
isCollapse
;
this
.
$bus
.
emit
(
"
collapse
"
,
this
.
isCollapse
);
},
toPerson
()
{
this
.
$router
.
push
({
name
:
'
person
'
})
this
.
$router
.
push
({
name
:
"
person
"
});
},
changeShadow
()
{
this
.
isShadowBg
=
!
this
.
isShadowBg
this
.
isSider
=
!!
this
.
isCollapse
this
.
totalCollapse
()
this
.
isShadowBg
=
!
this
.
isShadowBg
;
this
.
isSider
=
!!
this
.
isCollapse
;
this
.
totalCollapse
()
;
},
savePassword
()
{
this
.
$refs
.
modifyPwdForm
.
validate
(
valid
=>
{
...
...
@@ -163,57 +150,72 @@ export default {
password
:
this
.
pwdModify
.
password
,
newPassword
:
this
.
pwdModify
.
newPassword
}).
then
(()
=>
{
this
.
$message
.
success
(
'
修改密码成功!
'
)
this
.
showPassword
=
false
})
this
.
$message
.
success
(
"
修改密码成功!
"
);
this
.
showPassword
=
false
;
})
;
}
else
{
return
false
return
false
;
}
})
})
;
},
clearPassword
()
{
this
.
pwdModify
=
{
password
:
''
,
newPassword
:
''
,
confirmPassword
:
''
}
this
.
$refs
.
modifyPwdForm
.
clearValidate
()
password
:
""
,
newPassword
:
""
,
confirmPassword
:
""
}
;
this
.
$refs
.
modifyPwdForm
.
clearValidate
()
;
}
},
computed
:
{
...
mapGetters
(
'
user
'
,
[
'
userInfo
'
]),
...
mapGetters
(
'
history
'
,
[
'
historys
'
,
'
activeValue
'
]),
...
mapGetters
(
"
user
"
,
[
"
userInfo
"
]),
...
mapGetters
(
"
history
"
,
[
"
historys
"
,
"
activeValue
"
]),
title
()
{
return
this
.
$route
.
meta
.
title
||
'
当前页面
'
return
this
.
$route
.
meta
.
title
||
"
当前页面
"
;
},
matched
()
{
return
this
.
$route
.
matched
return
this
.
$route
.
matched
;
}
},
mounted
()
{
let
screenWidth
=
document
.
body
.
clientWidth
;
if
(
screenWidth
<
1000
)
{
this
.
isMobile
=
true
;
this
.
isSider
=
false
;
this
.
isCollapse
=
true
;
}
else
if
(
screenWidth
>=
1000
&&
screenWidth
<
1200
)
{
this
.
isMobile
=
false
;
this
.
isSider
=
false
;
this
.
isCollapse
=
true
;
}
else
{
this
.
isMobile
=
false
;
this
.
isSider
=
true
;
this
.
isCollapse
=
false
;
}
this
.
$bus
.
emit
(
"
collapse
"
,
this
.
isCollapse
);
this
.
$bus
.
emit
(
"
mobile
"
,
this
.
isMobile
);
window
.
onresize
=
()
=>
{
return
(()
=>
{
let
screenWidth
=
document
.
body
.
clientWidth
if
(
!
this
.
screenWidth
&&
this
.
isSider
)
{
if
(
screenWidth
<
1000
)
{
this
.
isMobile
=
true
this
.
isSider
=
false
this
.
isCollapse
=
true
this
.
$bus
.
emit
(
'
collapse
'
,
this
.
isCollapse
)
}
let
screenWidth
=
document
.
body
.
clientWidth
;
if
(
screenWidth
<
1000
)
{
this
.
isMobile
=
true
;
this
.
isSider
=
false
;
this
.
isCollapse
=
true
;
}
else
if
(
screenWidth
>=
1000
&&
screenWidth
<
1200
)
{
this
.
isMobile
=
false
;
this
.
isSider
=
false
;
this
.
isCollapse
=
true
;
}
else
{
if
(
screenWidth
<
1000
)
{
this
.
isMobile
=
true
this
.
isSider
=
false
this
.
isCollapse
=
true
}
else
{
this
.
isMobile
=
false
}
this
.
isMobile
=
false
;
this
.
isSider
=
true
;
this
.
isCollapse
=
false
;
}
})()
}
this
.
$bus
.
emit
(
"
collapse
"
,
this
.
isCollapse
);
this
.
$bus
.
emit
(
"
mobile
"
,
this
.
isMobile
);
})();
};
}
}
}
;
</
script
>
<
style
lang=
"scss"
>
...
...
@@ -225,14 +227,14 @@ $mainHight: 100vh;
.dropdown-group
{
min-width
:
100px
;
}
.topfix
{
position
:fixed
;
top
:
0
;
.topfix
{
position
:
fixed
;
top
:
0
;
box-sizing
:
border-box
;
z-index
:
999
;
}
.admin-box
{
background-color
:
rgb
(
255
,
255
,
255
);
.admin-box
{
background-color
:
rgb
(
255
,
255
,
255
);
margin-top
:
100px
;
}
.el-scrollbar__wrap
{
...
...
@@ -269,10 +271,10 @@ $mainHight: 100vh;
// padding: 6px;
// border-bottom: 1px solid #eee;
}
.router-history
{
.router-history
{
background
:
#fff
;
padding
:
0
6px
;
border-top
:
1px
solid
#
DCDCDC
;
border-top
:
1px
solid
#
dcdcdc
;
}
&
.el-main
{
overflow
:
auto
;
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录