meobda-website/resources/views/admin/audition_etude/create.blade.php

98 lines
4.9 KiB
PHP

<x-layout.admin>
<x-card class="max-w-xl mx-auto">
<x-slot:header class="bg-brand-600!">New Etude</x-slot:header>
<x-slot:body class="bg-white border border-brand-600">
@if($errors->any())
<div class="mb-4 rounded-md bg-red-50 p-4 dark:bg-red-900/20">
<div class="flex">
<div class="shrink-0">
<svg class="size-5 text-red-400" viewBox="0 0 20 20" fill="currentColor">
<path fill-rule="evenodd"
d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.28 7.22a.75.75 0 00-1.06 1.06L8.94 10l-1.72 1.72a.75.75 0 101.06 1.06L10 11.06l1.72 1.72a.75.75 0 101.06-1.06L11.06 10l1.72-1.72a.75.75 0 00-1.06-1.06L10 8.94 8.28 7.22z"
clip-rule="evenodd"/>
</svg>
</div>
<div class="ml-3">
<h3 class="text-sm font-medium text-red-800 dark:text-red-200">There
were {{ $errors->count() }} error(s) with your submission</h3>
<div class="mt-2 text-sm text-red-700 dark:text-red-300">
<ul class="list-disc space-y-1 pl-5">
@foreach($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
</div>
</div>
</div>
</div>
@endif
<x-form.form method="POST" action="{{ route('admin.etudes.store') }}" enctype="multipart/form-data"
x-data="{ selectedEnsemble: '', selectedInstrument: '', selectedSetNumber: '' }">
<div>
<x-form.select name="auditioned_ensemble_id" x-model="selectedEnsemble">
<x-slot:label>Ensemble</x-slot:label>
<option value="">Select Ensemble...</option>
@foreach($ensembles as $ensemble)
<option
value="{{ $ensemble->id }}"
{{ old('auditioned_ensemble_id') == $ensemble->id ? ' SELECTED ':'' }}
{{ session('previous_auditioned_ensemble_id') == $ensemble->id ? ' SELECTED ':'' }}
>
{{ $ensemble->name }}
</option>
@endforeach
</x-form.select>
</div>
<div class="mt-3">
<x-form.select name="instrument_id" x-model="selectedInstrument">
<option value="">Select Instrument...</option>
<x-slot:label>Instrument</x-slot:label>
@foreach($instruments as $instrument)
<option
value="{{ $instrument->id }}"
{{ old('instrument_id') === $instrument->id ? ' SELECTED ':'' }}
{{ session('previous_instrument_id') === $instrument->id ? ' SELECTED ':'' }}
>
{{ $instrument->instrument }}
</option>
@endforeach
</x-form.select>
</div>
<div class="mt-3">
<x-form.input name="set" label="Set Number"
:value="session('previous_set')"
type="number" min="1"
x-bind:max="selectedEnsemble ? getSetCount(selectedEnsemble) : ''"
x-bind:disabled="!selectedEnsemble" x-model="selectedSetNumber"/>
</div>
<div class="mt-3">
<x-form.input name="file_upload" type="file" label="Etude PDF"/>
</div>
<div class="mt-3 text-right">
<x-form.button type="submit"
x-bind:disabled="!selectedEnsemble || !selectedInstrument || !selectedSetNumber">Save
Etude
</x-form.button>
</div>
</x-form.form>
</x-slot:body>
</x-card>
<script>
let ensembles = {
@foreach($ensembles as $ensemble)
{{ $ensemble->id }}: {
id: {{ $ensemble->id }},
name: '{{ $ensemble->name }}',
setCount: {{ $ensemble->set_count }}
},
@endforeach
};
function getSetCount(ensembleId) {
// noinspection JSUnresolvedVariable
return ensembles[ensembleId]?.setCount || '';
}
</script>
</x-layout.admin>