bhd-components 0.3.0 → 0.3.1
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/table.esm.es5.development.css +49 -47
- package/dist/table.esm.es5.development.js +21 -3
- package/dist/table.esm.es5.production.css +1 -1
- package/dist/table.esm.es5.production.js +1 -1
- package/es2017/table/index.js +20 -2
- package/es2017/table/index.module.less +2 -0
- package/esm/table/index.js +20 -2
- package/esm/table/index.module.less +2 -0
- package/package.json +1 -1
|
@@ -1,41 +1,41 @@
|
|
|
1
|
-
.
|
|
1
|
+
.index_module_Table__0e2cd628 {
|
|
2
2
|
width: 100%;
|
|
3
3
|
}
|
|
4
|
-
.
|
|
4
|
+
.index_module_Table__0e2cd628 {
|
|
5
5
|
/* 多选框间距问题 */
|
|
6
6
|
/* 分页器 */
|
|
7
7
|
}
|
|
8
|
-
.
|
|
9
|
-
.
|
|
8
|
+
.index_module_Table__0e2cd628 table th,
|
|
9
|
+
.index_module_Table__0e2cd628 table td {
|
|
10
10
|
border: none;
|
|
11
11
|
border-bottom: 1px solid #e8e8e8;
|
|
12
12
|
}
|
|
13
|
-
.
|
|
13
|
+
.index_module_Table__0e2cd628 table > .bhd-table-thead > tr > .bhd-table-cell {
|
|
14
14
|
font-weight: 400;
|
|
15
15
|
font-size: 16px;
|
|
16
16
|
color: rgba(0, 0, 0, 0.85);
|
|
17
17
|
white-space: nowrap;
|
|
18
18
|
background: #fafafa;
|
|
19
19
|
}
|
|
20
|
-
.
|
|
20
|
+
.index_module_Table__0e2cd628 table > .bhd-table-thead > tr > .bhd-table-cell:nth-child(1) {
|
|
21
21
|
padding-left: 40px;
|
|
22
22
|
}
|
|
23
|
-
.
|
|
23
|
+
.index_module_Table__0e2cd628 table > .bhd-table-thead > tr > .bhd-table-cell:last-child {
|
|
24
24
|
padding-right: 40px;
|
|
25
25
|
}
|
|
26
|
-
.
|
|
26
|
+
.index_module_Table__0e2cd628 table > .bhd-table-thead > tr > .bhd-table-cell::before {
|
|
27
27
|
display: none;
|
|
28
28
|
}
|
|
29
|
-
.
|
|
29
|
+
.index_module_Table__0e2cd628 table tbody tr.bhd-table-placeholder:hover td {
|
|
30
30
|
background-color: #ffffff;
|
|
31
31
|
}
|
|
32
|
-
.
|
|
32
|
+
.index_module_Table__0e2cd628 table tbody tr:not(.bhd-table-placeholder) {
|
|
33
33
|
background: transparent;
|
|
34
34
|
}
|
|
35
|
-
.
|
|
35
|
+
.index_module_Table__0e2cd628 table tbody tr:not(.bhd-table-placeholder):hover td {
|
|
36
36
|
background-color: #ffeeeb !important;
|
|
37
37
|
}
|
|
38
|
-
.
|
|
38
|
+
.index_module_Table__0e2cd628 table tbody tr:not(.bhd-table-placeholder) td {
|
|
39
39
|
word-wrap: break-word;
|
|
40
40
|
word-break: break-all;
|
|
41
41
|
overflow: hidden;
|
|
@@ -43,73 +43,73 @@
|
|
|
43
43
|
text-overflow: ellipsis;
|
|
44
44
|
/* 多选框 距右的距离 */
|
|
45
45
|
}
|
|
46
|
-
.
|
|
46
|
+
.index_module_Table__0e2cd628 table tbody tr:not(.bhd-table-placeholder) td:nth-child(1) {
|
|
47
47
|
padding-left: 40px;
|
|
48
48
|
}
|
|
49
|
-
.
|
|
49
|
+
.index_module_Table__0e2cd628 table tbody tr:not(.bhd-table-placeholder) td:last-child {
|
|
50
50
|
padding-right: 40px;
|
|
51
51
|
}
|
|
52
|
-
.
|
|
52
|
+
.index_module_Table__0e2cd628 table tbody tr:not(.bhd-table-placeholder) td.bhd-table-selection-column {
|
|
53
53
|
-webkit-padding-end: 16px;
|
|
54
54
|
padding-inline-end: 16px;
|
|
55
55
|
}
|
|
56
|
-
.
|
|
56
|
+
.index_module_Table__0e2cd628 .bhd-table-wrapper {
|
|
57
57
|
/* check 选中变色 */
|
|
58
58
|
/* scroll 固定列 设置overflow:hidden 阴影消失问题 */
|
|
59
59
|
}
|
|
60
|
-
.
|
|
60
|
+
.index_module_Table__0e2cd628 .bhd-table-wrapper .bhd-table-selection-col {
|
|
61
61
|
width: 72px !important;
|
|
62
62
|
}
|
|
63
|
-
.
|
|
63
|
+
.index_module_Table__0e2cd628 .bhd-table-wrapper .bhd-table-tbody > tr.bhd-table-row-selected > td {
|
|
64
64
|
background: #ffffff;
|
|
65
65
|
}
|
|
66
|
-
.
|
|
67
|
-
.
|
|
66
|
+
.index_module_Table__0e2cd628 .bhd-table-wrapper .bhd-table-cell-fix-left-first::after,
|
|
67
|
+
.index_module_Table__0e2cd628 .bhd-table-wrapper .bhd-table-cell-fix-left-last::after {
|
|
68
68
|
right: 2px;
|
|
69
69
|
}
|
|
70
|
-
.
|
|
71
|
-
.
|
|
70
|
+
.index_module_Table__0e2cd628 .bhd-table-wrapper .bhd-table-cell-fix-right-first::after,
|
|
71
|
+
.index_module_Table__0e2cd628 .bhd-table-wrapper .bhd-table-cell-fix-right-last::after {
|
|
72
72
|
left: 2px;
|
|
73
73
|
}
|
|
74
|
-
.
|
|
74
|
+
.index_module_Table__0e2cd628 .bhd-pagination .bhd-pagination-item {
|
|
75
75
|
border-color: transparent;
|
|
76
76
|
}
|
|
77
|
-
.
|
|
77
|
+
.index_module_Table__0e2cd628 .bhd-pagination .bhd-pagination-item-link {
|
|
78
78
|
border: none !important;
|
|
79
79
|
background: none !important;
|
|
80
80
|
}
|
|
81
|
-
.
|
|
81
|
+
.index_module_Table__0e2cd628 .bhd-pagination .bhd-pagination-item-active {
|
|
82
82
|
background-color: #f4523b;
|
|
83
83
|
}
|
|
84
|
-
.
|
|
84
|
+
.index_module_Table__0e2cd628 .bhd-pagination .bhd-pagination-item-active:hover {
|
|
85
85
|
background-color: #ff7d66;
|
|
86
86
|
}
|
|
87
|
-
.
|
|
87
|
+
.index_module_Table__0e2cd628 .bhd-pagination .bhd-pagination-item-active:hover > a {
|
|
88
88
|
color: #ffffff;
|
|
89
89
|
}
|
|
90
|
-
.
|
|
90
|
+
.index_module_Table__0e2cd628 .bhd-pagination .bhd-pagination-item-active > a {
|
|
91
91
|
color: #ffffff;
|
|
92
92
|
}
|
|
93
|
-
.
|
|
93
|
+
.index_module_Table__0e2cd628 .bhd-pagination.bhd-pagination-disabled .bhd-pagination-item {
|
|
94
94
|
border: none !important;
|
|
95
95
|
background: none !important;
|
|
96
96
|
color: rgba(0, 0, 0, 0.25) !important;
|
|
97
97
|
}
|
|
98
|
-
.
|
|
98
|
+
.index_module_Table__0e2cd628 .bhd-pagination.bhd-pagination-disabled .bhd-pagination-item a {
|
|
99
99
|
color: rgba(0, 0, 0, 0.25) !important;
|
|
100
100
|
}
|
|
101
|
-
.
|
|
101
|
+
.index_module_Table__0e2cd628 .bhd-pagination.bhd-pagination-mini .bhd-pagination-item {
|
|
102
102
|
margin-right: 8px !important;
|
|
103
103
|
}
|
|
104
|
-
.
|
|
104
|
+
.index_module_Table__0e2cd628 .bhd-pagination.bhd-pagination-mini .bhd-pagination-item:not(.bhd-pagination-item-active):hover {
|
|
105
105
|
background-color: transparent !important;
|
|
106
106
|
}
|
|
107
|
-
.
|
|
108
|
-
.
|
|
107
|
+
.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table th,
|
|
108
|
+
.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table td {
|
|
109
109
|
border: none;
|
|
110
110
|
border-bottom: 1px solid #EBEBEB;
|
|
111
111
|
}
|
|
112
|
-
.
|
|
112
|
+
.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table > .bhd-table-thead > tr > .bhd-table-cell {
|
|
113
113
|
font-weight: 500;
|
|
114
114
|
font-size: 16px;
|
|
115
115
|
color: rgba(0, 0, 0, 0.85);
|
|
@@ -117,30 +117,32 @@
|
|
|
117
117
|
padding-top: 8px;
|
|
118
118
|
padding-bottom: 8px;
|
|
119
119
|
background-color: #fafafa;
|
|
120
|
+
vertical-align: middle;
|
|
121
|
+
font-family: "PingFang SC", "helvetica neue", "Source Han Sans CN", "hiragino sans gb", "arial", "microsoft yahei ui", "microsoft yahei", "simsun", "sans-serif" !important;
|
|
120
122
|
}
|
|
121
|
-
.
|
|
123
|
+
.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table > .bhd-table-thead > tr > .bhd-table-cell:nth-child(1) {
|
|
122
124
|
padding-left: 40px;
|
|
123
125
|
}
|
|
124
|
-
.
|
|
126
|
+
.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table > .bhd-table-thead > tr > .bhd-table-cell:last-child {
|
|
125
127
|
padding-right: 40px;
|
|
126
128
|
}
|
|
127
|
-
.
|
|
129
|
+
.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table > .bhd-table-thead > tr > .bhd-table-cell::before {
|
|
128
130
|
display: none;
|
|
129
131
|
}
|
|
130
|
-
.
|
|
132
|
+
.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table > .bhd-table-thead > tr > .bhd-table-cell.bhd-table-selection-column {
|
|
131
133
|
-webkit-padding-end: 16px;
|
|
132
134
|
padding-inline-end: 16px;
|
|
133
135
|
}
|
|
134
|
-
.
|
|
136
|
+
.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table tbody tr.bhd-table-placeholder:hover td {
|
|
135
137
|
background-color: #ffffff;
|
|
136
138
|
}
|
|
137
|
-
.
|
|
139
|
+
.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table tbody tr:not(.bhd-table-placeholder) {
|
|
138
140
|
background: transparent;
|
|
139
141
|
}
|
|
140
|
-
.
|
|
142
|
+
.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table tbody tr:not(.bhd-table-placeholder):hover td {
|
|
141
143
|
background-color: #F5F5F5 !important;
|
|
142
144
|
}
|
|
143
|
-
.
|
|
145
|
+
.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table tbody tr:not(.bhd-table-placeholder) td {
|
|
144
146
|
word-wrap: break-word;
|
|
145
147
|
word-break: break-all;
|
|
146
148
|
overflow: hidden;
|
|
@@ -150,17 +152,17 @@
|
|
|
150
152
|
padding-bottom: 13.5px;
|
|
151
153
|
/* 多选框 距右的距离 */
|
|
152
154
|
}
|
|
153
|
-
.
|
|
155
|
+
.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table tbody tr:not(.bhd-table-placeholder) td:nth-child(1) {
|
|
154
156
|
padding-left: 40px;
|
|
155
157
|
}
|
|
156
|
-
.
|
|
158
|
+
.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table tbody tr:not(.bhd-table-placeholder) td:last-child {
|
|
157
159
|
padding-right: 40px;
|
|
158
160
|
}
|
|
159
|
-
.
|
|
161
|
+
.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table tbody tr:not(.bhd-table-placeholder) td.bhd-table-selection-column {
|
|
160
162
|
-webkit-padding-end: 16px;
|
|
161
163
|
padding-inline-end: 16px;
|
|
162
164
|
}
|
|
163
|
-
.
|
|
165
|
+
.index_module_columnTootipClassName__0e2cd628 .bhd-tooltip-content .bhd-tooltip-inner {
|
|
164
166
|
color: rgba(0, 0, 0, 0.85);
|
|
165
167
|
word-break: break-all;
|
|
166
168
|
}
|
|
@@ -3,7 +3,7 @@ import { useState, useRef, useEffect } from 'react';
|
|
|
3
3
|
import 'react/jsx-runtime';
|
|
4
4
|
import 'react-dom';
|
|
5
5
|
|
|
6
|
-
var modules_63b47c51 = {"Table":"
|
|
6
|
+
var modules_63b47c51 = {"Table":"index_module_Table__0e2cd628","SmallTable":"index_module_SmallTable__0e2cd628","columnTootipClassName":"index_module_columnTootipClassName__0e2cd628"};
|
|
7
7
|
|
|
8
8
|
var getTextSize = function(str) {
|
|
9
9
|
var fontSize = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 14;
|
|
@@ -75,6 +75,22 @@ var getParentWidth = function(node) {
|
|
|
75
75
|
// const defaultWidthRang: widthRangType = [180, 240, 320]; //默认自适应的值 [最小值,最佳值,最大值]
|
|
76
76
|
//传入的参数为onCell==>需要进行函数合并
|
|
77
77
|
/* 记录的滚动条宽度 */ var recordScrollBarWidth = 0;
|
|
78
|
+
function getScrollbarWidth() {
|
|
79
|
+
// Creating invisible container
|
|
80
|
+
var outer = document.createElement("div");
|
|
81
|
+
outer.style.visibility = "hidden";
|
|
82
|
+
outer.style.overflow = "scroll"; // forcing scrollbar to appear
|
|
83
|
+
outer.style.msOverflowStyle = "scrollbar"; // needed for WinJS apps
|
|
84
|
+
document.body.appendChild(outer);
|
|
85
|
+
// Creating inner element and placing it in the container
|
|
86
|
+
var inner = document.createElement("div");
|
|
87
|
+
outer.appendChild(inner);
|
|
88
|
+
// Calculating difference between container's full width and the child width
|
|
89
|
+
var scrollbarWidth = outer.offsetWidth - inner.offsetWidth;
|
|
90
|
+
// Removing temporary elements from the DOM
|
|
91
|
+
outer.parentNode.removeChild(outer);
|
|
92
|
+
return scrollbarWidth;
|
|
93
|
+
}
|
|
78
94
|
var Table = function(props) {
|
|
79
95
|
var tableRef = useRef(null);
|
|
80
96
|
var timerRef = useRef({
|
|
@@ -89,8 +105,10 @@ var Table = function(props) {
|
|
|
89
105
|
var _useState1 = _sliced_to_array(useState(props.scroll || undefined), 2), scrollObject = _useState1[0], setScrollObject = _useState1[1];
|
|
90
106
|
var columnTootipClassName = props.columnTootipClassName, columnTootipColor = props.columnTootipColor;
|
|
91
107
|
var initColumns = function() {
|
|
92
|
-
|
|
93
|
-
|
|
108
|
+
// let scrollBarDom = tableRef.current.getElementsByClassName(
|
|
109
|
+
// "bhd-table-cell-scrollbar"
|
|
110
|
+
// )[0];
|
|
111
|
+
var scrollBarWidth = getScrollbarWidth();
|
|
94
112
|
recordScrollBarWidth = scrollBarWidth || recordScrollBarWidth;
|
|
95
113
|
var tableWidth = bordered ? tableRef.current.offsetWidth - 2 - recordScrollBarWidth : tableRef.current.offsetWidth - recordScrollBarWidth;
|
|
96
114
|
var _initColumnsWidth = initColumnsWidth(props.columns, tableWidth), selfColumns = _initColumnsWidth.columns;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
.index_module_Table__0e2cd628{width:100%}.index_module_Table__0e2cd628 table td,.index_module_Table__0e2cd628 table th{border:none;border-bottom:1px solid #e8e8e8}.index_module_Table__0e2cd628 table>.bhd-table-thead>tr>.bhd-table-cell{background:#fafafa;color:rgba(0,0,0,.85);font-size:16px;font-weight:400;white-space:nowrap}.index_module_Table__0e2cd628 table>.bhd-table-thead>tr>.bhd-table-cell:first-child{padding-left:40px}.index_module_Table__0e2cd628 table>.bhd-table-thead>tr>.bhd-table-cell:last-child{padding-right:40px}.index_module_Table__0e2cd628 table>.bhd-table-thead>tr>.bhd-table-cell:before{display:none}.index_module_Table__0e2cd628 table tbody tr.bhd-table-placeholder:hover td{background-color:#fff}.index_module_Table__0e2cd628 table tbody tr:not(.bhd-table-placeholder){background:transparent}.index_module_Table__0e2cd628 table tbody tr:not(.bhd-table-placeholder):hover td{background-color:#ffeeeb!important}.index_module_Table__0e2cd628 table tbody tr:not(.bhd-table-placeholder) td{word-wrap:break-word;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-break:break-all}.index_module_Table__0e2cd628 table tbody tr:not(.bhd-table-placeholder) td:first-child{padding-left:40px}.index_module_Table__0e2cd628 table tbody tr:not(.bhd-table-placeholder) td:last-child{padding-right:40px}.index_module_Table__0e2cd628 table tbody tr:not(.bhd-table-placeholder) td.bhd-table-selection-column{-webkit-padding-end:16px;padding-inline-end:16px}.index_module_Table__0e2cd628 .bhd-table-wrapper .bhd-table-selection-col{width:72px!important}.index_module_Table__0e2cd628 .bhd-table-wrapper .bhd-table-tbody>tr.bhd-table-row-selected>td{background:#fff}.index_module_Table__0e2cd628 .bhd-table-wrapper .bhd-table-cell-fix-left-first:after,.index_module_Table__0e2cd628 .bhd-table-wrapper .bhd-table-cell-fix-left-last:after{right:2px}.index_module_Table__0e2cd628 .bhd-table-wrapper .bhd-table-cell-fix-right-first:after,.index_module_Table__0e2cd628 .bhd-table-wrapper .bhd-table-cell-fix-right-last:after{left:2px}.index_module_Table__0e2cd628 .bhd-pagination .bhd-pagination-item{border-color:transparent}.index_module_Table__0e2cd628 .bhd-pagination .bhd-pagination-item-link{background:none!important;border:none!important}.index_module_Table__0e2cd628 .bhd-pagination .bhd-pagination-item-active{background-color:#f4523b}.index_module_Table__0e2cd628 .bhd-pagination .bhd-pagination-item-active:hover{background-color:#ff7d66}.index_module_Table__0e2cd628 .bhd-pagination .bhd-pagination-item-active:hover>a,.index_module_Table__0e2cd628 .bhd-pagination .bhd-pagination-item-active>a{color:#fff}.index_module_Table__0e2cd628 .bhd-pagination.bhd-pagination-disabled .bhd-pagination-item{background:none!important;border:none!important;color:rgba(0,0,0,.25)!important}.index_module_Table__0e2cd628 .bhd-pagination.bhd-pagination-disabled .bhd-pagination-item a{color:rgba(0,0,0,.25)!important}.index_module_Table__0e2cd628 .bhd-pagination.bhd-pagination-mini .bhd-pagination-item{margin-right:8px!important}.index_module_Table__0e2cd628 .bhd-pagination.bhd-pagination-mini .bhd-pagination-item:not(.bhd-pagination-item-active):hover{background-color:transparent!important}.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table td,.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table th{border:none;border-bottom:1px solid #ebebeb}.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table>.bhd-table-thead>tr>.bhd-table-cell{background-color:#fafafa;color:rgba(0,0,0,.85);font-family:PingFang SC,helvetica neue,Source Han Sans CN,hiragino sans gb,arial,microsoft yahei ui,microsoft yahei,simsun,"sans-serif"!important;font-size:16px;font-weight:500;padding-bottom:8px;padding-top:8px;vertical-align:middle;white-space:nowrap}.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table>.bhd-table-thead>tr>.bhd-table-cell:first-child{padding-left:40px}.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table>.bhd-table-thead>tr>.bhd-table-cell:last-child{padding-right:40px}.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table>.bhd-table-thead>tr>.bhd-table-cell:before{display:none}.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table>.bhd-table-thead>tr>.bhd-table-cell.bhd-table-selection-column{-webkit-padding-end:16px;padding-inline-end:16px}.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table tbody tr.bhd-table-placeholder:hover td{background-color:#fff}.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table tbody tr:not(.bhd-table-placeholder){background:transparent}.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table tbody tr:not(.bhd-table-placeholder):hover td{background-color:#f5f5f5!important}.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table tbody tr:not(.bhd-table-placeholder) td{word-wrap:break-word;overflow:hidden;padding-bottom:13.5px;padding-top:13.5px;text-overflow:ellipsis;white-space:nowrap;word-break:break-all}.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table tbody tr:not(.bhd-table-placeholder) td:first-child{padding-left:40px}.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table tbody tr:not(.bhd-table-placeholder) td:last-child{padding-right:40px}.index_module_Table__0e2cd628.index_module_SmallTable__0e2cd628 table tbody tr:not(.bhd-table-placeholder) td.bhd-table-selection-column{-webkit-padding-end:16px;padding-inline-end:16px}.index_module_columnTootipClassName__0e2cd628 .bhd-tooltip-content .bhd-tooltip-inner{color:rgba(0,0,0,.85);word-break:break-all}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{_ as t,j as e,a as n,b as
|
|
1
|
+
import{_ as t,j as e,a as n,b as o,T as i,c as r}from"./ae211df8.esm.es5.production.js";import{useState as l,useRef as d,useEffect as a}from"react";import"react/jsx-runtime";import"react-dom";var u={Table:"index_module_Table__0e2cd628",SmallTable:"index_module_SmallTable__0e2cd628",columnTootipClassName:"index_module_columnTootipClassName__0e2cd628"},c=function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:14,n=0,o=document.createElement("div");return o.style.position="absolute",o.style.whiteSpace="nowrap",o.style.fontSize=e+"px",o.style.opacity="0",o.innerText=t,document.body.append(o),n=o.getBoundingClientRect().width,document.body.removeChild(o),n},s=function(r){var d=r.children,a=r.title,u=r.width,s=t(l(!1),2),m=s[0],h=s[1];return e(i,n(o({},r),{open:m,children:e("span",{onMouseEnter:function(t){var e=0;(e="function"==typeof u?u(t):u)?h(!(c(a)<e)):h(!0)},onMouseLeave:function(){h(!1)},children:d})}))},m=/^\d+%$/,h=/^\d+px$/,f=function(t){var e={};return parseFloat((e=window.getComputedStyle?getComputedStyle(t,null):t.currentStyle)["padding-left"])+parseFloat(e["padding-right"])},p=function(t){try{for(;t&&"TD"!==t.nodeName;)t=t.parentElement;var e=f(t);return t.clientWidth-e}catch(t){return null}},w=0,C=function(i){var c=d(null),f=d({timer:null}),C=i.defaultWidthRang,v=void 0===C?[180,240,320]:C,E=i.isFixedLeft,T=void 0===E||E,N=i.isFixedRight,g=void 0===N||N,y=i.bordered,_=void 0!==y&&y,L=i.kind,b=t(l(i.columns||[]),2),S=b[0],x=b[1],O=t(l(i.scroll||void 0),2),R=O[0],F=O[1],I=i.columnTootipClassName,W=i.columnTootipColor,M=function(){(t=document.createElement("div")).style.visibility="hidden",t.style.overflow="scroll",t.style.msOverflowStyle="scrollbar",document.body.appendChild(t),e=document.createElement("div"),t.appendChild(e),r=t.offsetWidth-e.offsetWidth,t.parentNode.removeChild(t),w=r||w;var t,e,r,l=_?c.current.offsetWidth-2-w:c.current.offsetWidth-w,d=A(i.columns,l).columns;x(d);var a=R||{};a=n(o({},a),{x:l}),F(a)},A=function(t,i){var r=0,l=0,d=0;t=t.map(function(t){return t.width=t.width||"auto",m.test(t.width)?t.width=parseFloat(t.width)>=100?"auto":i*parseFloat(t.width)/100:"number"==typeof t.width?t.width=t.width:h.test(t.width)?t.width=parseFloat(t.width):t.width="auto","auto"===t.width?(r+=1,t.widthRang||(t.widthRang=v),l+=t.widthRang[0],d+=t.widthRang[1]):(l+=t.width,d+=t.width),t.onColumnCell||(t.onColumnCell=t.onCell||function(){return{}}),t.render||(t.ellipsis={showTitle:!1},t.render=function(t){return e(s,{width:function(t){return p(t.target)},title:t,trigger:"hover",overlayClassName:I||u.columnTootipClassName,color:W||"#FFF",children:e("span",{children:t})})}),t});var a=i-l;if(a>0){var c=0;t=(t=t.map(function(t){return"auto"===t.width&&(t.width=t.widthRang[0]+a/r,t.width>t.widthRang[2]&&(c+=t.width-t.widthRang[2],t.width=t.widthRang[2])),t})).map(function(e,n){return c>0&&n!==t.length-1&&(e.width+=c/t.length-1),e})}else t=a<0?t.map(function(e,n){return T&&0===n&&(e.fixed="left"),g&&n===t.length-1&&(e.fixed="right"),"auto"===e.width&&(e.width=e.widthRang[1]),e}):t.map(function(t){return"auto"===t.width&&(t.width=t.widthRang[0]),t});return t.map(function(t){return t.onCell=function(e,i){var r="function"==typeof t.onColumnCell?t.onColumnCell(e,i):{};return r.style=r.style?r.style:{},n(o({},r),{style:o({maxWidth:t.width+"px"},r.style)})},t}),{columns:t,scrollWidth:d}},U=function(){clearTimeout(f.current.timer),f.current.timer=setTimeout(function(){M()},1e3)};a(function(){return M(),window.addEventListener("resize",U),function(){clearTimeout(f.current.timer),window.removeEventListener("resize",U)}},[i.columns]),a(function(){F(i.scroll||void 0)},[i.scroll]);var j=n(o({bordered:!1},i),{columns:S,scroll:R||{x:"auto"}});return e("div",{className:"".concat(u.Table," ").concat("simple"===L?u.SmallTable:""),ref:c,children:e(r,o({},j))})};C.SELECTION_COLUMN=r.SELECTION_COLUMN,C.EXPAND_COLUMN=r.EXPAND_COLUMN,C.SELECTION_ALL=r.SELECTION_ALL,C.SELECTION_INVERT=r.SELECTION_INVERT,C.SELECTION_NONE=r.SELECTION_NONE,C.Column=r.Column,C.ColumnGroup=r.ColumnGroup;export{C as default};
|
package/es2017/table/index.js
CHANGED
|
@@ -32,6 +32,22 @@ const getParentWidth = (node)=>{
|
|
|
32
32
|
// const defaultWidthRang: widthRangType = [180, 240, 320]; //默认自适应的值 [最小值,最佳值,最大值]
|
|
33
33
|
//传入的参数为onCell==>需要进行函数合并
|
|
34
34
|
/* 记录的滚动条宽度 */ let recordScrollBarWidth = 0;
|
|
35
|
+
function getScrollbarWidth() {
|
|
36
|
+
// Creating invisible container
|
|
37
|
+
const outer = document.createElement('div');
|
|
38
|
+
outer.style.visibility = 'hidden';
|
|
39
|
+
outer.style.overflow = 'scroll'; // forcing scrollbar to appear
|
|
40
|
+
outer.style.msOverflowStyle = 'scrollbar'; // needed for WinJS apps
|
|
41
|
+
document.body.appendChild(outer);
|
|
42
|
+
// Creating inner element and placing it in the container
|
|
43
|
+
const inner = document.createElement('div');
|
|
44
|
+
outer.appendChild(inner);
|
|
45
|
+
// Calculating difference between container's full width and the child width
|
|
46
|
+
const scrollbarWidth = outer.offsetWidth - inner.offsetWidth;
|
|
47
|
+
// Removing temporary elements from the DOM
|
|
48
|
+
outer.parentNode.removeChild(outer);
|
|
49
|
+
return scrollbarWidth;
|
|
50
|
+
}
|
|
35
51
|
const Table = (props)=>{
|
|
36
52
|
const tableRef = useRef(null);
|
|
37
53
|
const timerRef = useRef({
|
|
@@ -46,8 +62,10 @@ const Table = (props)=>{
|
|
|
46
62
|
const [scrollObject, setScrollObject] = useState(props.scroll || undefined);
|
|
47
63
|
let { columnTootipClassName , columnTootipColor } = props;
|
|
48
64
|
const initColumns = ()=>{
|
|
49
|
-
let scrollBarDom = tableRef.current.getElementsByClassName(
|
|
50
|
-
|
|
65
|
+
// let scrollBarDom = tableRef.current.getElementsByClassName(
|
|
66
|
+
// "bhd-table-cell-scrollbar"
|
|
67
|
+
// )[0];
|
|
68
|
+
const scrollBarWidth = getScrollbarWidth();
|
|
51
69
|
recordScrollBarWidth = scrollBarWidth || recordScrollBarWidth;
|
|
52
70
|
const tableWidth = bordered ? tableRef.current.offsetWidth - 2 - recordScrollBarWidth : tableRef.current.offsetWidth - recordScrollBarWidth;
|
|
53
71
|
let { columns: selfColumns } = initColumnsWidth(props.columns, tableWidth);
|
|
@@ -148,6 +148,8 @@
|
|
|
148
148
|
padding-top: 8px;
|
|
149
149
|
padding-bottom: 8px;
|
|
150
150
|
background-color: #fafafa;
|
|
151
|
+
vertical-align: middle;
|
|
152
|
+
font-family:"PingFang SC","helvetica neue","Source Han Sans CN","hiragino sans gb","arial","microsoft yahei ui","microsoft yahei","simsun","sans-serif" !important ;
|
|
151
153
|
&:nth-child(1) {
|
|
152
154
|
padding-left: 40px;
|
|
153
155
|
}
|
package/esm/table/index.js
CHANGED
|
@@ -33,6 +33,22 @@ var getParentWidth = function(node) {
|
|
|
33
33
|
// const defaultWidthRang: widthRangType = [180, 240, 320]; //默认自适应的值 [最小值,最佳值,最大值]
|
|
34
34
|
//传入的参数为onCell==>需要进行函数合并
|
|
35
35
|
/* 记录的滚动条宽度 */ var recordScrollBarWidth = 0;
|
|
36
|
+
function getScrollbarWidth() {
|
|
37
|
+
// Creating invisible container
|
|
38
|
+
var outer = document.createElement("div");
|
|
39
|
+
outer.style.visibility = "hidden";
|
|
40
|
+
outer.style.overflow = "scroll"; // forcing scrollbar to appear
|
|
41
|
+
outer.style.msOverflowStyle = "scrollbar"; // needed for WinJS apps
|
|
42
|
+
document.body.appendChild(outer);
|
|
43
|
+
// Creating inner element and placing it in the container
|
|
44
|
+
var inner = document.createElement("div");
|
|
45
|
+
outer.appendChild(inner);
|
|
46
|
+
// Calculating difference between container's full width and the child width
|
|
47
|
+
var scrollbarWidth = outer.offsetWidth - inner.offsetWidth;
|
|
48
|
+
// Removing temporary elements from the DOM
|
|
49
|
+
outer.parentNode.removeChild(outer);
|
|
50
|
+
return scrollbarWidth;
|
|
51
|
+
}
|
|
36
52
|
var Table = function(props) {
|
|
37
53
|
var tableRef = useRef(null);
|
|
38
54
|
var timerRef = useRef({
|
|
@@ -47,8 +63,10 @@ var Table = function(props) {
|
|
|
47
63
|
var _useState1 = _sliced_to_array(useState(props.scroll || undefined), 2), scrollObject = _useState1[0], setScrollObject = _useState1[1];
|
|
48
64
|
var columnTootipClassName = props.columnTootipClassName, columnTootipColor = props.columnTootipColor;
|
|
49
65
|
var initColumns = function() {
|
|
50
|
-
|
|
51
|
-
|
|
66
|
+
// let scrollBarDom = tableRef.current.getElementsByClassName(
|
|
67
|
+
// "bhd-table-cell-scrollbar"
|
|
68
|
+
// )[0];
|
|
69
|
+
var scrollBarWidth = getScrollbarWidth();
|
|
52
70
|
recordScrollBarWidth = scrollBarWidth || recordScrollBarWidth;
|
|
53
71
|
var tableWidth = bordered ? tableRef.current.offsetWidth - 2 - recordScrollBarWidth : tableRef.current.offsetWidth - recordScrollBarWidth;
|
|
54
72
|
var _initColumnsWidth = initColumnsWidth(props.columns, tableWidth), selfColumns = _initColumnsWidth.columns;
|
|
@@ -148,6 +148,8 @@
|
|
|
148
148
|
padding-top: 8px;
|
|
149
149
|
padding-bottom: 8px;
|
|
150
150
|
background-color: #fafafa;
|
|
151
|
+
vertical-align: middle;
|
|
152
|
+
font-family:"PingFang SC","helvetica neue","Source Han Sans CN","hiragino sans gb","arial","microsoft yahei ui","microsoft yahei","simsun","sans-serif" !important ;
|
|
151
153
|
&:nth-child(1) {
|
|
152
154
|
padding-left: 40px;
|
|
153
155
|
}
|