@gpa-gemstone/common-pages 0.0.117 → 0.0.119
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/lib/EventCharacteristicFilter.js +23 -59
- package/lib/EventTypeFilter.js +8 -6
- package/lib/TimeFilter/QuickSelects.d.ts +1 -1
- package/lib/TimeFilter/QuickSelects.js +19 -20
- package/lib/{TimeFilter.d.ts → TimeFilter/TimeFilter.d.ts} +9 -9
- package/lib/TimeFilter/TimeFilter.js +224 -0
- package/lib/{TimeWindowUtils.d.ts → TimeFilter/TimeWindowUtils.d.ts} +18 -6
- package/lib/{TimeWindowUtils.js → TimeFilter/TimeWindowUtils.js} +27 -24
- package/lib/index.d.ts +3 -2
- package/lib/index.js +27 -2
- package/package.json +7 -7
- package/lib/TimeFilter.js +0 -273
@@ -102,9 +102,9 @@ var EventCharacteristicFilter = function (props) {
|
|
102
102
|
(NullOrNaN(filter.transientMin) || filter.transientMax >= filter.transientMin));
|
103
103
|
return true;
|
104
104
|
}
|
105
|
-
var sagsSelected = props.eventTypeFilter.find(function (i) { var _a
|
106
|
-
var swellsSelected = props.eventTypeFilter.find(function (i) { var _a
|
107
|
-
var transientsSelected = props.eventTypeFilter.find(function (i) { var _a
|
105
|
+
var sagsSelected = props.eventTypeFilter.find(function (i) { var _a; return i == ((_a = props.eventTypes.find(function (item) { return item.Name == 'Sag'; })) === null || _a === void 0 ? void 0 : _a.ID); }) != null;
|
106
|
+
var swellsSelected = props.eventTypeFilter.find(function (i) { var _a; return i == ((_a = props.eventTypes.find(function (item) { return item.Name == 'Swell'; })) === null || _a === void 0 ? void 0 : _a.ID); }) != null;
|
107
|
+
var transientsSelected = props.eventTypeFilter.find(function (i) { var _a; return i == ((_a = props.eventTypes.find(function (item) { return item.Name == 'Transient'; })) === null || _a === void 0 ? void 0 : _a.ID); }) != null;
|
108
108
|
if (newEventCharacteristicFilter === null || props.eventTypeFilter === null)
|
109
109
|
return null;
|
110
110
|
return (react_1.default.createElement("fieldset", { className: "border", style: { padding: '10px', height: '100%' } },
|
@@ -116,20 +116,11 @@ var EventCharacteristicFilter = function (props) {
|
|
116
116
|
react_1.default.createElement("div", { className: 'input-group input-group-sm', style: { width: '100%' } },
|
117
117
|
react_1.default.createElement(react_forms_1.Select, { Record: newEventCharacteristicFilter, Label: 'Mag-Dur:', Field: 'curveID', Setter: setNewEventCharacteristicFilter, Options: props.magDurCurves.map(function (v) { return ({ Value: v.ID.toString(), Label: v.Name }); }) })),
|
118
118
|
react_1.default.createElement("div", { className: 'form-check form-check-inline' },
|
119
|
-
react_1.default.createElement(
|
120
|
-
|
121
|
-
|
122
|
-
|
123
|
-
|
124
|
-
react_1.default.createElement("input", { className: "form-check-input", type: "radio", onChange: function () {
|
125
|
-
setNewEventCharacteristicFilter(__assign(__assign({}, newEventCharacteristicFilter), { curveOutside: true, curveInside: false }));
|
126
|
-
}, checked: newEventCharacteristicFilter.curveOutside && !newEventCharacteristicFilter.curveInside }),
|
127
|
-
react_1.default.createElement("label", { className: "form-check-label" }, "Outside")),
|
128
|
-
react_1.default.createElement("div", { className: 'form-check form-check-inline' },
|
129
|
-
react_1.default.createElement("input", { className: "form-check-input", type: "radio", onChange: function () {
|
130
|
-
setNewEventCharacteristicFilter(__assign(__assign({}, newEventCharacteristicFilter), { curveOutside: true, curveInside: true }));
|
131
|
-
}, checked: newEventCharacteristicFilter.curveOutside && newEventCharacteristicFilter.curveInside }),
|
132
|
-
react_1.default.createElement("label", { className: "form-check-label" }, "Both"))))),
|
119
|
+
react_1.default.createElement(react_forms_1.RadioButtons, { Record: newEventCharacteristicFilter, Label: '', Field: 'sagType', Setter: setNewEventCharacteristicFilter, Options: [
|
120
|
+
{ Value: 'LL', Label: 'LL' },
|
121
|
+
{ Value: 'LN', Label: 'LN' },
|
122
|
+
{ Value: 'both', Label: 'Both' }
|
123
|
+
] }))))),
|
133
124
|
react_1.default.createElement("div", { className: "col-4" },
|
134
125
|
react_1.default.createElement("form", null,
|
135
126
|
react_1.default.createElement("label", { style: { margin: 0 } }, "Duration (cycle):"),
|
@@ -155,20 +146,11 @@ var EventCharacteristicFilter = function (props) {
|
|
155
146
|
react_1.default.createElement(react_forms_1.Input, { Record: newEventCharacteristicFilter, Label: '', Disabled: !sagsSelected, Field: 'sagMax', Setter: setNewEventCharacteristicFilter, Valid: validMinMax, Feedback: 'Invalid Max', Type: 'number', Size: 'small', AllowNull: true })))),
|
156
147
|
react_1.default.createElement("div", { className: "row justify-content-md-center" },
|
157
148
|
react_1.default.createElement("div", { className: 'form-check form-check-inline' },
|
158
|
-
react_1.default.createElement(
|
159
|
-
|
160
|
-
|
161
|
-
|
162
|
-
|
163
|
-
react_1.default.createElement("input", { className: "form-check-input", type: "radio", onChange: function () {
|
164
|
-
setNewEventCharacteristicFilter(__assign(__assign({}, newEventCharacteristicFilter), { sagType: 'LN' }));
|
165
|
-
}, checked: newEventCharacteristicFilter.sagType == 'LN' }),
|
166
|
-
react_1.default.createElement("label", { className: "form-check-label" }, "LN")),
|
167
|
-
react_1.default.createElement("div", { className: 'form-check form-check-inline' },
|
168
|
-
react_1.default.createElement("input", { className: "form-check-input", type: "radio", onChange: function () {
|
169
|
-
setNewEventCharacteristicFilter(__assign(__assign({}, newEventCharacteristicFilter), { sagType: 'both' }));
|
170
|
-
}, checked: newEventCharacteristicFilter.sagType == 'both' }),
|
171
|
-
react_1.default.createElement("label", { className: "form-check-label" }, "Both")))))),
|
149
|
+
react_1.default.createElement(react_forms_1.RadioButtons, { Record: newEventCharacteristicFilter, Label: '', Field: 'sagType', Setter: setNewEventCharacteristicFilter, Options: [
|
150
|
+
{ Value: 'LL', Label: 'LL' },
|
151
|
+
{ Value: 'LN', Label: 'LN' },
|
152
|
+
{ Value: 'both', Label: 'Both' }
|
153
|
+
] })))))),
|
172
154
|
react_1.default.createElement("div", { className: "col-4" },
|
173
155
|
react_1.default.createElement(react_forms_1.MultiCheckBoxSelect, { Options: newPhases, Label: 'Phases', ItemTooltip: 'dark', OnChange: function (evt, Options) {
|
174
156
|
var phaseList = [];
|
@@ -195,20 +177,11 @@ var EventCharacteristicFilter = function (props) {
|
|
195
177
|
react_1.default.createElement(react_forms_1.Input, { Record: newEventCharacteristicFilter, Label: '', Disabled: !transientsSelected, Field: 'transientMax', Setter: setNewEventCharacteristicFilter, Valid: validMinMax, Feedback: 'Invalid Max', Size: 'small', AllowNull: true, Type: 'number' })))),
|
196
178
|
react_1.default.createElement("div", { className: "row justify-content-md-center" },
|
197
179
|
react_1.default.createElement("div", { className: 'form-check form-check-inline' },
|
198
|
-
react_1.default.createElement(
|
199
|
-
|
200
|
-
|
201
|
-
|
202
|
-
|
203
|
-
react_1.default.createElement("input", { className: "form-check-input", type: "radio", onChange: function () {
|
204
|
-
setNewEventCharacteristicFilter(__assign(__assign({}, newEventCharacteristicFilter), { transientType: 'LN' }));
|
205
|
-
}, checked: newEventCharacteristicFilter.transientType == 'LN' }),
|
206
|
-
react_1.default.createElement("label", { className: "form-check-label" }, "LN")),
|
207
|
-
react_1.default.createElement("div", { className: 'form-check form-check-inline' },
|
208
|
-
react_1.default.createElement("input", { className: "form-check-input", type: "radio", onChange: function () {
|
209
|
-
setNewEventCharacteristicFilter(__assign(__assign({}, newEventCharacteristicFilter), { transientType: 'both' }));
|
210
|
-
}, checked: newEventCharacteristicFilter.transientType == 'both' }),
|
211
|
-
react_1.default.createElement("label", { className: "form-check-label" }, "Both")))))),
|
180
|
+
react_1.default.createElement(react_forms_1.RadioButtons, { Record: newEventCharacteristicFilter, Label: '', Field: 'sagType', Setter: setNewEventCharacteristicFilter, Options: [
|
181
|
+
{ Value: 'LL', Label: 'LL' },
|
182
|
+
{ Value: 'LN', Label: 'LN' },
|
183
|
+
{ Value: 'both', Label: 'Both' }
|
184
|
+
] })))))),
|
212
185
|
react_1.default.createElement("div", { className: "col-4" },
|
213
186
|
react_1.default.createElement("form", null,
|
214
187
|
react_1.default.createElement("label", { style: { margin: 0 } }, "Swells (p.u.):"),
|
@@ -223,19 +196,10 @@ var EventCharacteristicFilter = function (props) {
|
|
223
196
|
react_1.default.createElement(react_forms_1.Input, { Record: newEventCharacteristicFilter, Label: '', Disabled: !swellsSelected, Field: 'swellMax', Setter: setNewEventCharacteristicFilter, Valid: validMinMax, Feedback: 'Invalid Max', Type: 'number', Size: 'small', AllowNull: true })))),
|
224
197
|
react_1.default.createElement("div", { className: "row justify-content-md-center" },
|
225
198
|
react_1.default.createElement("div", { className: 'form-check form-check-inline' },
|
226
|
-
react_1.default.createElement(
|
227
|
-
|
228
|
-
|
229
|
-
|
230
|
-
|
231
|
-
react_1.default.createElement("input", { className: "form-check-input", type: "radio", onChange: function () {
|
232
|
-
setNewEventCharacteristicFilter(__assign(__assign({}, newEventCharacteristicFilter), { swellType: 'LN' }));
|
233
|
-
}, checked: newEventCharacteristicFilter.swellType == 'LN' }),
|
234
|
-
react_1.default.createElement("label", { className: "form-check-label" }, "LN")),
|
235
|
-
react_1.default.createElement("div", { className: 'form-check form-check-inline' },
|
236
|
-
react_1.default.createElement("input", { className: "form-check-input", type: "radio", onChange: function () {
|
237
|
-
setNewEventCharacteristicFilter(__assign(__assign({}, newEventCharacteristicFilter), { swellType: 'both' }));
|
238
|
-
}, checked: newEventCharacteristicFilter.swellType == 'both' }),
|
239
|
-
react_1.default.createElement("label", { className: "form-check-label" }, "Both")))))))));
|
199
|
+
react_1.default.createElement(react_forms_1.RadioButtons, { Record: newEventCharacteristicFilter, Label: '', Field: 'sagType', Setter: setNewEventCharacteristicFilter, Options: [
|
200
|
+
{ Value: 'LL', Label: 'LL' },
|
201
|
+
{ Value: 'LN', Label: 'LN' },
|
202
|
+
{ Value: 'both', Label: 'Both' }
|
203
|
+
] })))))))));
|
240
204
|
};
|
241
205
|
exports.default = EventCharacteristicFilter;
|
package/lib/EventTypeFilter.js
CHANGED
@@ -134,11 +134,13 @@ var EventSearchTypeCategory = function (props) {
|
|
134
134
|
props.Data.filter(function (item) { return props.SelectedID.find(function (i) { return i == item.ID; }) == null; }).length == 0 ? 'un' : '',
|
135
135
|
"select all)")),
|
136
136
|
react_1.default.createElement("form", null,
|
137
|
-
react_1.default.createElement("ul", { style: { listStyleType: 'none', padding: 0, position: 'relative', float: 'left' } }, props.Data.map(function (item) {
|
138
|
-
react_1.default.createElement("
|
139
|
-
react_1.default.createElement("
|
140
|
-
|
141
|
-
|
142
|
-
|
137
|
+
react_1.default.createElement("ul", { style: { listStyleType: 'none', padding: 0, position: 'relative', float: 'left' } }, props.Data.map(function (item) {
|
138
|
+
return react_1.default.createElement("li", { key: item.ID },
|
139
|
+
react_1.default.createElement("label", null,
|
140
|
+
react_1.default.createElement("input", { type: "checkbox", onChange: function (e) {
|
141
|
+
props.OnChange(item, e.target.checked);
|
142
|
+
}, checked: props.SelectedID.find(function (i) { return i == item.ID; }) != null }),
|
143
|
+
item.Description));
|
144
|
+
}))));
|
143
145
|
};
|
144
146
|
exports.default = EventTypeFilter;
|
@@ -36,7 +36,7 @@ function getFormat(format) {
|
|
36
36
|
else if (format == "time")
|
37
37
|
return 'HH:mm:ss.SSS';
|
38
38
|
else
|
39
|
-
return 'MM/DD/YYYY HH:mm:ss.SSS';
|
39
|
+
return 'MM/DD/YYYY HH:mm:ss.SSS';
|
40
40
|
}
|
41
41
|
//update all quick selects to use new timefilters
|
42
42
|
exports.AvailableQuickSelects = [
|
@@ -46,8 +46,7 @@ exports.AvailableQuickSelects = [
|
|
46
46
|
var t = moment_1.default.utc().add(offset, 'minutes').startOf('hour');
|
47
47
|
return {
|
48
48
|
start: t.format(getFormat(format)),
|
49
|
-
|
50
|
-
duration: 60,
|
49
|
+
end: t.add(60, 'm').format(getFormat(format)),
|
51
50
|
};
|
52
51
|
},
|
53
52
|
hideQuickPick: function (f) {
|
@@ -130,8 +129,8 @@ exports.AvailableQuickSelects = [
|
|
130
129
|
var t = moment_1.default.utc().add(offset, 'minutes').startOf('week');
|
131
130
|
return {
|
132
131
|
start: t.format(getFormat(format)),
|
133
|
-
unit: '
|
134
|
-
duration: 7
|
132
|
+
unit: 'd',
|
133
|
+
duration: 7
|
135
134
|
};
|
136
135
|
},
|
137
136
|
hideQuickPick: function (f) {
|
@@ -144,8 +143,8 @@ exports.AvailableQuickSelects = [
|
|
144
143
|
var t = moment_1.default.utc().add(offset, 'minutes').startOf('week');
|
145
144
|
return {
|
146
145
|
end: t.format(getFormat(format)),
|
147
|
-
unit: '
|
148
|
-
duration: 7
|
146
|
+
unit: 'd',
|
147
|
+
duration: 7
|
149
148
|
};
|
150
149
|
},
|
151
150
|
hideQuickPick: function (f) {
|
@@ -158,8 +157,8 @@ exports.AvailableQuickSelects = [
|
|
158
157
|
var t = moment_1.default.utc().add(offset, 'minutes').startOf('day');
|
159
158
|
return {
|
160
159
|
end: t.format(getFormat(format)),
|
161
|
-
unit: '
|
162
|
-
duration: 7
|
160
|
+
unit: 'd',
|
161
|
+
duration: 7
|
163
162
|
};
|
164
163
|
},
|
165
164
|
hideQuickPick: function (f) {
|
@@ -170,11 +169,10 @@ exports.AvailableQuickSelects = [
|
|
170
169
|
label: 'This Month', createFilter: function (tz, format) {
|
171
170
|
var offset = moment_timezone_1.default.tz(moment_1.default.utc().startOf('month').format('YYYY-MM-DDTHH:mm:ss.SSSSS'), tz).utcOffset();
|
172
171
|
var t = moment_1.default.utc().add(offset, 'minutes').startOf('month');
|
173
|
-
var window = (t.daysInMonth() * 24);
|
174
172
|
return {
|
175
173
|
start: t.format(getFormat(format)),
|
176
|
-
unit: '
|
177
|
-
duration:
|
174
|
+
unit: 'd',
|
175
|
+
duration: t.daysInMonth()
|
178
176
|
};
|
179
177
|
},
|
180
178
|
hideQuickPick: function (f) {
|
@@ -185,11 +183,10 @@ exports.AvailableQuickSelects = [
|
|
185
183
|
label: 'Last Month', createFilter: function (tz, format) {
|
186
184
|
var offset = moment_timezone_1.default.tz(moment_1.default.utc().startOf('month').subtract(1, 'month').format('YYYY-MM-DDTHH:mm:ss.SSSSS'), tz).utcOffset();
|
187
185
|
var t = moment_1.default.utc().add(offset, 'minutes').startOf('month').subtract(1, 'month');
|
188
|
-
var window = (t.daysInMonth() * 24);
|
189
186
|
return {
|
190
187
|
start: t.format(getFormat(format)),
|
191
|
-
unit: '
|
192
|
-
duration:
|
188
|
+
unit: 'd',
|
189
|
+
duration: t.daysInMonth()
|
193
190
|
};
|
194
191
|
},
|
195
192
|
hideQuickPick: function (f) {
|
@@ -266,7 +263,8 @@ exports.AvailableQuickSelects = [
|
|
266
263
|
var t = moment_1.default.utc().add(offset, 'minutes').startOf('year');
|
267
264
|
return {
|
268
265
|
start: t.format(getFormat(format)),
|
269
|
-
|
266
|
+
unit: 'M',
|
267
|
+
duration: 12
|
270
268
|
};
|
271
269
|
},
|
272
270
|
hideQuickPick: function (f) {
|
@@ -275,11 +273,12 @@ exports.AvailableQuickSelects = [
|
|
275
273
|
},
|
276
274
|
{
|
277
275
|
label: 'Last Year', createFilter: function (tz, format) {
|
278
|
-
var offset = moment_timezone_1.default.tz(moment_1.default.utc().startOf('year').
|
279
|
-
var t = moment_1.default.utc().add(offset, '
|
276
|
+
var offset = moment_timezone_1.default.tz(moment_1.default.utc().startOf('year').format('YYYY-MM-DDTHH:mm:ss.SSSSS'), tz).utcOffset();
|
277
|
+
var t = moment_1.default.utc().add(offset, 'minutes').startOf('year');
|
280
278
|
return {
|
281
|
-
|
282
|
-
|
279
|
+
end: t.format(getFormat(format)),
|
280
|
+
unit: 'M',
|
281
|
+
duration: 12
|
283
282
|
};
|
284
283
|
},
|
285
284
|
hideQuickPick: function (f) {
|
@@ -1,15 +1,13 @@
|
|
1
1
|
import * as React from 'react';
|
2
|
-
import { IStartEnd, IStartDuration, IEndDuration,
|
3
|
-
import { DateUnit } from './
|
4
|
-
|
5
|
-
export declare function getTimeWindow(flt: ITimeFilter, format?: string): {
|
6
|
-
center: string;
|
2
|
+
import { IStartEnd, IStartDuration, IEndDuration, TimeUnit } from './TimeWindowUtils';
|
3
|
+
import { DateUnit } from './QuickSelects';
|
4
|
+
interface ITimeWindow {
|
7
5
|
start: string;
|
8
6
|
end: string;
|
9
7
|
unit: TimeUnit;
|
10
8
|
duration: number;
|
11
|
-
|
12
|
-
|
9
|
+
}
|
10
|
+
export type ITimeFilter = IStartEnd | IStartDuration | IEndDuration;
|
13
11
|
/**
|
14
12
|
* filter: an interface of IStartEnd | IStartDuration | IEndDuration | ICenterDuration
|
15
13
|
* showQuickSelect: displays Quick Select component
|
@@ -17,12 +15,14 @@ export declare function getTimeWindow(flt: ITimeFilter, format?: string): {
|
|
17
15
|
*/
|
18
16
|
interface IProps {
|
19
17
|
filter: ITimeFilter;
|
20
|
-
setFilter: (
|
18
|
+
setFilter: (start: string, end: string, unit: TimeUnit, duration: number) => void;
|
21
19
|
showQuickSelect: boolean;
|
22
|
-
dateTimeSetting: '
|
20
|
+
dateTimeSetting: 'startWindow' | 'endWindow' | 'startEnd';
|
23
21
|
timeZone: string;
|
24
22
|
isHorizontal: boolean;
|
25
23
|
format?: DateUnit;
|
24
|
+
showHelpMessage?: boolean;
|
26
25
|
}
|
27
26
|
declare const TimeFilter: (props: IProps) => React.JSX.Element;
|
27
|
+
export declare function getTimeWindowFromFilter(flt: ITimeFilter, format?: string): ITimeWindow;
|
28
28
|
export default TimeFilter;
|
@@ -0,0 +1,224 @@
|
|
1
|
+
"use strict";
|
2
|
+
//******************************************************************************************************
|
3
|
+
// TimeFilter.tsx - Gbtc
|
4
|
+
//
|
5
|
+
// Copyright © 2020, Grid Protection Alliance. All Rights Reserved.
|
6
|
+
//
|
7
|
+
// Licensed to the Grid Protection Alliance (GPA) under one or more contributor license agreements. See
|
8
|
+
// the NOTICE file distributed with this work for additional information regarding copyright ownership.
|
9
|
+
// The GPA licenses this file to you under the MIT License (MIT), the "License"; you may not use this
|
10
|
+
// file except in compliance with the License. You may obtain a copy of the License at:
|
11
|
+
//
|
12
|
+
// http://opensource.org/licenses/MIT
|
13
|
+
//
|
14
|
+
// Unless agreed to in writing, the subject software distributed under the License is distributed on an
|
15
|
+
// "AS-IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. Refer to the
|
16
|
+
// License for the specific language governing permissions and limitations.
|
17
|
+
//
|
18
|
+
// Code Modification History:
|
19
|
+
// ----------------------------------------------------------------------------------------------------
|
20
|
+
// 09/16/2021 - Christoph Lackner
|
21
|
+
// Generated original version of source code.
|
22
|
+
// 06/20/2024 - Ali Karrar
|
23
|
+
// Moved TimeFilter from SEBrowser to gemstone
|
24
|
+
//******************************************************************************************************
|
25
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
26
|
+
if (k2 === undefined) k2 = k;
|
27
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
28
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
29
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
30
|
+
}
|
31
|
+
Object.defineProperty(o, k2, desc);
|
32
|
+
}) : (function(o, m, k, k2) {
|
33
|
+
if (k2 === undefined) k2 = k;
|
34
|
+
o[k2] = m[k];
|
35
|
+
}));
|
36
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
37
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
38
|
+
}) : function(o, v) {
|
39
|
+
o["default"] = v;
|
40
|
+
});
|
41
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
42
|
+
if (mod && mod.__esModule) return mod;
|
43
|
+
var result = {};
|
44
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
45
|
+
__setModuleDefault(result, mod);
|
46
|
+
return result;
|
47
|
+
};
|
48
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
49
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
50
|
+
};
|
51
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
52
|
+
exports.getTimeWindowFromFilter = getTimeWindowFromFilter;
|
53
|
+
var React = __importStar(require("react"));
|
54
|
+
var react_forms_1 = require("@gpa-gemstone/react-forms");
|
55
|
+
var TimeWindowUtils_1 = require("./TimeWindowUtils");
|
56
|
+
var moment_1 = __importDefault(require("moment"));
|
57
|
+
var QuickSelects_1 = require("./QuickSelects");
|
58
|
+
var lodash_1 = __importDefault(require("lodash"));
|
59
|
+
var TimeFilter = function (props) {
|
60
|
+
var _a, _b, _c, _d;
|
61
|
+
var format = (0, QuickSelects_1.getFormat)(props.format);
|
62
|
+
var QuickSelects = React.useMemo(function () { return QuickSelects_1.AvailableQuickSelects.filter(function (qs) { return !qs.hideQuickPick(props.format); }); }, [props.format]);
|
63
|
+
var _e = React.useState(-1), activeQP = _e[0], setActiveQP = _e[1];
|
64
|
+
var _f = React.useState(getTimeWindowFromFilter(props.filter, format)), filter = _f[0], setFilter = _f[1];
|
65
|
+
// Checks typing of ITimeFilter and then compares to ITimeWindow
|
66
|
+
function isEqual(timeWindow, timeFilter) {
|
67
|
+
var flt = getTimeWindowFromFilter(timeFilter, format);
|
68
|
+
return lodash_1.default.isEqual(timeWindow, flt);
|
69
|
+
}
|
70
|
+
React.useEffect(function () {
|
71
|
+
if (!isEqual(filter, props.filter)) {
|
72
|
+
props.setFilter(filter.start, filter.end, filter.unit, filter.duration);
|
73
|
+
}
|
74
|
+
}, [filter]);
|
75
|
+
React.useEffect(function () {
|
76
|
+
if (!isEqual(filter, props.filter)) {
|
77
|
+
var flt = getTimeWindowFromFilter(props.filter, format);
|
78
|
+
setFilter(flt);
|
79
|
+
}
|
80
|
+
}, [props.filter]);
|
81
|
+
return (React.createElement("fieldset", { className: "border", style: { padding: '10px', height: '100%', overflow: 'hidden' } },
|
82
|
+
React.createElement("legend", { className: "w-auto", style: { fontSize: 'large' } }, "Date/Time Filter:"),
|
83
|
+
React.createElement(Row, { addRow: props.isHorizontal, class: 'm-0' },
|
84
|
+
props.dateTimeSetting === 'startWindow' || props.dateTimeSetting === 'startEnd' ?
|
85
|
+
React.createElement(Row, { addRow: !props.isHorizontal, class: 'm-0' },
|
86
|
+
React.createElement("div", { className: props.isHorizontal ? (props.showQuickSelect ? props.dateTimeSetting === 'startEnd' ? 'col-2' : 'col-4' : 'col-6') : 'col-12 p-0' },
|
87
|
+
React.createElement(react_forms_1.DatePicker, { Record: filter, Field: "start", Help: ((_a = props.showHelpMessage) !== null && _a !== void 0 ? _a : true) ? "All times are in system time. System time is currently set to ".concat(props.timeZone, ". ") : undefined, Setter: function (r) {
|
88
|
+
var flt = props.dateTimeSetting === 'startWindow' ?
|
89
|
+
getTimeWindowFromFilter({ start: r.start, duration: r.duration, unit: r.unit }, format) :
|
90
|
+
getTimeWindowFromFilter({ start: r.start, end: r.end }, format);
|
91
|
+
setFilter(flt);
|
92
|
+
setActiveQP(-1);
|
93
|
+
}, Label: 'Start of Time Window:', Type: (_b = props.format) !== null && _b !== void 0 ? _b : 'datetime-local', Valid: function () { return true; }, Format: format }),
|
94
|
+
props.showQuickSelect && props.dateTimeSetting === 'startWindow' ?
|
95
|
+
React.createElement(StartWindowForm, { IsHorizontal: props.isHorizontal, Filter: filter, SetFilter: setFilter, SetActiveQP: setActiveQP, Format: format, ShowQuickSelect: props.showQuickSelect })
|
96
|
+
: null))
|
97
|
+
: null,
|
98
|
+
props.dateTimeSetting === 'endWindow' || props.dateTimeSetting === 'startEnd' ?
|
99
|
+
React.createElement(Row, { addRow: !props.isHorizontal, class: 'm-0' },
|
100
|
+
React.createElement("div", { className: props.isHorizontal ? (props.showQuickSelect ? props.dateTimeSetting === 'startEnd' ? 'col-2' : 'col-4' : 'col-6') : 'col-12 p-0' },
|
101
|
+
React.createElement(react_forms_1.DatePicker, { Record: filter, Field: "end", Help: ((_c = props.showHelpMessage) !== null && _c !== void 0 ? _c : true) ? "All times are in system time. System time is currently set to ".concat(props.timeZone, ". ") : undefined, Setter: function (r) {
|
102
|
+
var flt = props.dateTimeSetting === 'endWindow' ?
|
103
|
+
getTimeWindowFromFilter({ end: r.end, duration: r.duration, unit: r.unit }, format) :
|
104
|
+
getTimeWindowFromFilter({ start: r.start, end: r.end }, format);
|
105
|
+
setFilter(flt);
|
106
|
+
setActiveQP(-1);
|
107
|
+
}, Label: 'End of Time Window :', Type: (_d = props.format) !== null && _d !== void 0 ? _d : 'datetime-local', Valid: function () { return true; }, Format: format }),
|
108
|
+
props.showQuickSelect && props.dateTimeSetting === 'endWindow' ?
|
109
|
+
React.createElement(EndWindowForm, { IsHorizontal: props.isHorizontal, Filter: filter, SetFilter: setFilter, SetActiveQP: setActiveQP, Format: format, ShowQuickSelect: props.showQuickSelect })
|
110
|
+
: null))
|
111
|
+
: null,
|
112
|
+
props.dateTimeSetting === 'startWindow' && !props.showQuickSelect ?
|
113
|
+
React.createElement(StartWindowForm, { IsHorizontal: props.isHorizontal, Filter: filter, SetFilter: setFilter, SetActiveQP: setActiveQP, Format: format, ShowQuickSelect: props.showQuickSelect })
|
114
|
+
: null,
|
115
|
+
props.dateTimeSetting === 'endWindow' && !props.showQuickSelect ?
|
116
|
+
React.createElement(EndWindowForm, { IsHorizontal: props.isHorizontal, Filter: filter, SetFilter: setFilter, SetActiveQP: setActiveQP, Format: format, ShowQuickSelect: props.showQuickSelect })
|
117
|
+
: null,
|
118
|
+
props.showQuickSelect ?
|
119
|
+
React.createElement("div", { className: props.isHorizontal ? "col-8 ".concat(props.dateTimeSetting !== 'startEnd' ? 'pt-3' : '') : 'row m-0 flex-grow-1' },
|
120
|
+
React.createElement(Row, { addRow: props.isHorizontal, class: "m-0 justify-content-center align-items-center" }, QuickSelects.map(function (qs, i) {
|
121
|
+
if (i % 3 !== 0)
|
122
|
+
return null;
|
123
|
+
return (React.createElement("div", { key: i, className: props.isHorizontal && props.dateTimeSetting === 'startEnd' ? 'col-2' : "col-4", style: { paddingLeft: (props.isHorizontal && props.dateTimeSetting === 'startEnd' ? 0 : (i % 9 == 0 ? 15 : 0)), paddingRight: (props.isHorizontal && props.dateTimeSetting === 'startEnd' ? 2 : ((i % 18 == 6 || i % 18 == 15) ? 15 : 2)), marginTop: 10 } },
|
124
|
+
React.createElement("ul", { className: "list-group", key: i },
|
125
|
+
React.createElement("li", { key: i, style: { cursor: 'pointer' }, onClick: function () {
|
126
|
+
var flt = getTimeWindowFromFilter(QuickSelects[i].createFilter(props.timeZone, props.format), format);
|
127
|
+
props.setFilter(flt.start, flt.end, flt.unit, flt.duration);
|
128
|
+
setActiveQP(i);
|
129
|
+
}, className: "item badge badge-" + (i == activeQP ? "primary" : "secondary") }, QuickSelects[i].label),
|
130
|
+
i + 1 < QuickSelects.length ?
|
131
|
+
React.createElement("li", { key: i + 1, style: { marginTop: 3, cursor: 'pointer' }, className: "item badge badge-" + (i + 1 == activeQP ? "primary" : "secondary"), onClick: function () {
|
132
|
+
var flt = getTimeWindowFromFilter(QuickSelects[i + 1].createFilter(props.timeZone, props.format), format);
|
133
|
+
props.setFilter(flt.start, flt.end, flt.unit, flt.duration);
|
134
|
+
setActiveQP(i + 1);
|
135
|
+
} }, QuickSelects[i + 1].label)
|
136
|
+
: null,
|
137
|
+
i + 2 < QuickSelects.length ?
|
138
|
+
React.createElement("li", { key: i + 2, style: { marginTop: 3, cursor: 'pointer' }, className: "item badge badge-" + (i + 2 == activeQP ? "primary" : "secondary"), onClick: function () {
|
139
|
+
var flt = getTimeWindowFromFilter(QuickSelects[i + 2].createFilter(props.timeZone, props.format), format);
|
140
|
+
props.setFilter(flt.start, flt.end, flt.unit, flt.duration);
|
141
|
+
setActiveQP(i + 2);
|
142
|
+
} }, QuickSelects[i + 2].label)
|
143
|
+
: null)));
|
144
|
+
})))
|
145
|
+
: null)));
|
146
|
+
};
|
147
|
+
var StartWindowForm = function (props) {
|
148
|
+
return (React.createElement(Row, { addRow: !props.IsHorizontal, class: 'm-0' },
|
149
|
+
React.createElement("div", { className: props.IsHorizontal ? props.ShowQuickSelect ? 'col-12 p-0' : 'col-6' : 'col-12 p-0' },
|
150
|
+
React.createElement("div", { className: 'form-group' },
|
151
|
+
React.createElement("label", { style: { width: '100%', position: 'relative', float: "left" } }, "Time Window(+): "),
|
152
|
+
React.createElement("div", { className: 'row' },
|
153
|
+
React.createElement("div", { className: 'col-6' },
|
154
|
+
React.createElement(react_forms_1.Input, { Record: props.Filter, Field: 'duration', Label: '', Valid: function () { return true; }, Type: 'number', Setter: function (r) {
|
155
|
+
props.SetFilter(getTimeWindowFromFilter({ start: r.start, duration: r.duration, unit: r.unit }, props.Format));
|
156
|
+
props.SetActiveQP(-1);
|
157
|
+
} })),
|
158
|
+
React.createElement("div", { className: 'col-6' },
|
159
|
+
React.createElement(react_forms_1.Select, { Record: props.Filter, Label: '', Field: 'unit', Options: TimeWindowUtils_1.units.map(function (unit) { return ({ Value: unit, Label: (0, TimeWindowUtils_1.readableUnit)(unit) }); }), Setter: function (r) {
|
160
|
+
props.SetFilter(getTimeWindowFromFilter({ start: r.start, duration: r.duration, unit: r.unit }, props.Format));
|
161
|
+
props.SetActiveQP(-1);
|
162
|
+
} })))))));
|
163
|
+
};
|
164
|
+
var EndWindowForm = function (props) {
|
165
|
+
return (React.createElement(Row, { addRow: !props.IsHorizontal, class: 'm-0' },
|
166
|
+
React.createElement("div", { className: props.IsHorizontal ? props.ShowQuickSelect ? 'col-12 p-0' : 'col-6' : 'col-12 p-0' },
|
167
|
+
React.createElement("div", { className: 'form-group' },
|
168
|
+
React.createElement("label", { style: { width: '100%', position: 'relative', float: "left" } }, "Time Window(-): "),
|
169
|
+
React.createElement("div", { className: 'row' },
|
170
|
+
React.createElement("div", { className: 'col-6' },
|
171
|
+
React.createElement(react_forms_1.Input, { Record: props.Filter, Field: 'duration', Label: '', Valid: function () { return true; }, Type: 'number', Setter: function (r) {
|
172
|
+
props.SetFilter(getTimeWindowFromFilter({ end: r.end, duration: r.duration, unit: r.unit }, props.Format));
|
173
|
+
props.SetActiveQP(-1);
|
174
|
+
} })),
|
175
|
+
React.createElement("div", { className: 'col-6' },
|
176
|
+
React.createElement(react_forms_1.Select, { Record: props.Filter, Label: '', Field: 'unit', Options: TimeWindowUtils_1.units.map(function (unit) { return ({ Value: unit, Label: (0, TimeWindowUtils_1.readableUnit)(unit) }); }), Setter: function (r) {
|
177
|
+
props.SetFilter(getTimeWindowFromFilter({ end: r.end, duration: r.duration, unit: r.unit }, props.Format));
|
178
|
+
props.SetActiveQP(-1);
|
179
|
+
} })))))));
|
180
|
+
};
|
181
|
+
// Returns a row div element with props as children of row
|
182
|
+
function Row(props) {
|
183
|
+
var _a;
|
184
|
+
if (props.addRow) {
|
185
|
+
return React.createElement("div", { className: "row ".concat((_a = props.class) !== null && _a !== void 0 ? _a : '') }, props.children);
|
186
|
+
}
|
187
|
+
return React.createElement(React.Fragment, null, props.children);
|
188
|
+
}
|
189
|
+
// Converts ITimeFilter to an ITimeWindow filter
|
190
|
+
function getTimeWindowFromFilter(flt, format) {
|
191
|
+
var start;
|
192
|
+
var end;
|
193
|
+
var unit;
|
194
|
+
var duration;
|
195
|
+
var formatFunction = function (start, end, unit, duration) { return ({
|
196
|
+
start: start.format(format),
|
197
|
+
end: end.format(format),
|
198
|
+
unit: unit,
|
199
|
+
duration: duration,
|
200
|
+
}); };
|
201
|
+
if ('start' in flt && 'duration' in flt) { // type is IStartDuration
|
202
|
+
start = (0, moment_1.default)(flt.start, format);
|
203
|
+
duration = flt.duration;
|
204
|
+
unit = flt.unit;
|
205
|
+
end = (0, TimeWindowUtils_1.addDuration)(start, duration, unit);
|
206
|
+
return formatFunction(start, end, unit, duration);
|
207
|
+
}
|
208
|
+
if ('end' in flt && 'duration' in flt) { // type is IEndDuration
|
209
|
+
end = (0, moment_1.default)(flt.end, format);
|
210
|
+
duration = flt.duration;
|
211
|
+
unit = flt.unit;
|
212
|
+
start = (0, TimeWindowUtils_1.addDuration)(end, -duration, unit);
|
213
|
+
return formatFunction(start, end, unit, duration);
|
214
|
+
}
|
215
|
+
if ('start' in flt && 'end' in flt) { // type is IStartEnd
|
216
|
+
start = (0, moment_1.default)(flt.start, format);
|
217
|
+
end = (0, moment_1.default)(flt.end, format);
|
218
|
+
unit = (0, TimeWindowUtils_1.findAppropriateUnit)(start, end);
|
219
|
+
duration = end.diff(start, unit);
|
220
|
+
return formatFunction(start, end, unit, duration);
|
221
|
+
}
|
222
|
+
throw TypeError("Unexpected type in getTimeWindowFromFilter, filter is: ".concat(flt.toString()));
|
223
|
+
}
|
224
|
+
exports.default = TimeFilter;
|
@@ -1,26 +1,38 @@
|
|
1
1
|
import moment from 'moment';
|
2
|
+
/**
|
3
|
+
* Interface represents picking a time based on Start Date and End Date
|
4
|
+
*/
|
2
5
|
export interface IStartEnd {
|
3
6
|
start: string;
|
4
7
|
end: string;
|
5
8
|
}
|
9
|
+
/**
|
10
|
+
* Interface represents picking a time based on Start Date and Duration
|
11
|
+
*/
|
6
12
|
export interface IStartDuration {
|
7
13
|
start: string;
|
8
14
|
duration: number;
|
9
15
|
unit: TimeUnit;
|
10
16
|
}
|
17
|
+
/**
|
18
|
+
* Interface represents picking a time based on End Date and Duration
|
19
|
+
*/
|
11
20
|
export interface IEndDuration {
|
12
21
|
end: string;
|
13
22
|
duration: number;
|
14
23
|
unit: TimeUnit;
|
15
24
|
}
|
16
|
-
export interface ICenterDuration {
|
17
|
-
center: string;
|
18
|
-
halfDuration: number;
|
19
|
-
unit: TimeUnit;
|
20
|
-
}
|
21
25
|
export type TimeUnit = 'y' | 'M' | 'w' | 'd' | 'h' | 'm' | 's' | 'ms';
|
22
26
|
export declare const units: TimeUnit[];
|
23
|
-
export declare
|
27
|
+
export declare const dateTimeFormat = "DD MM YYYY hh:mm:ss.SSS";
|
28
|
+
/**
|
29
|
+
* A Function to determine the most appropriate unit for a window of time specified by start and end time
|
30
|
+
*/
|
31
|
+
export declare function findAppropriateUnit(startTime: moment.Moment, endTime: moment.Moment): TimeUnit;
|
32
|
+
/**
|
33
|
+
* Function to handle adding or subtracting duration
|
34
|
+
*/
|
24
35
|
export declare function getStartEndTime(center: moment.Moment, duration: number, unit: TimeUnit): [moment.Moment, moment.Moment];
|
36
|
+
export declare function addDuration(start: moment.Moment, duration: number, unit: TimeUnit): moment.Moment;
|
25
37
|
export declare function getMoment(date: string, format?: string, time?: string): moment.Moment;
|
26
38
|
export declare function readableUnit(unit: TimeUnit): "Year(s)" | "Month(s)" | "Week(s)" | "Day(s)" | "Hour(s)" | "Minute(s)" | "Second(s)" | "Millisecond(s)";
|
@@ -3,9 +3,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
4
|
};
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
-
exports.units = void 0;
|
6
|
+
exports.dateTimeFormat = exports.units = void 0;
|
7
7
|
exports.findAppropriateUnit = findAppropriateUnit;
|
8
8
|
exports.getStartEndTime = getStartEndTime;
|
9
|
+
exports.addDuration = addDuration;
|
9
10
|
exports.getMoment = getMoment;
|
10
11
|
exports.readableUnit = readableUnit;
|
11
12
|
//******************************************************************************************************
|
@@ -33,47 +34,49 @@ exports.readableUnit = readableUnit;
|
|
33
34
|
//******************************************************************************************************
|
34
35
|
var moment_1 = __importDefault(require("moment"));
|
35
36
|
exports.units = ['ms', 's', 'm', 'h', 'd', 'w', 'M', 'y'];
|
36
|
-
|
37
|
+
exports.dateTimeFormat = 'DD MM YYYY hh:mm:ss.SSS';
|
38
|
+
/**
|
37
39
|
* A Function to determine the most appropriate unit for a window of time specified by start and end time
|
38
40
|
*/
|
39
|
-
function findAppropriateUnit(startTime, endTime
|
40
|
-
var unitIndex =
|
41
|
-
if (unit === undefined)
|
42
|
-
unitIndex = 7;
|
41
|
+
function findAppropriateUnit(startTime, endTime) {
|
42
|
+
var unitIndex = 7;
|
43
43
|
var diff = endTime.diff(startTime, exports.units[unitIndex], true);
|
44
|
-
if (useHalfWindow !== undefined && useHalfWindow)
|
45
|
-
diff = diff / 2;
|
46
44
|
for (var i = unitIndex; i >= 1; i--) {
|
47
|
-
if (i == 6) // Remove month as appropriate due to innacuracy in definition (31/30/28/29 days)
|
48
|
-
continue;
|
49
45
|
if (Number.isInteger(diff)) {
|
50
|
-
return
|
46
|
+
return exports.units[i];
|
51
47
|
}
|
52
48
|
var nextI = i - 1;
|
53
|
-
if (nextI == 6)
|
54
|
-
nextI = 5;
|
55
49
|
diff = endTime.diff(startTime, exports.units[nextI], true);
|
56
|
-
if (useHalfWindow !== undefined && useHalfWindow)
|
57
|
-
diff = diff / 2;
|
58
50
|
if (diff > 65000) {
|
59
51
|
diff = endTime.diff(startTime, exports.units[i], true);
|
60
|
-
|
61
|
-
diff = diff / 2;
|
62
|
-
return [exports.units[i], Math.round(diff)];
|
52
|
+
return exports.units[i];
|
63
53
|
}
|
64
54
|
}
|
65
|
-
return
|
55
|
+
return exports.units[0];
|
66
56
|
}
|
67
|
-
|
68
|
-
*
|
57
|
+
/**
|
58
|
+
* Function to handle adding or subtracting duration
|
69
59
|
*/
|
70
60
|
function getStartEndTime(center, duration, unit) {
|
71
|
-
var
|
72
|
-
var
|
73
|
-
var end = center.clone().add(d.asHours(), 'h');
|
61
|
+
var start = addDuration(center, -duration, unit);
|
62
|
+
var end = addDuration(center, duration, unit);
|
74
63
|
return [start, end];
|
75
64
|
}
|
76
65
|
/*
|
66
|
+
* Function to handle adding or subtracting duration
|
67
|
+
*/
|
68
|
+
function addDuration(start, duration, unit) {
|
69
|
+
var t1 = start.clone();
|
70
|
+
var floor = duration > 0 ? Math.floor(duration) : Math.ceil(duration); // if duration is negative, use Math.ceil() to get the floor
|
71
|
+
var ceil = duration > 0 ? Math.ceil(duration) : Math.floor(duration); // if duration is negative, use Math.floor() to get the ceil
|
72
|
+
if (floor == ceil && exports.units.findIndex(function (u) { return u == unit; }) >= 4) // if duration is integer, add duration without modifying
|
73
|
+
return t1.add(duration, unit);
|
74
|
+
t1.add(floor, unit);
|
75
|
+
var t2 = t1.clone().add(Math.sign(duration), unit); // Adds a duration of 1 or -1 depending on the sign of input duration
|
76
|
+
var hours = t2.diff(t1, 'h', true) * Math.abs(duration - floor); // Calculates the difference in hours between t2 and t1 and adds to t1
|
77
|
+
return t1.add(hours, 'h');
|
78
|
+
}
|
79
|
+
/*
|
77
80
|
* Returns a formatted version of date and time provided
|
78
81
|
*/
|
79
82
|
function getMoment(date, format, time) {
|
package/lib/index.d.ts
CHANGED
@@ -8,8 +8,9 @@ import { DefaultSearch } from './SearchBar';
|
|
8
8
|
import SelectPopup from './StandardSelectPopup';
|
9
9
|
import { DefaultSelects } from './SelectionPopup';
|
10
10
|
import ErrorBoundary from './ErrorBoundary';
|
11
|
-
import TimeFilter from './TimeFilter';
|
11
|
+
import TimeFilter from './TimeFilter/TimeFilter';
|
12
12
|
import EventTypeFilter from './EventTypeFilter';
|
13
13
|
import EventCharacteristicFilter from './EventCharacteristicFilter';
|
14
14
|
import NavBarFilterButton from './NavBarFilterButton';
|
15
|
-
|
15
|
+
import * as TimeWindowUtils from './TimeFilter/TimeWindowUtils';
|
16
|
+
export { TimeFilter, TimeWindowUtils, EventTypeFilter, EventCharacteristicFilter, NavBarFilterButton, Setting, Note, ValueList, ByValueList, User, ByUser, DefaultSearch, SelectPopup, DefaultSelects, ErrorBoundary };
|
package/lib/index.js
CHANGED
@@ -21,11 +21,34 @@
|
|
21
21
|
// Generated original version of source code.
|
22
22
|
//
|
23
23
|
// ******************************************************************************************************
|
24
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
25
|
+
if (k2 === undefined) k2 = k;
|
26
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
27
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
28
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
29
|
+
}
|
30
|
+
Object.defineProperty(o, k2, desc);
|
31
|
+
}) : (function(o, m, k, k2) {
|
32
|
+
if (k2 === undefined) k2 = k;
|
33
|
+
o[k2] = m[k];
|
34
|
+
}));
|
35
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
36
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
37
|
+
}) : function(o, v) {
|
38
|
+
o["default"] = v;
|
39
|
+
});
|
40
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
41
|
+
if (mod && mod.__esModule) return mod;
|
42
|
+
var result = {};
|
43
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
44
|
+
__setModuleDefault(result, mod);
|
45
|
+
return result;
|
46
|
+
};
|
24
47
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
25
48
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
26
49
|
};
|
27
50
|
Object.defineProperty(exports, "__esModule", { value: true });
|
28
|
-
exports.ErrorBoundary = exports.DefaultSelects = exports.SelectPopup = exports.DefaultSearch = exports.ByUser = exports.User = exports.ByValueList = exports.ValueList = exports.Note = exports.Setting = exports.NavBarFilterButton = exports.EventCharacteristicFilter = exports.EventTypeFilter = exports.TimeFilter = void 0;
|
51
|
+
exports.ErrorBoundary = exports.DefaultSelects = exports.SelectPopup = exports.DefaultSearch = exports.ByUser = exports.User = exports.ByValueList = exports.ValueList = exports.Note = exports.Setting = exports.NavBarFilterButton = exports.EventCharacteristicFilter = exports.EventTypeFilter = exports.TimeWindowUtils = exports.TimeFilter = void 0;
|
29
52
|
var Setting_1 = __importDefault(require("./Setting"));
|
30
53
|
exports.Setting = Setting_1.default;
|
31
54
|
var Note_1 = __importDefault(require("./Note"));
|
@@ -46,7 +69,7 @@ var SelectionPopup_1 = require("./SelectionPopup");
|
|
46
69
|
Object.defineProperty(exports, "DefaultSelects", { enumerable: true, get: function () { return SelectionPopup_1.DefaultSelects; } });
|
47
70
|
var ErrorBoundary_1 = __importDefault(require("./ErrorBoundary"));
|
48
71
|
exports.ErrorBoundary = ErrorBoundary_1.default;
|
49
|
-
var TimeFilter_1 = __importDefault(require("./TimeFilter"));
|
72
|
+
var TimeFilter_1 = __importDefault(require("./TimeFilter/TimeFilter"));
|
50
73
|
exports.TimeFilter = TimeFilter_1.default;
|
51
74
|
var EventTypeFilter_1 = __importDefault(require("./EventTypeFilter"));
|
52
75
|
exports.EventTypeFilter = EventTypeFilter_1.default;
|
@@ -54,3 +77,5 @@ var EventCharacteristicFilter_1 = __importDefault(require("./EventCharacteristic
|
|
54
77
|
exports.EventCharacteristicFilter = EventCharacteristicFilter_1.default;
|
55
78
|
var NavBarFilterButton_1 = __importDefault(require("./NavBarFilterButton"));
|
56
79
|
exports.NavBarFilterButton = NavBarFilterButton_1.default;
|
80
|
+
var TimeWindowUtils = __importStar(require("./TimeFilter/TimeWindowUtils"));
|
81
|
+
exports.TimeWindowUtils = TimeWindowUtils;
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@gpa-gemstone/common-pages",
|
3
|
-
"version": "0.0.
|
3
|
+
"version": "0.0.119",
|
4
4
|
"description": "Common UI pages for GPA products",
|
5
5
|
"main": "lib/index.js",
|
6
6
|
"types": "lib/index.d.ts",
|
@@ -44,12 +44,12 @@
|
|
44
44
|
"typescript": "5.5.3"
|
45
45
|
},
|
46
46
|
"dependencies": {
|
47
|
-
"@gpa-gemstone/application-typings": "0.0.
|
48
|
-
"@gpa-gemstone/gpa-symbols": "0.0.
|
49
|
-
"@gpa-gemstone/helper-functions": "0.0.
|
50
|
-
"@gpa-gemstone/react-forms": "1.1.
|
51
|
-
"@gpa-gemstone/react-interactive": "1.0.
|
52
|
-
"@gpa-gemstone/react-table": "1.2.
|
47
|
+
"@gpa-gemstone/application-typings": "0.0.77",
|
48
|
+
"@gpa-gemstone/gpa-symbols": "0.0.42",
|
49
|
+
"@gpa-gemstone/helper-functions": "0.0.35",
|
50
|
+
"@gpa-gemstone/react-forms": "1.1.73",
|
51
|
+
"@gpa-gemstone/react-interactive": "1.0.133",
|
52
|
+
"@gpa-gemstone/react-table": "1.2.55",
|
53
53
|
"@reduxjs/toolkit": "1.8.3",
|
54
54
|
"crypto-js": "^4.2.0",
|
55
55
|
"moment": "^2.29.4",
|
package/lib/TimeFilter.js
DELETED
@@ -1,273 +0,0 @@
|
|
1
|
-
"use strict";
|
2
|
-
//******************************************************************************************************
|
3
|
-
// TimeFilter.tsx - Gbtc
|
4
|
-
//
|
5
|
-
// Copyright © 2020, Grid Protection Alliance. All Rights Reserved.
|
6
|
-
//
|
7
|
-
// Licensed to the Grid Protection Alliance (GPA) under one or more contributor license agreements. See
|
8
|
-
// the NOTICE file distributed with this work for additional information regarding copyright ownership.
|
9
|
-
// The GPA licenses this file to you under the MIT License (MIT), the "License"; you may not use this
|
10
|
-
// file except in compliance with the License. You may obtain a copy of the License at:
|
11
|
-
//
|
12
|
-
// http://opensource.org/licenses/MIT
|
13
|
-
//
|
14
|
-
// Unless agreed to in writing, the subject software distributed under the License is distributed on an
|
15
|
-
// "AS-IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. Refer to the
|
16
|
-
// License for the specific language governing permissions and limitations.
|
17
|
-
//
|
18
|
-
// Code Modification History:
|
19
|
-
// ----------------------------------------------------------------------------------------------------
|
20
|
-
// 09/16/2021 - Christoph Lackner
|
21
|
-
// Generated original version of source code.
|
22
|
-
// 06/20/2024 - Ali Karrar
|
23
|
-
// Moved TimeFilter from SEBrowser to gemstone
|
24
|
-
//******************************************************************************************************
|
25
|
-
var __assign = (this && this.__assign) || function () {
|
26
|
-
__assign = Object.assign || function(t) {
|
27
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
28
|
-
s = arguments[i];
|
29
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
30
|
-
t[p] = s[p];
|
31
|
-
}
|
32
|
-
return t;
|
33
|
-
};
|
34
|
-
return __assign.apply(this, arguments);
|
35
|
-
};
|
36
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
37
|
-
if (k2 === undefined) k2 = k;
|
38
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
39
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
40
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
41
|
-
}
|
42
|
-
Object.defineProperty(o, k2, desc);
|
43
|
-
}) : (function(o, m, k, k2) {
|
44
|
-
if (k2 === undefined) k2 = k;
|
45
|
-
o[k2] = m[k];
|
46
|
-
}));
|
47
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
48
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
49
|
-
}) : function(o, v) {
|
50
|
-
o["default"] = v;
|
51
|
-
});
|
52
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
53
|
-
if (mod && mod.__esModule) return mod;
|
54
|
-
var result = {};
|
55
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
56
|
-
__setModuleDefault(result, mod);
|
57
|
-
return result;
|
58
|
-
};
|
59
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
60
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
61
|
-
};
|
62
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
63
|
-
exports.getTimeWindow = getTimeWindow;
|
64
|
-
var React = __importStar(require("react"));
|
65
|
-
var moment_1 = __importDefault(require("moment"));
|
66
|
-
var react_forms_1 = require("@gpa-gemstone/react-forms");
|
67
|
-
var TimeWindowUtils_1 = require("./TimeWindowUtils");
|
68
|
-
var QuickSelects_1 = require("./TimeFilter/QuickSelects");
|
69
|
-
// Converts ITimeFilter to an ITimeWindow filter
|
70
|
-
function getTimeWindow(flt, format) {
|
71
|
-
var _a, _b;
|
72
|
-
var _c, _d, _e;
|
73
|
-
var center, start, end, unit, duration, halfDuration;
|
74
|
-
if ('center' in flt && 'halfDuration' in flt) { // type is ICenterDuration
|
75
|
-
center = (0, TimeWindowUtils_1.getMoment)(flt.center, format);
|
76
|
-
_a = (0, TimeWindowUtils_1.getStartEndTime)(center, flt.halfDuration, flt.unit), start = _a[0], end = _a[1];
|
77
|
-
unit = flt.unit;
|
78
|
-
halfDuration = flt.halfDuration;
|
79
|
-
duration = halfDuration * 2;
|
80
|
-
}
|
81
|
-
else if ('start' in flt && 'duration' in flt) { // type is IStartDuration
|
82
|
-
start = (0, TimeWindowUtils_1.getMoment)(flt.start, format);
|
83
|
-
var d = moment_1.default.duration(flt.duration / 2.0, flt.unit);
|
84
|
-
center = start.clone().add(d);
|
85
|
-
end = center.clone().add(d);
|
86
|
-
unit = flt.unit;
|
87
|
-
duration = flt.duration,
|
88
|
-
halfDuration = duration / 2.0;
|
89
|
-
}
|
90
|
-
else if ('end' in flt && 'duration' in flt) { // type is IEndDuration
|
91
|
-
end = (0, TimeWindowUtils_1.getMoment)(flt.end, format);
|
92
|
-
var d = moment_1.default.duration(flt.duration / 2.0, flt.unit);
|
93
|
-
center = end.clone().subtract(d);
|
94
|
-
start = center.clone().subtract(d);
|
95
|
-
unit = flt.unit;
|
96
|
-
duration = flt.duration,
|
97
|
-
halfDuration = duration / 2.0;
|
98
|
-
}
|
99
|
-
else if ('start' in flt && 'end' in flt) { // type is IStartEnd
|
100
|
-
start = (0, TimeWindowUtils_1.getMoment)(flt.start, format);
|
101
|
-
end = (0, TimeWindowUtils_1.getMoment)(flt.end, format);
|
102
|
-
_b = (0, TimeWindowUtils_1.findAppropriateUnit)(start, end, undefined, true), unit = _b[0], halfDuration = _b[1];
|
103
|
-
var d = moment_1.default.duration(halfDuration, unit);
|
104
|
-
center = start.clone().add(d);
|
105
|
-
duration = halfDuration * 2;
|
106
|
-
}
|
107
|
-
return { center: (_c = center === null || center === void 0 ? void 0 : center.format(format)) !== null && _c !== void 0 ? _c : '',
|
108
|
-
start: (_d = start === null || start === void 0 ? void 0 : start.format(format)) !== null && _d !== void 0 ? _d : '',
|
109
|
-
end: (_e = end === null || end === void 0 ? void 0 : end.format(format)) !== null && _e !== void 0 ? _e : '',
|
110
|
-
unit: unit !== null && unit !== void 0 ? unit : 'ms',
|
111
|
-
duration: duration !== null && duration !== void 0 ? duration : 0,
|
112
|
-
halfDuration: halfDuration !== null && halfDuration !== void 0 ? halfDuration : 0 };
|
113
|
-
}
|
114
|
-
// Returns a row div element with props as children of row
|
115
|
-
function Row(props) {
|
116
|
-
var _a;
|
117
|
-
if (props.addRow) {
|
118
|
-
return React.createElement("div", { className: "row ".concat((_a = props.class) !== null && _a !== void 0 ? _a : '') }, props.children);
|
119
|
-
}
|
120
|
-
return React.createElement(React.Fragment, null, props.children);
|
121
|
-
}
|
122
|
-
var TimeFilter = function (props) {
|
123
|
-
var _a, _b, _c;
|
124
|
-
var format = (0, QuickSelects_1.getFormat)(props.format);
|
125
|
-
var QuickSelects = React.useMemo(function () { return QuickSelects_1.AvailableQuickSelects.filter(function (qs) { return !qs.hideQuickPick(props.format); }); }, [props.format]);
|
126
|
-
var _d = React.useState(-1), activeQP = _d[0], setActiveQP = _d[1];
|
127
|
-
var _e = React.useState(getTimeWindow(props.filter, format)), filter = _e[0], setFilter = _e[1];
|
128
|
-
React.useEffect(function () {
|
129
|
-
if (!isEqual(filter, props.filter))
|
130
|
-
props.setFilter(filter.center, filter.start, filter.end, filter.unit, filter.duration);
|
131
|
-
}, [filter]);
|
132
|
-
//Checks typing of ITimeFilter and then compares to ITimeWindow
|
133
|
-
function isEqual(flt1, flt2) {
|
134
|
-
var flt = getTimeWindow(flt2, format);
|
135
|
-
return flt1.center == flt.center &&
|
136
|
-
flt1.unit == flt.unit &&
|
137
|
-
flt1.duration == flt.duration;
|
138
|
-
}
|
139
|
-
React.useEffect(function () {
|
140
|
-
if (!isEqual(filter, props.filter)) {
|
141
|
-
var flt = getTimeWindow(props.filter, format);
|
142
|
-
setFilter(flt);
|
143
|
-
}
|
144
|
-
}, [props.filter]);
|
145
|
-
return (React.createElement("fieldset", { className: "border", style: { padding: '10px', height: '100%' } },
|
146
|
-
React.createElement("legend", { className: "w-auto", style: { fontSize: 'large' } }, "Date/Time Filter:"),
|
147
|
-
React.createElement(Row, { addRow: props.isHorizontal },
|
148
|
-
props.dateTimeSetting === 'center' ?
|
149
|
-
React.createElement(Row, { addRow: !props.isHorizontal },
|
150
|
-
React.createElement("div", { className: props.isHorizontal ? (props.showQuickSelect ? 'col-2' : 'col-6') : 'col-12' },
|
151
|
-
React.createElement(react_forms_1.DatePicker, { Record: filter, Field: "center", Help: "All times are in system time. System time is currently set to ".concat(props.timeZone, ". "), Setter: function (r) {
|
152
|
-
setFilter(function (prevFilter) { return (__assign(__assign({}, prevFilter), { center: r.center, start: r.start, end: r.end })); });
|
153
|
-
setActiveQP(-1);
|
154
|
-
}, Label: 'Time Window Center:', Type: (_a = props.format) !== null && _a !== void 0 ? _a : 'datetime-local', Valid: function () { return true; }, Format: format })))
|
155
|
-
: null,
|
156
|
-
props.dateTimeSetting === 'startWindow' || props.dateTimeSetting === 'startEnd' ?
|
157
|
-
React.createElement(Row, { addRow: !props.isHorizontal },
|
158
|
-
React.createElement("div", { className: props.isHorizontal ? (props.showQuickSelect ? 'col-2' : 'col-6') : 'col-12' },
|
159
|
-
React.createElement(react_forms_1.DatePicker, { Record: filter, Field: "start", Help: "All times are in system time. System time is currently set to ".concat(props.timeZone, ". "), Setter: function (r) {
|
160
|
-
var _a;
|
161
|
-
var halfDur = filter.halfDuration;
|
162
|
-
var unit = filter.unit;
|
163
|
-
if (props.dateTimeSetting === 'startEnd') {
|
164
|
-
_a = (0, TimeWindowUtils_1.findAppropriateUnit)((0, TimeWindowUtils_1.getMoment)(r.start, format), (0, TimeWindowUtils_1.getMoment)(filter.end, format), undefined, true), unit = _a[0], halfDur = _a[1];
|
165
|
-
}
|
166
|
-
var flt = getTimeWindow({ start: r.start, duration: halfDur * 2, unit: unit }, format);
|
167
|
-
setFilter(flt);
|
168
|
-
setActiveQP(-1);
|
169
|
-
}, Label: 'Start of Time Window:', Type: (_b = props.format) !== null && _b !== void 0 ? _b : 'datetime-local', Valid: function () { return true; }, Format: format })))
|
170
|
-
: null,
|
171
|
-
props.dateTimeSetting === 'endWindow' || props.dateTimeSetting === 'startEnd' ?
|
172
|
-
React.createElement(Row, { addRow: !props.isHorizontal },
|
173
|
-
React.createElement("div", { className: props.isHorizontal ? (props.showQuickSelect ? 'col-2' : 'col-6') : 'col-12' },
|
174
|
-
React.createElement(react_forms_1.DatePicker, { Record: filter, Field: "end", Help: "All times are in system time. System time is currently set to ".concat(props.timeZone, ". "), Setter: function (r) {
|
175
|
-
var _a;
|
176
|
-
var halfDur = filter.halfDuration;
|
177
|
-
var unit = filter.unit;
|
178
|
-
if (props.dateTimeSetting === 'startEnd') {
|
179
|
-
_a = (0, TimeWindowUtils_1.findAppropriateUnit)((0, TimeWindowUtils_1.getMoment)(filter.start, format), (0, TimeWindowUtils_1.getMoment)(r.end, format), undefined, true), unit = _a[0], halfDur = _a[1];
|
180
|
-
}
|
181
|
-
var flt = getTimeWindow({ end: r.end, duration: halfDur * 2, unit: unit }, format);
|
182
|
-
setFilter(flt);
|
183
|
-
setActiveQP(-1);
|
184
|
-
}, Label: 'End of Time Window :', Type: (_c = props.format) !== null && _c !== void 0 ? _c : 'datetime-local', Valid: function () { return true; }, Format: format })))
|
185
|
-
: null,
|
186
|
-
props.dateTimeSetting === 'center' ?
|
187
|
-
React.createElement(React.Fragment, null,
|
188
|
-
React.createElement("label", { style: { width: '100%', position: 'relative', float: "left" } }, "Time Window(+/-): "),
|
189
|
-
React.createElement(Row, { addRow: !props.isHorizontal },
|
190
|
-
React.createElement("div", { className: props.isHorizontal ? (props.showQuickSelect ? 'col-1' : 'col-3') : 'col-6' },
|
191
|
-
React.createElement(react_forms_1.Input, { Record: filter, Field: 'halfDuration', Setter: function (r) {
|
192
|
-
var flt = getTimeWindow({ center: filter.center, halfDuration: r.halfDuration, unit: filter.unit }, format);
|
193
|
-
setFilter(function (prevFilter) { return (__assign(__assign({}, prevFilter), { duration: r.duration, halfDuration: r.halfDuration, start: flt.start, end: flt.end })); });
|
194
|
-
setActiveQP(-1);
|
195
|
-
}, Label: '', Valid: function () { return true; }, Type: 'number' })),
|
196
|
-
React.createElement("div", { className: props.isHorizontal ? (props.showQuickSelect ? 'col-1' : 'col-3') : 'col-6' },
|
197
|
-
React.createElement(react_forms_1.Select, { Record: filter, Label: '', Field: 'unit', Setter: function (r) {
|
198
|
-
var flt = getTimeWindow({ center: filter.center, halfDuration: filter.halfDuration, unit: r.unit }, format);
|
199
|
-
setFilter(function (prevFilter) { return (__assign(__assign({}, prevFilter), { unit: r.unit, start: flt.start, end: flt.end })); });
|
200
|
-
setActiveQP(-1);
|
201
|
-
}, Options: TimeWindowUtils_1.units.map(function (unit) { return ({
|
202
|
-
Value: unit,
|
203
|
-
Label: (0, TimeWindowUtils_1.readableUnit)(unit)
|
204
|
-
}); }) }))))
|
205
|
-
: null,
|
206
|
-
props.dateTimeSetting === 'startWindow' ?
|
207
|
-
React.createElement(React.Fragment, null,
|
208
|
-
React.createElement("label", { style: { width: '100%', position: 'relative', float: "left" } }, "Time Window(+): "),
|
209
|
-
React.createElement(Row, { addRow: !props.isHorizontal },
|
210
|
-
React.createElement("div", { className: props.isHorizontal ? (props.showQuickSelect ? 'col-1' : 'col-3') : 'col-6' },
|
211
|
-
React.createElement(react_forms_1.Input, { Record: filter, Field: 'duration', Setter: function (r) {
|
212
|
-
var flt = getTimeWindow({ start: filter.start, duration: r.duration, unit: filter.unit }, format);
|
213
|
-
setFilter(function (prevFilter) { return (__assign(__assign({}, prevFilter), { duration: r.duration, halfDuration: r.halfDuration, center: flt.center, end: flt.end })); });
|
214
|
-
setActiveQP(-1);
|
215
|
-
}, Label: '', Valid: function () { return true; }, Type: 'number' })),
|
216
|
-
React.createElement("div", { className: props.isHorizontal ? (props.showQuickSelect ? 'col-1' : 'col-3') : 'col-6' },
|
217
|
-
React.createElement(react_forms_1.Select, { Record: filter, Label: '', Field: 'unit', Setter: function (r) {
|
218
|
-
var flt = getTimeWindow({ start: filter.start, duration: filter.duration, unit: r.unit }, format);
|
219
|
-
setFilter(function (prevFilter) { return (__assign(__assign({}, prevFilter), { unit: r.unit, center: flt.center, end: flt.end })); });
|
220
|
-
setActiveQP(-1);
|
221
|
-
}, Options: TimeWindowUtils_1.units.map(function (unit) { return ({
|
222
|
-
Value: unit,
|
223
|
-
Label: (0, TimeWindowUtils_1.readableUnit)(unit)
|
224
|
-
}); }) }))))
|
225
|
-
: null,
|
226
|
-
props.dateTimeSetting === 'endWindow' ?
|
227
|
-
React.createElement(React.Fragment, null,
|
228
|
-
React.createElement("label", { style: { width: '100%', position: 'relative', float: "left" } }, "Time Window(-): "),
|
229
|
-
React.createElement(Row, { addRow: !props.isHorizontal },
|
230
|
-
React.createElement("div", { className: props.isHorizontal ? (props.showQuickSelect ? 'col-1' : 'col-3') : 'col-6' },
|
231
|
-
React.createElement(react_forms_1.Input, { Record: filter, Field: 'duration', Setter: function (r) {
|
232
|
-
var flt = getTimeWindow({ end: filter.end, duration: r.duration, unit: filter.unit }, format);
|
233
|
-
setFilter(function (prevFilter) { return (__assign(__assign({}, prevFilter), { duration: r.duration, halfDuration: r.halfDuration, center: flt.center, start: flt.start })); });
|
234
|
-
setActiveQP(-1);
|
235
|
-
}, Label: '', Valid: function () { return true; }, Type: 'number' })),
|
236
|
-
React.createElement("div", { className: props.isHorizontal ? (props.showQuickSelect ? 'col-1' : 'col-3') : 'col-6' },
|
237
|
-
React.createElement(react_forms_1.Select, { Record: filter, Label: '', Field: 'unit', Setter: function (r) {
|
238
|
-
var flt = getTimeWindow({ end: filter.end, duration: filter.duration, unit: r.unit }, format);
|
239
|
-
setFilter(function (prevFilter) { return (__assign(__assign({}, prevFilter), { unit: r.unit, center: flt.center, start: flt.start })); });
|
240
|
-
setActiveQP(-1);
|
241
|
-
}, Options: TimeWindowUtils_1.units.map(function (unit) { return ({
|
242
|
-
Value: unit,
|
243
|
-
Label: (0, TimeWindowUtils_1.readableUnit)(unit)
|
244
|
-
}); }) }))))
|
245
|
-
: null,
|
246
|
-
props.showQuickSelect ?
|
247
|
-
React.createElement("div", { className: props.isHorizontal ? 'col-8' : 'row' },
|
248
|
-
React.createElement(Row, { addRow: props.isHorizontal, class: "justify-content-center" }, QuickSelects.map(function (qs, i) {
|
249
|
-
if (i % 3 !== 0)
|
250
|
-
return null;
|
251
|
-
return (React.createElement("div", { key: i, className: props.isHorizontal ? 'col-2' : "col-4", style: { paddingLeft: (props.isHorizontal ? 0 : (i % 9 == 0 ? 15 : 0)), paddingRight: (props.isHorizontal ? 2 : ((i % 18 == 6 || i % 18 == 15) ? 15 : 2)), marginTop: 10 } },
|
252
|
-
React.createElement("ul", { className: "list-group", key: i },
|
253
|
-
React.createElement("li", { key: i, style: { cursor: 'pointer' }, onClick: function () {
|
254
|
-
var flt = getTimeWindow(QuickSelects[i].createFilter(props.timeZone, props.format), format);
|
255
|
-
props.setFilter(flt.center, flt.start, flt.end, flt.unit, flt.duration);
|
256
|
-
setActiveQP(i);
|
257
|
-
}, className: "item badge badge-" + (i == activeQP ? "primary" : "secondary") }, QuickSelects[i].label),
|
258
|
-
i + 1 < QuickSelects.length ?
|
259
|
-
React.createElement("li", { key: i + 1, style: { marginTop: 3, cursor: 'pointer' }, className: "item badge badge-" + (i + 1 == activeQP ? "primary" : "secondary"), onClick: function () {
|
260
|
-
var flt = getTimeWindow(QuickSelects[i + 1].createFilter(props.timeZone, props.format), format);
|
261
|
-
props.setFilter(flt.center, flt.start, flt.end, flt.unit, flt.duration);
|
262
|
-
setActiveQP(i + 1);
|
263
|
-
} }, QuickSelects[i + 1].label) : null,
|
264
|
-
i + 2 < QuickSelects.length ?
|
265
|
-
React.createElement("li", { key: i + 2, style: { marginTop: 3, cursor: 'pointer' }, className: "item badge badge-" + (i + 2 == activeQP ? "primary" : "secondary"), onClick: function () {
|
266
|
-
var flt = getTimeWindow(QuickSelects[i + 2].createFilter(props.timeZone, props.format), format);
|
267
|
-
props.setFilter(flt.center, flt.start, flt.end, flt.unit, flt.duration);
|
268
|
-
setActiveQP(i + 2);
|
269
|
-
} }, QuickSelects[i + 2].label) : null)));
|
270
|
-
})))
|
271
|
-
: null)));
|
272
|
-
};
|
273
|
-
exports.default = TimeFilter;
|