tsai
/
thingsboard
mirror of https://github.com/thingsboard/thingsboard.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Merge pull request #4637 from vvlladd28/update/angular/11 

UI: Update to Angular 11
pull/4651/head
Igor Kulikov 5 years ago
committed by GitHub
parent
141357875b 8938c69e7b
commit
df0d6ea0cf
No known key found for this signature in database GPG Key ID: 4AEE18F83AFDEB23
13 changed files with 2889 additions and 2698 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      rule-engine/rule-engine-components/src/main/resources/public/static/rulenode/rulenode-core-config.js
  2. 4
      ui-ngx/angular.json
  3. 8
      ui-ngx/extra-webpack.config.js
  4. 128
      ui-ngx/package.json
  5. 2
      ui-ngx/src/.browserslistrc
  6. 2
      ui-ngx/src/app/app-routing.module.ts
  7. 7
      ui-ngx/src/app/core/services/dynamic-component-factory.service.ts
  8. 14
      ui-ngx/src/app/modules/home/components/widget/dialog/custom-dialog.component.ts
  9. 16
      ui-ngx/src/app/modules/home/components/widget/dynamic-widget.component.ts
  10. 4
      ui-ngx/src/app/modules/home/components/widget/lib/date-range-navigator/date-range-navigator.component.ts
  11. 23
      ui-ngx/src/app/shared/decorators/tb-inject.ts
  12. 1
      ui-ngx/src/assets/locale/locale.constant-en_US.json
  13. 5376
      ui-ngx/yarn.lock

2
rule-engine/rule-engine-components/src/main/resources/public/static/rulenode/rulenode-core-config.js
View File

File diff suppressed because one or more lines are too long

4
ui-ngx/angular.json
View File

@ -132,7 +132,6 @@
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"extractLicenses": true,
"vendorChunk": false,
@ -150,7 +149,6 @@
"serve": {
"builder": "@angular-builders/custom-webpack:dev-server",
"options": {
"aot": true,
"browserTarget": "thingsboard:build",
"proxyConfig": "proxy.conf.js"
},
@ -231,4 +229,4 @@
"packageManager": "yarn",
"analytics": false
}
}
}

8
ui-ngx/extra-webpack.config.js
View File

@ -17,7 +17,7 @@ const CompressionPlugin = require("compression-webpack-plugin");
const TerserPlugin = require("terser-webpack-plugin");
const webpack = require("webpack");
const dirTree = require("directory-tree");
const AngularCompilerPlugin = require('@ngtools/webpack');
const ngWebpack = require('@ngtools/webpack');
var langs = [];
@ -56,12 +56,12 @@ module.exports = (config, options) => {
);
if (config.mode === 'production') {
const index = config.plugins.findIndex(p => p instanceof AngularCompilerPlugin.AngularCompilerPlugin);
const angularCompilerOptions = config.plugins[index]._options;
const index = config.plugins.findIndex(p => p instanceof ngWebpack.ivy.AngularWebpackPlugin);
const angularCompilerOptions = config.plugins[index].pluginOptions;
angularCompilerOptions.emitClassMetadata = true;
angularCompilerOptions.emitNgModuleScope = true;
config.plugins.splice(index, 1);
config.plugins.push(new AngularCompilerPlugin.AngularCompilerPlugin(angularCompilerOptions));
config.plugins.push(new ngWebpack.ivy.AngularWebpackPlugin(angularCompilerOptions));
const terserPluginOptions = config.optimization.minimizer[1].options;
delete terserPluginOptions.terserOptions.compress.global_defs.ngJitMode;
terserPluginOptions.terserOptions.compress.side_effects = false;

128
ui-ngx/package.json
View File

@ -12,68 +12,68 @@
},
"private": true,
"dependencies": {
"@angular/animations": "^10.1.5",
"@angular/cdk": "^10.2.4",
"@angular/common": "^10.1.5",
"@angular/compiler": "^10.1.5",
"@angular/core": "^10.1.5",
"@angular/flex-layout": "^10.0.0-beta.32",
"@angular/forms": "^10.1.5",
"@angular/material": "^10.2.4",
"@angular/platform-browser": "^10.1.5",
"@angular/platform-browser-dynamic": "^10.1.5",
"@angular/router": "^10.1.5",
"@auth0/angular-jwt": "^5.0.1",
"@date-io/date-fns": "^2.6.1",
"@angular/animations": "^11.2.14",
"@angular/cdk": "^11.2.13",
"@angular/common": "^11.2.14",
"@angular/compiler": "^11.2.14",
"@angular/core": "^11.2.14",
"@angular/flex-layout": "^11.0.0-beta.33",
"@angular/forms": "^11.2.14",
"@angular/material": "^11.2.13",
"@angular/platform-browser": "^11.2.14",
"@angular/platform-browser-dynamic": "^11.2.14",
"@angular/router": "^11.2.14",
"@auth0/angular-jwt": "^5.0.2",
"@date-io/date-fns": "^2.10.11",
"@flowjs/flow.js": "^2.14.1",
"@flowjs/ngx-flow": "^0.4.4",
"@juggle/resize-observer": "^3.1.3",
"@mat-datetimepicker/core": "^5.1.0",
"@material-ui/core": "^4.11.0",
"@material-ui/icons": "^4.9.1",
"@material-ui/pickers": "^3.2.10",
"@ngrx/effects": "^10.0.1",
"@ngrx/store": "^10.0.1",
"@ngrx/store-devtools": "^10.0.1",
"@flowjs/ngx-flow": "~0.4.6",
"@juggle/resize-observer": "^3.3.1",
"@mat-datetimepicker/core": "~6.0.2",
"@material-ui/core": "^4.11.4",
"@material-ui/icons": "^4.11.2",
"@material-ui/pickers": "^3.3.10",
"@ngrx/effects": "^10.1.2",
"@ngrx/store": "^10.1.2",
"@ngrx/store-devtools": "^10.1.2",
"@ngx-translate/core": "^13.0.0",
"@ngx-translate/http-loader": "^6.0.0",
"ace-builds": "^1.4.12",
"angular-gridster2": "^10.1.6",
"angular-gridster2": "~11.2.0",
"angular2-hotkeys": "^2.2.0",
"canvas-gauges": "^2.1.7",
"compass-sass-mixins": "^0.12.7",
"core-js": "^3.6.5",
"date-fns": "^2.15.0",
"core-js": "^3.12.1",
"date-fns": "^2.21.3",
"flot": "git://github.com/thingsboard/flot.git#0.9-work",
"flot.curvedlines": "git://github.com/MichaelZinsmaier/CurvedLines.git#master",
"font-awesome": "^4.7.0",
"html2canvas": "^1.0.0-rc.7",
"jquery": "^3.5.1",
"jquery.terminal": "^2.18.3",
"js-beautify": "^1.13.0",
"jquery.terminal": "^2.24.0",
"js-beautify": "^1.13.13",
"json-schema-defaults": "^0.4.0",
"jstree": "^3.3.10",
"jstree": "^3.3.11",
"jstree-bootstrap-theme": "^1.0.1",
"jszip": "^3.5.0",
"jszip": "^3.6.0",
"leaflet": "^1.7.1",
"leaflet-editable": "^1.2.0",
"leaflet-polylinedecorator": "^1.6.0",
"leaflet-providers": "^1.10.2",
"leaflet.gridlayer.googlemutant": "0.10.0",
"leaflet.markercluster": "^1.4.1",
"leaflet-providers": "^1.12.0",
"leaflet.gridlayer.googlemutant": "0.10.2",
"leaflet.markercluster": "^1.5.0",
"material-design-icons": "^3.0.1",
"messageformat": "^2.3.0",
"moment": "^2.29.1",
"moment-timezone": "^0.5.31",
"moment-timezone": "^0.5.33",
"mousetrap": "1.6.3",
"ngx-clipboard": "^13.0.1",
"ngx-color-picker": "^10.1.0",
"ngx-clipboard": "^14.0.1",
"ngx-color-picker": "^11.0.0",
"ngx-daterangepicker-material": "^4.0.1",
"ngx-drag-drop": "^2.0.0",
"ngx-flowchart": "git://github.com/thingsboard/ngx-flowchart.git#master",
"ngx-hm-carousel": "^2.0.0-rc.1",
"ngx-sharebuttons": "^8.0.1",
"ngx-translate-messageformat-compiler": "^4.8.0",
"ngx-sharebuttons": "^8.0.5",
"ngx-translate-messageformat-compiler": "^4.9.0",
"objectpath": "^2.0.0",
"prettier": "^2.1.2",
"prop-types": "^15.7.2",
@ -84,58 +84,58 @@
"react-dom": "^16.13.1",
"react-dropzone": "^11.2.0",
"reactcss": "^1.2.3",
"rxjs": "^6.6.3",
"schema-inspector": "^1.7.0",
"screenfull": "^5.0.2",
"split.js": "^1.6.2",
"rxjs": "~6.6.7",
"schema-inspector": "^2.0.1",
"screenfull": "^5.1.0",
"split.js": "^1.6.4",
"systemjs": "0.21.5",
"tinycolor2": "^1.4.2",
"tooltipster": "^4.2.8",
"tslib": "^2.0.2",
"tslib": "^2.2.0",
"tv4": "^1.3.0",
"typeface-roboto": "^1.1.13",
"zone.js": "~0.10.3"
"zone.js": "~0.11.4"
},
"devDependencies": {
"@angular-builders/custom-webpack": "^10.0.1",
"@angular-devkit/build-angular": "^0.1001.5",
"@angular/cli": "^10.1.5",
"@angular/compiler-cli": "^10.1.5",
"@angular/language-service": "^10.1.5",
"@ngtools/webpack": "10.1.5",
"@angular-builders/custom-webpack": "~11.1.1",
"@angular-devkit/build-angular": "^0.1102.13",
"@angular/cli": "^11.2.13",
"@angular/compiler-cli": "^11.2.14",
"@angular/language-service": "^11.2.14",
"@ngtools/webpack": "~11.2.13",
"@types/canvas-gauges": "^2.1.2",
"@types/flot": "^0.0.31",
"@types/jasmine": "^3.5.12",
"@types/jasminewd2": "^2.0.8",
"@types/jasmine": "~3.7.4",
"@types/jasminewd2": "^2.0.9",
"@types/jquery": "^3.5.2",
"@types/js-beautify": "^1.11.0",
"@types/js-beautify": "^1.13.1",
"@types/jstree": "^3.3.40",
"@types/leaflet": "^1.5.17",
"@types/leaflet": "1.5.17",
"@types/leaflet-polylinedecorator": "^1.6.0",
"@types/leaflet.markercluster": "^1.4.3",
"@types/lodash": "^4.14.161",
"@types/leaflet.markercluster": "^1.4.4",
"@types/lodash": "^4.14.170",
"@types/moment-timezone": "^0.5.30",
"@types/mousetrap": "1.6.3",
"@types/raphael": "^2.3.0",
"@types/raphael": "^2.3.1",
"@types/react": "^16.9.51",
"@types/react-dom": "^16.9.8",
"@types/tinycolor2": "^1.4.2",
"@types/tooltipster": "^0.0.30",
"codelyzer": "^6.0.1",
"compression-webpack-plugin": "^6.0.2",
"codelyzer": "^6.0.2",
"compression-webpack-plugin": "^6.1.1",
"directory-tree": "^2.2.4",
"jasmine-core": "~3.6.0",
"jasmine-spec-reporter": "~5.0.2",
"karma": "~5.1.1",
"jasmine-core": "~3.7.1",
"jasmine-spec-reporter": "~7.0.0",
"karma": "~6.3.2",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~3.0.3",
"karma-jasmine": "~4.0.1",
"karma-jasmine-html-reporter": "^1.5.4",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "^1.5.0",
"ngrx-store-freeze": "^0.2.4",
"protractor": "~7.0.0",
"ts-node": "^9.0.0",
"tslint": "~6.1.3",
"typescript": "~4.0.3",
"webpack": "^4.44.2"
"webpack": "^4.46.0"
}
}

2
ui-ngx/src/.browserslistrc
View File

@ -8,4 +8,4 @@
last 2 versions
Firefox ESR
not dead
IE 10-11
IE 11

2
ui-ngx/src/app/app-routing.module.ts
View File

@ -30,7 +30,7 @@ const routes: Routes = [
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
imports: [RouterModule.forRoot(routes, { relativeLinkResolution: 'legacy' })],
exports: [RouterModule]
})
export class AppRoutingModule { }

7
ui-ngx/src/app/core/services/dynamic-component-factory.service.ts
View File

@ -28,6 +28,7 @@ import {
import { Observable, ReplaySubject } from 'rxjs';
import { CommonModule } from '@angular/common';
@Injectable()
@NgModule()
export abstract class DynamicComponentModule implements OnDestroy {
@ -41,11 +42,9 @@ interface DynamicComponentModuleData {
moduleType: Type<DynamicComponentModule>;
}
@Injectable(
{
@Injectable({
providedIn: 'root'
}
)
})
export class DynamicComponentFactoryService {
private dynamicComponentModulesMap = new Map<ComponentFactory<any>, DynamicComponentModuleData>();

14
ui-ngx/src/app/modules/home/components/widget/dialog/custom-dialog.component.ts
View File

@ -15,13 +15,14 @@
///
import { MatDialogRef } from '@angular/material/dialog';
import { Directive, Inject, InjectionToken } from '@angular/core';
import { Directive, InjectionToken } from '@angular/core';
import { Store } from '@ngrx/store';
import { AppState } from '@core/core.state';
import { Router } from '@angular/router';
import { PageComponent } from '@shared/components/page.component';
import { CustomDialogContainerComponent } from './custom-dialog-container.component';
import { FormBuilder, Validators } from '@angular/forms';
import { TbInject } from '@shared/decorators/tb-inject';
export const CUSTOM_DIALOG_DATA = new InjectionToken<any>('ConfigDialogData');
@ -31,15 +32,16 @@ export interface CustomDialogData {
}
@Directive()
// tslint:disable-next-line:directive-class-suffix
export class CustomDialogComponent extends PageComponent {
[key: string]: any;
constructor(protected store: Store<AppState>,
protected router: Router,
public dialogRef: MatDialogRef<CustomDialogContainerComponent>,
public fb: FormBuilder,
@Inject(CUSTOM_DIALOG_DATA) public data: CustomDialogData) {
constructor(@TbInject(Store) protected store: Store<AppState>,
@TbInject(Router) protected router: Router,
@TbInject(MatDialogRef) public dialogRef: MatDialogRef<CustomDialogContainerComponent>,
@TbInject(FormBuilder) public fb: FormBuilder,
@TbInject(CUSTOM_DIALOG_DATA) public data: CustomDialogData) {
super(store);
// @ts-ignore
this.validators = Validators;

16
ui-ngx/src/app/modules/home/components/widget/dynamic-widget.component.ts
View File

@ -15,7 +15,7 @@
///
import { PageComponent } from '@shared/components/page.component';
import { Inject, Injector, OnDestroy, OnInit, Directive } from '@angular/core';
import { Directive, Injector, OnDestroy, OnInit } from '@angular/core';
import { Store } from '@ngrx/store';
import { AppState } from '@core/core.state';
import { IDynamicWidgetComponent, WidgetContext } from '@home/models/widget-component.models';
@ -42,8 +42,10 @@ import { DatePipe } from '@angular/common';
import { TranslateService } from '@ngx-translate/core';
import { DomSanitizer } from '@angular/platform-browser';
import { Router } from '@angular/router';
import { TbInject } from '@shared/decorators/tb-inject';
@Directive()
// tslint:disable-next-line:directive-class-suffix
export class DynamicWidgetComponent extends PageComponent implements IDynamicWidgetComponent, OnInit, OnDestroy {
executingRpcRequest: boolean;
@ -55,12 +57,12 @@ export class DynamicWidgetComponent extends PageComponent implements IDynamicWid
validators = Validators;
constructor(@Inject(RafService) public raf: RafService,
@Inject(Store) protected store: Store<AppState>,
@Inject(FormBuilder) public fb: FormBuilder,
@Inject(Injector) public readonly $injector: Injector,
@Inject('widgetContext') public readonly ctx: WidgetContext,
@Inject('errorMessages') public readonly errorMessages: string[]) {
constructor(@TbInject(RafService) public raf: RafService,
@TbInject(Store) protected store: Store<AppState>,
@TbInject(FormBuilder) public fb: FormBuilder,
@TbInject(Injector) public readonly $injector: Injector,
@TbInject('widgetContext') public readonly ctx: WidgetContext,
@TbInject('errorMessages') public readonly errorMessages: string[]) {
super(store);
this.ctx.$injector = $injector;
this.ctx.deviceService = $injector.get(DeviceService);

4
ui-ngx/src/app/modules/home/components/widget/lib/date-range-navigator/date-range-navigator.component.ts
View File

@ -74,9 +74,9 @@ export class DateRangeNavigatorWidgetComponent extends PageComponent implements
private firstUpdate = true;
private dashboardTimewindowChangedSubscription: Subscription;
originalOrder = (a: KeyValue<number,DateIntervalEntry>, b: KeyValue<number,DateIntervalEntry>): number => {
originalOrder = (a: KeyValue<string, DateIntervalEntry>, b: KeyValue<string, DateIntervalEntry>): number => {
return 0;
};
}
constructor(private utils: UtilsService,
private overlay: Overlay,

23
ui-ngx/src/app/shared/decorators/tb-inject.ts
View File

@ -0,0 +1,23 @@
///
/// Copyright © 2016-2021 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 { Inject, Type } from '@angular/core';
export function TbInject<T>(token: any): (target: Type<T>, key: any, paramIndex: number) => void {
return (target: Type<T>, key: any, paramIndex: number) => {
Inject(token)(target, key, paramIndex);
};
}

1
ui-ngx/src/assets/locale/locale.constant-en_US.json
View File

@ -412,6 +412,7 @@
"import": "Import assets",
"asset-file": "Asset file",
"label": "Label",
"search": "Search assets",
"assign-asset-to-edge": "Assign Asset(s) To Edge",
"unassign-asset-from-edge": "Unassign asset",
"unassign-asset-from-edge-title": "Are you sure you want to unassign the asset '{{assetName}}'?",

5376
ui-ngx/yarn.lock
View File

File diff suppressed because it is too large
Write Preview
Loading…
Cancel
Save