implementado defectos

Front/src/Componentes/FormAltaDefecto.svelte

@@ -0,0 +1,94 @@
+<script lang="ts">
+    import { onMount } from "svelte";
+    import type { AltaDefectoDto } from "../types";
+    let { idcontrato, onConfirm 
+    } : {
+         idcontrato: number, onConfirm:(data: AltaDefectoDto)=>void} = $props();
+    
+    let formData: AltaDefectoDto = $state({
+        descripcion:"",
+        costo:0, 
+        idcontrato:idcontrato,
+        iddivisa:0, 
+        pagainquilino:0
+    });
+    async function handle(e:Event){
+        e.preventDefault();
+        onConfirm(formData);
+    }
+    let n:number = $state(0);
+    $effect(()=> {n = formData.descripcion.length});
+</script>
+
+<div class="container">
+  <form>
+    <div class="mb-3">
+      <label for="descripcion" class="form-label">Descripción</label>
+      <input
+        type="text"
+        id="descripcion"
+        class="form-control"
+        bind:value={formData.descripcion}
+        placeholder="Ingrese la descripción"
+        required
+        maxlength="100"
+      />
+      <small class="form-text text-muted">
+        {n}/100
+      </small>
+    </div>
+
+
+    <div class="mb-3 input-group">
+        <span class="input-group-text">$</span>
+        <input
+            type="number"
+            id="costo"
+            class="form-control"
+            bind:value={formData.costo}
+            placeholder="Ingrese el costo"
+            step="0.01"
+            required
+        />
+    </div>
+
+    <div class="mb-3">
+        <div class="form-check">
+          <input
+            type="radio"
+            id="danioUso"
+            class="form-check-input"
+            bind:group={formData.pagainquilino}
+            value="0"
+            required
+          />
+          <label for="danioUso" class="form-check-label">Daño por uso</label>
+        </div>
+        <div class="form-check">
+          <input
+            type="radio"
+            id="danioEstructural"
+            class="form-check-input"
+            bind:group={formData.pagainquilino}
+            value="1"
+          />
+          <label for="danioEstructural" class="form-check-label">Daño Estructural</label>
+        </div>
+      </div>
+
+    <div class="mb-3">
+      <label for="iddivisa" class="form-label">Divisa</label>
+      <select
+        id="iddivisa"
+        class="form-select"
+        bind:value={formData.iddivisa}
+        required
+      >
+        <option value="0">ARS</option>
+        <option value="1">USD</option>
+      </select>
+    </div>
+
+    <button type="submit" class="btn btn-primary" onclick={(e)=> handle(e)}>Subir</button>
+  </form>
+</div>