Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
李少辉-开发者
gitlab-foss
提交
106640e0
G
gitlab-foss
项目概览
李少辉-开发者
/
gitlab-foss
通知
15
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
G
gitlab-foss
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
前往新版Gitcode,体验更适合开发者的 AI 搜索 >>
未验证
提交
106640e0
编写于
9月 10, 2018
作者:
A
Adriel Santiago
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
Use GitLab ui pagination component for groups
上级
32062a91
变更
6
隐藏空白更改
内联
并排
Showing
6 changed file
with
127 addition
and
15 deletion
+127
-15
app/assets/javascripts/commons/gitlab_ui.js
app/assets/javascripts/commons/gitlab_ui.js
+2
-0
app/assets/javascripts/groups/components/groups.vue
app/assets/javascripts/groups/components/groups.vue
+15
-12
app/assets/javascripts/vue_shared/components/pagination_links.vue
...ts/javascripts/vue_shared/components/pagination_links.vue
+34
-0
spec/features/dashboard/groups_list_spec.rb
spec/features/dashboard/groups_list_spec.rb
+2
-2
spec/javascripts/groups/components/app_spec.js
spec/javascripts/groups/components/app_spec.js
+2
-1
spec/javascripts/vue_shared/components/pagination_links_spec.js
...avascripts/vue_shared/components/pagination_links_spec.js
+72
-0
未找到文件。
app/assets/javascripts/commons/gitlab_ui.js
浏览文件 @
106640e0
import
Vue
from
'
vue
'
;
import
Pagination
from
'
@gitlab-org/gitlab-ui/dist/components/base/pagination
'
;
import
progressBar
from
'
@gitlab-org/gitlab-ui/dist/components/base/progress_bar
'
;
import
modal
from
'
@gitlab-org/gitlab-ui/dist/components/base/modal
'
;
import
loadingIcon
from
'
@gitlab-org/gitlab-ui/dist/components/base/loading_icon
'
;
...
...
@@ -6,6 +7,7 @@ import loadingIcon from '@gitlab-org/gitlab-ui/dist/components/base/loading_icon
import
dModal
from
'
@gitlab-org/gitlab-ui/dist/directives/modal
'
;
import
dTooltip
from
'
@gitlab-org/gitlab-ui/dist/directives/tooltip
'
;
Vue
.
component
(
'
gl-pagination
'
,
Pagination
);
Vue
.
component
(
'
gl-progress-bar
'
,
progressBar
);
Vue
.
component
(
'
gl-ui-modal
'
,
modal
);
Vue
.
component
(
'
gl-loading-icon
'
,
loadingIcon
);
...
...
app/assets/javascripts/groups/components/groups.vue
浏览文件 @
106640e0
<
script
>
import
tablePagination
from
'
~/vue_shared/components/table_pagination
.vue
'
;
import
PaginationLinks
from
'
~/vue_shared/components/pagination_links
.vue
'
;
import
eventHub
from
'
../event_hub
'
;
import
{
getParameterByName
}
from
'
../../lib/utils/common_utils
'
;
export
default
{
components
:
{
tablePagination
,
PaginationLinks
,
},
props
:
{
groups
:
{
...
...
@@ -49,15 +49,18 @@ export default {
>
{{
searchEmptyMessage
}}
</div>
<group-folder
v-if=
"!searchEmpty"
:groups=
"groups"
:action=
"action"
/>
<table-pagination
v-if=
"!searchEmpty"
:change=
"change"
:page-info=
"pageInfo"
/>
<template
v-else
>
<group-folder
:groups=
"groups"
:action=
"action"
/>
<pagination-links
:change=
"change"
:page-info=
"pageInfo"
class=
"d-flex justify-content-center prepend-top-default"
/>
</
template
>
</div>
</template>
app/assets/javascripts/vue_shared/components/pagination_links.vue
0 → 100644
浏览文件 @
106640e0
<
script
>
import
{
s__
}
from
'
../../locale
'
;
export
default
{
props
:
{
change
:
{
type
:
Function
,
required
:
true
,
},
pageInfo
:
{
type
:
Object
,
required
:
true
,
},
},
firstText
:
s__
(
'
Pagination|« First
'
),
prevText
:
s__
(
'
Pagination|Prev
'
),
nextText
:
s__
(
'
Pagination|Next
'
),
lastText
:
s__
(
'
Pagination|Last »
'
),
};
</
script
>
<
template
>
<gl-pagination
v-bind=
"$attrs"
:change=
"change"
:page=
"pageInfo.page"
:per-page=
"pageInfo.perPage"
:total-items=
"pageInfo.total"
:first-text=
"$options.firstText"
:prev-text=
"$options.prevText"
:next-text=
"$options.nextText"
:last-text=
"$options.lastText"
/>
</
template
>
spec/features/dashboard/groups_list_spec.rb
浏览文件 @
106640e0
...
...
@@ -125,7 +125,7 @@ describe 'Dashboard Groups page', :js do
end
it
'loads results for next page'
do
expect
(
page
).
to
have_selector
(
'.gl-pagination .page'
,
count:
2
)
expect
(
page
).
to
have_selector
(
'.gl-pagination .page
-item a[role=menuitemradio]
'
,
count:
2
)
# Check first page
expect
(
page
).
to
have_content
(
group2
.
full_name
)
...
...
@@ -134,7 +134,7 @@ describe 'Dashboard Groups page', :js do
expect
(
page
).
not_to
have_selector
(
"#group-
#{
group
.
id
}
"
)
# Go to next page
find
(
".gl-pagination .page:not(.active) a"
).
click
find
(
'.gl-pagination .page-item:not(.active) a[role=menuitemradio]'
).
click
wait_for_requests
...
...
spec/javascripts/groups/components/app_spec.js
浏览文件 @
106640e0
...
...
@@ -24,6 +24,8 @@ const createComponent = (hideProjects = false) => {
const
store
=
new
GroupsStore
(
false
);
const
service
=
new
GroupsService
(
mockEndpoint
);
store
.
state
.
pageInfo
=
mockPageInfo
;
return
new
Component
({
propsData
:
{
store
,
...
...
@@ -484,7 +486,6 @@ describe('AppComponent', () => {
it
(
'
should render groups tree
'
,
done
=>
{
vm
.
store
.
state
.
groups
=
[
mockParentGroupItem
];
vm
.
isLoading
=
false
;
vm
.
store
.
state
.
pageInfo
=
mockPageInfo
;
Vue
.
nextTick
(()
=>
{
expect
(
vm
.
$el
.
querySelector
(
'
.groups-list-tree-container
'
)).
toBeDefined
();
done
();
...
...
spec/javascripts/vue_shared/components/pagination_links_spec.js
0 → 100644
浏览文件 @
106640e0
import
Vue
from
'
vue
'
;
import
PaginationLinks
from
'
~/vue_shared/components/pagination_links.vue
'
;
import
{
s__
}
from
'
~/locale
'
;
import
mountComponent
from
'
../../helpers/vue_mount_component_helper
'
;
describe
(
'
Pagination links component
'
,
()
=>
{
const
paginationLinksComponent
=
Vue
.
extend
(
PaginationLinks
);
const
change
=
page
=>
page
;
const
pageInfo
=
{
page
:
3
,
perPage
:
5
,
total
:
30
,
};
const
translations
=
{
firstText
:
s__
(
'
Pagination|« First
'
),
prevText
:
s__
(
'
Pagination|Prev
'
),
nextText
:
s__
(
'
Pagination|Next
'
),
lastText
:
s__
(
'
Pagination|Last »
'
),
};
let
paginationLinks
;
let
glPagination
;
let
destinationComponent
;
beforeEach
(()
=>
{
paginationLinks
=
mountComponent
(
paginationLinksComponent
,
{
change
,
pageInfo
,
},
);
[
glPagination
]
=
paginationLinks
.
$children
;
[
destinationComponent
]
=
glPagination
.
$children
;
});
afterEach
(()
=>
{
paginationLinks
.
$destroy
();
});
it
(
'
should provide translated text to GitLab UI pagination
'
,
()
=>
{
Object
.
entries
(
translations
).
forEach
(
entry
=>
expect
(
destinationComponent
[
entry
[
0
]],
).
toBe
(
entry
[
1
]),
);
});
it
(
'
should pass change to GitLab UI pagination
'
,
()
=>
{
expect
(
Object
.
is
(
glPagination
.
change
,
change
),
).
toBe
(
true
);
});
it
(
'
should pass page from pageInfo to GitLab UI pagination
'
,
()
=>
{
expect
(
destinationComponent
.
value
,
).
toBe
(
pageInfo
.
page
);
});
it
(
'
should pass per page from pageInfo to GitLab UI pagination
'
,
()
=>
{
expect
(
destinationComponent
.
perPage
,
).
toBe
(
pageInfo
.
perPage
);
});
it
(
'
should pass total items from pageInfo to GitLab UI pagination
'
,
()
=>
{
expect
(
destinationComponent
.
totalRows
,
).
toBe
(
pageInfo
.
total
);
});
});
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录