#146,147view Filter + dropdowns ...

This commit is contained in:
2025-07-21 17:29:05 -05:00
parent 24db8927e8
commit 01b5679e54
3 changed files with 162 additions and 74 deletions

View File

@@ -11,7 +11,7 @@ import { SearchService } from '../../services/search.service';
import { SelectOptionsService } from '../../services/select-options.service';
import { UserService } from '../../services/user.service';
import { SharedModule } from '../../shared/shared/shared.module';
import { getCriteriaStateObject, resetBusinessListingCriteria, resetCommercialPropertyListingCriteria, resetUserListingCriteria } from '../../utils/utils';
import { getCriteriaStateObject, resetBusinessListingCriteria } from '../../utils/utils';
import { ValidatedCityComponent } from '../validated-city/validated-city.component';
import { ValidatedPriceComponent } from '../validated-price/validated-price.component';
import { ModalService } from './modal.service';
@@ -34,7 +34,7 @@ export class SearchModalComponent {
// cityInput$ = new Subject<string>();
countyInput$ = new Subject<string>();
private criteriaChangeSubscription: Subscription;
public criteria: BusinessListingCriteria | CommercialPropertyListingCriteria | UserListingCriteria;
public criteria: BusinessListingCriteria;
public backupCriteria: BusinessListingCriteria | CommercialPropertyListingCriteria | UserListingCriteria = getCriteriaStateObject('businessListings');
numberOfResults$: Observable<number>;
@@ -48,11 +48,19 @@ export class SearchModalComponent {
private userService: UserService,
private searchService: SearchService,
) {}
// Define property type options
propertyTypeOptions = [
{ name: 'Real Estate', value: 'realEstateChecked' },
{ name: 'Leased Location', value: 'leasedLocation' },
{ name: 'Franchise', value: 'franchiseResale' },
];
selectedPropertyType: string | null = null;
selectedPropertyTypeName: string | null = null;
ngOnInit() {
this.setupCriteriaChangeListener();
this.modalService.message$.pipe(untilDestroyed(this)).subscribe(msg => {
this.criteria = msg;
this.criteria = msg as BusinessListingCriteria;
this.backupCriteria = JSON.parse(JSON.stringify(msg));
this.setTotalNumberOfResults();
});
@@ -64,9 +72,89 @@ export class SearchModalComponent {
});
// this.loadCities();
this.loadCounties();
this.updateSelectedPropertyType();
}
hasActiveFilters(): boolean {
return !!(
this.criteria.state ||
this.criteria.city ||
(<BusinessListingCriteria>this.criteria).minPrice ||
(<BusinessListingCriteria>this.criteria).maxPrice ||
(<BusinessListingCriteria>this.criteria).minRevenue ||
(<BusinessListingCriteria>this.criteria).maxRevenue ||
(<BusinessListingCriteria>this.criteria).minCashFlow ||
(<BusinessListingCriteria>this.criteria).maxCashFlow ||
this.criteria.types.length ||
this.selectedPropertyType
);
}
removeFilter(filterType: string) {
switch (filterType) {
case 'state':
this.criteria.state = null;
this.setCity(null);
break;
case 'city':
this.criteria.city = null;
this.criteria.radius = null;
this.criteria.searchType = 'exact';
break;
case 'price':
(<BusinessListingCriteria>this.criteria).minPrice = null;
(<BusinessListingCriteria>this.criteria).maxPrice = null;
break;
case 'revenue':
(<BusinessListingCriteria>this.criteria).minRevenue = null;
(<BusinessListingCriteria>this.criteria).maxRevenue = null;
break;
case 'cashflow':
(<BusinessListingCriteria>this.criteria).minCashFlow = null;
(<BusinessListingCriteria>this.criteria).maxCashFlow = null;
break;
case 'types':
this.criteria.types = [];
break;
case 'propertyType':
(<BusinessListingCriteria>this.criteria).realEstateChecked = false;
(<BusinessListingCriteria>this.criteria).leasedLocation = false;
(<BusinessListingCriteria>this.criteria).franchiseResale = false;
this.selectedPropertyType = null;
break;
}
this.searchService.search(this.criteria);
}
// Handle category change
onCategoryChange(selectedCategories: string[]) {
this.criteria.types = selectedCategories;
this.searchService.search(this.criteria);
}
ngOnChanges() {}
// Handle property type change
onPropertyTypeChange(value: string) {
// Reset all property type flags
(<BusinessListingCriteria>this.criteria).realEstateChecked = false;
(<BusinessListingCriteria>this.criteria).leasedLocation = false;
(<BusinessListingCriteria>this.criteria).franchiseResale = false;
// Set the selected property type
if (value) {
this.criteria[value] = true;
}
this.selectedPropertyType = value;
this.updateSelectedPropertyTypeName();
this.searchService.search(this.criteria);
}
// Update selected property type based on current criteria
updateSelectedPropertyType() {
if ((<BusinessListingCriteria>this.criteria).realEstateChecked) this.selectedPropertyType = 'realEstateChecked';
else if ((<BusinessListingCriteria>this.criteria).leasedLocation) this.selectedPropertyType = 'leasedLocation';
else if ((<BusinessListingCriteria>this.criteria).franchiseResale) this.selectedPropertyType = 'franchiseResale';
else this.selectedPropertyType = null;
this.updateSelectedPropertyTypeName();
}
updateSelectedPropertyTypeName() {
this.selectedPropertyTypeName = this.selectedPropertyType ? this.propertyTypeOptions.find(opt => opt.value === this.selectedPropertyType)?.name : null;
}
categoryClicked(checked: boolean, value: string) {
if (checked) {
this.criteria.types.push(value);
@@ -151,20 +239,21 @@ export class SearchModalComponent {
if (this.criteria.criteriaType === 'businessListings' || this.criteria.criteriaType === 'commercialPropertyListings') {
this.numberOfResults$ = this.listingService.getNumberOfListings(this.criteria, this.criteria.criteriaType === 'businessListings' ? 'business' : 'commercialProperty');
} else if (this.criteria.criteriaType === 'brokerListings') {
this.numberOfResults$ = this.userService.getNumberOfBroker(this.criteria);
//this.numberOfResults$ = this.userService.getNumberOfBroker(this.criteria);
} else {
this.numberOfResults$ = of();
}
}
}
clearFilter() {
if (this.criteria.criteriaType === 'businessListings') {
resetBusinessListingCriteria(this.criteria);
} else if (this.criteria.criteriaType === 'commercialPropertyListings') {
//if (this.criteria.criteriaType === 'businessListings') {
resetBusinessListingCriteria(this.criteria);
/* } else if (this.criteria.criteriaType === 'commercialPropertyListings') {
resetCommercialPropertyListingCriteria(this.criteria);
} else {
resetUserListingCriteria(this.criteria);
}
} */
this.searchService.search(this.criteria);
}
close() {
this.modalService.reject(this.backupCriteria);