You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
website/views/utenti.html

60 lines
2.5 KiB
HTML

{{template "base" .}}
{{define "title"}}Utenti • PHC{{end}}
{{define "body"}}
<script src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/fuse.js/dist/fuse.js"></script>
<script src="/public/js/utenti.min.js"></script>
<section x-data="utenti">
<h1>
<i class="fas fa-users"></i>
Lista degli Utenti
</h1>
<p>
Questa è la lista di tutti gli utenti con un account su Poisson. Scrivi nome, cognome o
username di un utente per filtrare la lista in tempo reale. Altrimenti di base in cima
compariranno gli utenti con più "follower".
</p>
<div class="search">
<div class="compound padded">
<div class="icon" title="Ordina per">
<i class="fas fa-sort"></i>
</div>
<div class="divider"></div>
<select x-model="sortMode" @click="updateSortMode()">
<option value="chronological">Cronologico</option>
<option value="name">Nome</option>
<option value="surname">Cognome</option>
</select>
</div>
<div class="compound">
<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">
<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>
</template>
<div class="spinner" x-ref="spinner" x-show="searchResults.length < searchResultsBuffer.length">
<i class="fas fa-hourglass"></i>
</div>
</div>
</section>
{{end}}