mirror of
https://github.com/scinote-eln/scinote-web.git
synced 2025-09-24 05:55:53 +08:00
Fix dropdown behavior for repository filters [SCI-6491] (#3842)
Co-authored-by: Anton <anton@scinote.net>
This commit is contained in:
parent
1e0966ac11
commit
24127af83f
3 changed files with 27 additions and 7 deletions
|
@ -75,7 +75,8 @@ window.initRepositoryFilter = () => {
|
||||||
const repositoryFilterContainer = new Vue({
|
const repositoryFilterContainer = new Vue({
|
||||||
el: '#filterContainer',
|
el: '#filterContainer',
|
||||||
data: () => ({
|
data: () => ({
|
||||||
filters: DEFAULT_FILTERS,
|
filters: [],
|
||||||
|
defaultFilters: DEFAULT_FILTERS,
|
||||||
columns: [],
|
columns: [],
|
||||||
my_modules: [],
|
my_modules: [],
|
||||||
canManageFilters: $('#filterContainer').data('can-manage-filters'),
|
canManageFilters: $('#filterContainer').data('can-manage-filters'),
|
||||||
|
@ -121,7 +122,6 @@ window.initRepositoryFilter = () => {
|
||||||
$('#modalSaveRepositoryTableFilter').data('repositoryTableFilterId', null);
|
$('#modalSaveRepositoryTableFilter').data('repositoryTableFilterId', null);
|
||||||
$('#saveRepositoryFilters').addClass('hidden');
|
$('#saveRepositoryFilters').addClass('hidden');
|
||||||
$('#overwriteFilterLink').addClass('hidden');
|
$('#overwriteFilterLink').addClass('hidden');
|
||||||
this.reloadDataTable();
|
|
||||||
},
|
},
|
||||||
reloadDataTable() {
|
reloadDataTable() {
|
||||||
this.dataTableElement.DataTable().ajax.reload();
|
this.dataTableElement.DataTable().ajax.reload();
|
||||||
|
@ -150,5 +150,9 @@ window.initRepositoryFilter = () => {
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
$('#filtersDropdownButton').on('show.bs.dropdown', () => {
|
||||||
|
$('#filtersColumnsDropdown, #savedFiltersContainer').removeClass('open');
|
||||||
|
});
|
||||||
|
|
||||||
window.repositoryFilterObject = repositoryFilterContainer;
|
window.repositoryFilterObject = repositoryFilterContainer;
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="filters-container">
|
<div class="filters-container" @click="closeDropdowns">
|
||||||
<div class="header">
|
<div class="header">
|
||||||
<div id="savedFiltersContainer" class="dropdown saved-filters-container" @click="toggleSavedFilters">
|
<div id="savedFiltersContainer" class="dropdown saved-filters-container" @click="toggleSavedFilters">
|
||||||
<div class="title" id="savedFilterDropdown">
|
<div class="title" id="savedFilterDropdown">
|
||||||
|
@ -65,7 +65,7 @@
|
||||||
export default {
|
export default {
|
||||||
name: 'FilterContainer',
|
name: 'FilterContainer',
|
||||||
props: {
|
props: {
|
||||||
filters: Array,
|
defaultFilters: Array,
|
||||||
my_modules: Array,
|
my_modules: Array,
|
||||||
container: Object,
|
container: Object,
|
||||||
columns: Array,
|
columns: Array,
|
||||||
|
@ -73,6 +73,11 @@
|
||||||
canManageFilters: Boolean,
|
canManageFilters: Boolean,
|
||||||
filterName: String, default: () => null
|
filterName: String, default: () => null
|
||||||
},
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
filters: this.defaultFilters
|
||||||
|
}
|
||||||
|
},
|
||||||
components: { ColumnElement, FilterElement, SavedFilterElement },
|
components: { ColumnElement, FilterElement, SavedFilterElement },
|
||||||
methods: {
|
methods: {
|
||||||
addFilter(column) {
|
addFilter(column) {
|
||||||
|
@ -89,7 +94,16 @@
|
||||||
this.filters = [];
|
this.filters = [];
|
||||||
this.$emit('filters:clear');
|
this.$emit('filters:clear');
|
||||||
},
|
},
|
||||||
toggleColumnsFilters() {
|
closeDropdowns() {
|
||||||
|
this.closeColumnsFilters();
|
||||||
|
this.closeSavedFilters();
|
||||||
|
},
|
||||||
|
closeColumnsFilters() {
|
||||||
|
$('#filtersColumnsDropdown').removeClass('open');
|
||||||
|
},
|
||||||
|
toggleColumnsFilters(e) {
|
||||||
|
e.stopPropagation();
|
||||||
|
this.closeSavedFilters();
|
||||||
$('#filtersColumnsDropdown').toggleClass('open');
|
$('#filtersColumnsDropdown').toggleClass('open');
|
||||||
},
|
},
|
||||||
loadFilters(filterUrl) {
|
loadFilters(filterUrl) {
|
||||||
|
@ -125,7 +139,9 @@
|
||||||
$('#savedFiltersContainer').removeClass('open');
|
$('#savedFiltersContainer').removeClass('open');
|
||||||
return true;
|
return true;
|
||||||
},
|
},
|
||||||
toggleSavedFilters() {
|
toggleSavedFilters(e) {
|
||||||
|
e.stopPropagation();
|
||||||
|
this.closeColumnsFilters();
|
||||||
$('#savedFiltersContainer').toggleClass('open');
|
$('#savedFiltersContainer').toggleClass('open');
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
|
|
@ -23,7 +23,7 @@
|
||||||
<filter-container
|
<filter-container
|
||||||
:columns.sync="columns"
|
:columns.sync="columns"
|
||||||
:my_modules.sync="my_modules"
|
:my_modules.sync="my_modules"
|
||||||
:filters.sync="filters"
|
:default-filters="defaultFilters"
|
||||||
:can-manage-filters="canManageFilters"
|
:can-manage-filters="canManageFilters"
|
||||||
:saved-filters.sync="savedFilters"
|
:saved-filters.sync="savedFilters"
|
||||||
:filter-name="filterName"
|
:filter-name="filterName"
|
||||||
|
|
Loading…
Add table
Reference in a new issue