Skip to content

Update edit.jsx #70

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Gpizatto wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Update edit.jsx #70

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
68 changes: 37 additions & 31 deletions mapcon/pages/mapcon/protesto/edit.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
// Importações de bibliotecas e componentes necessários
import { Dialog } from 'primereact/dialog';
import { Button } from 'primereact/button';
import { InputNumber } from 'primereact/inputnumber';
Expand All @@ -17,11 +18,12 @@ import ToolbarMapCon from '../../../components/toolbar_mapcon';
import { Accordion, AccordionTab } from 'primereact/accordion';
import { Toast } from 'primereact/toast';
import React, { useRef } from 'react'

// Importação de abas/componentes específicos da tela de protesto
import { ObjetoProtestoTab } from '../../../components/mapcon/protesto/objeto_protesto_tab'
import { FormaProtestoTab } from '../../../components/mapcon/protesto/forma_protesto_tab'
import { DesdobramentoTab } from '../../../components/mapcon/protesto/desdobramento_tab'
import { FonteTab } from '../../../components/mapcon/protesto/fonte_tab'

import dynamic from 'next/dynamic'
import { LocalTab } from '../../../components/mapcon/protesto/local_tab';
import { AgenteTab } from '../../../components/mapcon/protesto/agente_tab';
Expand All @@ -31,43 +33,45 @@ import FormGeral from '../../../components/mapcon/protesto/FormGeral';

function ProtestoForm(props) {

// const hist = props.hist?.map(h => ({ status: h['quem'] + ' - ' + h['acao'], date: h['quando'] }))
// Carregamento dinâmico da aba de geolocalização (evita problemas com SSR)
const GeolocalizacaoTab = dynamic(() => import("../../../components/mapcon/protesto/geolocalizacao_tab"), { ssr: false });

const toast = useRef(null);
const toast = useRef(null); // Referência para o componente de Toast (mensagens)

// Hook para lidar com o formulário
const { control, watch, handleSubmit, formState: { errors } } = useForm({
defaultValues: props.form
defaultValues: props.form // Carrega os dados do formulário via props
});

// Opções possíveis para o status do protesto
const status_options = [
{
id: 0,
label: 'Em Preenchimento'
},
{
id: 1,
label: 'Finalizado (Publicado)'
},
{
id: 2,
label: 'Finalizado (Não Publicado)'
},
]
{ id: 0, label: 'Em Preenchimento' },
{ id: 1, label: 'Finalizado (Publicado)' },
{ id: 2, label: 'Finalizado (Não Publicado)' },
];

return (
<div>
<Toast ref={toast} />
<ToolbarMapCon></ToolbarMapCon>
<ToolbarMapCon />

<div className="p-grid p-formgrid p-fluid p-m-lg-1 p-m-1">
<div className="p-col-12 p-mb-8 p-lg-8 p-mb-lg-0">
{/* Pra que serve a linha abaixo? */}
{props.hist ? <Panel header="Histórico" id="historico" toggleable collapsed={true}>
<Timeline value={hist} opposite={(item) => item.status} content={(item) => <small className="p-text-secondary">{item.date}</small>} />
</Panel> : null}

{/* Exibe o painel de histórico, se existir */}
{props.hist ? (
<Panel header="Histórico" id="historico" toggleable collapsed={true}>
<Timeline
value={hist}
opposite={(item) => item.status}
content={(item) => <small className="p-text-secondary">{item.date}</small>}
/>
</Panel>
) : null}

<div className="p-field p-col-12"><h2>Protesto</h2></div>

{/* Encapsula o formulário dentro de um FormProvider customizado */}
<FormProvider>
<FormGeral {...props}/>
</FormProvider>
Expand All @@ -77,23 +81,28 @@ function ProtestoForm(props) {
)
}

// Função que roda no servidor e carrega os dados da página antes de renderizar
export async function getServerSideProps(context) {
// Se estiver editando um protesto existente (possui ID)
if (context.query.id) {
let cad = await db('protesto').where({ num_seq_protesto: context.query.id }).first();
cad['data_protesto'] = moment(cad['data_protesto']).format('DD/MM/YYYY')
cad['data_protesto'] = moment(cad['data_protesto']).format('DD/MM/YYYY');

// Carregamento de dados relacionados ao protesto (objetos, formas, fontes, locais etc.)
const conflitos_all = await db('conflito').select('num_seq_conflito as id', 'ident_conflito as name').orderBy('ident_conflito');

const objetos_protesto = await db('objeto_protesto')
.select('num_seq_objeto_protesto as id', 'objeto_protesto as name', 'desc_categoria_objeto as categoria')
.join('categoria_objeto', 'objeto_protesto.categoria_objeto_num_seq_categoria_objeto', '=', 'categoria_objeto.num_seq_categoria_objeto')
.where({ protesto_num_seq_protesto: context.query.id });

const objetos_protesto_all = await db('categoria_objeto').select('num_seq_categoria_objeto as id', 'desc_categoria_objeto as name').orderBy('desc_categoria_objeto');

const forma_protesto = await db('forma_protesto')
.select('num_seq_forma_protesto as id', 'forma_protesto as name', 'desc_repertorio_acao as repertorio')
.join('repertorio_acao', 'forma_protesto.repertorio_acao_num_seq_repertorio_acao', '=', 'repertorio_acao.num_seq_repertorio_acao')
.where({ protesto_num_seq_protesto: context.query.id });

const repertorio_acao_all = await db('repertorio_acao').select('num_seq_repertorio_acao as id', 'desc_repertorio_acao as name').orderBy('desc_repertorio_acao');

const desdobramento = await db('desdobramento')
Expand All @@ -104,13 +113,15 @@ export async function getServerSideProps(context) {
.select('num_seq_fonte as id', 'desc_fonte_protesto as name', 'referencia')
.join('fonte_protesto', 'fonte_protesto.num_seq_fonte_protesto', '=', 'fonte.fonte_protesto_num_seq_fonte_protesto')
.where({ protesto_num_seq_protesto: context.query.id });

const fonte_all = await db('fonte_protesto').select('num_seq_fonte_protesto as id', 'desc_fonte_protesto as name').orderBy('desc_fonte_protesto');

const local = await db('local')
.select('num_seq_local as id', 'endereco as name', 'bairro', 'cidade')
.join('bairro', 'bairro.num_seq_bairro', '=', 'local.bairro_num_seq_bairro')
.join('cidade', 'cidade.num_seq_cidade', '=', 'local.cidade_num_seq_cidade')
.where({ protesto_num_seq_protesto: context.query.id });

const local_all = await db('cidade').select('num_seq_cidade as id', 'cidade as name').orderBy('cidade');

const agente = await db('participacao_agente')
Expand All @@ -124,9 +135,7 @@ export async function getServerSideProps(context) {

const screenshots = await db('screenshot').select('id').where({ id_protesto: context.query.id });

// hist = await db('saude.covid_hist').column(db.raw("to_char(quando,'DD/MM/yyyy') as quando"), 'quem', 'acao').where({ num: context.query.id })
// hist.unshift({ quem: cad['resp_digit'], acao: 'Realizou o cadastro', quando: cad['data_cadastro'] })

// Dados retornados como props para a página
return {
props: {
form: { ...cad },
Expand All @@ -145,14 +154,11 @@ export async function getServerSideProps(context) {
agente_coletivos,
agente_forma,
screenshots

// hist,
// hist, // Comentado por padrão
// view: context.query.view ? true : false
}
}

}

}

export default ProtestoForm;
export default ProtestoForm;