Merge branch 'release(MVP/Sprint3)' into release(MVP)
This commit is contained in:
commit
083317b897
15 changed files with 598 additions and 0 deletions
|
|
@ -0,0 +1,163 @@
|
|||
'use client';
|
||||
|
||||
import { useEffect, useState, useCallback } from "react";
|
||||
import { Card, CardContent } from "@/components/ui/card";
|
||||
|
||||
import Loading from "@/app/_components/loading/loading";
|
||||
import TCensecTable from "../../_components/t_censec/TCensecTable";
|
||||
import TCensecForm from "../../_components/t_censec/TCensecForm";
|
||||
|
||||
import { useTCensecReadHook } from "../../_hooks/t_censec/useTCensecReadHook";
|
||||
import { useTCensecSaveHook } from "../../_hooks/t_censec/useTCensecSaveHook";
|
||||
import { useTCensecDeleteHook } from "../../_hooks/t_censec/useTCensecDeleteHook";
|
||||
|
||||
import ConfirmDialog from "@/app/_components/confirm_dialog/ConfirmDialog";
|
||||
import { useConfirmDialog } from "@/app/_components/confirm_dialog/useConfirmDialog";
|
||||
|
||||
import TCensecInterface from "../../_interfaces/TCensecInterface";
|
||||
import Header from "@/app/_components/structure/Header";
|
||||
|
||||
export default function TTBAndamentoServico() {
|
||||
// Hooks para leitura e salvamento
|
||||
const { tCensec, fetchTCensec } = useTCensecReadHook();
|
||||
const { saveTCensec } = useTCensecSaveHook();
|
||||
const { deleteTCensec } = useTCensecDeleteHook();
|
||||
|
||||
// Estados
|
||||
const [selectedAndamento, setSelectedAndamento] = useState<TCensecInterface | null>(null);
|
||||
const [isFormOpen, setIsFormOpen] = useState(false);
|
||||
|
||||
// Estado para saber qual item será deletado
|
||||
const [itemToDelete, setItemToDelete] = useState<TCensecInterface | null>(null);
|
||||
|
||||
/**
|
||||
* Hook do modal de confirmação
|
||||
*/
|
||||
const {
|
||||
isOpen: isConfirmOpen,
|
||||
openDialog: openConfirmDialog,
|
||||
handleConfirm,
|
||||
handleCancel,
|
||||
} = useConfirmDialog();
|
||||
|
||||
/**
|
||||
* Abre o formulário no modo de edição ou criação
|
||||
*/
|
||||
const handleOpenForm = useCallback((data: TCensecInterface | null) => {
|
||||
setSelectedAndamento(data);
|
||||
setIsFormOpen(true);
|
||||
}, []);
|
||||
|
||||
/**
|
||||
* Fecha o formulário e limpa o andamento selecionado
|
||||
*/
|
||||
const handleCloseForm = useCallback(() => {
|
||||
setSelectedAndamento(null);
|
||||
setIsFormOpen(false);
|
||||
}, []);
|
||||
|
||||
/**
|
||||
* Salva os dados do formulário
|
||||
*/
|
||||
const handleSave = useCallback(async (formData: TCensecInterface) => {
|
||||
|
||||
// Aguarda salvar o registro
|
||||
await saveTCensec(formData);
|
||||
|
||||
// Atualiza a lista de dados
|
||||
fetchTCensec();
|
||||
|
||||
}, [saveTCensec, fetchTCensec, handleCloseForm]);
|
||||
|
||||
/**
|
||||
* Quando o usuário clica em "remover" na tabela
|
||||
*/
|
||||
const handleConfirmDelete = useCallback((item: TCensecInterface) => {
|
||||
|
||||
// Define o item atual para remoção
|
||||
setItemToDelete(item);
|
||||
|
||||
// Abre o modal de confirmação
|
||||
openConfirmDialog();
|
||||
|
||||
}, [openConfirmDialog]);
|
||||
|
||||
/**
|
||||
* Executa a exclusão de fato quando o usuário confirma
|
||||
*/
|
||||
const handleDelete = useCallback(async () => {
|
||||
|
||||
// Protege contra null
|
||||
if (!itemToDelete) return;
|
||||
|
||||
// Executa o Hook de remoção
|
||||
await deleteTCensec(itemToDelete);
|
||||
|
||||
// Atualiza a lista
|
||||
await fetchTCensec();
|
||||
|
||||
// Limpa o item selecionado
|
||||
setItemToDelete(null);
|
||||
|
||||
// Fecha o modal
|
||||
handleCancel();
|
||||
|
||||
}, [itemToDelete, fetchTCensec, handleCancel]);
|
||||
|
||||
/**
|
||||
* Busca inicial dos dados
|
||||
*/
|
||||
useEffect(() => {
|
||||
fetchTCensec();
|
||||
}, []);
|
||||
|
||||
/**
|
||||
* Tela de loading enquanto carrega os dados
|
||||
*/
|
||||
if (!tCensec) {
|
||||
return <Loading type={2} />;
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
{/* Cabeçalho */}
|
||||
<Header
|
||||
title={"CENSEC"}
|
||||
description={"Gerenciamento de Centrais"}
|
||||
buttonText={"Nova Central"}
|
||||
buttonAction={() => { handleOpenForm(null) }}
|
||||
/>
|
||||
|
||||
{/* Tabela de andamentos */}
|
||||
<Card>
|
||||
<CardContent>
|
||||
<TCensecTable
|
||||
data={tCensec}
|
||||
onEdit={handleOpenForm}
|
||||
onDelete={handleConfirmDelete}
|
||||
/>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
{/* Modal de confirmação */}
|
||||
<ConfirmDialog
|
||||
isOpen={isConfirmOpen}
|
||||
title="Confirmar exclusão"
|
||||
description="Atenção"
|
||||
message={`Deseja realmente excluir o andamento "${itemToDelete?.descricao}"?`}
|
||||
confirmText="Sim, excluir"
|
||||
cancelText="Cancelar"
|
||||
onConfirm={handleDelete}
|
||||
onCancel={handleCancel}
|
||||
/>
|
||||
|
||||
{/* Formulário de criação/edição */}
|
||||
<TCensecForm
|
||||
isOpen={isFormOpen}
|
||||
data={selectedAndamento}
|
||||
onClose={handleCloseForm}
|
||||
onSave={handleSave}
|
||||
/>
|
||||
</div>
|
||||
); 4
|
||||
}
|
||||
|
|
@ -0,0 +1,127 @@
|
|||
'use client';
|
||||
|
||||
import z from "zod";
|
||||
import { useEffect } from "react";
|
||||
import { useForm, Controller } from "react-hook-form";
|
||||
import { zodResolver } from "@hookform/resolvers/zod";
|
||||
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { Checkbox } from "@/components/ui/checkbox";
|
||||
import {
|
||||
Dialog,
|
||||
DialogClose,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogTitle
|
||||
} from "@/components/ui/dialog";
|
||||
import {
|
||||
Form,
|
||||
FormControl,
|
||||
FormField,
|
||||
FormItem,
|
||||
FormLabel,
|
||||
FormMessage
|
||||
} from "@/components/ui/form";
|
||||
import { Input } from "@/components/ui/input";
|
||||
import { Label } from "@/components/ui/label";
|
||||
|
||||
import { TCensecSchema } from "../../_schemas/TCensecSchema";
|
||||
|
||||
type FormValues = z.infer<typeof TCensecSchema>;
|
||||
|
||||
interface Props {
|
||||
isOpen: boolean;
|
||||
data: FormValues | null;
|
||||
onClose: (item: null, isFormStatus: boolean) => void;
|
||||
onSave: (data: FormValues) => void;
|
||||
}
|
||||
|
||||
export default function TCensecForm({ isOpen, data, onClose, onSave }: Props) {
|
||||
// Inicializa o react-hook-form com schema zod
|
||||
const form = useForm<FormValues>({
|
||||
resolver: zodResolver(TCensecSchema),
|
||||
defaultValues: {
|
||||
descricao: "",
|
||||
situacao: "A",
|
||||
censec_id: 0,
|
||||
},
|
||||
});
|
||||
|
||||
// Atualiza o formulário quando recebe dados para edição
|
||||
useEffect(() => {
|
||||
if (data) form.reset(data);
|
||||
}, [data, form]);
|
||||
|
||||
return (
|
||||
<Dialog
|
||||
open={isOpen}
|
||||
onOpenChange={(open) => {
|
||||
if (!open) onClose(null, false);
|
||||
}}
|
||||
>
|
||||
<DialogContent className="sm:max-w-[425px]">
|
||||
|
||||
<DialogHeader>
|
||||
<DialogTitle>
|
||||
Censec
|
||||
</DialogTitle>
|
||||
<DialogDescription>
|
||||
Tipos de Centrais
|
||||
</DialogDescription>
|
||||
</DialogHeader>
|
||||
|
||||
<Form {...form}>
|
||||
<form onSubmit={form.handleSubmit(onSave)} className="space-y-6">
|
||||
|
||||
{/* Descrição */}
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="descricao"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Descrição</FormLabel>
|
||||
<FormControl>
|
||||
<Input type="text" {...field} placeholder="Digite a descrição" />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
{/* Situação */}
|
||||
<Controller
|
||||
name="situacao"
|
||||
control={form.control}
|
||||
render={({ field }) => (
|
||||
<div className="flex items-center space-x-2">
|
||||
<Checkbox
|
||||
checked={field.value === "A"}
|
||||
onCheckedChange={(checked) => field.onChange(checked ? "A" : "I")}
|
||||
/>
|
||||
<Label>Ativo</Label>
|
||||
</div>
|
||||
)}
|
||||
/>
|
||||
|
||||
{/* Rodapé do Dialog */}
|
||||
<DialogFooter className="mt-4">
|
||||
<DialogClose asChild>
|
||||
<Button variant="outline" type="button" onClick={() => onClose(null, false)} className="cursor-pointer">
|
||||
Cancelar
|
||||
</Button>
|
||||
</DialogClose>
|
||||
<Button type="submit" className="cursor-pointer">
|
||||
Salvar
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
|
||||
{/* Campo oculto */}
|
||||
<input type="hidden" {...form.register("censec_id")} />
|
||||
</form>
|
||||
</Form>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
);
|
||||
}
|
||||
|
|
@ -0,0 +1,125 @@
|
|||
'use client';
|
||||
|
||||
import { Button } from "@/components/ui/button";
|
||||
import {
|
||||
DropdownMenu,
|
||||
DropdownMenuContent,
|
||||
DropdownMenuGroup,
|
||||
DropdownMenuItem,
|
||||
DropdownMenuSeparator,
|
||||
DropdownMenuTrigger
|
||||
} from "@/components/ui/dropdown-menu";
|
||||
import {
|
||||
Table,
|
||||
TableBody,
|
||||
TableCell,
|
||||
TableHead,
|
||||
TableHeader,
|
||||
TableRow
|
||||
} from "@/components/ui/table";
|
||||
|
||||
import { EllipsisIcon, PencilIcon, Trash2Icon } from "lucide-react";
|
||||
import TCensecInterface from "../../_interfaces/TCensecInterface";
|
||||
|
||||
interface TCensecTableProps {
|
||||
data: TCensecInterface[];
|
||||
onEdit: (item: TCensecInterface, isEditingFormStatus: boolean) => void;
|
||||
onDelete: (item: TCensecInterface, isEditingFormStatus: boolean) => void;
|
||||
}
|
||||
|
||||
/**
|
||||
* Renderiza o badge de situação
|
||||
*/
|
||||
function StatusBadge({ situacao }: { situacao: string }) {
|
||||
const isActive = situacao === "A";
|
||||
|
||||
const baseClasses =
|
||||
"text-xs font-medium px-2.5 py-0.5 rounded-sm me-2";
|
||||
|
||||
const activeClasses =
|
||||
"bg-blue-100 text-blue-800 dark:bg-blue-900 dark:text-blue-300";
|
||||
|
||||
const inactiveClasses =
|
||||
"bg-yellow-100 text-yellow-800 dark:bg-yellow-900 dark:text-yellow-300";
|
||||
|
||||
return (
|
||||
<span className={`${baseClasses} ${isActive ? activeClasses : inactiveClasses}`}>
|
||||
{isActive ? "Ativo" : "Inativo"}
|
||||
</span>
|
||||
);
|
||||
}
|
||||
|
||||
export default function TCensecTable({
|
||||
data,
|
||||
onEdit,
|
||||
onDelete
|
||||
}: TCensecTableProps) {
|
||||
return (
|
||||
<Table>
|
||||
<TableHeader>
|
||||
<TableRow>
|
||||
<TableHead>#</TableHead>
|
||||
<TableHead>Situação</TableHead>
|
||||
<TableHead>CBO</TableHead>
|
||||
<TableHead>Descrição</TableHead>
|
||||
<TableHead className="text-right">Ações</TableHead>
|
||||
</TableRow>
|
||||
</TableHeader>
|
||||
|
||||
<TableBody>
|
||||
{data.map((item) => (
|
||||
<TableRow
|
||||
key={item.censec_id}
|
||||
className="cursor-pointer"
|
||||
>
|
||||
<TableCell className="font-medium">
|
||||
{item.censec_id}
|
||||
</TableCell>
|
||||
|
||||
<TableCell>
|
||||
<StatusBadge situacao={item.situacao} />
|
||||
</TableCell>
|
||||
|
||||
<TableCell>{item.descricao}</TableCell>
|
||||
|
||||
<TableCell className="text-right">
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger asChild>
|
||||
<Button
|
||||
variant="outline"
|
||||
size="icon"
|
||||
className="cursor-pointer"
|
||||
>
|
||||
<EllipsisIcon />
|
||||
</Button>
|
||||
</DropdownMenuTrigger>
|
||||
|
||||
<DropdownMenuContent side="left" align="start">
|
||||
<DropdownMenuGroup>
|
||||
<DropdownMenuItem
|
||||
className="cursor-pointer"
|
||||
onSelect={() => onEdit(item, true)}
|
||||
>
|
||||
<PencilIcon className="mr-2 h-4 w-4" />
|
||||
Editar
|
||||
</DropdownMenuItem>
|
||||
|
||||
<DropdownMenuSeparator />
|
||||
|
||||
<DropdownMenuItem
|
||||
className="cursor-pointer"
|
||||
onSelect={() => onDelete(item, true)}
|
||||
>
|
||||
<Trash2Icon className="mr-2 h-4 w-4" />
|
||||
Remover
|
||||
</DropdownMenuItem>
|
||||
</DropdownMenuGroup>
|
||||
</DropdownMenuContent>
|
||||
</DropdownMenu>
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
))}
|
||||
</TableBody>
|
||||
</Table>
|
||||
);
|
||||
}
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
import TCensecInterface from "../../_interfaces/TCensecInterface";
|
||||
|
||||
export default async function TCensecDeleteData(data: TCensecInterface) {
|
||||
|
||||
return Promise.resolve({
|
||||
message: 'Dados removidos',
|
||||
status: 200
|
||||
});
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
export default async function TCensecIndexData() {
|
||||
|
||||
return Promise.resolve({
|
||||
message: 'Dados localizados',
|
||||
status: 200,
|
||||
data: [
|
||||
{
|
||||
censec_id: 1.00,
|
||||
descricao: 'CEP - Escritura e Procurações Diversas',
|
||||
situacao: 'A'
|
||||
},
|
||||
{
|
||||
censec_id: 2.00,
|
||||
descricao: 'CESDI - Escrituras Lei 11.441',
|
||||
situacao: 'A'
|
||||
},
|
||||
{
|
||||
censec_id: 3.00,
|
||||
descricao: 'RCTO - Testamentos',
|
||||
situacao: 'A'
|
||||
},
|
||||
{
|
||||
censec_id: 9.00,
|
||||
descricao: 'Não Possui',
|
||||
situacao: 'A'
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
import TCensecInterface from "../../_interfaces/TCensecInterface";
|
||||
|
||||
export default async function TCensecSaveData(data: TCensecInterface) {
|
||||
|
||||
return Promise.resolve({
|
||||
message: 'Dados salvos',
|
||||
status: 201,
|
||||
data: {
|
||||
censec_id: 9.00,
|
||||
descricao: 'Não Possui',
|
||||
situacao: 'A'
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
import { useResponse } from "@/app/_response/ResponseContext"
|
||||
import TCensecInterface from "../../_interfaces/TCensecInterface";
|
||||
import TCensecDeleteService from "../../_services/t_censec/TCensecDeleteService";
|
||||
|
||||
export const useTCensecDeleteHook = () => {
|
||||
|
||||
const { setResponse } = useResponse();
|
||||
|
||||
const deleteTCensec = async (data: TCensecInterface) => {
|
||||
|
||||
const response = await TCensecDeleteService(data);
|
||||
|
||||
setResponse(response);
|
||||
|
||||
}
|
||||
|
||||
return { deleteTCensec }
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,26 @@
|
|||
import { useResponse } from "@/app/_response/ResponseContext"
|
||||
import TCensecIndexService from "../../_services/t_censec/TCensecIndexService";
|
||||
import { useState } from "react";
|
||||
import TCensecInterface from "../../_interfaces/TCensecInterface";
|
||||
|
||||
export const useTCensecReadHook = () => {
|
||||
|
||||
const { setResponse } = useResponse();
|
||||
|
||||
const [tCensec, setTCensec] = useState<TCensecInterface[]>([]);
|
||||
|
||||
const fetchTCensec = async () => {
|
||||
|
||||
const response = await TCensecIndexService();
|
||||
|
||||
setTCensec(response.data);
|
||||
|
||||
setResponse(response);
|
||||
|
||||
return response
|
||||
|
||||
}
|
||||
|
||||
return { tCensec, fetchTCensec }
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,37 @@
|
|||
'use client'
|
||||
|
||||
import { useResponse } from "@/app/_response/ResponseContext"
|
||||
import { useState } from "react";
|
||||
import TCensecInterface from "../../_interfaces/TCensecInterface";
|
||||
import TCensecSaveService from "../../_services/t_censec/TCensecSaveService";
|
||||
|
||||
export const useTCensecSaveHook = () => {
|
||||
|
||||
const { setResponse } = useResponse();
|
||||
|
||||
const [tCensec, setTCensec] = useState<TCensecInterface>();
|
||||
|
||||
// controla se o formulário está aberto ou fechado
|
||||
const [isOpen, setIsOpen] = useState(false);
|
||||
|
||||
const saveTCensec = async (data: TCensecInterface) => {
|
||||
|
||||
const response = await TCensecSaveService(data);
|
||||
|
||||
// Armazena os dados da repsota
|
||||
setTCensec(response.data);
|
||||
|
||||
// Define os dados da respota(toast, modal, etc)
|
||||
setResponse(response);
|
||||
|
||||
// Fecha o formulário automaticamente após salvar
|
||||
setIsOpen(false);
|
||||
|
||||
// Retorna os valores de forma imediata
|
||||
return response.data;
|
||||
|
||||
}
|
||||
|
||||
return { tCensec, saveTCensec }
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
|
||||
export default interface TCensecInterface {
|
||||
censec_id?: number
|
||||
descricao: string
|
||||
situacao: string
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
import z from "zod";
|
||||
|
||||
export const TCensecSchema = z.object({
|
||||
censec_id: z.number().optional(),
|
||||
descricao: z.string().min(1, "O campo deve ser preenchido").max(60, "O campo excedeu o limite de 60 caracteres"),
|
||||
situacao: z.string().min(1, "O campo deve ser preenchido").max(10, "O campo excedeu o limite de 10 caracteres"),
|
||||
});
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
import TCensecDeleteData from "../../_data/TCensec/TCensecDeleteData";
|
||||
import TCensecInterface from "../../_interfaces/TCensecInterface";
|
||||
|
||||
export default async function TCensecDeleteService(data: TCensecInterface) {
|
||||
|
||||
const response = await TCensecDeleteData(data);
|
||||
|
||||
return response;
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
import TCensecIndexData from "../../_data/TCensec/TCensecIndexData";
|
||||
|
||||
export default async function TCensecIndexService() {
|
||||
|
||||
const response = await TCensecIndexData();
|
||||
|
||||
return response;
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
import TCensecSaveData from "../../_data/TCensec/TCensecSaveData";
|
||||
import TCensecInterface from "../../_interfaces/TCensecInterface";
|
||||
|
||||
export default async function TCensecSaveService(data: TCensecInterface) {
|
||||
|
||||
const response = await TCensecSaveData(data);
|
||||
|
||||
return response;
|
||||
|
||||
}
|
||||
|
|
@ -107,6 +107,10 @@ const data = {
|
|||
{
|
||||
title: "Regimes/Comunhão",
|
||||
url: "/cadastros/regime-comunhao/",
|
||||
},
|
||||
{
|
||||
title: "Censec/Centrais",
|
||||
url: "/cadastros/censec/",
|
||||
}
|
||||
],
|
||||
},
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue