first commit

2026-09-05 18:52:26 +05:30 · 2026-09-05 18:52:26 +05:30 · a9e21cbe3c
commit a9e21cbe3c
parent e7365b06ac
9 changed files with 874 additions and 320 deletions
--- a/src/pages/Admin/AdminLogin.jsx
+++ b/src/pages/Admin/AdminLogin.jsx
@ -0,0 +1,109 @@
+import React, { useState } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { Lock, User, ShieldCheck, AlertCircle } from 'lucide-react';
+
+const AdminLogin = () => {
+    const [adminId, setAdminId] = useState('');
+    const [password, setPassword] = useState('');
+    const [error, setError] = useState('');
+    const [isLoading, setIsLoading] = useState(false);
+    const navigate = useNavigate();
+
+    const handleLogin = async (e) => {
+        e.preventDefault();
+        setIsLoading(true);
+        setError('');
+
+        try {
+            const response = await fetch('/api/admin/login', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ adminId, password })
+            });
+
+            const data = await response.json();
+
+            if (response.ok) {
+                localStorage.setItem('adminToken', data.token);
+                navigate('/admin/dashboard');
+            } else {
+                setError(data.detail || 'Invalid credentials');
+            }
+        } catch (err) {
+            setError('Connection failed. Please try again.');
+        } finally {
+            setIsLoading(false);
+        }
+    };
+
+    return (
+        <div className="min-h-screen bg-slate-50 flex items-center justify-center p-4">
+            <div className="max-w-md w-full bg-white rounded-2xl shadow-xl p-8 border border-slate-100">
+                <div className="text-center mb-8">
+                    <div className="w-16 h-16 bg-indigo-600 rounded-2xl flex items-center justify-center mx-auto mb-4 shadow-lg shadow-indigo-200">
+                        <ShieldCheck className="w-8 h-8 text-white" />
+                    </div>
+                    <h1 className="text-24 font-bold text-slate-900">Admin Portal</h1>
+                    <p className="text-slate-500 mt-2">Secure access for road.rentals owner</p>
+                </div>
+
+                {error && (
+                    <div className="mb-6 p-4 bg-red-50 border border-red-100 rounded-xl flex items-center gap-3 text-red-600 text-sm">
+                        <AlertCircle className="w-5 h-5 flex-shrink-0" />
+                        {error}
+                    </div>
+                )}
+
+                <form onSubmit={handleLogin} className="space-y-6">
+                    <div>
+                        <label className="block text-sm font-semibold text-slate-700 mb-2">Admin ID</label>
+                        <div className="relative">
+                            <User className="absolute left-3 top-1/2 -translate-y-1/2 w-5 h-5 text-slate-400" />
+                            <input
+                                type="text"
+                                value={adminId}
+                                onChange={(e) => setAdminId(e.target.value)}
+                                className="w-full pl-10 pr-4 py-3 rounded-xl border border-slate-200 focus:border-indigo-500 focus:ring-4 focus:ring-indigo-50/50 outline-none transition-all"
+                                placeholder="Enter your Admin ID"
+                                required
+                            />
+                        </div>
+                    </div>
+
+                    <div>
+                        <label className="block text-sm font-semibold text-slate-700 mb-2">Password</label>
+                        <div className="relative">
+                            <Lock className="absolute left-3 top-1/2 -translate-y-1/2 w-5 h-5 text-slate-400" />
+                            <input
+                                type="password"
+                                value={password}
+                                onChange={(e) => setPassword(e.target.value)}
+                                className="w-full pl-10 pr-4 py-3 rounded-xl border border-slate-200 focus:border-indigo-500 focus:ring-4 focus:ring-indigo-50/50 outline-none transition-all"
+                                placeholder="••••••••"
+                                required
+                            />
+                        </div>
+                    </div>
+
+                    <button
+                        type="submit"
+                        disabled={isLoading}
+                        className="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-bold py-4 rounded-xl transition-all shadow-lg shadow-indigo-200 flex items-center justify-center gap-2"
+                    >
+                        {isLoading ? (
+                            <div className="w-5 h-5 border-2 border-white/30 border-t-white rounded-full animate-spin" />
+                        ) : (
+                            'Sign In to Dashboard'
+                        )}
+                    </button>
+                </form>
+
+                <p className="text-center text-slate-400 text-xs mt-8 font-medium uppercase tracking-wider">
+                    Road.Rentals Official Admin System
+                </p>
+            </div>
+        </div>
+    );
+};
+
+export default AdminLogin;