修改demo中的描述

2017-10-25 16:41:38 +08:00 · 2017-10-25 16:41:38 +08:00 · 69d55a12e5
parent 67dfe113bd
commit 69d55a12e5
10 changed files with 308 additions and 331 deletions
--- a/build/render/InputRender.js
+++ b/build/render/InputRender.js
@ -55,14 +55,32 @@ var InputRender = function (_Component) {
      if (event.keyCode == 13) {
        _this.check();
      }
+    }, _this.formatCurrency = function (money) {
+      if (money && money != null && !!Number(money)) {
+        money = String(money);
+        var left = money.split(".")[0],
+            right = money.split(".")[1];
+        right = right ? right.length >= 2 ? "." + right.substr(0, 2) : "." + right + "0" : ".00";
+        var temp = left.split("").reverse().join("").match(/(\d{1,3})/g);
+        return (Number(money) < 0 ? "-" : "") + temp.join(",").split("").reverse().join("") + right;
+      } else if (money === 0) {
+        //注意===在这里的使用，如果传入的money为0,if中会将其判定为boolean类型，故而要另外做===判断
+        return "0.00";
+      } else {
+        return "";
+      }
    }, _temp), _possibleConstructorReturn(_this, _ret);
  }
+  //货币的格式化方法
+

  InputRender.prototype.render = function render() {
    var _state = this.state,
        value = _state.value,
        editable = _state.editable;
-    var isclickTrigger = this.props.isclickTrigger;
+    var _props = this.props,
+        isclickTrigger = _props.isclickTrigger,
+        format = _props.format;

    var cellContent = "";
    if (editable) {
@ -91,6 +109,9 @@ var InputRender = function (_Component) {
        })
      );
    } else {
+      if (format && format === "Currency") {
+        value = this.formatCurrency(value);
+      }
      cellContent = isclickTrigger ? _react2["default"].createElement(
        "div",
        { className: "editable-cell-text-wrapper", onClick: this.edit },
--- a/demo/demolist/Demo1.js
+++ b/demo/demolist/Demo1.js
@ -5,39 +5,49 @@
 *
 */

-import React, { Component } from 'react';
-import Table from '../../src';
-
+import React, { Component } from "react";
+import Table from "../../src";

 const columns = [
-  { title: '用户名', dataIndex: 'a', key: 'a', width: 100 },
-  { id: '123', title: '性别', dataIndex: 'b', key: 'b', width: 100 },
-  { title: '年龄', dataIndex: 'c', key: 'c', width: 200 },
+  { title: "用户名", dataIndex: "a", key: "a", width: 100 },
+  { id: "123", title: "性别", dataIndex: "b", key: "b", width: 100 },
+  { title: "年龄", dataIndex: "c", key: "c", width: 200 },
  {
-    title: '操作', dataIndex: '', key: 'd', render() {
-      return <a href="#">一些操作</a>;
-    },
-  },
+    title: "操作",
+    dataIndex: "d",
+    key: "d",
+    render(text, record, index) {
+      return (
+        <a
+          href="#"
+          onClick={() => {
+            alert('这是第'+index+'列，内容为:'+text);
+          }}
+        >
+          一些操作
+        </a>
+      );
+    }
+  }
 ];

 const data = [
-  { a: '令狐冲', b: '男', c: 41, key: '1' },
-  { a: '杨过', b: '男', c: 67, key: '2' },
-  { a: '郭靖', b: '男', c: 25, key: '3' },
+  { a: "令狐冲", b: "男", c: 41, d: "操作", key: "1" },
+  { a: "杨过", b: "男", c: 67, d: "操作", key: "2" },
+  { a: "郭靖", b: "男", c: 25, d: "操作", key: "3" }
 ];

 class Demo1 extends Component {
-    render () {
-        return (
-              <Table
-              columns={columns}
-              data={data}
-              title={currentData => <div>标题: 这是一个标题</div>}
-              footer={currentData => <div>表尾: 我是小尾巴</div>}
-              />
-        )
-    }
+  render() {
+    return (
+      <Table
+        columns={columns}
+        data={data}
+        title={currentData => <div>标题: 这是一个标题</div>}
+        footer={currentData => <div>表尾: 我是小尾巴</div>}
+      />
+    );
+  }
 }

 export default Demo1;
-
--- a/demo/demolist/Demo11.js
+++ b/demo/demolist/Demo11.js
@ -31,19 +31,16 @@ const columns11 = [
    sorter: (a, b) => a.c - b.c
  },
  {
-    title: "操作",
-    dataIndex: "",
-    key: "d",
-    render() {
-      return <a href="#">一些操作</a>;
-    }
+    title: "武功级别",
+    dataIndex: "d",
+    key: "d"
  }
 ];

 const data11 = [
-  { a: "杨过", b: "男", c: 30, key: "2" },
-  { a: "令狐冲", b: "男", c: 41, key: "1" },
-  { a: "郭靖", b: "男", c: 25, key: "3" }
+  { a: "杨过", b: "男", c: 30,d:'内行', key: "2" },
+  { a: "令狐冲", b: "男", c: 41,d:'大侠', key: "1" },
+  { a: "郭靖", b: "男", c: 25,d:'大侠', key: "3" }
 ];

 const defaultProps11 = {
--- a/demo/demolist/Demo12.js
+++ b/demo/demolist/Demo12.js
@ -31,19 +31,16 @@ const columns12 = [
    sorter: (a, b) => a.c - b.c
  },
  {
-    title: "操作",
-    dataIndex: "",
-    key: "d",
-    render() {
-      return <a href="#">一些操作</a>;
-    }
+    title: "武功级别",
+    dataIndex: "d",
+    key: "d"
  }
 ];

 const data12 = [
-  { a: "杨过", b: "男", c: 30, key: "2" },
-  { a: "令狐冲", b: "男", c: 41, key: "1" },
-  { a: "郭靖", b: "男", c: 25, key: "3" }
+  { a: "杨过", b: "男", c: 30,d:'内行', key: "2" },
+  { a: "令狐冲", b: "男", c: 41,d:'大侠', key: "1" },
+  { a: "郭靖", b: "男", c: 25,d:'大侠', key: "3" }
 ];

 const defaultProps12 = {
--- a/demo/demolist/Demo13.js
+++ b/demo/demolist/Demo13.js
@ -34,19 +34,16 @@ const columns13 = [
    sorter: (a, b) => a.c - b.c
  },
  {
-    title: "操作",
-    dataIndex: "",
-    key: "d",
-    render() {
-      return <a href="#">一些操作</a>;
-    }
+    title: "武功级别",
+    dataIndex: "d",
+    key: "d"
  }
 ];

 const data13 = [
-  { a: "杨过", b: "男", c: 30, key: "2" },
-  { a: "令狐冲", b: "男", c: 41, key: "1" },
-  { a: "郭靖", b: "男", c: 25, key: "3" }
+  { a: "杨过", b: "男", c: 30,d:'内行', key: "2" },
+  { a: "令狐冲", b: "男", c: 41,d:'大侠', key: "1" },
+  { a: "郭靖", b: "男", c: 25,d:'大侠', key: "3" }
 ];
 class Demo13 extends Component {
  getSelectedDataFunc = (data) =>{
--- a/demo/demolist/Demo14.js
+++ b/demo/demolist/Demo14.js
@ -42,7 +42,6 @@ class Demo14 extends React.Component {
          address: "111",
          datepicker: "2017-06-12",
          MonthPicker: "2017-02",
-          TimePicker: "2017-09-14 14:24:48"
        },
        {
          key: "1",
@ -52,7 +51,6 @@ class Demo14 extends React.Component {
          address: "lucy",
          datepicker: "2017-06-12",
          MonthPicker: "2017-02",
-          TimePicker: "2017-09-14 14:24:48"
        },
        {
          key: "2",
@ -62,7 +60,6 @@ class Demo14 extends React.Component {
          address: "lucy",
          datepicker: "2017-06-12",
          MonthPicker: "2017-02",
-          TimePicker: "2017-09-14 14:24:48"
        },
        {
          key: "3",
@ -72,7 +69,6 @@ class Demo14 extends React.Component {
          address: "lucy",
          datepicker: "2017-06-12",
          MonthPicker: "2017-02",
-          TimePicker: "2017-09-14 14:24:48"
        }
      ],
      count: 4
@ -174,23 +170,6 @@ class Demo14 extends React.Component {
            />
          );
        }
-      },
-      {
-        title: "日期",
-        dataIndex: "TimePicker",
-        key: "TimePicker",
-        render: (text, record, index) => {
-          return (
-            <DateRender
-              value={text}
-              format={format3}
-              isclickTrigger={true}
-              onSelect={this.onDateSelect}
-              onChange={this.onDateChange}
-              placeholder={dateInputPlaceholder}
-            />
-          );
-        }
      }
    ];
  }
@ -233,8 +212,7 @@ class Demo14 extends React.Component {
      age: 32,
      address: "jack",
      datepicker: "2017-06-12",
-      MonthPicker: "2017-02",
-      TimePicker: "2017-09-14 14:24:48"
+      MonthPicker: "2017-02"
    };
    this.setState({
      dataSource: [...dataSource, newData],
--- a/demo/demolist/Demo7.js
+++ b/demo/demolist/Demo7.js
@ -5,91 +5,81 @@
 *
 */

-
-import React, {Component} from 'react';
-import Table from '../../src';
-
+import React, { Component } from "react";
+import Table from "../../src";

 const columns7 = [
-    {title: "班级", dataIndex: "a", key: "a"},
-    {title: "人数", dataIndex: "b", key: "b"},
-    {title: "班主任", dataIndex: "c", key: "c"},
-    {
-        title: "操作",
-        dataIndex: "",
-        key: "d",
-        render() {
-            return <a href="#">一些操作</a>;
-        }
-    }
+  { title: "班级", dataIndex: "a", key: "a" },
+  { title: "人数", dataIndex: "b", key: "b" },
+  { title: "班主任", dataIndex: "c", key: "c" },
+  {
+    title: "武功级别",
+    dataIndex: "d",
+    key: "d"
+  }
 ];

 const data7 = [
-
-    {a: "02级一班", b: "2", c: "欧阳锋", key: "1"},
-    {a: "03级二班", b: "3", c: "归海一刀", key: "2"},
-    {a: "05级三班", b: "1", c: "一拳超人", key: "3"}
+  { a: "02级一班", b: "2", c: "欧阳锋", d: "大侠", key: "1" },
+  { a: "03级二班", b: "3", c: "归海一刀", d: "大侠", key: "2" },
+  { a: "05级三班", b: "1", c: "一拳超人", d: "愣头青", key: "3" }
 ];

 const columns7_1 = [
-    {title: "姓名", dataIndex: "a", key: "a"},
-    {title: "班级", dataIndex: "b", key: "b"},
-    {title: "系别", dataIndex: "c", key: "c"}
+  { title: "姓名", dataIndex: "a", key: "a" },
+  { title: "班级", dataIndex: "b", key: "b" },
+  { title: "系别", dataIndex: "c", key: "c" }
 ];

 class Demo7 extends Component {
-    constructor(props) {
-        super(props);
-        this.state = {
-            children_data: []
-        }
-    }
+  constructor(props) {
+    super(props);
+    this.state = {
+      children_data: []
+    };
+  }

-    rowclick = (record, index) => {
-
-        if (record.a === '02级一班') {
-            this.setState({
-                children_data: [
-                    {a: "郭靖", b: "02级一班", c: '文学系', key: "1"},
-                    {a: "黄蓉", b: "02级一班", c: '文学系', key: "2"},
-                ]
-            })
-        } else if (record.a === '03级二班') {
-            this.setState({
-                children_data: [
-                    {a: "杨过", b: "03级二班", c: '外语系', key: "1"},
-                    {a: "小龙女", b: "03级二班", c: '外语系', key: "2"},
-                    {a: "傻姑", b: "03级二班", c: '外语系', key: "3"},
-                ]
-            })
-        } else if (record.a === '05级三班') {
-            this.setState({
-                children_data: [
-                    {a: "金圣叹", b: "05级三班", c: '美术系', key: "1"}
-                ]
-            })
-        }
+  rowclick = (record, index) => {
+    if (record.a === "02级一班") {
+      this.setState({
+        children_data: [
+          { a: "郭靖", b: "02级一班", c: "文学系", key: "1" },
+          { a: "黄蓉", b: "02级一班", c: "文学系", key: "2" }
+        ]
+      });
+    } else if (record.a === "03级二班") {
+      this.setState({
+        children_data: [
+          { a: "杨过", b: "03级二班", c: "外语系", key: "1" },
+          { a: "小龙女", b: "03级二班", c: "外语系", key: "2" },
+          { a: "傻姑", b: "03级二班", c: "外语系", key: "3" }
+        ]
+      });
+    } else if (record.a === "05级三班") {
+      this.setState({
+        children_data: [{ a: "金圣叹", b: "05级三班", c: "美术系", key: "1" }]
+      });
    }
+  };

-    render() {
-        return (
-            <div>
-                <Table
-                    columns={columns7}
-                    data={data7}
-                    onRowClick={this.rowclick}
-                    title={currentData => <div>标题: 我是主表</div>}
-                />
-                <Table
-                    style={{marginTop: 40}}
-                    columns={columns7_1}
-                    data={this.state.children_data}
-                    title={currentData => <div>标题: 我是子表</div>}
-                />
-            </div>
-        );
-    }
+  render() {
+    return (
+      <div>
+        <Table
+          columns={columns7}
+          data={data7}
+          onRowClick={this.rowclick}
+          title={currentData => <div>标题: 我是主表</div>}
+        />
+        <Table
+          style={{ marginTop: 40 }}
+          columns={columns7_1}
+          data={this.state.children_data}
+          title={currentData => <div>标题: 我是子表</div>}
+        />
+      </div>
+    );
+  }
 }

-
 export default Demo7;
--- a/demo/demolist/Demo8.js
+++ b/demo/demolist/Demo8.js
@ -6,73 +6,67 @@
 *import {Table} from 'tinper-bee';
 */

+import React, { Component } from "react";

-import React, {Component} from 'react';
-
-import Table from '../../src';
+import Table from "../../src";
 import Pagination from "bee-pagination";

-
 const columns8 = [
-    {title: "用户名", dataIndex: "a", key: "a", width: 100},
-    {id: "123", title: "性别", dataIndex: "b", key: "b", width: 100},
-    {title: "年龄", dataIndex: "c", key: "c", width: 200},
-    {
-        title: "操作",
-        dataIndex: "",
-        key: "d",
-        render() {
-            return <a href="#">一些操作</a>;
-        }
-    }
+  { title: "姓名", dataIndex: "a", key: "a", width: 100 },
+  { id: "123", title: "性别", dataIndex: "b", key: "b", width: 100 },
+  { title: "年龄", dataIndex: "c", key: "c", width: 200 },
+  {
+    title: "武功级别",
+    dataIndex: "d",
+    key: "d"
+  }
 ];

 const pageData = {
-    1: [
-        {a: "令狐冲", b: "男", c: 41, key: "1"},
-        {a: "杨过", b: "男", c: 67, key: "2"},
-        {a: "郭靖", b: "男", c: 25, key: "3"}
-    ],
-    2: [
-        {a: "芙蓉姐姐", b: "女", c: 23, key: "1"},
-        {a: "芙蓉姐姐", b: "女", c: 23, key: "2"}
-    ]
-}
-
-
+  1: [
+    { a: "杨过", b: "男", c: 30, d: "内行", key: "2" },
+    { a: "令狐冲", b: "男", c: 41, d: "大侠", key: "1" },
+    { a: "郭靖", b: "男", c: 25, d: "大侠", key: "3" }
+  ],
+  2: [
+    { a: "芙蓉姐姐", b: "女", c: 23, d: "大侠", key: "1" },
+    { a: "芙蓉妹妹", b: "女", c: 23, d: "内行", key: "2" }
+  ]
+};

 class Demo8 extends Component {
-    constructor(props) {
-        super(props);
-        this.state = {
-            data: pageData[1],
-            activePage: 1
-        };
-    }
+  constructor(props) {
+    super(props);
+    this.state = {
+      data: pageData[1],
+      activePage: 1
+    };
+  }

-    handleSelect(eventKey) {
-        this.setState({
-            data: pageData[eventKey],
-            activePage: eventKey
-        })
-    }
+  handleSelect(eventKey) {
+    this.setState({
+      data: pageData[eventKey],
+      activePage: eventKey
+    });
+  }

-    render() {
-        return (
-            <div>
-                <Table columns={columns8} data={this.state.data}/>
-                <Pagination
-                    first
-                    last
-                    prev
-                    next
-                    boundaryLinks
-                    items={2}
-                    maxButtons={5}
-                    activePage={this.state.activePage}
-                    onSelect={this.handleSelect.bind(this)}/>
-            </div>
-        );
-    }
+  render() {
+    return (
+      <div>
+        <Table columns={columns8} data={this.state.data} />
+        <Pagination
+          first
+          last
+          prev
+          next
+          boundaryLinks
+          items={2}
+          maxButtons={5}
+          activePage={this.state.activePage}
+          onSelect={this.handleSelect.bind(this)}
+        />
+      </div>
+    );
+  }
 }
-export default Demo8;
+export default Demo8;
--- a/demo/demolist/Demo9.js
+++ b/demo/demolist/Demo9.js
@ -7,164 +7,157 @@
 * import {Table} from 'tinper-bee';
 */

-import React, {Component} from 'react';
+import React, { Component } from "react";

-import Table from '../../src';
+import Table from "../../src";
 import Icon from "bee-icon";
-import InputGroup from 'bee-input-group';
-import FormControl from 'bee-form-control';
-
+import InputGroup from "bee-input-group";
+import FormControl from "bee-form-control";

 class Search extends Component {
-    state = {
-        searchValue: "",
-        empty: false
-    };
+  state = {
+    searchValue: "",
+    empty: false
+  };

-    /**
+  /**
     * 搜索
     */
-    handleSearch = () => {
-        let {onSearch} = this.props;
-        this.setState({
-            empty: true
-        })
-        onSearch && onSearch(this.state.searchValue);
-    };
+  handleSearch = () => {
+    let { onSearch } = this.props;
+    this.setState({
+      empty: true
+    });
+    onSearch && onSearch(this.state.searchValue);
+  };

-    /**
+  /**
     * 捕获回车
     * @param e
     */
-    handleKeyDown = e => {
-        if (e.keyCode === 13) {
-            this.handleSearch();
-        }
-    };
+  handleKeyDown = e => {
+    if (e.keyCode === 13) {
+      this.handleSearch();
+    }
+  };

-    /**
+  /**
     * 输入框改变
     * @param e
     */
-    handleChange = e => {
-        this.setState({
-            searchValue: e.target.value
-        });
-    };
+  handleChange = e => {
+    this.setState({
+      searchValue: e.target.value
+    });
+  };

-    /**
+  /**
     * 清空输入框
     */
-    emptySearch = () => {
-        let {onEmpty} = this.props;
-        this.setState({
-            searchValue: "",
-            empty: false
-        });
-        onEmpty && onEmpty();
-    };
+  emptySearch = () => {
+    let { onEmpty } = this.props;
+    this.setState({
+      searchValue: "",
+      empty: false
+    });
+    onEmpty && onEmpty();
+  };

-    render() {
-        return (
-            <InputGroup simple className="search-component">
-                <FormControl
-                    onChange={this.handleChange}
-                    value={this.state.searchValue}
-                    onKeyDown={this.handleKeyDown}
-                    placeholder="请输入用户名"
-                    type="text"
-                />
-                {this.state.empty
-                    ? <Icon
-                        type="uf-close-c"
-                        onClick={this.emptySearch}
-                        className="empty-search"
-                    />
-                    : null}
+  render() {
+    return (
+      <InputGroup simple className="search-component">
+        <FormControl
+          onChange={this.handleChange}
+          value={this.state.searchValue}
+          onKeyDown={this.handleKeyDown}
+          placeholder="请输入用户名"
+          type="text"
+        />
+        {this.state.empty ? (
+          <Icon
+            type="uf-close-c"
+            onClick={this.emptySearch}
+            className="empty-search"
+          />
+        ) : null}

-                <InputGroup.Button onClick={this.handleSearch} shape="border">
-                    <Icon type="uf-search"/>
-                </InputGroup.Button>
-            </InputGroup>
-        );
-    }
+        <InputGroup.Button onClick={this.handleSearch} shape="border">
+          <Icon type="uf-search" />
+        </InputGroup.Button>
+      </InputGroup>
+    );
+  }
 }

 const columns9 = [
-    {
-        title: "用户名",
-        dataIndex: "a",
-        key: "a",
-        width: 100
-    },
-    {
-        title: "性别",
-        dataIndex: "b",
-        key: "b",
-        width: 100
-    },
-    {
-        title: "年龄",
-        dataIndex: "c",
-        key: "c",
-        width: 200
-    },
-    {
-        title: "操作",
-        dataIndex: "",
-        key: "d",
-        render() {
-            return <a href="#">一些操作</a>;
-        }
-    }
+  {
+    title: "姓名",
+    dataIndex: "a",
+    key: "a",
+    width: 100
+  },
+  {
+    title: "性别",
+    dataIndex: "b",
+    key: "b",
+    width: 100
+  },
+  {
+    title: "年龄",
+    dataIndex: "c",
+    key: "c",
+    width: 200
+  },
+  {
+    title: "武功级别",
+    dataIndex: "d",
+    key: "d"
+  }
 ];

 const userData = [
-    {a: "令狐冲", b: "男", c: 41, key: "1"},
-    {a: "杨过", b: "男", c: 67, key: "2"},
-    {a: "郭靖", b: "男", c: 25, key: "3"}
+  { a: "杨过", b: "男", c: 30, d: "内行", key: "2" },
+  { a: "令狐冲", b: "男", c: 41, d: "大侠", key: "1" },
+  { a: "郭靖", b: "男", c: 25, d: "大侠", key: "3" }
 ];

 class Demo9 extends Component {
-    constructor(props) {
-        super(props);
-        this.state = {
-            data: userData
-        };
-    }
+  constructor(props) {
+    super(props);
+    this.state = {
+      data: userData
+    };
+  }

-    handleSearch = (value) => {
-        if(value === ''){
-            return this.setState({
-                data: userData
-            })
-        }
-        let regExp = new RegExp(value, 'ig');
-        let data = userData.filter((item) => regExp.test(item.a));
-        this.setState({
-            data
-        })
+  handleSearch = value => {
+    if (value === "") {
+      return this.setState({
+        data: userData
+      });
    }
+    let regExp = new RegExp(value, "ig");
+    let data = userData.filter(item => regExp.test(item.a));
+    this.setState({
+      data
+    });
+  };

-    handleEmpty = () => {
-        this.setState({
-            data: userData
-        })
-    }
+  handleEmpty = () => {
+    this.setState({
+      data: userData
+    });
+  };

-    render() {
-        return (
-            <div>
-                <div className="clearfix">
-                    <Search
-                        onSearch={ this.handleSearch }
-                        onEmpty={ this.handleEmpty }
-                    />
-                </div>
-                <Table columns={columns9} data={this.state.data}/>
-            </div>
-        );
-    }
+  render() {
+    return (
+      <div>
+        <div className="clearfix">
+          <Search onSearch={this.handleSearch} onEmpty={this.handleEmpty} />
+        </div>
+        <Table columns={columns9} data={this.state.data} />
+      </div>
+    );
+  }
 }

-export default Demo9;
+export default Demo9;
--- a/demo/index.js
+++ b/demo/index.js