Update date display for each survey in user survey list

This commit is contained in:
Pablo Bonilla 2021-07-16 01:36:36 -06:00
parent f76af324a0
commit ddd8ebcb97
No known key found for this signature in database
GPG Key ID: 46877262B8DE47E2
5 changed files with 39 additions and 8 deletions

View File

@ -84,16 +84,21 @@
<br />
<br />
<br />
<span>{{ encuesta.fechaCreacion | formatMediumDatetime }}</span>
<!-- <span>{{ encuesta.calificacion }}</span> -->
<span *ngIf="encuesta.acceso == 'PUBLIC'" class="title"
><fa-icon class="entity-icon--access" [icon]="faUnlock"></fa-icon>&nbsp;&nbsp;{{ 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>&nbsp;&nbsp;{{ encuesta.nombre }}</span
>
<span class="subtitle">{{ encuesta.descripcion }}</span>
<span class="mt-2"
><fa-icon class="entity-icon--access" [icon]="faCalendarAlt"></fa-icon>&nbsp;&nbsp;{{
encuesta.fechaCreacion | formatShortDatetime
}}</span
>
<span class="subtitle mt-2">{{ encuesta.descripcion }}</span>
<span class="tag mt-2">{{ encuesta.categoria?.nombre | lowercase }}</span>
<!-- <p>
<a [routerLink]="['/encuesta', encuesta.id, 'view']">{{ encuesta.id }}</a>
@ -139,7 +144,7 @@
<fa-icon icon="pencil-alt"></fa-icon>
<span class="d-none d-md-inline" jhiTranslate="entity.action.edit">Edit</span>
</button>
<button type="submit" (click)="delete(encuesta)" class="btn btn-danger btn-sm" data-cy="entityDeleteButton">
<fa-icon icon="times"></fa-icon>
<span class="d-none d-md-inline" jhiTranslate="entity.action.delete">Delete</span>
@ -148,8 +153,9 @@
</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">
<thead>
<tr>
@ -225,8 +231,7 @@
</tr>
</tbody>
</table>
</div>
</div>
</div> -->
<!-- --------------------------------------------------------------------------------------------- -->

View File

@ -23,7 +23,7 @@ import { AccountService } from 'app/core/auth/account.service';
import { Account } from 'app/core/auth/account.model';
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';
@ -36,6 +36,7 @@ export class EncuestaComponent implements OnInit, AfterViewInit {
faShareAlt = faShareAlt;
faLock = faLock;
faUnlock = faUnlock;
faCalendarAlt = faCalendarAlt;
account: Account | null = null;
usuarioExtra: UsuarioExtra | null = null;
@ -312,5 +313,6 @@ export class EncuestaComponent implements OnInit, AfterViewInit {
// Delete
// Copy
// Rename
// Share
}
}

View File

@ -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') : '';
}
}

View File

@ -9,6 +9,7 @@ import { HasAnyAuthorityDirective } from './auth/has-any-authority.directive';
import { DurationPipe } from './date/duration.pipe';
import { FormatMediumDatetimePipe } from './date/format-medium-datetime.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 { SortDirective } from './sort/sort.directive';
import { ItemCountComponent } from './pagination/item-count.component';
@ -25,6 +26,7 @@ import { FilterPipe } from './pipes/filter';
DurationPipe,
FormatMediumDatetimePipe,
FormatMediumDatePipe,
FormatShortDatetimePipe,
SortByDirective,
SortDirective,
ItemCountComponent,
@ -40,6 +42,7 @@ import { FilterPipe } from './pipes/filter';
DurationPipe,
FormatMediumDatetimePipe,
FormatMediumDatePipe,
FormatShortDatetimePipe,
SortByDirective,
SortDirective,
ItemCountComponent,

View File

@ -48,6 +48,15 @@
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 {
display: flex;
justify-content: space-between;