first commit

src/components/processosAdministrativos/ProcessoAdminModal.tsx

@@ -0,0 +1,175 @@
+import { Dialog } from "@headlessui/react";
+import { useForm } from "react-hook-form";
+import { ProcessoAdministrativo, StatusProcessoAdministrativo } from "../../types/processoAdministrativo";
+import { useProcessosAdministrativos } from "../../hooks/useProcessosAdministrativos";
+import { useClientes } from "../../hooks/useClientes";
+import { FormInput, FormSelect } from "../forms";
+import { TipoParte } from "../../types/entities";
+import { useState, useEffect } from "react";
+
+interface ProcessoAdminModalProps {
+  isOpen: boolean;
+  onClose: () => void;
+  processo?: ProcessoAdministrativo;
+  onSuccess?: () => void;
+}
+
+export function ProcessoAdminModal({ 
+  isOpen, 
+  onClose, 
+  processo, 
+  onSuccess 
+}: ProcessoAdminModalProps) {
+  const { register, handleSubmit, setValue, reset } = useForm();
+  const { createProcesso, updateProcesso } = useProcessosAdministrativos();
+  const { clientes } = useClientes();
+  const [clienteSearch, setClienteSearch] = useState("");
+
+  // Reset form quando modal abrir/fechar
+  useEffect(() => {
+    if (isOpen && processo) {
+      Object.keys(processo).forEach((key) => {
+        if (key !== "id" && key !== "dataCriacao" && key !== "dataAtualizacao") {
+          setValue(key, processo[key]);
+        }
+      });
+    } else {
+      reset({
+        numero: "",
+        descricao: "",
+        orgao: "",
+        clienteId: "",
+        tipoParteCliente: TipoParte.AUTOR,
+        valorPretensao: "",
+        status: StatusProcessoAdministrativo.INICIAL,
+        observacoes: "",
+      });
+    }
+  }, [isOpen, processo, setValue, reset]);
+
+  const onSubmit = async (data: any) => {
+    try {
+      console.log("Dados do formulário:", data); // Adicionar log
+      const processData = {
+        ...data,
+        valorPretensao: data.valorPretensao ? Number(data.valorPretensao) : null,
+      };
+
+      if (processo) {
+        await updateProcesso.mutateAsync({ 
+          id: processo.id, 
+          data: processData 
+        });
+      } else {
+        await createProcesso.mutateAsync(processData);
+      }
+
+      onSuccess?.();
+      onClose();
+    } catch (error) {
+      console.error("Erro detalhado ao salvar processo:", error); // Melhorar log de erro
+    }
+  };
+
+  return (
+    <Dialog open={isOpen} onClose={onClose} className="relative z-50">
+      <div className="fixed inset-0 bg-black/30" aria-hidden="true" />
+
+      <div className="fixed inset-0 flex items-center justify-center p-4">
+        <Dialog.Panel className="mx-auto max-w-2xl w-full bg-white rounded-xl p-6">
+          <Dialog.Title className="text-lg font-semibold mb-4">
+            {processo ? "Editar Processo Administrativo" : "Novo Processo Administrativo"}
+          </Dialog.Title>
+
+          <form onSubmit={handleSubmit(onSubmit)} className="space-y-4">
+            <div className="grid grid-cols-2 gap-4">
+              <FormInput
+                label="Número/Protocolo"
+                required
+                {...register("numero")}
+              />
+
+              <FormSelect
+                label="Cliente"
+                required
+                {...register("clienteId")}
+                options={clientes.map(c => ({
+                  value: c.id,
+                  label: `${c.nome} (${c.cpfCnpj})`
+                }))}
+              />
+
+              <FormSelect
+                label="Tipo de Parte"
+                required
+                {...register("tipoParteCliente")}
+                options={[
+                  { value: TipoParte.AUTOR, label: "Autor" },
+                  { value: TipoParte.REU, label: "Réu" }
+                ]}
+              />
+
+              <FormInput
+                label="Órgão"
+                required
+                {...register("orgao")}
+              />
+
+              <div className="col-span-2">
+                <FormInput
+                  label="Descrição"
+                  required
+                  multiline
+                  rows={3}
+                  {...register("descricao")}
+                />
+              </div>
+
+              <FormInput
+                label="Valor da Pretensão"
+                type="number"
+                step="0.01"
+                {...register("valorPretensao")}
+              />
+
+              <FormSelect
+                label="Status"
+                required
+                {...register("status")}
+                options={Object.values(StatusProcessoAdministrativo).map(status => ({
+                  value: status,
+                  label: status.replace(/_/g, " ")
+                }))}
+              />
+
+              <div className="col-span-2">
+                <FormInput
+                  label="Observações"
+                  multiline
+                  rows={3}
+                  {...register("observacoes")}
+                />
+              </div>
+            </div>
+
+            <div className="flex justify-end gap-2 pt-4">
+              <button
+                type="button"
+                onClick={onClose}
+                className="px-4 py-2 text-sm text-gray-700 hover:bg-gray-50 rounded-lg"
+              >
+                Cancelar
+              </button>
+              <button
+                type="submit"
+                className="px-4 py-2 text-sm text-white bg-blue-600 hover:bg-blue-700 rounded-lg"
+              >
+                Salvar
+              </button>
+            </div>
+          </form>
+        </Dialog.Panel>
+      </div>
+    </Dialog>
+  );
+}