102 lines
4.9 KiB
Handlebars
102 lines
4.9 KiB
Handlebars
<div class="page-header">
|
|
<div>
|
|
<h2>{{#if isEdit}}Edit timetable group{{else}}Add timetable group{{/if}}</h2>
|
|
<p>Define a group of events with their start and end times.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<form id="timetable-group-form" method="post" action="{{formAction}}" {{{formAttrs}}}>
|
|
<div class="card card-outline card-primary admin-form-card">
|
|
<div class="card-header">
|
|
<h3 class="card-title">Timetable group details</h3>
|
|
</div>
|
|
<div class="card-body d-grid gap-4">
|
|
<div class="row g-3">
|
|
<div class="col-12 col-lg-4">
|
|
<label for="timetable-group-name" class="form-label">Name</label>
|
|
<input id="timetable-group-name" name="name" class="form-control" value="{{timetableGroup.name}}" maxlength="128" data-limit-text-length required />
|
|
</div>
|
|
<div class="col-12 col-lg-8">
|
|
<label for="timetable-group-short-description" class="form-label">Short description</label>
|
|
<input id="timetable-group-short-description" name="short_description" class="form-control" value="{{timetableGroup.shortDescription}}" maxlength="255" data-limit-text-length placeholder="Morning events" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="card-footer d-flex justify-content-end">
|
|
{{{saveActionButtons formId="timetable-group-form" saveUrl=formAction cancelUrl=cancelUrl cancelConfirmMessage=cancelConfirmMessage deleteUrl=deleteUrl deleteConfirmMessage=deleteConfirmMessage deleteDisabled=deleteDisabled showSaveAndClose=showSaveSecondaryActions showSaveAndNew=showSaveSecondaryActions}}}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card card-outline card-secondary admin-form-card mt-4">
|
|
<div class="card-header d-flex align-items-center">
|
|
<h3 class="card-title mb-0 flex-grow-1">Entries</h3>
|
|
<button type="button" class="btn btn-primary btn-sm ms-auto" data-add-timetable-entry>Add entry</button>
|
|
</div>
|
|
<div class="card-body d-grid">
|
|
<div class="table-responsive">
|
|
<table class="table table-bordered align-middle schedule-entries-table mb-0">
|
|
<thead>
|
|
<tr>
|
|
<th style="width: 18rem;">Title</th>
|
|
<th>Description</th>
|
|
<th style="width: 12rem;">Start</th>
|
|
<th style="width: 12rem;">End</th>
|
|
<th style="width: 6rem;">Actions</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody data-timetable-entries-body>
|
|
{{#each timetableEntries}}
|
|
<tr data-timetable-entry-row>
|
|
<td>
|
|
<input type="hidden" name="entry_id[]" value="{{id}}" />
|
|
<input type="text" name="entry_title[]" class="form-control" value="{{title}}" maxlength="128" data-limit-text-length required />
|
|
</td>
|
|
<td>
|
|
<input type="text" name="entry_short_description[]" class="form-control" value="{{short_description}}" maxlength="255" data-limit-text-length placeholder="Optional description" />
|
|
</td>
|
|
<td>
|
|
<input type="datetime-local" name="entry_start_datetime[]" class="form-control" value="{{startValue}}" required />
|
|
</td>
|
|
<td>
|
|
<input type="datetime-local" name="entry_end_datetime[]" class="form-control" value="{{endValue}}" />
|
|
<div class="invalid-feedback">End time must be at least 1 minute after the start time.</div>
|
|
</td>
|
|
<td>
|
|
<button type="button" class="btn btn-outline-danger btn-sm" data-remove-timetable-entry>Remove</button>
|
|
</td>
|
|
</tr>
|
|
{{/each}}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
|
|
<template id="timetable-entry-row-template">
|
|
<tr data-timetable-entry-row>
|
|
<td>
|
|
<input type="hidden" name="entry_id[]" value="" />
|
|
<input type="text" name="entry_title[]" class="form-control" value="" maxlength="128" data-limit-text-length required />
|
|
</td>
|
|
<td>
|
|
<input type="text" name="entry_short_description[]" class="form-control" value="" maxlength="255" data-limit-text-length placeholder="Optional description" />
|
|
</td>
|
|
<td>
|
|
<input type="datetime-local" name="entry_start_datetime[]" class="form-control" value="" required />
|
|
</td>
|
|
<td>
|
|
<input type="datetime-local" name="entry_end_datetime[]" class="form-control" value="" />
|
|
<div class="invalid-feedback">End time must be at least 1 minute after the start time.</div>
|
|
</td>
|
|
<td>
|
|
<button type="button" class="btn btn-outline-danger btn-sm" data-remove-timetable-entry>Remove</button>
|
|
</td>
|
|
</tr>
|
|
</template>
|
|
|
|
{{#if isEdit}}
|
|
<form id="delete-timetable-group-form" method="post" action="/data-sources/timetables/{{timetableGroup.id}}/delete" data-confirm-message="Delete this timetable group?"></form>
|
|
{{/if}}
|
|
|
|
<script type="module" src="/assets/js/data-sources/timetable-group-form.js?v={{assetVersion}}"></script> |