63 lines
2.3 KiB
Vue

<script setup lang="ts">
import Card from 'primevue/card';
import InputText from 'primevue/inputtext';
import Select from 'primevue/select';
import Textarea from 'primevue/textarea';
import type { FixedAssetAssignmentFormData } from '../../types/fixedAssetAssignment';
interface Props {
form: FixedAssetAssignmentFormData;
}
defineProps<Props>();
const conditionOptions = [
{ label: 'Excelente', value: 'Excelente' },
{ label: 'Bueno', value: 'Bueno' },
{ label: 'Regular', value: 'Regular' }
];
</script>
<template>
<Card class="shadow-sm">
<template #title>
<div class="flex items-center gap-2 text-xl">
<i class="pi pi-clipboard text-primary"></i>
<span>Detalles de la Asignacion</span>
</div>
</template>
<template #content>
<div class="grid grid-cols-1 gap-4 md:grid-cols-2">
<div class="space-y-2">
<label class="text-sm font-semibold text-surface-800 dark:text-surface-100">Fecha de Entrega</label>
<InputText
v-model="form.deliveredAt"
type="date"
class="w-full"
/>
</div>
<div class="space-y-2">
<label class="text-sm font-semibold text-surface-800 dark:text-surface-100">Condicion del Activo</label>
<Select
v-model="form.condition"
:options="conditionOptions"
optionLabel="label"
optionValue="value"
class="w-full"
/>
</div>
<div class="space-y-2 md:col-span-2">
<label class="text-sm font-semibold text-surface-800 dark:text-surface-100">Notas o Comentarios (Opcional)</label>
<Textarea
v-model="form.notes"
rows="4"
class="w-full"
autoResize
placeholder="Anade detalles relevantes sobre el estado de entrega o terminos especificos..."
/>
</div>
</div>
</template>
</Card>
</template>