[TASK] refactor sidebar

This commit is contained in:
Marie Birner 2023-04-08 09:17:46 +02:00
parent f1c812b436
commit d8049dd1e6
2 changed files with 12 additions and 12 deletions

View File

@ -118,16 +118,16 @@ function initSidebar() {
function initTripSidebar(triggerElement: HTMLElement) { function initTripSidebar(triggerElement: HTMLElement) {
const sidebarElement = <HTMLElement>document.querySelector('#sidebar'); const sidebarElement = <HTMLElement>document.querySelector('#sidebar');
if(sidebarElement && triggerElement.dataset.form && triggerElement.dataset.header) { if(sidebarElement && triggerElement.dataset.body && triggerElement.dataset.header) {
let form = <HTMLElement>document.querySelector(triggerElement.dataset.form); let body = <HTMLElement>document.querySelector(triggerElement.dataset.body);
let formElement = <HTMLElement>form.cloneNode(true); let bodyElement = <HTMLElement>body.cloneNode(true);
let formContainerElement = <HTMLElement>sidebarElement.querySelector('.body-js'); let bodyContainerElement = <HTMLElement>sidebarElement.querySelector('.body-js');
if(formContainerElement) { if(bodyContainerElement) {
formContainerElement.innerHTML = ''; bodyContainerElement.innerHTML = '';
formContainerElement.append(formElement); bodyContainerElement.append(bodyElement);
} }
if(triggerElement.dataset.day) { if(triggerElement.dataset.day) {
let hiddenElement = <HTMLInputElement>formElement.querySelector('.day-js'); let hiddenElement = <HTMLInputElement>bodyElement.querySelector('.day-js');
if(hiddenElement) { if(hiddenElement) {
hiddenElement.value = triggerElement.dataset.day; hiddenElement.value = triggerElement.dataset.day;
} }

View File

@ -47,7 +47,7 @@
<a href="#" data-sidebar="true" data-trigger="sidebar" <a href="#" data-sidebar="true" data-trigger="sidebar"
data-header="<strong>{{ planned_event.planned_starting_time }} Uhr</strong> ({{ planned_event.name }}){% if planned_event.notes %}<small class='block'>{{ planned_event.notes }}</small>{% endif %}" data-header="<strong>{{ planned_event.planned_starting_time }} Uhr</strong> ({{ planned_event.name }}){% if planned_event.notes %}<small class='block'>{{ planned_event.notes }}</small>{% endif %}"
data-form="#event{{ planned_event.trip_details_id }}" data-body="#event{{ planned_event.trip_details_id }}"
class="inline-block link-primary mr-3"> class="inline-block link-primary mr-3">
Details Details
</a> </a>
@ -145,7 +145,7 @@
class="text-gray-600">({{ trip.cox_name }})</small><br /> class="text-gray-600">({{ trip.cox_name }})</small><br />
<a href="#" data-sidebar="true" data-trigger="sidebar" <a href="#" data-sidebar="true" data-trigger="sidebar"
data-header="<strong>{{ trip.planned_starting_time }} Uhr</strong> ({{ trip.cox_name }}){% if trip.notes %}<small class='block'>{{ trip.notes }}</small>{% endif %}" data-header="<strong>{{ trip.planned_starting_time }} Uhr</strong> ({{ trip.cox_name }}){% if trip.notes %}<small class='block'>{{ trip.notes }}</small>{% endif %}"
data-form="#trip{{ trip.trip_details_id }}" data-body="#trip{{ trip.trip_details_id }}"
class="inline-block link-primary mr-3"> class="inline-block link-primary mr-3">
Details Details
</a> </a>
@ -214,7 +214,7 @@
<a href="#" data-sidebar="true" data-trigger="sidebar" <a href="#" data-sidebar="true" data-trigger="sidebar"
data-header="<strong>Event</strong> am {{ day.day| date(format='%d.%m.%Y') }} erstellen" data-header="<strong>Event</strong> am {{ day.day| date(format='%d.%m.%Y') }} erstellen"
data-day="{{ day.day }}" data-day="{{ day.day }}"
data-form="#addEventForm" data-body="#addEventForm"
class="relative inline-block w-full bg-primary-900 hover:bg-primary-950 focus:bg-primary-950 text-white py-2 rounded-bl-md text-sm font-semibold"> class="relative inline-block w-full bg-primary-900 hover:bg-primary-950 focus:bg-primary-950 text-white py-2 rounded-bl-md text-sm font-semibold">
<span class="absolute inset-y-0 left-0 flex items-center pl-3"> <span class="absolute inset-y-0 left-0 flex items-center pl-3">
{% include "includes/plus-icon" %} {% include "includes/plus-icon" %}
@ -227,7 +227,7 @@
<a href="#" data-sidebar="true" data-trigger="sidebar" <a href="#" data-sidebar="true" data-trigger="sidebar"
data-header="<strong>Ausfahrt</strong> am {{ day.day| date(format='%d.%m.%Y') }} erstellen" data-header="<strong>Ausfahrt</strong> am {{ day.day| date(format='%d.%m.%Y') }} erstellen"
data-day="{{ day.day }}" data-day="{{ day.day }}"
data-form="#sidebarForm" data-body="#sidebarForm"
class="relative inline-block w-full py-2 text-primary-900 hover:text-primary-950 focus:text-primary-950 text-sm font-semibold bg-gray-100 hover:bg-gray-200 focus:bg-gray-200 {% if loggedin_user.is_admin %} rounded-br-md {% else %} rounded-b-md {% endif %}"> class="relative inline-block w-full py-2 text-primary-900 hover:text-primary-950 focus:text-primary-950 text-sm font-semibold bg-gray-100 hover:bg-gray-200 focus:bg-gray-200 {% if loggedin_user.is_admin %} rounded-br-md {% else %} rounded-b-md {% endif %}">
<span class="absolute inset-y-0 left-0 flex items-center pl-3"> <span class="absolute inset-y-0 left-0 flex items-center pl-3">
{% include "includes/plus-icon" %} {% include "includes/plus-icon" %}