113 lines
3.6 KiB
HTML
113 lines
3.6 KiB
HTML
<section class="vista-evento">
|
|
@if (loading()) {
|
|
<p>Caricamento evento...</p>
|
|
} @else if (loadError(); as message) {
|
|
<p class="vista-evento__error" role="alert">{{ message }}</p>
|
|
} @else if (evento(); as ev) {
|
|
<div class="vista-evento__card">
|
|
<div class="vista-evento__header">
|
|
<div>
|
|
<h1>{{ ev.titolo }}</h1>
|
|
<p class="vista-evento__meta">
|
|
<span class="vista-evento__tag">{{ ev.tipo }}</span>
|
|
<span class="vista-evento__tag">{{ ev.brancaId }}</span>
|
|
@if (ev.parentId) {
|
|
<span class="vista-evento__tag">sotto-evento</span>
|
|
}
|
|
</p>
|
|
</div>
|
|
|
|
<div class="vista-evento__azioni">
|
|
@if (puoGestireEvento()) {
|
|
<button mat-stroked-button type="button" (click)="vaiAModifica()">Modifica</button>
|
|
}
|
|
@if (puoGestireEvento()) {
|
|
<button
|
|
mat-flat-button
|
|
color="primary"
|
|
type="button"
|
|
[disabled]="!puoAggiungereSottoEvento()"
|
|
[attr.title]="ev.parentId ? 'Un sotto-evento non può avere a sua volta sotto-eventi' : null"
|
|
(click)="vaiASottoEvento()"
|
|
>
|
|
Aggiungi sotto-evento
|
|
</button>
|
|
}
|
|
</div>
|
|
</div>
|
|
|
|
@if (ev.descrizione) {
|
|
<p class="vista-evento__descrizione">{{ ev.descrizione }}</p>
|
|
}
|
|
|
|
<dl class="vista-evento__dettagli">
|
|
<div>
|
|
<dt>Inizio</dt>
|
|
<dd>{{ formatData(ev.dataInizio) }}</dd>
|
|
</div>
|
|
<div>
|
|
<dt>Fine</dt>
|
|
<dd>{{ formatData(ev.dataFine) }}</dd>
|
|
</div>
|
|
@if (ev.location) {
|
|
<div>
|
|
<dt>Location</dt>
|
|
<dd>{{ ev.location }}</dd>
|
|
</div>
|
|
}
|
|
</dl>
|
|
|
|
<h2>Timeline</h2>
|
|
<div class="vista-evento__timeline">
|
|
@for (giorno of timeline(); track giorno.data) {
|
|
<div class="timeline-giorno">
|
|
<span class="timeline-giorno__etichetta">{{ giorno.etichetta }}</span>
|
|
|
|
<div class="timeline-giorno__corsia" [title]="giorno.genitore.orarioLabel">
|
|
<div
|
|
class="timeline-blocco timeline-blocco--genitore"
|
|
[style.left.%]="giorno.genitore.inizioPercento"
|
|
[style.width.%]="giorno.genitore.larghezzaPercento"
|
|
[style.background-color]="giorno.genitore.colore"
|
|
></div>
|
|
</div>
|
|
|
|
@for (figlio of giorno.figli; track figlio.id) {
|
|
<button
|
|
type="button"
|
|
class="timeline-giorno__corsia timeline-giorno__corsia--figlio"
|
|
[title]="figlio.titolo + ' · ' + figlio.orarioLabel"
|
|
(click)="vaiAEvento(figlio.id)"
|
|
>
|
|
<span
|
|
class="timeline-blocco"
|
|
[style.left.%]="figlio.inizioPercento"
|
|
[style.width.%]="figlio.larghezzaPercento"
|
|
[style.background-color]="figlio.colore"
|
|
>
|
|
{{ figlio.titolo }}
|
|
</span>
|
|
</button>
|
|
}
|
|
</div>
|
|
}
|
|
</div>
|
|
|
|
<h2>Risorse collegate</h2>
|
|
@if (ev.risorseCollegate.length === 0) {
|
|
<p class="vista-evento__vuoto">Nessuna risorsa collegata.</p>
|
|
} @else {
|
|
<ul class="vista-evento__risorse">
|
|
@for (risorsa of ev.risorseCollegate; track risorsa.id) {
|
|
<li class="vista-evento__risorsa">
|
|
<span class="vista-evento__risorsa-tipo">{{ risorsa.tipoRisorsa }}</span>
|
|
<span class="vista-evento__risorsa-id">{{ risorsa.risorsaId }}</span>
|
|
<span class="vista-evento__risorsa-origine">{{ risorsa.servizioOrigine }}</span>
|
|
</li>
|
|
}
|
|
</ul>
|
|
}
|
|
</div>
|
|
}
|
|
</section>
|