eduardo
/
datasurvey
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

agregar UI de calificaciones en encuesta

This commit is contained in:
Eduardo Quiros 2021-08-11 21:55:10 -06:00
parent e840e3d8c5
commit 513b2a8b7f
No known key found for this signature in database
GPG Key ID: B77F36C3F12720B4
4 changed files with 42 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/main/webapp/app/entities/encuesta/complete/complete.component.html
View File

@ -22,7 +22,7 @@
<div class="ds-survey preview-survey" id="entities" *ngIf="ePreguntas && ePreguntas.length > 0">
<div class="ds-survey--all-question-wrapper col-8">
<div class="ds-survey--question-wrapper card-encuesta lift" *ngFor="let ePregunta of ePreguntas; let i = index; trackBy: trackId">
<div class="ds-survey--question-wrapper card-encuesta" *ngFor="let ePregunta of ePreguntas; let i = index; trackBy: trackId">
<div
[attr.data-index]="ePregunta.id"
[attr.data-tipo]="ePregunta.tipo"
@ -79,7 +79,25 @@
</ng-container>
</ng-container>
<div class="ds-survey--option ds-survey--option--base ds-survey--open-option" *ngIf="!ePregunta.tipo">
<textarea id="{{ ePregunta.id }}" cols="33" rows="10"></textarea>
<textarea class="ds-survey--textarea" id="{{ ePregunta.id }}" cols="33" rows="10"></textarea>
</div>
</div>
</div>
<div class="ds-survey--question-wrapper card-encuesta">
<div class="ds-survey--question">
<div class="ds-survey--rating ds-survey--option ds-survey--option--base ds-survey--open-option">
<div class="ds-survey--titulo">
<span class="ds-survey--titulo--name">Calificación</span>
</div>
<div class="ds-survey--option ds-survey--option--base">
<fa-icon
*ngFor="let starNumber of this.stars"
id="{{ 'star-' + starNumber }}"
class="entity-icon--star"
[icon]="faStar"
(click)="updateRating(starNumber)"
></fa-icon>
</div>
</div>
</div>
</div>

15
src/main/webapp/app/entities/encuesta/complete/complete.component.ts
View File

@ -56,6 +56,7 @@ export class EncuestaCompleteComponent implements OnInit {
this.selectedSingleOptions = {};
this.selectedMultiOptions = [];
this.error = false;
this.calificacion = 4;
}
ngOnInit(): void {
@ -232,4 +233,18 @@ export class EncuestaCompleteComponent implements OnInit {
const result = totalValue.toString() + '.' + ratingCount.toString();
return parseFloat(result);
}
updateRating(value: number) {
this.calificacion = value;
this.stars.forEach(starNumber => {
let starElement = document.getElementById(`star-${starNumber}`);
if (starNumber > this.calificacion!) {
starElement!.classList.add('entity-icon--star--off');
starElement!.classList.remove('entity-icon--star');
} else {
starElement!.classList.add('entity-icon--star');
starElement!.classList.remove('entity-icon--star--off');
}
});
}
}

2
src/main/webapp/app/entities/plantilla/detail/plantilla-detail.component.html
View File

@ -76,7 +76,7 @@
</ng-container>
</ng-container>
<div class="ds-survey--option ds-survey--option--base ds-survey--open-option" *ngIf="!pPregunta.tipo">
<textarea cols="30" rows="10" disabled></textarea>
<textarea class="ds-survey--textarea" cols="30" rows="10" disabled></textarea>
</div>
</div>
</div>

7
src/main/webapp/content/scss/paper-dashboard/_datasurvey-survey.scss
View File

@ -99,7 +99,12 @@
}
}
.ds-survey--option {
.ds-survey--textarea {
width: 100% !important;
}
.ds-survey--option,
.ds-survey--rating {
@media screen and (max-width: 991px) {
width: 21rem !important;
}