Add create form.
This commit is contained in:
parent
5ccc48c4c3
commit
39a598c67b
|
|
@ -5,7 +5,8 @@
|
|||
"packages": {
|
||||
"": {
|
||||
"dependencies": {
|
||||
"@tailwindplus/elements": "^1.0.20"
|
||||
"@tailwindplus/elements": "^1.0.20",
|
||||
"alpinejs": "^3.15.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@tailwindcss/vite": "^4.0.0",
|
||||
|
|
@ -1101,6 +1102,30 @@
|
|||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@vue/reactivity": {
|
||||
"version": "3.1.5",
|
||||
"resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.1.5.tgz",
|
||||
"integrity": "sha512-1tdfLmNjWG6t/CsPldh+foumYFo3cpyCHgBYQ34ylaMsJ+SNHQ1kApMIa8jN+i593zQuaw3AdWH0nJTARzCFhg==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@vue/shared": "3.1.5"
|
||||
}
|
||||
},
|
||||
"node_modules/@vue/shared": {
|
||||
"version": "3.1.5",
|
||||
"resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.1.5.tgz",
|
||||
"integrity": "sha512-oJ4F3TnvpXaQwZJNF3ZK+kLPHKarDmJjJ6jyzVNDKH9md1dptjC7lWR//jrGuLdek/U6iltWxqAnYOu8gCiOvA==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/alpinejs": {
|
||||
"version": "3.15.3",
|
||||
"resolved": "https://registry.npmjs.org/alpinejs/-/alpinejs-3.15.3.tgz",
|
||||
"integrity": "sha512-fSI6F5213FdpMC4IWaup92KhuH3jBX0VVqajRJ6cOTCy1cL6888KyXdGO+seAAkn+g6fnrxBqQEx6gRpQ5EZoQ==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@vue/reactivity": "~3.1.1"
|
||||
}
|
||||
},
|
||||
"node_modules/ansi-regex": {
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
|
||||
|
|
|
|||
|
|
@ -15,6 +15,7 @@
|
|||
"vite": "^7.0.7"
|
||||
},
|
||||
"dependencies": {
|
||||
"@tailwindplus/elements": "^1.0.20"
|
||||
"@tailwindplus/elements": "^1.0.20",
|
||||
"alpinejs": "^3.15.3"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,2 +1,7 @@
|
|||
import './bootstrap';
|
||||
import '@tailwindplus/elements';
|
||||
import Alpine from 'alpinejs';
|
||||
|
||||
window.Alpine = Alpine;
|
||||
|
||||
Alpine.start();
|
||||
|
|
|
|||
|
|
@ -2,9 +2,9 @@
|
|||
<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">
|
||||
<x-form.form method="POST" action="{{ route('admin.etudes.store') }}">
|
||||
<x-form.form method="POST" action="{{ route('admin.etudes.store') }}" x-data="{ selectedEnsemble: '', selectedInstrument: '', selectedSetNumber: '' }">
|
||||
<div>
|
||||
<x-form.select name="auditioned_ensemble_id">
|
||||
<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)
|
||||
|
|
@ -13,7 +13,7 @@
|
|||
</x-form.select>
|
||||
</div>
|
||||
<div class="mt-3">
|
||||
<x-form.select name="instrument_id">
|
||||
<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)
|
||||
|
|
@ -21,6 +21,12 @@
|
|||
@endforeach
|
||||
</x-form.select>
|
||||
</div>
|
||||
<div class="mt-3" x-show="selectedEnsemble" x-cloak x-model="selectedSetNumber">
|
||||
<x-form.input name="set" label="Set Number" type="number" min="1" x-bind:max="selectedEnsemble ? getSetCount(selectedEnsemble) : ''" />
|
||||
</div>
|
||||
<div class="mt-3" x-show="selectedEnsemble && selectedInstrument && selectedSetNumber" x-cloak>
|
||||
<x-form.input name="file" type="file" label="Etude PDF" />
|
||||
</div>
|
||||
</x-form.form>
|
||||
</x-slot:body>
|
||||
</x-card>
|
||||
|
|
@ -28,11 +34,15 @@
|
|||
let ensembles = {
|
||||
@foreach($ensembles as $ensemble)
|
||||
{{ $ensemble->id }}: {
|
||||
id: {{ $enemble->id }},
|
||||
name: {{ $ensemble->name }},
|
||||
id: {{ $ensemble->id }},
|
||||
name: '{{ $ensemble->name }}',
|
||||
setCount: {{ $ensemble->set_count }}
|
||||
}
|
||||
},
|
||||
@endforeach
|
||||
};
|
||||
function getSetCount(ensembleId) {
|
||||
// noinspection JSUnresolvedVariable
|
||||
return ensembles[ensembleId]?.setCount || '';
|
||||
}
|
||||
</script>
|
||||
</x-layout.admin>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
$hasError = $errors->has($name);
|
||||
@endphp
|
||||
|
||||
<div {{ $attributes }}>
|
||||
<div>
|
||||
@if(isset($label) && is_object($label))
|
||||
<label for="{{ $id ?? $name }}" {{ $label->attributes->merge(['class' => 'block text-sm/6 font-medium text-gray-900 dark:text-white']) }}>
|
||||
{{ $label }}
|
||||
|
|
@ -23,11 +23,11 @@
|
|||
value="{{ old($name, $value) }}"
|
||||
placeholder="{{ $placeholder }}"
|
||||
@if($hasError) aria-invalid="true" aria-describedby="{{ $id ?? $name }}-error" @endif
|
||||
@class([
|
||||
{{ $attributes->class([
|
||||
'block w-full rounded-md bg-white py-1.5 outline-1 -outline-offset-1 focus:outline-2 focus:-outline-offset-2 sm:text-sm/6 dark:bg-white/5',
|
||||
'col-start-1 row-start-1 pr-10 pl-3 text-red-900 outline-red-300 placeholder:text-red-300 focus:outline-red-600 sm:pr-9 dark:text-red-400 dark:outline-red-500/50 dark:placeholder:text-red-400/70 dark:focus:outline-red-400' => $hasError,
|
||||
'px-3 text-base text-gray-900 outline-gray-300 placeholder:text-gray-400 focus:outline-brand-600 dark:text-white dark:outline-white/10 dark:placeholder:text-gray-500 dark:focus:outline-brand-500' => !$hasError,
|
||||
])
|
||||
]) }}
|
||||
/>
|
||||
|
||||
@if($hasError)
|
||||
|
|
|
|||
Loading…
Reference in New Issue