Aufteilung details in user & listings, listings by user
This commit is contained in:
parent
a2c613c38f
commit
73ab12a694
|
|
@ -19,10 +19,11 @@ export class BusinessListingsController {
|
|||
findById(@Param('id') id:string): any {
|
||||
return this.listingsService.getBusinessListingById(id);
|
||||
}
|
||||
// @Get(':type/:location/:minPrice/:maxPrice/:realEstateChecked')
|
||||
// find(@Param('type') type:string,@Param('location') location:string,@Param('minPrice') minPrice:string,@Param('maxPrice') maxPrice:string,@Param('realEstateChecked') realEstateChecked:boolean): any {
|
||||
// return this.listingsService.find(type,location,minPrice,maxPrice,realEstateChecked);
|
||||
// }
|
||||
@Get('user/:userid')
|
||||
findByUserId(@Param('userid') userid:string): any {
|
||||
return this.listingsService.getBusinessListingByUserId(userid);
|
||||
}
|
||||
|
||||
@Post('search')
|
||||
find(@Body() criteria: any): any {
|
||||
return this.listingsService.findBusinessListings(criteria);
|
||||
|
|
|
|||
|
|
@ -83,6 +83,9 @@ export class ListingsService {
|
|||
async getBusinessListingById(id: string) {
|
||||
return await this.businessListingRepository.fetch(id)
|
||||
}
|
||||
async getBusinessListingByUserId(userid:string){
|
||||
return await this.businessListingRepository.search().where('userId').equals(userid).return.all()
|
||||
}
|
||||
async deleteBusinessListing(id: string){
|
||||
return await this.businessListingRepository.remove(id);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import { Routes } from '@angular/router';
|
||||
import { ListingsComponent } from './pages/listings/listings.component';
|
||||
import { HomeComponent } from './pages/home/home.component';
|
||||
import { DetailsComponent } from './pages/details/details.component';
|
||||
import { DetailsListingComponent } from './pages/details/details-listing/details-listing.component';
|
||||
import { AccountComponent } from './pages/subscription/account/account.component';
|
||||
import { EditListingComponent } from './pages/subscription/edit-listing/edit-listing.component';
|
||||
import { MyListingComponent } from './pages/subscription/my-listing/my-listing.component';
|
||||
|
|
@ -10,6 +10,7 @@ import { EmailUsComponent } from './pages/subscription/email-us/email-us.compone
|
|||
import { authGuard } from './guards/auth.guard';
|
||||
import { PricingComponent } from './pages/pricing/pricing.component';
|
||||
import { LogoutComponent } from './components/logout/logout.component';
|
||||
import { DetailsUserComponent } from './pages/details/details-user/details-user.component';
|
||||
|
||||
|
||||
export const routes: Routes = [
|
||||
|
|
@ -29,8 +30,16 @@ export const routes: Routes = [
|
|||
component: HomeComponent,
|
||||
},
|
||||
{
|
||||
path: 'details/:id',
|
||||
component: DetailsComponent,
|
||||
path: 'details-listing/:type/:id',
|
||||
component: DetailsListingComponent,
|
||||
},
|
||||
{
|
||||
path: 'details-listing/:type/:id',
|
||||
component: DetailsListingComponent,
|
||||
},
|
||||
{
|
||||
path: 'details-user/:id',
|
||||
component: DetailsUserComponent,
|
||||
},
|
||||
{
|
||||
path: 'account',
|
||||
|
|
|
|||
|
|
@ -0,0 +1,141 @@
|
|||
<div class="surface-ground h-full">
|
||||
<div class="px-6 py-5">
|
||||
<div class="surface-card p-4 shadow-2 border-round">
|
||||
<div class="flex justify-content-between align-items-center align-content-center">
|
||||
<div class="font-medium text-3xl text-900 mb-3">{{listing?.title}}</div>
|
||||
<!-- <button pButton pRipple type="button" label="Go back to listings" icon="pi pi-user-plus" class="mr-3 p-button-rounded"></button> -->
|
||||
<p-button icon="pi pi-times" [rounded]="true" severity="danger" (click)="back()"></p-button>
|
||||
</div>
|
||||
<!-- <div class="text-500 mb-5">Egestas sed tempus urna et pharetra pharetra massa massa ultricies.</div> -->
|
||||
<div class="grid">
|
||||
<div class="col-12 md:col-6">
|
||||
<ul class="list-none p-0 m-0 border-top-1 border-300">
|
||||
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Description</div>
|
||||
<div class="text-900 w-full md:w-10 line-height-3">{{listing?.description}}</div>
|
||||
</li>
|
||||
@if (listing && (listing.listingsCategory==='business')){
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap surface-ground">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Category</div>
|
||||
<div class="text-900 w-full md:w-10">
|
||||
<p-chip [label]="selectOptions.getBusiness(listing.type)"></p-chip>
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap ">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Located in</div>
|
||||
<div class="text-900 w-full md:w-10">{{selectOptions.getState(listing.state)}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap surface-ground">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Asking Price</div>
|
||||
<div class="text-900 w-full md:w-10">{{listing.price | currency}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap ">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Real Estate Included</div>
|
||||
<div class="text-900 w-full md:w-10">{{listing.realEstateIncluded?'Yes':'No'}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap surface-ground">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Sales revenue</div>
|
||||
<div class="text-900 w-full md:w-10">{{listing.salesRevenue | currency}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap ">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Cash flow</div>
|
||||
<div class="text-900 w-full md:w-10">{{listing.cashFlow | currency}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap surface-ground">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Employees</div>
|
||||
<div class="text-900 w-full md:w-10">{{listing.employees}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap ">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Broker licensing</div>
|
||||
<div class="text-900 w-full md:w-10">{{listing.brokerLicencing}}</div>
|
||||
</li>
|
||||
}
|
||||
@if (listing && (listing.listingsCategory==='commercialProperty')){
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap surface-ground">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Property Category</div>
|
||||
<div class="text-900 w-full md:w-10">{{selectOptions.getCommercialProperty(listing.type)}}
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap ">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Located in</div>
|
||||
<div class="text-900 w-full md:w-10">{{selectOptions.getState(listing.state)}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap surface-ground">
|
||||
<div class="text-500 w-full md:w-2 font-medium">City</div>
|
||||
<div class="text-900 w-full md:w-10">{{listing.city}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Zip Code</div>
|
||||
<div class="text-900 w-full md:w-10">{{listing.zipCode}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap surface-ground">
|
||||
<div class="text-500 w-full md:w-2 font-medium">County</div>
|
||||
<div class="text-900 w-full md:w-10">{{listing.county}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Asking Price:</div>
|
||||
<div class="text-900 w-full md:w-10">{{listing.price | currency}}</div>
|
||||
</li>
|
||||
}
|
||||
</ul>
|
||||
<p-galleria [value]="propertyImages" [showIndicators]="true" [showThumbnails]="false"
|
||||
[responsiveOptions]="responsiveOptions" [containerStyle]="{ 'max-width': '640px' }"
|
||||
[numVisible]="5">
|
||||
<ng-template pTemplate="item" let-item>
|
||||
<img src="{{environment.apiBaseUrl}}/property/{{listing.id}}/{{item.name}}"
|
||||
style="width: 100%;" />
|
||||
</ng-template>
|
||||
<!-- <ng-template pTemplate="thumbnail" let-item>
|
||||
<div class="grid grid-nogutter justify-content-center">
|
||||
<img src="{{environment.apiBaseUrl}}/property/{{listing.id}}/{{item.name}}" />
|
||||
</div>
|
||||
</ng-template> -->
|
||||
</p-galleria>
|
||||
@if(listing && user && (user.id===listing?.userId || isAdmin())){
|
||||
<button pButton pRipple label="Edit" icon="pi pi-file-edit" class="w-auto"
|
||||
[routerLink]="['/editListing',listing.id]"></button>
|
||||
}
|
||||
</div>
|
||||
<div class="col-12 md:col-6">
|
||||
<div class="surface-card p-4 border-round p-fluid">
|
||||
<div class="font-medium text-xl text-primary text-900 mb-3">Contact The Author of This Listing
|
||||
</div>
|
||||
<div class="font-italic text-sm text-900 mb-5">Please Include your contact info below:</div>
|
||||
<div class="grid formgrid p-fluid">
|
||||
<div class="field mb-4 col-12 md:col-6">
|
||||
<label for="name" class="font-medium text-900">Your Name</label>
|
||||
<input id="name" type="text" pInputText [(ngModel)]="mailinfo.sender.name">
|
||||
</div>
|
||||
<div class="field mb-4 col-12 md:col-6">
|
||||
<label for="email" class="font-medium text-900">Your Email</label>
|
||||
<input id="email" type="text" pInputText [(ngModel)]="mailinfo.sender.email">
|
||||
</div>
|
||||
<div class="field mb-4 col-12 md:col-6">
|
||||
<label for="phoneNumber" class="font-medium text-900">Phone Number</label>
|
||||
<input id="phoneNumber" type="text" pInputText
|
||||
[(ngModel)]="mailinfo.sender.phoneNumber">
|
||||
</div>
|
||||
<div class="field mb-4 col-12 md:col-6">
|
||||
<label for="state" class="font-medium text-900">Country/State</label>
|
||||
<input id="state" type="text" pInputText [(ngModel)]="mailinfo.sender.state">
|
||||
</div>
|
||||
<div class="surface-border border-top-1 opacity-50 mb-4 col-12"></div>
|
||||
<div class="field mb-4 col-12">
|
||||
<label for="notes" class="font-medium text-900">Questions/Comments</label>
|
||||
<textarea id="notes" pInputTextarea [autoResize]="true" [rows]="5"
|
||||
[(ngModel)]="mailinfo.sender.comments"></textarea>
|
||||
</div>
|
||||
<div class="surface-border border-top-1 opacity-50 mb-4 col-12"></div>
|
||||
</div>
|
||||
<button pButton pRipple label="Submit" icon="pi pi-file" class="w-auto"
|
||||
(click)="mail()"></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,91 @@
|
|||
import { Component } from '@angular/core';
|
||||
import { ButtonModule } from 'primeng/button';
|
||||
import { CheckboxModule } from 'primeng/checkbox';
|
||||
import { InputTextModule } from 'primeng/inputtext';
|
||||
import { StyleClassModule } from 'primeng/styleclass';
|
||||
import { SelectOptionsService } from '../../../services/select-options.service';
|
||||
import { DropdownModule } from 'primeng/dropdown';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { ToggleButtonModule } from 'primeng/togglebutton';
|
||||
import { TagModule } from 'primeng/tag';
|
||||
import data from '../../../../assets/data/listings.json';
|
||||
import { ActivatedRoute, Router, RouterModule } from '@angular/router';
|
||||
import { InputTextareaModule } from 'primeng/inputtextarea';
|
||||
import { ChipModule } from 'primeng/chip';
|
||||
import { lastValueFrom } from 'rxjs';
|
||||
import { ListingsService } from '../../../services/listings.service';
|
||||
import { UserService } from '../../../services/user.service';
|
||||
import onChange from 'on-change';
|
||||
import { createGenericObject, getCriteriaStateObject, getSessionStorageHandler } from '../../../utils/utils';
|
||||
import { ImageProperty, ListingCriteria, ListingType, MailInfo, User } from '../../../../../../common-models/src/main.model';
|
||||
import { MailService } from '../../../services/mail.service';
|
||||
import { MessageService } from 'primeng/api';
|
||||
import { SharedModule } from '../../../shared/shared/shared.module';
|
||||
import { GalleriaModule } from 'primeng/galleria';
|
||||
import { environment } from '../../../../environments/environment';
|
||||
@Component({
|
||||
selector: 'app-details-listing',
|
||||
standalone: true,
|
||||
imports: [SharedModule, GalleriaModule],
|
||||
providers: [MessageService],
|
||||
templateUrl: './details-listing.component.html',
|
||||
styleUrl: './details-listing.component.scss'
|
||||
})
|
||||
export class DetailsListingComponent {
|
||||
// listings: Array<BusinessListing>;
|
||||
responsiveOptions = [
|
||||
{
|
||||
breakpoint: '1199px',
|
||||
numVisible: 1,
|
||||
numScroll: 1
|
||||
},
|
||||
{
|
||||
breakpoint: '991px',
|
||||
numVisible: 2,
|
||||
numScroll: 1
|
||||
},
|
||||
{
|
||||
breakpoint: '767px',
|
||||
numVisible: 1,
|
||||
numScroll: 1
|
||||
}
|
||||
];
|
||||
private id: string | undefined = this.activatedRoute.snapshot.params['id'] as string | undefined;
|
||||
private type: 'business'|'commercialProperty' | undefined = this.activatedRoute.snapshot.params['type'] as 'business'|'commercialProperty' | undefined;
|
||||
listing: ListingType;
|
||||
criteria: ListingCriteria
|
||||
mailinfo: MailInfo;
|
||||
propertyImages: ImageProperty[] = []
|
||||
environment = environment;
|
||||
user:User
|
||||
constructor(private activatedRoute: ActivatedRoute,
|
||||
private listingsService: ListingsService,
|
||||
private router: Router,
|
||||
private userService: UserService,
|
||||
public selectOptions: SelectOptionsService,
|
||||
private mailService: MailService,
|
||||
private messageService: MessageService) {
|
||||
this.userService.getUserObservable().subscribe(user => {
|
||||
this.user = user
|
||||
});
|
||||
this.criteria = onChange(getCriteriaStateObject(), getSessionStorageHandler);
|
||||
this.mailinfo = { sender: {}, userId: '' }
|
||||
}
|
||||
|
||||
async ngOnInit() {
|
||||
this.listing = await lastValueFrom(this.listingsService.getListingById(this.id, this.type));
|
||||
this.propertyImages = await this.listingsService.getPropertyImages(this.listing.id)
|
||||
}
|
||||
back() {
|
||||
this.router.navigate(['listings', this.criteria.listingsCategory])
|
||||
}
|
||||
isAdmin() {
|
||||
return this.userService.hasAdminRole();
|
||||
}
|
||||
async mail() {
|
||||
this.mailinfo.userId = this.listing.userId;
|
||||
await this.mailService.mail(this.mailinfo);
|
||||
this.messageService.add({ severity: 'info', summary: 'Confirmed', detail: 'Your message has been sent to the creator of the listing', life: 3000 });
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,131 @@
|
|||
<div class="surface-ground h-full">
|
||||
<div class="px-6 py-5">
|
||||
<div class="surface-card p-4 shadow-2 border-round">
|
||||
<!-- <div class="flex justify-content-between align-items-center align-content-center">
|
||||
<div class="font-medium text-3xl text-900 mb-3">{{listing?.title}}</div>
|
||||
<p-button icon="pi pi-times" [rounded]="true" severity="danger" (click)="back()"></p-button>
|
||||
</div> -->
|
||||
<div class="surface-section px-6 pt-5">
|
||||
<div class="flex align-items-start flex-column lg:flex-row lg:justify-content-between">
|
||||
<div class="flex align-items-start flex-column md:flex-row">
|
||||
<img src="{{environment.apiBaseUrl}}/profile/{{user.id}}" class="mr-5 mb-3 lg:mb-0"
|
||||
style="width:90px;height:90px" />
|
||||
<div>
|
||||
<span class="text-900 font-medium text-3xl">{{user.firstname}} {{user.lastname}}</span>
|
||||
<i class="pi pi-star text-2xl ml-4 text-yellow-500"></i>
|
||||
<div class="flex align-items-center flex-wrap text-sm">
|
||||
<div class="mr-5 mt-3">
|
||||
<span class="font-medium text-500">Company</span>
|
||||
<div class="text-700 mt-2">{{user.companyName}}</div>
|
||||
</div>
|
||||
<div class="mr-5 mt-3">
|
||||
<span class="font-medium text-500">For Sale</span>
|
||||
<div class="text-700 mt-2">12</div>
|
||||
</div>
|
||||
<div class="mr-5 mt-3">
|
||||
<span class="font-medium text-500">Sold</span>
|
||||
<div class="text-700 mt-2">8</div>
|
||||
</div>
|
||||
<div class="flex align-items-center mt-3">
|
||||
<!-- <span class="font-medium text-500">Logo</span> -->
|
||||
<div ><img src="{{environment.apiBaseUrl}}/logo/{{user.id}}"
|
||||
class="mr-5 lg:mb-0" style="width:100px;height:30px" /></div>
|
||||
<!-- <div class="text-700 mt-2">130</div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- <div class="mt-3 lg:mt-0">
|
||||
<button pButton pRipple icon="pi pi-bookmark" class="p-button-rounded mr-2"></button>
|
||||
<button pButton pRipple icon="pi pi-heart" class="p-button-rounded p-button-success mr-2"></button>
|
||||
<button pButton pRipple icon="pi pi-list" class="p-button-rounded p-button-help"></button>
|
||||
</div> -->
|
||||
</div>
|
||||
<p class="mt-2 text-700 line-height-3 text-l font-semibold">{{user.description}}</p>
|
||||
</div>
|
||||
<div class="px-6 py-5">
|
||||
<div class="surface-card p-4 shadow-2 border-round">
|
||||
<div class="font-medium text-3xl text-900 mb-3">Company Profile</div>
|
||||
<div class="text-500 mb-5">{{user.companyOverview}}</div>
|
||||
<ul class="list-none p-0 m-0 border-top-1 border-300">
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap surface-ground">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Name</div>
|
||||
<div class="text-900 w-full md:w-10">{{user.firstname}} {{user.lastname}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Phone Number</div>
|
||||
<div class="text-900 w-full md:w-10 line-height-3">{{user.phoneNumber}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap surface-ground">
|
||||
<div class="text-500 w-full md:w-2 font-medium">EMail Address</div>
|
||||
<div class="text-900 w-full md:w-10 line-height-3">{{user.email}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Company Location</div>
|
||||
<div class="text-900 w-full md:w-10 line-height-3">{{user.companyLocation}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap surface-ground">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Company Overview</div>
|
||||
<div class="text-900 w-full md:w-10 line-height-3">{{user.companyOverview}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap ">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Services we offer</div>
|
||||
<div class="text-900 w-full md:w-10">{{user.offeredServices}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap surface-ground">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Areas we serve</div>
|
||||
<div class="text-900 w-full md:w-10">
|
||||
@for (area of user.areasServed; track area) {
|
||||
<p-tag styleClass="mr-2" [value]="area" [rounded]="true"></p-tag>
|
||||
}
|
||||
<!-- <p-tag styleClass="mr-2" severity="success" value="Javascript" [rounded]="true"></p-tag>
|
||||
<p-tag styleClass="mr-2" severity="danger" value="Python" [rounded]="true"></p-tag>
|
||||
<p-tag severity="warning" value="SQL" [rounded]="true"></p-tag> -->
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap
|
||||
">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Licensed In</div>
|
||||
<div class="text-900 w-full md:w-10">
|
||||
@for (license of user.licensedIn; track license) {
|
||||
<div>{{license.name}} : {{license.value}}</div>
|
||||
}
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap surface-ground">
|
||||
<div class="text-500 w-full md:w-2 font-medium">My Listings For Sale</div>
|
||||
<div class="text-900 w-full md:w-10">
|
||||
<div class="grid mt-0 mr-0">
|
||||
@for (listing of userListings; track listing) {
|
||||
<div class="col-12 md:col-6 cursor-pointer" [routerLink]="['/details-listing/business',listing.id]">
|
||||
<div class="p-3 border-1 surface-border border-round surface-card">
|
||||
<div class="text-900 mb-2">
|
||||
<span [class]="selectOptions.getBgColorType(listing.type)"
|
||||
class="inline-flex border-circle align-items-center justify-content-center mr-3"
|
||||
style="width:38px;height:38px">
|
||||
<i [class]="selectOptions.getIconAndTextColorType(listing.type)"
|
||||
class="pi text-xl"></i>
|
||||
</span>
|
||||
<span
|
||||
class="font-medium">{{selectOptions.getBusiness(listing.type)}}</span>
|
||||
</div>
|
||||
<div class="text-700">{{listing.title}}</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@if( user?.id===(user$| async)?.id || isAdmin()){
|
||||
<button pButton pRipple label="Edit" icon="pi pi-file-edit" class="w-auto"
|
||||
[routerLink]="['/account']"></button>
|
||||
}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,47 @@
|
|||
import { Component } from '@angular/core';
|
||||
import { SharedModule } from '../../../shared/shared/shared.module';
|
||||
import { GalleriaModule } from 'primeng/galleria';
|
||||
import { MessageService } from 'primeng/api';
|
||||
import { BusinessListing, ListingCriteria, ListingType, User } from '../../../../../../common-models/src/main.model';
|
||||
import { environment } from '../../../../environments/environment';
|
||||
import { ActivatedRoute, Router } from '@angular/router';
|
||||
import { UserService } from '../../../services/user.service';
|
||||
import { Observable } from 'rxjs';
|
||||
import { ListingsService } from '../../../services/listings.service';
|
||||
import { SelectOptionsService } from '../../../services/select-options.service';
|
||||
|
||||
@Component({
|
||||
selector: 'app-details-user',
|
||||
standalone: true,
|
||||
imports: [SharedModule, GalleriaModule],
|
||||
providers: [MessageService],
|
||||
templateUrl: './details-user.component.html',
|
||||
styleUrl: './details-user.component.scss'
|
||||
})
|
||||
export class DetailsUserComponent {
|
||||
private id: string | undefined = this.activatedRoute.snapshot.params['id'] as string | undefined;
|
||||
user: User;
|
||||
user$:Observable<User>
|
||||
environment = environment;
|
||||
criteria:ListingCriteria;
|
||||
userListings:BusinessListing[]
|
||||
constructor(private activatedRoute: ActivatedRoute,
|
||||
private router: Router,
|
||||
private userService: UserService,
|
||||
private listingsService:ListingsService,
|
||||
private messageService: MessageService,
|
||||
public selectOptions: SelectOptionsService) {
|
||||
}
|
||||
|
||||
async ngOnInit() {
|
||||
this.user = await this.userService.getById(this.id);
|
||||
this.userListings = await this.listingsService.getListingByUserId(this.id);
|
||||
this.user$ = this.userService.getUserObservable();
|
||||
}
|
||||
back() {
|
||||
this.router.navigate(['listings', this.criteria.listingsCategory])
|
||||
}
|
||||
isAdmin() {
|
||||
return this.userService.hasAdminRole();
|
||||
}
|
||||
}
|
||||
|
|
@ -1,243 +0,0 @@
|
|||
<div class="surface-ground h-full">
|
||||
<div class="px-6 py-5">
|
||||
<div class="surface-card p-4 shadow-2 border-round">
|
||||
<div class="flex justify-content-between align-items-center align-content-center">
|
||||
<div class="font-medium text-3xl text-900 mb-3">{{listing?.title}}</div>
|
||||
<!-- <button pButton pRipple type="button" label="Go back to listings" icon="pi pi-user-plus" class="mr-3 p-button-rounded"></button> -->
|
||||
<p-button icon="pi pi-times" [rounded]="true" severity="danger" (click)="back()"></p-button>
|
||||
</div>
|
||||
<!-- <div class="text-500 mb-5">Egestas sed tempus urna et pharetra pharetra massa massa ultricies.</div> -->
|
||||
@if (listing){
|
||||
<div class="grid">
|
||||
<div class="col-12 md:col-6">
|
||||
<ul class="list-none p-0 m-0 border-top-1 border-300">
|
||||
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Description</div>
|
||||
<div class="text-900 w-full md:w-10 line-height-3">{{listing?.description}}</div>
|
||||
</li>
|
||||
@if (listing && (listing.listingsCategory==='business')){
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap surface-ground">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Category</div>
|
||||
<div class="text-900 w-full md:w-10">
|
||||
<p-chip [label]="selectOptions.getBusiness(listing.type)"></p-chip>
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap ">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Located in</div>
|
||||
<div class="text-900 w-full md:w-10">{{selectOptions.getState(listing.state)}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap surface-ground">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Asking Price</div>
|
||||
<div class="text-900 w-full md:w-10">{{listing.price | currency}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap ">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Real Estate Included</div>
|
||||
<div class="text-900 w-full md:w-10">{{listing.realEstateIncluded?'Yes':'No'}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap surface-ground">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Sales revenue</div>
|
||||
<div class="text-900 w-full md:w-10">{{listing.salesRevenue | currency}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap ">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Cash flow</div>
|
||||
<div class="text-900 w-full md:w-10">{{listing.cashFlow | currency}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap surface-ground">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Employees</div>
|
||||
<div class="text-900 w-full md:w-10">{{listing.employees}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap ">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Broker licensing</div>
|
||||
<div class="text-900 w-full md:w-10">{{listing.brokerLicencing}}</div>
|
||||
</li>
|
||||
}
|
||||
@if (listing && (listing.listingsCategory==='commercialProperty')){
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap surface-ground">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Property Category</div>
|
||||
<div class="text-900 w-full md:w-10">{{selectOptions.getCommercialProperty(listing.type)}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap ">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Located in</div>
|
||||
<div class="text-900 w-full md:w-10">{{selectOptions.getState(listing.state)}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap surface-ground">
|
||||
<div class="text-500 w-full md:w-2 font-medium">City</div>
|
||||
<div class="text-900 w-full md:w-10">{{listing.city}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Zip Code</div>
|
||||
<div class="text-900 w-full md:w-10">{{listing.zipCode}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap surface-ground">
|
||||
<div class="text-500 w-full md:w-2 font-medium">County</div>
|
||||
<div class="text-900 w-full md:w-10">{{listing.county}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Asking Price:</div>
|
||||
<div class="text-900 w-full md:w-10">{{listing.price | currency}}</div>
|
||||
</li>
|
||||
}
|
||||
</ul>
|
||||
<p-galleria [value]="propertyImages" [showIndicators]="true" [showThumbnails]="false" [responsiveOptions]="responsiveOptions" [containerStyle]="{ 'max-width': '640px' }" [numVisible]="5">
|
||||
<ng-template pTemplate="item" let-item>
|
||||
<img src="{{environment.apiBaseUrl}}/property/{{listing.id}}/{{item.name}}" style="width: 100%;" />
|
||||
</ng-template>
|
||||
<!-- <ng-template pTemplate="thumbnail" let-item>
|
||||
<div class="grid grid-nogutter justify-content-center">
|
||||
<img src="{{environment.apiBaseUrl}}/property/{{listing.id}}/{{item.name}}" />
|
||||
</div>
|
||||
</ng-template> -->
|
||||
</p-galleria>
|
||||
@if(listing && user && (user.id===listing?.userId || isAdmin())){
|
||||
<button pButton pRipple label="Edit" icon="pi pi-file-edit" class="w-auto" [routerLink]="['/editListing',listing.id]"></button>
|
||||
}
|
||||
</div>
|
||||
<div class="col-12 md:col-6">
|
||||
<div class="surface-card p-4 border-round p-fluid">
|
||||
<div class="font-medium text-xl text-primary text-900 mb-3">Contact The Author of This Listing
|
||||
</div>
|
||||
<div class="font-italic text-sm text-900 mb-5">Please Include your contact info below:</div>
|
||||
<div class="grid formgrid p-fluid">
|
||||
<div class="field mb-4 col-12 md:col-6">
|
||||
<label for="name" class="font-medium text-900">Your Name</label>
|
||||
<input id="name" type="text" pInputText [(ngModel)]="mailinfo.sender.name">
|
||||
</div>
|
||||
<div class="field mb-4 col-12 md:col-6">
|
||||
<label for="email" class="font-medium text-900">Your Email</label>
|
||||
<input id="email" type="text" pInputText [(ngModel)]="mailinfo.sender.email">
|
||||
</div>
|
||||
<div class="field mb-4 col-12 md:col-6">
|
||||
<label for="phoneNumber" class="font-medium text-900">Phone Number</label>
|
||||
<input id="phoneNumber" type="text" pInputText [(ngModel)]="mailinfo.sender.phoneNumber">
|
||||
</div>
|
||||
<div class="field mb-4 col-12 md:col-6">
|
||||
<label for="state" class="font-medium text-900">Country/State</label>
|
||||
<input id="state" type="text" pInputText [(ngModel)]="mailinfo.sender.state">
|
||||
</div>
|
||||
<div class="surface-border border-top-1 opacity-50 mb-4 col-12"></div>
|
||||
<div class="field mb-4 col-12">
|
||||
<label for="notes" class="font-medium text-900">Questions/Comments</label>
|
||||
<textarea id="notes" pInputTextarea [autoResize]="true" [rows]="5" [(ngModel)]="mailinfo.sender.comments"></textarea>
|
||||
</div>
|
||||
<div class="surface-border border-top-1 opacity-50 mb-4 col-12"></div>
|
||||
</div>
|
||||
<button pButton pRipple label="Submit" icon="pi pi-file" class="w-auto" (click)="mail()"></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
} @else {
|
||||
<div class="surface-section px-6 py-5">
|
||||
<div class="flex align-items-start flex-column lg:flex-row lg:justify-content-between">
|
||||
<div class="flex align-items-start flex-column md:flex-row">
|
||||
<img src="{{environment.apiBaseUrl}}/profile/{{user.id}}" class="mr-5 mb-3 lg:mb-0" style="width:90px;height:90px" />
|
||||
<div>
|
||||
<span class="text-900 font-medium text-3xl">{{user.firstname}} {{user.lastname}}</span>
|
||||
<i class="pi pi-star text-2xl ml-4 text-yellow-500"></i>
|
||||
<div class="flex align-items-center flex-wrap text-sm">
|
||||
<div class="mr-5 mt-3">
|
||||
<span class="font-medium text-500">Company</span>
|
||||
<div class="text-700 mt-2">{{user.companyName}}</div>
|
||||
</div>
|
||||
<div class="mr-5 mt-3">
|
||||
<span class="font-medium text-500">For Sale</span>
|
||||
<div class="text-700 mt-2">12</div>
|
||||
</div>
|
||||
<div class="mr-5 mt-3">
|
||||
<span class="font-medium text-500">Sold</span>
|
||||
<div class="text-700 mt-2">8</div>
|
||||
</div>
|
||||
<div class="mt-3">
|
||||
<span class="font-medium text-500">Logo</span>
|
||||
<div class="mt-2"><img src="{{environment.apiBaseUrl}}/logo/{{user.id}}" class="mr-5 mb-3 lg:mb-0" style="width:100px;height:30px" /></div>
|
||||
<!-- <div class="text-700 mt-2">130</div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="mt-3 lg:mt-0">
|
||||
<button pButton pRipple icon="pi pi-bookmark" class="p-button-rounded mr-2"></button>
|
||||
<button pButton pRipple icon="pi pi-heart" class="p-button-rounded p-button-success mr-2"></button>
|
||||
<button pButton pRipple icon="pi pi-list" class="p-button-rounded p-button-help"></button>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="px-6 py-5">
|
||||
<div class="surface-card p-4 shadow-2 border-round">
|
||||
<div class="font-medium text-3xl text-900 mb-3">Company Profile</div>
|
||||
<div class="text-500 mb-5">{{user.companyOverview}}</div>
|
||||
<ul class="list-none p-0 m-0 border-top-1 border-300">
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap surface-ground">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Name</div>
|
||||
<div class="text-900 w-full md:w-10">{{user.firstname}} {{user.lastname}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Description</div>
|
||||
<div class="text-900 w-full md:w-10 line-height-3">{{user.description}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap surface-ground">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Services we offer</div>
|
||||
<div class="text-900 w-full md:w-10">{{user.offeredServices}}</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap">
|
||||
<div class="text-500 w-full md:w-2 font-medium">Areas we serve</div>
|
||||
<div class="text-900 w-full md:w-10">
|
||||
@for (area of user.areasServed; track area) {
|
||||
<p-tag styleClass="mr-2" [value]="area" [rounded]="true"></p-tag>
|
||||
}
|
||||
<!-- <p-tag styleClass="mr-2" severity="success" value="Javascript" [rounded]="true"></p-tag>
|
||||
<p-tag styleClass="mr-2" severity="danger" value="Python" [rounded]="true"></p-tag>
|
||||
<p-tag severity="warning" value="SQL" [rounded]="true"></p-tag> -->
|
||||
</div>
|
||||
</li>
|
||||
<li class="flex align-items-center py-3 px-2 flex-wrap surface-ground">
|
||||
<div class="text-500 w-full md:w-2 font-medium">My Listings For Sale</div>
|
||||
<div class="text-900 w-full md:w-10">
|
||||
<div class="grid mt-0 mr-0">
|
||||
<div class="col-12 md:col-6">
|
||||
<div class="p-3 border-1 surface-border border-round surface-card">
|
||||
<div class="text-900 mb-2">
|
||||
<i class="pi pi-github mr-2"></i>
|
||||
<span class="font-medium">PrimeFaces</span>
|
||||
</div>
|
||||
<div class="text-700">Ultimate UI Component Suite for JavaServer Faces</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 md:col-6">
|
||||
<div class="p-3 border-1 surface-border border-round surface-card">
|
||||
<div class="text-900 mb-2">
|
||||
<i class="pi pi-github mr-2"></i>
|
||||
<span class="font-medium">PrimeNG</span>
|
||||
</div>
|
||||
<div class="text-700">The Most Complete Angular UI Component Library</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 md:col-6">
|
||||
<div class="p-3 border-1 surface-border border-round surface-card">
|
||||
<div class="text-900 mb-2">
|
||||
<i class="pi pi-github mr-2"></i>
|
||||
<span class="font-medium">PrimeReact</span>
|
||||
</div>
|
||||
<div class="text-700">Advanced UI Components for ReactJS</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 md:col-6">
|
||||
<div class="p-3 border-1 surface-border border-round surface-card">
|
||||
<div class="text-900 mb-2">
|
||||
<i class="pi pi-github mr-2"></i>
|
||||
<span class="font-medium">PrimeVue</span>
|
||||
</div>
|
||||
<div class="text-700">The Most Powerful Vue UI Component Library</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
@ -1,90 +0,0 @@
|
|||
import { Component } from '@angular/core';
|
||||
import { ButtonModule } from 'primeng/button';
|
||||
import { CheckboxModule } from 'primeng/checkbox';
|
||||
import { InputTextModule } from 'primeng/inputtext';
|
||||
import { StyleClassModule } from 'primeng/styleclass';
|
||||
import { SelectOptionsService } from '../../services/select-options.service';
|
||||
import { DropdownModule } from 'primeng/dropdown';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { ToggleButtonModule } from 'primeng/togglebutton';
|
||||
import { TagModule } from 'primeng/tag';
|
||||
import data from '../../../assets/data/listings.json';
|
||||
import { ActivatedRoute, Router, RouterModule } from '@angular/router';
|
||||
import { InputTextareaModule } from 'primeng/inputtextarea';
|
||||
import { ChipModule } from 'primeng/chip';
|
||||
import { lastValueFrom } from 'rxjs';
|
||||
import { ListingsService } from '../../services/listings.service';
|
||||
import { UserService } from '../../services/user.service';
|
||||
import onChange from 'on-change';
|
||||
import { createGenericObject, getCriteriaStateObject, getSessionStorageHandler } from '../../utils/utils';
|
||||
import { ImageProperty, ListingCriteria, ListingType, MailInfo, User } from '../../../../../common-models/src/main.model';
|
||||
import { MailService } from '../../services/mail.service';
|
||||
import { MessageService } from 'primeng/api';
|
||||
import { SharedModule } from '../../shared/shared/shared.module';
|
||||
import { GalleriaModule } from 'primeng/galleria';
|
||||
import { environment } from '../../../environments/environment';
|
||||
@Component({
|
||||
selector: 'app-details',
|
||||
standalone: true,
|
||||
imports: [SharedModule,GalleriaModule],
|
||||
providers:[MessageService],
|
||||
templateUrl: './details.component.html',
|
||||
styleUrl: './details.component.scss'
|
||||
})
|
||||
export class DetailsComponent {
|
||||
// listings: Array<BusinessListing>;
|
||||
responsiveOptions = [
|
||||
{
|
||||
breakpoint: '1199px',
|
||||
numVisible: 1,
|
||||
numScroll: 1
|
||||
},
|
||||
{
|
||||
breakpoint: '991px',
|
||||
numVisible: 2,
|
||||
numScroll: 1
|
||||
},
|
||||
{
|
||||
breakpoint: '767px',
|
||||
numVisible: 1,
|
||||
numScroll: 1
|
||||
}
|
||||
];
|
||||
private id: string | undefined = this.activatedRoute.snapshot.params['id'] as string | undefined;
|
||||
listing: ListingType;
|
||||
user:User;
|
||||
criteria:ListingCriteria
|
||||
mailinfo: MailInfo;
|
||||
propertyImages:ImageProperty[]=[]
|
||||
environment=environment;
|
||||
constructor(private activatedRoute: ActivatedRoute,
|
||||
private listingsService:ListingsService,
|
||||
private router:Router,
|
||||
private userService:UserService,
|
||||
public selectOptions: SelectOptionsService,
|
||||
private mailService:MailService,
|
||||
private messageService: MessageService){
|
||||
this.criteria = onChange(getCriteriaStateObject(),getSessionStorageHandler);
|
||||
this.mailinfo = {sender:{},userId:''}
|
||||
}
|
||||
|
||||
async ngOnInit(){
|
||||
this.userService.getUserObservable().subscribe(user=>{
|
||||
this.user=user
|
||||
});
|
||||
this.listing=await lastValueFrom(this.listingsService.getListingById(this.id,this.criteria.listingsCategory));
|
||||
this.propertyImages=await this.listingsService.getPropertyImages(this.listing.id)
|
||||
}
|
||||
back(){
|
||||
this.router.navigate(['listings',this.criteria.listingsCategory])
|
||||
}
|
||||
isAdmin(){
|
||||
return this.userService.hasAdminRole();
|
||||
}
|
||||
async mail(){
|
||||
this.mailinfo.userId=this.listing.userId;
|
||||
await this.mailService.mail(this.mailinfo);
|
||||
this.messageService.add({ severity: 'info', summary: 'Confirmed', detail: 'Your message has been sent to the creator of the listing', life: 3000 });
|
||||
}
|
||||
}
|
||||
|
|
@ -80,7 +80,7 @@
|
|||
</div>
|
||||
<div class="px-4 py-3 surface-100 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',listing.id]"></button>
|
||||
class="p-button-rounded p-button-success" [routerLink]="['/details-listing/business',listing.id]"></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -114,7 +114,7 @@
|
|||
</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',listing.id]"></button>
|
||||
class="p-button-rounded p-button-success" [routerLink]="['/details-listing/commercialProperty',listing.id]"></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -136,7 +136,7 @@
|
|||
<div class="px-4 py-3 text-right flex justify-content-between align-items-center">
|
||||
<img *ngIf="user.hasCompanyLogo" src="{{environment.apiBaseUrl}}/logo/{{user.id}}" class="rounded-image"/>
|
||||
<button pButton pRipple icon="pi pi-arrow-right" iconPos="right" label="View Full profile"
|
||||
class="p-button-rounded p-button-success" [routerLink]="['/details',user.id]"></button>
|
||||
class="p-button-rounded p-button-success" [routerLink]="['/details-user',user.id]"></button>
|
||||
|
||||
</div>
|
||||
<!-- <div class="mt-auto ml-auto">
|
||||
|
|
|
|||
|
|
@ -21,9 +21,12 @@ export class ListingsService {
|
|||
const result = await lastValueFrom(this.http.post<ListingType[]>(`${this.apiBaseUrl}/bizmatch/listings/${criteria.listingsCategory}/search`,criteria));
|
||||
return result;
|
||||
}
|
||||
getListingById(id:string,listingsCategory?:'business'|'professionals_brokers'|'commercialProperty'):Observable<ListingType>{
|
||||
getListingById(id:string,listingsCategory?:'business'|'commercialProperty'):Observable<ListingType>{
|
||||
return this.http.get<ListingType>(`${this.apiBaseUrl}/bizmatch/listings/${listingsCategory}/${id}`);
|
||||
}
|
||||
getListingByUserId(userid:string):Promise<BusinessListing[]>{
|
||||
return lastValueFrom(this.http.get<BusinessListing[]>(`${this.apiBaseUrl}/bizmatch/listings/business/user/${userid}`));
|
||||
}
|
||||
async save(listing:any,listingsCategory:'business'|'professionals_brokers'|'commercialProperty'){
|
||||
await lastValueFrom(this.http.post<ListingType>(`${this.apiBaseUrl}/bizmatch/listings/${listingsCategory}`,listing));
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@ export class LoadingService {
|
|||
|
||||
public isLoading$ = this.loading$.asObservable().pipe(
|
||||
map((loading) => loading.length > 0),
|
||||
debounceTime(100),
|
||||
debounceTime(200),
|
||||
distinctUntilChanged(),
|
||||
shareReplay(1)
|
||||
);
|
||||
|
|
|
|||
Loading…
Reference in New Issue