Skip to content

Commit

Permalink
Development: Extract client duplicates into re-usable components (#7242)
Browse files Browse the repository at this point in the history
  • Loading branch information
@aplr
aplr authored Nov 28, 2023
1 parent 87f1539 commit 3b10d83
Show file tree
Hide file tree
Showing 26 changed files with 604 additions and 503 deletions.
17 changes: 10 additions & 7 deletions ...pp/app/core/legal/data-export/confirmation/data-export-confirmation-dialog.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,13 +20,16 @@ <h4 class="modal-title">
/>
<label for="request-for-other-user" class="form-check-label">{{ 'artemisApp.dataExport.requestForAnotherUser' | artemisTranslate }}</label>
</div>
<jhi-type-ahead-user-search-field *ngIf="requestForAnotherUser" [(loginOrName)]="expectedLogin"></jhi-type-ahead-user-search-field>
<jhi-type-ahead-user-search-field *ngIf="requestForAnotherUser" [(loginOrName)]="expectedLogin" />
</div>
</div>
<div class="form-group">
<label for="confirm-login" [jhiTranslate]="confirmationTextHint">Please type in your login to confirm</label>
<input id="confirm-login" type="text" class="form-control" name="confirmLogin" [(ngModel)]="enteredLogin" />
</div>
<jhi-confirm-entity-name
[entityName]="expectedLogin"
[confirmationText]="confirmationTextHint"
[disabled]="submitDisabled"
[(ngModel)]="enteredLogin"
name="confirmEntityName"
/>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal" (click)="clear()" [disabled]="submitDisabled">
Expand All @@ -36,8 +39,8 @@ <h4 class="modal-title">
id="request"
type="submit"
class="btn btn-primary"
[style.cursor]="dataExportConfirmationForm.form.invalid || this.enteredLogin !== this.expectedLogin || submitDisabled ? 'not-allowed' : 'pointer'"
[disabled]="dataExportConfirmationForm.form.invalid || this.enteredLogin !== this.expectedLogin || this.enteredLogin?.trim()?.length === 0 || submitDisabled"
[style.cursor]="dataExportConfirmationForm.invalid || submitDisabled ? 'not-allowed' : 'pointer'"
[disabled]="dataExportConfirmationForm.invalid || submitDisabled"
>
<span *ngIf="submitDisabled"><fa-icon [icon]="faSpinner" [spin]="true">&nbsp;</fa-icon>&nbsp;</span>
<fa-icon [icon]="faCheck"></fa-icon>&nbsp;
Expand Down
7 changes: 3 additions & 4 deletions ...klist-component/exam-edit-workingtime-dialog/exam-edit-working-time-dialog.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,6 @@ <h4 class="modal-title">
durationLabelText="artemisApp.examManagement.editWorkingTime.label"
[(ngModel)]="workingTimeSeconds"
[allowNegative]="true"
[showRelative]="false"
[disabled]="isLoading"
/>
</div>
Expand All @@ -29,8 +28,8 @@ <h4 class="modal-title">
confirmationText="artemisApp.examManagement.editWorkingTime.typeNameToConfirm"
[entityName]="exam.title!"
[disabled]="isLoading"
[(ngModel)]="confirmEntityName"
name="confirmEntityName"
ngModel
/>
</div>
</div>
Expand All @@ -42,8 +41,8 @@ <h4 class="modal-title">
id="confirm"
type="submit"
class="btn btn-warning"
[style.cursor]="editForm.invalid || isLoading || !isWorkingTimeValid() ? 'not-allowed' : 'pointer'"
[disabled]="editForm.invalid || isLoading || !isWorkingTimeValid()"
[style.cursor]="editForm.invalid || isLoading || !isWorkingTimeChangeValid ? 'not-allowed' : 'pointer'"
[disabled]="editForm.invalid || isLoading || !isWorkingTimeChangeValid"
>
<span *ngIf="isLoading"><fa-icon [icon]="faSpinner" [spin]="true">&nbsp;</fa-icon>&nbsp;</span>
<fa-icon *ngIf="!isLoading" [icon]="faCheck"></fa-icon>&nbsp;
Expand Down
6 changes: 2 additions & 4 deletions ...ecklist-component/exam-edit-workingtime-dialog/exam-edit-working-time-dialog.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,8 +22,6 @@ export class ExamEditWorkingTimeDialogComponent {
faSpinner = faSpinner;
faCheck = faCheck;

confirmEntityName: string;

workingTimeSeconds = 0;

get oldWorkingTime() {
Expand All @@ -44,7 +42,7 @@ export class ExamEditWorkingTimeDialogComponent {
}

confirmUpdateWorkingTime(): void {
if (!this.isWorkingTimeValid()) return;
if (!this.isWorkingTimeChangeValid) return;
this.isLoading = true;
this.examManagementService.updateWorkingTime(this.exam.course!.id!, this.exam.id!, this.workingTimeSeconds).subscribe({
next: (res: HttpResponse<Exam>) => {
Expand All @@ -59,7 +57,7 @@ export class ExamEditWorkingTimeDialogComponent {
});
}

isWorkingTimeValid(): boolean {
get isWorkingTimeChangeValid(): boolean {
return Math.abs(this.workingTimeSeconds) !== 0;
}
}
223 changes: 86 additions & 137 deletions src/main/webapp/app/exam/manage/student-exams/student-exam-detail.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,78 +39,25 @@ <h5><span jhiTranslate="artemisApp.studentExamDetail.student">Student</span></h5
</ol>
</div>
<div class="mb-3" *ngIf="!isTestExam">
<h5><span jhiTranslate="artemisApp.studentExams.workingTime">Working time</span></h5>
<h5 jhiTranslate="artemisApp.studentExams.workingTime">Working time</h5>
<form #form="ngForm" (ngSubmit)="saveWorkingTime()" class="ms-4">
<div class="mb-1 working-time-form">
<div class="input-group mb-1 d-flex justify-content-between align-items-center">
<label for="hours" class="me-4" jhiTranslate="artemisApp.studentExams.setWorkingTime">Absolute:</label>
<input
[(ngModel)]="workingTimeFormValues.hours"
(ngModelChange)="updateVariablesDependingOnWorkingTimeForm()"
[disabled]="isFormDisabled()"
id="hours"
name="hours"
type="number"
class="text-center form-control form-number-input"
min="0"
step="1"
required
/>
<label for="hours" class="input-group-text">h</label>
<input
[(ngModel)]="workingTimeFormValues.minutes"
(ngModelChange)="updateVariablesDependingOnWorkingTimeForm()"
[disabled]="isFormDisabled()"
id="minutes"
name="minutes"
type="number"
class="text-center form-control form-number-input"
min="0"
max="59"
step="1"
required
/>
<label for="minutes" class="input-group-text">min</label>
<input
[(ngModel)]="workingTimeFormValues.seconds"
(ngModelChange)="updateVariablesDependingOnWorkingTimeForm()"
[disabled]="isFormDisabled()"
id="seconds"
name="seconds"
type="number"
class="text-center form-control form-number-input"
min="0"
max="59"
step="1"
required
/>
<label for="seconds" class="input-group-text">s</label>
</div>
<div class="input-group d-flex justify-content-between align-items-center">
<label for="percent" class="me-4 flex-fill" jhiTranslate="artemisApp.studentExams.setWorkingTimeRelative">Addition relative to regular working time:</label>
<input
[(ngModel)]="workingTimeFormValues.percent"
(ngModelChange)="updateWorkingTimeDuration()"
[disabled]="isFormDisabled()"
id="percent"
name="percent"
type="number"
class="text-center form-control form-number-input"
min="-100"
step=".01"
required
/>
<label for="percent" class="input-group-text">%</label>
</div>
</div>
<jhi-working-time-control
name="workingTime"
[relative]="true"
[disabled]="isWorkingTimeFormDisabled"
[(ngModel)]="workingTimeSeconds"
[exam]="studentExam.exam"
durationLabelText="artemisApp.studentExams.setWorkingTime"
relativeLabelText="artemisApp.studentExams.setWorkingTimeRelative"
/>

<p *ngIf="this.workingTimeFormValues.percent">
<p *ngIf="workingTimeSeconds !== studentExam.workingTime">
{{ 'artemisApp.studentExamDetail.endOfIndividualWorkingTime' | artemisTranslate }} {{ individualEndDate | artemisDate: 'long-date' }}
-
{{ individualEndDate | artemisDate: 'time' : true }}
</p>

<button id="save" type="submit" class="btn btn-primary me-2" [disabled]="!form.valid || isFormDisabled()">
<button id="save" type="submit" class="btn btn-primary mt-2" [disabled]="!form.valid || isWorkingTimeFormDisabled">
<fa-icon [icon]="faSave"></fa-icon>
<span jhiTranslate="entity.action.save">Save</span>
</button>
Expand Down Expand Up @@ -140,7 +87,7 @@ <h5><span jhiTranslate="artemisApp.studentExams.participationStatus">Participati
{{ studentExam.submissionDate | artemisDate: 'long' : true }}
</li>
<li *ngIf="gradingScaleExists">
<strong>{{ getGradeExplanation() | artemisTranslate }}:</strong>
<strong>{{ gradeExplanation | artemisTranslate }}:</strong>
{{ grade }}
</li>
<li *ngIf="gradeAfterBonus !== undefined">
Expand All @@ -154,7 +101,7 @@ <h5><span jhiTranslate="artemisApp.studentExams.participationStatus">Participati
</ol>

<div
[ngbTooltip]="!isExamOver() ? ('artemisApp.studentExamDetail.disabledChangeSubmissionStateButtonExplanation' | artemisTranslate) : ''"
[ngbTooltip]="!isExamOver ? ('artemisApp.studentExamDetail.disabledChangeSubmissionStateButtonExplanation' | artemisTranslate) : ''"
placement="right"
class="d-inline"
>
Expand All @@ -163,7 +110,7 @@ <h5><span jhiTranslate="artemisApp.studentExams.participationStatus">Participati
type="button"
*ngIf="course?.isAtLeastInstructor"
(click)="openConfirmationModal(toggleSubmitPopUp)"
[disabled]="!isExamOver() || isSaving"
[disabled]="!isExamOver || isSaving"
id="adjust-submitted-state-button"
>
<span *ngIf="!studentExam.submitted; else toggleNotSubmitted" jhiTranslate="entity.action.toggleToSubmitted"></span>
Expand Down Expand Up @@ -205,6 +152,10 @@ <h4 class="modal-title">
</button>
</div>
</ng-template>
<button class="btn btn-danger mb-3" *ngIf="course?.isAtLeastInstructor && isExamOver" type="button" (click)="openConfirmationModal(toggleSubmitPopUp)" [disabled]="isSaving">
<span *ngIf="!studentExam.submitted" jhiTranslate="entity.action.toggleToSubmitted"></span>
<span *ngIf="studentExam.submitted" jhiTranslate="entity.action.toggleToUnsubmitted"></span>
</button>

<div class="mb-3">
<h5><span jhiTranslate="artemisApp.studentExams.summary">Student Summary</span></h5>
Expand Down Expand Up @@ -268,74 +219,72 @@ <h5><span jhiTranslate="artemisApp.studentExams.examSessions">Sessions</span></h
</div>

<div class="mb-3 mt-3">
<h5><span jhiTranslate="artemisApp.studentExamDetail.exercises">Exercises</span></h5>
<div>
<table class="table table-striped">
<thead>
<tr>
<th class="d-md-table-cell">
<span jhiTranslate="artemisApp.studentExamDetail.id">ID</span>
</th>
<th>
<span jhiTranslate="artemisApp.studentExamDetail.type">Type</span>
</th>
<th>
<span jhiTranslate="artemisApp.studentExamDetail.title">Title</span>
</th>
<th>
<span jhiTranslate="artemisApp.studentExamDetail.result">Your points</span>
</th>
<th>
<span jhiTranslate="artemisApp.exam.examSummary.points.maxPoints">Achievable points</span>
</th>
<th>
<span jhiTranslate="artemisApp.exam.examSummary.points.maxBonus">Achievable bonus points</span>
</th>
<th>
<span jhiTranslate="artemisApp.studentExamDetail.reviewer">Reviewer</span>
</th>
<th>
<span jhiTranslate="artemisApp.studentExamDetail.hasComplaint">Has Complaint</span>
</th>
<th>
<span jhiTranslate="artemisApp.assessment.dashboard.columns.action">Action</span>
</th>
</tr>
</thead>
<tbody>
<ng-template ngFor let-exercise [ngForOf]="studentExam.exercises">
<tr
jhi-student-exam-detail-table-row
[course]="course"
[examId]="examId"
[exercise]="exercise"
[busy]="isSaving"
[isTestRun]="isTestRun"
[studentExam]="studentExam"
[achievedPointsPerExercise]="achievedPointsPerExercise"
></tr>
</ng-template>
<tr>
<td></td>
<td></td>
<td class="align-middle">
<span class="text-decoration-underline" jhiTranslate="artemisApp.examScores.overallPointsColumn">Overall Points</span>
</td>
<td class="align-middle">
<u> {{ achievedTotalPoints }} </u>
</td>
<td class="align-middle">
<u> {{ maxTotalPoints }} </u>
</td>
<td class="align-middle">
<u> {{ bonusTotalPoints }} </u>
</td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
</div>
<h5 jhiTranslate="artemisApp.studentExamDetail.exercises">Exercises</h5>
<table class="table table-striped">
<thead>
<tr>
<th class="d-md-table-cell">
<span jhiTranslate="artemisApp.studentExamDetail.id">ID</span>
</th>
<th>
<span jhiTranslate="artemisApp.studentExamDetail.type">Type</span>
</th>
<th>
<span jhiTranslate="artemisApp.studentExamDetail.title">Title</span>
</th>
<th>
<span jhiTranslate="artemisApp.studentExamDetail.result">Your points</span>
</th>
<th>
<span jhiTranslate="artemisApp.exam.examSummary.points.maxPoints">Achievable points</span>
</th>
<th>
<span jhiTranslate="artemisApp.exam.examSummary.points.maxBonus">Achievable bonus points</span>
</th>
<th>
<span jhiTranslate="artemisApp.studentExamDetail.reviewer">Reviewer</span>
</th>
<th>
<span jhiTranslate="artemisApp.studentExamDetail.hasComplaint">Has Complaint</span>
</th>
<th>
<span jhiTranslate="artemisApp.assessment.dashboard.columns.action">Action</span>
</th>
</tr>
</thead>
<tbody>
<ng-template ngFor let-exercise [ngForOf]="studentExam.exercises">
<tr
jhi-student-exam-detail-table-row
[course]="course"
[examId]="examId"
[exercise]="exercise"
[busy]="isSaving"
[isTestRun]="isTestRun"
[studentExam]="studentExam"
[achievedPointsPerExercise]="achievedPointsPerExercise"
></tr>
</ng-template>
<tr>
<td></td>
<td></td>
<td class="align-middle">
<span class="text-decoration-underline" jhiTranslate="artemisApp.examScores.overallPointsColumn">Overall Points</span>
</td>
<td class="align-middle">
<u> {{ achievedTotalPoints }} </u>
</td>
<td class="align-middle">
<u> {{ maxTotalPoints }} </u>
</td>
<td class="align-middle">
<u> {{ bonusTotalPoints }} </u>
</td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
</div>
</div>
Loading

0 comments on commit 3b10d83

Please sign in to comment.