Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
凌波微步_大先生
dashboard
提交
bb1e4a33
D
dashboard
项目概览
凌波微步_大先生
/
dashboard
与 Fork 源项目一致
从无法访问的项目Fork
通知
2
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
D
dashboard
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
前往新版Gitcode,体验更适合开发者的 AI 搜索 >>
提交
bb1e4a33
编写于
4月 21, 2016
作者:
P
Piotr Bryk
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
Resource card framework: add status and selecion info (#660)
Re #630
上级
4ff81fff
变更
10
显示空白变更内容
内联
并排
Showing
10 changed file
with
134 addition
and
16 deletion
+134
-16
src/app/frontend/common/components/resourcecard/resourcecard.html
...frontend/common/components/resourcecard/resourcecard.html
+5
-1
src/app/frontend/common/components/resourcecard/resourcecard.scss
...frontend/common/components/resourcecard/resourcecard.scss
+13
-8
src/app/frontend/common/components/resourcecard/resourcecard_component.js
.../common/components/resourcecard/resourcecard_component.js
+21
-0
src/app/frontend/common/components/resourcecard/resourcecardcolumn.scss
...nd/common/components/resourcecard/resourcecardcolumn.scss
+15
-1
src/app/frontend/common/components/resourcecard/resourcecardfooter.scss
...nd/common/components/resourcecard/resourcecardfooter.scss
+20
-1
src/app/frontend/common/components/resourcecard/resourcecardheadercolumn.scss
...mon/components/resourcecard/resourcecardheadercolumn.scss
+4
-0
src/app/frontend/common/components/resourcecard/resourcecardheadercolumns.scss
...on/components/resourcecard/resourcecardheadercolumns.scss
+18
-1
src/app/frontend/common/components/resourcecard/resourcecardlist.html
...tend/common/components/resourcecard/resourcecardlist.html
+4
-1
src/app/frontend/common/components/resourcecard/resourcecardlist_component.js
...mon/components/resourcecard/resourcecardlist_component.js
+22
-1
src/test/frontend/common/components/resourcecard/resourcecardlist_component_test.js
...omponents/resourcecard/resourcecardlist_component_test.js
+12
-2
未找到文件。
src/app/frontend/common/components/resourcecard/resourcecard.html
浏览文件 @
bb1e4a33
...
...
@@ -16,7 +16,11 @@ limitations under the License.
<div
class=
"kd-resource-card"
layout=
"column"
>
<div
layout=
"row"
class=
"kd-resource-card-columns-container"
flex=
"grow"
>
<ng-transclude
ng-transclude-slot=
"status"
class=
"kd-resource-card-status"
flex=
"none"
>
<div
ng-if=
"$ctrl.isSelectable()"
flex=
"none"
class=
"kd-resource-card-select"
>
<md-checkbox></md-checkbox>
</div>
<ng-transclude
ng-if=
"$ctrl.hasStatus()"
ng-transclude-slot=
"status"
class=
"kd-resource-card-status"
flex=
"none"
>
</ng-transclude>
<ng-transclude
ng-transclude-slot=
"columns"
class=
"kd-resource-card-columns-slot"
flex=
"shrink"
>
</ng-transclude>
...
...
src/app/frontend/common/components/resourcecard/resourcecard.scss
浏览文件 @
bb1e4a33
...
...
@@ -17,10 +17,20 @@
$cell-base-size
:
6
*
$baseline-grid
;
.kd-resource-card-status
{
align-items
:
center
;
display
:
flex
;
margin-left
:
$baseline-grid
;
width
:
$cell-base-size
;
justify-content
:
center
;
width
:
4
*
$baseline-grid
;
}
.kd-resource-card-select
{
display
:
flex
;
justify-content
:
center
;
padding-left
:
$baseline-grid
;
width
:
5
*
$baseline-grid
;
md-checkbox
{
margin-bottom
:
0
;
}
}
.kd-resource-card
{
...
...
@@ -37,8 +47,3 @@ $cell-base-size: 6 * $baseline-grid;
.kd-resource-card-columns-slot
{
display
:
flex
;
}
.kd-resource-card-footer-slot
{
display
:
flex
;
margin-left
:
$cell-base-size
+
3
*
$baseline-grid
;
}
src/app/frontend/common/components/resourcecard/resourcecard_component.js
浏览文件 @
bb1e4a33
...
...
@@ -26,7 +26,25 @@ export class ResourceCardController {
* @export {!backendApi.ResourceMetadata}
*/
this
.
resourceMetadata
;
/**
* Initialized from require just before $onInit is called.
* @export {!./resourcecardlist_component.ResourceCardListController}
*/
this
.
resourceCardListCtrl
;
}
/**
* @return {boolean}
* @export
*/
isSelectable
()
{
return
!!
this
.
resourceCardListCtrl
.
selectable
;
}
/**
* @return {boolean}
* @export
*/
hasStatus
()
{
return
!!
this
.
resourceCardListCtrl
.
withStatuses
;
}
}
/**
...
...
@@ -46,4 +64,7 @@ export const resourceCardComponent = {
'
columns
'
:
'
?kdResourceCardColumns
'
,
'
footer
'
:
'
?kdResourceCardFooter
'
,
}),
require
:
{
'
resourceCardListCtrl
'
:
'
^kdResourceCardList
'
,
},
};
src/app/frontend/common/components/resourcecard/resourcecardcolumn.scss
浏览文件 @
bb1e4a33
...
...
@@ -18,7 +18,6 @@ kd-resource-card-column {
display
:
flex
;
flex-basis
:
auto
;
min-width
:
$baseline-grid
*
10
;
overflow
:
hidden
;
padding-left
:
2
*
$baseline-grid
;
// Add this class to kd-resource-card-column to make it layout its children in a row.
...
...
@@ -29,6 +28,21 @@ kd-resource-card-column {
flex-direction
:
row
;
}
}
// Add this class kd-resource-card-column to make it a compact column with icons.
&
.kd-icon-column
{
.md-button
{
margin
:
0
;
}
}
&
:not
(
:last-child
)
{
overflow
:
hidden
;
}
&
:first-child
{
padding-left
:
$baseline-grid
;
}
}
.kd-resource-card-column-container
{
...
...
src/app/frontend/common/components/resourcecard/resourcecardfooter.scss
浏览文件 @
bb1e4a33
...
...
@@ -15,5 +15,24 @@
@import
'../../../variables'
;
.kd-resource-card-footer
{
display
:
block
;
display
:
flex
;
padding-left
:
$baseline-grid
;
}
.kd-resource-card-list-selectable
{
.kd-resource-card-footer
{
padding-left
:
6
*
$baseline-grid
;
}
&
.kd-resource-card-list-with-statuses
{
.kd-resource-card-footer
{
padding-left
:
10
*
$baseline-grid
;
}
}
}
.kd-resource-card-list-with-statuses
{
.kd-resource-card-footer
{
padding-left
:
5
*
$baseline-grid
;
}
}
src/app/frontend/common/components/resourcecard/resourcecardheadercolumn.scss
浏览文件 @
bb1e4a33
...
...
@@ -21,6 +21,10 @@ kd-resource-card-header-column {
min-width
:
$baseline-grid
*
10
;
overflow
:
hidden
;
padding-left
:
2
*
$baseline-grid
;
&
:first-child
{
padding-left
:
$baseline-grid
;
}
}
.kd-resource-card-header-column-container
{
...
...
src/app/frontend/common/components/resourcecard/resourcecardheadercolumns.scss
浏览文件 @
bb1e4a33
...
...
@@ -24,5 +24,22 @@ kd-resource-card-header-columns {
color
:
$foreground-2
;
min-height
:
4
*
$baseline-grid
;
padding
:
$baseline-grid
;
padding-left
:
8
*
$baseline-grid
;
}
.kd-resource-card-list-selectable
{
.kd-resource-card-header-columns
{
padding-left
:
6
*
$baseline-grid
;
}
&
.kd-resource-card-list-with-statuses
{
.kd-resource-card-header-columns
{
padding-left
:
10
*
$baseline-grid
;
}
}
}
.kd-resource-card-list-with-statuses
{
.kd-resource-card-header-columns
{
padding-left
:
5
*
$baseline-grid
;
}
}
src/app/frontend/common/components/resourcecard/resourcecardlist.html
浏览文件 @
bb1e4a33
...
...
@@ -14,4 +14,7 @@ See the License for the specific language governing permissions and
limitations under the License.
-->
<div
class=
"kd-resource-card-list"
ng-transclude
></div>
<div
class=
"kd-resource-card-list"
ng-class=
"{'kd-resource-card-list-selectable': $ctrl.selectable, 'kd-resource-card-list-with-statuses': $ctrl.withStatuses}"
ng-transclude
>
</div>
src/app/frontend/common/components/resourcecard/resourcecardlist_component.js
浏览文件 @
bb1e4a33
...
...
@@ -20,6 +20,20 @@ export class ResourceCardListController {
* @ngInject
*/
constructor
()
{
/**
* Whether to make list items selectable.
* Initialized from a bingind.
* @export {boolean|undefined}
*/
this
.
selectable
;
/**
* Whether to make show statuses for list items.
* Initialized from a bingind.
* @export {boolean|undefined}
*/
this
.
withStatuses
;
/**
* @private {!./resourcecardheadercolumns_component.ResourceCardHeaderColumnsController}
*/
...
...
@@ -50,7 +64,7 @@ export class ResourceCardListController {
* of header and body columns must be exactly the same.
*
* Sample usage:
* <kd-resource-card-list>
* <kd-resource-card-list
selectable="true" with-statuses="true"
>
* <kd-resource-card-header-columns>
* <kd-resource-card-header-column size="medium" grow="2">
* Name
...
...
@@ -86,4 +100,11 @@ export const resourceCardListComponent = {
templateUrl
:
'
common/components/resourcecard/resourcecardlist.html
'
,
transclude
:
true
,
controller
:
ResourceCardListController
,
bindings
:
{
/** {boolean|undefined} whether to make list items selectable */
'
selectable
'
:
'
<
'
,
/** {boolean|undefined} whether to show statuses for list items */
'
withStatuses
'
:
'
<
'
,
},
bindToController
:
true
,
};
src/test/frontend/common/components/resourcecard/resourcecardlist_component_test.js
浏览文件 @
bb1e4a33
...
...
@@ -31,7 +31,7 @@ describe('Resource card list', () => {
it
(
'
should fill the card layout
'
,
()
=>
{
let
compileFn
=
compile
(
`
<kd-resource-card-list>
<kd-resource-card-list
selectable="selectable" with-statuses="withStatuses"
>
<kd-resource-card-header-columns>
<kd-resource-card-header-column size="small" grow="nogrow">
NAME_COLUMN
...
...
@@ -88,7 +88,17 @@ describe('Resource card list', () => {
expect
(
elem
.
html
()).
toContain
(
'
FIRST_COLUMN2
'
);
expect
(
elem
.
html
()).
toContain
(
'
SECOND_COLUMN2
'
);
expect
(
elem
.
html
()).
toContain
(
'
THIRD_COLUMN2
'
);
expect
(
elem
.
html
()).
toContain
(
'
STATUS
'
);
expect
(
elem
.
html
()).
not
.
toContain
(
'
STATUS
'
);
expect
(
elem
.
html
()).
toContain
(
'
FOOTER
'
);
expect
(
elem
.
html
()).
not
.
toContain
(
'
md-checkbox
'
);
scope
.
withStatuses
=
true
;
scope
.
$digest
();
expect
(
elem
.
html
()).
toContain
(
'
STATUS
'
);
expect
(
elem
.
html
()).
not
.
toContain
(
'
md-checkbox
'
);
scope
.
selectable
=
true
;
scope
.
$digest
();
expect
(
elem
.
html
()).
toContain
(
'
md-checkbox
'
);
});
});
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录