philipp/hacky-ruadat
1
0
Fork 0
forked from Ruderverein-Donau-Linz/rowt
Code Issues Pull Requests Actions Activity

finish frontend(?)

Browse Source
This commit is contained in:
philipp
2023-10-30 15:19:43 +01:00
parent 7788be5a17
commit 388ed175bd
3 changed files with 29 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
frontend/main.ts
View File

@@ -38,30 +38,21 @@ function selectBoatChange() {
noResultsText: 'Keine Ergebnisse gefunden', noResultsText: 'Keine Ergebnisse gefunden',
noChoicesText: 'Keine Ergebnisse gefunden', noChoicesText: 'Keine Ergebnisse gefunden',
itemSelectText: 'Zum Auswählen klicken', itemSelectText: 'Zum Auswählen klicken',
callbackOnCreateTemplates: function () {
return {
option: ({ label, value, customProperties, active, disabled, }: any) => {
const opt: HTMLOptionElement = Choices.defaults.templates.option.call(
this,
{ label, value, customProperties, active, disabled }
);
// We get the original <option> from choicejs
const originalOption: HTMLOptionElement = this._presetOptions.filter(
(option: HTMLOptionElement) => option.value === value
)[0];
const rowers = Number(originalOption.dataset.amount_seats);
setMaxAmountRowers("newrower", rowers);
return opt;
}
}
}
} as any); } as any);
boatSelect.addEventListener('addItem', function(e) {
const amount_seats = e.detail.customProperties.amount_seats;
setMaxAmountRowers("newrower", amount_seats);
const inputElement = document.getElementById("departure") as HTMLInputElement;
const now = new Date();
const formattedDateTime = `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, '0')}-${String(now.getDate()).padStart(2, '0')}T${String(now.getHours()).padStart(2, '0')}:${String(now.getMinutes()).padStart(2, '0')}`;
inputElement.value = formattedDateTime;
},false);
choiceObjects[boatSelect.id] = boatChoice; choiceObjects[boatSelect.id] = boatChoice;
choiceObjects["boat_id"] = boatChoice;
} }
} }
@@ -82,16 +73,18 @@ function reloadPage() {
} }
function setMaxAmountRowers(name: string, rowers: number) { function setMaxAmountRowers(name: string, rowers: number) {
console.log("called fct: name="+name+"; rowers="+rowers);
if(choiceObjects[name]) { if(choiceObjects[name]) {
let curSelection = choiceObjects[name].getValue(true); choiceObjects[name].removeActiveItems();
let amount_to_delete = (<any>curSelection).length - rowers; //let curSelection = choiceObjects[name].getValue(true);
//let amount_to_delete = (<any>curSelection).length - rowers;
if (amount_to_delete > 0){ //if (amount_to_delete > 0){
let to_delete = (<any>curSelection).slice(-amount_to_delete); // let to_delete = (<any>curSelection).slice(-amount_to_delete);
for (let del of to_delete) { // for (let del of to_delete) {
choiceObjects[name].removeActiveItemsByValue(del); // choiceObjects[name].removeActiveItemsByValue(del);
} // }
} //}
let input = <HTMLElement>document.querySelector('#'+name); let input = <HTMLElement>document.querySelector('#'+name);
@@ -127,6 +120,7 @@ function setMaxAmountRowers(name: string, rowers: number) {
// } // }
//} //}
} }
console.log(choiceObjects["newrower"].config.maxItemCount);
} }
function initBoatActions() { function initBoatActions() {
@@ -135,21 +129,11 @@ function initBoatActions() {
Array.prototype.forEach.call(boatSelects, (select: HTMLInputElement) => { Array.prototype.forEach.call(boatSelects, (select: HTMLInputElement) => {
select.addEventListener('click', function() { select.addEventListener('click', function() {
if(select.dataset.seats) { if(select.dataset.seats) {
const rowers = Number(select.dataset.seats);
setMaxAmountRowers("newrower", rowers);
if (select.dataset.id) { if (select.dataset.id) {
choiceObjects['boat_id'].setChoiceByValue(select.dataset.id); choiceObjects['boat_id'].setChoiceByValue(select.dataset.id);
} }
window.scrollTo(0, 0); window.scrollTo(0, 0);
const inputElement = document.getElementById("departure") as HTMLInputElement;
const now = new Date();
const formattedDateTime = `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, '0')}-${String(now.getDate()).padStart(2, '0')}T${String(now.getHours()).padStart(2, '0')}:${String(now.getMinutes()).padStart(2, '0')}`;
inputElement.value = formattedDateTime;
} }
}); });
}); });
@@ -173,6 +157,7 @@ interface ChoiceEvent extends Event{
is_cox: boolean, is_cox: boolean,
steers: boolean, steers: boolean,
cox_on_boat: boolean, cox_on_boat: boolean,
amount_seats: number,
} }
}; };
} }
@@ -205,7 +190,7 @@ function initNewChoice(select: HTMLInputElement) {
//const rowers = Number(originalOption.dataset.amount_seats); //const rowers = Number(originalOption.dataset.amount_seats);
//const isShipmasterSteering = originalOption.dataset.default_shipmaster_only_steering; //const isShipmasterSteering = originalOption.dataset.default_shipmaster_only_steering;
//setMaxAmountRowers(select.id, curr_boat_rowers, isShipmasterSteering); //setMaxAmountRowersoselect.id, curr_boat_rowers, isShipmasterSteering);
return opt; return opt;
} }

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

@@ -66,10 +66,10 @@
{% macro boat_select(only_ones, id="boat_id") %} {% macro boat_select(only_ones, id="boat_id") %}
{% if not only_ones %} {% if not only_ones %}
{{ macros::select(label="Boot", data=boats, name="boat_id", id=id, display=["name", " (","amount_seats", " x)"], extras=["default_shipmaster_only_steering", "amount_seats", "on_water"], wrapper_class="col-span-4") }} {{ macros::select(label="Boot", data=boats, name="boat_id", id=id, display=["name", " (","amount_seats", " x)"], extras=["default_shipmaster_only_steering", "amount_seats", "on_water"], wrapper_class="col-span-4", show_seats=true) }}
{% else %} {% else %}
{% set ones = boats | filter(attribute="amount_seats", value=1) %} {% set ones = boats | filter(attribute="amount_seats", value=1) %}
{{ macros::select(label="Boot", data=ones, name="boat_id", id=id, display=["name", " (","amount_seats", " x)"], extras=["default_shipmaster_only_steering", "amount_seats", "on_water"], wrapper_class="col-span-4") }} {{ macros::select(label="Boot", data=ones, name="boat_id", id=id, display=["name", " (","amount_seats", " x)"], extras=["default_shipmaster_only_steering", "amount_seats", "on_water"], wrapper_class="col-span-4", show_seats=true) }}
{% endif %} {% endif %}
{% endmacro boat_select %} {% endmacro boat_select %}

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

@@ -78,7 +78,7 @@
</label> </label>
{% endmacro checkbox %} {% endmacro checkbox %}
{% macro select(label, data, name='trip_type', default='', id='', selected_id='', display='', extras='', class='', wrapper_class='', required=false) %} {% macro select(label, data, name='trip_type', default='', id='', selected_id='', display='', extras='', class='', wrapper_class='', required=false, show_seats=false) %}
<div class="{{wrapper_class}}"> <div class="{{wrapper_class}}">
<label for="{{ name }}" class="text-sm text-gray-600">{{ label }}</label> <label for="{{ name }}" class="text-sm text-gray-600">{{ label }}</label>
{% if display == '' %} {% if display == '' %}
@@ -89,7 +89,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 %} {% if extra != 'on_water' %} data- {{extra}}={{d[extra]}} {% else %} {% if d[extra] %} disabled {% endif %} {% endif %} {% 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 %} {% if show_seats %} data-custom-properties='{"amount_seats": {{ d["amount_seats"] }}}'{% endif %}>
{% for displa in display -%} {% for displa in display -%}
{%- if d[displa] -%} {%- if d[displa] -%}
{{- d[displa] -}} {{- d[displa] -}}