[MVPTN-2] refacto(AndamentoServico): Refaz o CRUD de AndamentoServico implementando componeização

This commit is contained in:
Keven Willian Pereira de Souza 2025-09-13 13:14:00 -03:00
parent 3355c98164
commit 0407483d23
15 changed files with 580 additions and 436 deletions

24
package-lock.json generated
View file

@ -8,6 +8,7 @@
"name": "app",
"version": "0.1.0",
"dependencies": {
"@faker-js/faker": "^10.0.0",
"@hookform/resolvers": "^5.2.1",
"@radix-ui/react-alert-dialog": "^1.1.15",
"@radix-ui/react-avatar": "^1.1.10",
@ -24,6 +25,7 @@
"class-variance-authority": "^0.7.1",
"clsx": "^2.1.1",
"cookies-next": "^6.1.0",
"faker-js": "^1.0.0",
"jsonwebtoken": "^9.0.2",
"lucide-react": "^0.540.0",
"next": "15.4.6",
@ -69,6 +71,22 @@
"tslib": "^2.4.0"
}
},
"node_modules/@faker-js/faker": {
"version": "10.0.0",
"resolved": "https://registry.npmjs.org/@faker-js/faker/-/faker-10.0.0.tgz",
"integrity": "sha512-UollFEUkVXutsaP+Vndjxar40Gs5JL2HeLcl8xO1QAjJgOdhc3OmBFWyEylS+RddWaaBiAzH+5/17PLQJwDiLw==",
"funding": [
{
"type": "opencollective",
"url": "https://opencollective.com/fakerjs"
}
],
"license": "MIT",
"engines": {
"node": "^20.19.0 || ^22.13.0 || ^23.5.0 || >=24.0.0",
"npm": ">=10"
}
},
"node_modules/@floating-ui/core": {
"version": "1.7.3",
"resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.7.3.tgz",
@ -2167,6 +2185,12 @@
"node": ">=10.13.0"
}
},
"node_modules/faker-js": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/faker-js/-/faker-js-1.0.0.tgz",
"integrity": "sha512-kaToadbN63LWhHjl69pqG+YHlxAK0aZAPhQDUpVP7v7+RG//ZpK0OzXjCwaAQq98awOii0WSHxtJmIz0X7/UqQ==",
"license": "ISC"
},
"node_modules/get-nonce": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/get-nonce/-/get-nonce-1.0.1.tgz",

View file

@ -9,6 +9,7 @@
"lint": "next lint"
},
"dependencies": {
"@faker-js/faker": "^10.0.0",
"@hookform/resolvers": "^5.2.1",
"@radix-ui/react-alert-dialog": "^1.1.15",
"@radix-ui/react-avatar": "^1.1.10",
@ -25,6 +26,7 @@
"class-variance-authority": "^0.7.1",
"clsx": "^2.1.1",
"cookies-next": "^6.1.0",
"faker-js": "^1.0.0",
"jsonwebtoken": "^9.0.2",
"lucide-react": "^0.540.0",
"next": "15.4.6",

View file

@ -1,16 +1,6 @@
import appConfig from '../../config/app.json';
export default class Json {
static execute(path: string) {
return {
"state": "go",
"api": {
"url": "http://localhost:8000/",
"prefix": "api/v1",
"content_type": "application/json"
}
}
static execute() {
return appConfig;
}
}

View file

@ -1,92 +1,154 @@
'use client'
'use client';
import { useEffect, useState, useCallback } from "react";
import { Button } from "@/components/ui/button";
import { Card, CardContent } from "@/components/ui/card";
import { useEffect, useState } from "react";
import { useTTBAndamentoServicoReadHook } from "../../_hooks/t_tb_andamentoservico/useTTBAndamentoServicoReadHook";
import Loading from "@/app/_components/loading/loading";
import TTBAndamentoServicoInteface, { tipoEnum } from "../../_interfaces/TTBAndamentoServicoInterface";
import { TTBAndamentoServicoSchema } from "../../_schemas/TTBAndamentoServicoSchema";
import z from "zod";
import { useTTBAndamentoServicoSaveHook } from "../../_hooks/t_tb_andamentoservico/useTTBAndamentoServicoSaveHook";
import TTBAndamentoServicoTable from "../../_components/t_tb_andamentoservico/TTBAndamentoServicoTable";
import TTBAndamentoServicoForm from "../../_components/t_tb_andamentoservico/TTBAndamentoServicoForm";
import TTBAndamentoServicoAlert from "../../_components/t_tb_andamentoservico/TTBAndamentoServicoAlert";
import { PlusIcon } from "lucide-react";
type FormValues = z.infer<typeof TTBAndamentoServicoSchema>
import Loading from "@/app/_components/loading/loading";
import TTBAndamentoServicoTable from "../../_components/t_tb_andamentoservico/TTBAndamentoServicoTable";
import TTBAndamentoServicoForm from "../../_components/t_tb_andamentoservico/TTBAndamentoServicoForm";
import { useTTBAndamentoServicoReadHook } from "../../_hooks/t_tb_andamentoservico/useTTBAndamentoServicoReadHook";
import { useTTBAndamentoServicoSaveHook } from "../../_hooks/t_tb_andamentoservico/useTTBAndamentoServicoSaveHook";
import ConfirmDialog from "@/app/_components/confirm_dialog/ConfirmDialog";
import { useConfirmDialog } from "@/app/_components/confirm_dialog/useConfirmDialog";
import TTBAndamentoServicoInterface from "../../_interfaces/TTBAndamentoServicoInterface";
export default function TTBAndamentoServico() {
// Hooks para leitura e salvamento
const { tTBAndamentosServicos, fetchTTBAndamentoServico } = useTTBAndamentoServicoReadHook();
const { saveTTBAndamentoServico } = useTTBAndamentoServicoSaveHook();
const { tTBAndamentosServicos, fetchTTBAndamentoServico, addTTBAndamentoServico } = useTTBAndamentoServicoReadHook();
const { tTBAndamentoServico, saveTTBAndamentoServico } = useTTBAndamentoServicoSaveHook();
// Estados
const [selectedAndamento, setSelectedAndamento] = useState<TTBAndamentoServicoInterface | null>(null);
const [isFormOpen, setIsFormOpen] = useState(false);
const [dialogOpen, setDialogOpen] = useState(false);
const [alertDialogOpen, setAlertDialogOpen] = useState(false);
const [item, setItem] = useState<TTBAndamentoServicoInteface | null>(null);
// Estado para saber qual item será deletado
const [itemToDelete, setItemToDelete] = useState<TTBAndamentoServicoInterface | null>(null);
const [formOpen, setFormOpen] = useState(false);
const [editingItem, setEditingItem] = useState<FormValues | null>(null);
/**
* Hook do modal de confirmação
*/
const {
isOpen: isConfirmOpen,
openDialog: openConfirmDialog,
handleConfirm,
handleCancel,
} = useConfirmDialog();
const [deleteOpen, setDeleteOpen] = useState(false)
const [deleteItem, setDeleteItem] = useState<TTBAndamentoServicoInteface | null>(null)
/**
* Abre o formulário no modo de edição ou criação
*/
const handleOpenForm = useCallback((data: TTBAndamentoServicoInterface | null) => {
setSelectedAndamento(data);
setIsFormOpen(true);
}, []);
const emptyForm: FormValues = {
tb_andamentoservico_id: 0,
descricao: "",
situacao: "I",
tipo: "",
usa_email: "",
};
/**
* 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: TTBAndamentoServicoInterface) => {
await saveTTBAndamentoServico(formData);
handleCloseForm();
fetchTTBAndamentoServico(); // Atualiza a lista após salvar
},
[saveTTBAndamentoServico, fetchTTBAndamentoServico, handleCloseForm]
);
/**
* Quando o usuário clica em "remover" na tabela
*/
const handleConfirmDelete = useCallback((item: TTBAndamentoServicoInterface) => {
setItemToDelete(item);
openConfirmDialog(); // Abre o modal de confirmação
}, [openConfirmDialog]);
/**
* Executa a exclusão de fato quando o usuário confirma
*/
const handleDelete = useCallback(() => {
if (!itemToDelete) return;
console.log("Deletando andamento:", itemToDelete);
// TODO: Implementar lógica de exclusão na API
fetchTTBAndamentoServico(); // Atualiza a lista
setItemToDelete(null); // Limpa o item selecionado
handleCancel(); // Fecha o modal
}, [itemToDelete, fetchTTBAndamentoServico, handleCancel]);
/**
* Busca inicial dos dados
*/
useEffect(() => {
fetchTTBAndamentoServico();
}, []);
const handleSave = async (values: FormValues) => {
const saved = await saveTTBAndamentoServico(values);
addTTBAndamentoServico(saved);
setFormOpen(false);
/**
* Tela de loading enquanto carrega os dados
*/
if (!tTBAndamentosServicos) {
return <Loading type={2} />;
}
if (!tTBAndamentosServicos) return <Loading type={2} />;
return (
<div>
<div className="flex">
<div className="w-64 flex-1">
<div className="text-4xl font-semibold mb-1">
{/* Cabeçalho */}
<div className="flex items-center justify-between mb-4">
<div>
<h1 className="text-4xl font-semibold mb-1">
Andamentos
</div>
<div className="text-base text-muted-foreground">
</h1>
<p className="text-base text-muted-foreground">
Gerenciamento de tipos de reconhecimentos
</div>
</div>
<div className="w-64 flex-1 text-end">
<Button onClick={() => { setEditingItem(emptyForm); setFormOpen(true) }} className="cursor-pointer">
<PlusIcon />Tipos
</Button>
</p>
</div>
<Button onClick={() => handleOpenForm(null)} className="cursor-pointer">
<PlusIcon className="mr-2" />
Novo Tipo
</Button>
</div>
{/* Tabela de andamentos */}
<Card>
<CardContent>
<TTBAndamentoServicoTable
data={tTBAndamentosServicos}
onEdit={(item) => { setEditingItem(item); setFormOpen(true) }}
onDelete={(item) => { setDeleteItem(item); setDeleteOpen(true) }}
onEdit={handleOpenForm}
onDelete={handleConfirmDelete}
/>
</CardContent>
</Card>
<TTBAndamentoServicoForm
isOpen={formOpen}
onClose={() => setFormOpen(false)}
initialData={editingItem || emptyForm}
onSave={handleSave}
{/* 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}
/>
< TTBAndamentoServicoAlert
isOpen={deleteOpen}
item={deleteItem}
onClose={() => setDeleteOpen(false)}
onConfirm={() => { setDeleteOpen(false) }}
{/* Formulário de criação/edição */}
<TTBAndamentoServicoForm
isOpen={isFormOpen}
data={selectedAndamento}
onClose={handleCloseForm}
onSave={handleSave}
/>
</div>
);

View file

@ -1,38 +0,0 @@
'use client'
import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle } from "@/components/ui/alert-dialog";
import TTBAndamentoServicoInteface from "../../_interfaces/TTBAndamentoServicoInterface";
interface Props {
isOpen: boolean,
item?: TTBAndamentoServicoInteface | null,
onClose: () => void
onConfirm: () => void
}
export default function TTBAndamentoServicoAlert({ isOpen, item, onClose, onConfirm }: Props) {
return (
<div>
<AlertDialog open={isOpen}>
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>
#{item?.tb_andamentoservico_id} - {item?.descricao}
</AlertDialogTitle>
<AlertDialogDescription>
Esta ação não pode ser desfeita. Isso excluirá permanentemente o registro e seus dados dos nossos servidores.
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogCancel onClick={onClose} className="cursor-pointer">
Cancelar
</AlertDialogCancel>
<AlertDialogAction onClick={onConfirm} className="cursor-pointer">
Continuar
</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>
</div>
);
}

View file

@ -1,36 +1,67 @@
'use client'
'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 {
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 { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
import { Controller, useForm } from "react-hook-form";
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue
} from "@/components/ui/select";
import { TTBAndamentoServicoSchema } from "../../_schemas/TTBAndamentoServicoSchema";
import { tipoEnum } from "../../_interfaces/TTBAndamentoServicoInterface";
type FormValues = z.infer<typeof TTBAndamentoServicoSchema>
type FormValues = z.infer<typeof TTBAndamentoServicoSchema>;
interface Props {
isOpen: boolean
onClose: () => void
initialData?: FormValues
onSave: (data: FormValues) => void
isOpen: boolean;
data: FormValues | null;
onClose: (item: null, isFormStatus: boolean) => void;
onSave: (data: FormValues) => void;
}
export default function TTBAndamentoServicoForm({ isOpen, onClose, initialData, onSave }: Props) {
export default function TTBAndamentoServicoForm({ isOpen, data, onClose, onSave }: Props) {
// Inicializa o react-hook-form com schema zod
const form = useForm<FormValues>({
resolver: undefined,
defaultValues: initialData || { tb_andamentoservico_id: 0, descricao: "", situacao: "I" }
})
resolver: zodResolver(TTBAndamentoServicoSchema),
defaultValues: {
descricao: "",
tipo: "",
situacao: "A",
usa_email: "I",
tb_andamentoservico_id: undefined,
},
});
// Opções do Select mapeadas a partir do enum
const tipoOptions = Object.values(tipoEnum).map((value) => ({
value,
// Aqui você pode personalizar o label como quiser
label:
value === "C" ? "Cancelado" :
value === "E" ? "Estornado" :
@ -40,113 +71,117 @@ export default function TTBAndamentoServicoForm({ isOpen, onClose, initialData,
"Outros"
}));
// Atualiza o formulário quando recebe dados para edição
useEffect(() => {
if (data) form.reset(data);
}, [data, form]);
return (
<div>
<Dialog open={isOpen} onOpenChange={onClose}>
<Dialog
open={isOpen}
onOpenChange={(open) => {
if (!open) onClose(null, false);
}}
>
<DialogContent className="sm:max-w-[425px]">
<DialogHeader>
<DialogTitle>
Andamentos
</DialogTitle>
<DialogDescription>
Controle de andamentos de atos
</DialogDescription>
</DialogHeader>
<Form {...form}>
<form
onSubmit={form.handleSubmit(onSave)}
className="space-y-1"
>
<DialogContent className="sm:max-w-[425px]">
<Form {...form}>
<form onSubmit={form.handleSubmit(onSave)} className="space-y-8">
<DialogHeader>
<DialogTitle>
Andamentos
</DialogTitle>
<DialogDescription>
Controle de andamentos de atos
</DialogDescription>
</DialogHeader>
<FormField
control={form.control}
name="descricao"
render={({ field }) => (
<FormItem>
<FormLabel>
Descrição
</FormLabel>
<FormControl>
<Input type="text" placeholder="Digite a descrição" {...field} />
</FormControl>
<FormMessage />
</FormItem>
)}
<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>
)}
/>
{/* Tipo */}
<FormField
control={form.control}
name="tipo"
render={({ field }) => (
<FormItem>
<FormLabel>Tipo</FormLabel>
<Select value={field.value} onValueChange={field.onChange}>
<FormControl className="w-full">
<SelectTrigger>
<SelectValue placeholder="Escolha o tipo do andamento" />
</SelectTrigger>
</FormControl>
<SelectContent>
{tipoOptions.map((option) => (
<SelectItem key={option.value} value={option.value}>
{option.label}
</SelectItem>
))}
</SelectContent>
</Select>
<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")}
/>
<FormField
control={form.control}
name="tipo"
render={({ field }) => (
<FormItem>
<FormLabel>
Tipo
</FormLabel>
<Select onValueChange={field.onChange} defaultValue={field.value}>
<FormControl className="w-full">
<SelectTrigger>
<SelectValue placeholder="Escolha o tipo do andamento" />
</SelectTrigger>
</FormControl>
<SelectContent>
{tipoOptions.map((option) => (
<SelectItem key={option.value} value={option.value}>
{option.label}
</SelectItem>
))}
</SelectContent>
</Select>
<FormMessage />
</FormItem>
)}
<Label>Ativo</Label>
</div>
)}
/>
{/* Usar e-mail */}
<Controller
name="usa_email"
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")}
/>
<div className="flex items-center space-x-2">
<Controller
name="situacao"
control={form.control}
render={({ field }) => (
<Checkbox
checked={field.value === "A"}
onCheckedChange={(checked) => field.onChange(checked ? "A" : "I")}
/>
)}
/>
<Label>
Ativo
</Label>
</div>
<div className="flex items-center space-x-2">
<Controller
name="usa_email"
control={form.control}
render={({ field }) => (
<Checkbox
checked={field.value === "A"}
onCheckedChange={(checked) => field.onChange(checked ? "A" : "I")}
/>
)}
/>
<Label>
Usar email
</Label>
</div>
<DialogFooter className="mb-0">
<DialogClose asChild>
<Button variant="outline" type="button" className="cursor-pointer">
Cancelar
</Button>
</DialogClose>
<Button type="submit" className="cursor-pointer">
Salvar
</Button>
</DialogFooter>
<input type="hidden" {...form.register("tb_andamentoservico_id")} />
</form>
</Form>
</DialogContent>
<Label>Usar e-mail</Label>
</div>
)}
/>
{/* Rodapé do Dialog */}
<DialogFooter className="mt-4">
<DialogClose asChild>
<Button variant="outline" type="button" onClick={() => onClose(null, false)}>
Cancelar
</Button>
</DialogClose>
<Button type="submit">Salvar</Button>
</DialogFooter>
{/* Campo oculto */}
<input type="hidden" {...form.register("tb_andamentoservico_id")} />
</form>
</Form>
</Dialog>
</div>
</DialogContent>
</Dialog>
);
}
}

View file

@ -1,79 +1,124 @@
'use client'
'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 {
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 TTBAndamentoServicoInteface from "../../_interfaces/TTBAndamentoServicoInterface";
interface Props {
data: TTBAndamentoServicoInteface[]
onEdit: (item: TTBAndamentoServicoInteface) => void
onDelete: (item: TTBAndamentoServicoInteface) => void
interface TTBAndamentoServicoTableProps {
data: TTBAndamentoServicoInteface[];
onEdit: (item: TTBAndamentoServicoInteface, isEditingFormStatus: boolean) => void;
onDelete: (item: TTBAndamentoServicoInteface, isEditingFormStatus: boolean) => void;
}
export default function TTBAndamentoServicoTable({ data, onEdit, onDelete }: Props) {
/**
* 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 TTBAndamentoServicoTable({
data,
onEdit,
onDelete
}: TTBAndamentoServicoTableProps) {
return (
<Table>
<TableHeader>
<TableRow>
<TableHead>
#
</TableHead>
<TableHead>
Situação
</TableHead>
<TableHead>
Descrição
</TableHead>
<TableHead className="text-right"></TableHead>
<TableHead>#</TableHead>
<TableHead>Situação</TableHead>
<TableHead>Descrição</TableHead>
<TableHead className="text-right">Ações</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{data.map(
(item: TTBAndamentoServicoInteface) => (
<TableRow key={item.tb_andamentoservico_id} className="cursor-pointer">
<TableCell className="font-medium">
{item.tb_andamentoservico_id}
</TableCell>
<TableCell>
{item.situacao === 'A' ? (
<span className="bg-blue-100 text-blue-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded-sm dark:bg-blue-900 dark:text-blue-300">
Ativo
</span>
) : (
<span className="bg-yellow-100 text-yellow-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded-sm dark:bg-yellow-900 dark:text-yellow-300">
Inativo
</span>
)}
</TableCell>
<TableCell>
{item.descricao}
</TableCell>
<TableCell className="text-right">
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="outline" className="cursor-pointer">
<EllipsisIcon />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent side="left" align="start">
<DropdownMenuGroup>
<DropdownMenuItem className="cursor-pointer" onSelect={() => onEdit(item)}>
<PencilIcon /> Editar
</DropdownMenuItem>
<DropdownMenuSeparator />
<DropdownMenuItem className="cursor-pointer" onSelect={() => onDelete(item)}>
<Trash2Icon /> Remover
</DropdownMenuItem>
</DropdownMenuGroup>
</DropdownMenuContent>
</DropdownMenu>
</TableCell>
</TableRow>
)
)}
{data.map((item) => (
<TableRow
key={item.tb_andamentoservico_id}
className="cursor-pointer"
>
<TableCell className="font-medium">
{item.tb_andamentoservico_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>
);
}
}

View file

@ -1,132 +1,17 @@
'use server'
import API from "@/services/api/Api";
import { Methods } from "@/services/api/enums/ApiMethodEnum";
export default async function TTBAndamentoServicoIndexData() {
return Promise.resolve({
data: [
{
tb_andamentoservico_id: 1,
descricao: "Recepção 1",
status: "A",
tipo: "G"
},
{
tb_andamentoservico_id: 2,
descricao: "Aguardando assinatura da Imobiliária",
status: "A",
tipo: "G"
},
{
tb_andamentoservico_id: 3,
descricao: "Esc. Impugnada (Falta Itbi, cert. ou documentos)",
status: "A",
tipo: "G"
},
{
tb_andamentoservico_id: 4,
descricao: "Aguardando Certtb_andamentoservico_idão de Registro",
status: "A",
tipo: "G"
},
{
tb_andamentoservico_id: 5,
descricao: "Conferencia",
status: "A",
tipo: "G"
},
{
tb_andamentoservico_id: 16,
descricao: "Mapa",
status: "A",
tipo: "G"
},
{
tb_andamentoservico_id: 6,
descricao: "Entregue",
status: "A",
tipo: "G"
},
{
tb_andamentoservico_id: 18,
descricao: "PROTOCOLADO",
status: "A",
tipo: "G"
},
{
tb_andamentoservico_id: 7,
descricao: "Protocolo",
status: "A",
tipo: "G"
},
{
tb_andamentoservico_id: 8,
descricao: "Cadastro",
status: "A",
tipo: "G"
},
{
tb_andamentoservico_id: 9,
descricao: "Registro/Espelho",
status: "A",
tipo: "G"
},
{
tb_andamentoservico_id: 10,
descricao: "Corrigtb_andamentoservico_ido Pronto",
status: "A",
tipo: "G"
},
{
tb_andamentoservico_id: 11,
descricao: "Aguardando Cliente",
status: "A",
tipo: "G"
},
{
tb_andamentoservico_id: 12,
descricao: "Cancelado a pedtb_andamentoservico_ido da parte",
status: "A",
tipo: "C"
},
{
tb_andamentoservico_id: 13,
descricao: "Cancelado por determinação judicial",
status: "A",
tipo: "C"
},
{
tb_andamentoservico_id: 14,
descricao: "Capas e Indicador",
status: "A",
tipo: "G"
},
{
tb_andamentoservico_id: 15,
descricao: "Falta assinatura",
status: "A",
tipo: "G"
},
{
tb_andamentoservico_id: 17,
descricao: "Impugnado",
status: "A",
tipo: "G"
},
{
tb_andamentoservico_id: 19,
descricao: "Entregre/sem registro",
status: "A",
tipo: "C"
},
{
tb_andamentoservico_id: 20,
descricao: "Corrigtb_andamentoservico_ido sem Registro",
status: "A",
tipo: "C"
},
{
tb_andamentoservico_id: 21,
descricao: "Cancelamento de ofício",
status: "A",
tipo: "C"
}
]
const api = new API();
const response = await api.send({
'method': Methods.GET,
'endpoint': `administrativo/t_tb_andamentoservico/`
});
}
return response;
}

View file

@ -1,16 +1,19 @@
import { faker } from "@faker-js/faker";
'use server'
export default async function name(andamentoServico: any) {
import API from "@/services/api/Api";
import TTBAndamentoServicoInteface from "../../_interfaces/TTBAndamentoServicoInterface";
import { Methods } from "@/services/api/enums/ApiMethodEnum";
return Promise.resolve({
message: 'Dados salvos com sucesso',
data: {
tb_reconhecimentotipo_id: faker.number.int({ min: 1, max: 1000 }),
descricao: andamentoServico.tb_reconhecimentotipo_id + andamentoServico.descricao,
situacao: andamentoServico.situacao,
tipo: andamentoServico.tipo,
usa_email: andamentoServico.usa_email,
},
export default async function TTBAndamentoServicoSaveData(andamentoServico: TTBAndamentoServicoInteface) {
const api = new API();
const response = await api.send({
method: Methods.POST,
endpoint: `administrativo/t_tb_andamentoservico/`,
body: andamentoServico
});
return response;
}

View file

@ -15,6 +15,7 @@ export const useTTBAndamentoServicoReadHook = () => {
const response = await TTBAndamentoServicoIndexData();
// Armazena os dados consultados
setTTBAndamentosServicos(response.data);
// Define os dados do componente de resposta (toast, modal, etc)

View file

@ -1,9 +1,9 @@
'use client'
import { useResponse } from "@/app/_response/ResponseContext"
import { use, useState } from "react";
import { useState } from "react";
import TTBAndamentoServicoInteface from "../../_interfaces/TTBAndamentoServicoInterface";
import TTBReconhecimentoTipoSaveData from "../../_data/TTBReconhecimentoTipo/TTBReconhecimentoTipoSaveData";
import TTBAndamentoServicoSaveData from "../../_data/TTBAndamentoServico/TTBAndamentoServicoSaveData";
export const useTTBAndamentoServicoSaveHook = () => {
@ -13,10 +13,12 @@ export const useTTBAndamentoServicoSaveHook = () => {
const saveTTBAndamentoServico = async (form: TTBAndamentoServicoInteface) => {
const response = await TTBReconhecimentoTipoSaveData(form);
const response = await TTBAndamentoServicoSaveData(form);
// Armazena os dados da repsota
setTTBAndamentoServico(response.data);
// Define os dados da respota(toast, modal, etc)
setResponse(response);
// Retorna os valores de forma imediata

View file

@ -0,0 +1,83 @@
'use client';
import React from 'react';
// Shadcn UI components
import {
AlertDialog,
AlertDialogCancel,
AlertDialogContent,
AlertDialogDescription,
AlertDialogFooter,
AlertDialogHeader,
AlertDialogTitle,
AlertDialogAction,
} from '@/components/ui/alert-dialog';
interface AlertProps {
/** Controla a abertura do modal */
isOpen: boolean;
/** Título principal do alerta */
title: string;
/** Descrição adicional do alerta */
description?: string;
/** Mensagem do corpo do alerta */
message: string;
/** Texto do botão de confirmação */
confirmText?: string;
/** Texto do botão de cancelamento */
cancelText?: string;
/** Função executada ao confirmar */
onConfirm: () => void;
/** Função executada ao cancelar */
onCancel: () => void;
}
/**
* Componente de alerta genérico e reutilizável.
* Baseado no Radix e Shadcn UI, com suporte a título, descrição,
* mensagem e botões de ação customizáveis.
*/
export default function ConfirmDialog({
isOpen,
title,
description,
message,
confirmText = 'Confirmar',
cancelText = 'Cancelar',
onConfirm,
onCancel,
}: AlertProps) {
return (
<AlertDialog open={isOpen} onOpenChange={onCancel}>
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>{title}</AlertDialogTitle>
{description && (
<AlertDialogDescription>{description}</AlertDialogDescription>
)}
</AlertDialogHeader>
<div className="py-4 text-sm text-muted-foreground">
{message}
</div>
<AlertDialogFooter>
<AlertDialogCancel onClick={onCancel} className="cursor-pointer">
{cancelText}
</AlertDialogCancel>
<AlertDialogAction onClick={onConfirm} className="cursor-pointer">
{confirmText}
</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>
);
}

View file

@ -0,0 +1,51 @@
// Importa os hooks useCallback e useState do React
import { useCallback, useState } from "react";
// Define a interface para opções do hook
// Permite que o usuário passe callbacks opcionais para confirmação e cancelamento
interface UseConfirmDialogOptions {
onConfirm?: () => void; // Função chamada quando o usuário confirma a ação
onCancel?: () => void; // Função chamada quando o usuário cancela a ação
}
// Declara o hook customizado useConfirmDialog
// Recebe um objeto de opções que contém os callbacks onConfirm e onCancel
export function useConfirmDialog({ onConfirm, onCancel }: UseConfirmDialogOptions = {}) {
// Estado interno que controla se o diálogo de confirmação está aberto
const [isOpen, setIsOpen] = useState(false);
// Função para abrir o diálogo
// useCallback memoriza a função para que não seja recriada em cada renderização
const openDialog = useCallback(() => setIsOpen(true), []);
// Função para fechar o diálogo
const closeDialog = useCallback(() => setIsOpen(false), []);
// Função chamada quando o usuário confirma a ação
// Executa o callback onConfirm, se fornecido, e fecha o diálogo
const handleConfirm = useCallback(() => {
onConfirm?.(); // Chama onConfirm somente se ele existir
closeDialog(); // Fecha o diálogo após a confirmação
}, [onConfirm, closeDialog]);
// Função chamada quando o usuário cancela a ação
// Executa o callback onCancel, se fornecido, e fecha o diálogo
const handleCancel = useCallback(() => {
onCancel?.(); // Chama onCancel somente se ele existir
closeDialog(); // Fecha o diálogo após o cancelamento
}, [onCancel, closeDialog]);
// Retorna os valores e funções que serão usados pelo componente
// isOpen -> estado do modal
// openDialog -> função para abrir o modal
// closeDialog -> função para fechar o modal
// handleConfirm -> função para confirmar a ação
// handleCancel -> função para cancelar a ação
return {
isOpen,
openDialog,
closeDialog,
handleConfirm,
handleCancel,
};
}

View file

@ -1,7 +1,7 @@
{
"state": "go",
"api": {
"url": "http://localhost:3000/",
"url": "http://localhost:8000/",
"prefix": "api/v1/",
"content_type": "application/json"
}

View file

@ -1,6 +1,5 @@
import Json from '@/actions/json/Json';
import ApiInterface from './interfaces/ApiInterface';
import Response from '@/services/response/Response';
import TokenGet from '@/actions/token/TokenGet';
import ApiSchema from '@/services/api/schemas/ApiSchema';
@ -17,7 +16,7 @@ export default class API {
this.ApiSchema = new ApiSchema();
// Obtem as configurações da aplicação
this.config = Json.execute('config/app.json');
this.config = Json.execute();
}
@ -46,7 +45,7 @@ export default class API {
const filteredBody = _data.body ? Object.fromEntries(Object.entries(_data.body).filter(([_, v]) => v != null && v !== "")) : null;
// Realiza a requisição
const response = await fetch(`${this.ApiSchema.url}${this.ApiSchema.prefix}/${this.ApiSchema.endpoint}`, {
const response = await fetch(`${this.ApiSchema.url}${this.ApiSchema.prefix}${this.ApiSchema.endpoint}`, {
method: _data.method,
headers: {
"Accept": `${this.ApiSchema.contentType}`,