BugFix for https://gitea.bizmatch.net/aknuth/bizmatch-project/issues/35

2024-08-13 12:20:24 +02:00
parent ec0576e7b8
commit 1f8febc479
10 changed files with 105 additions and 60 deletions
--- a/bizmatch/src/app/pages/details/details-business-listing/details-business-listing.component.ts
+++ b/bizmatch/src/app/pages/details/details-business-listing/details-business-listing.component.ts
@@ -83,9 +83,13 @@ export class DetailsBusinessListingComponent {
      this.user = await this.userService.getByMail(this.keycloakUser.email);
      this.mailinfo = createMailInfo(this.user);
    }
-    this.listing = await lastValueFrom(this.listingsService.getListingById(this.id, 'business'));
-    this.listingUser = await this.userService.getByMail(this.listing.email);
-    this.description = this.sanitizer.bypassSecurityTrustHtml(this.listing.description);
+    try {
+      this.listing = await lastValueFrom(this.listingsService.getListingById(this.id, 'business'));
+      this.listingUser = await this.userService.getByMail(this.listing.email);
+      this.description = this.sanitizer.bypassSecurityTrustHtml(this.listing.description);
+    } catch (error) {
+      console.log(error);
+    }
  }
  ngOnDestroy() {
    this.validationMessagesService.clearMessages(); // Löschen Sie alle bestehenden Validierungsnachrichten
@@ -120,7 +124,7 @@ export class DetailsBusinessListingComponent {
    } else if (this.listing.franchiseResale) {
      typeOfRealEstate = 'Franchise Re-Sale';
    }
-    return [
+    const result = [
      { label: 'Category', value: this.selectOptions.getBusiness(this.listing.type) },
      { label: 'Located in', value: `${this.listing.location.name}, ${this.selectOptions.getState(this.listing.location.state)}` },
      { label: 'Asking Price', value: `$${this.listing.price?.toLocaleString()}` },
@@ -133,5 +137,9 @@ export class DetailsBusinessListingComponent {
      { label: 'Reason for Sale', value: this.listing.reasonForSale },
      { label: 'Broker licensing', value: this.listing.brokerLicencing },
    ];
+    if (this.listing.draft) {
+      result.push({ label: 'Draft', value: this.listing.draft ? 'Yes' : 'No' });
+    }
+    return result;
  }
 }
--- a/bizmatch/src/app/pages/details/details-commercial-property-listing/details-commercial-property-listing.component.html
+++ b/bizmatch/src/app/pages/details/details-commercial-property-listing/details-commercial-property-listing.component.html
@@ -99,6 +99,7 @@

 <div class="container mx-auto p-4">
  <div class="bg-white shadow-md rounded-lg overflow-hidden">
+    @if(listing){
    <div class="p-6 relative">
      <h1 class="text-3xl font-bold mb-4">{{ listing?.title }}</h1>
      <button
@@ -231,5 +232,6 @@
        </div>
      </div>
    </div>
+    }
  </div>
 </div>
--- a/bizmatch/src/app/pages/details/details-commercial-property-listing/details-commercial-property-listing.component.ts
+++ b/bizmatch/src/app/pages/details/details-commercial-property-listing/details-commercial-property-listing.component.ts
@@ -88,18 +88,26 @@ export class DetailsCommercialPropertyListingComponent {
      this.user = await this.userService.getByMail(this.keycloakUser.email);
      this.mailinfo = createMailInfo(this.user);
    }
-    this.listing = (await lastValueFrom(this.listingsService.getListingById(this.id, 'commercialProperty'))) as CommercialPropertyListing;
-    this.listingUser = await this.userService.getByMail(this.listing.email);
-    this.description = this.sanitizer.bypassSecurityTrustHtml(this.listing.description);
-    import('flowbite').then(flowbite => {
-      flowbite.initCarousels();
-    });
-    this.propertyDetails = [
-      { label: 'Property Category', value: this.selectOptions.getCommercialProperty(this.listing.type) },
-      { label: 'Located in', value: this.selectOptions.getState(this.listing.location.state) },
-      { label: 'City', value: this.listing.location.name },
-      { label: 'Asking Price:', value: `$${this.listing.price?.toLocaleString()}` },
-    ];
+    try {
+      this.listing = (await lastValueFrom(this.listingsService.getListingById(this.id, 'commercialProperty'))) as CommercialPropertyListing;
+      this.listingUser = await this.userService.getByMail(this.listing.email);
+      this.description = this.sanitizer.bypassSecurityTrustHtml(this.listing.description);
+      import('flowbite').then(flowbite => {
+        flowbite.initCarousels();
+      });
+      this.propertyDetails = [
+        { label: 'Property Category', value: this.selectOptions.getCommercialProperty(this.listing.type) },
+        { label: 'Located in', value: this.selectOptions.getState(this.listing.location.state) },
+        { label: 'City', value: this.listing.location.name },
+        { label: 'Asking Price:', value: `$${this.listing.price?.toLocaleString()}` },
+      ];
+      if (this.listing.draft) {
+        this.propertyDetails.push({ label: 'Draft', value: this.listing.draft ? 'Yes' : 'No' });
+      }
+    } catch (error) {
+      console.log(error);
+    }
+
    //this.initFlowbite();
  }
  ngOnDestroy() {
--- a/bizmatch/src/app/pages/details/details-user/details-user.component.html
+++ b/bizmatch/src/app/pages/details/details-user/details-user.component.html
@@ -218,7 +218,7 @@
        <h3 class="font-semibold mb-2">Areas (Counties) we serve</h3>
        <div class="flex flex-wrap gap-2">
          @for (area of user.areasServed; track area) {
-          <span class="bg-blue-100 text-blue-800 px-2 py-1 rounded-full text-sm">{{ area.county }}-{{ area.state }}</span>
+          <span class="bg-blue-100 text-blue-800 px-2 py-1 rounded-full text-sm">{{ area.county }}{{ area.county ? '-' : '' }}{{ area.state }}</span>
          }
        </div>
      </div>
@@ -251,25 +251,23 @@
      }
      <!-- Commercial Property Listings -->
      @if(commercialPropListings?.length>0){
-      <div class="p-4">
-        <h2 class="text-xl font-semibold mb-4">My Commercial Property Listings For Sale</h2>
-        <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
-          @for (listing of commercialPropListings; track listing) {
-          <div class="border rounded-lg p-4 hover:cursor-pointer" [routerLink]="['/details-commercial-property-listing', listing.id]">
-            <div class="flex items-center space-x-4">
-              @if (listing.imageOrder?.length>0){
-              <img src="{{ env.imageBaseUrl }}/pictures/property/{{ listing.imagePath }}/{{ listing.serialId }}/{{ listing.imageOrder[0] }}?_ts={{ ts }}" class="w-12 h-12 object-cover rounded" />
-              } @else {
-              <img src="assets/images/placeholder_properties.jpg" class="w-12 h-12 object-cover rounded" />
-              }
-              <div>
-                <p class="font-medium">{{ selectOptions.getCommercialProperty(listing.type) }}</p>
-                <p class="text-gray-700">{{ listing.title }}</p>
-              </div>
+      <h2 class="text-xl font-semibold mb-4">My Commercial Property Listings For Sale</h2>
+      <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+        @for (listing of commercialPropListings; track listing) {
+        <div class="border rounded-lg p-4 hover:cursor-pointer" [routerLink]="['/details-commercial-property-listing', listing.id]">
+          <div class="flex items-center space-x-4">
+            @if (listing.imageOrder?.length>0){
+            <img src="{{ env.imageBaseUrl }}/pictures/property/{{ listing.imagePath }}/{{ listing.serialId }}/{{ listing.imageOrder[0] }}?_ts={{ ts }}" class="w-12 h-12 object-cover rounded" />
+            } @else {
+            <img src="assets/images/placeholder_properties.jpg" class="w-12 h-12 object-cover rounded" />
+            }
+            <div>
+              <p class="font-medium">{{ selectOptions.getCommercialProperty(listing.type) }}</p>
+              <p class="text-gray-700">{{ listing.title }}</p>
            </div>
          </div>
-          }
        </div>
+        }
      </div>
      } @if( user?.email===keycloakUser?.email || isAdmin()){
      <button class="mt-4 bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600" [routerLink]="['/account', user.id]">Edit</button>
--- a/bizmatch/src/app/pages/listings/business-listings/business-listings.component.html
+++ b/bizmatch/src/app/pages/listings/business-listings/business-listings.component.html
@@ -95,7 +95,12 @@
          <i [class]="selectOptions.getIconAndTextColorType(listing.type)" class="mr-2"></i>
          <span [class]="selectOptions.getTextColorType(listing.type)" class="font-semibold">{{ selectOptions.getBusiness(listing.type) }}</span>
        </div>
-        <h2 class="text-lg font-semibold mb-2">{{ listing.title }}</h2>
+        <h2 class="text-lg font-semibold mb-2">
+          {{ listing.title }}
+          @if(listing.draft){
+          <span class="bg-red-100 text-red-800 text-sm font-medium me-2 ml-2 px-2.5 py-0.5 rounded dark:bg-red-900 dark:text-red-300">Draft</span>
+          }
+        </h2>
        <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>
--- a/bizmatch/src/app/pages/listings/commercial-property-listings/commercial-property-listings.component.html
+++ b/bizmatch/src/app/pages/listings/commercial-property-listings/commercial-property-listings.component.html
@@ -12,7 +12,12 @@
          <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>
+        <h3 class="text-lg font-semibold mb-2">
+          {{ listing.title }}
+          @if(listing.draft){
+          <span class="bg-red-100 text-red-800 text-sm font-medium me-2 ml-2 px-2.5 py-0.5 rounded dark:bg-red-900 dark:text-red-300">Draft</span>
+          }
+        </h3>
        <p class="text-gray-600 mb-2">{{ listing.location.name }}</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">