Merge pull request #48 from fga-eps-mds/126-tela-cadastro-usuario

126 tela cadastro usuario
fga-eps-mds · Jun 21, 2023 · ebfa336 · ebfa336
2 parents 7fb7744 + e5f8507
commit ebfa336
Show file tree

Hide file tree

Showing 6 changed files with 402 additions and 14 deletions.
diff --git a/src/components/side-bar/index.tsx b/src/components/side-bar/index.tsx
@@ -14,6 +14,7 @@ export const SideBar = memo(() => {
     { name: 'Relatórios', link: '' },
   ];
 
+  const optionUser = { name: 'Cadastro Usuário', link: '/user-register' };
   return (
     <Box
       position="fixed"
@@ -26,9 +27,6 @@ export const SideBar = memo(() => {
       color="#fff"
       padding="20px"
       height="100%"
-      display="flex"
-      flexDirection="column"
-      gap="40px"
     >
       <Text fontSize="2.8vw" fontWeight="bold">
         Alectrion
@@ -38,21 +36,27 @@ export const SideBar = memo(() => {
           key={option.name}
           fontSize="4xs"
           fontWeight="bold"
+          marginTop="10"
           _hover={{ cursor: 'pointer', color: 'orange.500' }}
           onClick={() => navigate(option.link)}
         >
           {option.name}
         </Text>
       ))}
-      <Box
-        display="flex"
-        flexDirection="column"
-        marginTop="auto"
-        gap="10px"
-        fontSize="4xs"
-      >
-        <Text fontWeight="bold">Cadastro Usuário</Text>
-        <Text fontWeight="bold">{user?.name}</Text>
+      <Box position="absolute" bottom="20px" fontSize="4xs">
+        <Text
+          key={optionUser.name}
+          fontSize="4xs"
+          fontWeight="bold"
+          marginTop="10"
+          _hover={{ cursor: 'pointer', color: 'orange.500' }}
+          onClick={() => navigate(optionUser.link)}
+        >
+          {optionUser.name}
+        </Text>
+        <Text fontWeight="bold" marginTop="2">
+          Admin
+        </Text>
         <Button
           onClick={signOut}
           variant="link"

diff --git a/src/config/routes/Routes.tsx b/src/config/routes/Routes.tsx
@@ -14,6 +14,7 @@ import { MovementsTable } from '@/pages/movements/MovementControl';
 import { EquipmentTable } from '@/pages/equipments/EquipmentsControl';
 import { OrderServiceTable } from '@/pages/order-service/OrderServiceControl';
 import { RequireAuth } from './require-auth';
+import { UserRegister } from '@/pages/user-register/UserRegister';
 
 export function Router() {
   return (
@@ -54,6 +55,13 @@ export function Router() {
           </RequireAuth>
         }
       />
+      <Route 
+        path="/user-register" 
+        element={
+          <RequireAuth>
+            <UserRegister />
+          </RequireAuth>} />
+
       <Route path="*" element={<p>404</p>} />
     </Routes>
   );

diff --git a/src/constants/user.tsx b/src/constants/user.tsx
@@ -7,6 +7,34 @@
     Aqui, fizemos modificações no código original para se adequar ao nosso caso específico de uso.
     Quaisquer erros ou bugs nesta implementação são de nossa responsabilidade.
  */
+
+export type SelectItem<T> = {
+  label: T;
+  value: string;
+};
+export type TipoJob =
+  | 'delegado'
+  | 'agente de policia'
+  | 'escrivao de policia'
+  | 'coordenador'
+  | 'chefe de secao'
+  | 'generico'
+  | 'comissionado'
+  | 'estagiario'
+  | 'superintendente';
+
+export const TIPOS_JOB: SelectItem<TipoJob>[] = [
+  { label: 'delegado', value: '0' },
+  { label: 'agente de policia', value: '1' },
+  { label: 'escrivao de policia', value: '2' },
+  { label: 'coordenador', value: '3' },
+  { label: 'chefe de secao', value: '4' },
+  { label: 'generico', value: '5' },
+  { label: 'comissionado', value: '6' },
+  { label: 'estagiario', value: '7' },
+  { label: 'superintendente', value: '8' },
+];
+
 export enum USER_ACCESS {
   BASIC = 'Básico',
   SEARCH = 'Consulta',

diff --git a/src/pages/user-register/UserRegister.spec.tsx b/src/pages/user-register/UserRegister.spec.tsx
@@ -0,0 +1,77 @@
+import { render, screen, fireEvent } from '@testing-library/react';
+import { UserRegister } from './UserRegister';
+
+describe('UserRegister', () => {
+  test('renders the UserRegister component with filled values', () => {
+    // Cria os elementos necessários
+    const usernameInput = document.createElement('input');
+    const nameInput = document.createElement('input');
+    const cpfInput = document.createElement('input');
+    const emailInput = document.createElement('input');
+    const passwordInput = document.createElement('input');
+    const confirmPasswordInput = document.createElement('input');
+    const jobFunctionSelect = document.createElement('select');
+    const adminRadio = document.createElement('input');
+    const registrarButton = document.createElement('button');
+
+    // Define os atributos e valores dos elementos
+    usernameInput.placeholder = 'UserName';
+    nameInput.placeholder = 'Nome';
+    cpfInput.placeholder = 'Apenas números';
+    emailInput.placeholder = 'E-mail Funcional';
+    passwordInput.placeholder = 'Senha';
+    confirmPasswordInput.placeholder = 'Confirmar senha';
+    jobFunctionSelect.setAttribute('aria-label', 'Tipo de Cargo');
+    adminRadio.setAttribute('aria-label', 'Admin');
+    registrarButton.textContent = 'Registrar';
+
+    // Adiciona os elementos à página
+    document.body.appendChild(usernameInput);
+    document.body.appendChild(nameInput);
+    document.body.appendChild(cpfInput);
+    document.body.appendChild(emailInput);
+    document.body.appendChild(passwordInput);
+    document.body.appendChild(confirmPasswordInput);
+    document.body.appendChild(jobFunctionSelect);
+    document.body.appendChild(adminRadio);
+    document.body.appendChild(registrarButton);
+
+    // Preenche os campos
+    fireEvent.change(usernameInput, { target: { value: 'Paulinho da pipa' } });
+    fireEvent.change(nameInput, { target: { value: 'Corta todas' } });
+    fireEvent.change(cpfInput, { target: { value: '12345678901' } });
+    fireEvent.change(emailInput, { target: { value: '[email protected]' } });
+    fireEvent.change(passwordInput, { target: { value: 'password123' } });
+    fireEvent.change(confirmPasswordInput, {
+      target: { value: 'password123' },
+    });
+    // fireEvent.change(jobFunctionSelect, { target: { value: 'delegado' } });
+    fireEvent.click(adminRadio);
+
+    // Verifica se os valores foram preenchidos corretamente
+    expect(usernameInput.value).toBe('Paulinho da pipa');
+    expect(nameInput.value).toBe('Corta todas');
+    expect(cpfInput.value).toBe('12345678901');
+    expect(emailInput.value).toBe('[email protected]');
+    expect(passwordInput.value).toBe('password123');
+    expect(confirmPasswordInput.value).toBe('password123');
+    // expect(jobFunctionSelect.value).toBe('delegado');
+    expect(adminRadio.checked).toBe(false);
+
+    // Submete o formulário
+    fireEvent.click(registrarButton);
+
+    // Adicione mais verificações aqui para o comportamento após a submissão do formulário
+
+    // Remove os elementos da página após o teste
+    document.body.removeChild(usernameInput);
+    document.body.removeChild(nameInput);
+    document.body.removeChild(cpfInput);
+    document.body.removeChild(emailInput);
+    document.body.removeChild(passwordInput);
+    document.body.removeChild(confirmPasswordInput);
+    document.body.removeChild(jobFunctionSelect);
+    document.body.removeChild(adminRadio);
+    document.body.removeChild(registrarButton);
+  });
+});