Add cron configurator

This commit is contained in:
kevinpauer 2022-04-25 19:19:40 +02:00
parent 462bafbb2e
commit 93fc314c15
7 changed files with 123 additions and 6 deletions

View File

@ -19,6 +19,7 @@
"@angular/platform-browser-dynamic": "~13.2.0", "@angular/platform-browser-dynamic": "~13.2.0",
"@angular/router": "~13.2.0", "@angular/router": "~13.2.0",
"bootstrap": "^5.1.3", "bootstrap": "^5.1.3",
"ngx-cron-editor": "^0.7.3",
"rxjs": "~7.5.0", "rxjs": "~7.5.0",
"tslib": "^2.3.0", "tslib": "^2.3.0",
"zone.js": "~0.11.4" "zone.js": "~0.11.4"
@ -7869,6 +7870,24 @@
"integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==", "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==",
"dev": true "dev": true
}, },
"node_modules/ngx-cron-editor": {
"version": "0.7.3",
"resolved": "https://registry.npmjs.org/ngx-cron-editor/-/ngx-cron-editor-0.7.3.tgz",
"integrity": "sha512-ICrikARGU5HJ9hZ8H4aGkKZP/T3U9Ym/2rIpS2wjimB3ASypp/8pAm6cEqaaJ5IHbSjgZBHEMeoomVkTa15l2g==",
"dependencies": {
"tslib": "^2.0.0"
},
"peerDependencies": {
"@angular/animations": "^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0 || ^10.0.0 || ^11.0.0 || ^12.0.0 || ^13.0.0",
"@angular/common": "^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0 || ^10.0.0 || ^11.0.0 || ^12.0.0 || ^13.0.0",
"@angular/core": "^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0 || ^10.0.0 || ^11.0.0 || ^12.0.0 || ^13.0.0",
"@angular/forms": "^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0 || ^10.0.0 || ^11.0.0 || ^12.0.0 || ^13.0.0",
"@angular/material": "^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0 || ^10.0.0 || ^11.0.0 || ^12.0.0 || ^13.0.0",
"@angular/platform-browser": "^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0 || ^10.0.0 || ^11.0.0 || ^12.0.0 || ^13.0.0",
"@angular/platform-browser-dynamic": "^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0 || ^10.0.0 || ^11.0.0 || ^12.0.0 || ^13.0.0",
"@angular/router": "^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0 || ^10.0.0 || ^11.0.0 || ^12.0.0 || ^13.0.0"
}
},
"node_modules/nice-napi": { "node_modules/nice-napi": {
"version": "1.0.2", "version": "1.0.2",
"resolved": "https://registry.npmjs.org/nice-napi/-/nice-napi-1.0.2.tgz", "resolved": "https://registry.npmjs.org/nice-napi/-/nice-napi-1.0.2.tgz",
@ -17215,6 +17234,14 @@
"integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==", "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==",
"dev": true "dev": true
}, },
"ngx-cron-editor": {
"version": "0.7.3",
"resolved": "https://registry.npmjs.org/ngx-cron-editor/-/ngx-cron-editor-0.7.3.tgz",
"integrity": "sha512-ICrikARGU5HJ9hZ8H4aGkKZP/T3U9Ym/2rIpS2wjimB3ASypp/8pAm6cEqaaJ5IHbSjgZBHEMeoomVkTa15l2g==",
"requires": {
"tslib": "^2.0.0"
}
},
"nice-napi": { "nice-napi": {
"version": "1.0.2", "version": "1.0.2",
"resolved": "https://registry.npmjs.org/nice-napi/-/nice-napi-1.0.2.tgz", "resolved": "https://registry.npmjs.org/nice-napi/-/nice-napi-1.0.2.tgz",

View File

@ -21,6 +21,7 @@
"@angular/platform-browser-dynamic": "~13.2.0", "@angular/platform-browser-dynamic": "~13.2.0",
"@angular/router": "~13.2.0", "@angular/router": "~13.2.0",
"bootstrap": "^5.1.3", "bootstrap": "^5.1.3",
"ngx-cron-editor": "^0.7.3",
"rxjs": "~7.5.0", "rxjs": "~7.5.0",
"tslib": "^2.3.0", "tslib": "^2.3.0",
"zone.js": "~0.11.4" "zone.js": "~0.11.4"

View File

@ -66,4 +66,23 @@ export class ProfileService {
} }
); );
} }
/**
* @param {string} cronString
* @returns Observable
*/
public addCronString(cron: string): Observable<any> {
return this.http.put(
'https://gruppe1.testsites.info/api/user' + '/setCron',
{
cron,
},
{
headers: new HttpHeaders({
'Content-Type': 'application/json',
Authorization: 'Bearer ' + this.tokenStorage.getToken(),
}),
}
);
}
} }

View File

@ -1,6 +1,6 @@
<mat-grid-list cols="2"> <mat-grid-list cols="2" rowHeight="45%">
<mat-grid-tile> <mat-grid-tile colspan="1" rowspan="2">
<mat-card class="card"> <mat-card class="card placeholder">
<mat-card-title class="card-title">Profile Information</mat-card-title> <mat-card-title class="card-title">Profile Information</mat-card-title>
<mat-card-content> <mat-card-content>
<form <form
@ -95,8 +95,8 @@
</mat-card-content> </mat-card-content>
</mat-card> </mat-card>
</mat-grid-tile> </mat-grid-tile>
<mat-grid-tile> <mat-grid-tile colspan="1" rowspan="1">
<mat-card class="card"> <mat-card class="card placeholderRHS">
<mat-card-title class="card-title"> <mat-card-title class="card-title">
<span>Connect Telegram Account</span> <span>Connect Telegram Account</span>
</mat-card-title> </mat-card-title>
@ -137,4 +137,29 @@
</mat-card-content> </mat-card-content>
</mat-card> </mat-card>
</mat-grid-tile> </mat-grid-tile>
<mat-grid-tile colspan="1" rowspan="1">
<mat-card class="card placeholderRHS">
<mat-card-title class="card-title">
<span>Add automatic updates</span>
</mat-card-title>
<mat-card-content class="cron-content">
<form
name="form"
(ngSubmit)="f.form.valid && setCronString()"
#f="ngForm"
novalidate
class="backgorund form"
>
<cron-editor
class="cron-editor"
[formControl]="cronForm"
[options]="cronOptions"
></cron-editor>
<div class="form-group footer-buttons">
<button class="btn btn-primary btn-block">Add</button>
</div>
</form>
</mat-card-content>
</mat-card>
</mat-grid-tile>
</mat-grid-list> </mat-grid-list>

View File

@ -4,7 +4,7 @@
.card { .card {
width: 90%; width: 90%;
height: 80%; height: 90%;
margin: 5%; margin: 5%;
} }
@ -20,3 +20,16 @@ mat-grid {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.placeholder {
height: 95%;
}
.placeholderRHS {
height: 90%;
}
.cron-content {
height: 70%;
overflow: auto;
}

View File

@ -1,6 +1,7 @@
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from '@angular/core';
import { FormControl, PatternValidator, Validators } from '@angular/forms'; import { FormControl, PatternValidator, Validators } from '@angular/forms';
import { MatDialog } from '@angular/material/dialog'; import { MatDialog } from '@angular/material/dialog';
import { CronOptions } from 'ngx-cron-editor';
import { ProfileService } from 'src/app/Services/profile.service'; import { ProfileService } from 'src/app/Services/profile.service';
import { ConfirmationDialogComponent } from './confirmation-dialog/confirmation-dialog.component'; import { ConfirmationDialogComponent } from './confirmation-dialog/confirmation-dialog.component';
import { HelpDialogComponent } from './help-dialog/help-dialog.component'; import { HelpDialogComponent } from './help-dialog/help-dialog.component';
@ -31,6 +32,26 @@ export class ProfileComponent implements OnInit {
public dialog: MatDialog public dialog: MatDialog
) {} ) {}
cronForm = new FormControl('0 0 1/1 * *');
public cronOptions: CronOptions = {
defaultTime: '00:00:00',
hideMinutesTab: true,
hideHourlyTab: true,
hideDailyTab: false,
hideWeeklyTab: true,
hideMonthlyTab: true,
hideYearlyTab: true,
hideAdvancedTab: true,
hideSpecificWeekDayTab: true,
hideSpecificMonthWeekTab: true,
use24HourTime: true,
hideSeconds: true,
cronFlavor: 'quartz', //standard or quartz
};
ngOnInit(): void { ngOnInit(): void {
this.profileService.getUserData().subscribe((result) => { this.profileService.getUserData().subscribe((result) => {
console.log(result); console.log(result);
@ -77,6 +98,14 @@ export class ProfileComponent implements OnInit {
}); });
} }
setCronString() {
this.profileService
.addCronString(this.cronForm.value)
.subscribe((result) => {
console.log(result);
});
}
openHelp() { openHelp() {
const dialogRef = this.dialog.open(HelpDialogComponent, { const dialogRef = this.dialog.open(HelpDialogComponent, {
width: '50vw', width: '50vw',

View File

@ -14,6 +14,8 @@ import { MatDialogModule } from '@angular/material/dialog';
import { MatInputModule } from '@angular/material/input'; import { MatInputModule } from '@angular/material/input';
import { MatChipsModule } from '@angular/material/chips'; import { MatChipsModule } from '@angular/material/chips';
import { CronEditorModule } from 'ngx-cron-editor';
import { AppRoutingModule } from './app-routing.module'; import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component'; import { AppComponent } from './app.component';
import { LoginComponent } from './Views/login/login.component'; import { LoginComponent } from './Views/login/login.component';
@ -57,6 +59,7 @@ import { HelpDialogComponent } from './Views/profile/help-dialog/help-dialog.com
MatInputModule, MatInputModule,
ReactiveFormsModule, ReactiveFormsModule,
MatChipsModule, MatChipsModule,
CronEditorModule,
], ],
providers: [], providers: [],
bootstrap: [AppComponent], bootstrap: [AppComponent],