@clake/react-bootstrap4-window 0.5.3 → 0.6.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/react-bootstrap4-window.js +3 -3
- package/lib/CTable.js +138 -88
- package/lib/CTable.js.map +3 -3
- package/lib/CTableInput.js +2 -2
- package/lib/CTableInput.js.map +2 -2
- package/lib/Drag.js +2 -2
- package/lib/Drag.js.map +2 -2
- package/lib/IconButton.js +2 -2
- package/lib/IconButton.js.map +2 -2
- package/lib/PageBar.js +2 -2
- package/lib/PageBar.js.map +2 -2
- package/lib/TopMenu.js +2 -2
- package/lib/TopMenu.js.map +2 -2
- package/lib/WCalendar.js +2 -2
- package/lib/WCalendar.js.map +2 -2
- package/lib/WCombo.js +2 -2
- package/lib/WCombo.js.map +2 -2
- package/lib/WModal.js +2 -2
- package/lib/WModal.js.map +2 -2
- package/lib/Window.js +2 -2
- package/lib/Window.js.map +2 -2
- package/lib/WindowGroup.js +2 -2
- package/lib/WindowGroup.js.map +2 -2
- package/lib/css/CTable.less +11 -0
- package/lib/i18n/CTable.js +2 -2
- package/lib/i18n/CTable.js.map +2 -2
- package/lib/index.js +2 -2
- package/lib/index.js.map +2 -2
- package/package.json +1 -1
package/lib/CTable.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
/* @clake/react-bootstrap4-window v0.
|
|
1
|
+
/* @clake/react-bootstrap4-window v0.6.2 | by Clake
|
|
2
2
|
* Copyright (c) 2023 Clake,
|
|
3
|
-
* 2023-06-
|
|
3
|
+
* 2023-06-15T17:08:03+0800
|
|
4
4
|
*/
|
|
5
5
|
"use strict";
|
|
6
6
|
|
|
@@ -143,8 +143,9 @@ function (_React$Component) {
|
|
|
143
143
|
});
|
|
144
144
|
|
|
145
145
|
_defineProperty(_assertThisInitialized(_this), "editHandler", function (e, val, row) {
|
|
146
|
-
var
|
|
147
|
-
var
|
|
146
|
+
var dataset = row === 'chk' ? e.currentTarget.dataset : e.target.dataset;
|
|
147
|
+
var index = parseInt(dataset.row);
|
|
148
|
+
var field = dataset.field; //如果是check组件
|
|
148
149
|
|
|
149
150
|
if (row === 'chk') {
|
|
150
151
|
val = val ? 1 : 0;
|
|
@@ -256,7 +257,8 @@ function (_React$Component) {
|
|
|
256
257
|
this.setState({
|
|
257
258
|
data: nextProps.data,
|
|
258
259
|
dataCount: nextProps.dataCount,
|
|
259
|
-
page: nextProps.page
|
|
260
|
+
page: nextProps.page,
|
|
261
|
+
total: nextProps.total
|
|
260
262
|
});
|
|
261
263
|
}
|
|
262
264
|
}
|
|
@@ -267,6 +269,10 @@ function (_React$Component) {
|
|
|
267
269
|
return true;
|
|
268
270
|
}
|
|
269
271
|
|
|
272
|
+
if (nextState.total !== this.state.total) {
|
|
273
|
+
return true;
|
|
274
|
+
}
|
|
275
|
+
|
|
270
276
|
return nextState.data !== this.state.data;
|
|
271
277
|
}
|
|
272
278
|
}, {
|
|
@@ -383,6 +389,8 @@ function (_React$Component) {
|
|
|
383
389
|
}, {
|
|
384
390
|
key: "checkAllCheckHalf",
|
|
385
391
|
value: function checkAllCheckHalf() {
|
|
392
|
+
if (this.props.selectOnce) return;
|
|
393
|
+
|
|
386
394
|
if (this.selectRows.length > 0 && this.selectRows.length !== this.state.data.length) {
|
|
387
395
|
this.allchk.setHalf(true);
|
|
388
396
|
}
|
|
@@ -398,22 +406,25 @@ function (_React$Component) {
|
|
|
398
406
|
}, {
|
|
399
407
|
key: "setRowCheck",
|
|
400
408
|
value: function setRowCheck(checked, rowIdx) {
|
|
409
|
+
var row = this.refs['row_' + rowIdx];
|
|
410
|
+
|
|
401
411
|
if (checked) {
|
|
412
|
+
if (this.props.selectOnce && this.selectRows.length > 0) {
|
|
413
|
+
var reIdx = this.selectRows[0];
|
|
414
|
+
this.refs['row_' + reIdx].setChecked(false);
|
|
415
|
+
this.setRowCheck(false, reIdx);
|
|
416
|
+
}
|
|
417
|
+
|
|
402
418
|
if (this.selectRows.indexOf(rowIdx) === -1) {
|
|
403
419
|
this.selectRows.push(rowIdx);
|
|
404
|
-
}
|
|
420
|
+
}
|
|
405
421
|
|
|
422
|
+
ReactDOM.findDOMNode(row).parentNode.parentNode.classList.add('ck-table-selected');
|
|
406
423
|
} else {
|
|
407
424
|
if (this.selectRows.indexOf(rowIdx) !== -1) {
|
|
408
425
|
this.selectRows.splice(this.selectRows.indexOf(rowIdx), 1);
|
|
409
426
|
}
|
|
410
|
-
}
|
|
411
|
-
|
|
412
|
-
var row = this.refs['row_' + rowIdx];
|
|
413
427
|
|
|
414
|
-
if (checked) {
|
|
415
|
-
ReactDOM.findDOMNode(row).parentNode.parentNode.classList.add('ck-table-selected');
|
|
416
|
-
} else {
|
|
417
428
|
ReactDOM.findDOMNode(row).parentNode.parentNode.classList.remove('ck-table-selected');
|
|
418
429
|
}
|
|
419
430
|
}
|
|
@@ -426,6 +437,14 @@ function (_React$Component) {
|
|
|
426
437
|
if (typeof _this6.props.onClick === 'function') {
|
|
427
438
|
_this6.props.onClick(row, i);
|
|
428
439
|
}
|
|
440
|
+
|
|
441
|
+
if (_this6.props.select) {
|
|
442
|
+
var _row = _this6.refs['row_' + i];
|
|
443
|
+
|
|
444
|
+
_row.changeHandler(null); // this.setRowCheck(!row.getChecked(),i);
|
|
445
|
+
// this.checkAllCheckHalf();
|
|
446
|
+
|
|
447
|
+
}
|
|
429
448
|
};
|
|
430
449
|
}
|
|
431
450
|
/**
|
|
@@ -817,8 +836,13 @@ function (_React$Component) {
|
|
|
817
836
|
}
|
|
818
837
|
}, {
|
|
819
838
|
key: "getClasses",
|
|
820
|
-
value: function getClasses() {
|
|
821
|
-
var base = 'table ck-table';
|
|
839
|
+
value: function getClasses(name) {
|
|
840
|
+
var base = 'table ck-table';
|
|
841
|
+
|
|
842
|
+
if (!!name) {
|
|
843
|
+
base = (0, _bind["default"])(base, name);
|
|
844
|
+
} //striped
|
|
845
|
+
|
|
822
846
|
|
|
823
847
|
if (this.props.striped && !this.props.edit) {
|
|
824
848
|
base = (0, _bind["default"])(base, 'table-striped');
|
|
@@ -941,14 +965,35 @@ function (_React$Component) {
|
|
|
941
965
|
var base = 'ck-ctable-body flex-grow-1 d-flex flex-column';
|
|
942
966
|
return base;
|
|
943
967
|
}
|
|
968
|
+
}, {
|
|
969
|
+
key: "calcLocalTotal",
|
|
970
|
+
value: function calcLocalTotal(field) {
|
|
971
|
+
var _this13 = this;
|
|
972
|
+
|
|
973
|
+
return function (e) {
|
|
974
|
+
var list = _this13.state.data;
|
|
975
|
+
var total = 0;
|
|
976
|
+
list.forEach(function (item) {
|
|
977
|
+
if (!!parseFloat(item[field])) {
|
|
978
|
+
total += parseFloat(item[field]);
|
|
979
|
+
}
|
|
980
|
+
});
|
|
981
|
+
var totalData = Object.assign({}, _this13.state.total);
|
|
982
|
+
totalData[field] = total.toFixed(2);
|
|
983
|
+
|
|
984
|
+
_this13.setState({
|
|
985
|
+
total: totalData
|
|
986
|
+
});
|
|
987
|
+
};
|
|
988
|
+
}
|
|
944
989
|
}, {
|
|
945
990
|
key: "render",
|
|
946
991
|
value: function render() {
|
|
947
|
-
var
|
|
992
|
+
var _this14 = this;
|
|
948
993
|
|
|
949
994
|
return _react["default"].createElement("div", {
|
|
950
995
|
ref: function ref(c) {
|
|
951
|
-
return
|
|
996
|
+
return _this14.mainDom = c;
|
|
952
997
|
},
|
|
953
998
|
className: this.getMainClasses(),
|
|
954
999
|
style: this.getStyles()
|
|
@@ -960,7 +1005,7 @@ function (_React$Component) {
|
|
|
960
1005
|
selector: "#table-body-com-".concat(this.domId)
|
|
961
1006
|
})), this.renderFoot(), _react["default"].createElement("div", {
|
|
962
1007
|
ref: function ref(c) {
|
|
963
|
-
return
|
|
1008
|
+
return _this14.split = c;
|
|
964
1009
|
},
|
|
965
1010
|
className: "ck-split d-none"
|
|
966
1011
|
}));
|
|
@@ -968,15 +1013,15 @@ function (_React$Component) {
|
|
|
968
1013
|
}, {
|
|
969
1014
|
key: "renderHeader",
|
|
970
1015
|
value: function renderHeader() {
|
|
971
|
-
var
|
|
1016
|
+
var _this15 = this;
|
|
972
1017
|
|
|
973
1018
|
return _react["default"].createElement("div", {
|
|
974
1019
|
ref: function ref(c) {
|
|
975
|
-
return
|
|
1020
|
+
return _this15.tableHeader = c;
|
|
976
1021
|
}
|
|
977
1022
|
}, _react["default"].createElement("table", {
|
|
978
1023
|
ref: function ref(c) {
|
|
979
|
-
return
|
|
1024
|
+
return _this15.table_head = c;
|
|
980
1025
|
},
|
|
981
1026
|
id: "table-head-".concat(this.domId),
|
|
982
1027
|
className: this.getClasses(),
|
|
@@ -988,15 +1033,15 @@ function (_React$Component) {
|
|
|
988
1033
|
width: '20px',
|
|
989
1034
|
textAlign: 'center'
|
|
990
1035
|
}
|
|
991
|
-
}, this.props.edit ? _react["default"].createElement(_reactBootstrap.Icon, {
|
|
1036
|
+
}, this.props.edit || this.props.selectOnce ? _react["default"].createElement(_reactBootstrap.Icon, {
|
|
992
1037
|
icon: "list"
|
|
993
1038
|
}) : _react["default"].createElement(_reactBootstrap.CCheckbox, {
|
|
994
1039
|
ref: function ref(c) {
|
|
995
|
-
return
|
|
1040
|
+
return _this15.allchk = c;
|
|
996
1041
|
},
|
|
997
1042
|
onChange: this.selectAll
|
|
998
1043
|
})) : null, _react["default"].Children.map(this.props.children, function (item, key) {
|
|
999
|
-
|
|
1044
|
+
_this15.cacheRow[item.props.field] = '';
|
|
1000
1045
|
|
|
1001
1046
|
if (!item || item.props.hide) {
|
|
1002
1047
|
return null;
|
|
@@ -1013,28 +1058,28 @@ function (_React$Component) {
|
|
|
1013
1058
|
|
|
1014
1059
|
var sort_icon = '';
|
|
1015
1060
|
|
|
1016
|
-
if (
|
|
1017
|
-
sort_icon = 'sort-alpha-' + (
|
|
1061
|
+
if (_this15.sortList[item.props.field]) {
|
|
1062
|
+
sort_icon = 'sort-alpha-' + (_this15.sortList[item.props.field] === 'asc' ? 'down' : 'up');
|
|
1018
1063
|
}
|
|
1019
1064
|
|
|
1020
1065
|
return _react["default"].createElement("th", {
|
|
1021
|
-
onContextMenu:
|
|
1022
|
-
id:
|
|
1066
|
+
onContextMenu: _this15.menuContextHandler,
|
|
1067
|
+
id: _this15.domId + '-' + key,
|
|
1023
1068
|
"data-key": 'head_' + key,
|
|
1024
1069
|
style: style
|
|
1025
|
-
},
|
|
1070
|
+
}, _this15.is_sort ? _react["default"].createElement("a", {
|
|
1026
1071
|
className: "ck-ctable-sort",
|
|
1027
1072
|
href: "javascript://",
|
|
1028
|
-
id: "".concat(
|
|
1073
|
+
id: "".concat(_this15.domId, "-sort-").concat(item.props.field),
|
|
1029
1074
|
"data-field": item.props.field,
|
|
1030
|
-
onClick:
|
|
1075
|
+
onClick: _this15.sortHandler
|
|
1031
1076
|
}, item.props.text, " ", _react["default"].createElement(_reactBootstrap.Icon, {
|
|
1032
1077
|
icon: sort_icon
|
|
1033
|
-
})) : item.props.text,
|
|
1078
|
+
})) : item.props.text, _this15.props.move ? _react["default"].createElement("span", {
|
|
1034
1079
|
ref: function ref(c) {
|
|
1035
|
-
return
|
|
1080
|
+
return _this15.headerSplits.push(c);
|
|
1036
1081
|
},
|
|
1037
|
-
"data-key":
|
|
1082
|
+
"data-key": _this15.domId + '-' + key,
|
|
1038
1083
|
className: "ck-column-split"
|
|
1039
1084
|
}) : null);
|
|
1040
1085
|
})))));
|
|
@@ -1042,34 +1087,34 @@ function (_React$Component) {
|
|
|
1042
1087
|
}, {
|
|
1043
1088
|
key: "renderRows",
|
|
1044
1089
|
value: function renderRows() {
|
|
1045
|
-
var
|
|
1090
|
+
var _this16 = this;
|
|
1046
1091
|
|
|
1047
1092
|
return _react["default"].createElement("div", {
|
|
1048
1093
|
ref: function ref(c) {
|
|
1049
|
-
return
|
|
1094
|
+
return _this16.table_rows = c;
|
|
1050
1095
|
},
|
|
1051
1096
|
id: "table-body-com-".concat(this.domId),
|
|
1052
1097
|
className: "flex-grow-1 rows",
|
|
1053
1098
|
onScroll: this.scrollHandler
|
|
1054
1099
|
}, _react["default"].createElement("table", {
|
|
1055
1100
|
ref: function ref(c) {
|
|
1056
|
-
return
|
|
1101
|
+
return _this16.table_body = c;
|
|
1057
1102
|
},
|
|
1058
1103
|
id: "table-body-".concat(this.domId),
|
|
1059
1104
|
className: this.getClasses(),
|
|
1060
1105
|
style: this.getTableStyles()
|
|
1061
1106
|
}, _react["default"].createElement("tbody", null, this.state.data.map(function (row, i) {
|
|
1062
|
-
if (
|
|
1063
|
-
return
|
|
1107
|
+
if (_this16.props.edit) {
|
|
1108
|
+
return _this16.renderEditRow(row, i);
|
|
1064
1109
|
}
|
|
1065
1110
|
|
|
1066
|
-
return
|
|
1111
|
+
return _this16.renderRow(row, i);
|
|
1067
1112
|
}), this.props.edit ? this.renderEditAddRow() : null)), this.props.menu ? this.renderMenu() : null, this.props.menu ? this.renderNumberMenu() : null);
|
|
1068
1113
|
}
|
|
1069
1114
|
}, {
|
|
1070
1115
|
key: "renderRow",
|
|
1071
1116
|
value: function renderRow(row, i, parentRow) {
|
|
1072
|
-
var
|
|
1117
|
+
var _this17 = this;
|
|
1073
1118
|
|
|
1074
1119
|
return _react["default"].createElement(_react["default"].Fragment, null, _react["default"].createElement("tr", {
|
|
1075
1120
|
className: this.props.onClick ? 'click-row' : null,
|
|
@@ -1088,9 +1133,9 @@ function (_React$Component) {
|
|
|
1088
1133
|
} //set style
|
|
1089
1134
|
|
|
1090
1135
|
|
|
1091
|
-
var style = _objectSpread({},
|
|
1136
|
+
var style = _objectSpread({}, _this17.props.columnStyle);
|
|
1092
1137
|
|
|
1093
|
-
style.textAlign = item.props.align ||
|
|
1138
|
+
style.textAlign = item.props.align || _this17.props.align;
|
|
1094
1139
|
|
|
1095
1140
|
if (item.props.width) {
|
|
1096
1141
|
style.width = item.props.width;
|
|
@@ -1113,8 +1158,8 @@ function (_React$Component) {
|
|
|
1113
1158
|
|
|
1114
1159
|
if (item.props.children) {
|
|
1115
1160
|
return _react["default"].createElement("td", {
|
|
1116
|
-
onContextMenu:
|
|
1117
|
-
id:
|
|
1161
|
+
onContextMenu: _this17.menuContextHandler(dataType),
|
|
1162
|
+
id: _this17.domId + '-' + key,
|
|
1118
1163
|
"data-row": "".concat(i),
|
|
1119
1164
|
"data-field": item.props.field,
|
|
1120
1165
|
className: item.props.className,
|
|
@@ -1133,8 +1178,8 @@ function (_React$Component) {
|
|
|
1133
1178
|
}
|
|
1134
1179
|
|
|
1135
1180
|
return _react["default"].createElement("td", {
|
|
1136
|
-
onContextMenu:
|
|
1137
|
-
id:
|
|
1181
|
+
onContextMenu: _this17.menuContextHandler(dataType),
|
|
1182
|
+
id: _this17.domId + '-' + key,
|
|
1138
1183
|
"data-field": item.props.field,
|
|
1139
1184
|
style: style,
|
|
1140
1185
|
onClick: function onClick(e) {
|
|
@@ -1148,14 +1193,14 @@ function (_React$Component) {
|
|
|
1148
1193
|
}
|
|
1149
1194
|
},
|
|
1150
1195
|
"data-row": "".concat(i)
|
|
1151
|
-
}, item.props.type ?
|
|
1196
|
+
}, item.props.type ? _this17.renderEditComponent(item.props, row, i) : item.props.onFormat ? item.props.onFormat(row[item.props.field], row, item.props.field) : row[item.props.field]);
|
|
1152
1197
|
}
|
|
1153
1198
|
})));
|
|
1154
1199
|
}
|
|
1155
1200
|
}, {
|
|
1156
1201
|
key: "renderEditRow",
|
|
1157
1202
|
value: function renderEditRow(row, i) {
|
|
1158
|
-
var
|
|
1203
|
+
var _this18 = this;
|
|
1159
1204
|
|
|
1160
1205
|
return _react["default"].createElement(_react["default"].Fragment, null, _react["default"].createElement("tr", {
|
|
1161
1206
|
className: this.props.onClick ? 'click-row' : null,
|
|
@@ -1175,9 +1220,9 @@ function (_React$Component) {
|
|
|
1175
1220
|
} //set style
|
|
1176
1221
|
|
|
1177
1222
|
|
|
1178
|
-
var style = _objectSpread({},
|
|
1223
|
+
var style = _objectSpread({}, _this18.props.columnStyle);
|
|
1179
1224
|
|
|
1180
|
-
style.textAlign = item.props.align ||
|
|
1225
|
+
style.textAlign = item.props.align || _this18.props.align;
|
|
1181
1226
|
|
|
1182
1227
|
if (item.props.width) {
|
|
1183
1228
|
style.width = item.props.width;
|
|
@@ -1185,9 +1230,9 @@ function (_React$Component) {
|
|
|
1185
1230
|
|
|
1186
1231
|
var dataType = 'text';
|
|
1187
1232
|
return _react["default"].createElement("td", {
|
|
1188
|
-
onContextMenu:
|
|
1233
|
+
onContextMenu: _this18.menuContextHandler(dataType),
|
|
1189
1234
|
className: item.props.disabled ? 'disabled' : '',
|
|
1190
|
-
id:
|
|
1235
|
+
id: _this18.domId + '-' + key,
|
|
1191
1236
|
"data-field": item.props.field,
|
|
1192
1237
|
style: style,
|
|
1193
1238
|
onClick: function onClick(e) {
|
|
@@ -1201,13 +1246,13 @@ function (_React$Component) {
|
|
|
1201
1246
|
}
|
|
1202
1247
|
},
|
|
1203
1248
|
"data-row": "".concat(i)
|
|
1204
|
-
}, item.props.disabled ? item.props.onFormat ? item.props.onFormat(row[item.props.field], row, item.props.field) : row[item.props.field] :
|
|
1249
|
+
}, item.props.disabled ? item.props.onFormat ? item.props.onFormat(row[item.props.field], row, item.props.field) : row[item.props.field] : _this18.renderEditComponent(item.props, row, i));
|
|
1205
1250
|
})));
|
|
1206
1251
|
}
|
|
1207
1252
|
}, {
|
|
1208
1253
|
key: "renderEditAddRow",
|
|
1209
1254
|
value: function renderEditAddRow() {
|
|
1210
|
-
var
|
|
1255
|
+
var _this19 = this;
|
|
1211
1256
|
|
|
1212
1257
|
return _react["default"].createElement("tr", {
|
|
1213
1258
|
id: this.domId + '-edit'
|
|
@@ -1229,14 +1274,14 @@ function (_React$Component) {
|
|
|
1229
1274
|
return _react["default"].createElement("td", {
|
|
1230
1275
|
style: style
|
|
1231
1276
|
}, _react["default"].createElement(_CTableInput["default"], {
|
|
1232
|
-
onFocus:
|
|
1277
|
+
onFocus: _this19.addNewHandler
|
|
1233
1278
|
}));
|
|
1234
1279
|
}));
|
|
1235
1280
|
}
|
|
1236
1281
|
}, {
|
|
1237
1282
|
key: "renderEditComponent",
|
|
1238
1283
|
value: function renderEditComponent(item, row, i) {
|
|
1239
|
-
var
|
|
1284
|
+
var _this20 = this;
|
|
1240
1285
|
|
|
1241
1286
|
switch (item.type) {
|
|
1242
1287
|
case "combo":
|
|
@@ -1267,7 +1312,7 @@ function (_React$Component) {
|
|
|
1267
1312
|
return _react["default"].createElement(_reactBootstrap.CCheckbox, {
|
|
1268
1313
|
width: "20px",
|
|
1269
1314
|
onChange: function onChange(chk, e) {
|
|
1270
|
-
|
|
1315
|
+
_this20.editHandler(e, chk, 'chk');
|
|
1271
1316
|
},
|
|
1272
1317
|
"data-row": i,
|
|
1273
1318
|
"data-field": item.field,
|
|
@@ -1282,7 +1327,8 @@ function (_React$Component) {
|
|
|
1282
1327
|
"data-field": item.field,
|
|
1283
1328
|
data: row[item.field],
|
|
1284
1329
|
align: item.align,
|
|
1285
|
-
disabled: item.disabled
|
|
1330
|
+
disabled: item.disabled,
|
|
1331
|
+
onBlur: this.state.total && this.state.total.hasOwnProperty(item.field) ? this.calcLocalTotal(item.field) : null
|
|
1286
1332
|
});
|
|
1287
1333
|
}
|
|
1288
1334
|
}
|
|
@@ -1305,7 +1351,7 @@ function (_React$Component) {
|
|
|
1305
1351
|
}, {
|
|
1306
1352
|
key: "renderTotal",
|
|
1307
1353
|
value: function renderTotal() {
|
|
1308
|
-
var
|
|
1354
|
+
var _this21 = this;
|
|
1309
1355
|
|
|
1310
1356
|
if (!this.state.total) {
|
|
1311
1357
|
return null;
|
|
@@ -1314,11 +1360,12 @@ function (_React$Component) {
|
|
|
1314
1360
|
var total = this.state.total;
|
|
1315
1361
|
return _react["default"].createElement("div", {
|
|
1316
1362
|
ref: function ref(c) {
|
|
1317
|
-
return
|
|
1318
|
-
}
|
|
1363
|
+
return _this21.tableTotal = c;
|
|
1364
|
+
},
|
|
1365
|
+
className: "ck-ctable-total"
|
|
1319
1366
|
}, _react["default"].createElement("table", {
|
|
1320
1367
|
ref: function ref(c) {
|
|
1321
|
-
return
|
|
1368
|
+
return _this21.table_total = c;
|
|
1322
1369
|
},
|
|
1323
1370
|
id: "table-total-".concat(this.domId),
|
|
1324
1371
|
className: this.getClasses(),
|
|
@@ -1332,7 +1379,7 @@ function (_React$Component) {
|
|
|
1332
1379
|
return null;
|
|
1333
1380
|
}
|
|
1334
1381
|
|
|
1335
|
-
var align = item.props.align ||
|
|
1382
|
+
var align = item.props.align || _this21.props.align;
|
|
1336
1383
|
var style = {
|
|
1337
1384
|
'textAlign': align
|
|
1338
1385
|
};
|
|
@@ -1342,7 +1389,7 @@ function (_React$Component) {
|
|
|
1342
1389
|
}
|
|
1343
1390
|
|
|
1344
1391
|
return _react["default"].createElement("td", {
|
|
1345
|
-
id:
|
|
1392
|
+
id: _this21.domId + '-' + key,
|
|
1346
1393
|
"data-field": item.props.field,
|
|
1347
1394
|
style: style
|
|
1348
1395
|
}, item.props.onFormat ? item.props.onFormat(total[item.props.field], total, item.props.field) : total[item.props.field]);
|
|
@@ -1351,7 +1398,7 @@ function (_React$Component) {
|
|
|
1351
1398
|
}, {
|
|
1352
1399
|
key: "renderMenu",
|
|
1353
1400
|
value: function renderMenu() {
|
|
1354
|
-
var
|
|
1401
|
+
var _this22 = this;
|
|
1355
1402
|
|
|
1356
1403
|
var lang = this.props.lang;
|
|
1357
1404
|
|
|
@@ -1364,7 +1411,7 @@ function (_React$Component) {
|
|
|
1364
1411
|
|
|
1365
1412
|
return _react["default"].createElement(_react["default"].Fragment, null, _react["default"].createElement(_reactBootstrap.Menu, {
|
|
1366
1413
|
ref: function ref(c) {
|
|
1367
|
-
return
|
|
1414
|
+
return _this22.mainMenu = c;
|
|
1368
1415
|
},
|
|
1369
1416
|
onClick: this.menuClickHandler
|
|
1370
1417
|
}, _react["default"].createElement(_reactBootstrap.Menu.Item, {
|
|
@@ -1382,7 +1429,7 @@ function (_React$Component) {
|
|
|
1382
1429
|
onClick: function onClick(e, field, data) {
|
|
1383
1430
|
var select = document.getSelection();
|
|
1384
1431
|
|
|
1385
|
-
|
|
1432
|
+
_this22.filterHandler(select.toString(), data.field, 'contain');
|
|
1386
1433
|
}
|
|
1387
1434
|
}, _react["default"].createElement(_reactBootstrap.Icon, {
|
|
1388
1435
|
className: "mr-1",
|
|
@@ -1392,7 +1439,7 @@ function (_React$Component) {
|
|
|
1392
1439
|
onClick: function onClick(e, field, data) {
|
|
1393
1440
|
var select = document.getSelection();
|
|
1394
1441
|
|
|
1395
|
-
|
|
1442
|
+
_this22.filterHandler(select.toString(), data.field, 'exclude');
|
|
1396
1443
|
}
|
|
1397
1444
|
}, _react["default"].createElement(_reactBootstrap.Icon, {
|
|
1398
1445
|
className: "mr-1",
|
|
@@ -1400,7 +1447,7 @@ function (_React$Component) {
|
|
|
1400
1447
|
}), lang['Filter Excluding Selection']) : null, this.is_filter || this.is_sort ? _react["default"].createElement(_reactBootstrap.Menu.Item, {
|
|
1401
1448
|
field: "clear_filter",
|
|
1402
1449
|
onClick: function onClick() {
|
|
1403
|
-
|
|
1450
|
+
_this22.clearFilter();
|
|
1404
1451
|
}
|
|
1405
1452
|
}, _react["default"].createElement("span", {
|
|
1406
1453
|
className: "text-danger"
|
|
@@ -1422,13 +1469,13 @@ function (_React$Component) {
|
|
|
1422
1469
|
onChange: this.filterChangeHandler('equal'),
|
|
1423
1470
|
onMouseDown: stopEvent,
|
|
1424
1471
|
onEnter: function onEnter() {
|
|
1425
|
-
|
|
1472
|
+
_this22.filterHandler(_this22.state.filter.equal, _this22.mainMenu.data.field, 'equal');
|
|
1426
1473
|
}
|
|
1427
1474
|
}), _react["default"].createElement(_reactBootstrap.Button, {
|
|
1428
1475
|
size: "xs",
|
|
1429
1476
|
onMouseDown: stopEvent,
|
|
1430
1477
|
onClick: function onClick(e) {
|
|
1431
|
-
|
|
1478
|
+
_this22.filterHandler(_this22.state.filter.equal, _this22.mainMenu.data.field, 'equal');
|
|
1432
1479
|
},
|
|
1433
1480
|
icon: "search"
|
|
1434
1481
|
})) : null, this.is_filter ? _react["default"].createElement(_reactBootstrap.Menu.Item, {
|
|
@@ -1444,13 +1491,13 @@ function (_React$Component) {
|
|
|
1444
1491
|
onChange: this.filterChangeHandler('start'),
|
|
1445
1492
|
onMouseDown: stopEvent,
|
|
1446
1493
|
onEnter: function onEnter() {
|
|
1447
|
-
|
|
1494
|
+
_this22.filterHandler(_this22.state.filter.start, _this22.mainMenu.data.field, 'start');
|
|
1448
1495
|
}
|
|
1449
1496
|
}), _react["default"].createElement(_reactBootstrap.Button, {
|
|
1450
1497
|
size: "xs",
|
|
1451
1498
|
onMouseDown: stopEvent,
|
|
1452
1499
|
onClick: function onClick(e) {
|
|
1453
|
-
|
|
1500
|
+
_this22.filterHandler(_this22.state.filter.start, _this22.mainMenu.data.field, 'start');
|
|
1454
1501
|
},
|
|
1455
1502
|
icon: "search"
|
|
1456
1503
|
})) : null, this.is_filter ? _react["default"].createElement(_reactBootstrap.Menu.Item, {
|
|
@@ -1466,13 +1513,13 @@ function (_React$Component) {
|
|
|
1466
1513
|
onChange: this.filterChangeHandler('end'),
|
|
1467
1514
|
onMouseDown: stopEvent,
|
|
1468
1515
|
onEnter: function onEnter() {
|
|
1469
|
-
|
|
1516
|
+
_this22.filterHandler(_this22.state.filter.end, _this22.mainMenu.data.field, 'end');
|
|
1470
1517
|
}
|
|
1471
1518
|
}), _react["default"].createElement(_reactBootstrap.Button, {
|
|
1472
1519
|
size: "xs",
|
|
1473
1520
|
onMouseDown: stopEvent,
|
|
1474
1521
|
onClick: function onClick(e) {
|
|
1475
|
-
|
|
1522
|
+
_this22.filterHandler(_this22.state.filter.end, _this22.mainMenu.data.field, 'end');
|
|
1476
1523
|
},
|
|
1477
1524
|
icon: "search"
|
|
1478
1525
|
})) : null, this.is_filter ? _react["default"].createElement(_reactBootstrap.Menu.Item, {
|
|
@@ -1488,13 +1535,13 @@ function (_React$Component) {
|
|
|
1488
1535
|
onChange: this.filterChangeHandler('contain'),
|
|
1489
1536
|
onMouseDown: stopEvent,
|
|
1490
1537
|
onEnter: function onEnter() {
|
|
1491
|
-
|
|
1538
|
+
_this22.filterHandler(_this22.state.filter.contain, _this22.mainMenu.data.field, 'contain');
|
|
1492
1539
|
}
|
|
1493
1540
|
}), _react["default"].createElement(_reactBootstrap.Button, {
|
|
1494
1541
|
size: "xs",
|
|
1495
1542
|
onMouseDown: stopEvent,
|
|
1496
1543
|
onClick: function onClick(e) {
|
|
1497
|
-
|
|
1544
|
+
_this22.filterHandler(_this22.state.filter.contain, _this22.mainMenu.data.field, 'contain');
|
|
1498
1545
|
},
|
|
1499
1546
|
icon: "search"
|
|
1500
1547
|
})) : null, this.is_filter ? _react["default"].createElement(_reactBootstrap.Menu.Item, {
|
|
@@ -1511,7 +1558,7 @@ function (_React$Component) {
|
|
|
1511
1558
|
onChange: this.filterChangeHandler('condition'),
|
|
1512
1559
|
onMouseDown: stopEvent,
|
|
1513
1560
|
onEnter: function onEnter() {
|
|
1514
|
-
|
|
1561
|
+
_this22.filterHandler(_this22.state.filter.condition, _this22.mainMenu.data.field, 'condition');
|
|
1515
1562
|
}
|
|
1516
1563
|
})) : null, this.props.edit ? _react["default"].createElement(_reactBootstrap.Menu.Item, {
|
|
1517
1564
|
step: true
|
|
@@ -1522,13 +1569,13 @@ function (_React$Component) {
|
|
|
1522
1569
|
}, lang['Clone Row']) : null, this.props.customMenu ? _react["default"].createElement(_reactBootstrap.Menu.Item, {
|
|
1523
1570
|
step: true
|
|
1524
1571
|
}) : null, this.props.customMenu ? this.props.customMenu.map(function (menu) {
|
|
1525
|
-
return
|
|
1572
|
+
return _this22.explainCustomMenu(menu);
|
|
1526
1573
|
}) : null));
|
|
1527
1574
|
}
|
|
1528
1575
|
}, {
|
|
1529
1576
|
key: "renderNumberMenu",
|
|
1530
1577
|
value: function renderNumberMenu() {
|
|
1531
|
-
var
|
|
1578
|
+
var _this23 = this;
|
|
1532
1579
|
|
|
1533
1580
|
var lang = this.props.lang;
|
|
1534
1581
|
|
|
@@ -1541,7 +1588,7 @@ function (_React$Component) {
|
|
|
1541
1588
|
|
|
1542
1589
|
return _react["default"].createElement(_react["default"].Fragment, null, _react["default"].createElement(_reactBootstrap.Menu, {
|
|
1543
1590
|
ref: function ref(c) {
|
|
1544
|
-
return
|
|
1591
|
+
return _this23.numMenu = c;
|
|
1545
1592
|
},
|
|
1546
1593
|
onClick: this.menuClickHandler
|
|
1547
1594
|
}, _react["default"].createElement(_reactBootstrap.Menu.Item, {
|
|
@@ -1559,7 +1606,7 @@ function (_React$Component) {
|
|
|
1559
1606
|
onClick: function onClick(e, field, data) {
|
|
1560
1607
|
var select = document.getSelection();
|
|
1561
1608
|
|
|
1562
|
-
|
|
1609
|
+
_this23.filterHandler(select.toString(), data.field, 'contain');
|
|
1563
1610
|
}
|
|
1564
1611
|
}, _react["default"].createElement(_reactBootstrap.Icon, {
|
|
1565
1612
|
className: "mr-1",
|
|
@@ -1569,7 +1616,7 @@ function (_React$Component) {
|
|
|
1569
1616
|
onClick: function onClick(e, field, data) {
|
|
1570
1617
|
var select = document.getSelection();
|
|
1571
1618
|
|
|
1572
|
-
|
|
1619
|
+
_this23.filterHandler(select.toString(), data.field, 'exclude');
|
|
1573
1620
|
}
|
|
1574
1621
|
}, _react["default"].createElement(_reactBootstrap.Icon, {
|
|
1575
1622
|
className: "mr-1",
|
|
@@ -1577,7 +1624,7 @@ function (_React$Component) {
|
|
|
1577
1624
|
}), lang['Filter Excluding Selection']) : null, this.is_filter || this.is_sort ? _react["default"].createElement(_reactBootstrap.Menu.Item, {
|
|
1578
1625
|
field: "clear_filter",
|
|
1579
1626
|
onClick: function onClick() {
|
|
1580
|
-
|
|
1627
|
+
_this23.clearFilter();
|
|
1581
1628
|
}
|
|
1582
1629
|
}, _react["default"].createElement("span", {
|
|
1583
1630
|
className: "text-danger"
|
|
@@ -1598,14 +1645,14 @@ function (_React$Component) {
|
|
|
1598
1645
|
onChange: this.filterChangeHandler('condition'),
|
|
1599
1646
|
onMouseDown: stopEvent,
|
|
1600
1647
|
onEnter: function onEnter() {
|
|
1601
|
-
|
|
1648
|
+
_this23.filterHandler(_this23.state.filter.condition, _this23.numMenu.data.field, 'condition');
|
|
1602
1649
|
}
|
|
1603
1650
|
}), _react["default"].createElement("div", null, "and,or,between,>,>=,<,<=,=")) : null));
|
|
1604
1651
|
}
|
|
1605
1652
|
}, {
|
|
1606
1653
|
key: "explainCustomMenu",
|
|
1607
1654
|
value: function explainCustomMenu(menu) {
|
|
1608
|
-
var
|
|
1655
|
+
var _this24 = this;
|
|
1609
1656
|
|
|
1610
1657
|
if (menu.children && menu.children instanceof Array) {
|
|
1611
1658
|
return _react["default"].createElement(_reactBootstrap.Menu.Item, {
|
|
@@ -1613,7 +1660,7 @@ function (_React$Component) {
|
|
|
1613
1660
|
text: menu.text,
|
|
1614
1661
|
child: true
|
|
1615
1662
|
}, menu.children.map(function (item) {
|
|
1616
|
-
return
|
|
1663
|
+
return _this24.explainCustomMenu(item);
|
|
1617
1664
|
}));
|
|
1618
1665
|
} else {
|
|
1619
1666
|
return _react["default"].createElement(_reactBootstrap.Menu.Item, {
|
|
@@ -1650,6 +1697,8 @@ CTable.propTypes = {
|
|
|
1650
1697
|
page: _propTypes["default"].number,
|
|
1651
1698
|
//第一列是否出现选择项
|
|
1652
1699
|
select: _propTypes["default"].bool,
|
|
1700
|
+
//是否只能选中一项
|
|
1701
|
+
selectOnce: _propTypes["default"].bool,
|
|
1653
1702
|
//是否显示标头
|
|
1654
1703
|
header: _propTypes["default"].bool,
|
|
1655
1704
|
//
|
|
@@ -1748,7 +1797,8 @@ CTable.defaultProps = {
|
|
|
1748
1797
|
menu: true,
|
|
1749
1798
|
showNumbers: 30,
|
|
1750
1799
|
showPages: 10,
|
|
1751
|
-
source: null
|
|
1800
|
+
source: null,
|
|
1801
|
+
total: null
|
|
1752
1802
|
};
|
|
1753
1803
|
var _default = CTable;
|
|
1754
1804
|
exports["default"] = _default;
|