Update date display for each survey in user survey list
This commit is contained in:
parent
f76af324a0
commit
ddd8ebcb97
|
@ -84,16 +84,21 @@
|
||||||
<br />
|
<br />
|
||||||
<br />
|
<br />
|
||||||
<br />
|
<br />
|
||||||
<span>{{ encuesta.fechaCreacion | formatMediumDatetime }}</span>
|
|
||||||
<!-- <span>{{ encuesta.calificacion }}</span> -->
|
<!-- <span>{{ encuesta.calificacion }}</span> -->
|
||||||
|
|
||||||
<span *ngIf="encuesta.acceso == 'PUBLIC'" class="title"
|
<span *ngIf="encuesta.acceso == 'PUBLIC'" class="title"
|
||||||
><fa-icon class="entity-icon--access" [icon]="faUnlock"></fa-icon> {{ encuesta.nombre }}</span
|
><fa-icon class="entity-icon--access" [icon]="faUnlock"></fa-icon> {{ encuesta.nombre }}</span
|
||||||
>
|
>
|
||||||
<span *ngIf="encuesta.acceso == 'PRIVATE'" class="title"
|
<span *ngIf="encuesta.acceso == 'PRIVATE'" class="title mt-2"
|
||||||
><fa-icon class="entity-icon--access" [icon]="faLock"></fa-icon> {{ encuesta.nombre }}</span
|
><fa-icon class="entity-icon--access" [icon]="faLock"></fa-icon> {{ encuesta.nombre }}</span
|
||||||
>
|
>
|
||||||
<span class="subtitle">{{ encuesta.descripcion }}</span>
|
<span class="mt-2"
|
||||||
|
><fa-icon class="entity-icon--access" [icon]="faCalendarAlt"></fa-icon> {{
|
||||||
|
encuesta.fechaCreacion | formatShortDatetime
|
||||||
|
}}</span
|
||||||
|
>
|
||||||
|
<span class="subtitle mt-2">{{ encuesta.descripcion }}</span>
|
||||||
|
<span class="tag mt-2">{{ encuesta.categoria?.nombre | lowercase }}</span>
|
||||||
|
|
||||||
<!-- <p>
|
<!-- <p>
|
||||||
<a [routerLink]="['/encuesta', encuesta.id, 'view']">{{ encuesta.id }}</a>
|
<a [routerLink]="['/encuesta', encuesta.id, 'view']">{{ encuesta.id }}</a>
|
||||||
|
@ -148,8 +153,9 @@
|
||||||
</div> -->
|
</div> -->
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="table-responsive" id="entities" *ngIf="encuestas && encuestas.length > 0">
|
<!-- <div class="table-responsive" id="entities" *ngIf="encuestas && encuestas.length > 0">
|
||||||
<table class="table table-striped" aria-describedby="page-heading">
|
<table class="table table-striped" aria-describedby="page-heading">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
|
@ -225,8 +231,7 @@
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div> -->
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- --------------------------------------------------------------------------------------------- -->
|
<!-- --------------------------------------------------------------------------------------------- -->
|
||||||
|
|
||||||
|
|
|
@ -23,7 +23,7 @@ import { AccountService } from 'app/core/auth/account.service';
|
||||||
import { Account } from 'app/core/auth/account.model';
|
import { Account } from 'app/core/auth/account.model';
|
||||||
import { Router } from '@angular/router';
|
import { Router } from '@angular/router';
|
||||||
|
|
||||||
import { faShareAlt, faLock, faUnlock } from '@fortawesome/free-solid-svg-icons';
|
import { faShareAlt, faLock, faUnlock, faCalendarAlt } from '@fortawesome/free-solid-svg-icons';
|
||||||
|
|
||||||
import * as $ from 'jquery';
|
import * as $ from 'jquery';
|
||||||
|
|
||||||
|
@ -36,6 +36,7 @@ export class EncuestaComponent implements OnInit, AfterViewInit {
|
||||||
faShareAlt = faShareAlt;
|
faShareAlt = faShareAlt;
|
||||||
faLock = faLock;
|
faLock = faLock;
|
||||||
faUnlock = faUnlock;
|
faUnlock = faUnlock;
|
||||||
|
faCalendarAlt = faCalendarAlt;
|
||||||
|
|
||||||
account: Account | null = null;
|
account: Account | null = null;
|
||||||
usuarioExtra: UsuarioExtra | null = null;
|
usuarioExtra: UsuarioExtra | null = null;
|
||||||
|
@ -312,5 +313,6 @@ export class EncuestaComponent implements OnInit, AfterViewInit {
|
||||||
// Delete
|
// Delete
|
||||||
// Copy
|
// Copy
|
||||||
// Rename
|
// Rename
|
||||||
|
// Share
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1,12 @@
|
||||||
|
import { Pipe, PipeTransform } from '@angular/core';
|
||||||
|
|
||||||
|
import * as dayjs from 'dayjs';
|
||||||
|
|
||||||
|
@Pipe({
|
||||||
|
name: 'formatShortDatetime',
|
||||||
|
})
|
||||||
|
export class FormatShortDatetimePipe implements PipeTransform {
|
||||||
|
transform(day: dayjs.Dayjs | null | undefined): string {
|
||||||
|
return day ? day.format('dddd, MMMM D, YYYY') : '';
|
||||||
|
}
|
||||||
|
}
|
|
@ -9,6 +9,7 @@ import { HasAnyAuthorityDirective } from './auth/has-any-authority.directive';
|
||||||
import { DurationPipe } from './date/duration.pipe';
|
import { DurationPipe } from './date/duration.pipe';
|
||||||
import { FormatMediumDatetimePipe } from './date/format-medium-datetime.pipe';
|
import { FormatMediumDatetimePipe } from './date/format-medium-datetime.pipe';
|
||||||
import { FormatMediumDatePipe } from './date/format-medium-date.pipe';
|
import { FormatMediumDatePipe } from './date/format-medium-date.pipe';
|
||||||
|
import { FormatShortDatetimePipe } from './date/format-short-datetime.pipe';
|
||||||
import { SortByDirective } from './sort/sort-by.directive';
|
import { SortByDirective } from './sort/sort-by.directive';
|
||||||
import { SortDirective } from './sort/sort.directive';
|
import { SortDirective } from './sort/sort.directive';
|
||||||
import { ItemCountComponent } from './pagination/item-count.component';
|
import { ItemCountComponent } from './pagination/item-count.component';
|
||||||
|
@ -25,6 +26,7 @@ import { FilterPipe } from './pipes/filter';
|
||||||
DurationPipe,
|
DurationPipe,
|
||||||
FormatMediumDatetimePipe,
|
FormatMediumDatetimePipe,
|
||||||
FormatMediumDatePipe,
|
FormatMediumDatePipe,
|
||||||
|
FormatShortDatetimePipe,
|
||||||
SortByDirective,
|
SortByDirective,
|
||||||
SortDirective,
|
SortDirective,
|
||||||
ItemCountComponent,
|
ItemCountComponent,
|
||||||
|
@ -40,6 +42,7 @@ import { FilterPipe } from './pipes/filter';
|
||||||
DurationPipe,
|
DurationPipe,
|
||||||
FormatMediumDatetimePipe,
|
FormatMediumDatetimePipe,
|
||||||
FormatMediumDatePipe,
|
FormatMediumDatePipe,
|
||||||
|
FormatShortDatetimePipe,
|
||||||
SortByDirective,
|
SortByDirective,
|
||||||
SortDirective,
|
SortDirective,
|
||||||
ItemCountComponent,
|
ItemCountComponent,
|
||||||
|
|
|
@ -48,6 +48,15 @@
|
||||||
color: rgba(0, 0, 0, 0.54);
|
color: rgba(0, 0, 0, 0.54);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.tag {
|
||||||
|
font-size: 0.8rem;
|
||||||
|
color: rgb(248, 248, 248);
|
||||||
|
margin-top: 0.5rem;
|
||||||
|
padding: 0.2rem 1.5rem;
|
||||||
|
background-color: #2962ff94;
|
||||||
|
border-radius: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
.entity-header {
|
.entity-header {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
|
|
Loading…
Reference in New Issue