Bug Fixing overall

2024-05-06 20:13:09 +02:00
parent bb5a408cdc
commit 6b61c19bd7
52 changed files with 1926 additions and 1048 deletions
--- a/bizmatch/src/app/pages/listings/business-listings/business-listings.component.html
+++ b/bizmatch/src/app/pages/listings/business-listings/business-listings.component.html
@@ -2,6 +2,9 @@
 <div class="search">
  <div class="wrapper">
    <div class="grid p-4 align-items-center">
+      <div class="col-2">
+        <p-dropdown [options]="states" [(ngModel)]="criteria.state" optionLabel="criteria.location" optionLabel="name" optionValue="value" [showClear]="true" placeholder="State" [style]="{ width: '100%' }"></p-dropdown>
+      </div>
      <div class="col-2">
        <p-dropdown
          [options]="selectOptions.typesOfBusiness"
@@ -13,21 +16,24 @@
          [style]="{ width: '100%' }"
        ></p-dropdown>
      </div>
-      <div class="col-2">
-        <p-dropdown [options]="states" [(ngModel)]="criteria.state" optionLabel="criteria.location" optionLabel="name" optionValue="value" [showClear]="true" placeholder="State" [style]="{ width: '100%' }"></p-dropdown>
-      </div>
      <div class="col-2">
        <p-dropdown [options]="selectOptions.prices" [(ngModel)]="criteria.minPrice" optionLabel="name" optionValue="value" [showClear]="true" placeholder="Min Price" [style]="{ width: '100%' }"></p-dropdown>
      </div>
      <div class="col-2">
        <p-dropdown [options]="selectOptions.prices" [(ngModel)]="criteria.maxPrice" optionLabel="name" optionValue="value" [showClear]="true" placeholder="Max Price" [style]="{ width: '100%' }"></p-dropdown>
      </div>
-      <div class="col-3">
+      <div class="col-2">
+        <p-inputGroup>
+          <input id="name" type="text" pInputText [(ngModel)]="criteria.title" placeholder="Title" />
+          <button type="button" pButton icon="pi pi-times" class="p-button-secondary" (click)="reset()"></button>
+        </p-inputGroup>
+      </div>
+      <div class="col-1" pTooltip="Real Estate excluded/included" tooltipPosition="top">
        <!-- <p-toggleButton [(ngModel)]="checked1"  onLabel="Sustainable" offLabel="Unsustainable" onIcon="pi pi-check" offIcon="pi pi-times" styleClass="mb-3 lg:mt-0 mr-4 flex-shrink-0 w-12rem"></p-toggleButton> -->
-        <p-toggleButton [(ngModel)]="criteria.realEstateChecked" onLabel="Real Estate not included" offLabel="Real Estate included"></p-toggleButton>
+        <p-toggleButton [(ngModel)]="criteria.realEstateChecked" onLabel="RE incl." offLabel="RE excl."></p-toggleButton>
      </div>
      <div class="col-1">
-        <p-button label="Refine" (click)="search()"></p-button>
+        <p-button label="Refine" (click)="refine()"></p-button>
      </div>
    </div>
  </div>
@@ -52,7 +58,7 @@
            <p class="mt-0 mb-1 text-700 line-height-3">Location: {{ selectOptions.getState(listing.state) }}</p>
            <p class="mt-0 mb-1 text-700 line-height-3">Established: {{ listing.established }}</p>
            <div class="mt-auto ml-auto">
-              <img src="{{ environment.apiBaseUrl }}/logo/{{ listing.userId }}" (error)="imageErrorHandler(listing)" class="rounded-image" />
+              <img src="{{ environment.apiBaseUrl }}/logo/{{ listing.userId }}.avif" (error)="imageErrorHandler(listing)" class="rounded-image" />
            </div>
          </div>
          <div class="px-4 py-3 surface-100 text-left">
--- a/bizmatch/src/app/pages/listings/business-listings/business-listings.component.scss
+++ b/bizmatch/src/app/pages/listings/business-listings/business-listings.component.scss
@@ -1,23 +1,26 @@
 #sky-line {
-    background-image: url(../../../../assets/images/bw-sky.jpg);
-    height: 204px;
-    background-position: bottom;
-    background-size: cover;
-    margin-bottom: -1px;
+  background-image: url(../../../../assets/images/bw-sky.jpg);
+  height: 204px;
+  background-position: bottom;
+  background-size: cover;
+  margin-bottom: -1px;
 }
-.search{
-    background-color: #343F69;
+.search {
+  background-color: #343f69;
 }
 ::ng-deep p-paginator div {
-    background-color: var(--surface-200) !important;
-    // background-color: var(--surface-400) !important;
+  background-color: var(--surface-200) !important;
+  // background-color: var(--surface-400) !important;
 }
 .rounded-image {
-    border-radius: 6px;
-    // width: 100px;
-    max-width: 100px;
-    height: 45px;
-    border: 1px solid rgba(0,0,0,0.2);
-    padding: 1px 1px;
-    object-fit: contain;
-}
+  border-radius: 6px;
+  // width: 100px;
+  max-width: 100px;
+  height: 45px;
+  border: 1px solid rgba(0, 0, 0, 0.2);
+  padding: 1px 1px;
+  object-fit: contain;
+}
+::ng-deep span.p-button-label {
+  font-weight: 500;
+}
--- a/bizmatch/src/app/pages/listings/business-listings/business-listings.component.ts
+++ b/bizmatch/src/app/pages/listings/business-listings/business-listings.component.ts
@@ -6,10 +6,12 @@ import onChange from 'on-change';
 import { ButtonModule } from 'primeng/button';
 import { CheckboxModule } from 'primeng/checkbox';
 import { DropdownModule } from 'primeng/dropdown';
+import { InputGroupModule } from 'primeng/inputgroup';
 import { InputTextModule } from 'primeng/inputtext';
 import { PaginatorModule } from 'primeng/paginator';
 import { StyleClassModule } from 'primeng/styleclass';
 import { ToggleButtonModule } from 'primeng/togglebutton';
+import { TooltipModule } from 'primeng/tooltip';
 import { BusinessListing } from '../../../../../../bizmatch-server/src/models/db.model';
 import { ListingCriteria, ListingType } from '../../../../../../bizmatch-server/src/models/main.model';
 import { environment } from '../../../../environments/environment';
@@ -21,7 +23,21 @@ import { createGenericObject, getCriteriaStateObject, getSessionStorageHandler }
@Component({
  selector: 'app-business-listings',
  standalone: true,
-  imports: [CommonModule, StyleClassModule, ButtonModule, CheckboxModule, InputTextModule, DropdownModule, FormsModule, StyleClassModule, ToggleButtonModule, RouterModule, PaginatorModule],
+  imports: [
+    CommonModule,
+    StyleClassModule,
+    ButtonModule,
+    CheckboxModule,
+    InputTextModule,
+    DropdownModule,
+    FormsModule,
+    StyleClassModule,
+    ToggleButtonModule,
+    RouterModule,
+    PaginatorModule,
+    InputGroupModule,
+    TooltipModule,
+  ],
  templateUrl: './business-listings.component.html',
  styleUrl: './business-listings.component.scss',
 })
@@ -36,10 +52,10 @@ export class BusinessListingsComponent {
  type: string;
  states = [];
  state: string;
-  first: number = 0;
-  rows: number = 12;
  totalRecords: number = 0;
  ts = new Date().getTime();
+  first: number = 0;
+  rows: number = 12;
  public category: 'business' | 'commercialProperty' | 'professionals_brokers' | undefined;

  constructor(
@@ -56,7 +72,6 @@ export class BusinessListingsComponent {
    this.activatedRoute.params.subscribe(params => {
      if (this.activatedRoute.snapshot.fragment === '') {
        this.criteria = onChange(createGenericObject<ListingCriteria>(), getSessionStorageHandler);
-        this.first = 0;
      }
      this.category = (<any>params).type;
      this.init();
@@ -68,6 +83,11 @@ export class BusinessListingsComponent {
    this.states = statesResult.map(s => s.state).map(ls => ({ name: this.selectOptions.getState(ls as string), value: ls }));
    this.search();
  }
+  refine() {
+    this.criteria.start = 0;
+    this.criteria.page = 0;
+    this.search();
+  }
  async search() {
    const listingReponse = await this.listingsService.getListings(this.criteria, 'business');
    this.listings = listingReponse.data;
@@ -85,4 +105,7 @@ export class BusinessListingsComponent {
  imageErrorHandler(listing: ListingType) {
    // listing.hideImage = true; // Bild ausblenden, wenn es nicht geladen werden kann
  }
+  reset() {
+    this.criteria.title = null;
+  }
 }