shawon/JML
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: integrate battery selection and sync battery level from mock data in fleet management form

Browse Source
This commit is contained in:
sazzadulalambd
2026-05-17 20:32:54 +06:00
parent a4ff86b953
commit 9370b71b25
1 changed files with 47 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
src/app/admin/fleet/page.tsx
View File

@@ -17,6 +17,7 @@ interface Bike {
plateNumber: string;
status: 'available' | 'rented' | 'maintenance' | 'retired';
batteryLevel: number;
batteryId?: string;
location?: string; // deprecated - use hubId/hubName
hubId?: string;
hubName?: string;
@@ -56,6 +57,15 @@ const hubs = [
{ id: 'HUB-004', name: 'Mirpur Hub' },
];
const mockBatteries = [
{ id: 'BAT-001', brand: 'Lithium', model: '60V/30Ah', serialNumber: 'LTH-2024-001', chargeLevel: 95 },
{ id: 'BAT-002', brand: 'Lithium', model: '60V/30Ah', serialNumber: 'LTH-2024-002', chargeLevel: 75 },
{ id: 'BAT-003', brand: 'Lithium', model: '60V/40Ah', serialNumber: 'LTH-2024-003', chargeLevel: 45 },
{ id: 'BAT-004', brand: 'Lithium', model: '60V/30Ah', serialNumber: 'LTH-2024-004', chargeLevel: 88 },
{ id: 'BAT-005', brand: 'Lithium', model: '48V/25Ah', serialNumber: 'LTH-2024-005', chargeLevel: 62 },
{ id: 'BAT-006', brand: 'Lithium', model: '60V/30Ah', serialNumber: 'LTH-2024-006', chargeLevel: 100 },
];
const statusColors: Record<string, string> = {
available: 'bg-green-100 text-green-700',
rented: 'bg-blue-100 text-blue-700',
@@ -488,6 +498,7 @@ function BikeForm({ bike, onSave, onCancel }: { bike: Bike | null; onSave: (bike
plateNumber: '',
status: 'available',
batteryLevel: 100,
batteryId: '',
location: '', // deprecated
hubId: '',
hubName: '',
@@ -563,14 +574,27 @@ function BikeForm({ bike, onSave, onCancel }: { bike: Bike | null; onSave: (bike
</select>
</div>
<div>
<label className="block text-sm font-medium text-slate-700 mb-1">Battery Level (%)</label>
<input
type="number"
value={formData.batteryLevel}
onChange={(e) => handleChange('batteryLevel', parseInt(e.target.value))}
<label className="block text-sm font-medium text-slate-700 mb-1">Battery</label>
<select
value={formData.batteryId || ''}
onChange={(e) => {
const battery = mockBatteries.find(b => b.id === e.target.value);
handleChange('batteryId', e.target.value);
if (battery) {
handleChange('batteryLevel', battery.chargeLevel);
}
}}
className="w-full px-3 py-2 border border-slate-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-accent"
/>
>
<option value="">Select Battery...</option>
{mockBatteries.map(battery => (
<option key={battery.id} value={battery.id}>
{battery.brand} {battery.model} - {battery.serialNumber} ({battery.chargeLevel}%)
</option>
))}
</select>
</div>
<div>
<label className="block text-sm font-medium text-slate-700 mb-1">Hub *</label>
<select
@@ -588,6 +612,16 @@ function BikeForm({ bike, onSave, onCancel }: { bike: Bike | null; onSave: (bike
))}
</select>
</div>
<div>
<label className="block text-sm font-medium text-slate-700 mb-1">Battery Level (%)</label>
<input
type="number"
value={formData.batteryLevel}
onChange={(e) => handleChange('batteryLevel', parseInt(e.target.value))}
className="w-full px-3 py-2 border border-slate-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-accent"
/>
</div>
<div>
<label className="block text-sm font-medium text-slate-700 mb-1">Assigned To</label>
<input