From 9c616bd3a3feaf7898c13bfe1fc6b2844153b554 Mon Sep 17 00:00:00 2001 From: Igor Kulikov Date: Fri, 6 Jan 2017 19:49:00 +0200 Subject: [PATCH] Import/Export. Bug fixes. --- ui/package.json | 1 + ui/src/app/api/device.service.js | 4 +- ui/src/app/components/dashboard.directive.js | 13 + ui/src/app/components/dashboard.tpl.html | 12 + ui/src/app/components/grid.directive.js | 4 + ui/src/app/components/grid.tpl.html | 23 +- .../app/components/react/json-form-number.jsx | 10 +- ui/src/app/dashboard/add-widget.controller.js | 10 +- .../app/dashboard/dashboard-fieldset.tpl.html | 1 + ui/src/app/dashboard/dashboard.controller.js | 96 +---- ui/src/app/dashboard/dashboard.directive.js | 1 + ui/src/app/dashboard/dashboard.tpl.html | 43 +- ui/src/app/dashboard/dashboards.controller.js | 38 +- ui/src/app/dashboard/dashboards.tpl.html | 1 + .../dashboard/device-aliases.controller.js | 55 ++- ui/src/app/dashboard/device-aliases.tpl.html | 6 +- ui/src/app/dashboard/edit-widget.directive.js | 10 +- ui/src/app/dashboard/index.js | 2 + ui/src/app/global-interceptor.service.js | 11 +- .../import-export/import-dialog.controller.js | 71 ++++ ui/src/app/import-export/import-dialog.scss | 70 ++++ .../app/import-export/import-dialog.tpl.html | 72 ++++ .../import-export/import-export.service.js | 373 ++++++++++++++++++ ui/src/app/import-export/index.js | 24 ++ ui/src/app/services/item-buffer.service.js | 56 ++- .../app/widget/lib/analogue-linear-gauge.js | 15 +- .../app/widget/lib/analogue-radial-gauge.js | 15 +- ui/src/locale/en_US.json | 25 +- 28 files changed, 928 insertions(+), 134 deletions(-) create mode 100644 ui/src/app/import-export/import-dialog.controller.js create mode 100644 ui/src/app/import-export/import-dialog.scss create mode 100644 ui/src/app/import-export/import-dialog.tpl.html create mode 100644 ui/src/app/import-export/import-export.service.js create mode 100644 ui/src/app/import-export/index.js diff --git a/ui/package.json b/ui/package.json index c1101d2dcc..b39ae99198 100644 --- a/ui/package.json +++ b/ui/package.json @@ -54,6 +54,7 @@ "json-schema-defaults": "^0.2.0", "justgage": "^1.2.2", "material-ui": "^0.16.1", + "material-ui-number-input": "^5.0.16", "md-color-picker": "^0.2.6", "mdPickers": "git://github.com/alenaksu/mdPickers.git#0.7.5", "moment": "^2.15.0", diff --git a/ui/src/app/api/device.service.js b/ui/src/app/api/device.service.js index 27cf605c6b..1a1d714a3e 100644 --- a/ui/src/app/api/device.service.js +++ b/ui/src/app/api/device.service.js @@ -88,10 +88,10 @@ function DeviceService($http, $q, $filter, telemetryWebsocketService, types) { return deferred.promise; } - function getDevice(deviceId) { + function getDevice(deviceId, ignoreErrors) { var deferred = $q.defer(); var url = '/api/device/' + deviceId; - $http.get(url, null).then(function success(response) { + $http.get(url, { ignoreErrors: ignoreErrors }).then(function success(response) { deferred.resolve(response.data); }, function fail(response) { deferred.reject(response.data); diff --git a/ui/src/app/components/dashboard.directive.js b/ui/src/app/components/dashboard.directive.js index 7c5094a6ff..c55995eeb3 100644 --- a/ui/src/app/components/dashboard.directive.js +++ b/ui/src/app/components/dashboard.directive.js @@ -58,8 +58,10 @@ function Dashboard() { isMobile: '=', isMobileDisabled: '=?', isEditActionEnabled: '=', + isExportActionEnabled: '=', isRemoveActionEnabled: '=', onEditWidget: '&?', + onExportWidget: '&?', onRemoveWidget: '&?', onWidgetMouseDown: '&?', onWidgetClicked: '&?', @@ -139,6 +141,7 @@ function DashboardController($scope, $rootScope, $element, $timeout, $log, toast vm.showWidgetTitle = showWidgetTitle; vm.hasTimewindow = hasTimewindow; vm.editWidget = editWidget; + vm.exportWidget = exportWidget; vm.removeWidget = removeWidget; vm.loading = loading; @@ -413,6 +416,16 @@ function DashboardController($scope, $rootScope, $element, $timeout, $log, toast } } + function exportWidget ($event, widget) { + resetWidgetClick(); + if ($event) { + $event.stopPropagation(); + } + if (vm.isExportActionEnabled && vm.onExportWidget) { + vm.onExportWidget({event: $event, widget: widget}); + } + } + function removeWidget($event, widget) { resetWidgetClick(); if ($event) { diff --git a/ui/src/app/components/dashboard.tpl.html b/ui/src/app/components/dashboard.tpl.html index c43caac54f..0ad43eb8eb 100644 --- a/ui/src/app/components/dashboard.tpl.html +++ b/ui/src/app/components/dashboard.tpl.html @@ -62,6 +62,18 @@ edit + + + {{ 'widget.export' | translate }} + + + file_download + + -
+
@@ -93,10 +93,29 @@ - + {{ vm.addItemAction.details() }} + + + + + {{ vm.addItemAction.details() }} + + + + + + + + {{ addItemAction.details() }} + + + + +
\ No newline at end of file diff --git a/ui/src/app/components/react/json-form-number.jsx b/ui/src/app/components/react/json-form-number.jsx index 1922ca238a..8d9296b5e8 100644 --- a/ui/src/app/components/react/json-form-number.jsx +++ b/ui/src/app/components/react/json-form-number.jsx @@ -15,7 +15,7 @@ */ import React from 'react'; import ThingsboardBaseComponent from './json-form-base-component.jsx'; -import TextField from 'material-ui/TextField'; +import NumberInput from 'material-ui-number-input'; class ThingsboardNumber extends React.Component { @@ -63,16 +63,18 @@ class ThingsboardNumber extends React.Component { if (this.state.focused) { fieldClass += " tb-focused"; } + var value = this.state.lastSuccessfulValue; + value = Number(value); return ( - {{ 'dashboard.assign-to-customer' | translate }} {{ 'dashboard.unassign-from-customer' | translate }} +{{ 'dashboard.export' | translate }} {{ 'dashboard.delete' | translate }} diff --git a/ui/src/app/dashboard/dashboard.controller.js b/ui/src/app/dashboard/dashboard.controller.js index 43225f5ae3..8e85e74982 100644 --- a/ui/src/app/dashboard/dashboard.controller.js +++ b/ui/src/app/dashboard/dashboard.controller.js @@ -23,7 +23,7 @@ import addWidgetTemplate from './add-widget.tpl.html'; /*@ngInject*/ export default function DashboardController(types, widgetService, userService, - dashboardService, itembuffer, hotkeys, $window, $rootScope, + dashboardService, itembuffer, importExport, hotkeys, $window, $rootScope, $scope, $state, $stateParams, $mdDialog, $timeout, $document, $q, $translate, $filter) { var user = userService.getCurrentUser(); @@ -53,6 +53,8 @@ export default function DashboardController(types, widgetService, userService, vm.prepareDashboardContextMenu = prepareDashboardContextMenu; vm.prepareWidgetContextMenu = prepareWidgetContextMenu; vm.editWidget = editWidget; + vm.exportWidget = exportWidget; + vm.importWidget = importWidget; vm.isTenantAdmin = isTenantAdmin; vm.loadDashboard = loadDashboard; vm.noData = noData; @@ -210,44 +212,17 @@ export default function DashboardController(types, widgetService, userService, } function openDeviceAliases($event) { - var aliasToWidgetsMap = {}; - var widgetsTitleList; - for (var w in vm.widgets) { - var widget = vm.widgets[w]; - if (widget.type === types.widgetType.rpc.value) { - if (widget.config.targetDeviceAliasIds && widget.config.targetDeviceAliasIds.length > 0) { - var targetDeviceAliasId = widget.config.targetDeviceAliasIds[0]; - widgetsTitleList = aliasToWidgetsMap[targetDeviceAliasId]; - if (!widgetsTitleList) { - widgetsTitleList = []; - aliasToWidgetsMap[targetDeviceAliasId] = widgetsTitleList; - } - widgetsTitleList.push(widget.config.title); - } - } else { - for (var i in widget.config.datasources) { - var datasource = widget.config.datasources[i]; - if (datasource.type === types.datasourceType.device && datasource.deviceAliasId) { - widgetsTitleList = aliasToWidgetsMap[datasource.deviceAliasId]; - if (!widgetsTitleList) { - widgetsTitleList = []; - aliasToWidgetsMap[datasource.deviceAliasId] = widgetsTitleList; - } - widgetsTitleList.push(widget.config.title); - } - } - } - } - $mdDialog.show({ controller: 'DeviceAliasesController', controllerAs: 'vm', templateUrl: deviceAliasesTemplate, locals: { - deviceAliases: angular.copy(vm.dashboard.configuration.deviceAliases), - aliasToWidgetsMap: aliasToWidgetsMap, - isSingleDevice: false, - singleDeviceAlias: null + config: { + deviceAliases: angular.copy(vm.dashboard.configuration.deviceAliases), + widgets: vm.widgets, + isSingleDevice: false, + singleDeviceAlias: null + } }, parent: angular.element($document[0].body), skipHide: true, @@ -300,6 +275,16 @@ export default function DashboardController(types, widgetService, userService, } } + function exportWidget($event, widget) { + $event.stopPropagation(); + importExport.exportWidget(vm.dashboard, widget); + } + + function importWidget($event) { + $event.stopPropagation(); + importExport.importWidget($event, vm.dashboard); + } + function widgetMouseDown($event, widget) { if (vm.isEdit && !vm.isEditingWidget) { vm.dashboardContainer.selectWidget(widget, 0); @@ -438,48 +423,7 @@ export default function DashboardController(types, widgetService, userService, } function copyWidget($event, widget) { - var aliasesInfo = { - datasourceAliases: {}, - targetDeviceAliases: {} - }; - var originalColumns = 24; - if (vm.dashboard.configuration.gridSettings && - vm.dashboard.configuration.gridSettings.columns) { - originalColumns = vm.dashboard.configuration.gridSettings.columns; - } - if (widget.config && vm.dashboard.configuration - && vm.dashboard.configuration.deviceAliases) { - var deviceAlias; - if (widget.config.datasources) { - for (var i=0;i -
- - - {{ 'dashboard.add-widget' | translate }} - - - +
+ + + + + {{ 'dashboard.add-widget' | translate }} + + + + + + + + {{ 'dashboard.create-new-widget' | translate }} + + + + + + {{ 'dashboard.import-widget' | translate }} + + + + + diff --git a/ui/src/app/dashboard/device-aliases.controller.js b/ui/src/app/dashboard/device-aliases.controller.js index ab2b6f4ec4..89fe6bfeaa 100644 --- a/ui/src/app/dashboard/device-aliases.controller.js +++ b/ui/src/app/dashboard/device-aliases.controller.js @@ -17,16 +17,18 @@ import './device-aliases.scss'; /*@ngInject*/ export default function DeviceAliasesController(deviceService, toast, $scope, $mdDialog, $document, $q, $translate, - deviceAliases, aliasToWidgetsMap, isSingleDevice, singleDeviceAlias) { + types, config) { var vm = this; - vm.isSingleDevice = isSingleDevice; - vm.singleDeviceAlias = singleDeviceAlias; + vm.isSingleDevice = config.isSingleDevice; + vm.singleDeviceAlias = config.singleDeviceAlias; vm.deviceAliases = []; - vm.aliasToWidgetsMap = aliasToWidgetsMap; vm.singleDevice = null; vm.singleDeviceSearchText = ''; + vm.title = config.customTitle ? config.customTitle : 'device.aliases'; + vm.disableAdd = config.disableAdd; + vm.aliasToWidgetsMap = {}; vm.addAlias = addAlias; vm.cancel = cancel; @@ -39,9 +41,48 @@ export default function DeviceAliasesController(deviceService, toast, $scope, $m initController(); function initController() { - for (var aliasId in deviceAliases) { - var alias = deviceAliases[aliasId].alias; - var deviceId = deviceAliases[aliasId].deviceId; + var aliasId; + if (config.widgets) { + var widgetsTitleList, widget; + if (config.isSingleWidget && config.widgets.length == 1) { + widget = config.widgets[0]; + widgetsTitleList = [widget.config.title]; + for (aliasId in config.deviceAliases) { + vm.aliasToWidgetsMap[aliasId] = widgetsTitleList; + } + } else { + for (var w in config.widgets) { + widget = config.widgets[w]; + if (widget.type === types.widgetType.rpc.value) { + if (widget.config.targetDeviceAliasIds && widget.config.targetDeviceAliasIds.length > 0) { + var targetDeviceAliasId = widget.config.targetDeviceAliasIds[0]; + widgetsTitleList = vm.aliasToWidgetsMap[targetDeviceAliasId]; + if (!widgetsTitleList) { + widgetsTitleList = []; + vm.aliasToWidgetsMap[targetDeviceAliasId] = widgetsTitleList; + } + widgetsTitleList.push(widget.config.title); + } + } else { + for (var i in widget.config.datasources) { + var datasource = widget.config.datasources[i]; + if (datasource.type === types.datasourceType.device && datasource.deviceAliasId) { + widgetsTitleList = vm.aliasToWidgetsMap[datasource.deviceAliasId]; + if (!widgetsTitleList) { + widgetsTitleList = []; + vm.aliasToWidgetsMap[datasource.deviceAliasId] = widgetsTitleList; + } + widgetsTitleList.push(widget.config.title); + } + } + } + } + } + } + + for (aliasId in config.deviceAliases) { + var alias = config.deviceAliases[aliasId].alias; + var deviceId = config.deviceAliases[aliasId].deviceId; var deviceAlias = {id: aliasId, alias: alias, device: null, changed: false, searchText: ''}; if (deviceId) { fetchAliasDevice(deviceAlias, deviceId); diff --git a/ui/src/app/dashboard/device-aliases.tpl.html b/ui/src/app/dashboard/device-aliases.tpl.html index bf5bb61a69..22421a38af 100644 --- a/ui/src/app/dashboard/device-aliases.tpl.html +++ b/ui/src/app/dashboard/device-aliases.tpl.html @@ -15,11 +15,11 @@ limitations under the License. --> - +
-

{{ vm.isSingleDevice ? ('device.select-device-for-alias' | translate:vm.singleDeviceAlias ) : ('device.aliases' | translate) }}

+

{{ vm.isSingleDevice ? ('device.select-device-for-alias' | translate:vm.singleDeviceAlias ) : (vm.title | translate) }}

@@ -109,7 +109,7 @@
-
+
{{ 'device.add-alias' | translate }} diff --git a/ui/src/app/dashboard/edit-widget.directive.js b/ui/src/app/dashboard/edit-widget.directive.js index 34b11f7055..ecdf7ed112 100644 --- a/ui/src/app/dashboard/edit-widget.directive.js +++ b/ui/src/app/dashboard/edit-widget.directive.js @@ -76,10 +76,12 @@ export default function EditWidgetDirective($compile, $templateCache, widgetServ controllerAs: 'vm', templateUrl: deviceAliasesTemplate, locals: { - deviceAliases: angular.copy(scope.dashboard.configuration.deviceAliases), - aliasToWidgetsMap: null, - isSingleDevice: true, - singleDeviceAlias: singleDeviceAlias + config: { + deviceAliases: angular.copy(scope.dashboard.configuration.deviceAliases), + widgets: null, + isSingleDevice: true, + singleDeviceAlias: singleDeviceAlias + } }, parent: angular.element($document[0].body), fullscreen: true, diff --git a/ui/src/app/dashboard/index.js b/ui/src/app/dashboard/index.js index 461f56ec82..7dc9effa36 100644 --- a/ui/src/app/dashboard/index.js +++ b/ui/src/app/dashboard/index.js @@ -30,6 +30,7 @@ import thingsboardExpandFullscreen from '../components/expand-fullscreen.directi import thingsboardWidgetsBundleSelect from '../components/widgets-bundle-select.directive'; import thingsboardTypes from '../common/types.constant'; import thingsboardItemBuffer from '../services/item-buffer.service'; +import thingsboardImportExport from '../import-export'; import DashboardRoutes from './dashboard.routes'; import DashboardsController from './dashboards.controller'; @@ -47,6 +48,7 @@ export default angular.module('thingsboard.dashboard', [ gridster.name, thingsboardTypes, thingsboardItemBuffer, + thingsboardImportExport, thingsboardGrid, thingsboardApiWidget, thingsboardApiUser, diff --git a/ui/src/app/global-interceptor.service.js b/ui/src/app/global-interceptor.service.js index 7061152ab5..06798ea2a4 100644 --- a/ui/src/app/global-interceptor.service.js +++ b/ui/src/app/global-interceptor.service.js @@ -148,6 +148,7 @@ export default function GlobalInterceptor($rootScope, $q, $injector) { $rootScope.loading = false; } var unhandled = false; + var ignoreErrors = rejection.config.ignoreErrors; if (rejection.refreshTokenPending || rejection.status === 401) { var errorCode = rejectionErrorCode(rejection); if (rejection.refreshTokenPending || (errorCode && errorCode === getTypes().serverErrorCode.jwtTokenExpired)) { @@ -156,13 +157,17 @@ export default function GlobalInterceptor($rootScope, $q, $injector) { unhandled = true; } } else if (rejection.status === 403) { - $rootScope.$broadcast('forbidden'); + if (!ignoreErrors) { + $rootScope.$broadcast('forbidden'); + } } else if (rejection.status === 0 || rejection.status === -1) { getToast().showError(getTranslate().instant('error.unable-to-connect')); } else if (!rejection.config.url.startsWith('/api/plugins/rpc')) { if (rejection.status === 404) { - getToast().showError(rejection.config.method + ": " + rejection.config.url + "
" + - rejection.status + ": " + rejection.statusText); + if (!ignoreErrors) { + getToast().showError(rejection.config.method + ": " + rejection.config.url + "
" + + rejection.status + ": " + rejection.statusText); + } } else { unhandled = true; } diff --git a/ui/src/app/import-export/import-dialog.controller.js b/ui/src/app/import-export/import-dialog.controller.js new file mode 100644 index 0000000000..8a43fc7d8c --- /dev/null +++ b/ui/src/app/import-export/import-dialog.controller.js @@ -0,0 +1,71 @@ +/* + * Copyright © 2016 The Thingsboard Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import './import-dialog.scss'; + +/*@ngInject*/ +export default function ImportDialogController($scope, $mdDialog, toast, importTitle, importFileLabel) { + + var vm = this; + + vm.cancel = cancel; + vm.importFromJson = importFromJson; + vm.fileAdded = fileAdded; + vm.clearFile = clearFile; + + vm.importTitle = importTitle; + vm.importFileLabel = importFileLabel; + + + function cancel() { + $mdDialog.cancel(); + } + + function fileAdded($file) { + if ($file.getExtension() === 'json') { + var reader = new FileReader(); + reader.onload = function(event) { + $scope.$apply(function() { + if (event.target.result) { + $scope.theForm.$setDirty(); + var importJson = event.target.result; + if (importJson && importJson.length > 0) { + try { + vm.importData = angular.fromJson(importJson); + vm.fileName = $file.name; + } catch (err) { + vm.fileName = null; + toast.showError(err.message); + } + } + } + }); + }; + reader.readAsText($file.file); + } + } + + function clearFile() { + $scope.theForm.$setDirty(); + vm.fileName = null; + vm.importData = null; + } + + function importFromJson() { + $scope.theForm.$setPristine(); + $mdDialog.hide(vm.importData); + } +} diff --git a/ui/src/app/import-export/import-dialog.scss b/ui/src/app/import-export/import-dialog.scss new file mode 100644 index 0000000000..712126f8a1 --- /dev/null +++ b/ui/src/app/import-export/import-dialog.scss @@ -0,0 +1,70 @@ +/** + * Copyright © 2016 The Thingsboard Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +$previewSize: 100px; + +.file-input { + display: none; +} + +.tb-container { + position: relative; + margin-top: 32px; + padding: 10px 0; +} + +.tb-file-select-container { + position: relative; + height: $previewSize; + width: 100%; +} + +.tb-file-preview { + max-width: $previewSize; + max-height: $previewSize; + width: auto; + height: auto; +} + +.tb-flow-drop { + position: relative; + border: dashed 2px; + height: $previewSize; + vertical-align: top; + padding: 0 8px; + overflow: hidden; + min-width: 300px; + label { + width: 100%; + font-size: 24px; + text-align: center; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%,-50%); + } +} + +.tb-file-clear-container { + width: 48px; + height: $previewSize; + position: relative; + float: right; +} +.tb-file-clear-btn { + position: absolute !important; + top: 50%; + transform: translate(0%,-50%) !important; +} diff --git a/ui/src/app/import-export/import-dialog.tpl.html b/ui/src/app/import-export/import-dialog.tpl.html new file mode 100644 index 0000000000..2a8f3169b3 --- /dev/null +++ b/ui/src/app/import-export/import-dialog.tpl.html @@ -0,0 +1,72 @@ + + + + +
+

{{ vm.importTitle }}

+ + + + +
+ + + + +
+
+
+
+ +
+
+ + + {{ 'action.remove' | translate }} + + + close + + +
+
+ + +
+
+
+
+
import.no-file
+
{{ vm.fileName }}
+
+
+
+
+ + + + + {{ 'action.import' | translate }} + + {{ 'action.cancel' | translate }} + + + diff --git a/ui/src/app/import-export/import-export.service.js b/ui/src/app/import-export/import-export.service.js new file mode 100644 index 0000000000..d40949883f --- /dev/null +++ b/ui/src/app/import-export/import-export.service.js @@ -0,0 +1,373 @@ +/* + * Copyright © 2016 The Thingsboard Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +/* eslint-disable import/no-unresolved, import/default */ + +import importDialogTemplate from './import-dialog.tpl.html'; +import deviceAliasesTemplate from '../dashboard/device-aliases.tpl.html'; + +/* eslint-enable import/no-unresolved, import/default */ + + +/* eslint-disable no-undef, angular/window-service, angular/document-service */ + +/*@ngInject*/ +export default function ImportExport($log, $translate, $q, $mdDialog, $document, itembuffer, deviceService, dashboardService, toast) { + + + var service = { + exportDashboard: exportDashboard, + importDashboard: importDashboard, + exportWidget: exportWidget, + importWidget: importWidget + } + + return service; + + // Widget functions + + function exportWidget(dashboard, widget) { + var widgetItem = itembuffer.prepareWidgetItem(dashboard, widget); + var name = widgetItem.widget.config.title; + name = name.toLowerCase().replace(/\W/g,"_"); + exportToPc(prepareExport(widgetItem), name + '.json'); + } + + function importWidget($event, dashboard) { + openImportDialog($event, 'dashboard.import-widget', 'dashboard.widget-file').then( + function success(widgetItem) { + if (!validateImportedWidget(widgetItem)) { + toast.showError($translate.instant('dashboard.invalid-widget-file-error')); + } else { + var widget = widgetItem.widget; + var aliasesInfo = widgetItem.aliasesInfo; + var originalColumns = widgetItem.originalColumns; + + var datasourceAliases = aliasesInfo.datasourceAliases; + var targetDeviceAliases = aliasesInfo.targetDeviceAliases; + if (datasourceAliases || targetDeviceAliases) { + var deviceAliases = {}; + var datasourceAliasesMap = {}; + var targetDeviceAliasesMap = {}; + var aliasId = 1; + var datasourceIndex; + if (datasourceAliases) { + for (datasourceIndex in datasourceAliases) { + datasourceAliasesMap[aliasId] = datasourceIndex; + deviceAliases[aliasId] = { + alias: datasourceAliases[datasourceIndex].aliasName, + deviceId: datasourceAliases[datasourceIndex].deviceId + }; + aliasId++; + } + } + if (targetDeviceAliases) { + for (datasourceIndex in targetDeviceAliases) { + targetDeviceAliasesMap[aliasId] = datasourceIndex; + deviceAliases[aliasId] = { + alias: targetDeviceAliases[datasourceIndex].aliasName, + deviceId: targetDeviceAliases[datasourceIndex].deviceId + }; + aliasId++; + } + } + + var aliasIds = Object.keys(deviceAliases); + if (aliasIds.length > 0) { + processDeviceAliases(deviceAliases, aliasIds).then( + function(missingDeviceAliases) { + if (Object.keys(missingDeviceAliases).length > 0) { + editMissingAliases($event, [ widget ], + true, 'dashboard.widget-import-missing-aliases-title', missingDeviceAliases).then( + function success(updatedDeviceAliases) { + for (var aliasId in updatedDeviceAliases) { + var deviceAlias = updatedDeviceAliases[aliasId]; + var datasourceIndex; + if (datasourceAliasesMap[aliasId]) { + datasourceIndex = datasourceAliasesMap[aliasId]; + datasourceAliases[datasourceIndex].deviceId = deviceAlias.deviceId; + } else if (targetDeviceAliasesMap[aliasId]) { + datasourceIndex = targetDeviceAliasesMap[aliasId]; + targetDeviceAliases[datasourceIndex].deviceId = deviceAlias.deviceId; + } + } + addImportedWidget(dashboard, widget, aliasesInfo, originalColumns); + }, + function fail() {} + ); + } else { + addImportedWidget(dashboard, widget, aliasesInfo, originalColumns); + } + } + ); + } else { + addImportedWidget(dashboard, widget, aliasesInfo, originalColumns); + } + } else { + addImportedWidget(dashboard, widget, aliasesInfo, originalColumns); + } + } + }, + function fail() {} + ); + } + + function validateImportedWidget(widgetItem) { + if (angular.isUndefined(widgetItem.widget) + || angular.isUndefined(widgetItem.aliasesInfo) + || angular.isUndefined(widgetItem.originalColumns)) { + return false; + } + var widget = widgetItem.widget; + if (angular.isUndefined(widget.isSystemType) || + angular.isUndefined(widget.bundleAlias) || + angular.isUndefined(widget.typeAlias) || + angular.isUndefined(widget.type)) { + return false; + } + return true; + } + + function addImportedWidget(dashboard, widget, aliasesInfo, originalColumns) { + itembuffer.addWidgetToDashboard(dashboard, widget, aliasesInfo, originalColumns, -1, -1); + } + + // Dashboard functions + + function exportDashboard(dashboardId) { + dashboardService.getDashboard(dashboardId).then( + function success(dashboard) { + var name = dashboard.title; + name = name.toLowerCase().replace(/\W/g,"_"); + exportToPc(prepareExport(dashboard), name + '.json'); + }, + function fail(rejection) { + var message = rejection; + if (!message) { + message = $translate.instant('error.unknown-error'); + } + toast.showError($translate.instant('dashboard.export-failed-error', {error: message})); + } + ); + } + + function importDashboard($event) { + var deferred = $q.defer(); + openImportDialog($event, 'dashboard.import', 'dashboard.dashboard-file').then( + function success(dashboard) { + if (!validateImportedDashboard(dashboard)) { + toast.showError($translate.instant('dashboard.invalid-dashboard-file-error')); + deferred.reject(); + } else { + var deviceAliases = dashboard.configuration.deviceAliases; + if (deviceAliases) { + var aliasIds = Object.keys( deviceAliases ); + if (aliasIds.length > 0) { + processDeviceAliases(deviceAliases, aliasIds).then( + function(missingDeviceAliases) { + if (Object.keys( missingDeviceAliases ).length > 0) { + editMissingAliases($event, dashboard.configuration.widgets, + false, 'dashboard.dashboard-import-missing-aliases-title', missingDeviceAliases).then( + function success(updatedDeviceAliases) { + for (var aliasId in updatedDeviceAliases) { + deviceAliases[aliasId] = updatedDeviceAliases[aliasId]; + } + saveImportedDashboard(dashboard, deferred); + }, + function fail() { + deferred.reject(); + } + ); + } else { + saveImportedDashboard(dashboard, deferred); + } + } + ) + } else { + saveImportedDashboard(dashboard, deferred); + } + } else { + saveImportedDashboard(dashboard, deferred); + } + } + }, + function fail() { + deferred.reject(); + } + ); + return deferred.promise; + } + + function saveImportedDashboard(dashboard, deferred) { + dashboardService.saveDashboard(dashboard).then( + function success() { + deferred.resolve(); + }, + function fail() { + deferred.reject(); + } + ) + } + + function validateImportedDashboard(dashboard) { + if (angular.isUndefined(dashboard.title) || angular.isUndefined(dashboard.configuration)) { + return false; + } + return true; + } + + function processDeviceAliases(deviceAliases, aliasIds) { + var deferred = $q.defer(); + var missingDeviceAliases = {}; + var index = -1; + checkNextDeviceAliasOrComplete(index, aliasIds, deviceAliases, missingDeviceAliases, deferred); + return deferred.promise; + } + + function checkNextDeviceAliasOrComplete(index, aliasIds, deviceAliases, missingDeviceAliases, deferred) { + index++; + if (index == aliasIds.length) { + deferred.resolve(missingDeviceAliases); + } else { + checkDeviceAlias(index, aliasIds, deviceAliases, missingDeviceAliases, deferred); + } + } + + function checkDeviceAlias(index, aliasIds, deviceAliases, missingDeviceAliases, deferred) { + var aliasId = aliasIds[index]; + var deviceAlias = deviceAliases[aliasId]; + if (deviceAlias.deviceId) { + deviceService.getDevice(deviceAlias.deviceId, true).then( + function success() { + checkNextDeviceAliasOrComplete(index, aliasIds, deviceAliases, missingDeviceAliases, deferred); + }, + function fail() { + var missingDeviceAlias = angular.copy(deviceAlias); + missingDeviceAlias.deviceId = null; + missingDeviceAliases[aliasId] = missingDeviceAlias; + checkNextDeviceAliasOrComplete(index, aliasIds, deviceAliases, missingDeviceAliases, deferred); + } + ); + } + } + + function editMissingAliases($event, widgets, isSingleWidget, customTitle, missingDeviceAliases) { + var deferred = $q.defer(); + $mdDialog.show({ + controller: 'DeviceAliasesController', + controllerAs: 'vm', + templateUrl: deviceAliasesTemplate, + locals: { + config: { + deviceAliases: missingDeviceAliases, + widgets: widgets, + isSingleWidget: isSingleWidget, + isSingleDevice: false, + singleDeviceAlias: null, + customTitle: customTitle, + disableAdd: true + } + }, + parent: angular.element($document[0].body), + skipHide: true, + fullscreen: true, + targetEvent: $event + }).then(function (updatedDeviceAliases) { + deferred.resolve(updatedDeviceAliases); + }, function () { + deferred.reject(); + }); + return deferred.promise; + } + + // Common functions + + function prepareExport(data) { + var exportedData = angular.copy(data); + if (angular.isDefined(exportedData.id)) { + delete exportedData.id; + } + if (angular.isDefined(exportedData.createdTime)) { + delete exportedData.createdTime; + } + if (angular.isDefined(exportedData.tenantId)) { + delete exportedData.tenantId; + } + if (angular.isDefined(exportedData.customerId)) { + delete exportedData.customerId; + } + return exportedData; + } + + function exportToPc(data, filename) { + if (!data) { + $log.error('No data'); + return; + } + + if (!filename) { + filename = 'download.json'; + } + + if (angular.isObject(data)) { + data = angular.toJson(data, 2); + } + + var blob = new Blob([data], {type: 'text/json'}); + + // FOR IE: + + if (window.navigator && window.navigator.msSaveOrOpenBlob) { + window.navigator.msSaveOrOpenBlob(blob, filename); + } + else{ + var e = document.createEvent('MouseEvents'), + a = document.createElement('a'); + + a.download = filename; + a.href = window.URL.createObjectURL(blob); + a.dataset.downloadurl = ['text/json', a.download, a.href].join(':'); + e.initEvent('click', true, false, window, + 0, 0, 0, 0, 0, false, false, false, false, 0, null); + a.dispatchEvent(e); + } + } + + function openImportDialog($event, importTitle, importFileLabel) { + var deferred = $q.defer(); + $mdDialog.show({ + controller: 'ImportDialogController', + controllerAs: 'vm', + templateUrl: importDialogTemplate, + locals: { + importTitle: importTitle, + importFileLabel: importFileLabel + }, + parent: angular.element($document[0].body), + skipHide: true, + fullscreen: true, + targetEvent: $event + }).then(function (importData) { + deferred.resolve(importData); + }, function () { + deferred.reject(); + }); + return deferred.promise; + } + +} + +/* eslint-enable no-undef, angular/window-service, angular/document-service */ diff --git a/ui/src/app/import-export/index.js b/ui/src/app/import-export/index.js new file mode 100644 index 0000000000..6d76229210 --- /dev/null +++ b/ui/src/app/import-export/index.js @@ -0,0 +1,24 @@ +/* + * Copyright © 2016 The Thingsboard Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import ImportExport from './import-export.service'; +import ImportDialogController from './import-dialog.controller'; + + +export default angular.module('thingsboard.importexport', []) + .factory('importExport', ImportExport) + .controller('ImportDialogController', ImportDialogController) + .name; diff --git a/ui/src/app/services/item-buffer.service.js b/ui/src/app/services/item-buffer.service.js index 56d8d6f571..2e59bb6f02 100644 --- a/ui/src/app/services/item-buffer.service.js +++ b/ui/src/app/services/item-buffer.service.js @@ -25,11 +25,12 @@ export default angular.module('thingsboard.itembuffer', [angularStorage]) .name; /*@ngInject*/ -function ItemBuffer(bufferStore) { +function ItemBuffer(bufferStore, types) { const WIDGET_ITEM = "widget_item"; var service = { + prepareWidgetItem: prepareWidgetItem, copyWidget: copyWidget, hasWidget: hasWidget, pasteWidget: pasteWidget, @@ -56,12 +57,57 @@ function ItemBuffer(bufferStore) { } **/ - function copyWidget(widget, aliasesInfo, originalColumns) { - var widgetItem = { + function prepareWidgetItem(dashboard, widget) { + var aliasesInfo = { + datasourceAliases: {}, + targetDeviceAliases: {} + }; + var originalColumns = 24; + if (dashboard.configuration.gridSettings && + dashboard.configuration.gridSettings.columns) { + originalColumns = dashboard.configuration.gridSettings.columns; + } + if (widget.config && dashboard.configuration + && dashboard.configuration.deviceAliases) { + var deviceAlias; + if (widget.config.datasources) { + for (var i=0;i