修改示例编号
This commit is contained in:
parent
6ac110422c
commit
9bb8194716
|
@ -60,7 +60,7 @@ class Demo22 extends Component {
|
|||
render() {
|
||||
return (
|
||||
<div className="demo22">
|
||||
<Button className="opt-btns" colors="primary" onClick={() => this.fetch()}>点击加载远程数据</Button>
|
||||
<Button className="opt-btns" colors="secondary" onClick={() => this.fetch()}>点击加载远程数据</Button>
|
||||
<Table
|
||||
columns={columns}
|
||||
data={this.state.data}
|
|
@ -0,0 +1,124 @@
|
|||
/**
|
||||
*
|
||||
* @title 列合计(总计)
|
||||
* @parent 列渲染 Custom Render
|
||||
* @description 给需要计算合计的列(columns),设置sumCol值为true即可,支持动态设置数据源。
|
||||
*
|
||||
*/
|
||||
|
||||
import React, { Component } from "react";
|
||||
import {Button,Checkbox} from "tinper-bee";
|
||||
import Table from "../../src";
|
||||
import sum from "../../src/lib/sum.js";
|
||||
import multiSelect from "../../src/lib/multiSelect.js";
|
||||
|
||||
let ComplexTable = multiSelect(sum(Table), Checkbox);
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: "单据编号",
|
||||
dataIndex: "num",
|
||||
key: "num",
|
||||
width: 120,
|
||||
fixed: "left"
|
||||
},
|
||||
{
|
||||
title: "单据日期",
|
||||
dataIndex: "date",
|
||||
key: "date",
|
||||
width: 200,
|
||||
},
|
||||
{
|
||||
title: "业务类型",
|
||||
dataIndex: "type",
|
||||
key: "type",
|
||||
width: 200
|
||||
},
|
||||
{
|
||||
title: "供应商",
|
||||
dataIndex: "supplier",
|
||||
key: "supplier",
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
title: "联系人",
|
||||
dataIndex: "contact",
|
||||
key: "contact",
|
||||
},
|
||||
{
|
||||
title: "仓库",
|
||||
dataIndex: "warehouse",
|
||||
key: "warehouse",
|
||||
width: 80,
|
||||
},
|
||||
{
|
||||
title: "整单数量",
|
||||
dataIndex: "total",
|
||||
key: "total",
|
||||
width: 100,
|
||||
sumCol: true
|
||||
},
|
||||
{
|
||||
title: "金额",
|
||||
dataIndex: "money",
|
||||
key: "money",
|
||||
width: 100,
|
||||
sumCol: true
|
||||
}
|
||||
];
|
||||
|
||||
function getData(){
|
||||
const data = [];
|
||||
for (let i = 0; i < 5; i++) {
|
||||
data.push({
|
||||
key: i,
|
||||
num: "NU039100"+i,
|
||||
date: "2019-03-01",
|
||||
type: "普通采购",
|
||||
supplier: "gys"+i,
|
||||
contact: "Tom",
|
||||
warehouse: "普通仓",
|
||||
total: i + Math.floor(Math.random()*10),
|
||||
money: 20 * Math.floor(Math.random()*10)
|
||||
});
|
||||
}
|
||||
return data;
|
||||
}
|
||||
|
||||
class Demo35 extends Component {
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
data: getData()
|
||||
};
|
||||
}
|
||||
|
||||
changeData = ()=>{
|
||||
this.setState({
|
||||
data: getData()
|
||||
});
|
||||
}
|
||||
|
||||
render() {
|
||||
const {data} = this.state;
|
||||
return (
|
||||
<div>
|
||||
<Button
|
||||
className="editable-add-btn"
|
||||
onClick={this.changeData}
|
||||
>
|
||||
动态设置数据源
|
||||
</Button>
|
||||
|
||||
<ComplexTable
|
||||
columns={columns}
|
||||
data={data}
|
||||
bordered
|
||||
// scroll={{ x: "130%", y: 140 }}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
export default Demo35;
|
|
@ -116,7 +116,7 @@ class Demo13 extends Component {
|
|||
return (
|
||||
<div>
|
||||
<Button className="editable-add-btn" onClick={this.onClick}>
|
||||
change selectedRow
|
||||
清空已选
|
||||
</Button>
|
||||
<ComplexTable
|
||||
selectDisabled={this.state.selectDisabled}
|
|
@ -114,7 +114,7 @@ const data = [{
|
|||
class Demo15 extends Component {
|
||||
render() {
|
||||
return (
|
||||
<Table columns={columns} data={data}/>
|
||||
<Table columns={columns} data={data} bordered/>
|
||||
);
|
||||
}
|
||||
}
|
|
@ -1,145 +0,0 @@
|
|||
/**
|
||||
*
|
||||
* @title 合并列后合计
|
||||
* @parent 列渲染 Custom Render
|
||||
* @description 合并标题后的合计,且支持多字段统计(通过使用的封装好的功能方法实现复杂功能,简单易用!)
|
||||
*
|
||||
*/
|
||||
|
||||
import React, { Component } from "react";
|
||||
import {Button} from "tinper-bee";
|
||||
import Table from "../../src";
|
||||
import sum from "../../src/lib/sum.js";
|
||||
|
||||
let ComplexTable = sum(Table);
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: "Name",
|
||||
dataIndex: "name",
|
||||
key: "name",
|
||||
width: 120,
|
||||
fixed: "left"
|
||||
},
|
||||
{
|
||||
title: "Other",
|
||||
children: [
|
||||
{
|
||||
title: "Age",
|
||||
dataIndex: "age",
|
||||
key: "age",
|
||||
width: 200,
|
||||
sumCol: true,
|
||||
},
|
||||
{
|
||||
title: "Address",
|
||||
children: [
|
||||
{
|
||||
title: "Street",
|
||||
dataIndex: "street",
|
||||
key: "street",
|
||||
width: 200
|
||||
},
|
||||
{
|
||||
title: "Block",
|
||||
children: [
|
||||
{
|
||||
title: "Building",
|
||||
dataIndex: "building",
|
||||
key: "building",
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
title: "Door No.",
|
||||
dataIndex: "number",
|
||||
key: "number",
|
||||
// width: 100,
|
||||
sumCol: true,
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
// {
|
||||
// title: "Company",
|
||||
// children: [
|
||||
// {
|
||||
// title: "Company Address",
|
||||
// dataIndex: "companyAddress",
|
||||
// key: "companyAddress",
|
||||
// width: 100,
|
||||
// },
|
||||
// {
|
||||
// title: "Company Name",
|
||||
// dataIndex: "companyName",
|
||||
// key: "companyName",
|
||||
// width: 100,
|
||||
// }
|
||||
// ]
|
||||
// },
|
||||
{
|
||||
title: "Gender",
|
||||
dataIndex: "gender",
|
||||
key: "gender",
|
||||
width: 80,
|
||||
fixed: "right"
|
||||
}
|
||||
];
|
||||
|
||||
function getData(){
|
||||
const data = [];
|
||||
for (let i = 0; i < 5; i++) {
|
||||
data.push({
|
||||
key: i,
|
||||
name: "John Brown"+i,
|
||||
age: i + Math.floor(Math.random()*10),
|
||||
street: "Lake Park",
|
||||
building: "C",
|
||||
number: 20 * Math.floor(Math.random()*10),
|
||||
companyAddress: "Lake Street 42",
|
||||
companyName: "SoftLake Co",
|
||||
gender: "M"
|
||||
});
|
||||
}
|
||||
return data;
|
||||
}
|
||||
|
||||
class Demo35 extends Component {
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
data: getData()
|
||||
};
|
||||
}
|
||||
|
||||
changeData = ()=>{
|
||||
this.setState({
|
||||
data: getData()
|
||||
});
|
||||
}
|
||||
|
||||
render() {
|
||||
const {data} = this.state;
|
||||
return (
|
||||
<div>
|
||||
<Button
|
||||
className="editable-add-btn"
|
||||
onClick={this.changeData}
|
||||
>
|
||||
动态设置数据源
|
||||
</Button>
|
||||
|
||||
<ComplexTable
|
||||
columns={columns}
|
||||
data={data}
|
||||
bordered
|
||||
// scroll={{ x: "130%", y: 140 }}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
export default Demo35;
|
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue