[TASK] basic styling logbook and stats
This commit is contained in:
		| @@ -297,7 +297,7 @@ function initSearch() { | ||||
| } | ||||
|  | ||||
| function filterElements(input: string) { | ||||
|   const elements = document.querySelectorAll('form[data-filterable="true"]'); | ||||
|   const elements = document.querySelectorAll('div[data-filterable="true"]'); | ||||
|   let resultWrapper = <HTMLElement>document.querySelector('#filter-result-js'), | ||||
|       amountShownElements = 0; | ||||
|  | ||||
|   | ||||
| @@ -39,33 +39,35 @@ | ||||
| 		<div class="bg-primary-100 p-3 rounded-b-md grid gap-4"> | ||||
| 			<div id="filter-result-js" class="text-primary-950"></div> | ||||
| 			{% for user in users %} | ||||
| 				<form action="/admin/user" data-filterable="true" data-filter="{{ user.name }}" method="post" class="bg-white p-3 rounded-md flex items-end md:items-center justify-between"> | ||||
| 					<div class="w-full"> | ||||
| 						<input type="hidden" name="id" value="{{ user.id }}"/> | ||||
| 						<div class="font-bold mb-1">{{ user.name }} | ||||
| 							{% if user.last_access %} | ||||
| 								(last access: | ||||
| 								{{ user.last_access | date }}) | ||||
| 							{% endif %} | ||||
| 						</div> | ||||
| 						<div class="grid md:grid-cols-3"> | ||||
| 							{{ macros::checkbox(label='Scheckbuch', name='is_guest', id=loop.index , checked=user.is_guest) }} | ||||
| 							{{ macros::checkbox(label='Steuerberechtigter', name='is_cox', id=loop.index , checked=user.is_cox) }} | ||||
| 							{{ macros::checkbox(label='Technical', name='is_tech', id=loop.index , checked=user.is_tech) }} | ||||
| 							{{ macros::checkbox(label='Admin', name='is_admin', id=loop.index , checked=user.is_admin) }} | ||||
| 						</div> | ||||
| 						{% if user.pw %} | ||||
| 							<a class="inline-block mt-1 text-primary-600 hover:text-primary-900 underline" href="/admin/user/{{ user.id }}/reset-pw">Passwort zurücksetzen</a> | ||||
| 						{% endif %} | ||||
| 					</div> | ||||
| 					<div class="grid gap-3"> | ||||
| 						<a href="/admin/user/{{ user.id }}/delete" class="inline-block btn btn-alert" onclick="return confirm('Wirklich löschen?');"> | ||||
| 							{% include "includes/delete-icon" %} | ||||
| 							Löschen | ||||
| 						</a> | ||||
| 						<input value="Ändern" type="submit" class="w-28 btn btn-primary"/> | ||||
| 					</div> | ||||
| 				</form> | ||||
|         <div data-filterable="true" data-filter="{{ user.name }}"> | ||||
|           <form action="/admin/user" method="post" class="bg-white p-3 rounded-md flex items-end md:items-center justify-between w-full"> | ||||
|             <div class="w-full"> | ||||
|               <input type="hidden" name="id" value="{{ user.id }}"/> | ||||
|               <div class="font-bold mb-1">{{ user.name }} | ||||
|                 {% if user.last_access %} | ||||
|                   (last access: | ||||
|                   {{ user.last_access | date }}) | ||||
|                 {% endif %} | ||||
|               </div> | ||||
|               <div class="grid md:grid-cols-3"> | ||||
|                 {{ macros::checkbox(label='Scheckbuch', name='is_guest', id=loop.index , checked=user.is_guest) }} | ||||
|                 {{ macros::checkbox(label='Steuerberechtigter', name='is_cox', id=loop.index , checked=user.is_cox) }} | ||||
|                 {{ macros::checkbox(label='Technical', name='is_tech', id=loop.index , checked=user.is_tech) }} | ||||
|                 {{ macros::checkbox(label='Admin', name='is_admin', id=loop.index , checked=user.is_admin) }} | ||||
|               </div> | ||||
|               {% if user.pw %} | ||||
|                 <a class="inline-block mt-1 text-primary-600 hover:text-primary-900 underline" href="/admin/user/{{ user.id }}/reset-pw">Passwort zurücksetzen</a> | ||||
|               {% endif %} | ||||
|             </div> | ||||
|             <div class="grid gap-3"> | ||||
|               <a href="/admin/user/{{ user.id }}/delete" class="inline-block btn btn-alert" onclick="return confirm('Wirklich löschen?');"> | ||||
|                 {% include "includes/delete-icon" %} | ||||
|                 Löschen | ||||
|               </a> | ||||
|               <input value="Ändern" type="submit" class="w-28 btn btn-primary"/> | ||||
|             </div> | ||||
|           </form> | ||||
|         </div> | ||||
| 			{% endfor %} | ||||
| 		</div> | ||||
|  | ||||
|   | ||||
| @@ -188,50 +188,43 @@ | ||||
| 	</div> | ||||
| {% endmacro show %} | ||||
|  | ||||
| {% macro show_old(log, state, allowed_to_close=false, only_ones) %} | ||||
| 	Bootsname: | ||||
| 	{{ log.boat.name }}<br/> | ||||
| 	Schiffsführer: | ||||
| 	{{ log.shipmaster_user.name }}<br/> | ||||
| 	{% if log.shipmaster_only_steering %} | ||||
| 		Schiffsführer steuert nur | ||||
| 	{% endif %} | ||||
| 	Weggefahren: | ||||
| 	{{ log.departure }}<br/> | ||||
| 	{% if state == "completed" %} | ||||
| 		Angekommen: | ||||
| 		{{ log.arrival}}<br/> | ||||
| 	{% endif %} | ||||
| 	{% set amount_rowers = log.rowers | length %} | ||||
| 	{% set amount_guests = log.boat.amount_seats - amount_rowers -1 %} | ||||
| 	{% if allowed_to_close and state == "on_water" %} | ||||
| 		{{ log::home(log=log, only_ones=only_ones) }} | ||||
| 	{% else %} | ||||
| 		Ziel: | ||||
| 		{{ log.destination }}<br/> | ||||
| 		{% if state == "completed" %} | ||||
| 			Km: | ||||
| 			{{ log.distance_in_km }}<br/> | ||||
| 		{% endif %} | ||||
| 		{% if log.comments %} | ||||
| 			Kommentare: | ||||
| 			{{ log.comments }}<br/> | ||||
| 		{% endif %} | ||||
| 		{% if log.logtype %} | ||||
| 			Logtype: | ||||
| 			{{ log.logtype }}<br/> | ||||
| 		{% endif %} | ||||
| 		{% if amount_guests > 0 or log.rowers | length > 0 %} | ||||
| 			Ruderer: | ||||
| 		{% endif %} | ||||
| 		{% if amount_guests > 0 %} | ||||
| 			{{ amount_guests }} | ||||
| 			Gäste (ohne Account) | ||||
| 		{% endif %} | ||||
| 		{% for rower in log.rowers %} | ||||
| 			{{ rower.name }} | ||||
| 		{% endfor %} | ||||
| 	{% endif %} | ||||
| {% macro show_old(log, state, allowed_to_close=false, only_ones, index) %} | ||||
|   <div class="border-t bg-white px-3 py-1" data-filterable="true" data-filter="{{ log.boat.name }} {{ log.shipmaster_user.name }} {% for rower in log.rowers %} {{ rower.name }} {% endfor %}"> | ||||
|     <div> | ||||
|       <strong>{{ log.boat.name }}</strong> <small class="text-gray-600">({{ log.shipmaster_user.name }}{% if log.shipmaster_only_steering %} - handgesteuer {% endif %})</small> | ||||
|       <small class="block text-gray-600">{{ log.departure | date(format='%d.%m.%Y - %H:%M') }} {% if state == "completed" %}- {{ log.arrival | date(format='%d.%m.%Y - %H:%M') }}{% endif %}</small> | ||||
|       {% set amount_rowers = log.rowers | length %} | ||||
|         {% set amount_guests = log.boat.amount_seats - amount_rowers -1 %} | ||||
|         {% if allowed_to_close and state == "on_water" %} | ||||
|           {{ log::home(log=log, only_ones=only_ones) }} | ||||
|         {% else %} | ||||
|           <div> | ||||
|             {{ log.destination }} | ||||
|             {% if state == "completed" %} | ||||
|               <small class="text-gray-600">({{ log.distance_in_km }} km)</small> | ||||
|             {% endif %} | ||||
|           </div> | ||||
|           {% if amount_guests > 0 or log.rowers | length > 0 %} | ||||
|             Ruderer: | ||||
|           {% endif %} | ||||
|           {% if amount_guests > 0 %} | ||||
|             {{ amount_guests }} | ||||
|             Gäste (ohne Account) | ||||
|           {% endif %} | ||||
|           {% for rower in log.rowers %} | ||||
|             {{ rower.name }} | ||||
|           {% endfor %} | ||||
|           {% if log.comments %} | ||||
|             Kommentare: | ||||
|             {{ log.comments }}<br/> | ||||
|           {% endif %} | ||||
|           {% if log.logtype %} | ||||
|             Logtype: | ||||
|             {{ log.logtype }}<br/> | ||||
|           {% endif %} | ||||
|         {% endif %} | ||||
|     </div> | ||||
|   </div> | ||||
| {% endmacro show_old %} | ||||
|  | ||||
| {% macro home(log, only_ones) %} | ||||
|   | ||||
| @@ -7,10 +7,18 @@ | ||||
|  | ||||
| 	<div class="max-w-screen-lg w-full"> | ||||
| 		<h1 class="h1">Logbuch</h1> | ||||
| 		{% for log in logs %} | ||||
| 			{{ log::show_old(log=log, state="completed", only_ones=false) }} | ||||
| 			<hr/> | ||||
| 		{% endfor %} | ||||
|  | ||||
|     <div class="mt-3"> | ||||
|       <div class="bg-gray-200 p-3 mt-4 rounded-t-md"> | ||||
|         <label for="name" class="sr-only">Suche</label> | ||||
|         <input type="search" name="name" id="filter-js" class="w-full relative block rounded-md border-0 py-1.5 px-2 text-gray-900 ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:z-10 focus:ring-2 focus:ring-inset focus:ring-primary-600 sm:text-sm sm:leading-6 mb-2 md:mb-0" placeholder="Suchen nach..."> | ||||
|       </div> | ||||
|  | ||||
|       <div id="filter-result-js" class="bg-gray-200 text-primary-950 pb-3 px-3 text-right"></div> | ||||
|       {% for log in logs %} | ||||
|         {{ log::show_old(log=log, state="completed", only_ones=false, index=loop.index) }} | ||||
|       {% endfor %} | ||||
|     </div> | ||||
| 	</div> | ||||
|  | ||||
| {% endblock content%} | ||||
|   | ||||
| @@ -6,11 +6,13 @@ | ||||
|  | ||||
|  | ||||
| 	<div class="max-w-screen-lg w-full"> | ||||
| 		<h1 class="h1">Statstik</h1> | ||||
| 		<ol> | ||||
| 		<h1 class="h1">Statistik</h1> | ||||
| 		<ol class="mt-3"> | ||||
| 			{% for s in stat %} | ||||
| 				<li>{{s.name}}: | ||||
| 					{{s.rowed_km}}km</li> | ||||
| 				<li class="{% if loop.index % 2 == 0 %} bg-gray-200 {% else %} bg-white {% endif %} flex justify-between px-3 py-1"> | ||||
|           <span>{{s.name}}</span> | ||||
| 					<span>{{s.rowed_km}}km</span> | ||||
|         </li> | ||||
| 			{% endfor %} | ||||
| 		</ol> | ||||
| 	</div> | ||||
|   | ||||
		Reference in New Issue
	
	Block a user
	 Marie Birner
					Marie Birner