2
0
forked from jmug/cactoide

fix: location missing field error

This commit is contained in:
Levente Orban
2025-09-25 09:28:44 +02:00
parent d2024d31ba
commit 26824eb3a8
12 changed files with 161 additions and 117 deletions

View File

@@ -12,7 +12,7 @@
date: data.event.date,
time: data.event.time,
location: data.event.location,
location_type: data.event.locationType || 'text',
location_type: data.event.locationType || 'none',
location_url: data.event.locationUrl || '',
type: data.event.type,
attendee_limit: data.event.attendeeLimit,
@@ -53,7 +53,10 @@
const handleLocationTypeChange = (locationType: LocationType) => {
eventData.location_type = locationType;
if (locationType === 'text') {
if (locationType === 'none') {
eventData.location = '';
eventData.location_url = '';
} else if (locationType === 'text') {
eventData.location_url = '';
eventData.location = '';
} else {
@@ -73,7 +76,7 @@
<div class="flex min-h-screen flex-col">
<!-- Main Content -->
<div class="container mx-auto flex-1 px-4 py-8">
<div class="mx-auto max-w-md">
<div class="mx-auto max-w-2xl">
<!-- Event Edit Form -->
<div class="rounded-sm border p-8">
<div class="mb-8 text-center">
@@ -169,7 +172,17 @@
{t('create.locationTypeLabel')}
<span class="text-red-400">{t('common.required')}</span>
</legend>
<div class="grid grid-cols-2 gap-3">
<div class="grid grid-cols-3 gap-3">
<button
type="button"
class="rounded-sm border-2 px-4 py-3 font-medium transition-all duration-200 {eventData.location_type ===
'none'
? ' border-violet-500 bg-violet-400/20 font-semibold hover:bg-violet-400/70'
: 'border-dark-300 text-dark-700'}"
on:click={() => handleLocationTypeChange('none')}
>
{t('create.locationNoneOption')}
</button>
<button
type="button"
class="rounded-sm border-2 px-4 py-3 font-medium transition-all duration-200 {eventData.location_type ===
@@ -192,51 +205,55 @@
</button>
</div>
<p class="mt-2 text-xs text-slate-400">
{eventData.location_type === 'text'
? t('create.locationTextDescription')
: t('create.locationMapsDescription')}
{eventData.location_type === 'none'
? t('create.locationNoneDescription')
: eventData.location_type === 'text'
? t('create.locationTextDescription')
: t('create.locationMapsDescription')}
</p>
</fieldset>
</div>
<!-- Location Input -->
<div>
<label for="location" class="text-dark-800 mb-3 block text-sm font-semibold">
{eventData.location_type === 'text'
? t('create.locationTypeLabel')
: t('create.googleMapsUrlLabel')}
<span class="text-red-400">{t('common.required')}</span>
</label>
{#if eventData.location_type === 'text'}
<input
id="location"
name="location"
type="text"
bind:value={eventData.location}
class="border-dark-300 placeholder-dark-500 w-full rounded-sm border-2 px-4 py-3 text-slate-900 shadow-sm transition-all"
placeholder={t('create.locationPlaceholder')}
maxlength="200"
required
/>
{:else}
<input
id="location_url"
name="location_url"
type="url"
bind:value={eventData.location_url}
class="border-dark-300 placeholder-dark-500 w-full rounded-sm border-2 px-4 py-3 text-slate-900 shadow-sm transition-all"
placeholder={t('create.googleMapsUrlPlaceholder')}
maxlength="500"
required
/>
{/if}
{#if errors.location}
<p class="mt-2 text-sm font-medium text-red-600">{errors.location}</p>
{/if}
{#if errors.location_url}
<p class="mt-2 text-sm font-medium text-red-600">{errors.location_url}</p>
{/if}
</div>
<!-- Location Input (only show when not 'none') -->
{#if eventData.location_type !== 'none'}
<div>
<label for="location" class="text-dark-800 mb-3 block text-sm font-semibold">
{eventData.location_type === 'text'
? t('create.locationLabel')
: t('create.googleMapsUrlLabel')}
<span class="text-red-400">{t('common.required')}</span>
</label>
{#if eventData.location_type === 'text'}
<input
id="location"
name="location"
type="text"
bind:value={eventData.location}
class="border-dark-300 placeholder-dark-500 w-full rounded-sm border-2 px-4 py-3 text-slate-900 shadow-sm transition-all"
placeholder={t('create.locationPlaceholder')}
maxlength="200"
required
/>
{:else}
<input
id="location_url"
name="location_url"
type="url"
bind:value={eventData.location_url}
class="border-dark-300 placeholder-dark-500 w-full rounded-sm border-2 px-4 py-3 text-slate-900 shadow-sm transition-all"
placeholder={t('create.googleMapsUrlPlaceholder')}
maxlength="500"
required
/>
{/if}
{#if errors.location}
<p class="mt-2 text-sm font-medium text-red-600">{errors.location}</p>
{/if}
{#if errors.location_url}
<p class="mt-2 text-sm font-medium text-red-600">{errors.location_url}</p>
{/if}
</div>
{/if}
<!-- Event Type -->
<div>