Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
wanjj_1210
ant-design
提交
bf520267
A
ant-design
项目概览
wanjj_1210
/
ant-design
与 Fork 源项目一致
从无法访问的项目Fork
通知
10
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
A
ant-design
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
bf520267
编写于
8月 16, 2015
作者:
然
然则
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
up tree and checkbox
上级
61f061b0
变更
4
隐藏空白更改
内联
并排
Showing
4 changed file
with
87 addition
and
48 deletion
+87
-48
components/tree/demo/checkbox.md
components/tree/demo/checkbox.md
+1
-1
components/tree/index.md
components/tree/index.md
+1
-1
style/components/checkbox.less
style/components/checkbox.less
+21
-0
style/components/tree.less
style/components/tree.less
+64
-46
未找到文件。
components/tree/demo/checkbox.md
浏览文件 @
bf520267
...
...
@@ -13,7 +13,7 @@ function handleCheck(checked, c, checkedKeys) {
console
.
log
(
'
checked:
'
,
checked
,
c
);
}
React
.
render
(
<
Tree
defaultExpandAll
=
{
true
}
checkable
=
{
true
}
onCheck
=
{
handleCheck
}
>
<
Tree
defaultExpandAll
=
{
true
}
checkable
=
{
<
span
className
=
"ant-tree-checkbox-inner"
></
span
>
}
onCheck
=
{
handleCheck
}
>
<
TreeNode
title
=
"parent 1"
>
<
TreeNode
>
leaf
</
TreeNode
>
<
TreeNode
title
=
"parent 1-1"
>
...
...
components/tree/index.md
浏览文件 @
bf520267
...
...
@@ -15,7 +15,7 @@
| 参数 | 说明 | 类型 | 默认值 |
|-----------|------------------------------------------|------------|--------|
|
checkable | 是否支持选中 | bool
| false |
|
checkable | 是否支持选中 | bool/React Node
| false |
|defaultExpandAll | 设置展开所有树节点 | bool | false |
|defaultExpandedKeys | 展开指定的树节点 | String[] | false |
|defaultCheckedKeys | 默认选中的树节点 | String[] | [] |
...
...
style/components/checkbox.less
浏览文件 @
bf520267
...
...
@@ -59,6 +59,27 @@
}
}
/* 半选状态 */
.@{checkboxWrapPrefixCls}-indeterminate {
.@{checkboxInnerPrefixCls} {
border-color: @primary-color;
background-color: rgba(215, 216, 217, 1);
&:after {
transform: rotate(45deg) scale(1);
position: absolute;
left: 4px;
top: 1px;
display: table;
width: 5px;
height: 8px;
border: 2px solid #ffffff;
border-top: 0;
border-left: 0;
content: ' ';
transition: all .2s @ease-out-back .1s;
}
}
}
/* 选中状态 */
.@{checkboxWrapPrefixCls}-checked {
...
...
style/components/tree.less
浏览文件 @
bf520267
@treePrefixCls: ant-tree;
@import "./checkbox";
@checkboxWrapPrefixCls: ant-tree-checkbox;
@import "../mixins/iconfont";
@openIcon: '\e60f';
.switcher_icon() {
...
...
@@ -16,68 +17,85 @@
color: #666;
}
}
.@{treePrefixCls} {
margin:0; padding:5px; font-size: 12px;
margin: 0;
padding: 5px;
font-size: 12px;
li {
padding: 0; margin: 0;
list-style: none; white-space: nowrap; outline: 0;
padding: 0;
margin: 0;
list-style: none;
white-space: nowrap;
outline: 0;
ul {
margin:0; padding:0 0 0 18px;
&.@{treePrefixCls}-line{
background:url(https://t.alipayobjects.com/images/T13BtfXl0mXXXXXXXX.gif) 0 0 repeat-y;
}
margin: 0;
padding: 0 0 0 18px;
&.@{treePrefixCls}-line {
background: url("https://t.alipayobjects.com/images/T13BtfXl0mXXXXXXXX.gif") 0 0 repeat-y;
}
}
a {
display: inline-block;
padding:1px 3px 0 0; margin:0;
cursor:pointer; height:20px;
text-decoration:none; vertical-align:top;
padding: 1px 3px 0 0;
margin: 0;
cursor: pointer;
height: 20px;
text-decoration: none;
vertical-align: top;
color: #666;
}
span {
line-height:20px; margin-right:2px;
&.@{treePrefixCls}-
button
{
line-height:
0; margin:0; width:16px; height:16px
;
display: inline-block; vertical-align:middle
;
border:0 none; cursor: pointer;outline:none
;
background-color:transparent; background-repeat:no-repeat; background-attachment: scroll
;
background-image:url("https://t.alipayobjects.com/images/T1NcthXkFdXXXXXXXX.png")
;
&.@{treePrefixCls}-switcher {
&-disabled {
background: #fff; position: relative
;
&:after{content: '-'; position: absolute; top: 8px; left: 6px; color: gray;}
}
background-position: 0 20px
;
&.@{treePrefixCls}-roots_open,
&.@{treePrefixCls}-center_open,
&.@{treePrefixCls}-bottom_open,
&.@{treePrefixCls}-noline_open{ .switcher_icon(); }
&.@{treePrefixCls}-roots_close,
&.@{treePrefixCls}-center_close,
&.@{treePrefixCls}-bottom_close,
&
.@{treePrefixCls}-noline_close
{
.switcher_icon()
;
&:after{
.ie-rotate(3)
;
transform: rotate(270deg) scale(0.5)
;
}
&.@{treePrefixCls}-switcher,
&.@{treePrefixCls}-
iconEle
{
line-height:
0
;
margin: 0
;
width: 16px
;
height: 16px
;
display: inline-block
;
vertical-align: middle;
border: 0 none;
cursor: pointer
;
outline: none;
background-color: transparent;
background-repeat: no-repeat
;
background-attachment: scroll;
// background-image:url("https://t.alipayobjects.com/images/T1NcthXkFdXXXXXXXX.png");
}
&.@{treePrefixCls}-switcher {
&-disabled {
background: #fff;
position: relative;
&
:after
{
content: '-'
;
position: absolute;
top: 8px
;
left: 6px
;
color: gray;
}
}
&.@{treePrefixCls}-checkbox {
width: 15px; height: 15px; margin: 0 3px 0 0;
background-position:0 0;
&-disabled {
background-position: 0 -28px;
background-position: 0 20px;
&.@{treePrefixCls}-roots_open,
&.@{treePrefixCls}-center_open,
&.@{treePrefixCls}-bottom_open,
&.@{treePrefixCls}-noline_open {
.switcher_icon();
}
&.@{treePrefixCls}-roots_close,
&.@{treePrefixCls}-center_close,
&.@{treePrefixCls}-bottom_close,
&.@{treePrefixCls}-noline_close {
.switcher_icon();
&:after {
.ie-rotate(3);
transform: rotate(270deg) scale(0.5);
}
&.@{treePrefixCls}-checkbox-checked {background-position:-14px 0}
&.@{treePrefixCls}-checkbox-indeterminate {background-position:-14px -30px}
}
}
}
}
&-treenode-disabled {
>span, >a {
>span,
>a {
color: gray;
}
}
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录