feat: navbar menu order, notifications, user profile, help view and module activities
Build and Deploy (Gitea) / build-and-deploy (push) Failing after 30s
Details
Build and Deploy (Gitea) / build-and-deploy (push) Failing after 30s
Details
This commit is contained in:
parent
fddc06db4d
commit
2ef1416d8d
59
server.ts
59
server.ts
|
|
@ -1212,6 +1212,65 @@ app.get('/api/certificates', authenticateToken, (req: AuthenticatedRequest, res:
|
|||
res.json(myCerts);
|
||||
});
|
||||
|
||||
// --- NOTIFICATIONS ---
|
||||
app.get('/api/notifications', authenticateToken, (req: AuthenticatedRequest, res: Response) => {
|
||||
const db = loadDb();
|
||||
const myNotifications = db.notifications.filter(n => n.userId === req.user!.id || n.userId === 'ALL');
|
||||
res.json(myNotifications.sort((a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime()));
|
||||
});
|
||||
|
||||
app.put('/api/notifications/:id/read', authenticateToken, (req: AuthenticatedRequest, res: Response) => {
|
||||
const db = loadDb();
|
||||
const notification = db.notifications.find(n => n.id === req.params.id);
|
||||
if (notification && (notification.userId === req.user!.id || notification.userId === 'ALL')) {
|
||||
notification.read = true;
|
||||
saveDb(db);
|
||||
}
|
||||
res.json({ success: true });
|
||||
});
|
||||
|
||||
// --- HELP DESK ---
|
||||
app.get('/api/help', authenticateToken, (req: AuthenticatedRequest, res: Response) => {
|
||||
const db = loadDb();
|
||||
res.json({ helpText: db.settings?.helpText || '' });
|
||||
});
|
||||
|
||||
app.put('/api/admin/help', authenticateToken, requireAdmin, (req: AuthenticatedRequest, res: Response) => {
|
||||
const db = loadDb();
|
||||
if (!db.settings) db.settings = {};
|
||||
db.settings.helpText = req.body.helpText;
|
||||
saveDb(db);
|
||||
res.json({ success: true });
|
||||
});
|
||||
|
||||
// --- MODULE ACTIVITIES (ADMIN) ---
|
||||
app.get('/api/admin/modules/:moduleId/activity', authenticateToken, requireAdmin, (req: AuthenticatedRequest, res: Response) => {
|
||||
const db = loadDb();
|
||||
const activity = db.activities.find(a => a.moduleId === req.params.moduleId);
|
||||
res.json(activity || { moduleId: req.params.moduleId, questions: [] });
|
||||
});
|
||||
|
||||
app.put('/api/admin/modules/:moduleId/activity', authenticateToken, requireAdmin, (req: AuthenticatedRequest, res: Response) => {
|
||||
const db = loadDb();
|
||||
const { moduleId } = req.params;
|
||||
const { questions } = req.body;
|
||||
|
||||
let activity = db.activities.find(a => a.moduleId === moduleId);
|
||||
if (!activity) {
|
||||
activity = {
|
||||
id: `act_${Math.random().toString(36).substring(2, 9)}`,
|
||||
moduleId,
|
||||
questions: [],
|
||||
createdAt: new Date().toISOString()
|
||||
};
|
||||
db.activities.push(activity);
|
||||
}
|
||||
|
||||
activity.questions = questions;
|
||||
saveDb(db);
|
||||
res.json(activity);
|
||||
});
|
||||
|
||||
// --- VITE MIDDLEWARE / SPA FALLBACK ---
|
||||
async function startServer() {
|
||||
if (process.env.NODE_ENV !== 'production') {
|
||||
|
|
|
|||
18
src/App.tsx
18
src/App.tsx
|
|
@ -10,6 +10,8 @@ import CourseView from './components/CourseView';
|
|||
import SubscriptionView from './components/SubscriptionView';
|
||||
import CourseUnlockModal from './components/CourseUnlockModal';
|
||||
import CertificatesTab from './components/CertificatesTab';
|
||||
import ProfileView from './components/ProfileView';
|
||||
import HelpView from './components/HelpView';
|
||||
import { User as UserType, Course as CourseType, SubscriptionStatus } from './types';
|
||||
|
||||
export default function App() {
|
||||
|
|
@ -261,6 +263,22 @@ export default function App() {
|
|||
/>
|
||||
)}
|
||||
|
||||
{/* RENDER VIEW: PROFILE */}
|
||||
{activeView === 'profile' && (
|
||||
<ProfileView
|
||||
user={user as any}
|
||||
onBack={() => setView('home')}
|
||||
/>
|
||||
)}
|
||||
|
||||
{/* RENDER VIEW: HELP */}
|
||||
{activeView === 'help' && (
|
||||
<HelpView
|
||||
token={token}
|
||||
onBack={() => setView('home')}
|
||||
/>
|
||||
)}
|
||||
|
||||
</main>
|
||||
|
||||
{/* Unlock Modal */}
|
||||
|
|
|
|||
|
|
@ -62,6 +62,8 @@ export default function AdminContentManager({ token }: AdminContentManagerProps)
|
|||
title: '', videoUrl: '', videoType: 'youtube' as 'youtube' | 'direct', order: 1, content: ''
|
||||
});
|
||||
|
||||
const [managingActivityForModule, setManagingActivityForModule] = useState<string | null>(null);
|
||||
|
||||
const [showActivityModal, setShowActivityModal] = useState(false);
|
||||
const [activeModuleForActivity, setActiveModuleForActivity] = useState<string | null>(null);
|
||||
const [activityQuestions, setActivityQuestions] = useState<{question: string, options: string[], correctIndex: number}[]>([]);
|
||||
|
|
@ -297,6 +299,49 @@ export default function AdminContentManager({ token }: AdminContentManagerProps)
|
|||
document.getElementById('admin-content-top')?.scrollIntoView({ behavior: 'smooth', block: 'start' });
|
||||
}, 50);
|
||||
};
|
||||
const handleManageActivity = async (moduleId: string) => {
|
||||
setActiveModuleForActivity(moduleId);
|
||||
setActivityQuestions([]);
|
||||
|
||||
try {
|
||||
const res = await fetch(`/api/admin/modules/${moduleId}/activity`, {
|
||||
headers: { 'Authorization': `Bearer ${token}` }
|
||||
});
|
||||
if (res.ok) {
|
||||
const data = await res.json();
|
||||
setActivityQuestions(data.questions || []);
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('Error fetching activity:', err);
|
||||
}
|
||||
|
||||
setShowActivityModal(true);
|
||||
};
|
||||
|
||||
const handleSaveActivity = async () => {
|
||||
if (!activeModuleForActivity) return;
|
||||
|
||||
try {
|
||||
const res = await fetch(`/api/admin/modules/${activeModuleForActivity}/activity`, {
|
||||
method: 'PUT',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'Authorization': `Bearer ${token}`
|
||||
},
|
||||
body: JSON.stringify({ questions: activityQuestions })
|
||||
});
|
||||
if (res.ok) {
|
||||
alert('Atividade salva com sucesso!');
|
||||
setShowActivityModal(false);
|
||||
} else {
|
||||
alert('Erro ao salvar atividade.');
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('Error saving activity:', err);
|
||||
alert('Erro ao salvar atividade.');
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
const handleDeleteLesson = async (lessonId: string) => {
|
||||
if (!window.confirm('Excluir esta aula?')) return;
|
||||
|
|
|
|||
|
|
@ -764,6 +764,17 @@ export default function AdminDashboard({ token }: AdminDashboardProps) {
|
|||
/>
|
||||
<p className="text-[10px] text-zinc-500">Dias grátis que um novo aluno ganha ao se cadastrar.</p>
|
||||
</div>
|
||||
|
||||
<div className="space-y-1">
|
||||
<label className="text-xs text-zinc-400 font-bold">Texto de Ajuda (Página de Ajuda)</label>
|
||||
<textarea
|
||||
value={settings.helpText || ''}
|
||||
onChange={(e) => setSettings({...settings, helpText: e.target.value})}
|
||||
className="w-full bg-black/40 border border-white/10 rounded-lg p-3 text-sm text-white focus:outline-none focus:border-primary transition-colors min-h-[120px]"
|
||||
placeholder="Escreva aqui as instruções de ajuda para os alunos..."
|
||||
/>
|
||||
<p className="text-[10px] text-zinc-500">O texto que aparece para o aluno em Meus Dados -> Ajuda.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Integração Asaas */}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,62 @@
|
|||
import React, { useState, useEffect } from 'react';
|
||||
import { ArrowLeft, HelpCircle } from 'lucide-react';
|
||||
|
||||
interface HelpViewProps {
|
||||
token: string | null;
|
||||
onBack: () => void;
|
||||
}
|
||||
|
||||
export default function HelpView({ token, onBack }: HelpViewProps) {
|
||||
const [helpText, setHelpText] = useState<string>('');
|
||||
const [isLoading, setIsLoading] = useState(true);
|
||||
|
||||
useEffect(() => {
|
||||
fetchHelpText();
|
||||
}, []);
|
||||
|
||||
const fetchHelpText = async () => {
|
||||
setIsLoading(true);
|
||||
try {
|
||||
const res = await fetch('/api/help', {
|
||||
headers: { 'Authorization': `Bearer ${token}` }
|
||||
});
|
||||
if (res.ok) {
|
||||
const data = await res.json();
|
||||
setHelpText(data.helpText);
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('Error fetching help text:', err);
|
||||
} finally {
|
||||
setIsLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="space-y-6 max-w-4xl mx-auto">
|
||||
<button
|
||||
onClick={onBack}
|
||||
className="flex items-center space-x-2 text-zinc-400 hover:text-white transition-colors text-sm font-bold"
|
||||
>
|
||||
<ArrowLeft className="w-4 h-4" />
|
||||
<span>Voltar</span>
|
||||
</button>
|
||||
|
||||
<div className="glass-card rounded-2xl overflow-hidden shadow-2xl border border-white/10 p-8 min-h-[50vh]">
|
||||
<div className="flex items-center space-x-3 mb-8 border-b border-white/10 pb-4">
|
||||
<HelpCircle className="w-8 h-8 text-[#E50914]" />
|
||||
<h2 className="text-2xl font-bold text-white">Central de Ajuda</h2>
|
||||
</div>
|
||||
|
||||
{isLoading ? (
|
||||
<div className="flex justify-center items-center py-12">
|
||||
<div className="w-8 h-8 border-4 border-[#E50914] border-t-transparent rounded-full animate-spin" />
|
||||
</div>
|
||||
) : (
|
||||
<div className="text-zinc-300 space-y-4 whitespace-pre-wrap leading-relaxed text-sm md:text-base">
|
||||
{helpText || 'Nenhuma informação de ajuda disponível no momento.'}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
import React from 'react';
|
||||
import { Play, LogOut, Shield, User, GraduationCap, DollarSign } from 'lucide-react';
|
||||
import React, { useState, useEffect, useRef } from 'react';
|
||||
import { Play, LogOut, Shield, User, GraduationCap, DollarSign, Bell, ChevronDown, Check, HelpCircle } from 'lucide-react';
|
||||
import { SubscriptionStatus } from '../types';
|
||||
|
||||
interface NavbarProps {
|
||||
|
|
@ -15,6 +15,67 @@ interface NavbarProps {
|
|||
}
|
||||
|
||||
export default function Navbar({ user, activeView, setView, onLogout }: NavbarProps) {
|
||||
const [showNotifications, setShowNotifications] = useState(false);
|
||||
const [showProfileMenu, setShowProfileMenu] = useState(false);
|
||||
const [notifications, setNotifications] = useState<any[]>([]);
|
||||
|
||||
const notifRef = useRef<HTMLDivElement>(null);
|
||||
const profileRef = useRef<HTMLDivElement>(null);
|
||||
|
||||
useEffect(() => {
|
||||
// Close menus on outside click
|
||||
const handleClickOutside = (e: MouseEvent) => {
|
||||
if (notifRef.current && !notifRef.current.contains(e.target as Node)) {
|
||||
setShowNotifications(false);
|
||||
}
|
||||
if (profileRef.current && !profileRef.current.contains(e.target as Node)) {
|
||||
setShowProfileMenu(false);
|
||||
}
|
||||
};
|
||||
document.addEventListener('mousedown', handleClickOutside);
|
||||
return () => document.removeEventListener('mousedown', handleClickOutside);
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
if (user) {
|
||||
fetchNotifications();
|
||||
}
|
||||
}, [user]);
|
||||
|
||||
const fetchNotifications = async () => {
|
||||
try {
|
||||
// In a real app we would pass the token or it would be in cookies
|
||||
// Assuming server uses some auth, for demo we might just fetch
|
||||
const token = localStorage.getItem('token');
|
||||
if (!token) return;
|
||||
const res = await fetch('/api/notifications', {
|
||||
headers: { 'Authorization': `Bearer ${token}` }
|
||||
});
|
||||
if (res.ok) {
|
||||
const data = await res.json();
|
||||
setNotifications(data);
|
||||
}
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
}
|
||||
};
|
||||
|
||||
const markAsRead = async (id: string) => {
|
||||
try {
|
||||
const token = localStorage.getItem('token');
|
||||
if (!token) return;
|
||||
await fetch(`/api/notifications/${id}/read`, {
|
||||
method: 'PUT',
|
||||
headers: { 'Authorization': `Bearer ${token}` }
|
||||
});
|
||||
setNotifications(notifications.map(n => n.id === id ? { ...n, read: true } : n));
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
}
|
||||
};
|
||||
|
||||
const unreadCount = notifications.filter(n => !n.read).length;
|
||||
|
||||
if (!user) return null;
|
||||
|
||||
const getStatusColor = (status: SubscriptionStatus) => {
|
||||
|
|
@ -61,20 +122,20 @@ export default function Navbar({ user, activeView, setView, onLogout }: NavbarPr
|
|||
>
|
||||
Cursos
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setView('certificates')}
|
||||
className={`font-medium transition-colors hover:text-[#E50914] flex items-center space-x-1 ${activeView === 'certificates' ? 'text-white' : 'text-zinc-400'}`}
|
||||
>
|
||||
<GraduationCap className="w-4 h-4" />
|
||||
<span>Meu Certificado</span>
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setView('subscription')}
|
||||
className={`font-medium transition-colors hover:text-[#E50914] flex items-center space-x-1 ${activeView === 'subscription' ? 'text-white' : 'text-zinc-400'}`}
|
||||
className={`font-medium transition-colors hover:text-[#E50914] flex items-center space-x-1 whitespace-nowrap ${activeView === 'subscription' ? 'text-white' : 'text-zinc-400'}`}
|
||||
>
|
||||
<DollarSign className="w-4 h-4" />
|
||||
<span>Minha Assinatura</span>
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setView('certificates')}
|
||||
className={`font-medium transition-colors hover:text-[#E50914] flex items-center space-x-1 whitespace-nowrap ${activeView === 'certificates' ? 'text-white' : 'text-zinc-400'}`}
|
||||
>
|
||||
<GraduationCap className="w-4 h-4" />
|
||||
<span>Meu Certificado</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -88,28 +149,95 @@ export default function Navbar({ user, activeView, setView, onLogout }: NavbarPr
|
|||
{getStatusLabel(user.subscriptionStatus)}
|
||||
</span>
|
||||
|
||||
{/* User Info & Logout */}
|
||||
{/* User Info & Actions */}
|
||||
<div className="flex items-center space-x-3 border-l border-zinc-800 pl-4">
|
||||
|
||||
{/* Notifications */}
|
||||
<div className="relative" ref={notifRef}>
|
||||
<button
|
||||
onClick={() => setShowNotifications(!showNotifications)}
|
||||
className="relative w-8 h-8 rounded-full bg-zinc-800 flex items-center justify-center text-zinc-300 hover:bg-zinc-700 transition-colors"
|
||||
>
|
||||
<Bell className="w-4 h-4" />
|
||||
{unreadCount > 0 && (
|
||||
<span className="absolute -top-1 -right-1 w-3.5 h-3.5 bg-[#E50914] text-white text-[8px] font-bold flex items-center justify-center rounded-full border-2 border-black">
|
||||
{unreadCount}
|
||||
</span>
|
||||
)}
|
||||
</button>
|
||||
|
||||
{showNotifications && (
|
||||
<div className="absolute right-0 mt-2 w-72 bg-zinc-900 border border-white/10 rounded-xl shadow-2xl overflow-hidden flex flex-col z-50">
|
||||
<div className="p-3 border-b border-white/10 bg-black/40">
|
||||
<h4 className="text-xs font-bold text-white uppercase tracking-wider">Notificações</h4>
|
||||
</div>
|
||||
<div className="max-h-64 overflow-y-auto">
|
||||
{notifications.length === 0 ? (
|
||||
<div className="p-4 text-center text-zinc-500 text-xs">Nenhuma notificação no momento.</div>
|
||||
) : (
|
||||
notifications.map(n => (
|
||||
<div
|
||||
key={n.id}
|
||||
className={`p-3 border-b border-white/5 text-xs transition-colors ${n.read ? 'bg-transparent text-zinc-400' : 'bg-white/5 text-white'}`}
|
||||
>
|
||||
<p>{n.message}</p>
|
||||
<div className="flex items-center justify-between mt-2">
|
||||
<span className="text-[10px] text-zinc-500">{new Date(n.createdAt).toLocaleDateString('pt-BR')}</span>
|
||||
{!n.read && (
|
||||
<button onClick={() => markAsRead(n.id)} className="text-[10px] text-[#E50914] hover:text-white flex items-center gap-1">
|
||||
<Check className="w-3 h-3" /> Lida
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
))
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="text-right hidden lg:block">
|
||||
<p className="text-xs font-medium text-white max-w-[120px] truncate">{user.name}</p>
|
||||
<p className="text-[10px] text-zinc-500 uppercase font-semibold">{user.role === 'admin' ? 'Administrador' : 'Aluno'}</p>
|
||||
</div>
|
||||
|
||||
<button
|
||||
onClick={() => setView('subscription')}
|
||||
title="Minha Conta"
|
||||
className="w-8 h-8 rounded-full bg-zinc-800 flex items-center justify-center text-zinc-300 hover:bg-zinc-700 transition-colors"
|
||||
>
|
||||
<User className="w-4 h-4" />
|
||||
</button>
|
||||
{/* Profile Dropdown */}
|
||||
<div className="relative" ref={profileRef}>
|
||||
<button
|
||||
onClick={() => setShowProfileMenu(!showProfileMenu)}
|
||||
className="w-10 h-10 rounded-full bg-zinc-800 flex items-center justify-center text-zinc-300 hover:bg-zinc-700 transition-colors border border-white/10"
|
||||
>
|
||||
<User className="w-5 h-5" />
|
||||
</button>
|
||||
|
||||
<button
|
||||
onClick={onLogout}
|
||||
title="Sair da Conta"
|
||||
className="w-8 h-8 rounded-full bg-zinc-800/50 flex items-center justify-center text-zinc-400 hover:bg-red-950 hover:text-red-400 transition-all"
|
||||
>
|
||||
<LogOut className="w-4 h-4" />
|
||||
</button>
|
||||
{showProfileMenu && (
|
||||
<div className="absolute right-0 mt-2 w-48 bg-zinc-900 border border-white/10 rounded-xl shadow-2xl overflow-hidden py-1 z-50">
|
||||
<button
|
||||
onClick={() => { setView('profile'); setShowProfileMenu(false); }}
|
||||
className="w-full px-4 py-2 text-left flex items-center space-x-2 text-sm text-zinc-300 hover:bg-zinc-800 hover:text-white transition-colors"
|
||||
>
|
||||
<User className="w-4 h-4" />
|
||||
<span>Meus dados</span>
|
||||
</button>
|
||||
<button
|
||||
onClick={() => { setView('help'); setShowProfileMenu(false); }}
|
||||
className="w-full px-4 py-2 text-left flex items-center space-x-2 text-sm text-zinc-300 hover:bg-zinc-800 hover:text-white transition-colors"
|
||||
>
|
||||
<HelpCircle className="w-4 h-4" />
|
||||
<span>Ajuda</span>
|
||||
</button>
|
||||
<div className="border-t border-white/10 my-1"></div>
|
||||
<button
|
||||
onClick={() => { onLogout(); setShowProfileMenu(false); }}
|
||||
className="w-full px-4 py-2 text-left flex items-center space-x-2 text-sm text-red-400 hover:bg-red-500/10 transition-colors"
|
||||
>
|
||||
<LogOut className="w-4 h-4" />
|
||||
<span>Sair</span>
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,113 @@
|
|||
import React from 'react';
|
||||
import { User as UserIcon, Shield, CreditCard, Mail, Phone, Calendar, ArrowLeft } from 'lucide-react';
|
||||
import { User } from '../types';
|
||||
|
||||
interface ProfileViewProps {
|
||||
user: User;
|
||||
onBack: () => void;
|
||||
}
|
||||
|
||||
export default function ProfileView({ user, onBack }: ProfileViewProps) {
|
||||
const getStatusColor = (status: string) => {
|
||||
switch (status) {
|
||||
case 'ACTIVE': return 'bg-emerald-500/20 text-emerald-400 border-emerald-500/50';
|
||||
case 'TRIAL': return 'bg-amber-500/20 text-amber-400 border-amber-500/50';
|
||||
case 'OVERDUE': return 'bg-red-500/20 text-red-400 border-red-500/50';
|
||||
case 'CANCELED': return 'bg-zinc-800 text-zinc-400 border-zinc-700';
|
||||
default: return 'bg-zinc-800 text-white border-zinc-700';
|
||||
}
|
||||
};
|
||||
|
||||
const getStatusLabel = (status: string) => {
|
||||
switch (status) {
|
||||
case 'ACTIVE': return 'Assinatura Ativa';
|
||||
case 'TRIAL': return 'Período de Teste';
|
||||
case 'OVERDUE': return 'Pagamento Pendente';
|
||||
case 'CANCELED': return 'Assinatura Cancelada';
|
||||
default: return status;
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="space-y-6 max-w-4xl mx-auto">
|
||||
<button
|
||||
onClick={onBack}
|
||||
className="flex items-center space-x-2 text-zinc-400 hover:text-white transition-colors text-sm font-bold"
|
||||
>
|
||||
<ArrowLeft className="w-4 h-4" />
|
||||
<span>Voltar</span>
|
||||
</button>
|
||||
|
||||
<div className="glass-card rounded-2xl overflow-hidden shadow-2xl border border-white/10 p-8">
|
||||
<div className="flex flex-col md:flex-row items-start gap-8">
|
||||
|
||||
{/* Avatar Area */}
|
||||
<div className="flex flex-col items-center space-y-4">
|
||||
<div className="w-32 h-32 bg-zinc-800 rounded-full flex items-center justify-center border-4 border-[#E50914]/20">
|
||||
<UserIcon className="w-16 h-16 text-zinc-400" />
|
||||
</div>
|
||||
<div className={`px-3 py-1 rounded-full text-xs font-bold border uppercase tracking-wider ${getStatusColor(user.subscriptionStatus)}`}>
|
||||
{getStatusLabel(user.subscriptionStatus)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* User Info */}
|
||||
<div className="flex-1 space-y-6 w-full">
|
||||
<div>
|
||||
<h2 className="text-2xl font-bold text-white">{user.name}</h2>
|
||||
<p className="text-zinc-400 text-sm">{user.role === 'admin' ? 'Administrador do Sistema' : 'Aluno'}</p>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<div className="bg-black/30 p-4 rounded-xl border border-white/5 flex items-center space-x-3">
|
||||
<Mail className="w-5 h-5 text-zinc-500" />
|
||||
<div>
|
||||
<p className="text-[10px] uppercase font-bold text-zinc-500">Email</p>
|
||||
<p className="text-sm font-medium text-white">{user.email}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-black/30 p-4 rounded-xl border border-white/5 flex items-center space-x-3">
|
||||
<Phone className="w-5 h-5 text-zinc-500" />
|
||||
<div>
|
||||
<p className="text-[10px] uppercase font-bold text-zinc-500">WhatsApp</p>
|
||||
<p className="text-sm font-medium text-white">{user.whatsapp || 'Não informado'}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-black/30 p-4 rounded-xl border border-white/5 flex items-center space-x-3">
|
||||
<Calendar className="w-5 h-5 text-zinc-500" />
|
||||
<div>
|
||||
<p className="text-[10px] uppercase font-bold text-zinc-500">Data de Nascimento</p>
|
||||
<p className="text-sm font-medium text-white">
|
||||
{user.birthDate ? new Date(user.birthDate).toLocaleDateString('pt-BR') : 'Não informado'}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-black/30 p-4 rounded-xl border border-white/5 flex items-center space-x-3">
|
||||
<CreditCard className="w-5 h-5 text-zinc-500" />
|
||||
<div>
|
||||
<p className="text-[10px] uppercase font-bold text-zinc-500">Membro desde</p>
|
||||
<p className="text-sm font-medium text-white">
|
||||
{new Date(user.createdAt).toLocaleDateString('pt-BR')}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{user.role === 'admin' && (
|
||||
<div className="mt-4 p-4 bg-[#E50914]/10 border border-[#E50914]/30 rounded-xl flex items-start space-x-3">
|
||||
<Shield className="w-5 h-5 text-[#E50914] mt-0.5" />
|
||||
<div>
|
||||
<p className="text-sm font-bold text-[#E50914]">Acesso Administrativo</p>
|
||||
<p className="text-xs text-zinc-300 mt-1">Você tem permissão total para gerenciar cursos, alunos e assinaturas.</p>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -17,6 +17,7 @@ export interface DatabaseSchema {
|
|||
activities: any[];
|
||||
moduleGrades: any[];
|
||||
certificates: any[];
|
||||
notifications: any[];
|
||||
settings: any; // SystemSettings
|
||||
}
|
||||
|
||||
|
|
@ -32,12 +33,14 @@ const DEFAULT_DB: DatabaseSchema = {
|
|||
activities: [],
|
||||
moduleGrades: [],
|
||||
certificates: [],
|
||||
notifications: [],
|
||||
settings: {
|
||||
trialDurationDays: 7,
|
||||
asaasEnvironment: 'sandbox',
|
||||
asaasApiKey: '',
|
||||
asaasWebhookUrl: '',
|
||||
asaasWebhookSecret: ''
|
||||
asaasWebhookSecret: '',
|
||||
helpText: '# Central de Ajuda\n\nAqui você encontra todas as informações sobre os cursos e funcionamento da plataforma.'
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -413,12 +416,14 @@ function createInitialDb(): DatabaseSchema {
|
|||
activities: [],
|
||||
moduleGrades: [],
|
||||
certificates: [],
|
||||
notifications: [],
|
||||
settings: {
|
||||
trialDurationDays: 7,
|
||||
asaasEnvironment: 'sandbox',
|
||||
asaasApiKey: '',
|
||||
asaasWebhookUrl: '',
|
||||
asaasWebhookSecret: ''
|
||||
asaasWebhookSecret: '',
|
||||
helpText: '# Central de Ajuda\n\nAqui você encontra todas as informações sobre os cursos e funcionamento da plataforma.'
|
||||
}
|
||||
};
|
||||
}
|
||||
|
|
|
|||
18
src/types.ts
18
src/types.ts
|
|
@ -22,6 +22,7 @@ export interface SystemSettings {
|
|||
asaasApiKey: string;
|
||||
asaasWebhookUrl: string;
|
||||
asaasWebhookSecret: string;
|
||||
helpText: string;
|
||||
}
|
||||
|
||||
export interface Course {
|
||||
|
|
@ -98,10 +99,25 @@ export interface AdminDashboardStats {
|
|||
canceledSubscribers: number;
|
||||
}
|
||||
|
||||
export interface Question {
|
||||
id: string;
|
||||
text: string;
|
||||
options: string[];
|
||||
correctOptionIndex: number;
|
||||
}
|
||||
|
||||
export interface ModuleActivity {
|
||||
id: string;
|
||||
moduleId: string;
|
||||
questions: any[];
|
||||
questions: Question[];
|
||||
createdAt: string;
|
||||
}
|
||||
|
||||
export interface Notification {
|
||||
id: string;
|
||||
userId: string;
|
||||
message: string;
|
||||
read: boolean;
|
||||
createdAt: string;
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue