Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
圆滚滚核心
vue-element-admin
提交
705b9cce
V
vue-element-admin
项目概览
圆滚滚核心
/
vue-element-admin
与 Fork 源项目一致
从无法访问的项目Fork
通知
1
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
V
vue-element-admin
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
705b9cce
编写于
12月 05, 2017
作者:
P
Pan
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
add(tags-view): moveToCurrentTag
上级
c84964d7
变更
2
显示空白变更内容
内联
并排
Showing
2 changed file
with
37 addition
and
5 deletion
+37
-5
src/components/ScrollPane/index.vue
src/components/ScrollPane/index.vue
+23
-3
src/views/layout/components/TagsView.vue
src/views/layout/components/TagsView.vue
+14
-2
未找到文件。
src/components/ScrollPane/index.vue
浏览文件 @
705b9cce
...
...
@@ -7,6 +7,8 @@
</
template
>
<
script
>
const
padding
=
15
// tag's padding
export
default
{
name
:
'
scrollPane
'
,
data
()
{
...
...
@@ -21,19 +23,37 @@ export default {
const
$containerWidth
=
$container
.
offsetWidth
const
$wrapper
=
this
.
$refs
.
scrollWrapper
const
$wrapperWidth
=
$wrapper
.
offsetWidth
if
(
e
.
wheelDelta
>
0
)
{
this
.
left
=
Math
.
min
(
0
,
this
.
left
+
e
.
wheelDelta
)
}
else
{
if
(
$containerWidth
-
100
<
$wrapperWidth
)
{
if
(
this
.
left
<
-
(
$wrapperWidth
-
$containerWidth
+
100
))
{
if
(
$containerWidth
-
padding
<
$wrapperWidth
)
{
if
(
this
.
left
<
-
(
$wrapperWidth
-
$containerWidth
+
padding
))
{
this
.
left
=
this
.
left
}
else
{
this
.
left
=
Math
.
max
(
this
.
left
+
e
.
wheelDelta
,
$containerWidth
-
$wrapperWidth
-
100
)
this
.
left
=
Math
.
max
(
this
.
left
+
e
.
wheelDelta
,
$containerWidth
-
$wrapperWidth
-
padding
)
}
}
else
{
this
.
left
=
0
}
}
},
moveToTarget
(
$target
)
{
const
$container
=
this
.
$refs
.
scrollContainer
const
$containerWidth
=
$container
.
offsetWidth
const
$targetLeft
=
$target
.
offsetLeft
const
$targetWidth
=
$target
.
offsetWidth
if
(
$targetLeft
<
-
this
.
left
)
{
// tag in the left
this
.
left
=
-
$targetLeft
+
padding
}
else
if
(
$targetLeft
+
padding
>
-
this
.
left
&&
$targetLeft
+
$targetWidth
<
-
this
.
left
+
$containerWidth
-
padding
)
{
// tag in the current view
// eslint-disable-line
}
else
{
// tag in the right
this
.
left
=
-
(
$targetLeft
-
(
$containerWidth
-
$targetWidth
)
+
padding
)
}
}
}
}
...
...
src/views/layout/components/TagsView.vue
浏览文件 @
705b9cce
<
template
>
<scroll-pane
class=
'tags-view-container'
>
<router-link
class=
"tags-view-item"
:class=
"isActive(tag)?'active':''"
v-for=
"tag in Array.from(visitedViews)"
:to=
"tag.path"
:key=
"tag.path"
>
<scroll-pane
class=
'tags-view-container'
ref=
'scrollPane'
>
<router-link
ref=
'tag'
class=
"tags-view-item"
:class=
"isActive(tag)?'active':''"
v-for=
"tag in Array.from(visitedViews)"
:to=
"tag.path"
:key=
"tag.path"
>
{{
$t
(
'
route.
'
+
tag
.
title
)
}}
<span
class=
'el-icon-close'
@
click=
'closeViewTags(tag,$event)'
></span>
</router-link>
...
...
@@ -49,12 +49,24 @@ export default {
},
isActive
(
route
)
{
return
route
.
path
===
this
.
$route
.
path
||
route
.
name
===
this
.
$route
.
name
},
moveToCurrentTag
()
{
const
tags
=
this
.
$refs
.
tag
this
.
$nextTick
(()
=>
{
for
(
const
tag
of
tags
)
{
if
(
tag
.
to
===
this
.
$route
.
path
)
{
this
.
$refs
.
scrollPane
.
moveToTarget
(
tag
.
$el
)
break
}
}
})
}
},
watch
:
{
$route
()
{
this
.
addViewTags
()
this
.
moveToCurrentTag
()
}
}
}
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录