Cartella con file per la frontend, un makefile per costruire tutto e lista utenti con fuzzy search

This commit is contained in:
2022-05-31 01:39:07 +02:00
parent 91998e8924
commit 58db3e3901
10 changed files with 1221 additions and 27 deletions
+26 -22
View File
@@ -1,5 +1,5 @@
{{template "base" .}} {{define "title"}}Utenti • PHC{{end}} {{define "body"}}
<section>
<section x-data="utenti">
<h2>
<i class="fas fa-users"></i>
Lista degli Utenti
@@ -11,43 +11,47 @@
</p>
<div class="search">
<div class="compound padded">
<div class="icon">
<div class="icon" title="Ordina per">
<i class="fas fa-sort"></i>
</div>
<div class="divider"></div>
<select>
<option value="name">Cronologico</option>
<select x-model="sortMode" @click="updateSortMode()">
<option value="chronological">Cronologico</option>
<option value="name">Nome</option>
<option value="name">Cognome</option>
<option value="surname">Cognome</option>
</select>
</div>
<div class="compound">
<input type="text" id="search-field" placeholder="Cerca..." autocomplete="off" />
<button class="icon">
<input type="text" x-model="searchField" @input="updateSearch()" placeholder="Cerca..." autocomplete="off" />
<button class="icon" title="In realtà questo tasto è finto">
<i class="fas fa-search"></i>
</button>
</div>
</div>
<div class="user-list card-list">
{{ range .Utenti }}
<div class="user-item card">
<a class="full-name" href="{{ $.UserPagesBaseUrl }}{{ .Uid }}">
{{ .Nome }} {{ .Cognome }}
</a>
{{ if .IsMacchinista }}
<div class="icon" title="Macchinista">
<i class="fas fa-wrench"></i>
<template x-for="entry in searchResults" :key="entry.item.uid">
<div class="user-item card">
<a class="full-name" :href="'{{ $.Config.UserPagesBaseUrl }}' + entry.item.uid" x-text="
sortMode === 'surname' ?
entry.item.cognome + ' ' + entry.item.nome :
entry.item.nome + ' ' + entry.item.cognome
"></a>
<template x-if="entry.item.macchinista">
<div class="icon" title="Macchinista">
<i class="fas fa-wrench"></i>
</div>
</template>
<!-- <template x-if="entry.score">
<span x-text="entry.score"></span>
</template> -->
</div>
{{ end }}
</template>
<div class="spinner" x-ref="spinner" x-show="searchResults.length < searchResultsBuffer.length">
<i class="fas fa-hourglass"></i>
</div>
{{ end }}
</div>
</section>
<!--
<script src="//unpkg.com/alpinejs" defer></script>
<script src="https://cdn.jsdelivr.net/npm/fuse.js/dist/fuse.js" defer></script>
<script type="module" src="/public/js/utenti.min.js"></script>
<script type="module" src="/public/js/utenti.js"></script>
-->
{{end}}