@agilemotion/oui-react-js 1.8.50 → 1.8.52

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.
@@ -1,562 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
- var _react = _interopRequireWildcard(require("react"));
8
- var _Utils = _interopRequireDefault(require("../Utils"));
9
- var _reactstrap = require("reactstrap");
10
- var _Icon = _interopRequireDefault(require("../components/Icon"));
11
- var _IconButton = _interopRequireDefault(require("@mui/material/IconButton"));
12
- var _Paper = _interopRequireDefault(require("@mui/material/Paper"));
13
- var _Button = _interopRequireDefault(require("@mui/material/Button"));
14
- var _RestUtils = require("../RestUtils");
15
- var _RouteActionHandler = _interopRequireDefault(require("../event/RouteActionHandler"));
16
- var _ApplicationManager = _interopRequireDefault(require("../ApplicationManager"));
17
- var _Event = _interopRequireDefault(require("../event/Event"));
18
- var _Observable = _interopRequireDefault(require("../event/Observable"));
19
- var _EventType = _interopRequireDefault(require("../event/EventType"));
20
- var _AlertBar = _interopRequireDefault(require("../components/AlertBar"));
21
- var _reactPromiseTracker = require("react-promise-tracker");
22
- var _View = require("../components/layout/View");
23
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
24
- function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
25
- function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
26
- const location = window.location.protocol + '//' + window.location.hostname;
27
- const text = response => {
28
- return response.text();
29
- };
30
- const alertBarHandle = {};
31
- const DashboardCard = props => {
32
- const [path, setPath] = _react.default.useState(null);
33
- const [name, setName] = _react.default.useState(null);
34
- const [displayType, setDisplayType] = _react.default.useState(null);
35
- const [view, setview] = _react.default.useState(null);
36
- const {
37
- settings
38
- } = props;
39
- const [id, setId] = _react.default.useState(props.settings.id);
40
- const [content, setContent] = _react.default.useState(null);
41
- const [ref] = _react.default.useState(/*#__PURE__*/_react.default.createRef());
42
- const keyCounter = (0, _react.useRef)(0);
43
- _react.default.useEffect(() => {
44
- const accessToken = sessionStorage.getItem('accessToken');
45
- const idToken = sessionStorage.getItem('idToken');
46
- const handle = {
47
- api: {
48
- get id() {
49
- return 'dashboard-menus';
50
- },
51
- loaded() {
52
- return true;
53
- }
54
- }
55
- };
56
- if (path && displayType) {
57
- if (displayType === 'VIEW') {
58
- (0, _RestUtils.sendRequest)(path, data => {
59
- setview(/*#__PURE__*/_react.default.createElement(_View.View, {
60
- key: data.id + "-" + keyCounter.current++,
61
- config: data,
62
- parameters: [],
63
- handle: handle
64
- }));
65
- });
66
- } else {
67
- let fetchConfig = {
68
- method: 'GET',
69
- headers: {
70
- 'Content-Type': 'text/html',
71
- 'Accept': 'text/html',
72
- 'Authorization': 'Bearer ' + accessToken,
73
- 'idToken': idToken
74
- }
75
- };
76
- (0, _reactPromiseTracker.trackPromise)(fetch(encodeURI(path), fetchConfig).then(text).then(data => {
77
- setContent(data);
78
- }).catch(e => {
79
- console.error(e);
80
- }));
81
- }
82
- }
83
- }, [path, displayType]);
84
- _react.default.useEffect(() => {
85
- if (!path) {
86
- // TODO: Make the base URL dynamic
87
- let url = location + _ApplicationManager.default.getContextRoot() + _ApplicationManager.default.getUIConfigPath() + '/dashboard/get?version=1.0&id=' + settings.path;
88
- (0, _RestUtils.sendRequest)(url, data => {
89
- let defaultDisplayType = !_Utils.default.isNull(settings.parameters.displayType) ? settings.parameters.displayType : data.defaultDisplayType;
90
- if (_Utils.default.isNull(defaultDisplayType)) {
91
- console.error('Could not determine display type for dashboard');
92
- return;
93
- }
94
- setDisplayType(defaultDisplayType);
95
- let defaultName = !_Utils.default.isNull(settings.parameters.dashboardName) ? settings.parameters.dashboardName : data.defaultDashboardName;
96
- if (_Utils.default.isNull(defaultDisplayType)) {
97
- console.error('Could not determine a default name for dashboard');
98
- return;
99
- }
100
- setName(defaultName);
101
- const accessToken = sessionStorage.getItem('accessToken');
102
- const idToken = sessionStorage.getItem('idToken');
103
- if (defaultDisplayType === 'VIEW') {
104
- let url = location + _ApplicationManager.default.getContextRoot() + _ApplicationManager.default.getUIConfigPath() + '/view/get?version=1.0&id=' + data.contentPath;
105
- setPath(url);
106
- setDisplayType(defaultDisplayType);
107
- } else {
108
- setPath(location + _ApplicationManager.default.getContextRoot() + _ApplicationManager.default.getUIConfigPath() + '/html/get?version=1.0&id=' + data.contentPath + `-${defaultDisplayType.toLowerCase()}.html&access_token=${accessToken}&idToken=${idToken}`);
109
- }
110
- }, e => {
111
- console.error(e);
112
- });
113
- }
114
- }, []);
115
- const saveDashboard = () => {
116
- settings.parameters.displayType = displayType;
117
- settings.parameters.dashboardName = name;
118
- let data = {
119
- id: settings.id,
120
- path: settings.path,
121
- parameters: settings.parameters
122
- };
123
- let url = `${location + _ApplicationManager.default.getContextRoot()}/system/api/v1/user/dashboard/save`;
124
- (0, _RestUtils.postData)(url, response => {
125
- settings.id = response;
126
- setId(response);
127
- displayAlert('SUCCESS', 'Dashboard saved successfully');
128
- }, e => {
129
- console.log(e);
130
- displayAlert('ERROR', _Utils.default.SYSTEM_ERROR_MESSAGE);
131
- }, true, data);
132
- };
133
- const displayAlert = (messageType, messageText) => {
134
- let message = {
135
- messageType: messageType,
136
- message: messageText
137
- };
138
- let event = new _Event.default(_ApplicationManager.default, '_sys_dashboard', message);
139
- _Observable.default.fireEvent(_EventType.default.MESSAGE_ARRIVED, event);
140
- };
141
- const deleteDashboard = () => {
142
- if (!_Utils.default.isNull(settings) && !_Utils.default.isNull(settings.id)) {
143
- _ApplicationManager.default.openConfirmDialog('Are you sure you want to delete this dashboard?', result => {
144
- if (result === true) {
145
- let url = `${location + _ApplicationManager.default.getContextRoot()}/system/api/v1/user/dashboard/delete/${settings.id}`;
146
- (0, _RestUtils.sendRequest)(url, () => {
147
- props.onDelete();
148
- }, e => {
149
- console.log(e);
150
- });
151
- }
152
- });
153
- }
154
- };
155
- return /*#__PURE__*/_react.default.createElement(_Paper.default, {
156
- style: {
157
- minWidth: '200px',
158
- marginLeft: settings.first ? '0' : '16px'
159
- },
160
- className: 'col',
161
- ref: ref
162
- }, /*#__PURE__*/_react.default.createElement("div", {
163
- className: 'row'
164
- }, /*#__PURE__*/_react.default.createElement("div", {
165
- className: 'col-*-*'
166
- }, /*#__PURE__*/_react.default.createElement(_reactstrap.UncontrolledDropdown, null, /*#__PURE__*/_react.default.createElement(_reactstrap.DropdownToggle, {
167
- color: "default",
168
- "data-toggle": "dropdown",
169
- style: {
170
- width: '32px',
171
- height: '32px',
172
- margin: '8px 8px 0 0'
173
- },
174
- nav: true
175
- }, /*#__PURE__*/_react.default.createElement(_IconButton.default, {
176
- "aria-controls": "menu-list-grow",
177
- "aria-haspopup": "true",
178
- style: {
179
- width: '32px',
180
- height: '32px'
181
- }
182
- }, /*#__PURE__*/_react.default.createElement("i", {
183
- className: "fa fa-ellipsis-v fa-xs",
184
- "aria-hidden": "true",
185
- style: {
186
- padding: '3px'
187
- }
188
- }))), ' ', /*#__PURE__*/_react.default.createElement(_reactstrap.DropdownMenu, {
189
- className: "dropdown-navbar",
190
- tag: "ul"
191
- },
192
- /*#__PURE__*/
193
- /*Disable this button if id is already saved. After creating dashboard properties such as filters, this button must remain enabled at all times*/
194
- _react.default.createElement(_reactstrap.NavLink, {
195
- tag: "li"
196
- }, /*#__PURE__*/_react.default.createElement(_reactstrap.DropdownItem, {
197
- className: "nav-item",
198
- onClick: () => {
199
- saveDashboard();
200
- },
201
- disabled: !_Utils.default.isNull(id)
202
- }, 'SAVE')), /*#__PURE__*/_react.default.createElement(_reactstrap.NavLink, {
203
- tag: "li"
204
- }, /*#__PURE__*/_react.default.createElement(_reactstrap.DropdownItem, {
205
- className: "nav-item",
206
- onClick: () => {
207
- deleteDashboard();
208
- },
209
- disabled: _Utils.default.isNull(id)
210
- }, 'DELETE'), ' '))), ' '), /*#__PURE__*/_react.default.createElement("div", {
211
- className: 'col-*-*',
212
- style: {
213
- padding: '14px 0 0 12px'
214
- }
215
- }, /*#__PURE__*/_react.default.createElement("p", {
216
- style: {
217
- fontSize: '24px'
218
- }
219
- }, name))), /*#__PURE__*/_react.default.createElement("div", {
220
- className: 'row',
221
- style: {
222
- margin: '16px',
223
- width: '100%',
224
- height: '100%',
225
- padding: '8px 32px 0 0'
226
- }
227
- }, !_Utils.default.isNull(path) && !_Utils.default.isNull(displayType) && displayType !== 'VIEW' && /*#__PURE__*/_react.default.createElement("object", {
228
- data: path,
229
- type: "text/html",
230
- style: {
231
- width: '100%',
232
- height: '100%'
233
- }
234
- }), !_Utils.default.isNull(path) && displayType !== 'VIEW' && /*#__PURE__*/_react.default.createElement("p", null, "Loading..."), displayType === 'VIEW' && !_Utils.default.isNull(view) && /*#__PURE__*/_react.default.createElement("div", {
235
- style: {
236
- width: '100%',
237
- height: "100%"
238
- }
239
- }, view)));
240
- };
241
- const WorkFlowCard = props => {
242
- const [sp, setSp] = _react.default.useState(null);
243
- const [minW, setMinW] = _react.default.useState(null);
244
- const routeAction = {
245
- 'actionType': 'route',
246
- 'parent': true
247
- };
248
- _react.default.useEffect(() => {
249
- if (window.innerWidth < 400) {
250
- setSp(16);
251
- setMinW(280);
252
- } else {
253
- setSp(48);
254
- setMinW(300);
255
- }
256
- }, []);
257
- return _Utils.default.isNull(sp) || _Utils.default.isNull(minW) ? null : /*#__PURE__*/_react.default.createElement(_Paper.default, {
258
- style: {
259
- minWidth: `${minW}px`,
260
- margin: props.margin,
261
- height: '152px'
262
- },
263
- className: 'col'
264
- }, /*#__PURE__*/_react.default.createElement("div", {
265
- className: 'row'
266
- }, /*#__PURE__*/_react.default.createElement("div", {
267
- className: 'col-*-*',
268
- style: {
269
- width: '70%'
270
- }
271
- }, /*#__PURE__*/_react.default.createElement("div", {
272
- style: {
273
- padding: `16px ${sp}px 16px ${sp}px`,
274
- height: '8px',
275
- color: 'rgba(0, 0, 0, 0.54)'
276
- }
277
- }, "Work Items"), /*#__PURE__*/_react.default.createElement("div", {
278
- style: {
279
- padding: `16px ${sp}px 48px ${sp}px`,
280
- height: '0',
281
- fontSize: '20px'
282
- }
283
- }, props.title), /*#__PURE__*/_react.default.createElement("div", {
284
- style: {
285
- padding: `0 ${sp}px 16px ${sp}px`,
286
- fontSize: '30px'
287
- }
288
- }, props.itemCount)), /*#__PURE__*/_react.default.createElement("div", {
289
- className: 'col-*-*',
290
- style: {
291
- marginTop: '50px'
292
- }
293
- }, /*#__PURE__*/_react.default.createElement(_Button.default, {
294
- variant: 'contained',
295
- color: 'primary',
296
- size: "large",
297
- disabled: parseFloat(props.itemCount) === 0,
298
- onClick: () => {
299
- routeAction.path = props.path;
300
- _RouteActionHandler.default.execute(routeAction, null, props.viewRef, '_sys_dashboard');
301
- }
302
- }, "View"))));
303
- };
304
- const Dashboard = /*#__PURE__*/_react.default.memo(/*#__PURE__*/_react.default.forwardRef((props, ref) => {
305
- const [userDashboards] = _react.default.useState(!_Utils.default.isNull(_ApplicationManager.default.getDashboardSettings().userDashboards) ? _ApplicationManager.default.getDashboardSettings().userDashboards : []);
306
- const [settings] = _react.default.useState(_ApplicationManager.default.getDashboardSettings());
307
- const [taskSummary, setTaskSummary] = _react.default.useState(null);
308
- const [menuItems, setMenuItems] = _react.default.useState(null);
309
- const [cardRows, setCardRows] = _react.default.useState(null);
310
- const [cardsPerRow, setCardsPerRow] = _react.default.useState(null);
311
- let dashboardCardCounter = 0;
312
- const api = {
313
- get id() {
314
- return '_sys_dashboard';
315
- },
316
- getChildren: () => {
317
- return [alertBarHandle];
318
- },
319
- getChild: id => {
320
- if (id === 'dashboardAlert') {
321
- return alertBarHandle;
322
- }
323
- return null;
324
- }
325
- };
326
- const handle = {
327
- 'api': api
328
- };
329
- function setupCardRows(exclusion, defaultCardsPerRow) {
330
- let row = null;
331
- let gridRows = [];
332
- dashboardCardCounter = 0;
333
- let i = cardsPerRow ? cardsPerRow : defaultCardsPerRow;
334
- for (const userDashboard of userDashboards) {
335
- if (dashboardCardCounter++ % i === 0) {
336
- row = [];
337
- gridRows.push(row);
338
- }
339
- if (userDashboard !== exclusion) {
340
- row.push(userDashboard);
341
- }
342
- }
343
- let populatedRows = [];
344
- for (const gridRow of gridRows) {
345
- if (gridRow.length > 0) {
346
- populatedRows.push(gridRow);
347
- }
348
- }
349
- for (const gridRow of populatedRows) {
350
- gridRow[0].first = true;
351
- }
352
- setCardRows(populatedRows);
353
- }
354
- const getDashboardMenu = path => {
355
- return new Promise(resolve => {
356
- let service = {
357
- url: '/ui/api/v1/menu/get',
358
- parameters: [{
359
- name: 'id',
360
- value: path,
361
- httpParameterType: 'QUERY_PARAMETER'
362
- }, {
363
- name: 'version',
364
- value: 1.0,
365
- httpParameterType: 'QUERY_PARAMETER'
366
- }],
367
- contentType: 'application/json'
368
- };
369
- (0, _RestUtils.invokeRest)(service, {
370
- api: {
371
- get id() {
372
- return 'dashboard-menus';
373
- }
374
- }
375
- }, 'dashboard-menus', result => {
376
- resolve(result.menus);
377
- }, e => {
378
- console.error(e);
379
- resolve(null);
380
- }, null);
381
- });
382
- };
383
- async function loadMenus() {
384
- if (_Utils.default.isNull(menuItems) && !_Utils.default.isNull(settings.systemProfileDto.modules)) {
385
- let dashboardMenuitems = [];
386
- for (let i = 0; i < settings.systemProfileDto.modules.length; i++) {
387
- let module = settings.systemProfileDto.modules[i];
388
- if (!_Utils.default.isNull(module.dashboardMenu)) {
389
- let menus = await getDashboardMenu(module.dashboardMenu);
390
- if (menus) {
391
- for (let j = 0; j < menus.length; j++) {
392
- let menu = menus[j];
393
- if (menu.items) {
394
- for (const item of menu.items) {
395
- dashboardMenuitems.push(item);
396
- }
397
- }
398
- }
399
- }
400
- }
401
- }
402
- setMenuItems(dashboardMenuitems);
403
- }
404
- }
405
- _react.default.useEffect(() => {
406
- /*let rpcConfig = {
407
- "type": "rpc",
408
- "procedureName": "getWorkFlowSummary",
409
- "serviceId": "BPM.WorkFlow"
410
- };*/
411
-
412
- let cardsPerRow = 2;
413
- if (window.innerWidth < 400) {
414
- cardsPerRow = 1;
415
- }
416
- setCardsPerRow(cardsPerRow);
417
- if (_Utils.default.isNull(taskSummary)) {
418
- (0, _RestUtils.sendRequest)(`${location + _ApplicationManager.default.getContextRoot()}/bpm/api/v1/summary`, result => {
419
- if (!_Utils.default.isNull(result)) {
420
- setTaskSummary(result);
421
- }
422
- }, e => {
423
- console.error(e);
424
- // TODO : Show error message
425
- }, true, true);
426
- }
427
- (0, _RestUtils.sendRequest)(`${location + _ApplicationManager.default.getContextRoot()}/system/api/v1/user/dashboard/list`, dashboards => {
428
- if (!_Utils.default.isNull(dashboards)) {
429
- for (const dashboard of dashboards) {
430
- userDashboards.push(dashboard);
431
- }
432
- setupCardRows(null, cardsPerRow);
433
- }
434
- }, e => {
435
- console.error(e);
436
- // TODO : Show error message
437
- }, true, true);
438
- loadMenus();
439
- if (!_Utils.default.isNull(settings) && !_Utils.default.isNull(userDashboards) && _Utils.default.isNull(cardRows) && !_Utils.default.isNull(cardsPerRow)) {
440
- setupCardRows();
441
- }
442
- _ApplicationManager.default.setDashboardView({
443
- handle: handle
444
- });
445
- }, []);
446
- const addDashboardCard = item => {
447
- let path = item.eventHandlingConfig.subscriptions[0].actions[0].path;
448
- let settings = {};
449
- settings.path = path;
450
- settings.parameters = {};
451
- userDashboards.push(settings);
452
- setupCardRows();
453
- };
454
- return /*#__PURE__*/_react.default.createElement("div", {
455
- ref: ref,
456
- style: {
457
- height: '100%'
458
- }
459
- }, !_Utils.default.isNull(settings) && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
460
- style: {
461
- width: '100%',
462
- display: 'flex',
463
- justifyContent: 'space-between'
464
- }
465
- }, /*#__PURE__*/_react.default.createElement("div", {
466
- style: {
467
- display: 'flex',
468
- alignItems: 'center',
469
- gap: '4px'
470
- }
471
- }, /*#__PURE__*/_react.default.createElement("p", {
472
- style: {
473
- fontSize: '24px',
474
- margin: 0
475
- }
476
- }, "Dashboard"), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_reactstrap.UncontrolledDropdown, null, /*#__PURE__*/_react.default.createElement(_reactstrap.DropdownToggle, {
477
- color: "default",
478
- "data-toggle": "dropdown",
479
- nav: true
480
- }, /*#__PURE__*/_react.default.createElement(_IconButton.default, {
481
- "aria-controls": "menu-list-grow",
482
- "aria-haspopup": "true"
483
- }, /*#__PURE__*/_react.default.createElement(_Icon.default, {
484
- id: 'ADD'
485
- }))), ' ', !_Utils.default.isNull(menuItems) ? /*#__PURE__*/_react.default.createElement(_reactstrap.DropdownMenu, {
486
- className: "dropdown-navbar",
487
- end: true,
488
- tag: "ul"
489
- }, menuItems.map((item, index) => /*#__PURE__*/_react.default.createElement(_reactstrap.NavLink, {
490
- tag: "li",
491
- key: index
492
- }, /*#__PURE__*/_react.default.createElement(_reactstrap.DropdownItem, {
493
- className: "nav-item",
494
- onClick: () => {
495
- addDashboardCard(item);
496
- }
497
- }, item.attributes.label, ' '), ' '))) : null), ' '))), /*#__PURE__*/_react.default.createElement("div", {
498
- style: {
499
- height: 'calc(100% - 58px)',
500
- overflowY: 'auto'
501
- }
502
- }, /*#__PURE__*/_react.default.createElement("div", {
503
- style: {
504
- overflowY: 'hidden',
505
- overflowX: 'hidden',
506
- height: '100%',
507
- padding: '0 4px 64px 0'
508
- }
509
- }, /*#__PURE__*/_react.default.createElement(_AlertBar.default, {
510
- config: {
511
- id: 'dashboardAlert'
512
- },
513
- handle: alertBarHandle,
514
- viewId: '_sys_dashboard'
515
- }), !_Utils.default.isNull(taskSummary) && /*#__PURE__*/_react.default.createElement("div", {
516
- className: 'row',
517
- style: {
518
- paddingRight: '16px',
519
- overflow: 'hidden',
520
- height: '168px'
521
- }
522
- }, /*#__PURE__*/_react.default.createElement(WorkFlowCard, {
523
- margin: '0 0 16px 16px',
524
- title: 'Assigned to Me',
525
- itemCount: taskSummary.personalWorkItemCount,
526
- path: '/workflow/views/personal-work-items.json'
527
- }), /*#__PURE__*/_react.default.createElement(WorkFlowCard, {
528
- margin: '0 0 16px 16px',
529
- title: 'Available',
530
- itemCount: taskSummary.groupWorkItemCount,
531
- path: '/workflow/views/group-work-items.json'
532
- }), /*#__PURE__*/_react.default.createElement(WorkFlowCard, {
533
- margin: '0 0 16px 16px',
534
- title: 'Due Today',
535
- itemCount: taskSummary.dueTodayItemCount,
536
- path: '/workflow/views/due-today-work-items.json'
537
- })), /*#__PURE__*/_react.default.createElement("div", {
538
- style: {
539
- overflowY: 'auto',
540
- overflowX: 'hidden',
541
- maxHeight: '100%',
542
- height: 'calc(100% - 104px)',
543
- border: '4px solid blue'
544
- }
545
- }, !_Utils.default.isNull(cardRows) ? cardRows.map((row, i) => /*#__PURE__*/_react.default.createElement("div", {
546
- className: 'row',
547
- style: {
548
- marginBottom: cardRows.length > 2 ? '16px' : null,
549
- border: '2px solid red'
550
- },
551
- key: i
552
- }, row.map((userDashboard, j) => /*#__PURE__*/_react.default.createElement(DashboardCard, {
553
- settings: userDashboard,
554
- index: dashboardCardCounter,
555
- key: i + j,
556
- onDelete: () => {
557
- userDashboards.splice(userDashboards.indexOf(userDashboard), 1);
558
- setupCardRows(userDashboard);
559
- }
560
- })))) : null)))));
561
- }));
562
- var _default = exports.default = Dashboard;