github-mirror/BookStack
2
0
Fork 0
mirror of https://github.com/BookStackApp/BookStack.git synced 2024-11-27 10:49:45 +08:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

Fixed audit log user dropdown usability issue

Browse Source 
User search input blur would trigger the submission of the search
filters which would cause strange thing where you'd click on a search
filtered user which would blur the input hence submit, but the user
would think they've clicked the user and the page would reload but the
input had not updated at that point.

Related to #2863
This commit is contained in:
Dan Brown 2021-08-04 20:48:23 +01:00
parent b1ee1a856f
commit 7a8954ee65
No known key found for this signature in database
GPG Key ID: 46D9F943C24A2EF9
4 changed files with 12 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
resources/js/components/dropdown-search.js
View File

@ -27,6 +27,7 @@ class DropdownSearch {
this.runLocalSearch(input);
} else {
this.toggleLoading(true);
this.listContainerElem.innerHTML = '';
this.runAjaxSearch(input);
}
}

9
resources/js/components/submit-on-change.js
View File

@ -6,7 +6,14 @@
class SubmitOnChange {
setup() {
this.$el.addEventListener('change', () => {
this.filter = this.$opts.filter;
this.$el.addEventListener('change', (event) => {
if (this.filter && !event.target.matches(this.filter)) {
return;
}
const form = this.$el.closest('form');
if (form) {
form.submit();

1
resources/js/components/user-select.js
View File

@ -3,7 +3,6 @@ import {onChildEvent} from "../services/dom";
class UserSelect {
setup() {
this.input = this.$refs.input;
this.userInfoContainer = this.$refs.userInfo;

4
resources/views/settings/audit.blade.php
View File

@ -41,7 +41,9 @@
</div>
@endforeach
<div class="form-group ml-auto" component="submit-on-change">
<div class="form-group ml-auto"
component="submit-on-change"
option:submit-on-change:filter='[name="user"]'>
<label for="owner">{{ trans('settings.audit_table_user') }}</label>
@include('components.user-select', ['user' => $listDetails['user'] ? \BookStack\Auth\User::query()->find($listDetails['user']) : null, 'name' => 'user', 'compact' => true])
</div>