add create client

src/components/administrativeTables/ClientsTable.tsx

@@ -180,7 +180,7 @@ function EnhancedTableHead(props: EnhancedTableProps) {
   );
 }
 
-export default function ClientTable() {
+export default function ClientTable({clients}: any) {
   const [order, setOrder] = useState<Order>('asc');
   const [orderBy, setOrderBy] = useState<keyof Data | string>('status');
   const [selected, setSelected] = useState<readonly string[]>([]);
@@ -199,7 +199,7 @@ export default function ClientTable() {
 
   const handleSelectAllClick = (event: React.ChangeEvent<HTMLInputElement>) => {
     if (event.target.checked) {
-      const newSelecteds = rows.map((n) => n.name);
+      const newSelecteds = clients.map((n) => n.name);
       setSelected(newSelecteds);
       return;
     }
@@ -259,20 +259,20 @@ export default function ClientTable() {
               rowCount={rows.length}
             />
             <TableBody>
-              {stableSort(rows, getComparator(order, orderBy))
+              {stableSort(clients, getComparator(order, orderBy))
                 .slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage)
                 .map((row, index) => {
-                  const isItemSelected = isSelected(row.clientCode);
+                  const isItemSelected = isSelected(row.id);
                   const labelId = `enhanced-table-checkbox-${index}`;
 
                   return (
                     <TableRow
                       hover
-                      onClick={(event) => handleClick(event, row.clientCode.toString())}
+                      onClick={(event) => handleClick(event, row.id.toString())}
                       role="checkbox"
                       aria-checked={isItemSelected}
                       tabIndex={-1}
-                      key={row.clientCode}
+                      key={row.id}
                       selected={isItemSelected}
                     >
                       <TableCell padding="checkbox">
@@ -290,11 +290,11 @@ export default function ClientTable() {
                         scope="row"
                         padding="none"
                       >
-                        Unidade - {row.clientCode}
+                        Client - {row.client_id}
                       </TableCell>
                       <TableCell align="left">{row.name}</TableCell>
-                      <TableCell align="left">{row.unity}button</TableCell>
+                      <TableCell align="left">clique aqui para ver as unidades</TableCell>
-                      <TableCell align="left"><StyledStatus status={row.status}>{row.status}</StyledStatus></TableCell>
+                      <TableCell align="left"><StyledStatus status={row.deleted_at? 'inativo' : 'ativo'}> {row.deleted_at? 'inativo' : 'ativo'}</StyledStatus></TableCell>
                     </TableRow>
                   );
                 })}

src/pages/administrative/clients.tsx

@@ -18,6 +18,9 @@ import PageTitle from '../../components/pageTitle/PageTitle';
 import ConfirmModal from '../../components/modal/ConfirmModal';
 import { ConfirmModalView } from '../../styles/layouts/modals/confirmModalView';
 import { api } from '../../services/api';
+import { parseCookies } from 'nookies';
+import { GetServerSideProps } from 'next';
+import getAPIClient from '../../services/ssrApi';
 
 const style = {
   position: 'absolute' as const,
@@ -33,8 +36,8 @@ const style = {
   overflowY: 'scroll'
 };
 
-export default function clients() {
+export default function clients({clients}) {
-  const [client, setClient] = useState({
+  const [client, setClient] = useState<any>({
     name: String,
     email: String,
     password: String,
@@ -50,7 +53,7 @@ export default function clients() {
   const [openModal, setOpenModal] = useState(false)
 
   function handleCreateClient({name, email, password, password_confirmation, client_id}) {
-    api.post('', {
+    api.post('/user', {
       name,
       email,
       password,
@@ -79,19 +82,44 @@ export default function clients() {
           <Typography sx={{color:'gray', fontSize:12}}variant="h5" gutterBottom component="div">
           Adicionar Cliente Smart Energia</Typography>
           <br />
-          <TextField id="outlined-basic" label="Nome" sx={{width:350, ml:5}} variant="outlined" />
+          <TextField id="outlined-basic" label="Nome" sx={{width:350, ml:5}} onChange={(value) => {
-          <TextField id="outlined-basic" label="E-mail/Usuário" sx={{width:350, ml:8}} variant="outlined" />
+            setClient({
-          <TextField id="outlined-basic" label="Senha" sx={{width:350, ml:5, mt:2}} variant="outlined" />
+              ...client,
-          <TextField id="outlined-basic" label="Confirma Senha" sx={{width:350, ml:8, mt:2}} variant="outlined" />
+              name: value.target.value
-          <TextField id="outlined-basic" label="Codigo do Cliente Smart Energia" sx={{width:350, ml:5, mt:2}} variant="outlined" />
+            })
+          }} variant="outlined" />
+          <TextField id="outlined-basic" label="E-mail/Usuário" sx={{width:350, ml:8}} onChange={(value) => {
+            setClient({
+              ...client,
+              email: value.target.value
+            })
+          }} variant="outlined" />
+          <TextField id="outlined-basic" label="Senha" sx={{width:350, ml:5, mt:2}} onChange={(value) => {
+            setClient({
+              ...client,
+              password: value.target.value
+            })
+          }} variant="outlined" />
+          <TextField id="outlined-basic" label="Confirma Senha" sx={{width:350, ml:8, mt:2}} onChange={(value) => {
+            setClient({
+              ...client,
+              password_confirmation: value.target.value
+            })
+          }} variant="outlined" />
+          <TextField id="outlined-basic" label="Codigo do Cliente Smart Energia" sx={{width:350, ml:5, mt:2}} onChange={(value) => {
+            setClient({
+              ...client,
+              client_id: value.target.value
+            })
+          }} variant="outlined" />
           <InputUpload />
           <br /><br />
         <FaqButton1  title='Cancelar' onClick={() => console.log()} />
-        <FaqButton2  title='Salvar' onClick={()=>console.log()}/>
+        <FaqButton2  title='Salvar' onClick={() => handleCreateClient(client)}/>
         </Box>
         </Modal>
         <section>
-          <ClientsTable />
+          <ClientsTable clients={clients}/>
         </section>
       </ClientsView>
 
@@ -104,3 +132,32 @@ export default function clients() {
     </div>
   )
 }
+
+export const getServerSideProps: GetServerSideProps = async (ctx) => {
+  const apiClient = getAPIClient(ctx)
+  const { ['@smartAuth-token']: token } = parseCookies(ctx)
+
+  let clients = [];
+
+  await apiClient.get('/user').then(res => {
+    clients = res.data
+  }).catch(res => {
+    console.log(res)
+  })
+
+  if (!token) {
+    return {
+      redirect: {
+        destination: '/',
+        permanent: false
+      }
+    }
+  }
+
+  return {
+    props: {
+      clients,
+    }
+  }
+}
+