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

feat: introduce rental condition tiers (Premium, Standard, Economy) with dynamic pricing and UI selection

Browse Source
This commit is contained in:
sazzadulalambd
2026-05-10 01:37:43 +06:00
parent 93e1d289ca
commit 70f97b374b
1 changed files with 56 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
src/app/admin/rentals/page.tsx
View File

@@ -104,9 +104,21 @@ const mockHubs = [
];
const rentalSettings = {
single: { deposit: 3000, contractMonths: [1, 3, 6, 12], dailyRate: 150, weeklyRate: 900, monthlyRate: 3500 },
shared: { deposit: 2000, contractMonths: [1, 3, 6], dailyRate: 100, weeklyRate: 600, monthlyRate: 2200 },
'rent-to-own': { deposit: 10000, contractMonths: [12, 18, 24, 36], dailyRate: 500, weeklyRate: 3000, monthlyRate: 12000 },
single: {
Premium: { deposit: 5000, contractMonths: [1, 3, 6, 12], dailyRate: 200, weeklyRate: 1200, monthlyRate: 5000 },
Standard: { deposit: 3000, contractMonths: [1, 3, 6, 12], dailyRate: 150, weeklyRate: 900, monthlyRate: 3500 },
Economy: { deposit: 2000, contractMonths: [1, 3, 6, 12], dailyRate: 100, weeklyRate: 600, monthlyRate: 2500 },
},
shared: {
Premium: { deposit: 4000, contractMonths: [1, 3, 6], dailyRate: 150, weeklyRate: 900, monthlyRate: 3500 },
Standard: { deposit: 2500, contractMonths: [1, 3, 6], dailyRate: 100, weeklyRate: 600, monthlyRate: 2200 },
Economy: { deposit: 2000, contractMonths: [1, 3, 6], dailyRate: 80, weeklyRate: 500, monthlyRate: 1800 },
},
'rent-to-own': {
Premium: { deposit: 15000, contractMonths: [12, 18, 24, 36], dailyRate: 350, weeklyRate: 2450, monthlyRate: 10500 },
Standard: { deposit: 12000, contractMonths: [12, 18, 24, 36], dailyRate: 250, weeklyRate: 1750, monthlyRate: 7000 },
Economy: { deposit: 10000, contractMonths: [12, 18, 24, 36], dailyRate: 200, weeklyRate: 1400, monthlyRate: 6000 },
},
};
const mockRentals: Rental[] = [
@@ -265,6 +277,7 @@ export default function RentalsPage() {
const [newRental, setNewRental] = useState<{
userId: string;
type: RentalType;
condition: 'Premium' | 'Standard' | 'Economy';
subscriptionType: 'daily' | 'weekly' | 'monthly';
contractMonths: number;
bikeId: string;
@@ -274,6 +287,7 @@ export default function RentalsPage() {
}>({
userId: '',
type: 'single',
condition: 'Standard',
subscriptionType: 'daily',
contractMonths: 0,
bikeId: '',
@@ -379,6 +393,8 @@ export default function RentalsPage() {
const eligibleUsers = mockUsers.filter(u => u.kycStatus === 'approved' && !u.hasActiveRental);
const availableBikes = mockBikes.filter(b => b.status === 'available');
const selectedSettings = rentalSettings[newRental.type]?.[newRental.condition] || rentalSettings.single.Standard;
const stats = {
active: rentals.filter(r => r.status === 'active').length,
pending: rentals.filter(r => r.status === 'pending').length,
@@ -395,7 +411,7 @@ export default function RentalsPage() {
const bike = mockBikes.find(b => b.id === newRental.bikeId);
const user = mockUsers.find(u => u.id === newRental.userId);
const hub = mockHubs.find(h => h.id === newRental.hubId);
const settings = rentalSettings[newRental.type];
const settings = rentalSettings[newRental.type]?.[newRental.condition];
const rental: Rental = {
id: `RNT-${String(rentals.length + 1).padStart(3, '0')}`,
@@ -438,6 +454,7 @@ export default function RentalsPage() {
setNewRental({
userId: '',
type: 'single',
condition: 'Standard',
subscriptionType: 'daily',
contractMonths: 0,
bikeId: '',
@@ -447,7 +464,6 @@ export default function RentalsPage() {
});
};
const selectedSettings = rentalSettings[newRental.type];
const selectedBike = mockBikes.find(b => b.id === newRental.bikeId);
const selectedUser = mockUsers.find(u => u.id === newRental.userId);
@@ -683,12 +699,11 @@ export default function RentalsPage() {
{createStep === 2 && (
<div className="space-y-4">
<h4 className="font-medium text-slate-700 mb-3">Step 2: Rental Details</h4>
<div>
<label className="text-sm text-slate-600">Rental Type</label>
<select
value={newRental.type}
onChange={(e) => setNewRental({ ...newRental, type: e.target.value as RentalType, subscriptionType: 'daily' })}
onChange={(e) => setNewRental({ ...newRental, type: e.target.value as RentalType, condition: 'Standard', subscriptionType: 'daily' })}
className="w-full px-3 py-2 border border-slate-200 rounded-lg text-sm mt-1"
>
<option value="single">Single Rent</option>
@@ -696,6 +711,27 @@ export default function RentalsPage() {
<option value="rent-to-own">Rent to Own</option>
</select>
</div>
<div>
<label className="text-sm text-slate-600">Condition</label>
<div className="grid grid-cols-3 gap-2 mt-1">
{(['Premium', 'Standard', 'Economy'] as const).map(cond => (
<button
key={cond}
type="button"
onClick={() => setNewRental({ ...newRental, condition: cond })}
className={`py-2 px-3 rounded-lg text-sm border ${
newRental.condition === cond
? cond === 'Premium' ? 'bg-purple-100 border-purple-300 text-purple-700'
: cond === 'Standard' ? 'bg-blue-100 border-blue-300 text-blue-700'
: 'bg-amber-100 border-amber-300 text-amber-700'
: 'border-slate-200 text-slate-600 hover:bg-slate-50'
}`}
>
{cond}
</button>
))}
</div>
</div>
<div>
<label className="text-sm text-slate-600">Contract Duration</label>
<select
@@ -703,10 +739,16 @@ export default function RentalsPage() {
onChange={(e) => setNewRental({ ...newRental, contractMonths: Number(e.target.value) })}
className="w-full px-3 py-2 border border-slate-200 rounded-lg text-sm mt-1"
>
<option value={0}>Daily Basis</option>
{selectedSettings.contractMonths.map(m => (
<option key={m} value={m}>{m} Months</option>
))}
</select>
{newRental.contractMonths > 0 && (
<p className="text-xs text-emerald-600 mt-1">
End Date: {new Date(new Date(newRental.startDate).setMonth(new Date(newRental.startDate).getMonth() + newRental.contractMonths)).toISOString().split('T')[0]}
</p>
)}
</div>
<div>
<label className="text-sm text-slate-600 mb-2 block">Subscription Type</label>
@@ -726,11 +768,14 @@ export default function RentalsPage() {
))}
</div>
</div>
<div className="bg-slate-50 p-3 rounded-lg">
<p className="text-sm text-slate-600">Deposit: ৳{selectedSettings.deposit.toLocaleString()}</p>
<div className="bg-emerald-50 p-3 rounded-lg border border-emerald-100">
<div className="flex items-center justify-between mb-1">
<span className="text-xs text-emerald-600 font-medium uppercase tracking-wide">{newRental.condition} - {newRental.type === 'single' ? 'Single Rent' : newRental.type === 'shared' ? 'Share EV' : 'Rent to Own'}</span>
</div>
<p className="text-sm text-slate-600">Deposit: <span className="font-semibold text-slate-800">৳{selectedSettings.deposit.toLocaleString()}</span></p>
<p className="text-sm text-slate-600">
Rate: ৳{newRental.subscriptionType === 'daily' ? selectedSettings.dailyRate : newRental.subscriptionType === 'weekly' ? selectedSettings.weeklyRate : selectedSettings.monthlyRate}/
{newRental.subscriptionType === 'daily' ? 'day' : newRental.subscriptionType === 'weekly' ? 'week' : 'month'}
Rate: <span className="font-semibold text-slate-800">৳{newRental.subscriptionType === 'daily' ? selectedSettings.dailyRate : newRental.subscriptionType === 'weekly' ? selectedSettings.weeklyRate : selectedSettings.monthlyRate}</span>
<span className="text-slate-500">/{newRental.subscriptionType === 'daily' ? 'day' : newRental.subscriptionType === 'weekly' ? 'week' : 'month'}</span>
</p>
</div>
</div>