feat: Sistema de Ranking de Consultores CAPES - versão inicial
Backend (FastAPI + DDD):
- Arquitetura DDD com camadas Domain, Application, Infrastructure, Interface
- Integração com Elasticsearch (ATUACAPES) para dados de consultores
- Integração com Oracle (SUCUPIRA_PAINEL) para coordenações PPG
- Cálculo dos 4 componentes de pontuação (A, B, C, D)
- Cache em memória para otimização de performance
- API REST com endpoints /ranking, /ranking/detalhado, /consultor/{id}
Frontend (React + Vite):
- Interface responsiva com cards expansíveis
- Visualização detalhada de pontuação por componente
- Filtro por quantidade de consultores (Top 10, 50, 100, etc)
Docker:
- docker-compose com shared_network externa
- Backend com Oracle Instant Client
- Frontend com Vite dev server
This commit is contained in:
84
frontend/src/App.jsx
Normal file
84
frontend/src/App.jsx
Normal file
@@ -0,0 +1,84 @@
|
||||
import { useState, useEffect } from 'react';
|
||||
import Header from './components/Header';
|
||||
import ConsultorCard from './components/ConsultorCard';
|
||||
import { rankingService } from './services/api';
|
||||
import './App.css';
|
||||
|
||||
function App() {
|
||||
const [consultores, setConsultores] = useState([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [error, setError] = useState(null);
|
||||
const [total, setTotal] = useState(0);
|
||||
const [limite, setLimite] = useState(10);
|
||||
|
||||
useEffect(() => {
|
||||
loadRanking();
|
||||
}, [limite]);
|
||||
|
||||
const loadRanking = async () => {
|
||||
try {
|
||||
setLoading(true);
|
||||
setError(null);
|
||||
const response = await rankingService.getRanking(limite);
|
||||
setConsultores(response.consultores);
|
||||
setTotal(response.total);
|
||||
} catch (err) {
|
||||
console.error('Erro ao carregar ranking:', err);
|
||||
setError('Erro ao carregar ranking. Verifique se a API está rodando.');
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
if (loading) {
|
||||
return (
|
||||
<div className="container">
|
||||
<div className="loading">Carregando ranking...</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (error) {
|
||||
return (
|
||||
<div className="container">
|
||||
<div className="error">
|
||||
<h2>Erro</h2>
|
||||
<p>{error}</p>
|
||||
<button onClick={loadRanking}>Tentar novamente</button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="container">
|
||||
<Header total={total} />
|
||||
|
||||
<div className="controls">
|
||||
<label>
|
||||
Limite de consultores:
|
||||
<select value={limite} onChange={(e) => setLimite(Number(e.target.value))}>
|
||||
<option value={10}>Top 10</option>
|
||||
<option value={50}>Top 50</option>
|
||||
<option value={100}>Top 100</option>
|
||||
<option value={200}>Top 200</option>
|
||||
<option value={500}>Top 500</option>
|
||||
</select>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div className="ranking-list">
|
||||
{consultores.map((consultor) => (
|
||||
<ConsultorCard key={consultor.id_pessoa} consultor={consultor} />
|
||||
))}
|
||||
</div>
|
||||
|
||||
<footer>
|
||||
<p>Dados: ATUACAPES (Elasticsearch) + SUCUPIRA_PAINEL (Oracle)</p>
|
||||
<p>Critérios: Minuta Técnica - Ranking AtuaCAPES | Clique em qualquer consultor para ver detalhes</p>
|
||||
</footer>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default App;
|
||||
Reference in New Issue
Block a user