add list of cities for car pick drop off locations

This commit is contained in:
root
2026-06-29 20:32:08 -04:00
parent 85d1aad956
commit e1e2f55c93
6 changed files with 10757 additions and 54 deletions
@@ -9,6 +9,8 @@ import { apiFetch } from '@/lib/api'
import VehicleCalendar from '@/components/VehicleCalendar'
import VehiclePricingManager from '@/components/VehiclePricingManager'
import { useDashboardI18n } from '@/components/I18nProvider'
import LocationDropdownField from '@/components/LocationDropdownField'
import { getMoroccanCityOptions } from '@/lib/moroccanCities'
interface VehicleDetail {
id: string
@@ -287,6 +289,7 @@ export default function FleetDetailPage() {
const { dict, language } = useDashboardI18n()
const vd = dict.vehicleDetail
const fl = dict.fleet
const cityOptions = getMoroccanCityOptions(language)
const [vehicle, setVehicle] = useState<VehicleDetail | null>(null)
const [error, setError] = useState<string | null>(null)
@@ -754,17 +757,15 @@ export default function FleetDetailPage() {
</div>
<div className="space-y-4 rounded-xl border border-slate-200 bg-slate-50 p-4">
<div>
<label className="block text-xs font-medium text-slate-500 mb-1.5">{fl.pickupLocations}</label>
<textarea
className="input-field resize-none"
rows={2}
placeholder={fl.pickupLocationsPlaceholder}
value={form.pickupLocations}
onChange={(e) => setForm({ ...form, pickupLocations: e.target.value })}
/>
<p className="mt-1 text-xs text-slate-400">{fl.locationHint}</p>
</div>
<LocationDropdownField
label={fl.pickupLocations}
placeholder={fl.pickupLocationsPlaceholder}
hint={fl.locationHint}
addCustomLabel={fl.addCustomLocation}
options={cityOptions}
value={parseLocationInput(form.pickupLocations)}
onChange={(locations) => setForm({ ...form, pickupLocations: formatLocationInput(locations) })}
/>
<label className="flex items-center gap-3 rounded-lg border border-slate-200 bg-white px-3 py-3 text-sm font-medium text-slate-700">
<input
type="checkbox"
@@ -779,17 +780,15 @@ export default function FleetDetailPage() {
<span>{fl.allowDifferentDropoff}</span>
</label>
{form.allowDifferentDropoff && (
<div>
<label className="block text-xs font-medium text-slate-500 mb-1.5">{fl.dropoffLocations}</label>
<textarea
className="input-field resize-none"
rows={2}
placeholder={fl.dropoffLocationsPlaceholder}
value={form.dropoffLocations}
onChange={(e) => setForm({ ...form, dropoffLocations: e.target.value })}
/>
<p className="mt-1 text-xs text-slate-400">{fl.locationHint}</p>
</div>
<LocationDropdownField
label={fl.dropoffLocations}
placeholder={fl.dropoffLocationsPlaceholder}
hint={fl.locationHint}
addCustomLabel={fl.addCustomLocation}
options={cityOptions}
value={parseLocationInput(form.dropoffLocations)}
onChange={(locations) => setForm({ ...form, dropoffLocations: formatLocationInput(locations) })}
/>
)}
</div>
@@ -8,6 +8,8 @@ import { usePathname, useRouter, useSearchParams } from 'next/navigation'
import { EMPLOYEE_PROFILE_KEY, apiFetch } from '@/lib/api'
import { formatCurrency } from '@rentaldrivego/types'
import { useDashboardI18n } from '@/components/I18nProvider'
import LocationDropdownField from '@/components/LocationDropdownField'
import { getMoroccanCityOptions } from '@/lib/moroccanCities'
interface Vehicle {
id: string
@@ -214,9 +216,14 @@ function parseLocationInput(value: string) {
.filter(Boolean)
}
function formatLocationInput(values: string[]) {
return values.join(', ')
}
function AddVehicleModal({ open, onClose, onSaved }: AddVehicleModalProps) {
const { dict } = useDashboardI18n()
const { dict, language } = useDashboardI18n()
const f = dict.fleet
const cityOptions = getMoroccanCityOptions(language)
const [form, setForm] = useState({
make: '', model: '', year: new Date().getFullYear(), category: 'ECONOMY',
licensePlate: '', vin: '', color: '', seats: 5, transmission: 'MANUAL',
@@ -451,17 +458,15 @@ function AddVehicleModal({ open, onClose, onSaved }: AddVehicleModalProps) {
</div>
<div className="space-y-4 rounded-xl border border-slate-200 bg-slate-50 p-4">
<div>
<label className="block text-xs font-medium text-slate-500 mb-1.5">{f.pickupLocations}</label>
<textarea
className="input-field resize-none"
rows={2}
placeholder={f.pickupLocationsPlaceholder}
value={form.pickupLocations}
onChange={(e) => setForm({ ...form, pickupLocations: e.target.value })}
/>
<p className="mt-1 text-xs text-slate-400">{f.locationHint}</p>
</div>
<LocationDropdownField
label={f.pickupLocations}
placeholder={f.pickupLocationsPlaceholder}
hint={f.locationHint}
addCustomLabel={f.addCustomLocation}
options={cityOptions}
value={parseLocationInput(form.pickupLocations)}
onChange={(locations) => setForm({ ...form, pickupLocations: formatLocationInput(locations) })}
/>
<label className="flex items-center gap-3 rounded-lg border border-slate-200 bg-white px-3 py-3 text-sm font-medium text-slate-700">
<input
type="checkbox"
@@ -476,17 +481,15 @@ function AddVehicleModal({ open, onClose, onSaved }: AddVehicleModalProps) {
<span>{f.allowDifferentDropoff}</span>
</label>
{form.allowDifferentDropoff && (
<div>
<label className="block text-xs font-medium text-slate-500 mb-1.5">{f.dropoffLocations}</label>
<textarea
className="input-field resize-none"
rows={2}
placeholder={f.dropoffLocationsPlaceholder}
value={form.dropoffLocations}
onChange={(e) => setForm({ ...form, dropoffLocations: e.target.value })}
/>
<p className="mt-1 text-xs text-slate-400">{f.locationHint}</p>
</div>
<LocationDropdownField
label={f.dropoffLocations}
placeholder={f.dropoffLocationsPlaceholder}
hint={f.locationHint}
addCustomLabel={f.addCustomLocation}
options={cityOptions}
value={parseLocationInput(form.dropoffLocations)}
onChange={(locations) => setForm({ ...form, dropoffLocations: formatLocationInput(locations) })}
/>
)}
</div>