Umbau zu location / companyLocation

bizmatch/src/app/pages/details/details-business-listing/details-business-listing.component.ts

@@ -124,7 +124,7 @@ export class DetailsBusinessListingComponent {
     }
     return [
       { label: 'Category', value: this.selectOptions.getBusiness(this.listing.type) },
-      { label: 'Located in', value: `${this.listing.city}, ${this.selectOptions.getState(this.listing.state)}` },
+      { label: 'Located in', value: `${this.listing.location.city}, ${this.selectOptions.getState(this.listing.location.state)}` },
       { label: 'Asking Price', value: `$${this.listing.price?.toLocaleString()}` },
       { label: 'Sales revenue', value: `$${this.listing.salesRevenue?.toLocaleString()}` },
       { label: 'Cash flow', value: `$${this.listing.cashFlow?.toLocaleString()}` },

bizmatch/src/app/pages/details/details-commercial-property-listing/details-commercial-property-listing.component.ts

@@ -96,10 +96,8 @@ export class DetailsCommercialPropertyListingComponent {
     });
     this.propertyDetails = [
       { label: 'Property Category', value: this.selectOptions.getCommercialProperty(this.listing.type) },
-      { label: 'Located in', value: this.selectOptions.getState(this.listing.state) },
-      { label: 'City', value: this.listing.city },
-      { label: 'Zip Code', value: this.listing.zipCode },
-      { label: 'County', value: this.listing.county },
+      { label: 'Located in', value: this.selectOptions.getState(this.listing.location.state) },
+      { label: 'City', value: this.listing.location.city },
       { label: 'Asking Price:', value: `$${this.listing.price?.toLocaleString()}` },
     ];
     //this.initFlowbite();

bizmatch/src/app/pages/listings/business-listings/business-listings.component.html

@@ -99,7 +99,7 @@
         <p class="text-sm text-gray-600 mb-1">Asking price: {{ listing.price | currency }}</p>
         <p class="text-sm text-gray-600 mb-1">Sales revenue: {{ listing.salesRevenue | currency }}</p>
         <p class="text-sm text-gray-600 mb-1">Net profit: {{ listing.cashFlow | currency }}</p>
-        <p class="text-sm text-gray-600 mb-1">Location: {{ listing.city }} - {{ selectOptions.getState(listing.state) }}</p>
+        <p class="text-sm text-gray-600 mb-1">Location: {{ listing.location.city }} - {{ listing.location.state }}</p>
         <p class="text-sm text-gray-600 mb-1">Established: {{ listing.established }}</p>
         <img src="{{ env.imageBaseUrl }}/pictures/logo/{{ listing.imageName }}.avif?_ts={{ ts }}" alt="Company logo" class="absolute bottom-[70px] right-[30px] h-[35px] w-auto" />
         <div class="flex-grow"></div>

bizmatch/src/app/pages/listings/commercial-property-listings/commercial-property-listings.component.html

@@ -1,60 +1,5 @@
-<!--
-<div class="surface-200 h-full">
-  <div class="wrapper">
-    <div class="grid">
-      @for (listing of listings; track listing.id) {
-      <div class="col-12 xl:col-4 flex">
-        <div class="surface-card p-2 flex flex-column flex-grow-1 justify-content-between" style="border-radius: 10px">
-          <article class="flex flex-column md:flex-row w-full gap-3 p-3 surface-card">
-            <div class="relative">
-              @if (listing.imageOrder?.length>0){
-              <img
-                src="{{ env.imageBaseUrl }}/pictures/property/{{ listing.imagePath }}/{{ listing.serialId }}/{{ listing.imageOrder[0] }}?_ts={{ ts }}"
-                alt="Image"
-                class="border-round w-full h-full md:w-12rem md:h-9rem"
-              />
-              } @else {
-              <img src="assets/images/placeholder_properties.jpg" alt="Image" class="border-round w-full h-full md:w-12rem md:h-9rem" />
-              }
-              <p class="absolute px-2 py-1 border-round-lg text-sm font-normal text-white mt-0 mb-0" style="background-color: rgba(255, 255, 255, 0.3); backdrop-filter: invert(30%); top: 3%; left: 3%">
-                {{ selectOptions.getState(listing.state) }}
-              </p>
-            </div>
-            <div class="flex flex-column w-full gap-3">
-              <div class="flex w-full justify-content-between align-items-center flex-wrap gap-3">
-                <p class="font-semibold text-lg mt-0 mb-0">{{ listing.title }}</p>
-              </div>
-              <p class="font-normal text-lg text-600 mt-0 mb-0">{{ listing.city }}</p>
-              <div class="flex flex-wrap justify-content-between xl:h-2rem mt-auto">
-                <p class="text-base flex align-items-center text-900 mt-0 mb-1">
-                  <i class="pi pi-list mr-2"></i>
-                  <span class="font-medium">{{ selectOptions.getCommercialProperty(listing.type) }}</span>
-                </p>
-              </div>
-              <p class="font-semibold text-3xl text-900 mt-0 mb-2">{{ listing.price | currency }}</p>
-            </div>
-          </article>
-          <div class="px-4 py-3 text-left">
-            <button
-              pButton
-              pRipple
-              icon="pi pi-arrow-right"
-              iconPos="right"
-              label="View Full Listing"
-              class="p-button-rounded p-button-success"
-              [routerLink]="['/details-commercial-property-listing', listing.id]"
-            ></button>
-          </div>
-        </div>
-      </div>
-
-      }
-    </div>
-  </div>
-</div> -->
 <div class="container mx-auto px-4 py-8">
   <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
-    <!-- Property Card 1 -->
     @for (listing of listings; track listing.id) {
     <div class="bg-white rounded-lg shadow-md overflow-hidden">
       @if (listing.imageOrder?.length>0){
@@ -64,11 +9,11 @@
       }
       <div class="p-4">
         <div class="flex items-center justify-between mb-2">
-          <span class="bg-gray-200 text-gray-700 text-xs font-semibold px-2 py-1 rounded">{{ selectOptions.getState(listing.state) }}</span>
+          <span class="bg-gray-200 text-gray-700 text-xs font-semibold px-2 py-1 rounded">{{ selectOptions.getState(listing.location.state) }}</span>
           <span class="text-gray-600 text-sm"><i [class]="selectOptions.getIconTypeOfCommercials(listing.type)" class="mr-1"></i> {{ selectOptions.getCommercialProperty(listing.type) }}</span>
         </div>
         <h3 class="text-lg font-semibold mb-2">{{ listing.title }}</h3>
-        <p class="text-gray-600 mb-2">{{ listing.city }}</p>
+        <p class="text-gray-600 mb-2">{{ listing.location.city }}</p>
         <p class="text-xl font-bold mb-4">{{ listing.price | currency }}</p>
         <button [routerLink]="['/details-commercial-property-listing', listing.id]" class="bg-green-500 text-white px-4 py-2 rounded-full w-full hover:bg-green-600 transition duration-300">
           View Full Listing <i class="fas fa-arrow-right ml-1"></i>

bizmatch/src/app/pages/subscription/edit-business-listing/edit-business-listing.component.html

@@ -52,8 +52,8 @@
         </div>
       </div> -->
       <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
-        <app-validated-ng-select label="State" name="state" [(ngModel)]="listing.state" [items]="selectOptions?.states"></app-validated-ng-select>
-        <app-validated-input label="City" name="city" [(ngModel)]="listing.city"></app-validated-input>
+        <app-validated-ng-select label="State" name="state" [(ngModel)]="listing.location.state" [items]="selectOptions?.states"></app-validated-ng-select>
+        <app-validated-input label="City" name="city" [(ngModel)]="listing.location.city"></app-validated-input>
       </div>
 
       <!-- <div class="flex mb-4 space-x-4">

bizmatch/src/app/pages/subscription/edit-business-listing/edit-business-listing.component.ts

@@ -137,7 +137,7 @@ export class EditBusinessListingComponent {
   suggestions: string[] | undefined;
 
   async search(event: AutoCompleteCompleteEvent) {
-    const result = await lastValueFrom(this.geoService.findCitiesStartingWith(event.query, this.listing.state));
+    const result = await lastValueFrom(this.geoService.findCitiesStartingWith(event.query));
     this.suggestions = result.map(r => r.city).slice(0, 5);
   }
 

bizmatch/src/app/pages/subscription/edit-commercial-property-listing/edit-commercial-property-listing.component.html

@@ -50,8 +50,8 @@
         </div>
       </div> -->
       <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
-        <app-validated-ng-select label="State" name="state" [(ngModel)]="listing.state" [items]="selectOptions?.states"></app-validated-ng-select>
-        <app-validated-input label="City" name="city" [(ngModel)]="listing.city"></app-validated-input>
+        <app-validated-ng-select label="State" name="state" [(ngModel)]="listing.location.state" [items]="selectOptions?.states"></app-validated-ng-select>
+        <app-validated-input label="City" name="city" [(ngModel)]="listing.location.city"></app-validated-input>
       </div>
 
       <!-- <div class="flex mb-4 space-x-4">
@@ -64,10 +64,10 @@
           <input type="text" id="county" [(ngModel)]="listing.county" name="county" class="w-full p-2 border border-gray-300 rounded-md" />
         </div>
       </div> -->
-      <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+      <!-- <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
         <app-validated-input label="Zip Code" name="zipCode" [(ngModel)]="listing.zipCode"></app-validated-input>
         <app-validated-input label="County" name="county" [(ngModel)]="listing.county"></app-validated-input>
-      </div>
+      </div> -->
 
       <!-- <div class="mb-4">
         <label for="internals" class="block text-sm font-bold text-gray-700 mb-1">Internal Notes (Will not be shown on the listing, for your records only.)</label>

bizmatch/src/app/pages/subscription/edit-commercial-property-listing/edit-commercial-property-listing.component.ts

@@ -174,7 +174,7 @@ export class EditCommercialPropertyListingComponent {
   }
 
   async search(event: AutoCompleteCompleteEvent) {
-    const result = await lastValueFrom(this.geoService.findCitiesStartingWith(event.query, this.listing.state));
+    const result = await lastValueFrom(this.geoService.findCitiesStartingWith(event.query));
     this.suggestions = result.map(r => r.city).slice(0, 5);
   }
   openFileDialog() {

bizmatch/src/app/pages/subscription/my-listing/my-listing.component.html

@@ -17,7 +17,7 @@
           <tr *ngFor="let listing of myListings" class="border-b">
             <td class="py-2 px-4">{{ listing.title }}</td>
             <td class="py-2 px-4">{{ listing.listingsCategory === 'commercialProperty' ? 'Commercial Property' : 'Business' }}</td>
-            <td class="py-2 px-4">{{ listing.state }}</td>
+            <td class="py-2 px-4">{{ listing.location.state }}</td>
             <td class="py-2 px-4">
               @if(listing.listingsCategory==='business'){
               <button class="bg-green-500 text-white p-2 rounded-full mr-2" [routerLink]="['/editBusinessListing', listing.id]">
@@ -52,7 +52,7 @@
       <div *ngFor="let listing of myListings" class="bg-white shadow-md rounded-lg p-4 mb-4">
         <h2 class="text-xl font-semibold mb-2">{{ listing.title }}</h2>
         <p class="text-gray-600 mb-2">Category: {{ listing.listingsCategory === 'commercialProperty' ? 'Commercial Property' : 'Business' }}</p>
-        <p class="text-gray-600 mb-4">Located in: {{ listing.state }}</p>
+        <p class="text-gray-600 mb-4">Located in: {{ listing.location.city }} - {{ listing.location.state }}</p>
         <div class="flex justify-end">
           <button class="bg-green-500 text-white p-2 rounded-full mr-2">
             <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">