Einbau klassische Filter als Overlay ...

bizmatch/src/app/components/search-modal/search-modal.component.ts

@@ -0,0 +1,46 @@
+import { AsyncPipe, NgIf } from '@angular/common';
+import { Component } from '@angular/core';
+import { BusinessListingCriteria, CommercialPropertyListingCriteria, KeyValue, KeyValueStyle, UserListingCriteria } from '../../../../../bizmatch-server/src/models/main.model';
+import { SelectOptionsService } from '../../services/select-options.service';
+import { SharedModule } from '../../shared/shared/shared.module';
+import { ModalService } from './modal.service';
+
+@Component({
+  selector: 'app-search-modal',
+  standalone: true,
+  imports: [SharedModule, AsyncPipe, NgIf],
+  templateUrl: './search-modal.component.html',
+})
+export class SearchModalComponent {
+  constructor(public selectOptions: SelectOptionsService, public modalService: ModalService) {}
+  ngOnInit() {
+    this.modalService.message$.subscribe(msg => {
+      this.criteria = msg;
+    });
+  }
+  public criteria: BusinessListingCriteria | CommercialPropertyListingCriteria | UserListingCriteria;
+
+  categoryClicked(checked: boolean, value: string) {
+    if (checked) {
+      this.criteria.types.push(value);
+    } else {
+      const index = this.criteria.types.findIndex(t => t === value);
+      if (index > -1) {
+        this.criteria.types.splice(index, 1);
+      }
+    }
+  }
+  search() {
+    console.log('Search criteria:', this.criteria);
+  }
+
+  closeModal() {
+    console.log('Closing modal');
+  }
+  isTypeOfBusinessClicked(v: KeyValueStyle) {
+    return this.criteria.types.find(t => t === v.value);
+  }
+  isTypeOfProfessionalClicked(v: KeyValue) {
+    return this.criteria.types.find(t => t === v.value);
+  }
+}