sea-chart 2.0.59 → 2.0.60

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.
@@ -0,0 +1,15 @@
1
+ <?xml version="1.0" encoding="utf-8"?>
2
+ <!-- Generator: Adobe Illustrator 21.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
3
+ <svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
4
+ viewBox="0 0 32 32" style="enable-background:new 0 0 32 32;" xml:space="preserve">
5
+ <style type="text/css">
6
+ .st0{fill:#999999;}
7
+ </style>
8
+ <path class="st0" d="M18.5,20.5c0.3,0,0.5,0.2,0.5,0.5v8c0,0.3-0.2,0.5-0.5,0.5h-2c-0.3,0-0.5-0.2-0.5-0.5v-8c0-0.3,0.2-0.5,0.5-0.5
9
+ H18.5z M15,23.5v3H1.5C1.2,26.5,1,26.3,1,26v-2c0-0.3,0.2-0.5,0.5-0.5H15z M30.5,23.5c0.3,0,0.5,0.2,0.5,0.5v2
10
+ c0,0.3-0.2,0.5-0.5,0.5H20v-3H30.5z M9.5,11.5c0.3,0,0.5,0.2,0.5,0.5v8c0,0.3-0.2,0.5-0.5,0.5h-2C7.2,20.5,7,20.3,7,20v-8
11
+ c0-0.3,0.2-0.5,0.5-0.5H9.5z M6,14.5v3H1.5C1.2,17.5,1,17.3,1,17v-2c0-0.3,0.2-0.5,0.5-0.5H6z M30.5,14.5c0.3,0,0.5,0.2,0.5,0.5v2
12
+ c0,0.3-0.2,0.5-0.5,0.5H11v-3H30.5z M21.5,2.5C21.8,2.5,22,2.7,22,3v8c0,0.3-0.2,0.5-0.5,0.5h-2c-0.3,0-0.5-0.2-0.5-0.5V3
13
+ c0-0.3,0.2-0.5,0.5-0.5H21.5z M18,5.5v3H1.5C1.2,8.5,1,8.3,1,8V6c0-0.3,0.2-0.5,0.5-0.5H18z M30.5,5.5C30.8,5.5,31,5.7,31,6v2
14
+ c0,0.3-0.2,0.5-0.5,0.5H23v-3H30.5z"/>
15
+ </svg>
@@ -0,0 +1,20 @@
1
+ <?xml version="1.0" encoding="utf-8"?>
2
+ <!-- Generator: Adobe Illustrator 21.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
3
+ <svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
4
+ viewBox="0 0 32 32" style="enable-background:new 0 0 32 32;" xml:space="preserve">
5
+ <style type="text/css">
6
+ .st0{fill:#999999;}
7
+ </style>
8
+ <title>field-set</title>
9
+ <g id="field-set">
10
+ <path id="形状" class="st0" d="M29.6,6.6H17.2c-0.8,0-1.4-0.6-1.4-1.4s0.6-1.4,1.4-1.4h12.4c0.8,0,1.4,0.6,1.4,1.4
11
+ S30.4,6.6,29.6,6.6L29.6,6.6z M5.2,9.5c-0.4,0-0.7-0.1-1-0.4L1.4,6.2C1.1,5.9,0.9,5.4,1,4.9s0.5-0.9,1-1c0.5-0.1,1,0,1.4,0.4
12
+ l1.8,1.8l4.6-4.6c0.4-0.4,0.9-0.5,1.4-0.4s0.9,0.5,1,1s0,1-0.4,1.4L6.2,9C6,9.3,5.6,9.5,5.2,9.5L5.2,9.5z M29.6,17.4H17.2
13
+ c-0.8,0-1.4-0.6-1.4-1.4c0-0.8,0.6-1.4,1.4-1.4h12.4c0.8,0,1.4,0.6,1.4,1.4C31,16.8,30.4,17.4,29.6,17.4L29.6,17.4z M5.2,20.2
14
+ c-0.4,0-0.7-0.1-1-0.4L1.4,17c-0.5-0.5-0.5-1.4,0-2c0.5-0.5,1.4-0.5,2,0l1.8,1.8l4.6-4.6c0.4-0.4,0.9-0.5,1.4-0.4s0.9,0.5,1,1
15
+ s0,1-0.4,1.4l-5.6,5.6C6,20.1,5.6,20.2,5.2,20.2L5.2,20.2z M29.6,28.2H17.2c-0.8,0-1.4-0.6-1.4-1.4c0-0.8,0.6-1.4,1.4-1.4h12.4
16
+ c0.8,0,1.4,0.6,1.4,1.4C31,27.6,30.4,28.2,29.6,28.2z M5.2,31c-0.4,0-0.7-0.1-1-0.4l-2.8-2.8c-0.4-0.4-0.5-0.9-0.4-1.4s0.5-0.9,1-1
17
+ c0.5-0.1,1,0,1.4,0.4l1.8,1.8L9.9,23c0.4-0.4,0.9-0.5,1.4-0.4c0.5,0.1,0.9,0.5,1,1c0.1,0.5,0,1-0.4,1.4l-5.6,5.6
18
+ C6,30.9,5.6,31,5.2,31L5.2,31z"/>
19
+ </g>
20
+ </svg>
@@ -80,6 +80,20 @@ class DtableSearchInput extends _react.Component {
80
80
  onClick: this.clearSearch
81
81
  }, "\xD7");
82
82
  };
83
+ this.renderExactMatch = () => {
84
+ const {
85
+ components = {}
86
+ } = this.props;
87
+ const {
88
+ ExactMatchIndicator
89
+ } = components;
90
+ if (/*#__PURE__*/_react.default.isValidElement(ExactMatchIndicator)) {
91
+ return ExactMatchIndicator;
92
+ } else if ((0, _utils.isFunction)(ExactMatchIndicator)) {
93
+ return /*#__PURE__*/_react.default.createElement(ExactMatchIndicator, null);
94
+ }
95
+ return null;
96
+ };
83
97
  this.state = {
84
98
  searchValue: props.value
85
99
  };
@@ -124,7 +138,7 @@ class DtableSearchInput extends _react.Component {
124
138
  disabled: disabled,
125
139
  style: style,
126
140
  ref: ref => this.inputRef = ref
127
- }), this.renderClear());
141
+ }), this.renderClear(), this.renderExactMatch());
128
142
  }
129
143
  }
130
144
  DtableSearchInput.defaultProps = {
@@ -31,10 +31,15 @@ class HideColumnPopover extends _react.default.Component {
31
31
  this.props.onPopoverToggle();
32
32
  }
33
33
  };
34
- this.onChooseAllColumns = () => {
34
+ this.getProtectedColumnKeys = () => {
35
35
  const {
36
- columns
36
+ columns,
37
+ ignoreColumnsKeys
37
38
  } = this.props;
39
+ if (Array.isArray(ignoreColumnsKeys)) return ignoreColumnsKeys;
40
+ return columns[0] ? [columns[0].key] : [];
41
+ };
42
+ this.onChooseAllColumns = () => {
38
43
  let shownColumnKeys = [];
39
44
  const {
40
45
  fieldSettings
@@ -44,7 +49,7 @@ class HideColumnPopover extends _react.default.Component {
44
49
  shownColumnKeys.push(setting.key);
45
50
  return setting;
46
51
  });
47
- shownColumnKeys.unshift(columns[0].key);
52
+ shownColumnKeys.unshift(...this.getProtectedColumnKeys().filter(key => !shownColumnKeys.includes(key)));
48
53
  this.setState({
49
54
  fieldSettings: newFieldSettings
50
55
  }, () => {
@@ -52,15 +57,12 @@ class HideColumnPopover extends _react.default.Component {
52
57
  });
53
58
  };
54
59
  this.onHideAllColumns = () => {
55
- const {
56
- columns
57
- } = this.props;
58
60
  const newFieldSettings = this.state.fieldSettings.map(setting => {
59
61
  setting.isChecked = false;
60
62
  return setting;
61
63
  });
62
64
  // table page cannot hide first column
63
- const shownColumnKeys = [columns[0].key];
65
+ const shownColumnKeys = [...this.getProtectedColumnKeys()];
64
66
  this.setState({
65
67
  fieldSettings: newFieldSettings
66
68
  }, () => {
@@ -68,9 +70,6 @@ class HideColumnPopover extends _react.default.Component {
68
70
  });
69
71
  };
70
72
  this.onUpdateFieldSetting = columnSetting => {
71
- const {
72
- columns
73
- } = this.props;
74
73
  const {
75
74
  fieldSettings
76
75
  } = this.state;
@@ -85,9 +84,8 @@ class HideColumnPopover extends _react.default.Component {
85
84
  return setting;
86
85
  });
87
86
  // table page cannot hide first column
88
- if (!shownColumnKeys.includes(columns[0].key)) {
89
- shownColumnKeys.unshift(columns[0].key);
90
- }
87
+ const protectedKeys = this.getProtectedColumnKeys().filter(key => !shownColumnKeys.includes(key));
88
+ shownColumnKeys.unshift(...protectedKeys);
91
89
  this.setState({
92
90
  fieldSettings: newFieldSettings
93
91
  }, () => {
@@ -138,7 +136,8 @@ class HideColumnPopover extends _react.default.Component {
138
136
  static getDerivedStateFromProps(nextProps, preState) {
139
137
  const {
140
138
  columns,
141
- shownColumnKeys
139
+ shownColumnKeys,
140
+ ignoreColumnsKeys
142
141
  } = nextProps;
143
142
  let fieldSettings = columns.map(column => {
144
143
  return {
@@ -147,8 +146,12 @@ class HideColumnPopover extends _react.default.Component {
147
146
  column: column
148
147
  };
149
148
  });
150
- // table page cannot hide first column
151
- fieldSettings.shift();
149
+ if (Array.isArray(ignoreColumnsKeys)) {
150
+ fieldSettings = fieldSettings.filter(setting => !ignoreColumnsKeys.includes(setting.key));
151
+ } else {
152
+ // table page cannot hide first column
153
+ fieldSettings.shift();
154
+ }
152
155
  return {
153
156
  fieldSettings: fieldSettings
154
157
  };
@@ -10,62 +10,78 @@ var _classnames = _interopRequireDefault(require("classnames"));
10
10
  var _rowCardHeaderCell = _interopRequireDefault(require("./row-card-header-cell"));
11
11
  class RowCardHeader extends _react.default.Component {
12
12
  constructor(props) {
13
+ var _this;
13
14
  super(props);
14
- this.onScrollControlClick = type => {
15
+ _this = this;
16
+ this.updateScrollMetrics = function () {
17
+ let prevState = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _this.state;
18
+ if (!_this.linkRecordsHeader) return;
19
+ if (_this.scrollTimer) return; // skip the forced layout read while the scroll animation is running
20
+ const {
21
+ offsetWidth,
22
+ scrollWidth
23
+ } = _this.linkRecordsHeader;
24
+ if (prevState.linkRecordsNavScrollWidth !== scrollWidth || prevState.linkRecordsNavWidth !== offsetWidth) {
25
+ _this.props.getCurrentDisplayRowMaxIndex();
26
+ _this.setState({
27
+ linkRecordsNavScrollWidth: scrollWidth,
28
+ linkRecordsNavWidth: offsetWidth
29
+ });
30
+ }
31
+ };
32
+ this.onScrollControlClick = (type, event) => {
33
+ event.stopPropagation();
15
34
  const tablesNav = this.linkRecordsHeader;
16
35
  const {
17
36
  offsetWidth,
18
- scrollWidth,
19
- scrollLeft
37
+ scrollWidth
20
38
  } = tablesNav;
39
+ const baseScrollLeft = this.scrollTimer ? this.targetScrollLeft : tablesNav.scrollLeft;
21
40
  let targetScrollLeft;
22
41
  if (type === 'prev') {
23
- if (scrollLeft === 0) {
42
+ if (baseScrollLeft === 0) {
24
43
  return;
25
44
  }
26
- targetScrollLeft = scrollLeft - offsetWidth;
45
+ targetScrollLeft = baseScrollLeft - offsetWidth;
27
46
  targetScrollLeft = targetScrollLeft > 0 ? targetScrollLeft : 0;
28
47
  }
29
48
  if (type === 'next') {
30
- if (scrollLeft + offsetWidth === scrollWidth) {
49
+ if (baseScrollLeft + offsetWidth >= scrollWidth) {
31
50
  return;
32
51
  }
33
- targetScrollLeft = scrollLeft + offsetWidth;
52
+ targetScrollLeft = baseScrollLeft + offsetWidth;
34
53
  targetScrollLeft = targetScrollLeft > scrollWidth - offsetWidth ? scrollWidth - offsetWidth : targetScrollLeft;
35
54
  }
36
- if (this.state.canCardHeaderScroll) {
37
- this.setState({
38
- canCardHeaderScroll: false
39
- });
40
- let timer = null;
41
- let step = (targetScrollLeft - scrollLeft) / 10;
42
- step = step > 0 ? Math.ceil(step) : Math.floor(step);
43
- timer = setInterval(() => {
44
- tablesNav.scrollLeft = tablesNav.scrollLeft + step;
45
- if (Math.abs(targetScrollLeft - tablesNav.scrollLeft) <= Math.abs(step)) {
46
- tablesNav.scrollLeft = targetScrollLeft;
47
- clearInterval(timer);
48
- this.setState({
49
- canCardHeaderScroll: true
50
- });
51
- }
52
- }, 30);
55
+ if (this.scrollTimer) {
56
+ clearInterval(this.scrollTimer);
57
+ this.scrollTimer = null;
53
58
  }
59
+ let step = (targetScrollLeft - tablesNav.scrollLeft) / 10;
60
+ step = step > 0 ? Math.ceil(step) : Math.floor(step);
61
+ this.targetScrollLeft = targetScrollLeft;
62
+ this.scrollTimer = setInterval(() => {
63
+ tablesNav.scrollLeft = tablesNav.scrollLeft + step;
64
+ this.syncScrollLeft(tablesNav.scrollLeft);
65
+ if (Math.abs(targetScrollLeft - tablesNav.scrollLeft) <= Math.abs(step)) {
66
+ tablesNav.scrollLeft = targetScrollLeft;
67
+ this.syncScrollLeft(targetScrollLeft);
68
+ clearInterval(this.scrollTimer);
69
+ this.scrollTimer = null;
70
+ this.targetScrollLeft = null;
71
+ }
72
+ }, 30);
54
73
  };
55
- this.onScrollHeader = () => {
56
- let {
57
- scrollLeft
58
- } = this.linkRecordsHeader;
74
+ this.onScrollHeader = event => {
75
+ event.stopPropagation();
76
+ this.syncScrollLeft(this.linkRecordsHeader.scrollLeft);
77
+ };
78
+ this.syncScrollLeft = scrollLeft => {
59
79
  this.props.setItemScrollLeft(scrollLeft, -1);
60
- if (this.timer) {
61
- clearTimeout(this.timer);
62
- }
63
- this.timer = setTimeout(() => {
64
- this.props.setScrollLeft(scrollLeft);
65
- }, 60);
66
80
  };
67
81
  this.setHeaderScrollLeft = scrollLeft => {
68
- this.linkRecordsHeader.scrollLeft = scrollLeft;
82
+ if (this.linkRecordsHeader && this.linkRecordsHeader.scrollLeft !== scrollLeft) {
83
+ this.linkRecordsHeader.scrollLeft = scrollLeft;
84
+ }
69
85
  };
70
86
  this.getCardHeaderCells = () => {
71
87
  const cardHeaderCells = [];
@@ -86,23 +102,20 @@ class RowCardHeader extends _react.default.Component {
86
102
  return cardHeaderCells;
87
103
  };
88
104
  this.state = {
89
- canCardHeaderScroll: true,
90
105
  linkRecordsNavScrollWidth: 0,
91
106
  linkRecordsNavWidth: 0
92
107
  };
108
+ this.scrollTimer = null;
109
+ this.targetScrollLeft = null;
110
+ }
111
+ componentDidMount() {
112
+ this.updateScrollMetrics();
93
113
  }
94
114
  componentDidUpdate(prevProps, prevState) {
95
- const {
96
- offsetWidth,
97
- scrollWidth
98
- } = this.linkRecordsHeader;
99
- if (prevState.linkRecordsNavScrollWidth !== scrollWidth || prevState.linkRecordsNavWidth !== offsetWidth) {
100
- this.props.getCurrentDisplayRowMaxIndex();
101
- this.setState({
102
- linkRecordsNavScrollWidth: scrollWidth,
103
- linkRecordsNavWidth: offsetWidth
104
- });
105
- }
115
+ this.updateScrollMetrics(prevState);
116
+ }
117
+ componentWillUnmount() {
118
+ this.scrollTimer && clearInterval(this.scrollTimer);
106
119
  }
107
120
  render() {
108
121
  const {
@@ -118,8 +131,7 @@ class RowCardHeader extends _react.default.Component {
118
131
  return /*#__PURE__*/_react.default.createElement("div", {
119
132
  className: `row-card-header ${cardHeaderClassName ? cardHeaderClassName : ''}`
120
133
  }, /*#__PURE__*/_react.default.createElement("div", {
121
- className: "row-card-column-names records-column-names",
122
- ref: ref => this.recordItemRef = ref
134
+ className: "row-card-column-names records-column-names"
123
135
  }, showScrollBtn && /*#__PURE__*/_react.default.createElement("span", {
124
136
  className: (0, _classnames.default)('dtable-font', 'dtable-icon-left', 'row-card-scroll', 'link-scroll-prev', {
125
137
  'scroll-active': scrollLeft > 0
@@ -143,15 +143,12 @@ class RowCardItem extends _react.PureComponent {
143
143
  setItemScrollLeft,
144
144
  rowIdx
145
145
  } = this.props;
146
- if (this.scrollActive) {
147
- this.scrollActive = false;
148
- return;
149
- }
150
146
  if (setItemScrollLeft) setItemScrollLeft(this.cardRecordsItemRef.scrollLeft, rowIdx);
151
147
  };
152
148
  this.setScrollLeft = scrollLeft => {
153
- this.scrollActive = true;
154
- this.cardRecordsItemRef.scrollLeft = scrollLeft;
149
+ if (this.cardRecordsItemRef && this.cardRecordsItemRef.scrollLeft !== scrollLeft) {
150
+ this.cardRecordsItemRef.scrollLeft = scrollLeft;
151
+ }
155
152
  };
156
153
  this.getScrollLeft = () => {
157
154
  return this.cardRecordsItemRef.scrollLeft;
@@ -165,20 +162,29 @@ class RowCardItem extends _react.PureComponent {
165
162
  }
166
163
  componentDidMount() {
167
164
  const {
165
+ row,
168
166
  rowIdx,
169
167
  onRef
170
168
  } = this.props;
171
- onRef && onRef(this, rowIdx);
169
+ onRef && onRef(this, rowIdx, row._id);
172
170
  this.unsubscribeChangeHeaderWidth = _eventBus.default.subscribe(_commonConstants.CommonEventTypes.CHANGE_HEADER_WIDTH, this.setDraggedCell);
173
171
  }
174
172
  componentWillUnmount() {
173
+ const {
174
+ row,
175
+ rowIdx,
176
+ onRef
177
+ } = this.props;
178
+ onRef && onRef(null, rowIdx, row._id);
175
179
  this.unsubscribeChangeHeaderWidth();
176
180
  }
177
- componentWillUpdate(nextProps) {
181
+ componentDidUpdate() {
178
182
  const {
183
+ row,
184
+ rowIdx,
179
185
  onRef
180
186
  } = this.props;
181
- onRef && onRef(this, nextProps.rowIdx);
187
+ onRef && onRef(this, rowIdx, row._id);
182
188
  }
183
189
  render() {
184
190
  const {
@@ -40,6 +40,7 @@
40
40
  line-height: 24px;
41
41
  position: absolute;
42
42
  top: 10px;
43
+ z-index: 1;
43
44
  background-color: #fff;
44
45
  }
45
46
 
@@ -84,7 +85,7 @@
84
85
  }
85
86
 
86
87
  .row-card-list {
87
- height: calc(100% - 40px);
88
+ height: calc(100% - 49px);
88
89
  width: 100%;
89
90
  min-width: 100%;
90
91
  padding: 10px 20px;
@@ -108,10 +109,22 @@
108
109
  overflow-y: unset;
109
110
  }
110
111
 
112
+ .row-card-list .row-card-content-virtualized {
113
+ position: relative;
114
+ }
115
+
116
+ .row-card-list .row-card-virtual-window {
117
+ position: absolute;
118
+ top: 0;
119
+ right: 0;
120
+ left: 0;
121
+ }
122
+
111
123
  .row-card-list .row-card-content::-webkit-scrollbar {
112
124
  width: 0;
113
125
  }
114
126
 
127
+ /* 88 + 10 = 98, keep in sync with CARD_RECORD_ITEM_HEIGHT in row-card.js */
115
128
  .row-card-item {
116
129
  height: 88px;
117
130
  margin-top: 10px;