[MVPTN-62] feat(CRUD): Cria CRUD para Profissões trabalhando com dados em mock

This commit is contained in:
Keven Willian Pereira de Souza 2025-09-15 10:23:59 -03:00
parent 43116214ff
commit 7ecf79e8a3
15 changed files with 624 additions and 0 deletions

View file

@ -0,0 +1,166 @@
'use client';
import { useEffect, useState, useCallback } from "react";
import { Card, CardContent } from "@/components/ui/card";
import Loading from "@/app/_components/loading/loading";
import GTBProfissaoTable from "../../_components/g_tb_profissao/GTBProfissaoTable";
import GTBProfissaoForm from "../../_components/g_tb_profissao/GTBProfissaoForm";
import { useGTBProfissaoReadHook } from "../../_hooks/g_tb_profissao/useGTBProfissaoReadHook";
import { useGTBProfissaoSaveHook } from "../../_hooks/g_tb_profissao/useGTBProfissaoSaveHook";
import { useGTBProfissaoRemoveHook } from "../../_hooks/g_tb_profissao/useGTBProfissaoRemoveHook";
import ConfirmDialog from "@/app/_components/confirm_dialog/ConfirmDialog";
import { useConfirmDialog } from "@/app/_components/confirm_dialog/useConfirmDialog";
import GTBProfissaoInterface from "../../_interfaces/GTBProfissaoInterface";
import Header from "@/app/_components/structure/Header";
export default function TTBAndamentoServico() {
// Hooks para leitura e salvamento
const { gTBProfissao, fetchGTBProfissao } = useGTBProfissaoReadHook();
const { saveGTBProfissao } = useGTBProfissaoSaveHook();
const { removeGTBProfissao } = useGTBProfissaoRemoveHook();
// Estados
const [selectedAndamento, setSelectedAndamento] = useState<GTBProfissaoInterface | null>(null);
const [isFormOpen, setIsFormOpen] = useState(false);
// Estado para saber qual item será deletado
const [itemToDelete, setItemToDelete] = useState<GTBProfissaoInterface | 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: GTBProfissaoInterface | 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: GTBProfissaoInterface) => {
// Aguarda salvar o registro
await saveGTBProfissao(formData);
// Encerra o fomulário
handleCloseForm();
// Atualiza a lista de dados
fetchGTBProfissao();
}, [saveGTBProfissao, fetchGTBProfissao, handleCloseForm]);
/**
* Quando o usuário clica em "remover" na tabela
*/
const handleConfirmDelete = useCallback((item: GTBProfissaoInterface) => {
// 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 removeGTBProfissao(itemToDelete);
// Atualiza a lista
await fetchGTBProfissao();
// Limpa o item selecionado
setItemToDelete(null);
// Fecha o modal
handleCancel();
}, [itemToDelete, fetchGTBProfissao, handleCancel]);
/**
* Busca inicial dos dados
*/
useEffect(() => {
fetchGTBProfissao();
}, []);
/**
* Tela de loading enquanto carrega os dados
*/
if (!gTBProfissao) {
return <Loading type={2} />;
}
return (
<div>
{/* Cabeçalho */}
<Header
title={"Profissões"}
description={"Gerenciamento de Profissões"}
buttonText={"Nova Profissão"}
buttonAction={() => { handleOpenForm(null) }}
/>
{/* Tabela de andamentos */}
<Card>
<CardContent>
<GTBProfissaoTable
data={gTBProfissao}
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 */}
<GTBProfissaoForm
isOpen={isFormOpen}
data={selectedAndamento}
onClose={handleCloseForm}
onSave={handleSave}
/>
</div>
); 4
}

View file

@ -0,0 +1,142 @@
'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 { GTBProfissaoSchema } from "../../_schemas/GTBProfissaoSchema";
type FormValues = z.infer<typeof GTBProfissaoSchema>;
interface Props {
isOpen: boolean;
data: FormValues | null;
onClose: (item: null, isFormStatus: boolean) => void;
onSave: (data: FormValues) => void;
}
export default function GTBProfissaoForm({ isOpen, data, onClose, onSave }: Props) {
// Inicializa o react-hook-form com schema zod
const form = useForm<FormValues>({
resolver: zodResolver(GTBProfissaoSchema),
defaultValues: {
descricao: "",
cod_cbo: "",
situacao: "A",
tb_profissao_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>
Profissões
</DialogTitle>
<DialogDescription>
Controle de profissões
</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 {...field} placeholder="Digite a descrição" />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
{/* CBO */}
<FormField
control={form.control}
name="cod_cbo"
render={({ field }) => (
<FormItem>
<FormLabel>CBO</FormLabel>
<FormControl>
<Input {...field} placeholder="Digite o código" />
</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("tb_profissao_id")} />
</form>
</Form>
</DialogContent>
</Dialog>
);
}

View file

@ -0,0 +1,129 @@
'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 GTBProfissaoInterface from "../../_interfaces/GTBProfissaoInterface";
interface GTBProfissaoTableProps {
data: GTBProfissaoInterface[];
onEdit: (item: GTBProfissaoInterface, isEditingFormStatus: boolean) => void;
onDelete: (item: GTBProfissaoInterface, 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 GTBProfissaoTable({
data,
onEdit,
onDelete
}: GTBProfissaoTableProps) {
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.tb_profissao_id}
className="cursor-pointer"
>
<TableCell className="font-medium">
{item.tb_profissao_id}
</TableCell>
<TableCell>
<StatusBadge situacao={item.situacao} />
</TableCell>
<TableCell className="font-medium">
{item.cod_cbo}
</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>
);
}

View file

@ -0,0 +1,49 @@
export default async function GTBProfissoesIndexData() {
return Promise.resolve([
{ "tb_profissao_id": 2, "descricao": "gestora comercial", "situacao": "A", "cod_cbo": "" },
{ "tb_profissao_id": 3, "descricao": "OPERADOR DE SUBSTAÇÃO", "situacao": "A", "cod_cbo": "123456" },
{ "tb_profissao_id": 4, "descricao": "funcionária pública federal", "situacao": "A", "cod_cbo": "-2" },
{ "tb_profissao_id": 5, "descricao": "Estudante", "situacao": "A", "cod_cbo": "-2" },
{ "tb_profissao_id": 6, "descricao": "Fazendeiro", "situacao": "A", "cod_cbo": "-2" },
{ "tb_profissao_id": 7, "descricao": "Gerente de Fazenda", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 8, "descricao": "Lavrador", "situacao": "A", "cod_cbo": "-2" },
{ "tb_profissao_id": 9, "descricao": "motorista", "situacao": "A", "cod_cbo": "-2" },
{ "tb_profissao_id": 11, "descricao": "2º Tenente", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 12, "descricao": "agricultor", "situacao": "A", "cod_cbo": "-2" },
{ "tb_profissao_id": 13, "descricao": "Aposentada", "situacao": "A", "cod_cbo": "-2" },
{ "tb_profissao_id": 14, "descricao": "Arquiteto", "situacao": "A", "cod_cbo": "-2" },
{ "tb_profissao_id": 15, "descricao": "Artesã", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 16, "descricao": "Autônomo", "situacao": "A", "cod_cbo": "-2" },
{ "tb_profissao_id": 17, "descricao": "Auxiliar de Escritório", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 19, "descricao": "Administrador Rural", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 20, "descricao": "Administrador de fazenda", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 21, "descricao": "Advogada", "situacao": "A", "cod_cbo": "-2" },
{ "tb_profissao_id": 22, "descricao": "Designer de Sobrancelhas", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 23, "descricao": "Agente Administrativo Educacional", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 24, "descricao": "Agricultora", "situacao": "A", "cod_cbo": "-2" },
{ "tb_profissao_id": 25, "descricao": "Agrimensor", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 26, "descricao": "Agropecuarista", "situacao": "A", "cod_cbo": "-2" },
{ "tb_profissao_id": 27, "descricao": "Agrônoma", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 28, "descricao": "Ambulante", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 29, "descricao": "Analista de Sistemas", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 30, "descricao": "Arquiteta", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 31, "descricao": "Artesão", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 32, "descricao": "Assessora Parlamentar", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 33, "descricao": "Assistente de Gestão", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 34, "descricao": "Auxiliar Técnico", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 35, "descricao": "Auxiliar Administrativo", "situacao": "A", "cod_cbo": "-2" },
{ "tb_profissao_id": 36, "descricao": "Auxiliar de Cartório", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 37, "descricao": "Auxiliar de Enfermagem", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 38, "descricao": "Auxiliar de Limpeza", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 39, "descricao": "Auxiliar de Produção II", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 40, "descricao": "Auxiliar de Serviços gerais", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 41, "descricao": "Auxiliar de Sondagem", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 42, "descricao": "Balconista", "situacao": "A", "cod_cbo": "-2" },
{ "tb_profissao_id": 43, "descricao": "Bancário Aposentado", "situacao": "A", "cod_cbo": null },
{ "tb_profissao_id": 44, "descricao": "Bioquímico", "situacao": "A", "cod_cbo": "-2" }
]
);
}

View file

@ -0,0 +1,11 @@
import GTBProfissaoInterface from "../../_interfaces/GTBProfissaoInterface";
export default async function GTBProfissaoRemoveData(data: GTBProfissaoInterface) {
console.log(data)
return Promise.resolve({
message: 'Dados removidos com sucesso'
});
}

View file

@ -0,0 +1,10 @@
import GTBProfissaoInterface from "../../_interfaces/GTBProfissaoInterface";
export default async function GTBProfissaoSaveData(data: GTBProfissaoInterface) {
return Promise.resolve({
message: 'Profissao salva com sucesso',
data: { "tb_profissao_id": 2, "descricao": "gestora comercial", "situacao": "A", "cod_cbo": "" },
});
}

View file

@ -0,0 +1,23 @@
import { useResponse } from "@/app/_response/ResponseContext"
import { useState } from "react";
import GTBProfissaoInterface from "../../_interfaces/GTBProfissaoInterface";
import GTBProfissaoIndexService from "../../_services/g_tb_profissao/GTBProfissaoIndexService";
export const useGTBProfissaoReadHook = () => {
const { setResponse } = useResponse();
const [gTBProfissao, setGTBProfissao] = useState<GTBProfissaoInterface | null>(null);
const fetchGTBProfissao = async () => {
const response = await GTBProfissaoIndexService();
setGTBProfissao(response);
setResponse(response);
}
return { gTBProfissao, fetchGTBProfissao }
}

View file

@ -0,0 +1,19 @@
import { useResponse } from "@/app/_response/ResponseContext"
import GTBProfissaoInterface from "../../_interfaces/GTBProfissaoInterface";
import GTBProfissaoRemoveService from "../../_services/g_tb_profissao/GTBProfissaoRemoveService";
export const useGTBProfissaoRemoveHook = () => {
const { setResponse } = useResponse();
const removeGTBProfissao = async (data: GTBProfissaoInterface) => {
const response = await GTBProfissaoRemoveService(data);
setResponse(response);
}
return { removeGTBProfissao }
}

View file

@ -0,0 +1,23 @@
import { useResponse } from "@/app/_response/ResponseContext"
import { useState } from "react";
import GTBProfissaoInterface from "../../_interfaces/GTBProfissaoInterface";
import GTBProfissaoSaveService from "../../_services/g_tb_profissao/GTBProfissaoSaveService";
export const useGTBProfissaoSaveHook = () => {
const { setResponse } = useResponse();
const [gTBProfissao, setGTBProfissao] = useState<GTBProfissaoInterface | null>(null);
const saveGTBProfissao = async (data: GTBProfissaoInterface) => {
const response = await GTBProfissaoSaveService(data);
setGTBProfissao(response);
setResponse(response);
}
return { gTBProfissao, saveGTBProfissao }
}

View file

@ -0,0 +1,9 @@
export default interface GTBProfissaoInterface {
tb_profissao_id?: number,
descricao: string,
situacao: string,
cod_cbo: string
}

View file

@ -0,0 +1,8 @@
import z from "zod";
export const GTBProfissaoSchema = z.object({
tb_profissao_id: z.number().optional,
descricao: z.string().optional,
situacao: z.string().optional,
cod_cbo: z.string().optional
});

View file

@ -0,0 +1,9 @@
import GTBProfissoesIndexData from "../../_data/GTBProfissao/GTBProfissaoIndexData";
export default async function GTBProfissaoIndexService() {
const response = await GTBProfissoesIndexData();
return response;
}

View file

@ -0,0 +1,12 @@
import GTBProfissaoRemoveData from "../../_data/GTBProfissao/GTBProfissaoRemoveData";
import GTBProfissaoInterface from "../../_interfaces/GTBProfissaoInterface";
export default async function GTBProfissaoRemoveService(data: GTBProfissaoInterface) {
console.log(data);
const response = await GTBProfissaoRemoveData(data);
return response;
}

View file

@ -0,0 +1,10 @@
import GTBProfissaoSaveData from "../../_data/GTBProfissao/GTBProfissaoSaveData";
import GTBProfissaoInterface from "../../_interfaces/GTBProfissaoInterface";
export default async function GTProfissaoSaveService(data: GTBProfissaoInterface) {
const response = await GTBProfissaoSaveData(data);
return response;
}

View file

@ -89,6 +89,10 @@ const data = {
title: "Andamentos",
url: "/cadastros/andamentos/",
},
{
title: "Profissões",
url: "/cadastros/profissoes/",
},
],
},
{