146 lines
10 KiB
HTML
146 lines
10 KiB
HTML
<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">
|
|
<!-- @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">Summary</div>
|
|
<div class="w-full md:w-10">
|
|
@for (summary of listing.summary; track summary; let idx = $index; let last = $last) {
|
|
<div class="text-900">{{summary}}</div>
|
|
@if (!last) {
|
|
<br/>
|
|
}
|
|
}
|
|
</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">{{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==='professionals_brokers')){
|
|
<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">Located in</div>
|
|
<div class="text-900 w-full md:w-10">{{selectOptions.getLocation(listing.location)}}</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">Address</div>
|
|
<div class="text-900 w-full md:w-10">{{listing.address}}</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</div>
|
|
<div class="text-900 w-full md:w-10">{{listing.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">Website</div>
|
|
<div class="text-900 w-full md:w-10">{{listing.website}}</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">Category</div>
|
|
<div class="text-900 w-full md:w-10">{{listing.category}}</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">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">
|
|
<div class="text-500 w-full md:w-2 font-medium">EMail</div>
|
|
<div class="text-900 w-full md:w-10">{{listing.email}}</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">Website</div>
|
|
<div class="text-900 w-full md:w-10">{{listing.website}}</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">{{listing.phoneNumber}}</div>
|
|
</li>
|
|
}
|
|
</ul>
|
|
@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> |