diff --git a/src/features/workspace/views/LoginView.jsx b/src/features/workspace/views/LoginView.jsx index a88f71a..aac0787 100644 --- a/src/features/workspace/views/LoginView.jsx +++ b/src/features/workspace/views/LoginView.jsx @@ -1,121 +1,228 @@ import React, { useState } from 'react'; +import { motion, AnimatePresence } from 'framer-motion'; import { useNavigate } from 'react-router-dom'; -import { Lock, Eye, EyeOff, Zap, ArrowRight, ShieldCheck } from 'lucide-react'; -import { motion } from 'framer-motion'; +import { + Lock, + ChevronRight, + ShieldCheck, + AlertCircle, + Eye, + EyeOff, + User, + Zap +} from 'lucide-react'; +import { useAuthContext } from '@/components/shared/AuthProvider'; +import logo from '@/assets/Img/Util/iT_Guys/logo1.png'; +/** + * LoginView - Versão Premium para o Workspace iTGUYS + * Inspirado no design "Reproduced" com split-screen e alta fidelidade visual. + */ export const LoginView = () => { const [password, setPassword] = useState(''); const [showPassword, setShowPassword] = useState(false); const [error, setError] = useState(''); - const [loading, setLoading] = useState(false); + const [isLoading, setIsLoading] = useState(false); + const [step, setStep] = useState(1); // 1: Login, 2: Verification (Visual Demo) const navigate = useNavigate(); - // Senhas de teste autorizadas - const TEST_PASSWORDS = ['itguys@2026', 'teste@finance', 'admin']; - - const handleLogin = (e) => { + const handleLogin = async (e) => { e.preventDefault(); - setLoading(true); + setIsLoading(true); setError(''); - // Simula uma pequena latência para efeito visual premium + // Senhas de teste permitidas + const allowedPasswords = ['itguys@2026', 'teste@finance', 'admin']; + setTimeout(() => { - if (TEST_PASSWORDS.includes(password)) { - sessionStorage.setItem('workspace_access', 'true'); - navigate('/plataforma/workspace'); + if (allowedPasswords.includes(password)) { + sessionStorage.setItem('workspace_access', 'granted'); + setStep(2); // Muda para o passo de verificação visual + setIsLoading(false); } else { - setError('Senha de acesso inválida ou expirada.'); + setError('Chave de acesso inválida ou expirada.'); + setIsLoading(false); } - setLoading(false); }, 800); }; + const handleFinalize = () => { + navigate('/plataforma/workspace'); + window.location.reload(); + }; + return ( -
- {/* Background Decorativo */} -
-
-
+
+ {/* Left Panel - Brand & Identity */} +
+ {/* Background Effects */} +
+
+
+
+
+ + {/* Logo Area */} + + iTGUYS Logo +
+

+ WORKSPACE EXPERIENCE +

+

+ Gestão Estratégica & Inteligência Financeira +

+ + + {/* Floating Badges */} +
+
+ Encrypted +
+
+ Versão 2026.1 +
+
- -
-
-
- Acesso Restrito -
-
-
- -
-

Workspace Finance

-
-

Ambiente em fase de ajuste. Insira a chave de acesso para continuar.

-
+ {/* Right Panel - Interactive Form */} +
+ {/* Decorative Grid */} +
-
-
- -
-
- -
- setPassword(e.target.value)} - placeholder="••••••••" - className="w-full pl-12 pr-12 py-4 bg-white/5 border-none rounded-2xl ring-1 ring-white/10 focus:ring-2 focus:ring-[#22c0a3] outline-none transition-all text-white font-medium shadow-sm placeholder:text-slate-600" - required - /> - -
-
- - {error && ( - - {error} - - )} - - -
+
+
+ Restricted Access +
+

Identifique-se

+

Insira sua chave mestra para acessar o sistema.

+
-
- - © 2026 iTGUYS • SISTEMAS DE ALTA PERFORMANCE - -
-
- +
+
+ {/* User field (Readonly for Context) */} +
+ + +
+ + {/* Password Field */} +
+ + setPassword(e.target.value)} + placeholder="Chave de Acesso" + autoFocus + className="w-full bg-white/[0.05] border border-white/10 rounded-2xl py-4 pl-12 pr-12 text-white text-sm font-bold focus:ring-2 focus:ring-[#22bb6c]/50 focus:border-[#22bb6c] focus:bg-white/[0.08] outline-none transition-all placeholder:text-white/20 tracking-[0.2em]" + /> + +
+
+ + {error && ( + + {error} + + )} + + +
+ +
+ Logo + iTGUYS Core Systems v4 +
+ + ) : ( + /* Verification Step (Image 1 reference) */ + +
+ +
+

Chave Confirmada

+

O ambiente de teste do Workspace está liberado para o seu perfil administrativo.

+ + {/* Decorative numeric placeholders (Image 1 style) */} +
+ {[1,2,3,4,5,6].map(i => ( +
+
+
+ ))} +
+ + + + )} + +
+ + {/* Decorative Blur and Logo Overlay for Mobile (if any) */} +
+
+
); };