Skip to content

Commit 0fdb03a

Browse files
authored
Merge pull request #4199 from albertgasset/MOBILE-3893
MOBILE-3893 assign: Improve UX of buttons
2 parents 1bb5b43 + 9302113 commit 0fdb03a

File tree

2 files changed

+33
-32
lines changed

2 files changed

+33
-32
lines changed

src/addons/mod/assign/components/submission/addon-mod-assign-submission.html

Lines changed: 33 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -162,25 +162,34 @@ <h2>{{ 'addon.mod_assign.userswhoneedtosubmit' | translate: {$a: ''} }}</h2>
162162
</ng-container>
163163
</ng-container>
164164

165-
<!-- Add or edit submission. -->
165+
<!-- Edit and remove buttons. -->
166+
<div *ngIf="loaded && !isSubmittedForGrading && canEdit && !unsupportedEditPlugins.length &&
167+
!showErrorStatementEdit && (editedOffline || (!removedOffline && userSubmission?.status &&
168+
userSubmission?.status !== statusNew && userSubmission?.status !== statusReopened))"
169+
class="list-item-limited-width">
170+
<div class="adaptable-buttons-row">
171+
<ion-button expand="block" fill="outline" class="ion-margin ion-text-wrap" (click)="goToEdit()">
172+
<ion-icon name="fas-pen" slot="start" aria-hidden="true" />
173+
{{ 'addon.mod_assign.editsubmission' | translate }}
174+
</ion-button>
175+
<ion-button *ngIf="isRemoveAvailable" fill="outline" expand="block" class="ion-margin ion-text-wrap"
176+
(click)="remove()">
177+
<ion-icon name="fas-trash" color="danger" slot="start" aria-hidden="true" />
178+
{{ 'addon.mod_assign.removesubmission' | translate }}
179+
</ion-button>
180+
</div>
181+
</div>
182+
183+
<!-- Add and submit buttons. -->
166184
<div collapsible-footer *ngIf="loaded && !isSubmittedForGrading" [hidden]="selectedTab !== 'submission'" slot="fixed">
167185
<div class="list-item-limited-width" *ngIf="canEdit || canSubmit">
168186
<ng-container *ngIf="canEdit">
169-
<ng-container *ngIf=" !unsupportedEditPlugins.length && !showErrorStatementEdit">
170-
<!-- If has offline data, show edit and remove. -->
171-
<div *ngIf="editedOffline" class="adaptable-buttons-row">
172-
<ion-button expand="block" class="ion-margin ion-text-wrap" (click)="goToEdit()">
173-
{{ 'addon.mod_assign.editsubmission' | translate }}
174-
</ion-button>
175-
<ion-button *ngIf="isRemoveAvailable" expand="block" class="ion-margin ion-text-wrap"
176-
(click)="remove()">
177-
{{ 'addon.mod_assign.removesubmission' | translate }}
178-
</ion-button>
179-
</div>
187+
<div *ngIf="!unsupportedEditPlugins.length && !showErrorStatementEdit" class="adaptable-buttons-row">
180188
<!-- If no submission or is new, show add submission. -->
181-
<ion-button expand="block" class="ion-text-wrap" (click)="goToEdit()" *ngIf="!editedOffline &&
182-
(removedOffline || !userSubmission || !userSubmission!.status ||
183-
userSubmission!.status === statusNew)">
189+
<ion-button expand="block" class="ion-margin ion-text-wrap" (click)="goToEdit()" *ngIf="
190+
!editedOffline &&
191+
(removedOffline || !userSubmission || !userSubmission!.status ||
192+
userSubmission!.status === statusNew)">
184193
<ng-container *ngIf="!assign?.timelimit || userSubmission?.timestarted">
185194
{{ 'addon.mod_assign.addsubmission' | translate }}
186195
</ng-container>
@@ -190,27 +199,15 @@ <h2>{{ 'addon.mod_assign.userswhoneedtosubmit' | translate: {$a: ''} }}</h2>
190199
</ion-button>
191200
<!-- If reopened, show addfromprevious and addnewattempt. -->
192201
<ng-container *ngIf="!editedOffline && !removedOffline && userSubmission?.status === statusReopened">
193-
<ion-button *ngIf="!isPreviousAttemptEmpty" expand="block" class="ion-text-wrap"
202+
<ion-button *ngIf="!isPreviousAttemptEmpty" expand="block" class="ion-margin ion-text-wrap"
194203
(click)="copyPrevious()">
195204
{{ 'addon.mod_assign.addnewattemptfromprevious' | translate }}
196205
</ion-button>
197-
<ion-button expand="block" class="ion-text-wrap" (click)="goToEdit()">
206+
<ion-button expand="block" class="ion-margin ion-text-wrap" (click)="goToEdit()">
198207
{{ 'addon.mod_assign.addnewattempt' | translate }}
199208
</ion-button>
200209
</ng-container>
201-
<!-- Else show editsubmission and removesubmission. -->
202-
<div *ngIf="!editedOffline && !removedOffline && userSubmission && userSubmission!.status
203-
&& userSubmission!.status !== statusNew && userSubmission!.status !== statusReopened"
204-
class="adaptable-buttons-row">
205-
<ion-button expand="block" class="ion-margin ion-text-wrap" (click)="goToEdit()">
206-
{{ 'addon.mod_assign.editsubmission' | translate }}
207-
</ion-button>
208-
<ion-button *ngIf="isRemoveAvailable" expand="block" class="ion-margin ion-text-wrap"
209-
(click)="remove()">
210-
{{ 'addon.mod_assign.removesubmission' | translate }}
211-
</ion-button>
212-
</div>
213-
</ng-container>
210+
</div>
214211
<ion-item class="core-danger-item ion-text-wrap"
215212
*ngIf="(unsupportedEditPlugins.length && !showErrorStatementEdit)|| showErrorStatementEdit">
216213
<ion-label>
@@ -246,10 +243,14 @@ <h2>{{ 'addon.mod_assign.userswhoneedtosubmit' | translate: {$a: ''} }}</h2>
246243
<!-- Submit button. -->
247244
<ion-item class="ion-text-wrap" *ngIf="!showErrorStatementSubmit">
248245
<ion-label>
249-
<ion-button expand="block" class="ion-text-wrap" (click)="submitForGrading(acceptStatement)">
246+
<ion-button expand="block" class="ion-text-wrap ion-no-margin ion-margin-bottom"
247+
(click)="submitForGrading(acceptStatement)">
250248
{{ 'addon.mod_assign.submitassignment' | translate }}
251249
</ion-button>
252-
<p>{{ 'addon.mod_assign.submitassignment_help' | translate }}</p>
250+
<p>
251+
<ion-icon name="fas-circle-info" color="info" aria-hidden=" true" />
252+
{{ 'addon.mod_assign.submitassignment_help' | translate }}
253+
</p>
253254
</ion-label>
254255
</ion-item>
255256
<!-- Error because we lack submissions statement. -->

0 commit comments

Comments
 (0)