index.js
5.08 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
import React from 'react'
import {Table} from 'antd'
import "./index.less"
export default class ETable extends React.Component {
state = {}
//处理行点击事件
onRowClick = (record, index) => {
let rowSelection = this.props.rowSelection;
if(rowSelection == 'checkbox'){
let selectedRowKeys = this.props.selectedRowKeys;
let selectedIds = this.props.selectedIds;
let selectedItem = this.props.selectedItem || [];
if (selectedIds) {
const i = selectedIds.indexOf(record.id);
if (i == -1) {//避免重复添加
selectedIds.push(record.id)
selectedRowKeys.push(index);
selectedItem.push(record);
}else{
selectedIds.splice(i,1);
selectedRowKeys.splice(i,1);
selectedItem.splice(i,1);
}
} else {
selectedIds = [record.id];
selectedRowKeys = [index]
selectedItem = [record];
}
this.props.updateSelectedItem(selectedRowKeys,selectedItem || {},selectedIds);
}else{
let selectKey = [index];
const selectedRowKeys = this.props.selectedRowKeys;
if (selectedRowKeys && selectedRowKeys[0] == index){
return;
}
this.props.updateSelectedItem(selectKey,record || {});
}
};
// 选择框变更
onSelectChange = (selectedRowKeys, selectedRows) => {
let rowSelection = this.props.rowSelection;
console.log(rowSelection);
const selectedIds = [];
if(rowSelection == 'checkbox'){
selectedRows.map((item)=>{
selectedIds.push(item.id);
});
this.setState({
selectedRowKeys,
selectedIds:selectedIds,
selectedItem: selectedRows[0]
});
}
this.props.updateSelectedItem(selectedRowKeys,selectedRows[0],selectedIds);
};
onSelectAll = (selected, selectedRows, changeRows) => {
let selectedIds = [];
let selectKey = [];
selectedRows.forEach((item,i)=> {
selectedIds.push(item.id);
selectKey.push(i);
});
this.props.updateSelectedItem(selectKey,selectedRows[0] || {},selectedIds);
}
getOptions = () => {
let p = this.props;
const name_list = {
"订单编号":170,
"车辆编号":80,
"手机号码":96,
"用户姓名":70,
"密码":70,
"运维区域":300,
"车型":42,
"故障编号":76,
"代理商编码":97,
"角色ID":64
};
if (p.columns && p.columns.length > 0) {
p.columns.forEach((item)=> {
//开始/结束 时间
if(!item.title){
return
}
if(!item.width){
if(item.title.indexOf("时间") > -1 && item.title.indexOf("持续时间") < 0){
item.width = 132
}else if(item.title.indexOf("图片") > -1){
item.width = 86
}else if(item.title.indexOf("权限") > -1 || item.title.indexOf("负责城市") > -1){
item.width = '40%';
item.className = "text-left";
}else{
if(name_list[item.title]){
item.width = name_list[item.title];
}
}
}
item.bordered = true;
});
}
const { selectedRowKeys } = this.props;
const rowSelection = {
type: 'radio',
selectedRowKeys,
onChange: this.onSelectChange,
onSelect:(record, selected, selectedRows)=>{
console.log('...')
},
onSelectAll:this.onSelectAll
};
let row_selection = this.props.rowSelection;
// 当属性未false或者null时，说明没有单选或者复选列
if(row_selection===false || row_selection === null){
row_selection = false;
}else if(row_selection == 'checkbox'){
//设置类型未复选框
rowSelection.type = 'checkbox';
}else{
//默认未单选
row_selection = 'radio';
}
return <Table
className="card-wrap page-table"
bordered
{...this.props}
rowSelection={row_selection?rowSelection:null}
onRow={(record,index) => ({
onClick: ()=>{
if(!row_selection){
return;
}
this.onRowClick(record,index)
}
})}
/>
};
render = () => {
return (
<div>
{this.getOptions()}
</div>
)
}
}