gilles/scrutiny
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #468 from AnalogJ/angular-v13-upgrade

Browse Source
This commit is contained in:
Jason Kulatunga
2023-04-05 20:58:56 -07:00
committed by GitHub
parent 8c65166a90 7b77519f49
commit dea362361e
39 changed files with 8409 additions and 28133 deletions
Download Patch File Download Diff File Expand all files Collapse all files
CONTRIBUTING.md
+1 -1
View File
@@ -55,7 +55,7 @@ The frontend is written in Angular. If you're working on the frontend and can us
```bash ```bash
cd webapp/frontend cd webapp/frontend
npm install npm install
npm run start -- --deploy-url="/web/" --base-href="/web/" --port 4200 npm run start -- --serve-path="/web/" --port 4200
``` ```
3. open your browser and visit [http://localhost:4200/web](http://localhost:4200/web) 3. open your browser and visit [http://localhost:4200/web](http://localhost:4200/web)
Makefile
-2
View File
@@ -98,7 +98,6 @@ endif
# reduce logging, disable angular-cli analytics for ci environment # reduce logging, disable angular-cli analytics for ci environment
binary-frontend: export NPM_CONFIG_LOGLEVEL = warn binary-frontend: export NPM_CONFIG_LOGLEVEL = warn
binary-frontend: export NG_CLI_ANALYTICS = false binary-frontend: export NG_CLI_ANALYTICS = false
binary-frontend: export NODE_OPTIONS = --openssl-legacy-provider
binary-frontend: binary-frontend:
cd webapp/frontend cd webapp/frontend
npm install -g @angular/cli@9.1.4 npm install -g @angular/cli@9.1.4
@@ -108,7 +107,6 @@ binary-frontend:
.PHONY: binary-frontend-test-coverage .PHONY: binary-frontend-test-coverage
# reduce logging, disable angular-cli analytics for ci environment # reduce logging, disable angular-cli analytics for ci environment
binary-frontend-test-coverage: export NODE_OPTIONS = --openssl-legacy-provider
binary-frontend-test-coverage: binary-frontend-test-coverage:
cd webapp/frontend cd webapp/frontend
npm ci npm ci
webapp/backend/pkg/database/scrutiny_repository_migrations.go
+6
View File
@@ -325,6 +325,12 @@ func (sr *scrutinyRepository) Migrate(ctx context.Context) error {
SettingDataType: "bool", SettingDataType: "bool",
SettingValueBool: false, SettingValueBool: false,
}, },
{
SettingKeyName: "line_stroke",
SettingKeyDescription: "Temperature chart line stroke ('smooth' | 'straight' | 'stepline')",
SettingDataType: "string",
SettingValueString: "smooth",
},
{ {
SettingKeyName: "metrics.notify_level", SettingKeyName: "metrics.notify_level",
webapp/backend/pkg/models/settings.go
+1
View File
@@ -14,6 +14,7 @@ type Settings struct {
DashboardSort string `json:"dashboard_sort" mapstructure:"dashboard_sort"` DashboardSort string `json:"dashboard_sort" mapstructure:"dashboard_sort"`
TemperatureUnit string `json:"temperature_unit" mapstructure:"temperature_unit"` TemperatureUnit string `json:"temperature_unit" mapstructure:"temperature_unit"`
FileSizeSIUnits bool `json:"file_size_si_units" mapstructure:"file_size_si_units"` FileSizeSIUnits bool `json:"file_size_si_units" mapstructure:"file_size_si_units"`
LineStroke string `json:"line_stroke" mapstructure:"line_stroke"`
Metrics struct { Metrics struct {
NotifyLevel int `json:"notify_level" mapstructure:"notify_level"` NotifyLevel int `json:"notify_level" mapstructure:"notify_level"`
webapp/frontend/angular.json
-2
View File
@@ -52,7 +52,6 @@
"optimization": true, "optimization": true,
"outputHashing": "all", "outputHashing": "all",
"sourceMap": false, "sourceMap": false,
"extractCss": true,
"namedChunks": false, "namedChunks": false,
"extractLicenses": true, "extractLicenses": true,
"vendorChunk": false, "vendorChunk": false,
@@ -91,7 +90,6 @@
}, },
"test": { "test": {
"builder": "@angular-devkit/build-angular:karma", "builder": "@angular-devkit/build-angular:karma",
"defaultConfiguration": "production",
"options": { "options": {
"main": "src/test.ts", "main": "src/test.ts",
"polyfills": "src/polyfills.ts", "polyfills": "src/polyfills.ts",
webapp/frontend/karma.conf.js
+10 -10
View File
@@ -10,10 +10,10 @@ module.exports = function (config)
require('karma-jasmine'), require('karma-jasmine'),
require('karma-chrome-launcher'), require('karma-chrome-launcher'),
require('karma-jasmine-html-reporter'), require('karma-jasmine-html-reporter'),
require('karma-coverage-istanbul-reporter'), require('karma-coverage'),
require('@angular-devkit/build-angular/plugins/karma') require('@angular-devkit/build-angular/plugins/karma')
], ],
client : { client: {
clearContext: false // leave Jasmine Spec Runner output visible in browser clearContext: false // leave Jasmine Spec Runner output visible in browser
}, },
coverageIstanbulReporter: { coverageIstanbulReporter: {
@@ -21,13 +21,13 @@ module.exports = function (config)
reports: ['html', 'lcovonly', 'text-summary'], reports: ['html', 'lcovonly', 'text-summary'],
fixWebpackSourcePaths: true fixWebpackSourcePaths: true
}, },
reporters : ['progress', 'kjhtml'], reporters: ['progress', 'kjhtml'],
port : 9876, port: 9876,
colors : true, colors: true,
logLevel : config.LOG_INFO, logLevel: config.LOG_INFO,
autoWatch : true, autoWatch: true,
browsers : ['Chrome'], browsers: ['Chrome'],
singleRun : false, singleRun: false,
restartOnFileChange : true restartOnFileChange: true
}); });
}; };
webapp/frontend/package-lock.json
Generated
+8291 -27143
View File
File diff suppressed because it is too large Load Diff
webapp/frontend/package.json
+49 -60
View File
@@ -7,7 +7,7 @@
"start": "ng serve --open", "start": "ng serve --open",
"start:mem": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng serve --open", "start:mem": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng serve --open",
"build": "ng build", "build": "ng build",
"build:prod": "ng build --prod", "build:prod": "ng build --configuration production",
"build:prod:mem": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng build --prod", "build:prod:mem": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng build --prod",
"test": "ng test", "test": "ng test",
"lint": "ng lint", "lint": "ng lint",
@@ -20,66 +20,55 @@
}, },
"private": true, "private": true,
"dependencies": { "dependencies": {
"@angular/animations": "9.1.4", "@angular/animations": "v13-lts",
"@angular/cdk": "9.2.2", "@angular/cdk": "v13-lts",
"@angular/common": "9.1.4", "@angular/common": "v13-lts",
"@angular/compiler": "9.1.4", "@angular/compiler": "v13-lts",
"@angular/core": "9.1.4", "@angular/core": "v13-lts",
"@angular/forms": "9.1.4", "@angular/forms": "v13-lts",
"@angular/material": "9.2.2", "@angular/material": "v13-lts",
"@angular/material-moment-adapter": "9.2.2", "@angular/material-moment-adapter": "v13-lts",
"@angular/platform-browser": "9.1.4", "@angular/platform-browser": "v13-lts",
"@angular/platform-browser-dynamic": "9.1.4", "@angular/platform-browser-dynamic": "v13-lts",
"@angular/router": "9.1.4", "@angular/router": "v13-lts",
"@fullcalendar/angular": "4.4.5-beta", "@types/humanize-duration": "^3.27.1",
"@fullcalendar/core": "4.4.0", "crypto-js": "^4.1.1",
"@fullcalendar/daygrid": "4.4.0", "highlight.js": "^11.6.0",
"@fullcalendar/interaction": "4.4.0", "humanize-duration": "^3.27.3",
"@fullcalendar/list": "4.4.0", "lodash": "4.17.21",
"@fullcalendar/moment": "4.4.0", "moment": "^2.29.4",
"@fullcalendar/rrule": "4.4.0", "ng-apexcharts": "^1.7.4",
"@fullcalendar/timegrid": "4.4.0", "ngx-markdown": "^13.1.0",
"@types/humanize-duration": "^3.18.1", "perfect-scrollbar": "^1.5.5",
"apexcharts": "3.19.2", "quill": "^1.3.7",
"crypto-js": "3.3.0", "rrule": "^2.7.1",
"highlight.js": "10.0.1", "rxjs": "^7.5.7",
"humanize-duration": "^3.24.0", "tslib": "^2.4.1",
"lodash": "4.17.15", "web-animations-js": "^2.3.2"
"moment": "2.24.0",
"ng-apexcharts": "1.5.12",
"ngx-markdown": "9.0.0",
"ngx-quill": "9.1.0",
"perfect-scrollbar": "1.5.0",
"quill": "1.3.7",
"rrule": "2.6.4",
"rxjs": "6.5.5",
"tslib": "1.11.1",
"web-animations-js": "2.3.2",
"zone.js": "0.10.3"
}, },
"devDependencies": { "devDependencies": {
"@angular-devkit/build-angular": "0.901.4", "@angular-devkit/build-angular": "v13-lts",
"@angular/cli": "9.1.4", "@angular/cli": "v13-lts",
"@angular/compiler-cli": "9.1.4", "@angular/compiler-cli": "v13-lts",
"@angular/language-service": "9.1.4", "@angular/language-service": "v13-lts",
"@types/crypto-js": "3.1.45", "@types/crypto-js": "^4.1.1",
"@types/highlight.js": "9.12.3", "@types/highlight.js": "^10.1.0",
"@types/jasmine": "3.5.10", "@types/jasmine": "^4.3.0",
"@types/jasminewd2": "2.0.8", "@types/jasminewd2": "^2.0.10",
"@types/lodash": "4.14.150", "@types/lodash": "^4.14.188",
"@types/node": "12.12.37", "@types/node": "^18.11.9",
"codelyzer": "5.2.2", "codelyzer": "^6.0.2",
"jasmine-core": "3.5.0", "jasmine-core": "^4.5.0",
"jasmine-spec-reporter": "4.2.1", "jasmine-spec-reporter": "^7.0.0",
"karma": "5.0.4", "karma": "^6.4.1",
"karma-chrome-launcher": "3.1.0", "karma-chrome-launcher": "^3.1.1",
"karma-coverage-istanbul-reporter": "2.1.1", "karma-coverage": "^2.2.0",
"karma-jasmine": "3.0.3", "karma-jasmine": "^5.1.0",
"karma-jasmine-html-reporter": "1.5.3", "karma-jasmine-html-reporter": "^2.0.0",
"protractor": "5.4.4", "protractor": "^7.0.0",
"tailwindcss": "1.4.4", "tailwindcss": "^3.2.3",
"ts-node": "8.3.0", "ts-node": "^10.9.1",
"tslint": "6.1.2", "tslint": "^6.1.3",
"typescript": "3.8.3" "typescript": "^4.6.4"
} }
} }
webapp/frontend/src/@treo/components/date-range/date-range.component.ts
+1 -1
View File
@@ -56,7 +56,7 @@ export class TreoDateRangeComponent implements ControlValueAccessor, OnInit, OnD
private _timeFormat: string; private _timeFormat: string;
private _timeRange: boolean; private _timeRange: boolean;
private readonly _timeRegExp: RegExp; private readonly _timeRegExp: RegExp;
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
/** /**
* Constructor * Constructor
webapp/frontend/src/@treo/components/message/message.component.ts
+1 -1
View File
@@ -31,7 +31,7 @@ export class TreoMessageComponent implements OnInit, OnDestroy
private _dismissed: null | boolean; private _dismissed: null | boolean;
private _showIcon: boolean; private _showIcon: boolean;
private _type: TreoMessageType; private _type: TreoMessageType;
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
/** /**
* Constructor * Constructor
webapp/frontend/src/@treo/components/navigation/horizontal/components/basic/basic.component.ts
+1 -1
View File
@@ -23,7 +23,7 @@ export class TreoHorizontalNavigationBasicItemComponent implements OnInit, OnDes
// Private // Private
private _treoHorizontalNavigationComponent: TreoHorizontalNavigationComponent; private _treoHorizontalNavigationComponent: TreoHorizontalNavigationComponent;
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
/** /**
* Constructor * Constructor
webapp/frontend/src/@treo/components/navigation/horizontal/components/branch/branch.component.ts
+1 -1
View File
@@ -32,7 +32,7 @@ export class TreoHorizontalNavigationBranchItemComponent implements OnInit, OnDe
// Private // Private
private _treoHorizontalNavigationComponent: TreoHorizontalNavigationComponent; private _treoHorizontalNavigationComponent: TreoHorizontalNavigationComponent;
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
/** /**
* Constructor * Constructor
webapp/frontend/src/@treo/components/navigation/horizontal/components/divider/divider.component.ts
+1 -1
View File
@@ -23,7 +23,7 @@ export class TreoHorizontalNavigationDividerItemComponent implements OnInit, OnD
// Private // Private
private _treoHorizontalNavigationComponent: TreoHorizontalNavigationComponent; private _treoHorizontalNavigationComponent: TreoHorizontalNavigationComponent;
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
/** /**
* Constructor * Constructor
webapp/frontend/src/@treo/components/navigation/horizontal/components/spacer/spacer.component.ts
+1 -1
View File
@@ -23,7 +23,7 @@ export class TreoHorizontalNavigationSpacerItemComponent implements OnInit, OnDe
// Private // Private
private _treoHorizontalNavigationComponent: TreoHorizontalNavigationComponent; private _treoHorizontalNavigationComponent: TreoHorizontalNavigationComponent;
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
/** /**
* Constructor * Constructor
webapp/frontend/src/@treo/components/navigation/horizontal/horizontal.component.ts
+1 -1
View File
@@ -23,7 +23,7 @@ export class TreoHorizontalNavigationComponent implements OnInit, OnDestroy
// Private // Private
private _navigation: TreoNavigationItem[]; private _navigation: TreoNavigationItem[];
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
/** /**
* Constructor * Constructor
webapp/frontend/src/@treo/components/navigation/vertical/components/aside/aside.component.ts
+1 -1
View File
@@ -35,7 +35,7 @@ export class TreoVerticalNavigationAsideItemComponent implements OnInit, OnDestr
// Private // Private
private _treoVerticalNavigationComponent: TreoVerticalNavigationComponent; private _treoVerticalNavigationComponent: TreoVerticalNavigationComponent;
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
/** /**
* Constructor * Constructor
webapp/frontend/src/@treo/components/navigation/vertical/components/basic/basic.component.ts
+1 -1
View File
@@ -23,7 +23,7 @@ export class TreoVerticalNavigationBasicItemComponent implements OnInit, OnDestr
// Private // Private
private _treoVerticalNavigationComponent: TreoVerticalNavigationComponent; private _treoVerticalNavigationComponent: TreoVerticalNavigationComponent;
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
/** /**
* Constructor * Constructor
webapp/frontend/src/@treo/components/navigation/vertical/components/collapsable/collapsable.component.ts
+1 -1
View File
@@ -38,7 +38,7 @@ export class TreoVerticalNavigationCollapsableItemComponent implements OnInit, O
// Private // Private
private _treoVerticalNavigationComponent: TreoVerticalNavigationComponent; private _treoVerticalNavigationComponent: TreoVerticalNavigationComponent;
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
/** /**
* Constructor * Constructor
webapp/frontend/src/@treo/components/navigation/vertical/components/divider/divider.component.ts
+1 -1
View File
@@ -23,7 +23,7 @@ export class TreoVerticalNavigationDividerItemComponent implements OnInit, OnDes
// Private // Private
private _treoVerticalNavigationComponent: TreoVerticalNavigationComponent; private _treoVerticalNavigationComponent: TreoVerticalNavigationComponent;
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
/** /**
* Constructor * Constructor
webapp/frontend/src/@treo/components/navigation/vertical/components/group/group.component.ts
+1 -1
View File
@@ -27,7 +27,7 @@ export class TreoVerticalNavigationGroupItemComponent implements OnInit, OnDestr
// Private // Private
private _treoVerticalNavigationComponent: TreoVerticalNavigationComponent; private _treoVerticalNavigationComponent: TreoVerticalNavigationComponent;
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
/** /**
* Constructor * Constructor
webapp/frontend/src/@treo/components/navigation/vertical/components/spacer/spacer.component.ts
+1 -1
View File
@@ -23,7 +23,7 @@ export class TreoVerticalNavigationSpacerItemComponent implements OnInit, OnDest
// Private // Private
private _treoVerticalNavigationComponent: TreoVerticalNavigationComponent; private _treoVerticalNavigationComponent: TreoVerticalNavigationComponent;
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
/** /**
* Constructor * Constructor
webapp/frontend/src/@treo/components/navigation/vertical/vertical.component.ts
+1 -1
View File
@@ -65,7 +65,7 @@ export class TreoVerticalNavigationComponent implements OnInit, AfterViewInit, O
private _position: TreoVerticalNavigationPosition; private _position: TreoVerticalNavigationPosition;
private _scrollStrategy: ScrollStrategy; private _scrollStrategy: ScrollStrategy;
private _transparentOverlay: boolean | ''; private _transparentOverlay: boolean | '';
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
@HostBinding('class.treo-vertical-navigation-animations-enabled') @HostBinding('class.treo-vertical-navigation-animations-enabled')
private _animationsEnabled: boolean; private _animationsEnabled: boolean;
webapp/frontend/src/@treo/directives/autogrow/autogrow.directive.ts
+1 -1
View File
@@ -12,7 +12,7 @@ export class TreoAutogrowDirective implements OnInit, OnDestroy
// Private // Private
private _padding: number; private _padding: number;
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
/** /**
* Constructor * Constructor
webapp/frontend/src/@treo/directives/scrollbar/scrollbar.directive.ts
+1 -1
View File
@@ -24,7 +24,7 @@ export class TreoScrollbarDirective implements OnInit, OnDestroy
private _animation: number | null; private _animation: number | null;
private _enabled: boolean; private _enabled: boolean;
private _options: any; private _options: any;
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
/** /**
* Constructor * Constructor
webapp/frontend/src/@treo/lib/mock-api/mock-api.module.ts
+1 -1
View File
@@ -20,7 +20,7 @@ export class TreoMockApiModule
* *
* @param mockDataServices * @param mockDataServices
*/ */
static forRoot(mockDataServices: any[]): ModuleWithProviders static forRoot(mockDataServices: any[]): ModuleWithProviders<TreoMockApiModule>
{ {
return { return {
ngModule : TreoMockApiModule, ngModule : TreoMockApiModule,
webapp/frontend/src/@treo/styles/main.scss
-1
View File
@@ -26,7 +26,6 @@
// 6. Overrides // 6. Overrides
@import 'overrides/angular-material'; @import 'overrides/angular-material';
@import 'overrides/fullcalendar';
@import 'overrides/highlightjs'; @import 'overrides/highlightjs';
@import 'overrides/perfect-scrollbar'; @import 'overrides/perfect-scrollbar';
@import 'overrides/quill'; @import 'overrides/quill';
webapp/frontend/src/@treo/styles/overrides/_fullcalendar.scss
-878
View File
@@ -1,878 +0,0 @@
// -----------------------------------------------------------------------------------------------------
// @ FullCalendar overrides
// -----------------------------------------------------------------------------------------------------
.fc {
.fc-view-container {
// Day Grid - Month view
.fc-view.fc-dayGridMonth-view {
.fc-head {
> tr > .fc-head-container {
border: none;
.fc-row {
.fc-day-header {
span {
display: flex;
align-items: center;
justify-content: center;
padding-top: 8px;
font-size: 12px;
font-weight: 500;
text-transform: uppercase;
}
}
}
}
}
.fc-body {
> tr > .fc-widget-content {
border: none;
.fc-day-grid {
.fc-week {
.fc-content-skeleton {
.fc-day-top {
text-align: center;
&.fc-other-month {
opacity: 1;
}
.fc-day-number {
display: inline-flex;
align-items: center;
justify-content: center;
width: 22px;
height: 21px;
margin: 4px 0;
font-size: 12px;
border-radius: 50%;
float: none;
}
}
.fc-event-container {
.fc-day-grid-event {
display: flex;
align-items: center;
height: 22px;
min-height: 22px;
max-height: 22px;
margin: 0 6px 4px 6px;
padding: 0 8px;
font-size: 12px;
border-radius: 4px;
border: none;
cursor: pointer;
@include treo-breakpoint('xs') {
padding: 0 5px;
}
}
}
.fc-more {
padding: 0 6px;
font-size: 12px;
font-weight: 500;
white-space: nowrap;
@include treo-breakpoint('xs') {
padding: 0 3px;
}
}
}
.fc-highlight-skeleton {
.fc-highlight {
position: relative;
}
}
}
}
}
}
.fc-popover {
&.fc-more-popover {
border: none;
border-radius: 4px;
@include treo-elevation('2xl');
.fc-header {
height: 32px;
min-height: 32px;
max-height: 32px;
padding: 0 8px;
.fc-title {
margin: 0;
padding: 0;
font-size: 12px;
}
}
.fc-body {
max-height: 160px;
overflow: hidden auto;
.fc-event-container {
padding: 8px;
.fc-day-grid-event {
display: flex;
align-items: center;
height: 22px;
min-height: 22px;
max-height: 22px;
margin: 0 0 6px 0;
padding: 0 8px;
font-size: 12px;
line-height: 1;
border-radius: 4px;
border: none;
cursor: pointer;
&:last-child {
margin-bottom: 0;
}
}
}
}
}
}
}
// Time Grid - Week view
.fc-view.fc-timeGridWeek-view {
.fc-head {
> tr > .fc-head-container {
border: none;
.fc-row {
.fc-axis {
width: 48px !important;
}
.fc-day-header {
span {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 100%;
&.fc-weekday {
padding-top: 16px;
font-size: 12px;
letter-spacing: 0.055em;
text-transform: uppercase;
font-weight: 400;
}
&.fc-date {
padding-bottom: 12px;
font-size: 26px;
font-weight: 300;
}
}
}
}
}
}
.fc-body {
> tr > .fc-widget-content {
border: none;
.fc-day-grid {
.fc-row {
min-height: 0;
.fc-bg {
.fc-axis {
width: 48px !important;
}
}
.fc-content-skeleton {
padding-bottom: 0;
.fc-axis {
width: 48px !important;
}
.fc-event-container {
.fc-day-grid-event {
display: flex;
align-items: center;
height: 22px;
min-height: 22px;
max-height: 22px;
margin: 0 6px 6px 6px;
padding: 0 8px;
font-size: 12px;
line-height: 1;
border-radius: 4px;
border: none;
cursor: pointer;
}
}
}
}
}
.fc-divider {
border: none;
}
.fc-time-grid {
.fc-bg {
.fc-axis {
border: none;
width: 48px !important;
+ .fc-day {
border: none;
}
}
}
.fc-slats {
.fc-axis {
width: 48px !important;
height: 48px;
text-align: center;
span {
font-size: 12px;
width: 48px;
min-width: 48px;
}
}
}
.fc-content-skeleton {
.fc-axis {
width: 48px !important;
}
.fc-event-container {
margin: 0 12px 0 0;
.fc-time-grid-event {
display: flex;
padding: 8px;
border-radius: 4px;
border: none;
cursor: pointer;
.fc-time,
.fc-title {
font-size: 12px;
}
}
}
}
}
}
}
}
// Time Grid - Day view
.fc-view.fc-timeGridDay-view {
.fc-head {
> tr > .fc-head-container {
border: none;
.fc-row {
.fc-axis {
width: 48px !important;
}
.fc-day-header {
span {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 100%;
&.fc-weekday {
padding-top: 16px;
font-size: 12px;
letter-spacing: 0.055em;
text-transform: uppercase;
font-weight: 400;
}
&.fc-date {
padding-bottom: 12px;
font-size: 26px;
font-weight: 300;
}
}
}
}
}
}
.fc-body {
> tr > .fc-widget-content {
border: none;
.fc-day-grid {
.fc-row {
min-height: 0;
.fc-bg {
.fc-axis {
width: 48px !important;
}
}
.fc-content-skeleton {
padding-bottom: 0;
.fc-axis {
width: 48px !important;
}
.fc-event-container {
.fc-day-grid-event {
display: flex;
align-items: center;
height: 22px;
min-height: 22px;
max-height: 22px;
margin: 0 6px 6px 6px;
padding: 0 8px;
font-size: 12px;
line-height: 1;
border-radius: 4px;
border: none;
cursor: pointer;
}
}
}
}
}
.fc-divider {
border: none;
}
.fc-time-grid {
.fc-bg {
.fc-axis {
border: none;
width: 48px !important;
+ .fc-day {
border: none;
}
}
}
.fc-slats {
.fc-axis {
width: 48px !important;
height: 48px;
text-align: center;
span {
font-size: 12px;
width: 48px;
min-width: 48px;
}
}
}
.fc-content-skeleton {
.fc-axis {
width: 48px !important;
}
.fc-event-container {
margin: 0 12px 0 0;
.fc-time-grid-event {
display: flex;
padding: 8px;
border-radius: 4px;
border: none;
cursor: pointer;
.fc-time,
.fc-title {
font-size: 12px;
}
}
}
}
}
}
}
}
// List - Year view
.fc-view.fc-listYear-view {
border: none;
.fc-list-table {
.fc-list-heading {
display: none;
}
.fc-list-item {
display: flex;
cursor: pointer;
td {
display: flex;
align-items: center;
width: auto;
height: 48px;
min-height: 48px;
padding: 0 8px;
border-width: 0 0 1px 0;
&.fc-list-item-date {
order: 1;
padding-left: 16px;
width: 120px;
min-width: 120px;
max-width: 120px;
@include treo-breakpoint('xs') {
width: 100px;
min-width: 100px;
max-width: 100px;
}
> span {
display: flex;
align-items: baseline;
span {
&:first-child {
display: flex;
justify-content: center;
padding-right: 8px;
width: 32px;
min-width: 32px;
max-width: 32px;
font-size: 18px;
@include treo-breakpoint('xs') {
padding-right: 2px;
}
+ span {
display: flex;
font-size: 11px;
font-weight: 500;
letter-spacing: 0.055em;
text-transform: uppercase;
}
}
}
}
}
&.fc-list-item-time {
flex: 0 0 auto;
order: 3;
width: 160px;
min-width: 160px;
max-width: 160px;
@include treo-breakpoint('xs') {
width: 120px;
min-width: 120px;
max-width: 120px;
}
}
&.fc-list-item-marker {
flex: 0 0 auto;
order: 2;
.fc-event-dot {
width: 12px;
height: 12px;
border-radius: 50%;
}
}
&.fc-list-item-title {
flex: 1 1 auto;
order: 4;
padding-right: 24px;
font-weight: 500;
}
}
}
}
}
}
// Day grid event - Dragging
.fc-day-grid-event {
&.fc-dragging,
&.fc-resizing {
display: flex;
align-items: center;
height: 22px;
min-height: 22px;
max-height: 22px;
margin: 0 6px 4px 6px;
padding: 0 8px;
font-size: 12px;
line-height: 1;
border-radius: 4px;
border: none;
}
}
}
// -----------------------------------------------------------------------------------------------------
// @ Theming
// -----------------------------------------------------------------------------------------------------
@include treo-theme {
$background: map-get($theme, background);
$foreground: map-get($theme, foreground);
$primary: map-get($theme, primary);
.fc {
.fc-view-container {
// Day Grid - Month view
.fc-view.fc-dayGridMonth-view {
.fc-head {
> tr > .fc-head-container {
.fc-row {
.fc-day-header {
border-color: map-get($foreground, divider);
span {
color: map-get($foreground, secondary-text);
}
}
}
}
}
.fc-body {
> tr > .fc-widget-content {
.fc-day-grid {
.fc-week {
.fc-bg {
.fc-day {
border-color: map-get($foreground, divider);
&.fc-today {
background: none;
}
}
}
.fc-content-skeleton {
.fc-day-top {
&.fc-other-month {
.fc-day-number {
color: map-get($foreground, hint-text);
}
}
&.fc-today {
.fc-day-number {
background: map-get($primary, default);
color: map-get($primary, default-contrast);
}
}
}
.fc-more {
color: map-get($foreground, secondary-text);
}
}
.fc-highlight-skeleton {
.fc-highlight {
background: treo-color('cool-gray', 100);
opacity: 1;
}
}
}
}
}
}
.fc-popover {
background: map-get($background, card);
&.fc-more-popover {
.fc-header {
background: map-get($background, hover);
}
}
}
}
// Time Grid - Week view
.fc-view.fc-timeGridWeek-view {
.fc-head {
> tr > .fc-head-container {
.fc-row {
.fc-axis {
border-color: map-get($foreground, divider);
}
.fc-day-header {
border-color: map-get($foreground, divider);
span {
color: map-get($foreground, secondary-text);
}
}
}
}
}
.fc-body {
> tr > .fc-widget-content {
border: none;
.fc-day-grid {
.fc-bg {
.fc-axis {
border-color: map-get($foreground, divider);
}
.fc-day {
border-color: map-get($foreground, divider);
&.fc-today {
background: none;
}
}
}
}
.fc-divider {
background: map-get($foreground, divider);
}
.fc-time-grid {
.fc-bg {
.fc-day {
border-color: map-get($foreground, divider);
&.fc-today {
background: none;
}
}
}
.fc-slats {
.fc-time {
border-color: map-get($foreground, divider);
}
.fc-widget-content {
border-color: map-get($foreground, divider);
}
}
}
}
}
}
// Time Grid - Day view
.fc-view.fc-timeGridDay-view {
.fc-head {
> tr > .fc-head-container {
.fc-row {
.fc-axis {
border-color: map-get($foreground, divider);
}
.fc-day-header {
border-color: map-get($foreground, divider);
span {
color: map-get($foreground, secondary-text);
}
}
}
}
}
.fc-body {
> tr > .fc-widget-content {
border: none;
.fc-day-grid {
.fc-bg {
.fc-axis {
border-color: map-get($foreground, divider);
}
.fc-day {
border-color: map-get($foreground, divider);
&.fc-today {
background: none;
}
}
}
}
.fc-divider {
background: map-get($foreground, divider);
}
.fc-time-grid {
.fc-bg {
.fc-day {
border-color: map-get($foreground, divider);
&.fc-today {
background: none;
}
}
}
.fc-slats {
.fc-time {
border-color: map-get($foreground, divider);
}
.fc-widget-content {
border-color: map-get($foreground, divider);
}
}
}
}
}
}
// List - Year view
.fc-view.fc-listYear-view {
.fc-list-table {
.fc-list-item {
&:hover {
td {
background-color: map-get($background, hover);
}
}
td {
border-color: map-get($foreground, divider);
&.fc-list-item-date {
> span {
span {
&:first-child {
+ span {
color: map-get($foreground, secondary-text);
}
}
}
}
}
}
}
}
}
}
}
}
webapp/frontend/src/app/core/config/app.config.ts
+6
View File
@@ -10,6 +10,8 @@ export type DashboardSort = 'status' | 'title' | 'age'
export type TemperatureUnit = 'celsius' | 'fahrenheit' export type TemperatureUnit = 'celsius' | 'fahrenheit'
export type LineStroke = 'smooth' | 'straight' | 'stepline'
export enum MetricsNotifyLevel { export enum MetricsNotifyLevel {
Warn = 1, Warn = 1,
@@ -45,6 +47,8 @@ export interface AppConfig {
file_size_si_units?: boolean; file_size_si_units?: boolean;
line_stroke?: LineStroke;
// Settings from Scrutiny API // Settings from Scrutiny API
metrics?: { metrics?: {
@@ -73,6 +77,8 @@ export const appConfig: AppConfig = {
temperature_unit: 'celsius', temperature_unit: 'celsius',
file_size_si_units: false, file_size_si_units: false,
line_stroke: 'smooth',
metrics: { metrics: {
notify_level: MetricsNotifyLevel.Fail, notify_level: MetricsNotifyLevel.Fail,
status_filter_attributes: MetricsStatusFilterAttributes.All, status_filter_attributes: MetricsStatusFilterAttributes.All,
webapp/frontend/src/app/core/config/scrutiny-config.module.ts
+1 -1
View File
@@ -19,7 +19,7 @@ export class ScrutinyConfigModule {
* *
* @param config * @param config
*/ */
static forRoot(config: any): ModuleWithProviders { static forRoot(config: any): ModuleWithProviders<ScrutinyConfigModule> {
return { return {
ngModule: ScrutinyConfigModule, ngModule: ScrutinyConfigModule,
providers: [ providers: [
webapp/frontend/src/app/layout/common/dashboard-device/dashboard-device.component.ts
+1 -1
View File
@@ -32,7 +32,7 @@ export class DashboardDeviceComponent implements OnInit {
config: AppConfig; config: AppConfig;
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
readonly humanizeDuration = humanizeDuration; readonly humanizeDuration = humanizeDuration;
webapp/frontend/src/app/layout/common/dashboard-settings/dashboard-settings.component.html
+11
View File
@@ -53,6 +53,17 @@
</mat-form-field> </mat-form-field>
</div> </div>
<div class="flex flex-col mt-5 gt-md:flex-row">
<mat-form-field class="flex-auto gt-xs:pr-3 gt-md:pr-3">
<mat-label>Line stroke</mat-label>
<mat-select [(ngModel)]="lineStroke">
<mat-option value="smooth">Smooth</mat-option>
<mat-option value="straight">Straight</mat-option>
<mat-option value="stepline">Stepline</mat-option>
</mat-select>
</mat-form-field>
</div>
<div class="flex flex-col mt-5 gt-md:flex-row"> <div class="flex flex-col mt-5 gt-md:flex-row">
<mat-form-field class="flex-auto gt-xs:pr-3 gt-md:pr-3"> <mat-form-field class="flex-auto gt-xs:pr-3 gt-md:pr-3">
<mat-label>Device Status - Thresholds</mat-label> <mat-label>Device Status - Thresholds</mat-label>
webapp/frontend/src/app/layout/common/dashboard-settings/dashboard-settings.component.ts
+5 -1
View File
@@ -6,6 +6,7 @@ import {
MetricsStatusFilterAttributes, MetricsStatusFilterAttributes,
MetricsStatusThreshold, MetricsStatusThreshold,
TemperatureUnit, TemperatureUnit,
LineStroke,
Theme Theme
} from 'app/core/config/app.config'; } from 'app/core/config/app.config';
import {ScrutinyConfigService} from 'app/core/config/scrutiny-config.service'; import {ScrutinyConfigService} from 'app/core/config/scrutiny-config.service';
@@ -23,12 +24,13 @@ export class DashboardSettingsComponent implements OnInit {
dashboardSort: string; dashboardSort: string;
temperatureUnit: string; temperatureUnit: string;
fileSizeSIUnits: boolean; fileSizeSIUnits: boolean;
lineStroke: string;
theme: string; theme: string;
statusThreshold: number; statusThreshold: number;
statusFilterAttributes: number; statusFilterAttributes: number;
// Private // Private
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
constructor( constructor(
private _configService: ScrutinyConfigService, private _configService: ScrutinyConfigService,
@@ -48,6 +50,7 @@ export class DashboardSettingsComponent implements OnInit {
this.dashboardSort = config.dashboard_sort; this.dashboardSort = config.dashboard_sort;
this.temperatureUnit = config.temperature_unit; this.temperatureUnit = config.temperature_unit;
this.fileSizeSIUnits = config.file_size_si_units; this.fileSizeSIUnits = config.file_size_si_units;
this.lineStroke = config.line_stroke;
this.theme = config.theme; this.theme = config.theme;
this.statusFilterAttributes = config.metrics.status_filter_attributes; this.statusFilterAttributes = config.metrics.status_filter_attributes;
@@ -63,6 +66,7 @@ export class DashboardSettingsComponent implements OnInit {
dashboard_sort: this.dashboardSort as DashboardSort, dashboard_sort: this.dashboardSort as DashboardSort,
temperature_unit: this.temperatureUnit as TemperatureUnit, temperature_unit: this.temperatureUnit as TemperatureUnit,
file_size_si_units: this.fileSizeSIUnits, file_size_si_units: this.fileSizeSIUnits,
line_stroke: this.lineStroke as LineStroke,
theme: this.theme as Theme, theme: this.theme as Theme,
metrics: { metrics: {
status_filter_attributes: this.statusFilterAttributes as MetricsStatusFilterAttributes, status_filter_attributes: this.statusFilterAttributes as MetricsStatusFilterAttributes,
webapp/frontend/src/app/layout/common/search/search.component.ts
+1 -1
View File
@@ -35,7 +35,7 @@ export class SearchComponent implements OnInit, OnDestroy
// Private // Private
private _appearance: 'basic' | 'bar'; private _appearance: 'basic' | 'bar';
private _opened: boolean; private _opened: boolean;
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
/** /**
* Constructor * Constructor
webapp/frontend/src/app/layout/layout.component.ts
+1 -1
View File
@@ -21,7 +21,7 @@ export class LayoutComponent implements OnInit, OnDestroy {
theme: Theme; theme: Theme;
// Private // Private
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
private systemPrefersDark: boolean; private systemPrefersDark: boolean;
/** /**
webapp/frontend/src/app/layout/layouts/empty/empty.component.ts
+1 -1
View File
@@ -10,7 +10,7 @@ import { Subject } from 'rxjs';
export class EmptyLayoutComponent implements OnInit, OnDestroy export class EmptyLayoutComponent implements OnInit, OnDestroy
{ {
// Private // Private
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
/** /**
* Constructor * Constructor
webapp/frontend/src/app/layout/layouts/horizontal/material/material.component.ts
+1 -1
View File
@@ -25,7 +25,7 @@ export class MaterialLayoutComponent implements OnInit, OnDestroy
fixedFooter: boolean; fixedFooter: boolean;
// Private // Private
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
/** /**
* Constructor * Constructor
webapp/frontend/src/app/modules/dashboard/dashboard.component.ts
+5 -5
View File
@@ -36,7 +36,7 @@ export class DashboardComponent implements OnInit, AfterViewInit, OnDestroy
config: AppConfig; config: AppConfig;
// Private // Private
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
@ViewChild('tempChart', { static: false }) tempChart: ChartComponent; @ViewChild('tempChart', { static: false }) tempChart: ChartComponent;
/** /**
@@ -193,15 +193,15 @@ export class DashboardComponent implements OnInit, AfterViewInit, OnDestroy
enabled: true enabled: true
} }
}, },
colors : ['#A3BFFA', '#667EEA'], colors : ['#667eea', '#9066ea', '#66c0ea', '#66ead2', '#d266ea', '#66ea90'],
fill : { fill : {
colors : ['#CED9FB', '#AECDFD'], colors : ['#b2bef4', '#c7b2f4', '#b2dff4', '#b2f4e8', '#e8b2f4', '#b2f4c7'],
opacity: 0.5, opacity: 0.5,
type : 'solid' type : 'gradient'
}, },
series : this._deviceDataTemperatureSeries(), series : this._deviceDataTemperatureSeries(),
stroke : { stroke : {
curve: 'straight', curve: this.config.line_stroke,
width: 2 width: 2
}, },
tooltip: { tooltip: {
webapp/frontend/src/app/modules/detail/detail.component.ts
+1 -1
View File
@@ -85,7 +85,7 @@ export class DetailComponent implements OnInit, AfterViewInit, OnDestroy {
smartAttributeTableMatSort: MatSort; smartAttributeTableMatSort: MatSort;
// Private // Private
private _unsubscribeAll: Subject<any>; private _unsubscribeAll: Subject<void>;
private systemPrefersDark: boolean; private systemPrefersDark: boolean;
readonly humanizeDuration = humanizeDuration; readonly humanizeDuration = humanizeDuration;
webapp/frontend/src/styles/vendors.scss
-6
View File
@@ -7,12 +7,6 @@
// that Treo doesn't support out-of-the-box visually compatible with your application. // that Treo doesn't support out-of-the-box visually compatible with your application.
// ----------------------------------------------------------------------------------------------------- // -----------------------------------------------------------------------------------------------------
// FullCalendar
@import '~@fullcalendar/core/main.css';
@import '~@fullcalendar/daygrid/main.css';
@import '~@fullcalendar/timegrid/main.css';
@import '~@fullcalendar/list/main.css';
// Perfect scrollbar // Perfect scrollbar
@import '~perfect-scrollbar/css/perfect-scrollbar.css'; @import '~perfect-scrollbar/css/perfect-scrollbar.css';