import {ChangeDetectorRef, Component, ViewChild} from '@angular/core'; import {MatSort, MatSortModule, Sort} from "@angular/material/sort"; import {MatPaginator, MatPaginatorIntl, MatPaginatorModule, PageEvent} from "@angular/material/paginator"; import {Subscription} from "rxjs"; import {DocumentJsonld, DocumentService, ProductJsonld} from "@app/core/api/v1"; import {Router, RouterLink, RouterLinkActive} from "@angular/router"; import {MatTableDataSource, MatTableModule} from "@angular/material/table"; import {OrderFilter} from "@app/_models/orderFilter"; import {DatePipe, NgIf} from "@angular/common"; import {NgbModal, NgbModalOptions} from "@ng-bootstrap/ng-bootstrap"; import {NewDocumentComponent} from "@app/documents/new-document/new-document.component"; import {TranslateModule} from "@ngx-translate/core"; import {ModalStatus} from "@app/_helpers/modal.states"; import {NewCommentComponent} from "@app/postings/new-comment/new-comment.component"; @Component({ selector: 'app-documents', templateUrl: './documents.component.html', styleUrl: './documents.component.scss', standalone: true, imports: [MatTableModule, MatSortModule, MatPaginatorModule, RouterLink, RouterLinkActive, NgIf, TranslateModule, DatePipe], }) export class DocumentsComponent { @ViewChild(MatSort) sort; @ViewChild(MatPaginator) documentsPaginator: MatPaginator; protected displayedColumns: string[]; protected documentsSub: Subscription; protected documents: Array; protected documentsDataSource; protected documentsLength: number; protected documentsPageEvent: PageEvent; protected documentsPageSize: number; protected documentsPageIndex: number; protected modalOptions: NgbModalOptions = { centered: true }; constructor( private router: Router, private modalService: NgbModal, private documentService: DocumentService ) { this.sort = new MatSort(); this.displayedColumns = ['pos', 'name', 'description', 'download', 'partnerName', 'productName', 'createdAt', 'createdByName', 'edit']; this.documentsSub = new Subscription(); this.documents = []; this.documentsPaginator = new MatPaginator(new MatPaginatorIntl(), ChangeDetectorRef.prototype); this.documentsDataSource = new MatTableDataSource(this.documents); this.documentsLength = 0; this.documentsPageEvent = new PageEvent(); this.documentsPageSize = 10; this.documentsPageIndex = 0; } ngOnInit() { this.getDocumentsData(); } ngAfterViewInit() { this.documentsDataSource.sort = this.sort; this.documentsDataSource.paginator = this.documentsPaginator; } getDocumentsData() { this.documentsSub = this.documentService.documentsGetCollection( this.documentsPageIndex + 1, this.documentsPageSize ).subscribe( data => { this.documents = data["hydra:member"]; //console.log(this.documents); this.documentsDataSource = new MatTableDataSource(this.documents); this.documentsLength = Number(data["hydra:totalItems"]); this.documentsPaginator.length = this.documentsLength; } ); } /** Announce the change in sort state for assistive technology. */ onSortChange(sortState: Sort) { // Reset page index to first page this.documentsPageIndex = 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.getDocumentsData(); } handlePageEvent(e: PageEvent) { this.documentsPageEvent = e; this.documentsLength = e.length; this.documentsPageIndex = e.pageIndex.valueOf(); this.documentsPageSize = e.pageSize.valueOf(); this.getDocumentsData(); } navigateToDocumentFile(element: DocumentJsonld) { window.open(element.documentUrl?.toString(), '_blank'); } openModalNewDocument() { const modalRefDocument = this.modalService.open(NewDocumentComponent, this.modalOptions); let document: DocumentJsonld = {} as DocumentJsonld; modalRefDocument.componentInstance.document = document; modalRefDocument.componentInstance.submit.subscribe((modalStatus: ModalStatus) => { if (modalStatus === ModalStatus.Submitted) { modalRefDocument.dismiss(); this.getDocumentsData(); } }); } openModalEditDocument(document: DocumentJsonld) { const modalRefDocument = this.modalService.open(NewDocumentComponent, this.modalOptions); modalRefDocument.componentInstance.document = document; // console.log(document); modalRefDocument.componentInstance.submit.subscribe((modalStatus: ModalStatus) => { if (modalStatus === ModalStatus.Submitted) { modalRefDocument.dismiss(); this.getDocumentsData(); } }); } }