import {AfterViewInit, Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild} from '@angular/core'; import {FormGroup} from "@angular/forms"; import {ListComponent} from "@app/_components/list/list.component"; import {ListColDefinition} from "@app/_components/list/list-col-definition"; import {Observable} from "rxjs"; import {Sort} from "@angular/material/sort"; import {FilterBarComponent} from "@app/_components/filter-bar/filter-bar.component"; @Component({ selector: 'app-search-select', templateUrl: './search-select.component.html', styleUrl: './search-select.component.scss' }) export class SearchSelectComponent implements OnInit, AfterViewInit { @Input() public formId!: string; @Input() public resultField!: string; @Input() public formLabelLangKey!: string; @Input() public documentForm!: FormGroup; @Input() public documentFormField!: string; @Input() public getDataFunction!: (index: number, pageSize: number, term?: string) => Observable; @Input() public onRowSelectedFunction!: Function; @Input() public dataSet!: any; @Input() public displayedDataField!: string; @Input() public displayedDataSubResource!: string; @Input() public listColDefinitions!: ListColDefinition[]; @Input() public displayAsButton: boolean; @Input() public showHeader: boolean; @Output() rowSelected = new EventEmitter(); @ViewChild('paragraphRef', {static: false}) paragraphRef!: ElementRef; @ViewChild("listComponent", {static: false}) listComponent!: ListComponent; protected readonly SearchSelectComponent = SearchSelectComponent; protected selectedRowIndex: number | null = null; protected searchBoxOpen: boolean; protected searchBoxInitialized: boolean; protected searchBoxFilled: boolean; constructor() { this.searchBoxOpen = false; this.searchBoxInitialized = false; this.searchBoxFilled = false; this.displayAsButton = false; this.showHeader = false; } ngOnInit(): void { if (this.dataSet !== undefined) { this.searchBoxFilled = true; } // Add this line to create a deep copy of the listColDefinitions this.listColDefinitions = JSON.parse(JSON.stringify(this.listColDefinitions)); } ngAfterViewInit(): void { if (this.dataSet !== undefined) { this.paragraphRef.nativeElement.textContent = this.dataSet[this.displayedDataField]; } } onRowSelected = (row: any, index: number) => { if (this.onRowSelectedFunction !== undefined) { this.onRowSelectedFunction(row, index); } else { this.selectedRowIndex = index; const value = this.resultField !== undefined ? row[this.resultField] : row.id; this.documentForm.get(this.formId)?.setValue(value); if (this.displayedDataSubResource !== undefined) { this.paragraphRef.nativeElement.textContent = row[this.displayedDataSubResource][this.displayedDataField]; } else { this.paragraphRef.nativeElement.textContent = row[this.displayedDataField]; } this.searchBoxFilled = true; this.searchBoxOpen = false; } } openSearchBox() { this.searchBoxOpen = !this.searchBoxOpen; if (this.searchBoxOpen && !this.searchBoxInitialized) { this.listComponent.getData(); this.searchBoxInitialized = true; } } clearSearch() { this.paragraphRef.nativeElement.textContent = ''; this.searchBoxFilled = false; this.documentForm.get(this.formId)?.setValue(null); } public getPageIndex() { return this.listComponent.getPageIndex(); } public getPageSize() { return this.listComponent.getPageSize(); } public static getDefaultColDefLocations(subResource?: string): ListColDefinition[] { return [ { name: 'name', text: 'common.name', type: ListComponent.COLUMN_TYPE_TEXT, field: 'name', sortable: true, filterType: FilterBarComponent.FILTER_TYPE_TEXT, } as ListColDefinition, { name: 'code', text: 'common.code', type: ListComponent.COLUMN_TYPE_TEXT, field: 'code', sortable: true, filterType: FilterBarComponent.FILTER_TYPE_TEXT, } as ListColDefinition, { name: 'zone', text: 'model.zone', type: ListComponent.COLUMN_TYPE_TEXT, subResource: 'zone', field: 'name', sortable: true, filterType: FilterBarComponent.FILTER_TYPE_TEXT, } as ListColDefinition, ]; } public static getDefaultColDefZones(subResource?: string): ListColDefinition[] { return [ { name: 'name', text: 'common.name', type: ListComponent.COLUMN_TYPE_TEXT, field: 'name', sortable: true, filterType: FilterBarComponent.FILTER_TYPE_TEXT, } as ListColDefinition, { name: 'createdAt', text: 'common.created_at', type: ListComponent.COLUMN_TYPE_DATE, field: 'createdAt', sortable: true, filterType: FilterBarComponent.FILTER_TYPE_DATE, } as ListColDefinition, ]; } public static getDefaultColDefShippingCompanies(subResource?: string): ListColDefinition[] { return [ { name: 'name', text: 'common.name', type: ListComponent.COLUMN_TYPE_TEXT, field: 'name', sortable: true, filterType: FilterBarComponent.FILTER_TYPE_TEXT, } as ListColDefinition, { name: 'code', text: 'common.code', type: ListComponent.COLUMN_TYPE_TEXT, field: 'code', sortable: true, filterType: FilterBarComponent.FILTER_TYPE_TEXT, } as ListColDefinition, { name: 'createdAt', text: 'common.created_at', type: ListComponent.COLUMN_TYPE_DATE, field: 'createdAt', sortable: true, filterType: FilterBarComponent.FILTER_TYPE_DATE, } as ListColDefinition, ]; } public static getDefaultColDefVessels(subResource?: string): ListColDefinition[] { return [ { name: 'name', text: 'common.name', type: ListComponent.COLUMN_TYPE_TEXT, field: 'name', sortable: true, filterType: FilterBarComponent.FILTER_TYPE_TEXT, } as ListColDefinition, { name: 'code', text: 'common.code', type: ListComponent.COLUMN_TYPE_TEXT, field: 'code', sortable: true, filterType: FilterBarComponent.FILTER_TYPE_TEXT, } as ListColDefinition, { name: 'shippingCompanyName', text: 'model.shipping_company', type: ListComponent.COLUMN_TYPE_TEXT, subResource: 'company', field: 'name', sortable: true, filterType: FilterBarComponent.FILTER_TYPE_TEXT, } as ListColDefinition, { name: 'createdAt', text: 'common.created_at', type: ListComponent.COLUMN_TYPE_DATE, field: 'createdAt', sortable: true, filterType: FilterBarComponent.FILTER_TYPE_DATE, } as ListColDefinition, ]; } public static getDefaultColDefUsers(subResource?: string): ListColDefinition[] { return [ { name: 'fullName', text: 'users.full_name', type: ListComponent.COLUMN_TYPE_TEXT, field: 'fullName', sortable: true, filterType: FilterBarComponent.FILTER_TYPE_TEXT, }, { name: 'email', text: 'users.email', type: ListComponent.COLUMN_TYPE_TEXT, field: 'email', sortable: true, filterType: FilterBarComponent.FILTER_TYPE_TEXT, }, { name: 'referenceId', text: 'users.pilotIdNo', type: ListComponent.COLUMN_TYPE_TEXT_BOLD, field: 'referenceId', } as ListColDefinition, ]; } }