feat: add location-based search, redesign station cards, and implement URL state management
- Support geolocation search (lat/lng) as alternative to postcode with automatic fallback - Redesign StationCard with expanded layout showing address, distance in miles, reliability status, directions link, and optional remove button - Add directions integration with Google Maps including origin parameter support - Persist search parameters (postcode/coords, fuel type, radius, sort) in URL query and hydrate on mount - Implement compact map markers with inline directions link and click-to-zoom behavior - Auto-trigger search when filters change (fuel type, radius, sort) if search already performed - Add removable prop to StationCard for watchlist integration - Display reliability status (Current/Stale/Outdated) with color-coded pricing - Remove 2-mile radius option from search filters
This commit is contained in:
@@ -34,6 +34,7 @@
|
||||
v-for="station in reliable"
|
||||
:key="station.station_id"
|
||||
:lowest-price="lowestPrice"
|
||||
:origin="origin"
|
||||
:station="station"
|
||||
/>
|
||||
</section>
|
||||
@@ -80,6 +81,7 @@
|
||||
:key="station.station_id"
|
||||
:station="station"
|
||||
:lowest-price="lowestPrice"
|
||||
:origin="origin"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@@ -92,6 +94,7 @@ import StationCard from './StationCard.vue'
|
||||
const props = defineProps({
|
||||
stations: { type: Array, required: true },
|
||||
currentSort: { type: String, default: 'reliable' },
|
||||
origin: { type: Object, default: null },
|
||||
})
|
||||
|
||||
const emit = defineEmits(['sort'])
|
||||
|
||||
Reference in New Issue
Block a user