feat: terminado primer test del form crear inquilino

Signed-off-by: fede <federico.nicolas.polidoro@gmail.com>

Front/src/App.svelte

@@ -12,6 +12,9 @@
   <Route path="/" component={Login} />
   <Route path="/Info" component={InfoPage} />
 
+  <Route path="/inqtest" component={InqPage} />
+
+
   <Route path="/Menu">
      <ProteRoute component={MenuPage} />
   </Route>

Front/src/Inquilinos/page.svelte

@@ -0,0 +1,15 @@
+<script lang="ts">
+    import { Col } from "@sveltestrap/sveltestrap";
+    import FormPostInq from "../lib/FormPostCli.svelte";
+    import NavBarAutocompletable from "../lib/NavBarAutocompletable.svelte";
+</script>
+
+<NavBarAutocompletable/>
+
+<div class="container">
+    <div class="row align-items-start">
+        <div class="col">
+            <FormPostInq url="http://127.0.0.1:5007/api/inquilino"/>
+        </div>
+    </div>
+</div>

Front/src/lib/FormPostCli.svelte

@@ -0,0 +1,70 @@
+<script lang="ts">
+    import { Form, FormGroup, Input, Button} from "@sveltestrap/sveltestrap";
+
+    export let url: string
+
+    let showAlert: boolean = false;
+    let errorMessage: string
+
+    let dni: number
+    let email: string
+    let contraseña: string
+    let nombre: string 
+    let apellido: string
+    let domicilio: string 
+    let celular: string 
+
+    async function submitForm(event: any) {
+        event.preventDefault();
+        try {
+            let response = await fetch(url, {
+                method: 'POST',
+                headers: {
+                    'Content-Type' : 'application/json',
+                },
+                body: JSON.stringify({dni, nombre, apellido, domicilio, celular, email, contraseña})
+            });
+            if (!response.ok) {
+                const errorData = await response.json();
+                errorMessage = errorData.message;
+                showAlert = true;
+            }
+        } catch (e) {
+            throw new Error("Fallo al enviar el formulario para crear un inquilino");
+        }
+    }
+</script>
+
+<Form on:submit={submitForm}>
+    <FormGroup floating label="Dni">
+        <Input type="number" min='1' bind:value={dni} required />
+    </FormGroup>
+    <FormGroup floating label="Email">
+        <Input type="email" placeholder="ejemplo@mail.com" bind:value={email} required />
+    </FormGroup>
+    <FormGroup floating label="Contraseña">
+        <Input type="password" placeholder="*********" bind:value={contraseña} required />
+    </FormGroup>     
+    <FormGroup floating label="Nombre">
+        <Input type="text" bind:value={nombre} required />
+    </FormGroup>
+    <FormGroup floating label="Apellido">
+        <Input type="text" bind:value={apellido} required />
+    </FormGroup>
+    <FormGroup floating label="Domicilio">
+        <Input type="text" bind:value={domicilio} required />
+    </FormGroup>
+    <FormGroup floating label="Celular">
+        <Input type="tel" bind:value={celular} required />
+    </FormGroup>
+    <br>
+    <FormGroup>
+        <Button color="primary" type="submit">Ingresar</Button>
+    </FormGroup>
+</Form>
+{#if showAlert}
+<div class='alert alert-warning alert-dismissible fade show' role='alert'>
+    <strong>{errorMessage}</strong> 
+    <button type="button" class="btn-close close" aria-label="Close" data-bs-dismiss="alert"></button>
+</div>
+{/if}

Front/src/lib/login.svelte

@@ -7,6 +7,7 @@
   let errorMessage = ""
   let showAlert = false; 
   
+  // @ts-ignore
   async function submitForm(event) {
     event.preventDefault();
     
@@ -40,17 +41,17 @@
 
 </script>
 
-<Card class="position-sticky top-50 start-50 translate-middle-x" style="width: 18rem; height: auto;" theme="auto" color="dark" outline>
+<Card class="position-sticky top-50 start-50 translate-middle-x" style="width: 20rem; height: auto;" theme="auto" color="dark" outline>
   <CardHeader>
     <CardTitle>Iniciar Sesión</CardTitle>
   </CardHeader>
   <CardBody>
     <Form on:submit={submitForm}>
       <FormGroup floating label="Email">
-        <Input type="email" placeholder="ejemplo@mail.com" bind:value={email}/>
+        <Input type="email" placeholder="ejemplo@mail.com" bind:value={email} required/>
       </FormGroup>
       <FormGroup floating label="Contraseña">
-        <Input type="password" placeholder="*********" bind:value={contraseña}/>
+        <Input type="password" placeholder="*********" bind:value={contraseña} required/>
       </FormGroup>     
       <FormGroup>
         <Button color="primary" type="submit">Ingresar</Button>
@@ -59,7 +60,7 @@
 {#if errorMessage}
     <div class='alert alert-warning alert-dismissible fade show' role='alert'>
       <strong>{errorMessage}</strong> 
-      <button type="button" class="btn-close close" aria-label="Close" data-dismiss="alert"></button>
+      <button type="button" class="btn-close close" aria-label="Close" data-bs-dismiss="alert"></button>
     </div>
 {/if}
   </CardBody>