Ruderverein-Donau-Linz/rowt
1
1
Fork 1
Code Issues 54 Pull Requests Actions Packages Projects Wiki Activity

[TASK] fix issues with destination

Browse Source
This commit is contained in:
Marie Birner
2023-09-23 22:31:19 +02:00
parent 33cb5e025b
commit eb1b3f412f
3 changed files with 19 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
frontend/main.ts
View File

@@ -15,6 +15,7 @@ document.addEventListener('DOMContentLoaded', function() {
initChoices(); initChoices();
initBoatActions(); initBoatActions();
selectBoatChange(); selectBoatChange();
addRelationMagic(<HTMLElement>document.querySelector('body'));
}); });
function selectBoatChange() { function selectBoatChange() {
@@ -307,15 +308,15 @@ function initTripSidebar(triggerElement: HTMLElement) {
function addRelationMagic(bodyElement: HTMLElement) { function addRelationMagic(bodyElement: HTMLElement) {
const fields = bodyElement.querySelectorAll('.set-distance-js'); const fields = bodyElement.querySelectorAll('.set-distance-js');
if(fields) { if(fields) {
Array.prototype.forEach.call(fields, (field: HTMLInputElement) => { Array.prototype.forEach.call(fields, (field: HTMLInputElement) => {
if(field.dataset.relation){ if(field.dataset.relation){
const relatedField = <HTMLInputElement>bodyElement.querySelector('#' + field.dataset.relation); const relatedField = <HTMLInputElement>bodyElement.querySelector('#' + field.dataset.relation);
if(relatedField) { if(relatedField) {
field.addEventListener('input', (e) => { field.addEventListener('input', (e) => {
e.preventDefault(); e.preventDefault();
const dataList = <HTMLDataListElement>document.getElementById('destinations'); const dataList = <HTMLDataListElement>document.querySelector('#destinations');
if(dataList) { if(dataList) {
var option = Array.prototype.find.call(dataList.options, function(option) { var option = Array.prototype.find.call(dataList.options, function(option) {
return option.value === field.value; return option.value === field.value;

37
templates/includes/forms/log.html.tera
View File

@@ -55,34 +55,25 @@
{{ log::rower_select(id="newrower", selected=[], class="col-span-2", init=true) }} {{ log::rower_select(id="newrower", selected=[], class="col-span-2", init=true) }}
{% endif %} {% endif %}
<div></div>
<div>
<label for="destination" class="small text-gray-600">Ziel</label>
<input type="search" class="input rounded-md" list="destinations" placeholder="Destination" name="destination" id="destination">
<datalist id="destinations">
{% for distance in distances %}
<option value="{{ distance.0 }}" distance={{ distance.1 }}/>
{% endfor %}
</datalist>
</div>
{{ macros::input(label='Abfahrtszeit', name='departure', type='datetime-local', required=true) }} {{ macros::input(label='Abfahrtszeit', name='departure', type='datetime-local', required=true) }}
{{ macros::input(label='Ankunftszeit', name='arrival', type='datetime-local') }} {{ macros::input(label='Ankunftszeit', name='arrival', type='datetime-local') }}
<div> <div class="relative">
<label for="destination" class="small text-gray-600">Ziel</label> <label for="destination" class="small text-gray-600">Ziel</label>
<input type="search" class="input rounded-md set-distance-js" list="destinations" placeholder="Destination" name="destination" id="destination" data-relation="distance_in_km">
<datalist id="destinations"> <input class="input rounded-md set-distance-js" type="search" list="destinations" placeholder="Destination" id="destination" name="destination" value="" data-relation="distance_in_km"/>
{% for distance in distances %} <datalist id="destinations">
<option value="{{ distance.0 }}" distance={{ distance.1 }}/> {% for distance in distances %}
{% endfor %} <option value="{{ distance.0 }}" distance={{ distance.1 }} />
</datalist> {% endfor %}
</div> </datalist>
</div>
<div class="relative"> <div class="relative">
{{ macros::input(label="Distanz", name="distance_in_km", type="number", min=1) }} {{ macros::input(label="Distanz", name="distance_in_km", id="distance_in_km" , type="number", min=0, value='', required=true, class="rounded-md") }}
<span class="absolute right-0 bottom-0 py-1.5 px-2 bg-white border-0 text-gray-600 ring-1 ring-inset ring-gray-300 rounded-br-md rounded-tr-md">km</span> <span class="absolute right-0 bottom-0 py-1.5 px-2 bg-white border-0 text-gray-600 ring-1 ring-inset ring-gray-300 rounded-br-md rounded-tr-md">km</span>
</div> </div>
{{ macros::input(label="Kommentar", name="comments", type="text", wrapper_class="col-span-2") }} {{ macros::input(label="Kommentar", name="comments", type="text", wrapper_class="col-span-2") }}
<div class="col-span-2"> <div class="col-span-2">
@@ -96,10 +87,10 @@
{% macro boat_select(only_ones) %} {% macro boat_select(only_ones) %}
{% if not only_ones %} {% if not only_ones %}
{{ macros::select(data=boats, name='boat_id', display=["name", " (","amount_seats", " x)"], extras=["default_shipmaster_only_steering", "amount_seats"], class="col-span-2") }} {{ macros::select(data=boats, name='boat_id', display=["name", " (","amount_seats", " x)"], extras=["default_shipmaster_only_steering", "amount_seats", "on_water"], class="col-span-2") }}
{% else %} {% else %}
{% set ones = boats | filter(attribute="amount_seats", value=1) %} {% set ones = boats | filter(attribute="amount_seats", value=1) %}
{{ macros::select(data=ones, name='boat_id', display=["name", " (","amount_seats", " x)"], extras=["default_shipmaster_only_steering", "amount_seats"], class="col-span-2") }} {{ macros::select(data=ones, name='boat_id', display=["name", " (","amount_seats", " x)"], extras=["default_shipmaster_only_steering", "amount_seats", "on_water"], class="col-span-2") }}
{% endif %} {% endif %}
{% endmacro boat_select %} {% endmacro boat_select %}
@@ -238,7 +229,7 @@
<label for="destination" class="small text-gray-600">Ziel</label> <label for="destination" class="small text-gray-600">Ziel</label>
<input class="input rounded-md set-distance-js change-id-js" type="search" list="destinations" placeholder="Destination" required="required" id="destination{{ log.id }}" name="destination" value="{{log.destination}}" data-relation="distance_in_km{{log.id}}"/> <input class="input rounded-md set-distance-js change-id-js" type="search" list="destinations" placeholder="Destination" required="required" id="destination{{ log.id }}" name="destination" value="{{log.destination}}" data-relation="distance_in_km{{log.id}}"/>
</div> </div>
<div class="relative"> <div class="relative">
{{ macros::input(label="Distanz", name="distance_in_km", id="distance_in_km" ~ log.id , type="number", min=0, value=log.distance_in_km, required=true, class="rounded-md change-id-js") }} {{ macros::input(label="Distanz", name="distance_in_km", id="distance_in_km" ~ log.id , type="number", min=0, value=log.distance_in_km, required=true, class="rounded-md change-id-js") }}

4
templates/includes/macros.html.tera
View File

@@ -63,7 +63,7 @@
{% macro input(label, name, type, required=false, class='rounded-md', value='', min='', hide_label=false, id='', autofocus=false, wrapper_class='') %} {% macro input(label, name, type, required=false, class='rounded-md', value='', min='', hide_label=false, id='', autofocus=false, wrapper_class='') %}
<div class="{{wrapper_class}}"> <div class="{{wrapper_class}}">
<label for="{{ name }}" class="{% if hide_label %} sr-only {% else %} small text-gray-600 {% endif %}">{{ label }}</label> <label for="{{ name }}" class="{% if hide_label %} sr-only {% else %} small text-gray-600 {% endif %}">{{ label }}</label>
<input {% if id %} id="{{ id }}" {% else %} id="{{ name }}" {% endif %} name="{{ name }}" type="{{ type }}" {% if required %} required {% endif %} value="{{ value }}" class="input {{ class }}" placeholder="{% if hide_label %}{{ label }}{% endif %}" {% if min %} min="{{ min }}" {% endif %} {% if autofocus %} autofocus {% endif %}> <input {% if id %} id="{{ id }}" {% else %} id="{{ name }}" {% endif %} name="{{ name }}" type="{{ type }}" {% if required %} required {% endif %} value="{{ value }}" class="input {{ class }}" placeholder="{% if hide_label %}{{ label }}{% endif %}" {% if min is defined %} min="{{ min }}" {% endif %} {% if autofocus %} autofocus {% endif %}>
</div> </div>
{% endmacro input %} {% endmacro input %}
@@ -83,7 +83,7 @@
<option selected value>{{ default }}</option> <option selected value>{{ default }}</option>
{% endif %} {% endif %}
{% for d in data %} {% for d in data %}
<option value="{{ d.id }}" {% if d.id == selected_id %} selected {% endif %} {% if extras != '' %} {% for extra in extras %} data-{{extra}}={{d[extra]}} {% endfor %} {% endif %}> <option value="{{ d.id }}" {% if d.id == selected_id %} selected {% endif %} {% if extras != '' %} {% for extra in extras %} {% if extra != 'on_water' %} data-{{extra}}={{d[extra]}} {% else %} {% if d[extra] %} disabled {% endif %}{% endif %} {% endfor %} {% endif %}>
{% for displa in display -%} {% for displa in display -%}
{%- if d[displa] -%} {%- if d[displa] -%}
{{- d[displa] -}} {{- d[displa] -}}