purchasing/fuse-angular
3
0
Fork 0
mirror of https://github.com/richard-loafle/fuse-angular.git synced 2025-01-24 20:03:18 +00:00
Code Issues Packages Projects Releases Wiki Activity

Updated Angular & Angular Components to 8.0.0

Browse Source 
Updated various other libraries to their latest versions
Updated various project files for better Angular 8 support
This commit is contained in:
sercan 2019-05-30 10:47:34 +03:00
parent bc2fc44bcf
commit f1e1ddc236
139 changed files with 11648 additions and 12564 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
README.md
View File

@ -1,6 +1,6 @@
# Fuse - Angular # Fuse - Angular
Material Design Admin Template with Angular 7+ and Angular Material Material Design Admin Template with Angular 8 and Angular Material
## The Community ## The Community

51
angular.json
View File

@ -4,24 +4,24 @@
"newProjectRoot": "projects", "newProjectRoot": "projects",
"projects": { "projects": {
"fuse": { "fuse": {
"root": "",
"sourceRoot": "src",
"projectType": "application", "projectType": "application",
"prefix": "app",
"schematics": { "schematics": {
"@schematics/angular:component": { "@schematics/angular:component": {
"styleext": "scss" "style": "scss"
} }
}, },
"root": "",
"sourceRoot": "src",
"prefix": "app",
"architect": { "architect": {
"build": { "build": {
"builder": "@angular-devkit/build-angular:browser", "builder": "@angular-devkit/build-angular:browser",
"options": { "options": {
"outputPath": "dist", "outputPath": "dist/fuse",
"index": "src/index.html", "index": "src/index.html",
"main": "src/main.ts", "main": "src/main.ts",
"polyfills": "src/polyfills.ts", "polyfills": "src/polyfills.ts",
"tsConfig": "src/tsconfig.app.json", "tsConfig": "tsconfig.app.json",
"assets": [ "assets": [
"src/favicon.ico", "src/favicon.ico",
"src/assets", "src/assets",
@ -101,24 +101,25 @@
"options": { "options": {
"main": "src/test.ts", "main": "src/test.ts",
"polyfills": "src/polyfills.ts", "polyfills": "src/polyfills.ts",
"tsConfig": "src/tsconfig.spec.json", "tsConfig": "tsconfig.spec.json",
"karmaConfig": "src/karma.conf.js", "karmaConfig": "karma.conf.js",
"styles": [
"src/styles.scss"
],
"scripts": [],
"assets": [ "assets": [
"src/favicon.ico", "src/favicon.ico",
"src/assets" "src/assets"
] ],
"styles": [
"src/styles.scss"
],
"scripts": []
} }
}, },
"lint": { "lint": {
"builder": "@angular-devkit/build-angular:tslint", "builder": "@angular-devkit/build-angular:tslint",
"options": { "options": {
"tsConfig": [ "tsConfig": [
"src/tsconfig.app.json", "tsconfig.app.json",
"src/tsconfig.spec.json" "tsconfig.spec.json",
"e2e/tsconfig.json"
], ],
"exclude": [ "exclude": [
"**/node_modules/**", "**/node_modules/**",
@ -126,14 +127,7 @@
"**/src/assets/angular-material-examples/**/*" "**/src/assets/angular-material-examples/**/*"
] ]
} }
} },
}
},
"fuse-e2e": {
"root": "e2e/",
"projectType": "application",
"prefix": "",
"architect": {
"e2e": { "e2e": {
"builder": "@angular-devkit/build-angular:protractor", "builder": "@angular-devkit/build-angular:protractor",
"options": { "options": {
@ -145,17 +139,6 @@
"devServerTarget": "fuse:serve:production" "devServerTarget": "fuse:serve:production"
} }
} }
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": "e2e/tsconfig.e2e.json",
"exclude": [
"**/node_modules/**",
"**/src/app/fake-db/**/*",
"**/src/assets/angular-material-examples/**/*"
]
}
} }
} }
} }

16
browserslist Normal file
View File

@ -0,0 +1,16 @@
# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
# For additional information regarding the format and rule options, please see:
# https://github.com/browserslist/browserslist#queries
# You can see what browsers were selected by your queries by running:
# npx browserslist
# Googlebot uses an older version of Chrome
# For additional information see: https://developers.google.com/search/docs/guides/rendering
> 0.5%
last 2 versions
Firefox ESR
Chrome 41 # Support for Googlebot
not dead
not IE 9-11 # For IE 9-11 support, remove 'not'.

5
src/karma.conf.js → karma.conf.js
View File

@ -17,7 +17,7 @@ module.exports = function (config)
clearContext: false // leave Jasmine Spec Runner output visible in browser clearContext: false // leave Jasmine Spec Runner output visible in browser
}, },
coverageIstanbulReporter: { coverageIstanbulReporter: {
dir : require('path').join(__dirname, '../coverage'), dir : require('path').join(__dirname, './coverage/fuse'),
reports : ['html', 'lcovonly', 'text-summary'], reports : ['html', 'lcovonly', 'text-summary'],
fixWebpackSourcePaths: true fixWebpackSourcePaths: true
}, },
@ -27,6 +27,7 @@ module.exports = function (config)
logLevel : config.LOG_INFO, logLevel : config.LOG_INFO,
autoWatch : true, autoWatch : true,
browsers : ['Chrome'], browsers : ['Chrome'],
singleRun : false singleRun : false,
restartOnFileChange : true
}); });
}; };

22316
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

175
package.json
View File

@ -1,91 +1,88 @@
{ {
"name": "fuse", "name": "fuse",
"version": "7.1.0", "version": "8.0.0",
"license": "https://themeforest.net/licenses/terms/regular", "license": "https://themeforest.net/licenses/terms/regular",
"scripts": { "scripts": {
"ng": "ng", "ng": "ng",
"start": "ng serve --open", "start": "ng serve --open",
"start-hmr": "ng serve --configuration hmr --source-map=false --hmr-warning=false", "start-hmr": "ng serve --configuration hmr --source-map=false --hmr-warning=false",
"start-hmr-sourcemaps": "ng serve --configuration hmr --source-map=true --hmr-warning=false", "start-hmr-sourcemaps": "ng serve --configuration hmr --source-map=true --hmr-warning=false",
"build": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng build --dev", "build": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng build --dev",
"build-stats": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng build --dev --stats-json", "build-stats": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng build --dev --stats-json",
"build-prod": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng build --prod", "build-prod": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng build --prod",
"build-prod-stats": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng build --prod --stats-json", "build-prod-stats": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng build --prod --stats-json",
"test": "ng test", "test": "ng test",
"lint": "ng lint", "lint": "ng lint",
"e2e": "ng e2e", "e2e": "ng e2e",
"bundle-report": "webpack-bundle-analyzer dist/stats.json" "bundle-report": "webpack-bundle-analyzer dist/stats.json"
}, },
"private": true, "private": true,
"dependencies": { "dependencies": {
"@agm/core": "1.0.0-beta.5", "@agm/core": "1.0.0-beta.5",
"@angular/animations": "7.2.1", "@angular/animations": "8.0.0",
"@angular/cdk": "7.2.1", "@angular/cdk": "8.0.0",
"@angular/common": "7.2.1", "@angular/common": "8.0.0",
"@angular/compiler": "7.2.1", "@angular/compiler": "8.0.0",
"@angular/core": "7.2.1", "@angular/core": "8.0.0",
"@angular/flex-layout": "7.0.0-beta.23", "@angular/flex-layout": "8.0.0-beta.26",
"@angular/forms": "7.2.1", "@angular/forms": "8.0.0",
"@angular/http": "7.2.1", "@angular/material": "8.0.0",
"@angular/material": "7.2.1", "@angular/material-moment-adapter": "8.0.0",
"@angular/material-moment-adapter": "7.2.1", "@angular/platform-browser": "8.0.0",
"@angular/platform-browser": "7.2.1", "@angular/platform-browser-dynamic": "8.0.0",
"@angular/platform-browser-dynamic": "7.2.1", "@angular/router": "8.0.0",
"@angular/router": "7.2.1", "@ngrx/effects": "8.0.0-beta.2",
"@ngrx/effects": "7.0.0", "@ngrx/router-store": "8.0.0-beta.2",
"@ngrx/router-store": "7.0.0", "@ngrx/store": "8.0.0-beta.2",
"@ngrx/store": "7.0.0", "@ngrx/store-devtools": "8.0.0-beta.2",
"@ngrx/store-devtools": "7.0.0", "@ngx-translate/core": "11.0.1",
"@ngx-translate/core": "11.0.1", "@swimlane/dragula": "3.8.0",
"@swimlane/dragula": "3.7.3", "@swimlane/ngx-charts": "11.1.0",
"@swimlane/ngx-charts": "10.0.0", "@swimlane/ngx-datatable": "15.0.0",
"@swimlane/ngx-datatable": "14.0.0", "@swimlane/ngx-dnd": "7.0.0",
"@swimlane/ngx-dnd": "6.0.0", "@types/prismjs": "1.16.0",
"@types/prismjs": "1.9.0", "angular-calendar": "0.27.8",
"angular-calendar": "0.26.4", "angular-in-memory-web-api": "0.8.0",
"angular-in-memory-web-api": "0.8.0", "chart.js": "2.8.0",
"chart.js": "2.7.3", "classlist.js": "1.1.20150312",
"classlist.js": "1.1.20150312", "d3": "5.9.2",
"core-js": "2.6.2", "date-fns": "1.30.1",
"d3": "5.7.0", "hammerjs": "2.0.8",
"date-fns": "1.30.1", "lodash": "4.17.11",
"hammerjs": "2.0.8", "moment": "2.24.0",
"lodash": "4.17.11", "ng2-charts": "2.2.4",
"moment": "2.23.0", "ngrx-store-freeze": "0.2.4",
"ng2-charts": "1.6.0", "ngx-color-picker": "7.5.0",
"ngrx-store-freeze": "0.2.4", "ngx-cookie-service": "2.2.0",
"ngx-color-picker": "7.3.0", "perfect-scrollbar": "1.4.0",
"ngx-cookie-service": "2.1.0", "prismjs": "1.16.0",
"perfect-scrollbar": "1.4.0", "rxjs": "6.5.2",
"prismjs": "1.15.0", "web-animations-js": "2.3.1",
"rxjs": "6.3.3", "zone.js": "0.9.1"
"rxjs-compat": "6.3.3", },
"web-animations-js": "2.3.1", "devDependencies": {
"zone.js": "0.8.28" "@angular/cli": "8.0.0",
}, "@angular/compiler-cli": "8.0.0",
"devDependencies": { "@angular/language-service": "8.0.0",
"@angular/cli": "7.2.2", "@angular-devkit/build-angular": "0.800.0",
"@angular/compiler-cli": "7.2.1", "@angularclass/hmr": "2.1.3",
"@angular/language-service": "7.2.1", "@types/jasmine": "3.3.13",
"@angular-devkit/build-angular": "0.12.2", "@types/jasminewd2": "2.0.6",
"@angularclass/hmr": "2.1.3", "@types/lodash": "4.14.132",
"@types/jasmine": "2.8.14", "@types/node": "8.9.5",
"@types/jasminewd2": "2.0.6", "codelyzer": "5.0.1",
"@types/lodash": "4.14.119", "jasmine-core": "3.4.0",
"@types/node": "8.9.5", "jasmine-spec-reporter": "4.2.1",
"codelyzer": "4.5.0", "karma": "4.1.0",
"jasmine-core": "2.99.1", "karma-chrome-launcher": "2.2.0",
"jasmine-spec-reporter": "4.2.1", "karma-coverage-istanbul-reporter": "2.0.5",
"karma": "3.1.4", "karma-jasmine": "2.0.1",
"karma-chrome-launcher": "2.2.0", "karma-jasmine-html-reporter": "1.4.2",
"karma-coverage-istanbul-reporter": "2.0.4", "protractor": "5.4.2",
"karma-jasmine": "1.1.2", "ts-node": "7.0.1",
"karma-jasmine-html-reporter": "0.2.2", "tslib": "1.9.3",
"protractor": "5.4.2", "tslint": "5.15.0",
"ts-node": "7.0.1", "typescript": "3.4.5",
"tslib": "1.9.3", "webpack-bundle-analyzer": "3.3.2"
"tslint": "5.11.0", }
"typescript": "3.2.2",
"webpack-bundle-analyzer": "3.0.3"
}
} }

18
src/@fuse/animations/index.ts
View File

@ -52,11 +52,9 @@ export const fuseAnimations = [
trigger('fadeInOut', [ trigger('fadeInOut', [
state('0, void', style({ state('0, void', style({
display: 'none',
opacity: 0 opacity: 0
})), })),
state('1, *', style({ state('1, *', style({
display: 'block',
opacity: 1 opacity: 1
})), })),
transition('1 => 0', animate('300ms ease-out')), transition('1 => 0', animate('300ms ease-out')),
@ -66,12 +64,10 @@ export const fuseAnimations = [
trigger('slideInOut', [ trigger('slideInOut', [
state('0', style({ state('0', style({
height : '0px', height: '0px'
display: 'none'
})), })),
state('1', style({ state('1', style({
height : '*', height: '*'
display: 'block'
})), })),
transition('1 => 0', animate('300ms ease-out')), transition('1 => 0', animate('300ms ease-out')),
transition('0 => 1', animate('300ms ease-in')) transition('0 => 1', animate('300ms ease-in'))
@ -121,17 +117,15 @@ export const fuseAnimations = [
}) })
) )
] ]
), )
]), ]),
trigger('slideInLeft', [ trigger('slideInLeft', [
state('void', style({ state('void', style({
transform: 'translateX(-100%)', transform: 'translateX(-100%)',
display : 'none'
})), })),
state('*', style({ state('*', style({
transform: 'translateX(0)', transform: 'translateX(0)',
display : 'flex'
})), })),
transition('void => *', animate('300ms')), transition('void => *', animate('300ms')),
transition('* => void', animate('300ms')) transition('* => void', animate('300ms'))
@ -140,11 +134,9 @@ export const fuseAnimations = [
trigger('slideInRight', [ trigger('slideInRight', [
state('void', style({ state('void', style({
transform: 'translateX(100%)', transform: 'translateX(100%)',
display : 'none'
})), })),
state('*', style({ state('*', style({
transform: 'translateX(0)', transform: 'translateX(0)',
display : 'flex'
})), })),
transition('void => *', animate('300ms')), transition('void => *', animate('300ms')),
transition('* => void', animate('300ms')) transition('* => void', animate('300ms'))
@ -153,11 +145,9 @@ export const fuseAnimations = [
trigger('slideInTop', [ trigger('slideInTop', [
state('void', style({ state('void', style({
transform: 'translateY(-100%)', transform: 'translateY(-100%)',
display : 'none'
})), })),
state('*', style({ state('*', style({
transform: 'translateY(0)', transform: 'translateY(0)',
display : 'flex'
})), })),
transition('void => *', animate('300ms')), transition('void => *', animate('300ms')),
transition('* => void', animate('300ms')) transition('* => void', animate('300ms'))
@ -167,11 +157,9 @@ export const fuseAnimations = [
state('void', state('void',
style({ style({
transform: 'translateY(100%)', transform: 'translateY(100%)',
display : 'none'
})), })),
state('*', style({ state('*', style({
transform: 'translateY(0)', transform: 'translateY(0)',
display : 'flex'
})), })),
transition('void => *', animate('300ms')), transition('void => *', animate('300ms')),
transition('* => void', animate('300ms')) transition('* => void', animate('300ms'))

2
src/@fuse/components/confirm-dialog/confirm-dialog.component.ts
View File

@ -1,5 +1,5 @@
import { Component } from '@angular/core'; import { Component } from '@angular/core';
import { MatDialogRef } from '@angular/material'; import { MatDialogRef } from '@angular/material/dialog';
@Component({ @Component({
selector : 'fuse-confirm-dialog', selector : 'fuse-confirm-dialog',

3
src/@fuse/components/confirm-dialog/confirm-dialog.module.ts
View File

@ -1,5 +1,6 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { MatButtonModule, MatDialogModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatDialogModule } from '@angular/material/dialog';
import { FuseConfirmDialogComponent } from '@fuse/components/confirm-dialog/confirm-dialog.component'; import { FuseConfirmDialogComponent } from '@fuse/components/confirm-dialog/confirm-dialog.component';

3
src/@fuse/components/demo/demo.module.ts
View File

@ -1,7 +1,8 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatDividerModule, MatListModule } from '@angular/material'; import { MatDividerModule } from '@angular/material/divider';
import { MatListModule } from '@angular/material/list';
import { FuseDemoContentComponent } from './demo-content/demo-content.component'; import { FuseDemoContentComponent } from './demo-content/demo-content.component';
import { FuseDemoSidebarComponent } from './demo-sidebar/demo-sidebar.component'; import { FuseDemoSidebarComponent } from './demo-sidebar/demo-sidebar.component';

2
src/@fuse/components/highlight/highlight.component.ts
View File

@ -13,7 +13,7 @@ import '@fuse/components/highlight/prism-languages';
export class FuseHighlightComponent implements OnInit, OnDestroy export class FuseHighlightComponent implements OnInit, OnDestroy
{ {
// Source // Source
@ContentChild('source') @ContentChild('source', {static: true})
source: ElementRef; source: ElementRef;
// Lang // Lang

5
src/@fuse/components/material-color-picker/material-color-picker.module.ts
View File

@ -1,7 +1,10 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { FlexLayoutModule } from '@angular/flex-layout'; import { FlexLayoutModule } from '@angular/flex-layout';
import { MatButtonModule, MatIconModule, MatMenuModule, MatTooltipModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatTooltipModule } from '@angular/material/tooltip';
import { FusePipesModule } from '@fuse/pipes/pipes.module'; import { FusePipesModule } from '@fuse/pipes/pipes.module';

3
src/@fuse/components/navigation/navigation.module.ts
View File

@ -1,7 +1,8 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatIconModule, MatRippleModule } from '@angular/material'; import { MatRippleModule } from '@angular/material/core';
import { MatIconModule } from '@angular/material/icon';
import { TranslateModule } from '@ngx-translate/core'; import { TranslateModule } from '@ngx-translate/core';

4
src/@fuse/components/progress-bar/progress-bar.module.ts
View File

@ -2,7 +2,9 @@ import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatButtonModule, MatIconModule, MatProgressBarModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { MatProgressBarModule } from '@angular/material/progress-bar';
import { FuseProgressBarComponent } from './progress-bar.component'; import { FuseProgressBarComponent } from './progress-bar.component';

3
src/@fuse/components/search-bar/search-bar.module.ts
View File

@ -2,7 +2,8 @@ import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatButtonModule, MatIconModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { FuseSearchBarComponent } from './search-bar.component'; import { FuseSearchBarComponent } from './search-bar.component';

44
src/@fuse/components/shortcuts/shortcuts.component.ts
View File

@ -1,4 +1,4 @@
import { Component, ElementRef, Input, OnDestroy, OnInit, Renderer2, ViewChild } from '@angular/core'; import { AfterViewInit, Component, ElementRef, Input, OnDestroy, OnInit, Renderer2, ViewChild } from '@angular/core';
import { MediaObserver } from '@angular/flex-layout'; import { MediaObserver } from '@angular/flex-layout';
import { CookieService } from 'ngx-cookie-service'; import { CookieService } from 'ngx-cookie-service';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
@ -12,7 +12,7 @@ import { FuseNavigationService } from '@fuse/components/navigation/navigation.se
templateUrl: './shortcuts.component.html', templateUrl: './shortcuts.component.html',
styleUrls : ['./shortcuts.component.scss'] styleUrls : ['./shortcuts.component.scss']
}) })
export class FuseShortcutsComponent implements OnInit, OnDestroy export class FuseShortcutsComponent implements OnInit, AfterViewInit, OnDestroy
{ {
shortcutItems: any[]; shortcutItems: any[];
navigationItems: any[]; navigationItems: any[];
@ -23,10 +23,10 @@ export class FuseShortcutsComponent implements OnInit, OnDestroy
@Input() @Input()
navigation: any; navigation: any;
@ViewChild('searchInput') @ViewChild('searchInput', {static: false})
searchInputField; searchInputField;
@ViewChild('shortcuts') @ViewChild('shortcuts', {static: false})
shortcutsEl: ElementRef; shortcutsEl: ElementRef;
// Private // Private
@ -79,32 +79,36 @@ export class FuseShortcutsComponent implements OnInit, OnDestroy
// User's shortcut items // User's shortcut items
this.shortcutItems = [ this.shortcutItems = [
{ {
'title': 'Calendar', title: 'Calendar',
'type' : 'item', type : 'item',
'icon' : 'today', icon : 'today',
'url' : '/apps/calendar' url : '/apps/calendar'
}, },
{ {
'title': 'Mail', title: 'Mail',
'type' : 'item', type : 'item',
'icon' : 'email', icon : 'email',
'url' : '/apps/mail' url : '/apps/mail'
}, },
{ {
'title': 'Contacts', title: 'Contacts',
'type' : 'item', type : 'item',
'icon' : 'account_box', icon : 'account_box',
'url' : '/apps/contacts' url : '/apps/contacts'
}, },
{ {
'title': 'To-Do', title: 'To-Do',
'type' : 'item', type : 'item',
'icon' : 'check_box', icon : 'check_box',
'url' : '/apps/todo' url : '/apps/todo'
} }
]; ];
} }
}
ngAfterViewInit(): void
{
// Subscribe to media changes // Subscribe to media changes
this._fuseMatchMediaService.onMediaChange this._fuseMatchMediaService.onMediaChange
.pipe(takeUntil(this._unsubscribeAll)) .pipe(takeUntil(this._unsubscribeAll))

9
src/@fuse/components/shortcuts/shortcuts.module.ts
View File

@ -2,7 +2,14 @@ import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { FlexLayoutModule } from '@angular/flex-layout'; import { FlexLayoutModule } from '@angular/flex-layout';
import { MatButtonModule, MatDividerModule, MatFormFieldModule, MatIconModule, MatInputModule, MatListModule, MatMenuModule, MatTooltipModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatDividerModule } from '@angular/material/divider';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatListModule } from '@angular/material/list';
import { MatMenuModule } from '@angular/material/menu';
import { MatTooltipModule } from '@angular/material/tooltip';
import { CookieService } from 'ngx-cookie-service'; import { CookieService } from 'ngx-cookie-service';
import { FuseShortcutsComponent } from './shortcuts.component'; import { FuseShortcutsComponent } from './shortcuts.component';

20
src/@fuse/components/theme-options/theme-options.component.ts
View File

@ -131,17 +131,17 @@ export class FuseThemeOptionsComponent implements OnInit, OnDestroy
// Add customize nav item that opens the bar programmatically // Add customize nav item that opens the bar programmatically
const customFunctionNavItem = { const customFunctionNavItem = {
'id' : 'custom-function', id : 'custom-function',
'title' : 'Custom Function', title : 'Custom Function',
'type' : 'group', type : 'group',
'icon' : 'settings', icon : 'settings',
'children': [ children: [
{ {
'id' : 'customize', id : 'customize',
'title' : 'Customize', title : 'Customize',
'type' : 'item', type : 'item',
'icon' : 'settings', icon : 'settings',
'function': () => { function: () => {
this.toggleSidebarOpen('themeOptionsPanel'); this.toggleSidebarOpen('themeOptionsPanel');
} }
} }

12
src/@fuse/components/theme-options/theme-options.module.ts
View File

@ -2,9 +2,15 @@ import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { FlexLayoutModule } from '@angular/flex-layout'; import { FlexLayoutModule } from '@angular/flex-layout';
import { import { MatButtonModule } from '@angular/material/button';
MatButtonModule, MatCheckboxModule, MatDividerModule, MatFormFieldModule, MatIconModule, MatOptionModule, MatRadioModule, MatSelectModule, MatSlideToggleModule import { MatCheckboxModule } from '@angular/material/checkbox';
} from '@angular/material'; import { MatOptionModule } from '@angular/material/core';
import { MatDividerModule } from '@angular/material/divider';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatRadioModule } from '@angular/material/radio';
import { MatSelectModule } from '@angular/material/select';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { FuseDirectivesModule } from '@fuse/directives/directives'; import { FuseDirectivesModule } from '@fuse/directives/directives';
import { FuseMaterialColorPickerModule } from '@fuse/components/material-color-picker/material-color-picker.module'; import { FuseMaterialColorPickerModule } from '@fuse/components/material-color-picker/material-color-picker.module';

6
src/@fuse/directives/fuse-mat-sidenav/fuse-mat-sidenav.directive.ts
View File

@ -1,5 +1,5 @@
import { Directive, Input, OnInit, HostListener, OnDestroy, HostBinding } from '@angular/core'; import { Directive, Input, OnInit, HostListener, OnDestroy, HostBinding } from '@angular/core';
import { MatSidenav } from '@angular/material'; import { MatSidenav } from '@angular/material/sidenav';
import { MediaObserver } from '@angular/flex-layout'; import { MediaObserver } from '@angular/flex-layout';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
@ -58,7 +58,7 @@ export class FuseMatSidenavHelperDirective implements OnInit, OnDestroy
// Register the sidenav to the service // Register the sidenav to the service
this._fuseMatSidenavHelperService.setSidenav(this.fuseMatSidenavHelper, this._matSidenav); this._fuseMatSidenavHelperService.setSidenav(this.fuseMatSidenavHelper, this._matSidenav);
if ( this._mediaObserver.isActive(this.matIsLockedOpen) ) if ( this.matIsLockedOpen && this._mediaObserver.isActive(this.matIsLockedOpen) )
{ {
this.isLockedOpen = true; this.isLockedOpen = true;
this._matSidenav.mode = 'side'; this._matSidenav.mode = 'side';
@ -74,7 +74,7 @@ export class FuseMatSidenavHelperDirective implements OnInit, OnDestroy
this._fuseMatchMediaService.onMediaChange this._fuseMatchMediaService.onMediaChange
.pipe(takeUntil(this._unsubscribeAll)) .pipe(takeUntil(this._unsubscribeAll))
.subscribe(() => { .subscribe(() => {
if ( this._mediaObserver.isActive(this.matIsLockedOpen) ) if ( this.matIsLockedOpen && this._mediaObserver.isActive(this.matIsLockedOpen) )
{ {
this.isLockedOpen = true; this.isLockedOpen = true;
this._matSidenav.mode = 'side'; this._matSidenav.mode = 'side';

2
src/@fuse/directives/fuse-mat-sidenav/fuse-mat-sidenav.service.ts
View File

@ -1,5 +1,5 @@
import { Injectable } from '@angular/core'; import { Injectable } from '@angular/core';
import { MatSidenav } from '@angular/material'; import { MatSidenav } from '@angular/material/sidenav';
@Injectable({ @Injectable({
providedIn: 'root' providedIn: 'root'

182
src/@fuse/directives/fuse-perfect-scrollbar/fuse-perfect-scrollbar.directive.ts
View File

@ -1,23 +1,24 @@
import { AfterViewInit, Directive, ElementRef, HostListener, Input, OnDestroy } from '@angular/core'; import { AfterViewInit, Directive, ElementRef, HostListener, Input, OnDestroy, OnInit } from '@angular/core';
import { NavigationEnd, Router } from '@angular/router'; import { NavigationEnd, Router } from '@angular/router';
import { Platform } from '@angular/cdk/platform'; import { Platform } from '@angular/cdk/platform';
import { Subject } from 'rxjs'; import { fromEvent, Subject } from 'rxjs';
import { filter, takeUntil } from 'rxjs/operators'; import { debounceTime, filter, takeUntil } from 'rxjs/operators';
import PerfectScrollbar from 'perfect-scrollbar'; import PerfectScrollbar from 'perfect-scrollbar';
import * as _ from 'lodash'; import * as _ from 'lodash';
import { FusePerfectScrollbarGeometry, FusePerfectScrollbarPosition } from '@fuse/directives/fuse-perfect-scrollbar/fuse-perfect-scrollbar.interfaces';
import { FuseConfigService } from '@fuse/services/config.service'; import { FuseConfigService } from '@fuse/services/config.service';
@Directive({ @Directive({
selector: '[fusePerfectScrollbar]' selector: '[fusePerfectScrollbar]'
}) })
export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy export class FusePerfectScrollbarDirective implements OnInit, AfterViewInit, OnDestroy
{ {
isInitialized: boolean; isInitialized: boolean;
isMobile: boolean; isMobile: boolean;
ps: PerfectScrollbar | any; ps: PerfectScrollbar | any;
// Private // Private
private _animation: number | null;
private _enabled: boolean | ''; private _enabled: boolean | '';
private _debouncedUpdate: any; private _debouncedUpdate: any;
private _options: any; private _options: any;
@ -43,6 +44,7 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
this.isMobile = false; this.isMobile = false;
// Set the private defaults // Set the private defaults
this._animation = null;
this._enabled = false; this._enabled = false;
this._debouncedUpdate = _.debounce(this.update, 150); this._debouncedUpdate = _.debounce(this.update, 150);
this._options = { this._options = {
@ -65,6 +67,15 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
{ {
// Merge the options // Merge the options
this._options = _.merge({}, this._options, value); this._options = _.merge({}, this._options, value);
// Destroy and re-init the PerfectScrollbar to update its options
setTimeout(() => {
this._destroy();
});
setTimeout(() => {
this._init();
});
} }
get fusePerfectScrollbarOptions(): any get fusePerfectScrollbarOptions(): any
@ -120,6 +131,24 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
// @ Lifecycle hooks // @ Lifecycle hooks
// ----------------------------------------------------------------------------------------------------- // -----------------------------------------------------------------------------------------------------
/**
* On init
*/
ngOnInit(): void
{
// Subscribe to window resize event
fromEvent(window, 'resize')
.pipe(
takeUntil(this._unsubscribeAll),
debounceTime(150)
)
.subscribe(() => {
// Update the PerfectScrollbar
this.update();
});
}
/** /**
* After view init * After view init
*/ */
@ -292,6 +321,71 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
this.ngOnDestroy(); this.ngOnDestroy();
} }
/**
* Returns the geometry of the scrollable element
*
* @param prefix
*/
geometry(prefix: string = 'scroll'): FusePerfectScrollbarGeometry
{
return new FusePerfectScrollbarGeometry(
this.elementRef.nativeElement[prefix + 'Left'],
this.elementRef.nativeElement[prefix + 'Top'],
this.elementRef.nativeElement[prefix + 'Width'],
this.elementRef.nativeElement[prefix + 'Height']
);
}
/**
* Returns the position of the scrollable element
*
* @param absolute
*/
position(absolute: boolean = false): FusePerfectScrollbarPosition
{
if ( !absolute && this.ps )
{
return new FusePerfectScrollbarPosition(
this.ps.reach.x || 0,
this.ps.reach.y || 0
);
}
else
{
return new FusePerfectScrollbarPosition(
this.elementRef.nativeElement.scrollLeft,
this.elementRef.nativeElement.scrollTop
);
}
}
/**
* Scroll to
*
* @param x
* @param y
* @param speed
*/
scrollTo(x: number, y?: number, speed?: number): void
{
if ( y == null && speed == null )
{
this.animateScrolling('scrollTop', x, speed);
}
else
{
if ( x != null )
{
this.animateScrolling('scrollLeft', x, speed);
}
if ( y != null )
{
this.animateScrolling('scrollTop', y, speed);
}
}
}
/** /**
* Scroll to X * Scroll to X
* *
@ -344,9 +438,8 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
*/ */
scrollToRight(offset?: number, speed?: number): void scrollToRight(offset?: number, speed?: number): void
{ {
const width = this.elementRef.nativeElement.scrollWidth; const left = this.elementRef.nativeElement.scrollWidth - this.elementRef.nativeElement.clientWidth;
this.animateScrolling('scrollLeft', left - (offset || 0), speed);
this.animateScrolling('scrollLeft', width - (offset || 0), speed);
} }
/** /**
@ -357,27 +450,64 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
*/ */
scrollToBottom(offset?: number, speed?: number): void scrollToBottom(offset?: number, speed?: number): void
{ {
const height = this.elementRef.nativeElement.scrollHeight; const top = this.elementRef.nativeElement.scrollHeight - this.elementRef.nativeElement.clientHeight;
this.animateScrolling('scrollTop', top - (offset || 0), speed);
}
this.animateScrolling('scrollTop', height - (offset || 0), speed); /**
* Scroll to element
*
* @param qs
* @param offset
* @param speed
*/
scrollToElement(qs: string, offset?: number, speed?: number): void
{
const element = this.elementRef.nativeElement.querySelector(qs);
if ( !element )
{
return;
}
const elementPos = element.getBoundingClientRect();
const scrollerPos = this.elementRef.nativeElement.getBoundingClientRect();
if ( this.elementRef.nativeElement.classList.contains('ps--active-x') )
{
const currentPos = this.elementRef.nativeElement['scrollLeft'];
const position = elementPos.left - scrollerPos.left + currentPos;
this.animateScrolling('scrollLeft', position + (offset || 0), speed);
}
if ( this.elementRef.nativeElement.classList.contains('ps--active-y') )
{
const currentPos = this.elementRef.nativeElement['scrollTop'];
const position = elementPos.top - scrollerPos.top + currentPos;
this.animateScrolling('scrollTop', position + (offset || 0), speed);
}
} }
/** /**
* Animate scrolling * Animate scrolling
* *
* @param {string} target * @param target
* @param {number} value * @param value
* @param {number} speed * @param speed
*/ */
animateScrolling(target: string, value: number, speed?: number): void animateScrolling(target: string, value: number, speed?: number): void
{ {
if ( !speed ) if ( this._animation )
{
window.cancelAnimationFrame(this._animation);
this._animation = null;
}
if ( !speed || typeof window === 'undefined' )
{ {
this.elementRef.nativeElement[target] = value; this.elementRef.nativeElement[target] = value;
// PS has weird event sending order, this is a workaround for that
this.update();
this.update();
} }
else if ( value !== this.elementRef.nativeElement[target] ) else if ( value !== this.elementRef.nativeElement[target] )
{ {
@ -389,9 +519,8 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
const cosParameter = (oldValue - value) / 2; const cosParameter = (oldValue - value) / 2;
const step = (newTimestamp) => { const step = (newTimestamp: number) => {
scrollCount += Math.PI / (speed / (newTimestamp - oldTimestamp)); scrollCount += Math.PI / (speed / (newTimestamp - oldTimestamp));
newValue = Math.round(value + cosParameter + cosParameter * Math.cos(scrollCount)); newValue = Math.round(value + cosParameter + cosParameter * Math.cos(scrollCount));
// Only continue animation if scroll position has not changed // Only continue animation if scroll position has not changed
@ -399,20 +528,17 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
{ {
if ( scrollCount >= Math.PI ) if ( scrollCount >= Math.PI )
{ {
this.elementRef.nativeElement[target] = value; this.animateScrolling(target, value, 0);
// PS has weird event sending order, this is a workaround for that
this.update();
this.update();
} }
else else
{ {
this.elementRef.nativeElement[target] = oldValue = newValue; this.elementRef.nativeElement[target] = newValue;
// On a zoomed out page the resulting offset may differ
oldValue = this.elementRef.nativeElement[target];
oldTimestamp = newTimestamp; oldTimestamp = newTimestamp;
window.requestAnimationFrame(step); this._animation = window.requestAnimationFrame(step);
} }
} }
}; };

28
src/@fuse/directives/fuse-perfect-scrollbar/fuse-perfect-scrollbar.interfaces.ts Normal file
View File

@ -0,0 +1,28 @@
export class FusePerfectScrollbarGeometry
{
public x: number;
public y: number;
public w: number;
public h: number;
constructor(x: number, y: number, w: number, h: number)
{
this.x = x;
this.y = y;
this.w = w;
this.h = h;
}
}
export class FusePerfectScrollbarPosition
{
public x: number | 'start' | 'end';
public y: number | 'start' | 'end';
constructor(x: number | 'start' | 'end', y: number | 'start' | 'end')
{
this.x = x;
this.y = y;
}
}

38
src/@fuse/scss/partials/_colors.scss
View File

@ -47,25 +47,25 @@
// @ Material colors map // @ Material colors map
// ----------------------------------------------------------------------------------------------------- // -----------------------------------------------------------------------------------------------------
$matPalettes: ( $matPalettes: (
red: $mat-red, 'red': $mat-red,
pink: $mat-pink, 'pink': $mat-pink,
purple: $mat-purple, 'purple': $mat-purple,
deep-purple: $mat-deep-purple, 'deep-purple': $mat-deep-purple,
indigo: $mat-indigo, 'indigo': $mat-indigo,
blue: $mat-blue, 'blue': $mat-blue,
light-blue: $mat-light-blue, 'light-blue': $mat-light-blue,
cyan: $mat-cyan, 'cyan': $mat-cyan,
teal: $mat-teal, 'teal': $mat-teal,
green: $mat-green, 'green': $mat-green,
light-green: $mat-light-green, 'light-green': $mat-light-green,
lime: $mat-lime, 'lime': $mat-lime,
yellow: $mat-yellow, 'yellow': $mat-yellow,
amber: $mat-amber, 'amber': $mat-amber,
orange: $mat-orange, 'orange': $mat-orange,
deep-orange: $mat-deep-orange, 'deep-orange': $mat-deep-orange,
brown: $mat-brown, 'brown': $mat-brown,
grey: $mat-grey, 'grey': $mat-grey,
blue-grey: $mat-blue-grey 'blue-grey': $mat-blue-grey
); );
// Material color hues list // Material color hues list

3
src/app/app.module.ts
View File

@ -4,7 +4,8 @@ import { HttpClientModule } from '@angular/common/http';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { RouterModule, Routes } from '@angular/router'; import { RouterModule, Routes } from '@angular/router';
import { MatMomentDateModule } from '@angular/material-moment-adapter'; import { MatMomentDateModule } from '@angular/material-moment-adapter';
import { MatButtonModule, MatIconModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { InMemoryWebApiModule } from 'angular-in-memory-web-api'; import { InMemoryWebApiModule } from 'angular-in-memory-web-api';
import { TranslateModule } from '@ngx-translate/core'; import { TranslateModule } from '@ngx-translate/core';
import 'hammerjs'; import 'hammerjs';

16
src/app/layout/components/chat-panel/chat-panel.component.ts
View File

@ -23,25 +23,17 @@ export class ChatPanelComponent implements OnInit, AfterViewInit, OnDestroy
sidebarFolded: boolean; sidebarFolded: boolean;
user: any; user: any;
@ViewChild('replyForm') @ViewChild('replyForm', {static: false})
set replyForm(content: NgForm) private _replyForm: NgForm;
{
this._replyForm = content;
}
@ViewChild('replyInput') @ViewChild('replyInput', {static: false})
set replyInput(content: ElementRef) private _replyInput: ElementRef;
{
this._replyInput = content;
}
@ViewChildren(FusePerfectScrollbarDirective) @ViewChildren(FusePerfectScrollbarDirective)
private _fusePerfectScrollbarDirectives: QueryList<FusePerfectScrollbarDirective>; private _fusePerfectScrollbarDirectives: QueryList<FusePerfectScrollbarDirective>;
// Private // Private
private _chatViewScrollbar: FusePerfectScrollbarDirective; private _chatViewScrollbar: FusePerfectScrollbarDirective;
private _replyForm: NgForm;
private _replyInput: ElementRef;
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<any>;
/** /**

8
src/app/layout/components/chat-panel/chat-panel.module.ts
View File

@ -1,5 +1,11 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { MatButtonModule, MatFormFieldModule, MatIconModule, MatInputModule, MatRippleModule, MatTabsModule, MatTooltipModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatRippleModule } from '@angular/material/core';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatTabsModule } from '@angular/material/tabs';
import { MatTooltipModule } from '@angular/material/tooltip';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

4
src/app/layout/components/footer/footer.module.ts
View File

@ -1,6 +1,8 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatButtonModule, MatIconModule, MatToolbarModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { MatToolbarModule } from '@angular/material/toolbar';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

3
src/app/layout/components/navbar/horizontal/style-1/style-1.module.ts
View File

@ -1,5 +1,6 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { MatButtonModule, MatIconModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { FuseNavigationModule } from '@fuse/components'; import { FuseNavigationModule } from '@fuse/components';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

13
src/app/layout/components/navbar/vertical/style-1/style-1.component.ts
View File

@ -47,7 +47,7 @@ export class NavbarVerticalStyle1Component implements OnInit, OnDestroy
// ----------------------------------------------------------------------------------------------------- // -----------------------------------------------------------------------------------------------------
// Directive // Directive
@ViewChild(FusePerfectScrollbarDirective) @ViewChild(FusePerfectScrollbarDirective, {static: true})
set directive(theDirective: FusePerfectScrollbarDirective) set directive(theDirective: FusePerfectScrollbarDirective)
{ {
if ( !theDirective ) if ( !theDirective )
@ -75,16 +75,7 @@ export class NavbarVerticalStyle1Component implements OnInit, OnDestroy
) )
.subscribe(() => { .subscribe(() => {
setTimeout(() => { setTimeout(() => {
const activeNavItem: any = document.querySelector('navbar .nav-link.active'); this._fusePerfectScrollbar.scrollToElement('navbar .nav-link.active', -120);
if ( activeNavItem )
{
const activeItemOffsetTop = activeNavItem.offsetTop,
activeItemOffsetParentTop = activeNavItem.offsetParent.offsetTop,
scrollDistance = activeItemOffsetTop - activeItemOffsetParentTop - (48 * 3) - 168;
this._fusePerfectScrollbar.scrollToTop(scrollDistance);
}
}); });
} }
); );

3
src/app/layout/components/navbar/vertical/style-1/style-1.module.ts
View File

@ -1,5 +1,6 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { MatButtonModule, MatIconModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { FuseNavigationModule } from '@fuse/components'; import { FuseNavigationModule } from '@fuse/components';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

13
src/app/layout/components/navbar/vertical/style-2/style-2.component.ts
View File

@ -47,7 +47,7 @@ export class NavbarVerticalStyle2Component implements OnInit, OnDestroy
// ----------------------------------------------------------------------------------------------------- // -----------------------------------------------------------------------------------------------------
// Directive // Directive
@ViewChild(FusePerfectScrollbarDirective) @ViewChild(FusePerfectScrollbarDirective, {static: true})
set directive(theDirective: FusePerfectScrollbarDirective) set directive(theDirective: FusePerfectScrollbarDirective)
{ {
if ( !theDirective ) if ( !theDirective )
@ -75,16 +75,7 @@ export class NavbarVerticalStyle2Component implements OnInit, OnDestroy
) )
.subscribe(() => { .subscribe(() => {
setTimeout(() => { setTimeout(() => {
const activeNavItem: any = document.querySelector('navbar .nav-link.active'); this._fusePerfectScrollbar.scrollToElement('navbar .nav-link.active', -120);
if ( activeNavItem )
{
const activeItemOffsetTop = activeNavItem.offsetTop,
activeItemOffsetParentTop = activeNavItem.offsetParent.offsetTop,
scrollDistance = activeItemOffsetTop - activeItemOffsetParentTop - (48 * 3);
this._fusePerfectScrollbar.scrollToTop(scrollDistance);
}
}); });
} }
); );

3
src/app/layout/components/navbar/vertical/style-2/style-2.module.ts
View File

@ -1,5 +1,6 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { MatButtonModule, MatIconModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { FuseNavigationModule } from '@fuse/components'; import { FuseNavigationModule } from '@fuse/components';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

4
src/app/layout/components/quick-panel/quick-panel.module.ts
View File

@ -1,5 +1,7 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { MatDividerModule, MatListModule, MatSlideToggleModule } from '@angular/material'; import { MatDividerModule } from '@angular/material/divider';
import { MatListModule } from '@angular/material/list';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

32
src/app/layout/components/toolbar/toolbar.component.ts
View File

@ -45,29 +45,29 @@ export class ToolbarComponent implements OnInit, OnDestroy
// Set the defaults // Set the defaults
this.userStatusOptions = [ this.userStatusOptions = [
{ {
'title': 'Online', title: 'Online',
'icon' : 'icon-checkbox-marked-circle', icon : 'icon-checkbox-marked-circle',
'color': '#4CAF50' color: '#4CAF50'
}, },
{ {
'title': 'Away', title: 'Away',
'icon' : 'icon-clock', icon : 'icon-clock',
'color': '#FFC107' color: '#FFC107'
}, },
{ {
'title': 'Do not Disturb', title: 'Do not Disturb',
'icon' : 'icon-minus-circle', icon : 'icon-minus-circle',
'color': '#F44336' color: '#F44336'
}, },
{ {
'title': 'Invisible', title: 'Invisible',
'icon' : 'icon-checkbox-blank-circle-outline', icon : 'icon-checkbox-blank-circle-outline',
'color': '#BDBDBD' color: '#BDBDBD'
}, },
{ {
'title': 'Offline', title: 'Offline',
'icon' : 'icon-checkbox-blank-circle-outline', icon : 'icon-checkbox-blank-circle-outline',
'color': '#616161' color: '#616161'
} }
]; ];
@ -109,7 +109,7 @@ export class ToolbarComponent implements OnInit, OnDestroy
}); });
// Set the selected language from default languages // Set the selected language from default languages
this.selectedLanguage = _.find(this.languages, {'id': this._translateService.currentLang}); this.selectedLanguage = _.find(this.languages, {id: this._translateService.currentLang});
} }
/** /**

5
src/app/layout/components/toolbar/toolbar.module.ts
View File

@ -1,6 +1,9 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatButtonModule, MatIconModule, MatMenuModule, MatToolbarModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { FuseSearchBarModule, FuseShortcutsModule } from '@fuse/components'; import { FuseSearchBarModule, FuseShortcutsModule } from '@fuse/components';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

2
src/app/layout/horizontal/layout-1/layout-1.module.ts
View File

@ -1,5 +1,5 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { MatSidenavModule } from '@angular/material'; import { MatSidenavModule } from '@angular/material/sidenav';
import { FuseSidebarModule, FuseThemeOptionsModule } from '@fuse/components'; import { FuseSidebarModule, FuseThemeOptionsModule } from '@fuse/components';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

4
src/app/main/angular-material-elements/example-viewer/example-viewer.ts
View File

@ -1,5 +1,5 @@
import { AfterViewInit, Component, ComponentFactoryResolver, ComponentRef, Input, OnDestroy, ViewChild, ViewContainerRef, ViewEncapsulation } from '@angular/core'; import { AfterViewInit, Component, ComponentFactoryResolver, ComponentRef, Input, OnDestroy, ViewChild, ViewContainerRef, ViewEncapsulation } from '@angular/core';
import { MatSnackBar } from '@angular/material'; import { MatSnackBar } from '@angular/material/snack-bar';
import 'prismjs/components/prism-scss'; import 'prismjs/components/prism-scss';
import 'prismjs/components/prism-typescript'; import 'prismjs/components/prism-typescript';
@ -31,7 +31,7 @@ export class ExampleViewerComponent implements AfterViewInit, OnDestroy
previewRef: ComponentRef<any>; previewRef: ComponentRef<any>;
selectedIndex: number; selectedIndex: number;
@ViewChild('previewContainer', {read: ViewContainerRef}) @ViewChild('previewContainer', {read: ViewContainerRef, static: false})
private _previewContainer: ViewContainerRef; private _previewContainer: ViewContainerRef;
/** /**

44
src/app/main/angular-material-elements/material.module.ts
View File

@ -1,14 +1,40 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { import { MatAutocompleteModule } from '@angular/material/autocomplete';
MatAutocompleteModule, MatBadgeModule, MatBottomSheetModule, MatButtonModule, import { MatBadgeModule } from '@angular/material/badge';
MatButtonToggleModule, MatCardModule, MatCheckboxModule, MatChipsModule, MatDatepickerModule, import { MatBottomSheetModule } from '@angular/material/bottom-sheet';
MatDialogModule, MatDividerModule, MatExpansionModule, MatFormFieldModule, MatGridListModule, import { MatButtonModule } from '@angular/material/button';
MatIconModule, MatInputModule, MatListModule, MatMenuModule, MatPaginatorModule, import { MatButtonToggleModule } from '@angular/material/button-toggle';
MatProgressBarModule, MatProgressSpinnerModule, MatRadioModule, MatRippleModule, MatSelectModule, import { MatCardModule } from '@angular/material/card';
MatSidenavModule, MatSliderModule, MatSlideToggleModule, MatSnackBarModule, MatSortModule, import { MatCheckboxModule } from '@angular/material/checkbox';
MatStepperModule, MatTableModule, MatTabsModule, MatToolbarModule, MatTooltipModule, MatTreeModule import { MatChipsModule } from '@angular/material/chips';
} from '@angular/material'; import { MatRippleModule } from '@angular/material/core';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatDialogModule } from '@angular/material/dialog';
import { MatDividerModule } from '@angular/material/divider';
import { MatExpansionModule } from '@angular/material/expansion';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatGridListModule } from '@angular/material/grid-list';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatListModule } from '@angular/material/list';
import { MatMenuModule } from '@angular/material/menu';
import { MatPaginatorModule } from '@angular/material/paginator';
import { MatProgressBarModule } from '@angular/material/progress-bar';
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { MatRadioModule } from '@angular/material/radio';
import { MatSelectModule } from '@angular/material/select';
import { MatSidenavModule } from '@angular/material/sidenav';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { MatSliderModule } from '@angular/material/slider';
import { MatSnackBarModule } from '@angular/material/snack-bar';
import { MatSortModule } from '@angular/material/sort';
import { MatStepperModule } from '@angular/material/stepper';
import { MatTableModule } from '@angular/material/table';
import { MatTabsModule } from '@angular/material/tabs';
import { MatToolbarModule } from '@angular/material/toolbar';
import { MatTooltipModule } from '@angular/material/tooltip';
import { MatTreeModule } from '@angular/material/tree';
import { MatMomentDateModule } from '@angular/material-moment-adapter'; import { MatMomentDateModule } from '@angular/material-moment-adapter';
@NgModule({ @NgModule({

6
src/app/main/apps/academy/academy.module.ts
View File

@ -1,7 +1,11 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatButtonModule, MatFormFieldModule, MatIconModule, MatInputModule, MatSelectModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatSelectModule } from '@angular/material/select';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

2
src/app/main/apps/calendar/calendar.component.ts
View File

@ -1,6 +1,6 @@
import { Component, OnInit, ViewEncapsulation } from '@angular/core'; import { Component, OnInit, ViewEncapsulation } from '@angular/core';
import { FormGroup } from '@angular/forms'; import { FormGroup } from '@angular/forms';
import { MatDialog, MatDialogRef } from '@angular/material'; import { MatDialog, MatDialogRef } from '@angular/material/dialog';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { startOfDay, isSameDay, isSameMonth } from 'date-fns'; import { startOfDay, isSameDay, isSameMonth } from 'date-fns';
import { CalendarEvent, CalendarEventAction, CalendarEventTimesChangedEvent, CalendarMonthViewDay } from 'angular-calendar'; import { CalendarEvent, CalendarEventAction, CalendarEventTimesChangedEvent, CalendarMonthViewDay } from 'angular-calendar';

12
src/app/main/apps/calendar/calendar.module.ts
View File

@ -1,8 +1,14 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router'; import { RouterModule, Routes } from '@angular/router';
import { import { MatButtonModule } from '@angular/material/button';
MatButtonModule, MatDatepickerModule, MatDialogModule, MatFormFieldModule, MatIconModule, MatInputModule, MatSlideToggleModule, MatToolbarModule, MatTooltipModule import { MatDatepickerModule } from '@angular/material/datepicker';
} from '@angular/material'; import { MatDialogModule } from '@angular/material/dialog';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { MatToolbarModule } from '@angular/material/toolbar';
import { MatTooltipModule } from '@angular/material/tooltip';
import { ColorPickerModule } from 'ngx-color-picker'; import { ColorPickerModule } from 'ngx-color-picker';
import { CalendarModule as AngularCalendarModule, DateAdapter } from 'angular-calendar'; import { CalendarModule as AngularCalendarModule, DateAdapter } from 'angular-calendar';
import { adapterFactory } from 'angular-calendar/date-adapters/date-fns'; import { adapterFactory } from 'angular-calendar/date-adapters/date-fns';

2
src/app/main/apps/calendar/event-form/event-form.component.ts
View File

@ -1,6 +1,6 @@
import { Component, Inject, ViewEncapsulation } from '@angular/core'; import { Component, Inject, ViewEncapsulation } from '@angular/core';
import { FormBuilder, FormControl, FormGroup } from '@angular/forms'; import { FormBuilder, FormControl, FormGroup } from '@angular/forms';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
import { CalendarEvent } from 'angular-calendar'; import { CalendarEvent } from 'angular-calendar';
import { MatColors } from '@fuse/mat-colors'; import { MatColors } from '@fuse/mat-colors';

4
src/app/main/apps/chat/chat-view/chat-view.component.ts
View File

@ -22,13 +22,13 @@ export class ChatViewComponent implements OnInit, OnDestroy, AfterViewInit
replyInput: any; replyInput: any;
selectedChat: any; selectedChat: any;
@ViewChild(FusePerfectScrollbarDirective) @ViewChild(FusePerfectScrollbarDirective, {static: false})
directiveScroll: FusePerfectScrollbarDirective; directiveScroll: FusePerfectScrollbarDirective;
@ViewChildren('replyInput') @ViewChildren('replyInput')
replyInputField; replyInputField;
@ViewChild('replyForm') @ViewChild('replyForm', {static: false})
replyForm: NgForm; replyForm: NgForm;
// Private // Private

13
src/app/main/apps/chat/chat.module.ts
View File

@ -1,9 +1,16 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router'; import { RouterModule, Routes } from '@angular/router';
import { import { MatButtonModule } from '@angular/material/button';
MatButtonModule, MatCardModule, MatFormFieldModule, MatIconModule, MatInputModule, MatListModule, MatMenuModule, MatRadioModule, MatSidenavModule, MatToolbarModule import { MatCardModule } from '@angular/material/card';
} from '@angular/material'; import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatListModule } from '@angular/material/list';
import { MatMenuModule } from '@angular/material/menu';
import { MatRadioModule } from '@angular/material/radio';
import { MatSidenavModule } from '@angular/material/sidenav';
import { MatToolbarModule } from '@angular/material/toolbar';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

2
src/app/main/apps/contacts/contact-form/contact-form.component.ts
View File

@ -1,6 +1,6 @@
import { Component, Inject, ViewEncapsulation } from '@angular/core'; import { Component, Inject, ViewEncapsulation } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms'; import { FormBuilder, FormGroup } from '@angular/forms';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
import { Contact } from 'app/main/apps/contacts/contact.model'; import { Contact } from 'app/main/apps/contacts/contact.model';

4
src/app/main/apps/contacts/contact-list/contact-list.component.ts
View File

@ -1,6 +1,6 @@
import { Component, OnDestroy, OnInit, TemplateRef, ViewChild, ViewEncapsulation } from '@angular/core'; import { Component, OnDestroy, OnInit, TemplateRef, ViewChild, ViewEncapsulation } from '@angular/core';
import { FormGroup } from '@angular/forms'; import { FormGroup } from '@angular/forms';
import { MatDialog, MatDialogRef } from '@angular/material'; import { MatDialog, MatDialogRef } from '@angular/material/dialog';
import { DataSource } from '@angular/cdk/collections'; import { DataSource } from '@angular/cdk/collections';
import { Observable, Subject } from 'rxjs'; import { Observable, Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
@ -20,7 +20,7 @@ import { ContactsContactFormDialogComponent } from 'app/main/apps/contacts/conta
}) })
export class ContactsContactListComponent implements OnInit, OnDestroy export class ContactsContactListComponent implements OnInit, OnDestroy
{ {
@ViewChild('dialogContent') @ViewChild('dialogContent', {static: false})
dialogContent: TemplateRef<any>; dialogContent: TemplateRef<any>;
contacts: any; contacts: any;

2
src/app/main/apps/contacts/contacts.component.ts
View File

@ -1,6 +1,6 @@
import { Component, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core'; import { Component, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core';
import { FormControl, FormGroup } from '@angular/forms'; import { FormControl, FormGroup } from '@angular/forms';
import { MatDialog } from '@angular/material'; import { MatDialog } from '@angular/material/dialog';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { debounceTime, distinctUntilChanged, takeUntil } from 'rxjs/operators'; import { debounceTime, distinctUntilChanged, takeUntil } from 'rxjs/operators';

13
src/app/main/apps/contacts/contacts.module.ts
View File

@ -1,8 +1,15 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router'; import { RouterModule, Routes } from '@angular/router';
import { import { MatButtonModule } from '@angular/material/button';
MatButtonModule, MatCheckboxModule, MatDatepickerModule, MatFormFieldModule, MatIconModule, MatInputModule, MatMenuModule, MatRippleModule, MatTableModule, MatToolbarModule import { MatCheckboxModule } from '@angular/material/checkbox';
} from '@angular/material'; import { MatRippleModule } from '@angular/material/core';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatMenuModule } from '@angular/material/menu';
import { MatTableModule } from '@angular/material/table';
import { MatToolbarModule } from '@angular/material/toolbar';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';
import { FuseConfirmDialogModule, FuseSidebarModule } from '@fuse/components'; import { FuseConfirmDialogModule, FuseSidebarModule } from '@fuse/components';

2
src/app/main/apps/contacts/selected-bar/selected-bar.component.ts
View File

@ -1,5 +1,5 @@
import { Component, OnDestroy, OnInit } from '@angular/core'; import { Component, OnDestroy, OnInit } from '@angular/core';
import { MatDialog, MatDialogRef } from '@angular/material'; import { MatDialog, MatDialogRef } from '@angular/material/dialog';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';

10
src/app/main/apps/dashboards/analytics/analytics.component.ts
View File

@ -52,8 +52,8 @@ export class AnalyticsDashboardComponent implements OnInit
*/ */
private _registerCustomChartJSPlugin(): void private _registerCustomChartJSPlugin(): void
{ {
(<any>window).Chart.plugins.register({ (window as any).Chart.plugins.register({
afterDatasetsDraw: function (chart, easing): any { afterDatasetsDraw: function(chart, easing): any {
// Only activate the plugin if it's made available // Only activate the plugin if it's made available
// in the options // in the options
if ( if (
@ -67,18 +67,18 @@ export class AnalyticsDashboardComponent implements OnInit
// To only draw at the end of animation, check for easing === 1 // To only draw at the end of animation, check for easing === 1
const ctx = chart.ctx; const ctx = chart.ctx;
chart.data.datasets.forEach(function (dataset, i): any { chart.data.datasets.forEach(function(dataset, i): any {
const meta = chart.getDatasetMeta(i); const meta = chart.getDatasetMeta(i);
if ( !meta.hidden ) if ( !meta.hidden )
{ {
meta.data.forEach(function (element, index): any { meta.data.forEach(function(element, index): any {
// Draw the text in black, with the specified font // Draw the text in black, with the specified font
ctx.fillStyle = 'rgba(255, 255, 255, 0.7)'; ctx.fillStyle = 'rgba(255, 255, 255, 0.7)';
const fontSize = 13; const fontSize = 13;
const fontStyle = 'normal'; const fontStyle = 'normal';
const fontFamily = 'Roboto, Helvetica Neue, Arial'; const fontFamily = 'Roboto, Helvetica Neue, Arial';
ctx.font = (<any>window).Chart.helpers.fontString(fontSize, fontStyle, fontFamily); ctx.font = (window as any).Chart.helpers.fontString(fontSize, fontStyle, fontFamily);
// Just naively convert to string for now // Just naively convert to string for now
const dataString = dataset.data[index].toString() + 'k'; const dataString = dataset.data[index].toString() + 'k';

7
src/app/main/apps/dashboards/analytics/analytics.module.ts
View File

@ -1,6 +1,11 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router'; import { RouterModule, Routes } from '@angular/router';
import { MatButtonModule, MatFormFieldModule, MatIconModule, MatMenuModule, MatSelectModule, MatTabsModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatSelectModule } from '@angular/material/select';
import { MatTabsModule } from '@angular/material/tabs';
import { AgmCoreModule } from '@agm/core'; import { AgmCoreModule } from '@agm/core';
import { ChartsModule } from 'ng2-charts'; import { ChartsModule } from 'ng2-charts';
import { NgxChartsModule } from '@swimlane/ngx-charts'; import { NgxChartsModule } from '@swimlane/ngx-charts';

9
src/app/main/apps/dashboards/project/project.module.ts
View File

@ -1,6 +1,13 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router'; import { RouterModule, Routes } from '@angular/router';
import { MatButtonModule, MatDividerModule, MatFormFieldModule, MatIconModule, MatMenuModule, MatSelectModule, MatTableModule, MatTabsModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatDividerModule } from '@angular/material/divider';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatSelectModule } from '@angular/material/select';
import { MatTableModule } from '@angular/material/table';
import { MatTabsModule } from '@angular/material/tabs';
import { NgxChartsModule } from '@swimlane/ngx-charts'; import { NgxChartsModule } from '@swimlane/ngx-charts';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

18
src/app/main/apps/e-commerce/e-commerce.module.ts
View File

@ -1,10 +1,18 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router'; import { RouterModule, Routes } from '@angular/router';
import { import { MatButtonModule } from '@angular/material/button';
MatButtonModule, MatChipsModule, MatExpansionModule, MatFormFieldModule, MatIconModule, MatInputModule, MatPaginatorModule, MatRippleModule, MatSelectModule, MatSnackBarModule, import { MatChipsModule } from '@angular/material/chips';
MatSortModule, import { MatRippleModule } from '@angular/material/core';
MatTableModule, MatTabsModule import { MatExpansionModule } from '@angular/material/expansion';
} from '@angular/material'; import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatPaginatorModule } from '@angular/material/paginator';
import { MatSelectModule } from '@angular/material/select';
import { MatSnackBarModule } from '@angular/material/snack-bar';
import { MatSortModule } from '@angular/material/sort';
import { MatTableModule } from '@angular/material/table';
import { MatTabsModule } from '@angular/material/tabs';
import { NgxChartsModule } from '@swimlane/ngx-charts'; import { NgxChartsModule } from '@swimlane/ngx-charts';
import { AgmCoreModule } from '@agm/core'; import { AgmCoreModule } from '@agm/core';

84
src/app/main/apps/e-commerce/order/order-statuses.ts
View File

@ -1,72 +1,72 @@
export const orderStatuses = [ export const orderStatuses = [
{ {
'id' : 1, id : 1,
'name' : 'Awaiting check payment', name : 'Awaiting check payment',
'color': 'blue-500' color: 'blue-500'
}, },
{ {
'id' : 2, id : 2,
'name' : 'Payment accepted', name : 'Payment accepted',
'color': 'green-500' color: 'green-500'
}, },
{ {
'id' : 3, id : 3,
'name' : 'Preparing the order', name : 'Preparing the order',
'color': 'orange-500' color: 'orange-500'
}, },
{ {
'id' : 4, id : 4,
'name' : 'Shipped', name : 'Shipped',
'color': 'purple-500' color: 'purple-500'
}, },
{ {
'id' : 5, id : 5,
'name' : 'Delivered', name : 'Delivered',
'color': 'green-800' color: 'green-800'
}, },
{ {
'id' : 6, id : 6,
'name' : 'Canceled', name : 'Canceled',
'color': 'pink-500' color: 'pink-500'
}, },
{ {
'id' : 7, id : 7,
'name' : 'Refunded', name : 'Refunded',
'color': 'red-500' color: 'red-500'
}, },
{ {
'id' : 8, id : 8,
'name' : 'Payment error', name : 'Payment error',
'color': 'red-900' color: 'red-900'
}, },
{ {
'id' : 9, id : 9,
'name' : 'On pre-order (paid)', name : 'On pre-order (paid)',
'color': 'purple-300' color: 'purple-300'
}, },
{ {
'id' : 10, id : 10,
'name' : 'Awaiting bank wire payment', name : 'Awaiting bank wire payment',
'color': 'blue-500' color: 'blue-500'
}, },
{ {
'id' : 11, id : 11,
'name' : 'Awaiting PayPal payment', name : 'Awaiting PayPal payment',
'color': 'blue-500' color: 'blue-500'
}, },
{ {
'id' : 12, id : 12,
'name' : 'Remote payment accepted', name : 'Remote payment accepted',
'color': 'green-500' color: 'green-500'
}, },
{ {
'id' : 13, id : 13,
'name' : 'On pre-order (not paid)', name : 'On pre-order (not paid)',
'color': 'purple-300' color: 'purple-300'
}, },
{ {
'id' : 14, id : 14,
'name' : 'Awaiting Cash-on-delivery payment', name : 'Awaiting Cash-on-delivery payment',
'color': 'blue-500' color: 'blue-500'
} }
]; ];

9
src/app/main/apps/e-commerce/orders/orders.component.ts
View File

@ -1,5 +1,6 @@
import { Component, ElementRef, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; import { Component, ElementRef, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
import { MatPaginator, MatSort } from '@angular/material'; import { MatPaginator } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
import { DataSource } from '@angular/cdk/collections'; import { DataSource } from '@angular/cdk/collections';
import { BehaviorSubject, fromEvent, merge, Observable, Subject } from 'rxjs'; import { BehaviorSubject, fromEvent, merge, Observable, Subject } from 'rxjs';
import { debounceTime, distinctUntilChanged, map } from 'rxjs/operators'; import { debounceTime, distinctUntilChanged, map } from 'rxjs/operators';
@ -22,13 +23,13 @@ export class EcommerceOrdersComponent implements OnInit, OnDestroy
dataSource: FilesDataSource | null; dataSource: FilesDataSource | null;
displayedColumns = ['id', 'reference', 'customer', 'total', 'payment', 'status', 'date']; displayedColumns = ['id', 'reference', 'customer', 'total', 'payment', 'status', 'date'];
@ViewChild(MatPaginator) @ViewChild(MatPaginator, {static: true})
paginator: MatPaginator; paginator: MatPaginator;
@ViewChild('filter') @ViewChild('filter', {static: true})
filter: ElementRef; filter: ElementRef;
@ViewChild(MatSort) @ViewChild(MatSort, {static: true})
sort: MatSort; sort: MatSort;
// Private // Private

2
src/app/main/apps/e-commerce/product/product.component.ts
View File

@ -1,7 +1,7 @@
import { Component, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core'; import { Component, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms'; import { FormBuilder, FormGroup } from '@angular/forms';
import { Location } from '@angular/common'; import { Location } from '@angular/common';
import { MatSnackBar } from '@angular/material'; import { MatSnackBar } from '@angular/material/snack-bar';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';

2
src/app/main/apps/e-commerce/product/product.model.ts
View File

@ -1,4 +1,4 @@
import { MatChipInputEvent } from '@angular/material'; import { MatChipInputEvent } from '@angular/material/chips';
import { FuseUtils } from '@fuse/utils'; import { FuseUtils } from '@fuse/utils';

9
src/app/main/apps/e-commerce/products/products.component.ts
View File

@ -1,5 +1,6 @@
import { Component, ElementRef, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; import { Component, ElementRef, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
import { MatPaginator, MatSort } from '@angular/material'; import { MatPaginator } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
import { DataSource } from '@angular/cdk/collections'; import { DataSource } from '@angular/cdk/collections';
import { BehaviorSubject, fromEvent, merge, Observable, Subject } from 'rxjs'; import { BehaviorSubject, fromEvent, merge, Observable, Subject } from 'rxjs';
import { debounceTime, distinctUntilChanged, map } from 'rxjs/operators'; import { debounceTime, distinctUntilChanged, map } from 'rxjs/operators';
@ -22,13 +23,13 @@ export class EcommerceProductsComponent implements OnInit
dataSource: FilesDataSource | null; dataSource: FilesDataSource | null;
displayedColumns = ['id', 'image', 'name', 'category', 'price', 'quantity', 'active']; displayedColumns = ['id', 'image', 'name', 'category', 'price', 'quantity', 'active'];
@ViewChild(MatPaginator) @ViewChild(MatPaginator, {static: true})
paginator: MatPaginator; paginator: MatPaginator;
@ViewChild(MatSort) @ViewChild(MatSort, {static: true})
sort: MatSort; sort: MatSort;
@ViewChild('filter') @ViewChild('filter', {static: true})
filter: ElementRef; filter: ElementRef;
// Private // Private

6
src/app/main/apps/file-manager/file-manager.module.ts
View File

@ -1,6 +1,10 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router'; import { RouterModule, Routes } from '@angular/router';
import { MatButtonModule, MatIconModule, MatRippleModule, MatSlideToggleModule, MatTableModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatRippleModule } from '@angular/material/core';
import { MatIconModule } from '@angular/material/icon';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { MatTableModule } from '@angular/material/table';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';
import { FuseSidebarModule } from '@fuse/components'; import { FuseSidebarModule } from '@fuse/components';

2
src/app/main/apps/file-manager/sidebars/details/details.component.html
View File

@ -36,7 +36,7 @@
</div> </div>
<div class="offline-switch"> <div class="offline-switch">
<mat-slide-toggle ([ngModel])="selected.offline" labelPosition="before">Available Offline</mat-slide-toggle> <mat-slide-toggle [(ngModel)]="selected.offline" labelPosition="before">Available Offline</mat-slide-toggle>
</div> </div>
<div class="title">Info</div> <div class="title">Info</div>

2
src/app/main/apps/mail-ngrx/dialogs/compose/compose.component.ts
View File

@ -1,6 +1,6 @@
import { Component, Inject, ViewEncapsulation } from '@angular/core'; import { Component, Inject, ViewEncapsulation } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms'; import { FormBuilder, FormGroup } from '@angular/forms';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
@Component({ @Component({
selector : 'mail-ngrx-compose', selector : 'mail-ngrx-compose',

16
src/app/main/apps/mail-ngrx/i18n/en.ts
View File

@ -1,14 +1,14 @@
export const locale = { export const locale = {
lang: 'en', lang: 'en',
data: { data: {
'MAIL': { MAIL: {
'COMPOSE' : 'COMPOSE', COMPOSE : 'COMPOSE',
'FOLDERS' : 'FOLDERS', FOLDERS : 'FOLDERS',
'FILTERS' : 'FILTERS', FILTERS : 'FILTERS',
'LABELS' : 'LABELS', LABELS : 'LABELS',
'NO_MESSAGES' : 'There are no messages!', NO_MESSAGES : 'There are no messages!',
'SELECT_A_MESSAGE_TO_READ': 'Select a message to read', SELECT_A_MESSAGE_TO_READ: 'Select a message to read',
'SEARCH_PLACEHOLDER': 'Search for an e-mail or contact' SEARCH_PLACEHOLDER: 'Search for an e-mail or contact'
} }
} }
}; };

16
src/app/main/apps/mail-ngrx/i18n/tr.ts
View File

@ -1,14 +1,14 @@
export const locale = { export const locale = {
lang: 'tr', lang: 'tr',
data: { data: {
'MAIL': { MAIL: {
'COMPOSE' : 'YENİ E-POSTA', COMPOSE : 'YENİ E-POSTA',
'FOLDERS' : 'KLASÖRLER', FOLDERS : 'KLASÖRLER',
'FILTERS' : 'FİLTRELER', FILTERS : 'FİLTRELER',
'LABELS' : 'ETİKETLER', LABELS : 'ETİKETLER',
'NO_MESSAGES' : 'Mesajiniz bulunmamakta!', NO_MESSAGES : 'Mesajiniz bulunmamakta!',
'SELECT_A_MESSAGE_TO_READ': 'Okumak için bir mesaj seçin', SELECT_A_MESSAGE_TO_READ: 'Okumak için bir mesaj seçin',
'SEARCH_PLACEHOLDER' : 'E-mail yada bir kişi arayın' SEARCH_PLACEHOLDER : 'E-mail yada bir kişi arayın'
} }
} }
}; };

12
src/app/main/apps/mail-ngrx/mail.component.scss
View File

@ -51,16 +51,16 @@ mail-ngrx {
@include media-breakpoint(xs) { @include media-breakpoint(xs) {
mail-list { mail-ngrx-list {
border-right: none; border-right: none;
} }
mail-list, mail-ngrx-list,
mail-details { mail-ngrx-details {
flex: 1 0 100%; flex: 1 0 100%;
} }
mail-details { mail-ngrx-details {
display: none !important; display: none !important;
} }
@ -76,11 +76,11 @@ mail-ngrx {
.content { .content {
mail-list { mail-ngrx-list {
display: none !important; display: none !important;
} }
mail-details { mail-ngrx-details {
display: flex !important; display: flex !important;
} }
} }

13
src/app/main/apps/mail-ngrx/mail.module.ts
View File

@ -1,8 +1,15 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router'; import { RouterModule, Routes } from '@angular/router';
import { import { MatButtonModule } from '@angular/material/button';
MatButtonModule, MatCheckboxModule, MatDialogModule, MatFormFieldModule, MatIconModule, MatInputModule, MatMenuModule, MatRippleModule, MatSelectModule, MatToolbarModule import { MatCheckboxModule } from '@angular/material/checkbox';
} from '@angular/material'; import { MatRippleModule } from '@angular/material/core';
import { MatDialogModule } from '@angular/material/dialog';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatMenuModule } from '@angular/material/menu';
import { MatSelectModule } from '@angular/material/select';
import { MatToolbarModule } from '@angular/material/toolbar';
import { TranslateModule } from '@ngx-translate/core'; import { TranslateModule } from '@ngx-translate/core';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

2
src/app/main/apps/mail-ngrx/sidebars/main/main-sidebar.component.html
View File

@ -4,7 +4,7 @@
<div class="logo" fxFlex fxLayout="row" fxLayoutAlign="start center"> <div class="logo" fxFlex fxLayout="row" fxLayoutAlign="start center">
<mat-icon class="logo-icon s-32">mail</mat-icon> <mat-icon class="logo-icon s-32">mail</mat-icon>
<span class="logo-text">Mailbox Ngrx</span> <span class="logo-text">MailboxNgrx</span>
</div> </div>
<div class="account" fxLayout="column"> <div class="account" fxLayout="column">

6
src/app/main/apps/mail-ngrx/sidebars/main/main-sidebar.component.ts
View File

@ -1,5 +1,5 @@
import { ChangeDetectionStrategy, Component, ViewEncapsulation } from '@angular/core'; import { ChangeDetectionStrategy, Component, ViewEncapsulation } from '@angular/core';
import { MatDialog } from '@angular/material'; import { MatDialog } from '@angular/material/dialog';
import { FormGroup } from '@angular/forms'; import { FormGroup } from '@angular/forms';
import { select, Store } from '@ngrx/store'; import { select, Store } from '@ngrx/store';
import { Observable } from 'rxjs'; import { Observable } from 'rxjs';
@ -41,8 +41,8 @@ export class MailNgrxMainSidebarComponent
{ {
// Set the defaults // Set the defaults
this.accounts = { this.accounts = {
'creapond' : 'johndoe@creapond.com', creapond : 'johndoe@creapond.com',
'withinpixels': 'johndoe@withinpixels.com' withinpixels: 'johndoe@withinpixels.com'
}; };
this.selectedAccount = 'creapond'; this.selectedAccount = 'creapond';
this.folders$ = this._store.pipe(select(fromStore.getFoldersArr)); this.folders$ = this._store.pipe(select(fromStore.getFoldersArr));

2
src/app/main/apps/mail-ngrx/store/effects/mails.effects.ts
View File

@ -80,7 +80,7 @@ export class MailsEffect
* @type {Observable<any>} * @type {Observable<any>}
*/ */
@Effect() @Effect()
updateMail: Observable<MailsActions.MailsActionsAll> = updateMail: Observable<{}> =
this.actions this.actions
.pipe( .pipe(
ofType<MailsActions.UpdateMail>(MailsActions.UPDATE_MAIL), ofType<MailsActions.UpdateMail>(MailsActions.UPDATE_MAIL),

2
src/app/main/apps/mail-ngrx/store/guards/resolve.guard.ts
View File

@ -1,6 +1,6 @@
import { Injectable } from '@angular/core'; import { Injectable } from '@angular/core';
import { ActivatedRouteSnapshot, CanActivate } from '@angular/router'; import { ActivatedRouteSnapshot, CanActivate } from '@angular/router';
import { RouterStateSnapshot } from '@angular/router/src/router_state'; import { RouterStateSnapshot } from '@angular/router';
import { select, Store } from '@ngrx/store'; import { select, Store } from '@ngrx/store';
import { Observable, forkJoin, of } from 'rxjs'; import { Observable, forkJoin, of } from 'rxjs';

2
src/app/main/apps/mail/dialogs/compose/compose.component.ts
View File

@ -1,6 +1,6 @@
import { Component, Inject, ViewEncapsulation } from '@angular/core'; import { Component, Inject, ViewEncapsulation } from '@angular/core';
import { FormControl, FormGroup } from '@angular/forms'; import { FormControl, FormGroup } from '@angular/forms';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
@Component({ @Component({
selector : 'mail-compose', selector : 'mail-compose',

16
src/app/main/apps/mail/i18n/en.ts
View File

@ -1,14 +1,14 @@
export const locale = { export const locale = {
lang: 'en', lang: 'en',
data: { data: {
'MAIL': { MAIL: {
'COMPOSE' : 'COMPOSE', COMPOSE : 'COMPOSE',
'FOLDERS' : 'FOLDERS', FOLDERS : 'FOLDERS',
'FILTERS' : 'FILTERS', FILTERS : 'FILTERS',
'LABELS' : 'LABELS', LABELS : 'LABELS',
'NO_MESSAGES' : 'There are no messages!', NO_MESSAGES : 'There are no messages!',
'SELECT_A_MESSAGE_TO_READ': 'Select a message to read', SELECT_A_MESSAGE_TO_READ: 'Select a message to read',
'SEARCH_PLACEHOLDER' : 'Search for an e-mail or contact' SEARCH_PLACEHOLDER : 'Search for an e-mail or contact'
} }
} }
}; };

16
src/app/main/apps/mail/i18n/tr.ts
View File

@ -1,14 +1,14 @@
export const locale = { export const locale = {
lang: 'tr', lang: 'tr',
data: { data: {
'MAIL': { MAIL: {
'COMPOSE' : 'YENİ E-POSTA', COMPOSE : 'YENİ E-POSTA',
'FOLDERS' : 'KLASÖRLER', FOLDERS : 'KLASÖRLER',
'FILTERS' : 'FİLTRELER', FILTERS : 'FİLTRELER',
'LABELS' : 'ETİKETLER', LABELS : 'ETİKETLER',
'NO_MESSAGES' : 'Mesajiniz bulunmamakta!', NO_MESSAGES : 'Mesajiniz bulunmamakta!',
'SELECT_A_MESSAGE_TO_READ': 'Okumak için bir mesaj seçin', SELECT_A_MESSAGE_TO_READ: 'Okumak için bir mesaj seçin',
'SEARCH_PLACEHOLDER' : 'E-mail yada bir kişi arayın' SEARCH_PLACEHOLDER : 'E-mail yada bir kişi arayın'
} }
} }
}; };

13
src/app/main/apps/mail/mail.module.ts
View File

@ -1,8 +1,15 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router'; import { RouterModule, Routes } from '@angular/router';
import { import { MatButtonModule } from '@angular/material/button';
MatButtonModule, MatCheckboxModule, MatDialogModule, MatFormFieldModule, MatIconModule, MatInputModule, MatMenuModule, MatRippleModule, MatSelectModule, MatToolbarModule import { MatCheckboxModule } from '@angular/material/checkbox';
} from '@angular/material'; import { MatRippleModule } from '@angular/material/core';
import { MatDialogModule } from '@angular/material/dialog';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatMenuModule } from '@angular/material/menu';
import { MatSelectModule } from '@angular/material/select';
import { MatToolbarModule } from '@angular/material/toolbar';
import { TranslateModule } from '@ngx-translate/core'; import { TranslateModule } from '@ngx-translate/core';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

6
src/app/main/apps/mail/sidebars/main/main-sidebar.component.ts
View File

@ -1,6 +1,6 @@
import { Component, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core'; import { Component, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core';
import { FormGroup } from '@angular/forms'; import { FormGroup } from '@angular/forms';
import { MatDialog } from '@angular/material'; import { MatDialog } from '@angular/material/dialog';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
@ -41,8 +41,8 @@ export class MailMainSidebarComponent implements OnInit, OnDestroy
{ {
// Set the defaults // Set the defaults
this.accounts = { this.accounts = {
'creapond' : 'johndoe@creapond.com', creapond : 'johndoe@creapond.com',
'withinpixels': 'johndoe@withinpixels.com' withinpixels: 'johndoe@withinpixels.com'
}; };
this.selectedAccount = 'creapond'; this.selectedAccount = 'creapond';

18
src/app/main/apps/scrumboard/board.model.ts
View File

@ -5,19 +5,19 @@ import { Card } from './card.model';
const sampleLabels = [ const sampleLabels = [
{ {
'id' : '56027e4119ad3a5dc28b36cd', id : '56027e4119ad3a5dc28b36cd',
'name' : 'Design', name : 'Design',
'color': 'red-500' color: 'red-500'
}, },
{ {
'id' : '5640635e19ad3a5dc21416b2', id : '5640635e19ad3a5dc21416b2',
'name' : 'App', name : 'App',
'color': 'blue-500' color: 'blue-500'
}, },
{ {
'id' : '6540635g19ad3s5dc31412b2', id : '6540635g19ad3s5dc31412b2',
'name' : 'Feature', name : 'Feature',
'color': 'green-400' color: 'green-400'
} }
]; ];

2
src/app/main/apps/scrumboard/board/add-list/add-list.component.ts
View File

@ -15,7 +15,7 @@ export class ScrumboardBoardAddListComponent
@Output() @Output()
listAdded: EventEmitter<any>; listAdded: EventEmitter<any>;
@ViewChild('nameInput') @ViewChild('nameInput', {static: false})
nameInputField; nameInputField;
/** /**

13
src/app/main/apps/scrumboard/board/dialogs/card/card.component.ts
View File

@ -1,6 +1,7 @@
import { Component, Inject, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; import { Component, Inject, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
import { NgForm } from '@angular/forms/src/forms'; import { NgForm } from '@angular/forms';
import { MAT_DIALOG_DATA, MatDialog, MatDialogRef, MatMenuTrigger } from '@angular/material'; import { MAT_DIALOG_DATA, MatDialog, MatDialogRef } from '@angular/material/dialog';
import { MatMenuTrigger } from '@angular/material/menu';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { FuseConfirmDialogComponent } from '@fuse/components/confirm-dialog/confirm-dialog.component'; import { FuseConfirmDialogComponent } from '@fuse/components/confirm-dialog/confirm-dialog.component';
@ -24,10 +25,10 @@ export class ScrumboardCardDialogComponent implements OnInit, OnDestroy
toggleInArray = FuseUtils.toggleInArray; toggleInArray = FuseUtils.toggleInArray;
confirmDialogRef: MatDialogRef<FuseConfirmDialogComponent>; confirmDialogRef: MatDialogRef<FuseConfirmDialogComponent>;
@ViewChild('checklistMenuTrigger') @ViewChild('checklistMenuTrigger', {static: false})
checklistMenu: MatMenuTrigger; checklistMenu: MatMenuTrigger;
@ViewChild('newCheckListTitleField') @ViewChild('newCheckListTitleField', {static: false})
newCheckListTitleField; newCheckListTitleField;
// Private // Private
@ -222,8 +223,8 @@ export class ScrumboardCardDialogComponent implements OnInit, OnDestroy
} }
const newCheckItem = { const newCheckItem = {
'name' : checkItemVal, name : checkItemVal,
'checked': false checked: false
}; };
checkList.checkItems.push(newCheckItem); checkList.checkItems.push(newCheckItem);

6
src/app/main/apps/scrumboard/board/dialogs/card/label-selector/label-selector.component.ts
View File

@ -45,9 +45,9 @@ export class ScrumboardLabelSelectorComponent implements OnInit, OnDestroy
this.cardLabelsChanged = new EventEmitter(); this.cardLabelsChanged = new EventEmitter();
this.labelsMenuView = 'labels'; this.labelsMenuView = 'labels';
this.newLabel = { this.newLabel = {
'id' : '', id : '',
'name' : '', name : '',
'color': 'blue-400' color: 'blue-400'
}; };
this.toggleInArray = FuseUtils.toggleInArray; this.toggleInArray = FuseUtils.toggleInArray;

2
src/app/main/apps/scrumboard/board/edit-board-name/edit-board-name.component.ts
View File

@ -18,7 +18,7 @@ export class ScrumboardEditBoardNameComponent
@Output() @Output()
boardNameChanged: EventEmitter<any>; boardNameChanged: EventEmitter<any>;
@ViewChild('nameInput') @ViewChild('nameInput', {static: false})
nameInputField; nameInputField;
constructor( constructor(

2
src/app/main/apps/scrumboard/board/list/add-card/add-card.component.ts
View File

@ -15,7 +15,7 @@ export class ScrumboardBoardAddCardComponent
@Output() @Output()
cardAdded: EventEmitter<any>; cardAdded: EventEmitter<any>;
@ViewChild('nameInput') @ViewChild('nameInput', {static: false})
nameInputField; nameInputField;
/** /**

2
src/app/main/apps/scrumboard/board/list/edit-list-name/edit-list-name.component.ts
View File

@ -18,7 +18,7 @@ export class ScrumboardBoardEditListNameComponent
@Output() @Output()
listNameChanged: EventEmitter<any>; listNameChanged: EventEmitter<any>;
@ViewChild('nameInput') @ViewChild('nameInput', {static: false})
nameInputField; nameInputField;
/** /**

4
src/app/main/apps/scrumboard/board/list/list.component.ts
View File

@ -1,6 +1,6 @@
import { Component, Input, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; import { Component, Input, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
import { ActivatedRoute } from '@angular/router'; import { ActivatedRoute } from '@angular/router';
import { MatDialog, MatDialogRef } from '@angular/material'; import { MatDialog, MatDialogRef } from '@angular/material/dialog';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
@ -25,7 +25,7 @@ export class ScrumboardBoardListComponent implements OnInit, OnDestroy
@Input() @Input()
list; list;
@ViewChild(FusePerfectScrollbarDirective) @ViewChild(FusePerfectScrollbarDirective, {static: false})
listScroll: FusePerfectScrollbarDirective; listScroll: FusePerfectScrollbarDirective;
confirmDialogRef: MatDialogRef<FuseConfirmDialogComponent>; confirmDialogRef: MatDialogRef<FuseConfirmDialogComponent>;

19
src/app/main/apps/scrumboard/scrumboard.module.ts
View File

@ -1,9 +1,20 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router'; import { RouterModule, Routes } from '@angular/router';
import { import { MatButtonModule } from '@angular/material/button';
MatButtonModule, MatCheckboxModule, MatChipsModule, MatDatepickerModule, MatDialogModule, MatFormFieldModule, MatIconModule, MatInputModule, MatListModule, MatMenuModule, import { MatCheckboxModule } from '@angular/material/checkbox';
MatProgressBarModule, MatRippleModule, MatSidenavModule, MatToolbarModule, MatTooltipModule import { MatChipsModule } from '@angular/material/chips';
} from '@angular/material'; import { MatRippleModule } from '@angular/material/core';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatDialogModule } from '@angular/material/dialog';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatListModule } from '@angular/material/list';
import { MatMenuModule } from '@angular/material/menu';
import { MatProgressBarModule } from '@angular/material/progress-bar';
import { MatSidenavModule } from '@angular/material/sidenav';
import { MatToolbarModule } from '@angular/material/toolbar';
import { MatTooltipModule } from '@angular/material/tooltip';
import { NgxDnDModule } from '@swimlane/ngx-dnd'; import { NgxDnDModule } from '@swimlane/ngx-dnd';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

4
src/app/main/apps/todo/sidebars/main/main-sidebar.component.ts
View File

@ -38,8 +38,8 @@ export class TodoMainSidebarComponent implements OnInit, OnDestroy
{ {
// Set the defaults // Set the defaults
this.accounts = { this.accounts = {
'creapond' : 'johndoe@creapond.com', creapond : 'johndoe@creapond.com',
'withinpixels': 'johndoe@withinpixels.com' withinpixels: 'johndoe@withinpixels.com'
}; };
this.selectedAccount = 'creapond'; this.selectedAccount = 'creapond';

22
src/app/main/apps/todo/todo-details/todo-details.component.ts
View File

@ -23,7 +23,7 @@ export class TodoDetailsComponent implements OnInit, OnDestroy
formType: string; formType: string;
todoForm: FormGroup; todoForm: FormGroup;
@ViewChild('titleInput') @ViewChild('titleInput', {static: false})
titleInputField; titleInputField;
// Private // Private
@ -128,16 +128,16 @@ export class TodoDetailsComponent implements OnInit, OnDestroy
createTodoForm(): FormGroup createTodoForm(): FormGroup
{ {
return this._formBuilder.group({ return this._formBuilder.group({
'id' : [this.todo.id], id : [this.todo.id],
'title' : [this.todo.title], title : [this.todo.title],
'notes' : [this.todo.notes], notes : [this.todo.notes],
'startDate': [this.todo.startDate], startDate: [this.todo.startDate],
'dueDate' : [this.todo.dueDate], dueDate : [this.todo.dueDate],
'completed': [this.todo.completed], completed: [this.todo.completed],
'starred' : [this.todo.starred], starred : [this.todo.starred],
'important': [this.todo.important], important: [this.todo.important],
'deleted' : [this.todo.deleted], deleted : [this.todo.deleted],
'tags' : [this.todo.tags] tags : [this.todo.tags]
}); });
} }

12
src/app/main/apps/todo/todo.module.ts
View File

@ -1,8 +1,14 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router'; import { RouterModule, Routes } from '@angular/router';
import { import { MatButtonModule } from '@angular/material/button';
MatButtonModule, MatCheckboxModule, MatDatepickerModule, MatFormFieldModule, MatIconModule, MatInputModule, MatMenuModule, MatRippleModule, MatSelectModule import { MatCheckboxModule } from '@angular/material/checkbox';
} from '@angular/material'; import { MatRippleModule } from '@angular/material/core';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatMenuModule } from '@angular/material/menu';
import { MatSelectModule } from '@angular/material/select';
import { NgxDnDModule } from '@swimlane/ngx-dnd'; import { NgxDnDModule } from '@swimlane/ngx-dnd';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

34
src/app/main/documentation/changelog/changelog.component.html
View File

@ -19,6 +19,40 @@
<div class="changelog"> <div class="changelog">
<!-- --------------------------------------------------------------------------------------------- -->
<!-- @ v8.0.0 -->
<!-- --------------------------------------------------------------------------------------------- -->
<div class="entry">
<div class="title">
<span class="version">v8.0.0</span>
<span class="date">TBA</span>
</div>
<div class="groups">
<div class="new">
<span class="title">New</span>
<ul>
<li>Updated Angular to 8.0.0</li>
<li>Updated Angular Material to 8.0.0</li>
<li>Updated various other packages to latest versions</li>
<li>Updated various AngularCLI related files</li>
<li>Updated various project related files</li>
</ul>
</div>
<div class="fixed">
<span class="title">Fixed</span>
<ul>
<li>(Mail Ngrx) Responsive styles</li>
</ul>
</div>
</div>
</div>
<!-- --------------------------------------------------------------------------------------------- --> <!-- --------------------------------------------------------------------------------------------- -->
<!-- @ v7.1.0 --> <!-- @ v7.1.0 -->
<!-- --------------------------------------------------------------------------------------------- --> <!-- --------------------------------------------------------------------------------------------- -->

4
src/app/main/documentation/components-third-party/components-third-party.module.ts vendored
View File

@ -1,6 +1,8 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatButtonModule, MatCheckboxModule, MatIconModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { NgxDatatableModule } from '@swimlane/ngx-datatable'; import { NgxDatatableModule } from '@swimlane/ngx-datatable';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

3
src/app/main/documentation/components-third-party/google-maps/google-maps.module.ts vendored
View File

@ -1,7 +1,8 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatButtonModule, MatIconModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { AgmCoreModule } from '@agm/core'; import { AgmCoreModule } from '@agm/core';

3
src/app/main/documentation/components/components.module.ts
View File

@ -1,6 +1,7 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatButtonModule, MatIconModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

3
src/app/main/documentation/directives/directives.module.ts
View File

@ -1,6 +1,7 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatButtonModule, MatIconModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';
import { FuseHighlightModule } from '@fuse/components'; import { FuseHighlightModule } from '@fuse/components';

2
src/app/main/documentation/documentation.module.ts
View File

@ -1,7 +1,7 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router'; import { RouterModule, Routes } from '@angular/router';
import { MatIconModule } from '@angular/material'; import { MatIconModule } from '@angular/material/icon';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

2
src/app/main/documentation/getting-started/getting-started.module.ts
View File

@ -1,6 +1,6 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatIconModule } from '@angular/material'; import { MatIconModule } from '@angular/material/icon';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';
import { FuseHighlightModule } from '@fuse/components'; import { FuseHighlightModule } from '@fuse/components';

2
src/app/main/documentation/services/services.module.ts
View File

@ -1,6 +1,6 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatIconModule } from '@angular/material'; import { MatIconModule } from '@angular/material/icon';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';
import { FuseHighlightModule } from '@fuse/components/index'; import { FuseHighlightModule } from '@fuse/components/index';

3
src/app/main/documentation/working-with-fuse/working-with-fuse.module.ts
View File

@ -1,6 +1,7 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatButtonModule, MatIconModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';
import { FuseHighlightModule } from '@fuse/components'; import { FuseHighlightModule } from '@fuse/components';

5
src/app/main/pages/authentication/forgot-password-2/forgot-password-2.module.ts
View File

@ -1,6 +1,9 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatButtonModule, MatFormFieldModule, MatIconModule, MatInputModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

5
src/app/main/pages/authentication/forgot-password/forgot-password.module.ts
View File

@ -1,6 +1,9 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatButtonModule, MatFormFieldModule, MatIconModule, MatInputModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

5
src/app/main/pages/authentication/lock/lock.module.ts
View File

@ -1,6 +1,9 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatButtonModule, MatFormFieldModule, MatIconModule, MatInputModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

6
src/app/main/pages/authentication/login-2/login-2.module.ts
View File

@ -1,6 +1,10 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatButtonModule, MatCheckboxModule, MatFormFieldModule, MatIconModule, MatInputModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

Some files were not shown because too many files have changed in this diff Show More