matsen-tool-fe/matsen-tool/src/app/partners/partners.component.ts

import {AfterViewInit, ChangeDetectorRef, Component, OnInit, ViewChild} from '@angular/core';
import {MatSort, Sort, MatSortModule} from "@angular/material/sort";
import {MatTableDataSource, MatTableModule} from "@angular/material/table";
import {ActivatedRoute, Router, RouterLink, RouterLinkActive} from "@angular/router";
import {Subscription} from "rxjs";
import {PartnerJsonld, PartnerService} from "@app/core/api/v1";
import {MatPaginator, MatPaginatorIntl, MatPaginatorModule, PageEvent} from "@angular/material/paginator";
import {OrderFilter} from "@app/_models/orderFilter";
import {ApiConverter} from "@app/_helpers/api.converter";

@Component({
    selector: 'app-partners',
    templateUrl: './partners.component.html',
    styleUrl: './partners.component.scss',
    standalone: true,
    imports: [MatTableModule, MatSortModule, MatPaginatorModule, RouterLink, RouterLinkActive],
})
export class PartnersComponent implements OnInit, AfterViewInit {
    @ViewChild(MatSort) sort;
    @ViewChild(MatPaginator) paginator: MatPaginator;

    protected partnersSub: Subscription;
    protected partners: Array<PartnerJsonld>;
    protected length: number;
    protected pageEvent: PageEvent;
    protected currentPageSize: number;
    protected currentPageIndex: number;

    protected nameOrderAsc: OrderFilter;
    protected cityOrderAsc: OrderFilter;
    protected websiteOrderAsc: OrderFilter;

    protected dataType!: string;
    protected displayedColumns: string[];
    protected dataSource;

    constructor(
        private route: ActivatedRoute,
        private partnerService: PartnerService,
        private router: Router
    ) {
        this.sort = new MatSort();
        this.paginator = new MatPaginator(new MatPaginatorIntl(), ChangeDetectorRef.prototype);

        this.partnersSub = new Subscription();
        this.partners = [];
        this.displayedColumns = ['pos', 'name', 'address', 'website'];

        this.nameOrderAsc = OrderFilter.Asc;
        this.cityOrderAsc = OrderFilter.Asc;
        this.websiteOrderAsc = OrderFilter.Asc;

        this.dataSource = new MatTableDataSource<PartnerJsonld>(this.partners);
        this.pageEvent = new PageEvent();
        this.length = 0;
        this.currentPageSize = 10;
        this.currentPageIndex = 0;
    }

    ngOnInit() {
        this.dataType = this.route.snapshot.data['dataType'];
        this.getData();
    }

    ngAfterViewInit() {
        this.dataSource.sort = this.sort;
        this.dataSource.paginator = this.paginator;
    }

    /** Announce the change in sort state for assistive technology. */
    onSortChange(sortState: Sort) {
        // Reset page index to first page
        this.currentPageIndex = 0;

        let order: OrderFilter;
        if (sortState.direction === "") {
            order = OrderFilter.Undefined;
        } else {
            order = sortState.direction;
        }

        this.nameOrderAsc = OrderFilter.Undefined;
        this.cityOrderAsc = OrderFilter.Undefined;
        this.websiteOrderAsc = OrderFilter.Undefined;
        switch (sortState.active) {
            case "name":
                this.nameOrderAsc = order;
                break;
            case "address":
                this.cityOrderAsc = order;
                break;
            case "website":
                this.websiteOrderAsc = order;
                break;
        }
        this.getData();
    }

    getData()
    {
        // switch over this.dataType (customers, etc.)
        this.partnersSub = this.partnerService.partnersGetCollection(
            this.currentPageIndex + 1,
            this.dataType,
            undefined,
                this.nameOrderAsc,
            this.cityOrderAsc,
            this.websiteOrderAsc
        ).subscribe(
            data => {
                this.partners = data["hydra:member"];
                this.dataSource = new MatTableDataSource<PartnerJsonld>(this.partners);
                console.log(data);
                this.length = Number(data["hydra:totalItems"]);
                this.paginator.length = this.length;
            }
        );
    }

    handlePageEvent(e: PageEvent) {
        this.pageEvent = e;
        this.length = e.length;
        this.currentPageIndex = e.pageIndex.valueOf();
        this.currentPageSize = e.pageSize.valueOf();
        this.getData();
    }

    navigateToDetails(element: any) {
        const partner: PartnerJsonld = element as PartnerJsonld;
        // this.partnerService.setPartnerData(partner);
        //console.log(partner['@id']);
        console.log(ApiConverter.extractId(partner.id));
        this.router.navigate(['/customers', ApiConverter.extractId(partner.id)]);
    }

    protected readonly PartnerJsonld = PartnerJsonld;
}