conversion inputs to components
This commit is contained in:
@@ -2,28 +2,37 @@
|
||||
<div class="bg-white rounded-lg shadow-md p-6">
|
||||
<h1 class="text-2xl font-semibold mb-6">Edit Listing</h1>
|
||||
@if(listing){
|
||||
<form #listingForm="ngForm">
|
||||
<form #listingForm="ngForm" class="space-y-4">
|
||||
<div class="mb-4">
|
||||
<label for="listingsCategory" class="block text-sm font-bold text-gray-700 mb-1">Listing category</label>
|
||||
<ng-select [readonly]="mode === 'edit'" [items]="selectOptions?.listingCategories" bindLabel="name" bindValue="value" [(ngModel)]="listing.listingsCategory" name="listingsCategory"> </ng-select>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<!-- <div class="mb-4">
|
||||
<label for="title" class="block text-sm font-bold text-gray-700 mb-1">Title of Listing</label>
|
||||
<input type="text" id="title" [(ngModel)]="listing.title" name="title" class="w-full p-2 border border-gray-300 rounded-md" />
|
||||
</div> -->
|
||||
<div>
|
||||
<app-validated-input label="Title of Listing" name="title" [(ngModel)]="listing.title"></app-validated-input>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<!-- <div class="mb-4">
|
||||
<label for="description" class="block text-sm font-bold text-gray-700 mb-1">Description</label>
|
||||
<quill-editor [(ngModel)]="listing.description" name="description" [modules]="quillModules"></quill-editor>
|
||||
</div> -->
|
||||
<div>
|
||||
<app-validated-quill label="Description" name="description" [(ngModel)]="listing.description"></app-validated-quill>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<!-- <div class="mb-4">
|
||||
<label for="type" class="block text-sm font-bold text-gray-700 mb-1">Type of business</label>
|
||||
<ng-select [items]="typesOfBusiness" bindLabel="name" bindValue="value" [(ngModel)]="listing.type" name="type"> </ng-select>
|
||||
</div> -->
|
||||
<div>
|
||||
<app-validated-ng-select label="Type of business" name="type" [(ngModel)]="listing.type" [items]="typesOfBusiness"></app-validated-ng-select>
|
||||
</div>
|
||||
|
||||
<div class="flex mb-4 space-x-4">
|
||||
<!-- <div class="flex mb-4 space-x-4">
|
||||
<div class="w-1/2">
|
||||
<label for="state" class="block text-sm font-bold text-gray-700 mb-1">State</label>
|
||||
<ng-select [items]="selectOptions?.states" bindLabel="name" bindValue="value" [(ngModel)]="listing.state" name="state"> </ng-select>
|
||||
@@ -32,9 +41,13 @@
|
||||
<label for="city" class="block text-sm font-bold text-gray-700 mb-1">City</label>
|
||||
<input type="text" id="city" [(ngModel)]="listing.city" name="city" 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">
|
||||
<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>
|
||||
</div>
|
||||
|
||||
<div class="flex mb-4 space-x-4">
|
||||
<!-- <div class="flex mb-4 space-x-4">
|
||||
<div class="w-1/2">
|
||||
<label for="price" class="block text-sm font-bold text-gray-700 mb-1">Price</label>
|
||||
<input
|
||||
@@ -59,9 +72,13 @@
|
||||
currencyMask
|
||||
/>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<app-validated-price label="Price" name="price" [(ngModel)]="listing.price"></app-validated-price>
|
||||
<app-validated-price label="Sales Revenue" name="salesRevenue" [(ngModel)]="listing.salesRevenue"></app-validated-price>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<!-- <div class="mb-4">
|
||||
<label for="cashFlow" class="block text-sm font-bold text-gray-700 mb-1">Cash Flow</label>
|
||||
<input
|
||||
type="text"
|
||||
@@ -72,9 +89,12 @@
|
||||
[options]="{ prefix: '$', thousands: ',', decimal: '.', precision: 0, align: 'left' }"
|
||||
currencyMask
|
||||
/>
|
||||
</div> -->
|
||||
<div>
|
||||
<app-validated-price label="Cash Flow" name="cashFlow" [(ngModel)]="listing.cashFlow"></app-validated-price>
|
||||
</div>
|
||||
|
||||
<div class="flex mb-4 space-x-4">
|
||||
<!-- <div class="flex mb-4 space-x-4">
|
||||
<div class="w-1/2">
|
||||
<label for="established" class="block text-sm font-bold text-gray-700 mb-1">Years Established Since</label>
|
||||
<input type="number" id="established" [(ngModel)]="listing.established" name="established" class="w-full p-2 border border-gray-300 rounded-md" />
|
||||
@@ -83,6 +103,10 @@
|
||||
<label for="employees" class="block text-sm font-bold text-gray-700 mb-1">Employees</label>
|
||||
<input type="number" id="employees" [(ngModel)]="listing.employees" name="employees" 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">
|
||||
<app-validated-input label="Years Established Since" name="established" [(ngModel)]="listing.established" kind="number"></app-validated-input>
|
||||
<app-validated-input label="Employees" name="employees" [(ngModel)]="listing.employees" kind="number"></app-validated-input>
|
||||
</div>
|
||||
|
||||
<div class="flex mb-4 space-x-4">
|
||||
@@ -100,17 +124,20 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<!-- <div class="mb-4">
|
||||
<label for="supportAndTraining" class="block text-sm font-bold text-gray-700 mb-1">Support & Training</label>
|
||||
<input type="text" id="supportAndTraining" [(ngModel)]="listing.supportAndTraining" name="supportAndTraining" class="w-full p-2 border border-gray-300 rounded-md" />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<label for="reasonForSale" class="block text-sm font-bold text-gray-700 mb-1">Reason for Sale</label>
|
||||
<input type="text" id="reasonForSale" [(ngModel)]="listing.reasonForSale" name="reasonForSale" class="w-full p-2 border border-gray-300 rounded-md" />
|
||||
</div>-->
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<app-validated-input label="Support & Training" name="supportAndTraining" [(ngModel)]="listing.supportAndTraining"></app-validated-input>
|
||||
<app-validated-input label="Reason for Sale" name="reasonForSale" [(ngModel)]="listing.reasonForSale"></app-validated-input>
|
||||
</div>
|
||||
|
||||
<div class="flex mb-4 space-x-4">
|
||||
<!-- <div class="flex mb-4 space-x-4">
|
||||
<div class="w-1/2">
|
||||
<label for="brokerLicencing" class="block text-sm font-bold text-gray-700 mb-1">Broker Licensing</label>
|
||||
<input type="text" id="brokerLicencing" [(ngModel)]="listing.brokerLicencing" name="brokerLicencing" class="w-full p-2 border border-gray-300 rounded-md" />
|
||||
@@ -119,11 +146,18 @@
|
||||
<label for="internalListingNumber" class="block text-sm font-bold text-gray-700 mb-1">Internal Listing Number</label>
|
||||
<input type="number" id="internalListingNumber" [(ngModel)]="listing.internalListingNumber" name="internalListingNumber" 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">
|
||||
<app-validated-input label="Broker Licensing" name="brokerLicencing" [(ngModel)]="listing.brokerLicencing"></app-validated-input>
|
||||
<app-validated-input label="Internal Listing Number" name="internalListingNumber" [(ngModel)]="listing.internalListingNumber" kind="number"></app-validated-input>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<!-- <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>
|
||||
<textarea id="internals" [(ngModel)]="listing.internals" name="internals" class="w-full p-2 border border-gray-300 rounded-md" rows="3"></textarea>
|
||||
</div> -->
|
||||
<div>
|
||||
<app-validated-textarea label="Internal Notes (Will not be shown on the listing, for your records only.)" name="internals" [(ngModel)]="listing.internals"></app-validated-textarea>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center mb-4">
|
||||
|
||||
Reference in New Issue
Block a user