329 lines
8.7 KiB
Svelte
329 lines
8.7 KiB
Svelte
<script lang="ts">
|
|
import { enhance } from '$app/forms';
|
|
import { configFile, type EventConfig } from '$models/config';
|
|
import type { Track } from '$models/lookups';
|
|
|
|
const { config, tracks, id }: { config: EventConfig; tracks: Track[]; id: string } = $props();
|
|
const editedConfig = $state({ ...config });
|
|
if (!editedConfig.sessions) editedConfig.sessions = [];
|
|
let formLoading = $state(false);
|
|
let restart = $state(true);
|
|
</script>
|
|
|
|
<form
|
|
method="POST"
|
|
action="?/update"
|
|
use:enhance={() => {
|
|
formLoading = true;
|
|
return async ({ update }) => {
|
|
await update({ invalidateAll: true, reset: false });
|
|
formLoading = false;
|
|
};
|
|
}}
|
|
class="max-w-3xl space-y-6"
|
|
>
|
|
<input type="hidden" name="id" value={id} />
|
|
<input type="hidden" name="file" value={configFile.event} />
|
|
<div class="grid grid-cols-1 gap-6 md:grid-cols-2">
|
|
<div>
|
|
<label class="mb-1 block text-sm font-medium text-gray-300">
|
|
Track:
|
|
<select
|
|
bind:value={editedConfig.track}
|
|
disabled={formLoading}
|
|
name="track"
|
|
class="form form-select"
|
|
>
|
|
{#each tracks as track}
|
|
<option value={track.track}>{track.track}</option>
|
|
{/each}
|
|
</select>
|
|
</label>
|
|
</div>
|
|
<div>
|
|
<label class="mb-1 block text-sm font-medium text-gray-300">
|
|
Pre-Race waiting time seconds:
|
|
<input
|
|
disabled={formLoading}
|
|
name="preRaceWaitingTimeSeconds"
|
|
type="number"
|
|
class="form form-input"
|
|
bind:value={editedConfig.preRaceWaitingTimeSeconds}
|
|
/>
|
|
</label>
|
|
</div>
|
|
<div>
|
|
<label class="mb-1 block text-sm font-medium text-gray-300">
|
|
Session over time seconds:
|
|
<input
|
|
disabled={formLoading}
|
|
name="sessionOverTimeSeconds"
|
|
type="number"
|
|
class="form form-input"
|
|
bind:value={editedConfig.sessionOverTimeSeconds}
|
|
/>
|
|
</label>
|
|
</div>
|
|
<div>
|
|
<label class="mb-1 block text-sm font-medium text-gray-300">
|
|
Ambient temp:
|
|
<input
|
|
disabled={formLoading}
|
|
name="ambientTemp"
|
|
type="number"
|
|
class="form form-input"
|
|
bind:value={editedConfig.ambientTemp}
|
|
/>
|
|
</label>
|
|
</div>
|
|
<div>
|
|
<label class="mb-1 block text-sm font-medium text-gray-300">
|
|
Cloud level:
|
|
<input
|
|
disabled={formLoading}
|
|
name="cloudLevel"
|
|
type="number"
|
|
class="form form-input"
|
|
bind:value={editedConfig.cloudLevel}
|
|
step=".01"
|
|
/>
|
|
</label>
|
|
</div>
|
|
<div>
|
|
<label class="mb-1 block text-sm font-medium text-gray-300">
|
|
Rain:
|
|
<input
|
|
disabled={formLoading}
|
|
name="rain"
|
|
type="number"
|
|
class="form form-input"
|
|
bind:value={editedConfig.rain}
|
|
step=".01"
|
|
/>
|
|
</label>
|
|
</div>
|
|
<div>
|
|
<label class="mb-1 block text-sm font-medium text-gray-300">
|
|
Weather randomness:
|
|
<input
|
|
disabled={formLoading}
|
|
name="weatherRandomness"
|
|
type="number"
|
|
class="form form-input"
|
|
bind:value={editedConfig.weatherRandomness}
|
|
/>
|
|
</label>
|
|
</div>
|
|
<div>
|
|
<label class="mb-1 block text-sm font-medium text-gray-300">
|
|
Post-Qualy seconds:
|
|
<input
|
|
disabled={formLoading}
|
|
name="postQualySeconds"
|
|
type="number"
|
|
class="form form-input"
|
|
bind:value={editedConfig.postQualySeconds}
|
|
/>
|
|
</label>
|
|
</div>
|
|
<div>
|
|
<label class="mb-1 block text-sm font-medium text-gray-300">
|
|
Post-Race seconds:
|
|
<input
|
|
disabled={formLoading}
|
|
name="postRaceSeconds"
|
|
type="number"
|
|
class="form form-input"
|
|
bind:value={editedConfig.postRaceSeconds}
|
|
/>
|
|
</label>
|
|
</div>
|
|
<div>
|
|
<label class="mb-1 block text-sm font-medium text-gray-300">
|
|
Simracer weather conditions:
|
|
<input
|
|
disabled={formLoading}
|
|
name="simracerWeatherConditions"
|
|
type="number"
|
|
class="form form-input"
|
|
bind:value={editedConfig.simracerWeatherConditions}
|
|
/>
|
|
</label>
|
|
</div>
|
|
<div>
|
|
<label class="mb-1 block text-sm font-medium text-gray-300">
|
|
Is fixed condition qualification:
|
|
<select
|
|
bind:value={editedConfig.isFixedConditionQualification}
|
|
disabled={formLoading}
|
|
name="isFixedConditionQualification"
|
|
class="form form-select"
|
|
>
|
|
<option value={0}>No</option>
|
|
<option value={1}>Yes</option>
|
|
</select>
|
|
</label>
|
|
</div>
|
|
<div />
|
|
<div>
|
|
<label class="mb-1 block text-sm font-medium text-gray-300">
|
|
Sessions:
|
|
<div class="mt-2 space-y-4">
|
|
{#each editedConfig.sessions as session, index}
|
|
<div class="mb-4 rounded-lg border border-gray-700 bg-gray-800 p-4">
|
|
<div class="grid grid-cols-1 gap-4 md:grid-cols-2">
|
|
<!-- Hour of Day -->
|
|
<div>
|
|
<label class="mb-1 block text-sm font-medium text-gray-300"
|
|
>Hour of Day:
|
|
<input
|
|
bind:value={session.hourOfDay}
|
|
name={`sessions[${index}].hourOfDay`}
|
|
disabled={formLoading}
|
|
type="number"
|
|
class="form form-input"
|
|
/>
|
|
</label>
|
|
</div>
|
|
<!-- Day of Weekend -->
|
|
<div>
|
|
<label class="mb-1 block text-sm font-medium text-gray-300">
|
|
Day of Weekend:
|
|
<input
|
|
bind:value={session.dayOfWeekend}
|
|
name={`sessions[${index}].dayOfWeekend`}
|
|
disabled={formLoading}
|
|
type="number"
|
|
class="form form-input"
|
|
/>
|
|
</label>
|
|
</div>
|
|
<!-- Time Multiplier -->
|
|
<div>
|
|
<label class="mb-1 block text-sm font-medium text-gray-300">
|
|
Time Multiplier:
|
|
<input
|
|
bind:value={session.timeMultiplier}
|
|
name={`sessions[${index}].timeMultiplier`}
|
|
disabled={formLoading}
|
|
type="number"
|
|
class="form form-input"
|
|
/>
|
|
</label>
|
|
</div>
|
|
<!-- Session Type -->
|
|
<div>
|
|
<label class="mb-1 block text-sm font-medium text-gray-300">
|
|
Session Type:
|
|
<select
|
|
bind:value={session.sessionType}
|
|
name={`sessions[${index}].sessionType`}
|
|
disabled={formLoading}
|
|
class="form form-select"
|
|
>
|
|
<option value="P">Practice</option>
|
|
<option value="Q">Qualifying</option>
|
|
<option value="R">Race</option>
|
|
</select>
|
|
</label>
|
|
</div>
|
|
<!-- Session Duration Minutes -->
|
|
<div>
|
|
<label class="mb-1 block text-sm font-medium text-gray-300">
|
|
Session Duration (Minutes):
|
|
<input
|
|
bind:value={session.sessionDurationMinutes}
|
|
name={`sessions[${index}].sessionDurationMinutes`}
|
|
disabled={formLoading}
|
|
type="number"
|
|
class="form form-input"
|
|
/>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<button
|
|
type="button"
|
|
onclick={() => {
|
|
editedConfig.sessions = editedConfig.sessions.filter((_, i) => i !== index);
|
|
}}
|
|
class="mt-4 flex items-center rounded-md bg-red-600 px-3 py-1 text-xs font-medium text-white hover:bg-red-700"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="mr-1 h-4 w-4"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
stroke-width="2"
|
|
d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"
|
|
/>
|
|
</svg>
|
|
Remove Session
|
|
</button>
|
|
</div>
|
|
{/each}
|
|
<button
|
|
type="button"
|
|
onclick={() => {
|
|
editedConfig.sessions = [
|
|
...editedConfig.sessions,
|
|
{
|
|
hourOfDay: 14,
|
|
dayOfWeekend: 1,
|
|
timeMultiplier: 1,
|
|
sessionType: 'Practice',
|
|
sessionDurationMinutes: 60
|
|
}
|
|
];
|
|
}}
|
|
class="flex items-center rounded-md bg-green-600 px-4 py-2 text-sm font-medium text-white hover:bg-green-700"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="mr-1 h-4 w-4"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
stroke-width="2"
|
|
d="M12 4v16m8-8H4"
|
|
/>
|
|
</svg>
|
|
Add Session
|
|
</button>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="border-t border-gray-700 pt-4">
|
|
<label class="flex items-center">
|
|
<input
|
|
type="checkbox"
|
|
name="restart"
|
|
bind:checked={restart}
|
|
class="h-4 w-4 rounded border-gray-600 bg-gray-700 text-green-600 focus:ring-green-500"
|
|
/>
|
|
<span class="ml-2 text-sm text-gray-300">Restart server after saving</span>
|
|
</label>
|
|
</div>
|
|
|
|
<div class="flex justify-end">
|
|
<button
|
|
type="submit"
|
|
disabled={formLoading}
|
|
class="rounded-md bg-green-600 px-4 py-2 text-sm font-medium hover:bg-green-700"
|
|
>
|
|
Save Changes
|
|
</button>
|
|
</div>
|
|
</form>
|
|
|
|
<style></style>
|