innov
/
bee-tree
1
0
Fork 0
Code Issues Pull Requests 2 Projects Releases Wiki Activity

publish 1.0.3

This commit is contained in:
wh 2018-01-24 10:40:38 +08:00
parent 5fa28b2360 e07a22189d
commit c828574b19
13 changed files with 554 additions and 651 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
CHANGELOG.md
View File

@ -1,10 +1,11 @@
<a name="1.0.0"></a>
# 1.0.0 (2017-11-02)
<a name="1.0.3"></a>
## 1.0.3 (2018-01-24)
### Bug Fixes
* **解决配置冲突:** 解决配置冲突 ([fb15e37](https://github.com/tinper-bee/bee-tree/commit/fb15e37))
* checkStrictly ([5fa28b2](https://github.com/tinper-bee/bee-tree/commit/5fa28b2))
### build

13
build/Tree.js
View File

@ -249,20 +249,27 @@ var Tree = function (_React$Component) {
checked: checked
};
if (this.props.checkStrictly && 'checkedKeys' in this.props) {
if (this.props.checkStrictly) {
if (checked && index === -1) {
checkedKeys.push(key);
}
if (!checked && index > -1) {
checkedKeys.splice(index, 1);
}
this.treeNodesStates[treeNode.props.pos].checked = checked;
newSt.checkedNodes = [];
(0, _util.loopAllChildren)(this.props.children, function (item, ind, pos, keyOrPos) {
if (checkedKeys.indexOf(keyOrPos) !== -1) {
newSt.checkedNodes.push(item);
}
});
this.props.onCheck((0, _util.getStrictlyValue)(checkedKeys, this.props.checkedKeys.halfChecked), newSt);
if (!('checkedKeys' in this.props)) {
this.setState({
checkedKeys: checkedKeys
});
}
var halfChecked = this.props.checkedKeys ? this.props.checkedKeys.halfChecked : [];
this.props.onCheck((0, _util.getStrictlyValue)(checkedKeys, halfChecked), newSt);
} else {
if (checked && index === -1) {
this.treeNodesStates[treeNode.props.pos].checked = true;
@ -543,7 +550,7 @@ var Tree = function (_React$Component) {
if (state.checkedKeys) {
cloneProps.checked = state.checkedKeys.indexOf(key) !== -1 || false;
}
if (props.checkedKeys.halfChecked) {
if (props.checkedKeys && props.checkedKeys.halfChecked) {
cloneProps.halfChecked = props.checkedKeys.halfChecked.indexOf(key) !== -1 || false;
} else {
cloneProps.halfChecked = false;

16
demo/TreeDemo.scss
View File

@ -5,19 +5,5 @@
@import "../node_modules/bee-button/src/Button.scss";
@import "../node_modules/bee-transition/src/Transition.scss";
@import "../node_modules/bee-form-control/src/FormControl.scss";
.u-tree-searchable-filter {
color: #f50;
transition: all .3s ease;
}
.title-middle {
display: inline-block;
vertical-align: middle;
}
.edit-icon {
float:right;
font-size: 14px;
}
.title-con {
min-width: 150px;
}

4
demo/demolist/Demo1.js
View File

@ -42,8 +42,8 @@ class Demo1 extends Component {
defaultExpandedKeys={this.state.defaultExpandedKeys}
defaultSelectedKeys={this.state.defaultSelectedKeys}
// defaultCheckedKeys = {this.state.defaultCheckedKeys}
checkedKeys={checkedKeys}
checkStrictly = {true}
// checkedKeys={checkedKeys}
checkStrictly
onSelect={this.onSelect} onCheck={this.onCheck}
>

4
demo/demolist/Demo4.scss Normal file
View File

@ -0,0 +1,4 @@
.u-tree-searchable-filter {
color: #f50;
transition: all .3s ease;
}

11
demo/demolist/Demo8.scss Normal file
View File

@ -0,0 +1,11 @@
.title-middle {
display: inline-block;
vertical-align: middle;
}
.edit-icon {
float:right;
font-size: 14px;
}
.title-con {
min-width: 150px;
}

100
demo/index-demo-base.js
View File

@ -1,41 +1,9 @@
import { Con, Row, Col } from 'bee-layout';
import { Panel } from 'bee-panel';
import {Col, Row} from 'bee-layout';
import {Panel} from 'bee-panel';
import Button from 'bee-button';
import React, { Component } from 'react';
import React, {Component} from 'react';
import ReactDOM from 'react-dom';
import FormControl from 'bee-form-control';
import Tree from '../src';
const x = 3;
const y = 2;
const z = 1;
const gData = [];
const generateData = (_level, _preKey, _tns) => {
const preKey = _preKey || '0';
const tns = _tns || gData;
const children = [];
for (let i = 0; i < x; i++) {
const key = `${preKey}-${i}`;
tns.push({ title: key, key });
if (i < y) {
children.push(key);
}
}
if (_level < 0) {
return tns;
}
const level = _level - 1;
children.forEach((key, index) => {
tns[index].children = [];
return generateData(level, key, tns[index].children);
});
};
generateData(z);
const TreeNode = Tree.TreeNode;
const CARET = <i className="uf uf-arrow-down"></i>;
@ -45,46 +13,40 @@ const CARETUP = <i className="uf uf-arrow-up"></i>;
{demolist}
class Demo extends Component {
constructor(props){
constructor(props) {
super(props);
this.state = {
open: false
}
this.handleClick = this.handleClick.bind(this);
}
handleClick() {
this.setState({ open: !this.state.open })
this.setState({open: !this.state.open})
}
render () {
const { title, example, code, desc } = this.props;
render() {
const {title, example, code, desc, scss_code} = this.props;
let caret = this.state.open ? CARETUP : CARET;
let text = this.state.open ? "隐藏代码" : "查看代码";
const footer = (
<Button shape="block" onClick={ this.handleClick }>
{ caret }
{ text }
</Button>
);
const header = (
<Row>
<Col md={11}>
{ example }
</Col>
<Col md={1}>
<Button shape="icon" onClick={ this.handleClick }>
{ caret }
<div>
{example}
<Button style={{"marginTop": "10px"}} shape="block" onClick={this.handleClick}>
{caret}
{text}
</Button>
</Col>
</Row>
</div>
);
return (
<Col md={12} >
<h3>{ title }</h3>
<p>{ desc }</p>
<Panel collapsible headerContent expanded={ this.state.open } colors='bordered' header={ header } footer={footer} footerStyle = {{padding: 0}}>
<pre><code className="hljs javascript">{ code }</code></pre>
<Col md={12}>
<h3>{title}</h3>
<p>{desc}</p>
<Panel collapsible headerContent expanded={this.state.open} colors='bordered' header={header}
footerStyle={{padding: 0}}>
<pre><code className="hljs javascript">{code}</code></pre>
{!!scss_code ? <pre><code className="hljs css">{scss_code}</code></pre> : null}
</Panel>
</Col>
)
@ -92,20 +54,22 @@ class Demo extends Component {
}
class DemoGroup extends Component {
constructor(props){
constructor(props) {
super(props)
}
render () {
render() {
return (
<Row>
{DemoArray.map((child,index) => {
<Row>
{DemoArray.map((child, index) => {
return (
<Demo example= {child.example} title= {child.title} code= {child.code} desc= {child.desc} key= {index}/>
)
return (
<Demo example={child.example} title={child.title} code={child.code} scss_code={child.scss_code}
desc={child.desc} key={index}/>
)
})}
</Row>
})}
</Row>
)
}
}

102
demo/index.js
View File

File diff suppressed because one or more lines are too long

2
dist/demo.css.map vendored
View File

File diff suppressed because one or more lines are too long

924
dist/demo.js vendored
View File

File diff suppressed because one or more lines are too long

2
dist/demo.js.map vendored
View File

File diff suppressed because one or more lines are too long

7
package.json
View File

@ -1,6 +1,6 @@
{
"name": "bee-tree",
"version": "1.0.1",
"version": "1.0.3",
"description": "Tree ui component for react",
"keywords": [
"react",
@ -39,9 +39,7 @@
"dependencies": {
"babel-runtime": "^6.23.0",
"bee-animate": "^1.0.0",
"bee-checkbox": "^1.0.1",
"bee-form-control": "^1.0.2",
"bee-icon": "1.0.3",
"bee-checkbox": "^1.0.5",
"classnames": "^2.2.5",
"tinper-bee-core": "latest"
},
@ -55,6 +53,7 @@
"bee-button": "latest",
"bee-layout": "latest",
"bee-panel": "latest",
"bee-icon": "1.0.3",
"chai": "^3.5.0",
"console-polyfill": "~0.2.1",
"cz-conventional-changelog": "^2.1.0",

15
src/Tree.js
View File

@ -220,7 +220,7 @@ class Tree extends React.Component {
checked,
};
if (this.props.checkStrictly && ('checkedKeys' in this.props)) {
if (this.props.checkStrictly) {
if (checked && index === -1) {
checkedKeys.push(key);
}
@ -234,7 +234,13 @@ class Tree extends React.Component {
newSt.checkedNodes.push(item);
}
});
this.props.onCheck(getStrictlyValue(checkedKeys, this.props.checkedKeys.halfChecked), newSt);
if (!('checkedKeys' in this.props)) {
this.setState({
checkedKeys,
});
}
const halfChecked = this.props.checkedKeys ? this.props.checkedKeys.halfChecked : [];
this.props.onCheck(getStrictlyValue(checkedKeys, halfChecked), newSt);
} else {
if (checked && index === -1) {
this.treeNodesStates[treeNode.props.pos].checked = true;
@ -265,9 +271,6 @@ class Tree extends React.Component {
}
this.props.onCheck(checkedKeys, newSt);
}
this.setState({
checkedKeys,
});
}
onSelect(treeNode) {
@ -518,7 +521,7 @@ class Tree extends React.Component {
if (state.checkedKeys) {
cloneProps.checked = state.checkedKeys.indexOf(key) !== -1 || false;
}
if (props.checkedKeys.halfChecked) {
if (props.checkedKeys && props.checkedKeys.halfChecked) {
cloneProps.halfChecked = props.checkedKeys.halfChecked.indexOf(key) !== -1 || false;
} else {
cloneProps.halfChecked = false;