@c8y/ngx-components 1011.0.18 → 1011.0.21

package/bundles/c8y-ngx-components-device-grid.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@c8y/client'), require('@ngx-translate/core'), require('lodash-es'), require('@c8y/ngx-components'), require('@angular/upgrade/static'), require('@c8y/ngx-components/assets-navigator')) :
-    typeof define === 'function' && define.amd ? define('@c8y/ngx-components/device-grid', ['exports', '@angular/core', '@c8y/client', '@ngx-translate/core', 'lodash-es', '@c8y/ngx-components', '@angular/upgrade/static', '@c8y/ngx-components/assets-navigator'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.c8y = global.c8y || {}, global.c8y['ngx-components'] = global.c8y['ngx-components'] || {}, global.c8y['ngx-components']['device-grid'] = {}), global.ng.core, global.client, global.core$1, global.lodashEs, global.c8y['ngx-components'], global.ng.upgrade.static, global.c8y['ngx-components']['assets-navigator']));
-}(this, (function (exports, core, client, core$1, lodashEs, ngxComponents, _static, assetsNavigator) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@c8y/client'), require('@c8y/ngx-components'), require('@ngx-translate/core'), require('lodash-es'), require('@angular/upgrade/static'), require('@c8y/ngx-components/assets-navigator')) :
+    typeof define === 'function' && define.amd ? define('@c8y/ngx-components/device-grid', ['exports', '@angular/core', '@c8y/client', '@c8y/ngx-components', '@ngx-translate/core', 'lodash-es', '@angular/upgrade/static', '@c8y/ngx-components/assets-navigator'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.c8y = global.c8y || {}, global.c8y['ngx-components'] = global.c8y['ngx-components'] || {}, global.c8y['ngx-components']['device-grid'] = {}), global.ng.core, global.client, global.c8y['ngx-components'], global.core$1, global.lodashEs, global.ng.upgrade.static, global.c8y['ngx-components']['assets-navigator']));
+}(this, (function (exports, core, client, ngxComponents, core$1, lodashEs, _static, assetsNavigator) { 'use strict';
 
     /*! *****************************************************************************
     Copyright (c) Microsoft Corporation.
@@ -1206,9 +1206,11 @@
     }(BaseDeviceGridColumn));
 
     var DeviceGridService = /** @class */ (function () {
-        function DeviceGridService(inventoryService, translateService) {
+        function DeviceGridService(inventoryService, translateService, alertService, modal) {
             this.inventoryService = inventoryService;
             this.translateService = translateService;
+            this.alertService = alertService;
+            this.modal = modal;
             this.GRID_CONFIG_DEFAULT_STORAGE_KEY = 'device-grid-config';
             this.DEFAULT_PAGE_SIZE = 20;
             this.queriesUtil = new client.QueriesUtil();
@@ -1223,20 +1225,20 @@
                 new RegistrationDateDeviceGridColumn(),
                 new SystemIdDeviceGridColumn(),
                 new ImeiDeviceGridColumn(),
-                new AlarmsDeviceGridColumn()
+                new AlarmsDeviceGridColumn(),
             ];
             return defaultColumns;
         };
         DeviceGridService.prototype.getDefaultPagination = function () {
             return {
                 pageSize: 10,
-                currentPage: 1
+                currentPage: 1,
             };
         };
         DeviceGridService.prototype.getInfiniteScrollPagination = function () {
             return {
                 pageSize: 50,
-                currentPage: 1
+                currentPage: 1,
             };
         };
         DeviceGridService.prototype.getDefaultActionControls = function () {
@@ -1244,8 +1246,8 @@
             return [
                 {
                     type: "DELETE" /* Delete */,
-                    callback: function (item) { return _this.delete(item); }
-                }
+                    callback: function (item) { return _this.delete(item); },
+                },
             ];
         };
         DeviceGridService.prototype.getDefaultBulkActionControls = function () {
@@ -1308,7 +1310,31 @@
             return columns;
         };
         DeviceGridService.prototype.delete = function (device) {
-            console.log('should delete', device);
+            return __awaiter(this, void 0, void 0, function () {
+                var ex_1;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0:
+                            _a.trys.push([0, 3, , 4]);
+                            return [4 /*yield*/, this.modal.confirm(ngxComponents.gettext('Delete device'), this.translateService.instant(ngxComponents.gettext("You are about to delete device: \"{{ name }}\". Do you want to proceed?"), { name: device.name }), ngxComponents.Status.DANGER, { ok: ngxComponents.gettext('Delete'), cancel: ngxComponents.gettext('Cancel') })];
+                        case 1:
+                            _a.sent();
+                            return [4 /*yield*/, this.inventoryService.delete(device)];
+                        case 2:
+                            _a.sent();
+                            this.alertService.success(ngxComponents.gettext('Device deleted.'));
+                            return [3 /*break*/, 4];
+                        case 3:
+                            ex_1 = _a.sent();
+                            // only if not cancel from modal
+                            if (ex_1) {
+                                this.alertService.addServerFailure(ex_1);
+                            }
+                            return [3 /*break*/, 4];
+                        case 4: return [2 /*return*/];
+                    }
+                });
+            });
         };
         DeviceGridService.prototype.getData = function (columns, pagination, query, withChildren) {
             if (query === void 0) { query = {}; }
@@ -1321,6 +1347,18 @@
                 });
             });
         };
+        DeviceGridService.prototype.getChildDeviceData = function (columns, pagination, query, withChildren, id) {
+            if (query === void 0) { query = {}; }
+            if (withChildren === void 0) { withChildren = false; }
+            return __awaiter(this, void 0, void 0, function () {
+                var childDeviceFilters, filters;
+                return __generator(this, function (_a) {
+                    childDeviceFilters = true;
+                    filters = Object.assign(Object.assign({}, this.getDevicesFilters(columns, pagination, query, childDeviceFilters)), { withParents: true, withChildren: withChildren });
+                    return [2 /*return*/, this.inventoryService.childDevicesList(id, filters)];
+                });
+            });
+        };
         DeviceGridService.prototype.getCount = function (columns, pagination, query) {
             if (query === void 0) { query = {}; }
             return __awaiter(this, void 0, void 0, function () {
@@ -1335,6 +1373,39 @@
                 });
             });
         };
+        DeviceGridService.prototype.getCountChildDevices = function (columns, pagination, query, id) {
+            if (query === void 0) { query = {}; }
+            return __awaiter(this, void 0, void 0, function () {
+                var childDeviceFilters, filters;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0:
+                            childDeviceFilters = true;
+                            filters = Object.assign(Object.assign({}, this.getDevicesFilters(columns, pagination, query, childDeviceFilters)), { pageSize: 1, currentPage: 1 });
+                            return [4 /*yield*/, this.inventoryService.childDevicesList(id, filters)];
+                        case 1: return [2 /*return*/, (_a.sent()).paging.totalPages];
+                    }
+                });
+            });
+        };
+        DeviceGridService.prototype.getTotalChildDevices = function (query, id) {
+            if (query === void 0) { query = {}; }
+            return __awaiter(this, void 0, void 0, function () {
+                var filters;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0:
+                            filters = {
+                                q: this.queriesUtil.buildQuery(query),
+                                pageSize: 1,
+                                withTotalPages: true,
+                            };
+                            return [4 /*yield*/, this.inventoryService.childDevicesList(id, filters)];
+                        case 1: return [2 /*return*/, (_a.sent()).paging.totalPages];
+                    }
+                });
+            });
+        };
         DeviceGridService.prototype.getTotal = function (query) {
             if (query === void 0) { query = {}; }
             return __awaiter(this, void 0, void 0, function () {
@@ -1345,7 +1416,7 @@
                             filters = {
                                 q: this.queriesUtil.buildQuery(query),
                                 pageSize: 1,
-                                withTotalPages: true
+                                withTotalPages: true,
                             };
                             return [4 /*yield*/, this.inventoryService.list(filters)];
                         case 1: return [2 /*return*/, (_a.sent()).paging.totalPages];
@@ -1388,14 +1459,10 @@
         DeviceGridService.prototype.isVendme = function (device) {
             return device.type === 'com_nsn_startups_vendme_VendingMachine';
         };
-        DeviceGridService.prototype.getDevicesFilters = function (columns, pagination, query) {
-            return {
-                q: this.getDeviceQueryString(columns, query),
-                pageSize: pagination.pageSize,
-                currentPage: pagination.currentPage,
-                withChildren: false,
-                withTotalPages: true
-            };
+        DeviceGridService.prototype.getDevicesFilters = function (columns, pagination, query, childDeviceFilters) {
+            return Object.assign(Object.assign({}, (childDeviceFilters
+                ? { query: this.getDeviceQueryString(columns, query) }
+                : { q: this.getDeviceQueryString(columns, query) })), { pageSize: pagination.pageSize, currentPage: pagination.currentPage, withChildren: false, withTotalPages: true });
         };
         DeviceGridService.prototype.extendQueryByColumn = function (query, column) {
             if (column.filterable && column.externalFilterQuery) {
@@ -1429,7 +1496,9 @@
     ];
     DeviceGridService.ctorParameters = function () { return [
         { type: client.InventoryService },
-        { type: core$1.TranslateService }
+        { type: core$1.TranslateService },
+        { type: ngxComponents.AlertService },
+        { type: ngxComponents.ModalService }
     ]; };
 
     var DeviceGridComponent = /** @class */ (function () {
@@ -1440,14 +1509,20 @@
             this.loadingItemsLabel = ngxComponents.gettext('Loading devices…');
             this.selectable = false;
             this.baseQuery = {};
-            this.showChildDevices = {};
+            this.childDeviceGrid = false;
+            /**
+             * Determines if additional "Show child devices" toggle should be shown and in what state it should be.
+             * @deprecated It's going to be replaced with a generic hook allowing to easily add custom actions in the grid header.
+             */
+            this.showChildDevices = { show: false, value: false };
+            /** Emits an event when columns configuration changes. */
             this.onColumnsChange = new core.EventEmitter();
             this.onDeviceQueryStringChange = new core.EventEmitter();
             this.itemsSelect = new core.EventEmitter();
             this.onChildDevices = new core.EventEmitter();
+            this.actionControls = [];
             this.columns = this.deviceGridService.getDefaultColumns();
             this.pagination = this.deviceGridService.getDefaultPagination();
-            this.actionControls = this.deviceGridService.getDefaultActionControls();
             this.bulkActionControls = this.deviceGridService.getDefaultBulkActionControls();
             this.withChildren = false;
             this.serverSideDataCallback = this.onDataSourceModifier.bind(this);
@@ -1508,32 +1583,56 @@
             enumerable: false,
             configurable: true
         });
+        DeviceGridComponent.prototype.ngOnInit = function () {
+            this.setActionControls();
+        };
         DeviceGridComponent.prototype.trackByName = function (_index, column) {
             return column.name;
         };
         DeviceGridComponent.prototype.onDataSourceModifier = function (dataSourceModifier) {
             return __awaiter(this, void 0, void 0, function () {
-                var serverSideDataResult, _a, res, data, paging, filteredSize, size;
-                return __generator(this, function (_b) {
-                    switch (_b.label) {
-                        case 0: return [4 /*yield*/, this.deviceGridService.getData(dataSourceModifier.columns, dataSourceModifier.pagination, this.baseQuery, this.withChildren)];
+                var serverSideDataResult, filteredSize, size, _a, res, data, paging, _b, res, data, paging;
+                return __generator(this, function (_c) {
+                    switch (_c.label) {
+                        case 0:
+                            if (!this.childDeviceGrid) return [3 /*break*/, 4];
+                            return [4 /*yield*/, this.deviceGridService.getChildDeviceData(dataSourceModifier.columns, dataSourceModifier.pagination, this.baseQuery, this.withChildren, this.parentDeviceId)];
                         case 1:
-                            _a = _b.sent(), res = _a.res, data = _a.data, paging = _a.paging;
-                            return [4 /*yield*/, this.deviceGridService.getCount(dataSourceModifier.columns, dataSourceModifier.pagination, this.baseQuery)];
+                            _a = _c.sent(), res = _a.res, data = _a.data, paging = _a.paging;
+                            return [4 /*yield*/, this.deviceGridService.getCountChildDevices(dataSourceModifier.columns, dataSourceModifier.pagination, this.baseQuery, this.parentDeviceId)];
                         case 2:
-                            filteredSize = _b.sent();
-                            return [4 /*yield*/, this.deviceGridService.getTotal(this.baseQuery)];
+                            filteredSize = _c.sent();
+                            return [4 /*yield*/, this.deviceGridService.getTotalChildDevices(this.baseQuery, this.parentDeviceId)];
                         case 3:
-                            size = _b.sent();
-                            this.onColumnsChange.emit(dataSourceModifier.columns);
-                            this.onDeviceQueryStringChange.emit(this.deviceGridService.getDeviceQueryString(dataSourceModifier.columns, this.baseQuery));
+                            size = _c.sent();
+                            serverSideDataResult = {
+                                res: res,
+                                data: data,
+                                paging: paging,
+                                filteredSize: filteredSize,
+                                size: size,
+                            };
+                            return [3 /*break*/, 8];
+                        case 4: return [4 /*yield*/, this.deviceGridService.getData(dataSourceModifier.columns, dataSourceModifier.pagination, this.baseQuery, this.withChildren)];
+                        case 5:
+                            _b = _c.sent(), res = _b.res, data = _b.data, paging = _b.paging;
+                            return [4 /*yield*/, this.deviceGridService.getCount(dataSourceModifier.columns, dataSourceModifier.pagination, this.baseQuery)];
+                        case 6:
+                            filteredSize = _c.sent();
+                            return [4 /*yield*/, this.deviceGridService.getTotal(this.baseQuery)];
+                        case 7:
+                            size = _c.sent();
                             serverSideDataResult = {
                                 res: res,
                                 data: data,
                                 paging: paging,
                                 filteredSize: filteredSize,
-                                size: size
+                                size: size,
                             };
+                            _c.label = 8;
+                        case 8:
+                            this.onColumnsChange.emit(dataSourceModifier.columns);
+                            this.onDeviceQueryStringChange.emit(this.deviceGridService.getDeviceQueryString(dataSourceModifier.columns, this.baseQuery));
                             if (this.dataCallback) {
                                 serverSideDataResult = this.dataCallback(serverSideDataResult);
                             }
@@ -1542,6 +1641,38 @@
                 });
             });
         };
+        DeviceGridComponent.prototype.setActionControls = function () {
+            return __awaiter(this, void 0, void 0, function () {
+                var deleteAction;
+                var _this = this;
+                return __generator(this, function (_a) {
+                    if (this.childDeviceGrid) {
+                        deleteAction = {
+                            type: "DELETE" /* Delete */,
+                            callback: function (device) { return _this.onDeleteDevice(device); },
+                        };
+                        this.actionControls.push(deleteAction);
+                    }
+                    else {
+                        this.actionControls = this.deviceGridService.getDefaultActionControls();
+                    }
+                    return [2 /*return*/];
+                });
+            });
+        };
+        DeviceGridComponent.prototype.onDeleteDevice = function (device) {
+            return __awaiter(this, void 0, void 0, function () {
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0: return [4 /*yield*/, this.deviceGridService.delete(device)];
+                        case 1:
+                            _a.sent();
+                            this.refresh.emit();
+                            return [2 /*return*/];
+                    }
+                });
+            });
+        };
         DeviceGridComponent.prototype.updateFiltering = function (columnNames, action) {
             var type = action.type;
             if (type === ngxComponents.FilteringActionType.ResetFilter) {
@@ -1559,7 +1690,7 @@
     DeviceGridComponent.decorators = [
         { type: core.Component, args: [{
                     selector: 'c8y-device-grid',
-                    template: "<c8y-data-grid\n  [title]=\"title\"\n  [loadMoreItemsLabel]=\"loadMoreItemsLabel\"\n  [loadingItemsLabel]=\"loadingItemsLabel\"\n  [columns]=\"columns\"\n  [pagination]=\"pagination\"\n  [infiniteScroll]=\"infiniteScroll\"\n  [actionControls]=\"actionControls\"\n  [selectable]=\"selectable\"\n  [bulkActionControls]=\"bulkActionControls\"\n  [serverSideDataCallback]=\"serverSideDataCallback\"\n  (itemsSelect)=\"itemsSelect.emit($event)\"\n  (onConfigChange)=\"configChange($event)\"\n  [refresh]=\"refresh\"\n  [showChildDevices]=\"showChildDevices\"\n  (onChildDevices)=\"withChildren=$event;onChildDevices.emit($event)\"\n>\n  <div class=\"c8y-empty-state\">\n    <h1 c8yIcon=\"search\"></h1>\n    <div>\n      <p>\n        <strong>{{ 'No matching devices.' | translate }}</strong>\n      </p>\n      <small>{{ 'Refine your search terms' | translate }}</small>\n    </div>\n  </div>\n  <ng-container *ngFor=\"let column of columns; trackBy: trackByName\">\n    <c8y-column [name]=\"column.name\"></c8y-column>\n  </ng-container>\n</c8y-data-grid>\n"
+                    template: "<c8y-data-grid\n  [title]=\"title\"\n  [loadMoreItemsLabel]=\"loadMoreItemsLabel\"\n  [loadingItemsLabel]=\"loadingItemsLabel\"\n  [columns]=\"columns\"\n  [pagination]=\"pagination\"\n  [infiniteScroll]=\"infiniteScroll\"\n  [actionControls]=\"actionControls\"\n  [selectable]=\"selectable\"\n  [bulkActionControls]=\"bulkActionControls\"\n  [serverSideDataCallback]=\"serverSideDataCallback\"\n  (itemsSelect)=\"itemsSelect.emit($event)\"\n  (onConfigChange)=\"configChange($event)\"\n  [refresh]=\"refresh\"\n  [showChildDevices]=\"showChildDevices\"\n  (onChildDevices)=\"withChildren = $event; onChildDevices.emit($event)\"\n>\n  <div class=\"c8y-empty-state\">\n    <h1 c8yIcon=\"search\"></h1>\n    <div>\n      <p>\n        <strong>{{ 'No matching devices.' | translate }}</strong>\n      </p>\n      <small>{{ 'Refine your search terms' | translate }}</small>\n    </div>\n  </div>\n  <ng-container *ngFor=\"let column of columns; trackBy: trackByName\">\n    <c8y-column [name]=\"column.name\"></c8y-column>\n  </ng-container>\n</c8y-data-grid>\n"
                 },] }
     ];
     DeviceGridComponent.ctorParameters = function () { return [
@@ -1578,6 +1709,8 @@
         selectable: [{ type: core.Input }],
         baseQuery: [{ type: core.Input }],
         _bulkActionControls: [{ type: core.Input, args: ['bulkActionControls',] }],
+        childDeviceGrid: [{ type: core.Input }],
+        parentDeviceId: [{ type: core.Input }],
         showChildDevices: [{ type: core.Input }],
         onColumnsChange: [{ type: core.Output }],
         onDeviceQueryStringChange: [{ type: core.Output }],