From 83c09c321243dde2d93ec4ae42d8e3368a1d2130 Mon Sep 17 00:00:00 2001 From: Florian Eisenmenger Date: Tue, 5 Mar 2024 16:26:55 +0100 Subject: [PATCH] new / edit postings --- .../new-contact/new-contact.component.ts | 1 - matsen-tool/src/app/home/home.component.ts | 2 +- .../partners-detail.component.html | 71 ++++++------ .../partners-detail.component.ts | 107 +++++++++++------- .../new-posting/new-posting.component.html | 24 +++- .../new-posting/new-posting.component.ts | 60 +++++++++- 6 files changed, 181 insertions(+), 84 deletions(-) diff --git a/matsen-tool/src/app/contacts/new-contact/new-contact.component.ts b/matsen-tool/src/app/contacts/new-contact/new-contact.component.ts index 752a297..c559875 100644 --- a/matsen-tool/src/app/contacts/new-contact/new-contact.component.ts +++ b/matsen-tool/src/app/contacts/new-contact/new-contact.component.ts @@ -39,7 +39,6 @@ export class NewContactComponent implements ModalContent, OnInit { ngOnInit(): void { this.contactForm = FormGroupInitializer.initFormGroup(this.contactForm, this.contact); - console.log(this.contactForm); } // On submit form: Check if image is set diff --git a/matsen-tool/src/app/home/home.component.ts b/matsen-tool/src/app/home/home.component.ts index a6b30b0..bd5ebb8 100644 --- a/matsen-tool/src/app/home/home.component.ts +++ b/matsen-tool/src/app/home/home.component.ts @@ -10,7 +10,7 @@ import {PostJsonld, PostService, UserJsonld, UserService} from "@app/core/api/v1 styleUrl: 'home.component.scss' }) export class HomeComponent implements OnInit { - user: User | null; + protected user: User | null; protected postSub: Subscription; protected posts: Array; diff --git a/matsen-tool/src/app/partners/partners-detail/partners-detail.component.html b/matsen-tool/src/app/partners/partners-detail/partners-detail.component.html index fd55e9c..2d946ef 100644 --- a/matsen-tool/src/app/partners/partners-detail/partners-detail.component.html +++ b/matsen-tool/src/app/partners/partners-detail/partners-detail.component.html @@ -140,39 +140,42 @@

Notizen

- - - - - - - - - - - - - - - - - - - - - - - - +
+
+
+
+

{{ post.createdAt | date:'dd.MM.YYYY HH:mm' }}

+

{{ post.ownerName }}

+
+
+

{{ post.headline }}

+

{{ post.message }}

+
+ +
+
+
+
+
+

{{ comment.createdAt | date:'dd.MM.YYYY hh:mm' }}

+

{{ comment.ownerName }}

+
+
+

{{ comment.message }}

+
+
+
- - - - - - - - - - +
+ Kommentieren +
+
+ + \ No newline at end of file diff --git a/matsen-tool/src/app/partners/partners-detail/partners-detail.component.ts b/matsen-tool/src/app/partners/partners-detail/partners-detail.component.ts index bb2c558..9122c5d 100644 --- a/matsen-tool/src/app/partners/partners-detail/partners-detail.component.ts +++ b/matsen-tool/src/app/partners/partners-detail/partners-detail.component.ts @@ -12,6 +12,8 @@ import {MatTableDataSource} from "@angular/material/table"; import {NewPostingComponent} from "@app/postings/new-posting/new-posting.component"; import {NewTaskComponent} from "@app/tasks/new-task/new-task.component"; import {ModalStatus} from "@app/_helpers/modal.states"; +import {AccountService} from "@app/_services"; +import {User} from "@app/_models"; @Component({ selector: 'app-partners-detail', @@ -21,7 +23,9 @@ import {ModalStatus} from "@app/_helpers/modal.states"; export class PartnersDetailComponent implements OnInit, AfterViewInit { @ViewChild(MatPaginator) contactsPaginator: MatPaginator; // @ViewChild(MatPaginator) tasksPaginator: MatPaginator; - // @ViewChild(MatPaginator) postsPaginator: MatPaginator; + @ViewChild(MatPaginator) postsPaginator: MatPaginator; + + protected user: User | null; protected readonly environment = environment; protected id: string; @@ -42,19 +46,20 @@ export class PartnersDetailComponent implements OnInit, AfterViewInit { // protected tasksPageEvent: PageEvent; // protected tasksPageSize: number; // protected tasksPageIndex: number; - // - // protected postsSub: Subscription; - // protected posts: Array; - // protected postsDataSource; - // protected postsLength: number; - // protected postsPageEvent: PageEvent; - // protected postsPageSize: number; - // protected postsPageIndex: number; + + protected postsSub: Subscription; + protected posts: Array; + protected postsDataSource; + protected postsLength: number; + protected postsPageEvent: PageEvent; + protected postsPageSize: number; + protected postsPageIndex: number; protected readonly ModalComponent = ModalComponent; constructor( private router: Router, + private accountService: AccountService, private modalService: NgbModal, private route: ActivatedRoute, private partnerService: PartnerService, @@ -65,6 +70,8 @@ export class PartnersDetailComponent implements OnInit, AfterViewInit { this.partnerDetailSub = new Subscription(); this.partner = {} as PartnerJsonld; + this.user = this.accountService.userValue; + this.contactsSub = new Subscription(); this.contacts = []; this.contactsPaginator = new MatPaginator(new MatPaginatorIntl(), ChangeDetectorRef.prototype); @@ -82,15 +89,14 @@ export class PartnersDetailComponent implements OnInit, AfterViewInit { // this.tasksPageSize = 10; // this.tasksPageIndex = 0; - // TODO: Change Jsonld - // this.postsSub = new Subscription(); - // this.posts = []; - // this.postsPaginator = new MatPaginator(new MatPaginatorIntl(), ChangeDetectorRef.prototype); - // this.postsDataSource = new MatTableDataSource(this.contacts); - // this.postsLength = 0; - // this.postsPageEvent = new PageEvent(); - // this.postsPageSize = 30; - // this.postsPageIndex = 0; + this.postsSub = new Subscription(); + this.posts = []; + this.postsPaginator = new MatPaginator(new MatPaginatorIntl(), ChangeDetectorRef.prototype); + this.postsDataSource = new MatTableDataSource(this.posts); + this.postsLength = 0; + this.postsPageEvent = new PageEvent(); + this.postsPageSize = 10; + this.postsPageIndex = 0; } ngOnInit() { @@ -105,7 +111,7 @@ export class PartnersDetailComponent implements OnInit, AfterViewInit { ngAfterViewInit() { this.contactsDataSource.paginator = this.contactsPaginator; // this.tasksDataSource.paginator = this.tasksPaginator; - // this.postsDataSource.paginator = this.postsPaginator; + this.postsDataSource.paginator = this.postsPaginator; } getPartnerData() { @@ -135,17 +141,17 @@ export class PartnersDetailComponent implements OnInit, AfterViewInit { } getPostsData() { - // this.postsSub = this.postService.postsGetCollection( - // this.postsPageIndex + 1, - // 10, - // this.id - // ).subscribe( - // data => { - // this.posts = data["hydra:member"]; - // this.postsLength = Number(data["hydra:totalItems"]); - // this.postsPaginator.length = this.postsLength; - // } - // ); + this.postsSub = this.postService.postsGetCollection( + this.postsPageIndex + 1, + this.postsPageSize, + this.id + ).subscribe( + data => { + this.posts = data["hydra:member"]; + this.postsLength = Number(data["hydra:totalItems"]); + // this.postsPaginator.length = this.postsLength; + } + ); } contactsHandlePageEvent(e: PageEvent) { @@ -165,11 +171,11 @@ export class PartnersDetailComponent implements OnInit, AfterViewInit { } postsHandlePageEvent(e: PageEvent) { - // this.postsPageEvent = e; - // this.postsLength = e.length; - // this.postsPageIndex = e.pageIndex.valueOf(); - // this.postsPageSize = e.pageSize.valueOf(); - // this.getPostsData(); + this.postsPageEvent = e; + this.postsLength = e.length; + this.postsPageIndex = e.pageIndex.valueOf(); + this.postsPageSize = e.pageSize.valueOf(); + this.getPostsData(); } navigateToContactDetails(element: any) { @@ -178,23 +184,40 @@ export class PartnersDetailComponent implements OnInit, AfterViewInit { } openModalNewContact() { - const modalRef = this.modalService.open(NewContactComponent); + const modalRefContact = this.modalService.open(NewContactComponent); let contact: ContactJsonld = {} as ContactJsonld; contact.partner = this.partner.id ?? null; - modalRef.componentInstance.contact = contact; - modalRef.componentInstance.submit.subscribe((modalStatus: ModalStatus) => { + modalRefContact.componentInstance.contact = contact; + modalRefContact.componentInstance.submit.subscribe((modalStatus: ModalStatus) => { if (modalStatus === ModalStatus.Submitted) { - modalRef.dismiss(); + modalRefContact.dismiss(); this.getContactsData(); } }); } openModalNewPosting() { - // TODO - const modalRef = this.modalService.open(ModalComponent); - modalRef.componentInstance.dynamicComponent = NewPostingComponent; + const modalRefPosting = this.modalService.open(NewPostingComponent); + let posting: PostJsonld = {} as PostJsonld; + posting.partner = this.partner.id ?? null; + modalRefPosting.componentInstance.posting = posting; + modalRefPosting.componentInstance.submit.subscribe((modalStatus: ModalStatus) => { + if (modalStatus === ModalStatus.Submitted) { + modalRefPosting.dismiss(); + this.getPostsData(); + } + }); + } + openModalEditPosting(post: PostJsonld) { + const modalRefPostingEdit = this.modalService.open(NewPostingComponent); + modalRefPostingEdit.componentInstance.posting = post; + modalRefPostingEdit.componentInstance.submit.subscribe((modalStatus: ModalStatus) => { + if (modalStatus === ModalStatus.Submitted) { + modalRefPostingEdit.dismiss(); + this.getPostsData(); + } + }); } openModalNewTask() { diff --git a/matsen-tool/src/app/postings/new-posting/new-posting.component.html b/matsen-tool/src/app/postings/new-posting/new-posting.component.html index 3061f00..eb1109e 100644 --- a/matsen-tool/src/app/postings/new-posting/new-posting.component.html +++ b/matsen-tool/src/app/postings/new-posting/new-posting.component.html @@ -1 +1,23 @@ -

new-posting works!

+

Neue Notiz

+
+
+
+ + +
+ Überschrift ist erforderlich. +
+
+ +
+ + +
+ Nachricht ist erforderlich. +
+
+ + +
+
+ diff --git a/matsen-tool/src/app/postings/new-posting/new-posting.component.ts b/matsen-tool/src/app/postings/new-posting/new-posting.component.ts index 476733d..0a0639c 100644 --- a/matsen-tool/src/app/postings/new-posting/new-posting.component.ts +++ b/matsen-tool/src/app/postings/new-posting/new-posting.component.ts @@ -1,10 +1,60 @@ -import { Component } from '@angular/core'; +import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core'; +import {ModalStatus} from "@app/_helpers/modal.states"; +import {FormGroup} from "@angular/forms"; +import {postForm} from "@app/_forms/apiForms"; +import {ContactJsonld, PostJsonld, PostService} from "@app/core/api/v1"; +import {FormGroupInitializer} from "@app/_helpers/formgroup.initializer"; +import {ApiConverter} from "@app/_helpers/api.converter"; +import {Subscription} from "rxjs"; @Component({ - selector: 'app-new-posting', - templateUrl: './new-posting.component.html', - styleUrl: './new-posting.component.scss' + selector: 'app-new-posting', + templateUrl: './new-posting.component.html', + styleUrl: './new-posting.component.scss' }) -export class NewPostingComponent { +export class NewPostingComponent implements OnInit { + @Input() public posting!: PostJsonld; + @Output() public submit: EventEmitter = new EventEmitter(); + protected postForm: FormGroup; + protected postSub: Subscription; + + constructor( + private postService: PostService + ) { + this.postForm = postForm; + this.postSub = new Subscription(); + } + + ngOnInit(): void { + this.postForm = FormGroupInitializer.initFormGroup(this.postForm, this.posting); + console.log(this.postForm); + } + + onSubmit() { + if (this.postForm.valid) { + if (this.posting.id === null || this.posting.id === undefined) { + // Create new post + this.postSub = this.postService.postsPost( + this.postForm.value as PostJsonld + ).subscribe( + data => { + this.postForm.reset(); + this.submit.emit(ModalStatus.Submitted); + } + ); + } else { + // Edit post + this.postSub = this.postService.postsIdPatch( + ApiConverter.extractId(this.posting.id), + this.postForm.value as PostJsonld + ).subscribe( + data => { + this.postForm.reset(); + this.submit.emit(ModalStatus.Submitted); + } + ); + } + } + } }