forked from EVOgeek/Vmeda.Online
		
	
		
			
				
	
	
		
			214 lines
		
	
	
		
			11 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			214 lines
		
	
	
		
			11 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <!-- Buttons to add to the header. -->
 | |
| <core-navbar-buttons slot="end">
 | |
|     <ion-button fill="clear" (click)="openModuleSummary()" aria-haspopup="true" [attr.aria-label]="'core.info' | translate">
 | |
|         <ion-icon name="fas-info-circle" slot="icon-only" aria-hidden="true"></ion-icon>
 | |
|     </ion-button>
 | |
| </core-navbar-buttons>
 | |
| 
 | |
| <!-- Content. -->
 | |
| <core-loading [hideUntil]="!showLoading">
 | |
| 
 | |
|     <!-- Activity info. -->
 | |
|     <core-course-module-info [module]="module" [description]="description" [component]="component" [componentId]="componentId"
 | |
|         [courseId]="courseId" [hasDataToSync]="hasOffline">
 | |
|     </core-course-module-info>
 | |
| 
 | |
|     <core-tabs [hideUntil]="tabsReady" [selectedIndex]="firstSelectedTab">
 | |
|         <core-tab [title]="'addon.mod_feedback.overview' | translate" id="overview" (ionSelect)="tabChanged('overview')">
 | |
|             <ng-template>
 | |
|                 <ng-container *ngTemplateOutlet="tabOverview"></ng-container>
 | |
|             </ng-template>
 | |
|         </core-tab>
 | |
|         <core-tab *ngIf="showAnalysis && access && access.canviewreports" id="analysis" [title]="'addon.mod_feedback.analysis' | translate"
 | |
|             (ionSelect)="tabChanged('analysis')">
 | |
|             <ng-template>
 | |
|                 <ng-container *ngTemplateOutlet="tabAnalysis"></ng-container>
 | |
|             </ng-template>
 | |
|         </core-tab>
 | |
| 
 | |
|         <core-tab *ngIf="showAnalysis && access && !access.canviewreports" id="analysis"
 | |
|             [title]="'addon.mod_feedback.completed_feedbacks' | translate" (ionSelect)="tabChanged('analysis')">
 | |
|             <ng-template>
 | |
|                 <ng-container *ngTemplateOutlet="tabAnalysis"></ng-container>
 | |
|             </ng-template>
 | |
|         </core-tab>
 | |
|     </core-tabs>
 | |
| 
 | |
|     <div collapsible-footer *ngIf="!showLoading" slot="fixed">
 | |
|         <div class="list-item-limited-width adaptable-buttons-row"
 | |
|             *ngIf="access && (access.canedititems || access.canviewreports || !access.isempty)">
 | |
|             <ion-button expand="block" fill="outline" (click)="gotoAnswerQuestions(true)" class="ion-margin ion-text-wrap">
 | |
|                 <ion-icon name="fas-search" slot="start" aria-hidden="true"></ion-icon>
 | |
|                 {{ 'addon.mod_feedback.preview' | translate }}
 | |
|             </ion-button>
 | |
|             <ion-button *ngIf="access.cancomplete && access.cansubmit && access.isopen" expand="block" (click)="gotoAnswerQuestions()"
 | |
|                 class="ion-margin ion-text-wrap">
 | |
|                 <ng-container *ngIf="!goPage">
 | |
|                     {{ 'addon.mod_feedback.complete_the_form' | translate }}
 | |
|                 </ng-container>
 | |
|                 <ng-container *ngIf="goPage">
 | |
|                     {{ 'addon.mod_feedback.continue_the_form' | translate }}
 | |
|                 </ng-container>
 | |
|             </ion-button>
 | |
|         </div>
 | |
| 
 | |
|         <core-course-module-navigation [courseId]="courseId" [currentModule]="module" (completionChanged)="onCompletionChange()">
 | |
|         </core-course-module-navigation>
 | |
|     </div>
 | |
| </core-loading>
 | |
| 
 | |
| <ng-template #basicInfo>
 | |
|     <ion-list *ngIf="access && access.canviewanalysis && !access.isempty">
 | |
|         <ion-item class="ion-text-wrap core-group-selector" *ngIf="groupInfo && (groupInfo.separateGroups || groupInfo.visibleGroups)">
 | |
|             <ion-label id="addon-feedback-groupslabel">
 | |
|                 <ng-container *ngIf="groupInfo.separateGroups">{{'core.groupsseparate' | translate }}</ng-container>
 | |
|                 <ng-container *ngIf="groupInfo.visibleGroups">{{'core.groupsvisible' | translate }}</ng-container>
 | |
|             </ion-label>
 | |
|             <ion-select [(ngModel)]="group" (ionChange)="setGroup(group)" aria-labelledby="addon-feedback-groupslabel"
 | |
|                 interface="action-sheet" [interfaceOptions]="{header: 'core.group' | translate}">
 | |
|                 <ion-select-option *ngFor="let groupOpt of groupInfo.groups" [value]="groupOpt.id">
 | |
|                     {{groupOpt.name}}
 | |
|                 </ion-select-option>
 | |
|             </ion-select>
 | |
|         </ion-item>
 | |
|         <ion-item class="ion-text-wrap" (click)="openAttempts()" [detail]="access.canviewreports && completedCount > 0"
 | |
|             [button]="access.canviewreports && completedCount > 0">
 | |
|             <ion-label>
 | |
|                 <h2>{{ 'addon.mod_feedback.completed_feedbacks' | translate }}</h2>
 | |
|             </ion-label>
 | |
|             <ion-badge slot="end">
 | |
|                 <span aria-hidden="true">{{completedCount}}</span>
 | |
|                 <span class="sr-only">
 | |
|                     {{ 'addon.mod_feedback.completedfeedbackscountdescription' | translate:{count: completedCount} }}
 | |
|                 </span>
 | |
|             </ion-badge>
 | |
|         </ion-item>
 | |
|         <ion-item class="ion-text-wrap" *ngIf="!access.isanonymous && access.canviewreports" (click)="openNonRespondents()" detail="true"
 | |
|             button>
 | |
|             <ion-label>
 | |
|                 <h2>{{ 'addon.mod_feedback.show_nonrespondents' | translate }}</h2>
 | |
|             </ion-label>
 | |
|         </ion-item>
 | |
|         <ion-item class="ion-text-wrap">
 | |
|             <ion-label>
 | |
|                 <h2>{{ 'addon.mod_feedback.questions' | translate }}</h2>
 | |
|             </ion-label>
 | |
|             <ion-badge slot="end">
 | |
|                 <span aria-hidden="true">{{itemsCount}}</span>
 | |
|                 <span class="sr-only">
 | |
|                     {{ 'addon.mod_feedback.questionscountdescription' | translate:{count: itemsCount} }}
 | |
|                 </span>
 | |
|             </ion-badge>
 | |
|         </ion-item>
 | |
|     </ion-list>
 | |
| </ng-template>
 | |
| 
 | |
| <!-- Template to render the overview. -->
 | |
| <ng-template #tabOverview>
 | |
|     <core-loading [hideUntil]="tabsLoaded.overview">
 | |
|         <ng-container *ngTemplateOutlet="basicInfo"></ng-container>
 | |
| 
 | |
|         <ion-card class="core-info-card" *ngIf="access && access.cancomplete && !access.isopen">
 | |
|             <ion-item>
 | |
|                 <ion-icon name="fas-question-circle" slot="start" aria-hidden="true"></ion-icon>
 | |
|                 <ion-label>{{ 'addon.mod_feedback.feedback_is_not_open' | translate }}</ion-label>
 | |
|             </ion-item>
 | |
|         </ion-card>
 | |
| 
 | |
|         <ion-card class="core-success-card" *ngIf="access && access.cancomplete && access.isopen && !access.cansubmit">
 | |
|             <ion-item>
 | |
|                 <ion-icon name="fas-check" slot="start" aria-hidden="true"></ion-icon>
 | |
|                 <ion-label>{{ 'addon.mod_feedback.this_feedback_is_already_submitted' | translate }}</ion-label>
 | |
|             </ion-item>
 | |
|         </ion-card>
 | |
| 
 | |
|         <ion-list *ngIf="access && (access.canedititems || access.canviewreports || !access.isempty)">
 | |
|             <ion-item class="ion-text-wrap" *ngIf="access.canedititems && overview.timeopen">
 | |
|                 <ion-label>
 | |
|                     <h2>{{ 'addon.mod_feedback.feedbackopen' | translate }}</h2>
 | |
|                     <p>{{overview.openTimeReadable}}</p>
 | |
|                 </ion-label>
 | |
|             </ion-item>
 | |
|             <ion-item class="ion-text-wrap" *ngIf="access.canedititems && overview.timeclose">
 | |
|                 <ion-label>
 | |
|                     <h2>{{ 'addon.mod_feedback.feedbackclose' | translate }}</h2>
 | |
|                     <p>{{overview.closeTimeReadable}}</p>
 | |
|                 </ion-label>
 | |
|             </ion-item>
 | |
|             <ion-item class="ion-text-wrap" *ngIf="access.canedititems && feedback && feedback.page_after_submit">
 | |
|                 <ion-label>
 | |
|                     <h2>{{ 'addon.mod_feedback.page_after_submit' | translate }}</h2>
 | |
|                     <core-format-text [component]="component" [componentId]="componentId" [text]="feedback.page_after_submit"
 | |
|                         contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
 | |
|                     </core-format-text>
 | |
|                 </ion-label>
 | |
|             </ion-item>
 | |
|             <ng-container *ngIf="!access.isempty">
 | |
|                 <ion-item class="ion-text-wrap">
 | |
|                     <ion-label>
 | |
|                         <h2>{{ 'addon.mod_feedback.mode' | translate }}</h2>
 | |
|                         <p *ngIf="access.isanonymous">{{ 'addon.mod_feedback.anonymous' | translate }}</p>
 | |
|                         <p *ngIf="!access.isanonymous">{{ 'addon.mod_feedback.non_anonymous' | translate }}</p>
 | |
|                     </ion-label>
 | |
|                 </ion-item>
 | |
|             </ng-container>
 | |
|         </ion-list>
 | |
|     </core-loading>
 | |
| </ng-template>
 | |
| 
 | |
| <!-- Template to render the analysis. -->
 | |
| <ng-template #tabAnalysis>
 | |
|     <core-loading [hideUntil]="tabsLoaded.analysis">
 | |
|         <ng-container *ngTemplateOutlet="basicInfo"></ng-container>
 | |
| 
 | |
|         <ng-container *ngIf="access && (access.canedititems || !access.isempty)">
 | |
|             <ion-card class="core-info-card" *ngIf="warning">
 | |
|                 <ion-item>
 | |
|                     <ion-icon name="fas-question-circle" slot="start" aria-hidden="true"></ion-icon>
 | |
|                     <ion-label>{{ warning }}</ion-label>
 | |
|                 </ion-item>
 | |
|             </ion-card>
 | |
| 
 | |
|             <ion-list *ngIf="items && items.length">
 | |
|                 <ion-item class="ion-text-wrap core-analysis" *ngFor="let item of items">
 | |
|                     <ion-label>
 | |
|                         <p class="item-heading">
 | |
|                             {{item.num}}. <core-format-text [component]="component" [componentId]="componentId" [text]="item.name"
 | |
|                                 contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId">
 | |
|                             </core-format-text>
 | |
|                         </p>
 | |
|                         <p>
 | |
|                             <core-format-text [component]="component" [componentId]="componentId" [text]="item.label" contextLevel="module"
 | |
|                                 [contextInstanceId]="module.id" [courseId]="courseId">
 | |
|                             </core-format-text>
 | |
|                         </p>
 | |
|                         <ng-container [ngSwitch]="item.templateName">
 | |
|                             <ng-container *ngSwitchCase="'numeric'">
 | |
|                                 <ul>
 | |
|                                     <li *ngFor="let data of item.data">{{ data }}</li>
 | |
|                                 </ul>
 | |
|                                 <p>{{ 'addon.mod_feedback.average' | translate }}: {{item.average | number : '1.2-2'}}</p>
 | |
|                             </ng-container>
 | |
|                             <ng-container *ngSwitchCase="'list'">
 | |
|                                 <ul>
 | |
|                                     <ng-container *ngFor="let data of item.data">
 | |
|                                         <li *ngIf="data">{{ data }}</li>
 | |
|                                     </ng-container>
 | |
|                                 </ul>
 | |
|                             </ng-container>
 | |
|                             <ng-container *ngSwitchCase="'chart'">
 | |
|                                 <core-chart [type]="item.chartType" [data]="item.chartData" [labels]="item.labels" height="300"
 | |
|                                     contextLevel="module" [contextInstanceId]="module.id" [wsNotFiltered]="true" [courseId]="courseId">
 | |
|                                 </core-chart>
 | |
|                                 <p *ngIf="item.average">
 | |
|                                     {{ 'addon.mod_feedback.average' | translate }}: {{item.average | number : '1.2-2'}}
 | |
|                                 </p>
 | |
|                             </ng-container>
 | |
|                         </ng-container>
 | |
|                     </ion-label>
 | |
|                 </ion-item>
 | |
|             </ion-list>
 | |
|         </ng-container>
 | |
|     </core-loading>
 | |
| </ng-template>
 |