From d62f816df3fbcb8282ae5a63ddaa51fec6ffea58 Mon Sep 17 00:00:00 2001 From: Rumperuu Date: Thu, 25 Mar 2021 13:55:42 +0000 Subject: [PATCH] Add topic creation, subscription editing --- src/app/dashboard/dashboard.module.ts | 2 + src/app/dashboard/dashboard.routing.ts | 5 +- .../subscriptions-edit.component.html | 62 +++++++++++++++ .../dashboard/subscriptions-edit.component.ts | 76 +++++++++++++++++++ src/app/dashboard/topics-edit.component.html | 2 +- src/app/dashboard/topics-edit.component.ts | 2 +- src/app/layouts/full-layout.component.html | 8 ++ src/app/providers/api-service.ts | 18 +++++ src/app/service/messaging.service.ts | 1 + src/scss/_custom.scss | 4 + 10 files changed, 176 insertions(+), 4 deletions(-) create mode 100644 src/app/dashboard/subscriptions-edit.component.html create mode 100644 src/app/dashboard/subscriptions-edit.component.ts diff --git a/src/app/dashboard/dashboard.module.ts b/src/app/dashboard/dashboard.module.ts index fe9a5e5..a821ab5 100644 --- a/src/app/dashboard/dashboard.module.ts +++ b/src/app/dashboard/dashboard.module.ts @@ -16,6 +16,7 @@ import { AccountEditComponent } from './account-edit.component'; import { AddDataComponent } from './add-data.component'; import { FeedbackComponent } from './feedback.component'; import { TopicsEditComponent } from './topics-edit.component'; +import { SubscriptionsUpdateComponent } from './subscriptions-edit.component'; import { SendPushNotificationComponent } from './send-push-notification.component'; import { TransactionLogComponent } from './transaction-log.component'; import { CategoryMonthComponent } from './category-month.component'; @@ -88,6 +89,7 @@ import { environment } from '../../environments/environment'; TrailMapComponent, FeedbackComponent, TopicsEditComponent, + SubscriptionsUpdateComponent, SendPushNotificationComponent, GraphWidget, OrgBarSnippetComponent, diff --git a/src/app/dashboard/dashboard.routing.ts b/src/app/dashboard/dashboard.routing.ts index 332b7ed..c31ab8e 100644 --- a/src/app/dashboard/dashboard.routing.ts +++ b/src/app/dashboard/dashboard.routing.ts @@ -20,6 +20,7 @@ import { TrailMapComponent } from './trail-map.component'; import { MoreStuffComponent } from './more-graphs-and-tables.component'; import { SuppliersComponent } from './suppliers.component'; import { TopicsEditComponent } from './topics-edit.component'; +import { SubscriptionsUpdateComponent } from './subscriptions-edit.component'; import { SendPushNotificationComponent } from './send-push-notification.component'; // Using child path to allow for FullLayout theming @@ -64,8 +65,8 @@ const routes: Routes = [ }, { path: 'edit-subscriptions', - component: SubscriptionsEditComponent, - data: { title: 'Edit Subscriptions' }, + component: SubscriptionsUpdateComponent, + data: { title: 'Update Subscriptions' }, }, { path: 'leaderboard', diff --git a/src/app/dashboard/subscriptions-edit.component.html b/src/app/dashboard/subscriptions-edit.component.html new file mode 100644 index 0000000..9186f3a --- /dev/null +++ b/src/app/dashboard/subscriptions-edit.component.html @@ -0,0 +1,62 @@ +
+
+
+
+
+ View Subscriptions + Required Data marked in bold. +
+
+
+
+
+
+
+ + +
+
+
+ + +
+
+
+
+ + +
+
+
+
+ +
+
+
+
+
diff --git a/src/app/dashboard/subscriptions-edit.component.ts b/src/app/dashboard/subscriptions-edit.component.ts new file mode 100644 index 0000000..e6a3774 --- /dev/null +++ b/src/app/dashboard/subscriptions-edit.component.ts @@ -0,0 +1,76 @@ +import { Component, OnInit } from '@angular/core'; +import { FormControl, FormGroup, Validators, FormArray, FormBuilder } from '@angular/forms'; +import { ApiService } from '../providers/api-service'; + +@Component({ + templateUrl: 'subscriptions-edit.component.html', +}) +export class SubscriptionsUpdateComponent implements OnInit { + updateSubscriptionsForm: FormGroup; + updateSubscriptionsFormStatus: string; + updateSubscriptionsFormStatusSuccess: string; + updateSubscriptionsFormStatusError = 'Error received, please try again.'; + topicList: any; + topicIdList: any; + + get topicsFormArray() { + return this.updateSubscriptionsForm.controls.topicSubscriptions as FormArray; + } + + constructor(private api: ApiService, private formBuilder: FormBuilder) { + this.api.getTopicsAndSubscriptions().subscribe( + result => { + if (result.topics.length > 0) { + this.topicList = result.topics; + this.topicIdList = Object.keys(this.topicList); + + this.topicList.forEach((topic) => this.topicsFormArray.push(new FormControl({ + id: topic.id, + name: topic.name, + isSubscribed: !!topic.isSubscribed + }))); + } else { + console.warn('No topics returned from server'); + } + }, + error => { + console.error('Couldn\'t get topics'); + console.error(error._body); + } + ); + + this.updateSubscriptionsForm = this.formBuilder.group({ + topicSubscriptions: new FormArray([]) + }); + } + + ngOnInit(): void { + } + + onCheckChange(event): void { + const topicIndex = this.topicsFormArray.value.findIndex((obj => obj.id == event.target.id)); + this.topicsFormArray.value[topicIndex].isSubscribed = !this.topicsFormArray.value[topicIndex].isSubscribed; + } + + onSubmit(): void { + console.debug(this.updateSubscriptionsForm.controls.topicSubscriptions.value); + + this.api + .updateSubscriptions({ topicSubscriptions: this.updateSubscriptionsForm.controls.topicSubscriptions.value }) + .subscribe( + results => { + console.debug('Subscriptions successfully updated.'); + this.updateSubscriptionsFormStatus = 'success'; + }, + error => { + console.error('Subscriptions update failed.'); + try { + this.updateSubscriptionsFormStatusError = '"' + error.error.error + '" Error, ' + error.error.message; + } catch (e) { + this.updateSubscriptionsFormStatusError = 'There was a server error, please try again later.'; + } + this.updateSubscriptionsFormStatus = 'update_failed'; + } + ); + } +} diff --git a/src/app/dashboard/topics-edit.component.html b/src/app/dashboard/topics-edit.component.html index 7fa0dce..369a081 100644 --- a/src/app/dashboard/topics-edit.component.html +++ b/src/app/dashboard/topics-edit.component.html @@ -20,7 +20,7 @@ - diff --git a/src/app/dashboard/topics-edit.component.ts b/src/app/dashboard/topics-edit.component.ts index 16ad43e..c060c1f 100644 --- a/src/app/dashboard/topics-edit.component.ts +++ b/src/app/dashboard/topics-edit.component.ts @@ -5,7 +5,7 @@ import { ApiService } from '../providers/api-service'; @Component({ templateUrl: 'topics-edit.component.html', }) -export class TopicsEditComponen { +export class TopicsEditComponent { createTopicForm: FormGroup; loggedInEmail: string; createTopicFormStatus: string; diff --git a/src/app/layouts/full-layout.component.html b/src/app/layouts/full-layout.component.html index db68f0e..030d2c8 100644 --- a/src/app/layouts/full-layout.component.html +++ b/src/app/layouts/full-layout.component.html @@ -68,6 +68,14 @@ +