Auto-deploy: 2026-01-13 12:13:58 | 2 arquivo(s) alterado(s)
This commit is contained in:
parent
eb6a56dcc9
commit
4a33cbafce
|
|
@ -21,7 +21,7 @@ const PrafrotRoutes = lazy(() => import('@/features/prafrot/routes').then(m => (
|
||||||
const PrafrotLogin = lazy(() => import('@/features/prafrot/views/LoginView'));
|
const PrafrotLogin = lazy(() => import('@/features/prafrot/views/LoginView'));
|
||||||
const TableDebug = lazy(() => import('@/features/prafrot/views/TableDebug'));
|
const TableDebug = lazy(() => import('@/features/prafrot/views/TableDebug'));
|
||||||
const PlaygroundView = lazy(() => import('@/features/dev-tools/views/PlaygroundView'));
|
const PlaygroundView = lazy(() => import('@/features/dev-tools/views/PlaygroundView'));
|
||||||
const WorkspaceLayout = lazy(() => import('@/features/workspace').then(m => ({ default: m.WorkspaceLayout })));
|
const { WorkspaceLayout, LoginView, WorkspaceGuard } = lazy(() => import('@/features/workspace'));
|
||||||
|
|
||||||
// Loading component
|
// Loading component
|
||||||
const PageLoader = () => (
|
const PageLoader = () => (
|
||||||
|
|
@ -112,10 +112,11 @@ function App() {
|
||||||
</Route>
|
</Route>
|
||||||
|
|
||||||
{/* Workspace Environment - Novo Ambiente Modernizado */}
|
{/* Workspace Environment - Novo Ambiente Modernizado */}
|
||||||
|
<Route path="/plataforma/workspace/login" element={<LoginView />} />
|
||||||
<Route path="/plataforma/workspace/*" element={
|
<Route path="/plataforma/workspace/*" element={
|
||||||
<ProtectedRoute loginPath="/plataforma/auth/login" environment="financeiro">
|
<WorkspaceGuard>
|
||||||
<WorkspaceLayout />
|
<WorkspaceLayout />
|
||||||
</ProtectedRoute>
|
</WorkspaceGuard>
|
||||||
} />
|
} />
|
||||||
|
|
||||||
{/* Fallback */}
|
{/* Fallback */}
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
import React, { useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
import { useNavigate } from 'react-router-dom';
|
import { useNavigate } from 'react-router-dom';
|
||||||
|
import { Lock, Eye, EyeOff, Zap, ArrowRight, ShieldCheck } from 'lucide-react';
|
||||||
import { motion } from 'framer-motion';
|
import { motion } from 'framer-motion';
|
||||||
import { Shield, Lock, ArrowRight, Zap, Eye, EyeOff } from 'lucide-react';
|
|
||||||
|
|
||||||
export const LoginView = () => {
|
export const LoginView = () => {
|
||||||
const [password, setPassword] = useState('');
|
const [password, setPassword] = useState('');
|
||||||
|
|
@ -10,62 +10,68 @@ export const LoginView = () => {
|
||||||
const [loading, setLoading] = useState(false);
|
const [loading, setLoading] = useState(false);
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
|
|
||||||
// Senhas de teste definidas conforme solicitado
|
// Senhas de teste autorizadas
|
||||||
const TEST_PASSWORDS = ['itguys2026', 'workspace@test', 'admin123'];
|
const TEST_PASSWORDS = ['itguys@2026', 'teste@finance', 'admin'];
|
||||||
|
|
||||||
const handleLogin = (e) => {
|
const handleLogin = (e) => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
setLoading(true);
|
setLoading(true);
|
||||||
setError('');
|
setError('');
|
||||||
|
|
||||||
|
// Simula uma pequena latência para efeito visual premium
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
if (TEST_PASSWORDS.includes(password)) {
|
if (TEST_PASSWORDS.includes(password)) {
|
||||||
sessionStorage.setItem('workspace_access', 'true');
|
sessionStorage.setItem('workspace_access', 'true');
|
||||||
navigate('/plataforma/workspace');
|
navigate('/plataforma/workspace');
|
||||||
} else {
|
} else {
|
||||||
setError('Senha de acesso inválida para este ambiente.');
|
setError('Senha de acesso inválida ou expirada.');
|
||||||
setLoading(false);
|
|
||||||
}
|
}
|
||||||
|
setLoading(false);
|
||||||
}, 800);
|
}, 800);
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="workspace-theme min-h-screen bg-[#050914] flex items-center justify-center p-6 relative overflow-hidden font-sans">
|
<div className="workspace-theme min-h-screen bg-[#050914] flex items-center justify-center p-6 relative overflow-hidden font-sans">
|
||||||
{/* Luzes de fundo */}
|
{/* Background Decorativo */}
|
||||||
<div className="absolute top-[-10%] left-[-10%] w-[40%] h-[40%] bg-[var(--workspace-sec-2-light)]/10 rounded-full blur-[120px] animate-pulse" />
|
<div className="absolute inset-0 overflow-hidden pointer-events-none">
|
||||||
<div className="absolute bottom-[-10%] right-[-10%] w-[40%] h-[40%] bg-[var(--workspace-sec-3-light)]/10 rounded-full blur-[120px] animate-pulse" />
|
<div className="absolute top-[20%] right-[10%] w-[30%] h-[30%] bg-[#22c0a3]/10 rounded-full blur-[120px] animate-pulse" />
|
||||||
|
<div className="absolute bottom-[20%] left-[10%] w-[30%] h-[30%] bg-[#26b1c7]/10 rounded-full blur-[120px] animate-pulse" style={{ animationDelay: '1s' }} />
|
||||||
|
</div>
|
||||||
|
|
||||||
<motion.div
|
<motion.div
|
||||||
initial={{ opacity: 0, scale: 0.95 }}
|
initial={{ opacity: 0, y: 20 }}
|
||||||
animate={{ opacity: 1, scale: 1 }}
|
animate={{ opacity: 1, y: 0 }}
|
||||||
className="w-full max-w-md z-10"
|
className="max-w-md w-full z-10"
|
||||||
>
|
>
|
||||||
<div className="bg-white/5 backdrop-blur-2xl border border-white/10 rounded-[2.5rem] p-10 shadow-2xl space-y-8">
|
<div className="bg-white/5 backdrop-blur-2xl border border-white/10 rounded-[2.5rem] p-10 shadow-2xl space-y-8">
|
||||||
<div className="text-center space-y-4">
|
<div className="text-center space-y-4">
|
||||||
<div className="w-20 h-20 bg-gradient-to-br from-[var(--workspace-sec-1-light)] to-[var(--workspace-sec-3-light)] rounded-3xl mx-auto flex items-center justify-center shadow-lg shadow-[var(--workspace-sec-1-light)]/20">
|
<div className="inline-flex items-center gap-2 px-3 py-1 rounded-full bg-[#22c0a3]/10 text-[#22c0a3] text-[0.65rem] font-black uppercase tracking-widest mb-2 border border-[#22c0a3]/20">
|
||||||
<Shield size={40} className="text-white" />
|
<ShieldCheck size={14} className="fill-[#22c0a3]" /> Acesso Restrito
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div className="flex flex-col items-center gap-4">
|
||||||
<h1 className="text-3xl font-black text-white tracking-tighter uppercase italic">Workspace</h1>
|
<div className="w-20 h-20 bg-gradient-to-br from-[#22bb6c] to-[#22c0a3] rounded-3xl flex items-center justify-center shadow-2xl shadow-[#22c0a3]/20">
|
||||||
<p className="text-slate-400 text-sm font-bold uppercase tracking-[0.2em] mt-1">Acesso Restrito - Teste</p>
|
<Zap size={40} className="text-white fill-white" />
|
||||||
|
</div>
|
||||||
|
<h1 className="text-3xl font-black text-white tracking-tighter">Workspace <span className="text-[#22c0a3]">Finance</span></h1>
|
||||||
</div>
|
</div>
|
||||||
|
<p className="text-slate-400 text-sm font-medium">Ambiente em fase de ajuste. Insira a chave de acesso para continuar.</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<form onSubmit={handleLogin} className="space-y-6">
|
<form onSubmit={handleLogin} className="space-y-6">
|
||||||
<div className="space-y-2 group">
|
<div className="space-y-2 group">
|
||||||
<label className="text-[10px] font-black uppercase tracking-[0.2em] text-slate-500 ml-1 group-focus-within:text-[var(--workspace-sec-2-light)] transition-colors">
|
<label className="text-[0.7rem] font-bold uppercase tracking-widest text-slate-500 ml-1 group-focus-within:text-[#22c0a3] transition-colors">
|
||||||
Senha de Acesso
|
Chave de Acesso
|
||||||
</label>
|
</label>
|
||||||
<div className="relative">
|
<div className="relative">
|
||||||
<div className="absolute left-4 top-1/2 -translate-y-1/2 text-slate-500 group-focus-within:text-[var(--workspace-sec-2-light)] transition-colors">
|
<div className="absolute left-4 top-1/2 -translate-y-1/2 text-slate-500 group-focus-within:text-[#22c0a3] transition-colors">
|
||||||
<Lock size={20} />
|
<Lock size={18} />
|
||||||
</div>
|
</div>
|
||||||
<input
|
<input
|
||||||
type={showPassword ? "text" : "password"}
|
type={showPassword ? "text" : "password"}
|
||||||
value={password}
|
value={password}
|
||||||
onChange={(e) => setPassword(e.target.value)}
|
onChange={(e) => setPassword(e.target.value)}
|
||||||
placeholder="••••••••"
|
placeholder="••••••••"
|
||||||
className="w-full pl-12 pr-12 py-4 bg-white/5 border border-white/10 rounded-2xl focus:border-[var(--workspace-sec-2-light)] focus:ring-1 focus:ring-[var(--workspace-sec-2-light)] outline-none transition-all text-white font-medium"
|
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
|
required
|
||||||
/>
|
/>
|
||||||
<button
|
<button
|
||||||
|
|
@ -79,33 +85,35 @@ export const LoginView = () => {
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{error && (
|
{error && (
|
||||||
<motion.div
|
<motion.div
|
||||||
initial={{ opacity: 0, y: -10 }}
|
initial={{ opacity: 0, scale: 0.95 }}
|
||||||
animate={{ opacity: 1, y: 0 }}
|
animate={{ opacity: 1, scale: 1 }}
|
||||||
className="p-4 bg-red-500/10 border border-red-500/20 rounded-xl text-red-400 text-[10px] font-black uppercase tracking-tight flex items-center gap-3"
|
className="p-4 bg-red-500/10 border border-red-500/20 rounded-2xl text-red-500 text-[0.7rem] font-bold text-center uppercase tracking-tight"
|
||||||
>
|
>
|
||||||
<Zap size={14} className="fill-red-400" /> {error}
|
{error}
|
||||||
</motion.div>
|
</motion.div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
<button
|
<button
|
||||||
type="submit"
|
type="submit"
|
||||||
disabled={loading}
|
disabled={loading}
|
||||||
className="w-full py-5 bg-gradient-to-r from-[var(--workspace-sec-1-light)] to-[var(--workspace-sec-2-light)] hover:brightness-110 text-white font-black rounded-2xl shadow-xl shadow-[var(--workspace-sec-1-light)]/20 transition-all flex items-center justify-center gap-3 uppercase tracking-[0.15em] text-xs"
|
className="w-full py-5 bg-[#22c0a3] hover:bg-[#22bb6c] text-white font-black rounded-2xl shadow-xl shadow-[#22c0a3]/20 transform active:scale-[0.98] transition-all flex items-center justify-center gap-3 text-sm uppercase tracking-[0.2em]"
|
||||||
>
|
>
|
||||||
{loading ? (
|
{loading ? (
|
||||||
<div className="w-5 h-5 border-2 border-white/30 border-t-white rounded-full animate-spin" />
|
<div className="w-5 h-5 border-3 border-white/30 border-t-white rounded-full animate-spin" />
|
||||||
) : (
|
) : (
|
||||||
<>
|
<>
|
||||||
Entrar no Workspace <ArrowRight size={18} />
|
Entrar no Workspace <ArrowRight size={20} />
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
</button>
|
</button>
|
||||||
</form>
|
</form>
|
||||||
|
|
||||||
<p className="text-center text-[10px] font-medium text-slate-500 uppercase tracking-widest pt-4">
|
<div className="pt-6 border-t border-white/5 text-center">
|
||||||
Ambiente em Construção • iTGUYS 2026
|
<span className="text-[10px] text-slate-500 uppercase tracking-[0.4em] font-black opacity-60">
|
||||||
</p>
|
© 2026 iTGUYS • SISTEMAS DE ALTA PERFORMANCE
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</motion.div>
|
</motion.div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue