MDL-72952 reportbuilder: UX behaviour improvements in audiences

- Show a toast notification when saving an audience
- Add form change checker when adding a new audience to prevent user from navigating away if it is not saved
- Remove expand/collapse animation in audience sidebar to be consistent with editor

Co-authored-By: Paul Holden <paulh@moodle.com>
This commit is contained in:
Mikel Martín 2021-11-04 12:09:30 +01:00
parent 8af7bec81e
commit 5a2624c472
11 changed files with 86 additions and 57 deletions

View file

@ -45,13 +45,21 @@
</span>
<span class="ml-auto">
{{#canedit}}
<button class="btn btn-link px-0" data-action="edit-audience" {{^description}}disabled{{/description}}>
{{#pix}} i/settings, core, {{#str}} editaudience, core_reportbuilder, {{title}} {{/str}} {{/pix}}
<button class="btn btn-link px-0"
data-action="edit-audience"
title="{{#str}} editaudience, core_reportbuilder, {{title}} {{/str}}"
aria-label="{{#str}} editaudience, core_reportbuilder, {{title}} {{/str}}"
{{^description}}disabled{{/description}}>
{{#pix}} i/settings, core {{/pix}}
</button>
{{/canedit}}
{{#candelete}}
<button class="btn btn-link px-0 mr-2" data-action="delete-audience" {{^description}}disabled{{/description}}>
{{#pix}} i/trash, core, {{#str}} deleteaudience, core_reportbuilder, {{title}} {{/str}} {{/pix}}
<button class="btn btn-link px-0 mr-2"
data-action="delete-audience"
title="{{#str}} deleteaudience, core_reportbuilder, {{title}} {{/str}}"
aria-label="{{#str}} deleteaudience, core_reportbuilder, {{title}} {{/str}}"
{{^description}}disabled{{/description}}>
{{#pix}} i/trash, core {{/pix}}
</button>
{{/candelete}}
</span>

View file

@ -72,7 +72,7 @@
}
}}
<div class="reportbuilder-sidebar-settings sidebar collapse notransition" id="report-settings" style="min-width: 350px;">
<div class="reportbuilder-sidebar-settings sidebar collapse" id="report-settings" style="min-width: 350px;">
<div class="dropdown d-flex justify-content-end mb-2">
<div class="mb-3 mt-2 mt-md-0 ml-md-3 w-100">

View file

@ -46,7 +46,7 @@
</button>
</div>
</div>
<div id="{{$id}}{{/id}}" class="notransition collapse {{$collapsed}}show{{/collapsed}}" aria-labelledby="{{$id}}{{/id}}-heading">
<div id="{{$id}}{{/id}}" class="collapse {{$collapsed}}show{{/collapsed}}" aria-labelledby="{{$id}}{{/id}}-heading">
<div class="card-body p-0">
{{$body}}{{/body}}
</div>