diff --git a/frontend/package-lock.json b/frontend/package-lock.json index aa448e2..a9bfceb 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -19,6 +19,7 @@ "@angular/platform-browser-dynamic": "~13.2.0", "@angular/router": "~13.2.0", "bootstrap": "^5.1.3", + "ngx-cron-editor": "^0.7.3", "rxjs": "~7.5.0", "tslib": "^2.3.0", "zone.js": "~0.11.4" @@ -7890,6 +7891,24 @@ "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==", "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": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/nice-napi/-/nice-napi-1.0.2.tgz", @@ -17247,6 +17266,14 @@ "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==", "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": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/nice-napi/-/nice-napi-1.0.2.tgz", diff --git a/frontend/package.json b/frontend/package.json index fba736a..9cdd286 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -21,6 +21,7 @@ "@angular/platform-browser-dynamic": "~13.2.0", "@angular/router": "~13.2.0", "bootstrap": "^5.1.3", + "ngx-cron-editor": "^0.7.3", "rxjs": "~7.5.0", "tslib": "^2.3.0", "zone.js": "~0.11.4" diff --git a/frontend/src/app/Services/profile.service.ts b/frontend/src/app/Services/profile.service.ts index b23a9b3..87cf603 100644 --- a/frontend/src/app/Services/profile.service.ts +++ b/frontend/src/app/Services/profile.service.ts @@ -66,4 +66,23 @@ export class ProfileService { } ); } + + /** + * @param {string} cronString + * @returns Observable + */ + public addCronString(cron: string): Observable { + return this.http.put( + 'https://gruppe1.testsites.info/api/user' + '/setCron', + { + cron, + }, + { + headers: new HttpHeaders({ + 'Content-Type': 'application/json', + Authorization: 'Bearer ' + this.tokenStorage.getToken(), + }), + } + ); + } } diff --git a/frontend/src/app/Views/bot-settings/bot-settings.component.html b/frontend/src/app/Views/bot-settings/bot-settings.component.html index 8318bb9..3d84d5d 100644 --- a/frontend/src/app/Views/bot-settings/bot-settings.component.html +++ b/frontend/src/app/Views/bot-settings/bot-settings.component.html @@ -24,6 +24,10 @@ /> + *To add a keyword, after writing, either press enter or click outside + of keyword input field. @@ -52,6 +56,10 @@ /> + *To add a share, after writing, either press enter or click outside + of keyword input field. diff --git a/frontend/src/app/Views/header/header.component.html b/frontend/src/app/Views/header/header.component.html index ecf3ffb..de809aa 100644 --- a/frontend/src/app/Views/header/header.component.html +++ b/frontend/src/app/Views/header/header.component.html @@ -3,24 +3,23 @@ + + - - - - - diff --git a/frontend/src/app/Views/profile/confirmation-dialog/confirmation-dialog.component.html b/frontend/src/app/Views/profile/confirmation-dialog/confirmation-dialog.component.html index 8bda1c1..39646f0 100644 --- a/frontend/src/app/Views/profile/confirmation-dialog/confirmation-dialog.component.html +++ b/frontend/src/app/Views/profile/confirmation-dialog/confirmation-dialog.component.html @@ -1,7 +1,7 @@
-

Aktion bestätigen

+

Confirm Action

- Sind sie sicher, dass sie diese Handlung abschließen wollen? + Are you sure, that you want to continue?
diff --git a/frontend/src/app/Views/profile/help-dialog/help-dialog.component.html b/frontend/src/app/Views/profile/help-dialog/help-dialog.component.html new file mode 100644 index 0000000..b6bafef --- /dev/null +++ b/frontend/src/app/Views/profile/help-dialog/help-dialog.component.html @@ -0,0 +1,23 @@ +
+

How to add your Telegram account

+
+ To get your UserId, you have to write "/id" or "/auth" to the bot on + Telegram. (https://t.me/projektaktienbot)) +
+ +
diff --git a/frontend/src/app/Views/profile/help-dialog/help-dialog.component.scss b/frontend/src/app/Views/profile/help-dialog/help-dialog.component.scss new file mode 100644 index 0000000..980b5a6 --- /dev/null +++ b/frontend/src/app/Views/profile/help-dialog/help-dialog.component.scss @@ -0,0 +1,18 @@ +.footer-buttons { + width: 100%; + text-align: center; +} + +.spacer { + flex-grow: 1; + width: 5%; +} + +.inner { + display: inline-block; + width: 100%; +} + +.content { + height: 80%; +} diff --git a/frontend/src/app/Views/profile/help-dialog/help-dialog.component.spec.ts b/frontend/src/app/Views/profile/help-dialog/help-dialog.component.spec.ts new file mode 100644 index 0000000..b7230c7 --- /dev/null +++ b/frontend/src/app/Views/profile/help-dialog/help-dialog.component.spec.ts @@ -0,0 +1,25 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { HelpDialogComponent } from './help-dialog.component'; + +describe('HelpDialogComponent', () => { + let component: HelpDialogComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ HelpDialogComponent ] + }) + .compileComponents(); + }); + + beforeEach(() => { + fixture = TestBed.createComponent(HelpDialogComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/frontend/src/app/Views/profile/help-dialog/help-dialog.component.ts b/frontend/src/app/Views/profile/help-dialog/help-dialog.component.ts new file mode 100644 index 0000000..3632492 --- /dev/null +++ b/frontend/src/app/Views/profile/help-dialog/help-dialog.component.ts @@ -0,0 +1,14 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-help-dialog', + templateUrl: './help-dialog.component.html', + styleUrls: ['./help-dialog.component.scss'], +}) +export class HelpDialogComponent implements OnInit { + constructor() {} + + ngOnInit(): void {} + + close() {} +} diff --git a/frontend/src/app/Views/profile/profile.component.html b/frontend/src/app/Views/profile/profile.component.html index 37a5180..d70e1b2 100644 --- a/frontend/src/app/Views/profile/profile.component.html +++ b/frontend/src/app/Views/profile/profile.component.html @@ -1,6 +1,6 @@ - - - + + + Profile Information
- - - Add Telegram Id + + + + Connect Telegram Account +
+ + + + + + + + Add automatic updates + + +
+ + +
diff --git a/frontend/src/app/Views/profile/profile.component.scss b/frontend/src/app/Views/profile/profile.component.scss index d30d37b..bb0d72f 100644 --- a/frontend/src/app/Views/profile/profile.component.scss +++ b/frontend/src/app/Views/profile/profile.component.scss @@ -4,7 +4,7 @@ .card { width: 90%; - height: 80%; + height: 90%; margin: 5%; } @@ -20,3 +20,16 @@ mat-grid { width: 100%; height: 100%; } + +.placeholder { + height: 95%; +} + +.placeholderRHS { + height: 90%; +} + +.cron-content { + height: 70%; + overflow: auto; +} diff --git a/frontend/src/app/Views/profile/profile.component.ts b/frontend/src/app/Views/profile/profile.component.ts index 795d4ba..babeb6f 100644 --- a/frontend/src/app/Views/profile/profile.component.ts +++ b/frontend/src/app/Views/profile/profile.component.ts @@ -1,8 +1,10 @@ import { Component, OnInit } from '@angular/core'; import { FormControl, PatternValidator, Validators } from '@angular/forms'; import { MatDialog } from '@angular/material/dialog'; +import { CronOptions } from 'ngx-cron-editor'; import { ProfileService } from 'src/app/Services/profile.service'; import { ConfirmationDialogComponent } from './confirmation-dialog/confirmation-dialog.component'; +import { HelpDialogComponent } from './help-dialog/help-dialog.component'; @Component({ selector: 'app-profile', @@ -30,6 +32,26 @@ export class ProfileComponent implements OnInit { 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 { this.profileService.getUserData().subscribe((result) => { console.log(result); @@ -75,4 +97,19 @@ export class ProfileComponent implements OnInit { } }); } + + setCronString() { + this.profileService + .addCronString(this.cronForm.value) + .subscribe((result) => { + console.log(result); + }); + } + + openHelp() { + const dialogRef = this.dialog.open(HelpDialogComponent, { + width: '50vw', + height: '20vh', + }); + } } diff --git a/frontend/src/app/app.module.ts b/frontend/src/app/app.module.ts index 958f243..c364c03 100644 --- a/frontend/src/app/app.module.ts +++ b/frontend/src/app/app.module.ts @@ -14,6 +14,8 @@ import { MatDialogModule } from '@angular/material/dialog'; import { MatInputModule } from '@angular/material/input'; import { MatChipsModule } from '@angular/material/chips'; +import { CronEditorModule } from 'ngx-cron-editor'; + import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component'; import { LoginComponent } from './Views/login/login.component'; @@ -25,6 +27,7 @@ import { ProfileComponent } from './Views/profile/profile.component'; import { BotSettingsComponent } from './Views/bot-settings/bot-settings.component'; import { UserDialogComponent } from './Views/dashboard/user-dialog/user-dialog.component'; import { ConfirmationDialogComponent } from './Views/profile/confirmation-dialog/confirmation-dialog.component'; +import { HelpDialogComponent } from './Views/profile/help-dialog/help-dialog.component'; @NgModule({ declarations: [ @@ -37,6 +40,7 @@ import { ConfirmationDialogComponent } from './Views/profile/confirmation-dialog BotSettingsComponent, UserDialogComponent, ConfirmationDialogComponent, + HelpDialogComponent, ], imports: [ BrowserModule, @@ -55,6 +59,7 @@ import { ConfirmationDialogComponent } from './Views/profile/confirmation-dialog MatInputModule, ReactiveFormsModule, MatChipsModule, + CronEditorModule, ], providers: [], bootstrap: [AppComponent],