[VDU-9] feat(CURD):implementando listagem, cadastro, editar e excluir usuario
This commit is contained in:
parent
cefd6fd561
commit
bed3989eda
8 changed files with 54 additions and 21 deletions
|
|
@ -33,7 +33,7 @@ const initialUser: UserInterface = {
|
|||
position: 'string',
|
||||
status: SituacoesEnum.ATIVO,
|
||||
user_id_create: null,
|
||||
user_id_update: null
|
||||
user_id_update: null,
|
||||
}
|
||||
|
||||
export default function UsersPage() {
|
||||
|
|
@ -70,12 +70,16 @@ export default function UsersPage() {
|
|||
// 4. Função para salvar (criar ou editar)
|
||||
const handleSave = useCallback(
|
||||
async (formData: UserInterface) => {
|
||||
console.log("form data", formData)
|
||||
|
||||
setButtonIsLoading(true);
|
||||
|
||||
await saveUser(formData);
|
||||
|
||||
setButtonIsLoading(false);
|
||||
|
||||
setIsFormOpen(false);
|
||||
await fetchUsuarios(); // Atualiza a lista de usuários
|
||||
|
||||
fetchUsuarios(); // Atualiza a lista de usuários
|
||||
},
|
||||
[saveUser, fetchUsuarios, handleCloseForm],
|
||||
);
|
||||
|
|
@ -104,7 +108,7 @@ export default function UsersPage() {
|
|||
}, []);
|
||||
|
||||
// 7. Renderização condicional de loading
|
||||
if (!usuarios) {
|
||||
if (usuarios?.length == 0) {
|
||||
return <Loading type={2} />;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -52,15 +52,26 @@ export default function UserForm({ isOpen, data, onClose, onSave, buttonIsLoadin
|
|||
position: 'string',
|
||||
status: SituacoesEnum.ATIVO,
|
||||
user_id_create: null,
|
||||
user_id_update: null
|
||||
user_id_update: null,
|
||||
date_register: new Date().toISOString(),
|
||||
date_update: null
|
||||
},
|
||||
});
|
||||
|
||||
// Atualiza o formulário quando recebe dados para edição
|
||||
useEffect(() => {
|
||||
if (data) form.reset(data);
|
||||
console.log("form", form.getValues())
|
||||
}, [data, form]);
|
||||
|
||||
function onError(error: any) {
|
||||
console.log("error", error)
|
||||
}
|
||||
|
||||
function submit(response: any) {
|
||||
console.log("submit", response)
|
||||
}
|
||||
|
||||
return (
|
||||
<Dialog
|
||||
open={isOpen}
|
||||
|
|
@ -75,7 +86,7 @@ export default function UserForm({ isOpen, data, onClose, onSave, buttonIsLoadin
|
|||
</DialogHeader>
|
||||
|
||||
<Form {...form}>
|
||||
<form onSubmit={form.handleSubmit(onSave)} className="space-y-6">
|
||||
<form onSubmit={form.handleSubmit(onSave, onError)} className="space-y-4">
|
||||
{/* Nome */}
|
||||
<FormField
|
||||
control={form.control}
|
||||
|
|
@ -132,6 +143,22 @@ export default function UserForm({ isOpen, data, onClose, onSave, buttonIsLoadin
|
|||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
{/* Cargo */}
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="position"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Cargo</FormLabel>
|
||||
<FormControl>
|
||||
<Input {...field} placeholder="Digite o cargo do usuário" />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
{/* Status */}
|
||||
<Controller
|
||||
name="status"
|
||||
|
|
@ -167,7 +194,8 @@ export default function UserForm({ isOpen, data, onClose, onSave, buttonIsLoadin
|
|||
</DialogFooter>
|
||||
{/* Campo oculto para o ID */}
|
||||
<input type="hidden" {...form.register('user_id')} />
|
||||
<input type="hidden" {...form.register('position')} />
|
||||
<input type="hidden" {...form.register('date_register')} />
|
||||
<input type="hidden" {...form.register('date_update')} />
|
||||
</form>
|
||||
</Form>
|
||||
</DialogContent>
|
||||
|
|
|
|||
|
|
@ -5,18 +5,17 @@ import API from '@/shared/services/api/Api';
|
|||
import { withClientErrorHandler } from '@/withClientErrorHandler/withClientErrorHandler';
|
||||
import { UserInterface } from '../../interfaces/User/UserInterface';
|
||||
|
||||
async function executeUserSaveData(data: UserInterface) {
|
||||
async function executeUserSaveData(form: UserInterface) {
|
||||
const isUpdate = Boolean(form.user_id)
|
||||
|
||||
const api = new API();
|
||||
|
||||
const response = await api.send({
|
||||
'method': data.user_id ? Methods.PUT : Methods.POST,
|
||||
'endpoint': `administrativo/user/${data.user_id ? data.user_id : ''}`,
|
||||
'body': data
|
||||
'method': isUpdate ? Methods.PUT : Methods.POST,
|
||||
'endpoint': `administrativo/user/${form.user_id || ''}`,
|
||||
'body': form
|
||||
});
|
||||
|
||||
console.log(response.detail)
|
||||
|
||||
return response;
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@ import { useResponse } from '@/shared/components/response/ResponseContext';
|
|||
export const useUserIndexHook = () => {
|
||||
const { setResponse } = useResponse();
|
||||
|
||||
const [usuarios, setUsuarios] = useState<UserInterface[] | null>(null);
|
||||
const [usuarios, setUsuarios] = useState<UserInterface[]>([]);
|
||||
|
||||
const fetchUsuarios = async () => {
|
||||
const response = await UserIndexService();
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@ import { useResponse } from '@/shared/components/response/ResponseContext';
|
|||
export const useUserSaveHook = () => {
|
||||
const { setResponse } = useResponse();
|
||||
|
||||
const [User, setUser] = useState<UserInterface>();
|
||||
const [usuarios, setUser] = useState<UserInterface>();
|
||||
|
||||
const saveUser = async (User: any) => {
|
||||
const response = await UserSaveService(User);
|
||||
|
|
@ -18,5 +18,5 @@ export const useUserSaveHook = () => {
|
|||
setResponse(response);
|
||||
};
|
||||
|
||||
return { User, saveUser };
|
||||
return { usuarios, saveUser };
|
||||
};
|
||||
|
|
|
|||
|
|
@ -8,8 +8,8 @@ export interface UserInterface {
|
|||
position: string;
|
||||
team: string;
|
||||
status: SituacoesEnum; // 'A' ou 'I'
|
||||
date_register?: Date;
|
||||
date_update?: Date | null;
|
||||
date_register?: string;
|
||||
date_update?: string | null;
|
||||
user_id_create: number | null,
|
||||
user_id_update: number | null
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,11 +6,11 @@ export const UserSchema = z.object({
|
|||
name: z.string().min(3, { message: "O nome deve ter no mínimo 3 caracteres." }),
|
||||
email: z.email({ message: "Por favor, insira um email válido." }),
|
||||
password: z.string().min(6, { message: "A senha deve ter pelo menos 6 caracteres." }),
|
||||
position: z.string({message: "Por favor insira position"}),
|
||||
position: z.string().nullable().optional(),
|
||||
team: z.string().min(1, { message: "A equipe é obrigatória." }),
|
||||
status: z.enum(SituacoesEnum), // 'A' ou 'I'
|
||||
date_register: z.date().optional(),
|
||||
date_update: z.date().nullable().optional(),
|
||||
date_register: z.string().optional(),
|
||||
date_update: z.string().nullable().optional(),
|
||||
user_id_create: z.number().nullable(),
|
||||
user_id_update: z.number().nullable(),
|
||||
});
|
||||
|
|
|
|||
|
|
@ -21,6 +21,8 @@ export default class API {
|
|||
// Define os dados para envio
|
||||
const _data = data;
|
||||
|
||||
|
||||
|
||||
try {
|
||||
// Verifica se todos os dados estão corretos
|
||||
this.ApiSchema.url = this.config.api.url;
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue