fix: restore ServicesManagement.svelte component
This commit is contained in:
@@ -70,10 +70,6 @@
|
|||||||
return 'Duration must be greater than 0';
|
return 'Duration must be greater than 0';
|
||||||
}
|
}
|
||||||
|
|
||||||
if (field === 'patch_test_duration_hours' && value < 0) {
|
|
||||||
return 'Cannot be negative';
|
|
||||||
}
|
|
||||||
|
|
||||||
if (field === 'minimum_age_required' && (value < 0 || value > 100)) {
|
if (field === 'minimum_age_required' && (value < 0 || value > 100)) {
|
||||||
return 'Must be between 0 and 100';
|
return 'Must be between 0 and 100';
|
||||||
}
|
}
|
||||||
@@ -321,7 +317,6 @@
|
|||||||
</Card.Header>
|
</Card.Header>
|
||||||
|
|
||||||
<Card.Content class="space-y-4">
|
<Card.Content class="space-y-4">
|
||||||
<!-- Desktop Table -->
|
|
||||||
<div class="hidden w-full overflow-x-auto md:block">
|
<div class="hidden w-full overflow-x-auto md:block">
|
||||||
<table class="w-full table-auto border-collapse text-sm">
|
<table class="w-full table-auto border-collapse text-sm">
|
||||||
<thead>
|
<thead>
|
||||||
@@ -406,7 +401,6 @@
|
|||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Mobile Cards -->
|
|
||||||
<div class="space-y-4 md:hidden">
|
<div class="space-y-4 md:hidden">
|
||||||
{#if servicesLoading}
|
{#if servicesLoading}
|
||||||
{#each Array(3) as _, i (i)}
|
{#each Array(3) as _, i (i)}
|
||||||
@@ -492,7 +486,6 @@
|
|||||||
</Card.Content>
|
</Card.Content>
|
||||||
</Card.Root>
|
</Card.Root>
|
||||||
|
|
||||||
<!-- Add Service Modal -->
|
|
||||||
<Modal.Root bind:open={showServiceModal}>
|
<Modal.Root bind:open={showServiceModal}>
|
||||||
<Modal.Content class="max-h-[90vh] max-w-sm overflow-y-auto md:max-w-lg">
|
<Modal.Content class="max-h-[90vh] max-w-sm overflow-y-auto md:max-w-lg">
|
||||||
<Modal.Header>
|
<Modal.Header>
|
||||||
@@ -501,7 +494,6 @@
|
|||||||
</Modal.Header>
|
</Modal.Header>
|
||||||
|
|
||||||
<div class="space-y-4 px-4 pb-4">
|
<div class="space-y-4 px-4 pb-4">
|
||||||
<!-- Service Name -->
|
|
||||||
<div class="space-y-2">
|
<div class="space-y-2">
|
||||||
<label for="service-name" class="text-sm font-medium">Service Name *</label>
|
<label for="service-name" class="text-sm font-medium">Service Name *</label>
|
||||||
<Input
|
<Input
|
||||||
@@ -511,14 +503,13 @@
|
|||||||
placeholder="e.g., Haircut, Color, Blowdry"
|
placeholder="e.g., Haircut, Color, Blowdry"
|
||||||
bind:value={newService.name}
|
bind:value={newService.name}
|
||||||
onblur={validateNameField}
|
onblur={validateNameField}
|
||||||
class="w-full border-red-500={serviceErrors.name}"
|
class="w-full {serviceErrors.name ? 'border-red-500' : ''}"
|
||||||
/>
|
/>
|
||||||
{#if serviceErrors.name}
|
{#if serviceErrors.name}
|
||||||
<p class="text-sm text-red-600">{serviceErrors.name}</p>
|
<p class="text-sm text-red-600">{serviceErrors.name}</p>
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Description -->
|
|
||||||
<div class="space-y-2">
|
<div class="space-y-2">
|
||||||
<label for="service-description" class="text-sm font-medium">Description</label>
|
<label for="service-description" class="text-sm font-medium">Description</label>
|
||||||
<Input
|
<Input
|
||||||
@@ -530,9 +521,7 @@
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Price and Duration - Side by side on desktop -->
|
|
||||||
<div class="grid grid-cols-1 gap-4 md:grid-cols-2">
|
<div class="grid grid-cols-1 gap-4 md:grid-cols-2">
|
||||||
<!-- Price -->
|
|
||||||
<div class="space-y-2">
|
<div class="space-y-2">
|
||||||
<label for="service-price" class="text-sm font-medium">Price (£) *</label>
|
<label for="service-price" class="text-sm font-medium">Price (£) *</label>
|
||||||
<div class="relative">
|
<div class="relative">
|
||||||
@@ -545,7 +534,7 @@
|
|||||||
placeholder="0.00"
|
placeholder="0.00"
|
||||||
bind:value={newService.price}
|
bind:value={newService.price}
|
||||||
onblur={validatePriceField}
|
onblur={validatePriceField}
|
||||||
class="w-full pl-8 border-red-500={serviceErrors.price}"
|
class="w-full pl-8 {serviceErrors.price ? 'border-red-500' : ''}"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
{#if serviceErrors.price}
|
{#if serviceErrors.price}
|
||||||
@@ -553,7 +542,6 @@
|
|||||||
{/if}
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Duration -->
|
|
||||||
<div class="space-y-2">
|
<div class="space-y-2">
|
||||||
<label for="service-duration" class="text-sm font-medium">Duration (minutes) *</label>
|
<label for="service-duration" class="text-sm font-medium">Duration (minutes) *</label>
|
||||||
<Input
|
<Input
|
||||||
@@ -564,7 +552,7 @@
|
|||||||
placeholder="60"
|
placeholder="60"
|
||||||
bind:value={newService.duration_minutes}
|
bind:value={newService.duration_minutes}
|
||||||
onblur={validateDurationField}
|
onblur={validateDurationField}
|
||||||
class="w-full border-red-500={serviceErrors.duration_minutes}"
|
class="w-full {serviceErrors.duration_minutes ? 'border-red-500' : ''}"
|
||||||
/>
|
/>
|
||||||
{#if serviceErrors.duration_minutes}
|
{#if serviceErrors.duration_minutes}
|
||||||
<p class="text-sm text-red-600">{serviceErrors.duration_minutes}</p>
|
<p class="text-sm text-red-600">{serviceErrors.duration_minutes}</p>
|
||||||
@@ -572,9 +560,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Patch Test and Minimum Age - Side by side on desktop -->
|
|
||||||
<div class="grid grid-cols-1 gap-4 md:grid-cols-2">
|
<div class="grid grid-cols-1 gap-4 md:grid-cols-2">
|
||||||
<!-- Minimum Age -->
|
|
||||||
<div class="space-y-2">
|
<div class="space-y-2">
|
||||||
<label for="minimum-age" class="text-sm font-medium">Minimum Age</label>
|
<label for="minimum-age" class="text-sm font-medium">Minimum Age</label>
|
||||||
<Input
|
<Input
|
||||||
@@ -586,7 +572,7 @@
|
|||||||
placeholder="0"
|
placeholder="0"
|
||||||
bind:value={newService.minimum_age_required}
|
bind:value={newService.minimum_age_required}
|
||||||
onblur={validateMinimumAgeField}
|
onblur={validateMinimumAgeField}
|
||||||
class="w-full border-red-500={serviceErrors.minimum_age_required}"
|
class="w-full {serviceErrors.minimum_age_required ? 'border-red-500' : ''}"
|
||||||
/>
|
/>
|
||||||
{#if serviceErrors.minimum_age_required}
|
{#if serviceErrors.minimum_age_required}
|
||||||
<p class="text-sm text-red-600">{serviceErrors.minimum_age_required}</p>
|
<p class="text-sm text-red-600">{serviceErrors.minimum_age_required}</p>
|
||||||
|
|||||||
Reference in New Issue
Block a user