ADUANASOFT/plantillas-proyectos
13
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Enhance port creation/edit dialog and general catalog search inputs with maxlength constraints and improved placeholders. Update labels for clarity in the UI.

Browse Source
This commit is contained in:
AlexeerCT
2026-04-24 18:43:27 -05:00
parent 4d76795176
commit 0da4770013
2 changed files with 50 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
frontend/src/lib/components/dashboard/ports/create-edit-dialog.svelte
View File

@@ -28,6 +28,11 @@
const isEdit = $derived(mode === 'edit' || !!item);
const title = $derived(isEdit ? 'Editar Puerto' : 'Nuevo Puerto');
/** Alineado con `PortCreate` / columnas en backend (ports/dto.py, models.py) */
const MAX_PORT_CODE = 6;
const MAX_LOCATION_CODE = 4;
const MAX_DESCRIPTION = 20;
// Atajos
let formData = $state({
@@ -115,6 +120,11 @@
loading = false;
}
}
function handleCancel() {
if (loading) return;
open = false;
}
</script>
<Dialog.Root bind:open>
@@ -134,16 +144,24 @@
id="port_code"
bind:value={formData.port_code}
class="col-span-3"
maxlength={MAX_PORT_CODE}
placeholder={`Máx. ${MAX_PORT_CODE} caracteres`}
autocomplete="off"
spellcheck={false}
disabled={loading}
/>
</div>
<div class="grid grid-cols-4 items-center gap-4">
<Label for="description" class="text-right">Descripción</Label>
<Label for="description" class="text-right">Descripción Puerto</Label>
<Input
id="description"
bind:value={formData.description}
class="col-span-3"
maxlength={MAX_DESCRIPTION}
placeholder={`Máx. ${MAX_DESCRIPTION} caracteres`}
autocomplete="off"
spellcheck={false}
disabled={loading}
/>
</div>
@@ -154,16 +172,24 @@
id="location_code"
bind:value={formData.location_code}
class="col-span-3"
maxlength={MAX_LOCATION_CODE}
placeholder={`Máx. ${MAX_LOCATION_CODE} caracteres`}
autocomplete="off"
spellcheck={false}
disabled={loading}
/>
</div>
<div class="grid grid-cols-4 items-center gap-4">
<Label for="location_description" class="text-right">Ubicación</Label>
<Label for="location_description" class="text-right">Descripción Ubicación</Label>
<Input
id="location_description"
bind:value={formData.location_description}
class="col-span-3"
maxlength={MAX_DESCRIPTION}
placeholder={`Máx. ${MAX_DESCRIPTION} caracteres`}
autocomplete="off"
spellcheck={false}
disabled={loading}
/>
</div>
@@ -192,7 +218,10 @@
</div>
<Dialog.Footer>
<Button type="submit" onclick={handleSubmit} disabled={loading}>
<Button type="button" variant="outline" onclick={handleCancel} disabled={loading}>
Cancelar
</Button>
<Button type="button" onclick={handleSubmit} disabled={loading}>
{loading ? 'Guardando...' : 'Guardar'}
</Button>
</Dialog.Footer>

20
frontend/src/routes/dashboard/general_catalogs/ports/+page.svelte
View File

@@ -231,8 +231,24 @@
<div class="flex flex-wrap items-center justify-between gap-3">
<Card.Title>Listado de Puertos</Card.Title>
<div class="flex flex-wrap items-center gap-2">
<Input placeholder="Código" bind:value={searchCode} oninput={handleSearch} class="h-9 w-36 bg-card lg:w-44" />
<Input placeholder="Descripción" bind:value={searchDesc} oninput={handleSearch} class="h-9 w-44 bg-card lg:w-64" />
<Input
placeholder="Código (máx. 6)"
bind:value={searchCode}
maxlength={6}
autocomplete="off"
spellcheck={false}
oninput={handleSearch}
class="h-9 w-36 bg-card lg:w-44"
/>
<Input
placeholder="Descripción (máx. 20)"
bind:value={searchDesc}
maxlength={20}
autocomplete="off"
spellcheck={false}
oninput={handleSearch}
class="h-9 w-44 bg-card lg:w-64"
/>
</div>
</div>
</Card.Header>