Adds textual search to collections list.
This commit is contained in:
Mateus Machado Luna
parent
004ac92431
commit
eb242ef739
|
|
@ -154,9 +154,9 @@
|
|||
'approve',
|
||||
'notApprove'
|
||||
]),
|
||||
getThis(){
|
||||
return this;
|
||||
},
|
||||
// getThis(){
|
||||
// return this;
|
||||
// },
|
||||
approveActivity(activity) {
|
||||
this.approve(activity.id)
|
||||
.then(data => {
|
||||
|
|
|
|||
|
|
@ -456,7 +456,7 @@
|
|||
<style lang="scss" scoped>
|
||||
@import '../../scss/_variables.scss';
|
||||
|
||||
.sub-header {
|
||||
.sub-header {
|
||||
min-height: $subheader-height;
|
||||
height: $header-height;
|
||||
padding-left: 0;
|
||||
|
|
@ -509,7 +509,7 @@
|
|||
color: $blue5;
|
||||
height: 27px;
|
||||
font-size: 18px !important;
|
||||
height: 1.5rem !important;
|
||||
height: 1.75rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -122,6 +122,23 @@
|
|||
</option>
|
||||
</b-select>
|
||||
</b-field>
|
||||
<b-field class="header-item">
|
||||
<div class="control has-icons-right is-small is-clearfix">
|
||||
<input
|
||||
class="input is-small"
|
||||
:placeholder="$i18n.get('instruction_search')"
|
||||
type="search"
|
||||
:aria-label="$i18n.get('instruction_search') + ' ' + $i18n.get('collections')"
|
||||
autocomplete="on"
|
||||
v-model="searchQuery"
|
||||
@keyup.enter="searchCollections()">
|
||||
<span
|
||||
@click="searchCollections()"
|
||||
class="icon is-right">
|
||||
<i class="tainacan-icon tainacan-icon-search" />
|
||||
</span>
|
||||
</div>
|
||||
</b-field>
|
||||
</div>
|
||||
|
||||
<div class="above-subheader">
|
||||
|
|
@ -310,6 +327,7 @@ export default {
|
|||
status: '',
|
||||
order: 'desc',
|
||||
ordeBy: 'date',
|
||||
searchQuery: '',
|
||||
sortingOptions: [
|
||||
{ label: this.$i18n.get('label_title'), value: 'title' },
|
||||
{ label: this.$i18n.get('label_creation_date'), value: 'date' },
|
||||
|
|
@ -405,7 +423,8 @@ export default {
|
|||
status: this.status,
|
||||
contextEdit: true,
|
||||
order: this.order,
|
||||
orderby: this.orderBy
|
||||
orderby: this.orderBy,
|
||||
search: this.searchQuery
|
||||
})
|
||||
.then((res) => {
|
||||
this.isLoading = false;
|
||||
|
|
@ -427,7 +446,11 @@ export default {
|
|||
hasModalCard: true,
|
||||
trapFocus: true
|
||||
});
|
||||
}
|
||||
},
|
||||
searchCollections() {
|
||||
this.page = 1;
|
||||
this.loadCollections();
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.collectionsPerPage = this.$userPrefs.get('collections_per_page');
|
||||
|
|
@ -484,7 +507,11 @@ export default {
|
|||
width: 100%;
|
||||
|
||||
.header-item {
|
||||
margin-bottom: 0 !important;
|
||||
|
||||
&:first-child {
|
||||
margin-right: auto;
|
||||
}
|
||||
&:not(:last-child) {
|
||||
padding-right: 0.5em;
|
||||
}
|
||||
|
|
@ -497,9 +524,13 @@ export default {
|
|||
cursor: default;
|
||||
}
|
||||
|
||||
.button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
&:not(:first-child) {
|
||||
.button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-radius: 0 !important;
|
||||
height: 1.95rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
.field {
|
||||
|
|
@ -515,14 +546,23 @@ export default {
|
|||
font-size: 1.3125rem !important;
|
||||
max-width: 26px;
|
||||
}
|
||||
|
||||
.icon {
|
||||
pointer-events: all;
|
||||
cursor: pointer;
|
||||
color: $blue5;
|
||||
height: 27px;
|
||||
font-size: 18px !important;
|
||||
height: 1.75rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 769px) {
|
||||
height: 60px;
|
||||
margin-top: -0.5em;
|
||||
padding-top: 0.9em;
|
||||
|
||||
.header-item {
|
||||
|
||||
.header-item:not(:last-child) {
|
||||
padding-right: 0.2em;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -137,7 +137,7 @@ export const deleteItem = ({ commit }, { itemId, isPermanently }) => {
|
|||
});
|
||||
};
|
||||
|
||||
export const fetchCollections = ({commit} , { page, collectionsPerPage, status, contextEdit, order, orderby }) => {
|
||||
export const fetchCollections = ({commit} , { page, collectionsPerPage, status, contextEdit, order, orderby, search }) => {
|
||||
|
||||
return new Promise((resolve, reject) => {
|
||||
let endpoint = '/collections?paged='+page+'&perpage='+collectionsPerPage;
|
||||
|
|
@ -150,25 +150,28 @@ export const fetchCollections = ({commit} , { page, collectionsPerPage, status,
|
|||
|
||||
if (order != undefined && order != '' && orderby != undefined && orderby != '')
|
||||
endpoint = endpoint + '&order=' + order + '&orderby=' + orderby;
|
||||
|
||||
if (search != undefined && search != '')
|
||||
endpoint = endpoint + '&search=' + search;
|
||||
|
||||
axios.tainacan.get(endpoint)
|
||||
.then(res => {
|
||||
let collections = res.data;
|
||||
commit('setCollections', collections);
|
||||
.then(res => {
|
||||
let collections = res.data;
|
||||
commit('setCollections', collections);
|
||||
|
||||
commit('setRepositoryTotalCollections', {
|
||||
draft: res.headers['x-tainacan-total-collections-draft'],
|
||||
trash: res.headers['x-tainacan-total-collections-trash'],
|
||||
publish: res.headers['x-tainacan-total-collections-publish'],
|
||||
private: res.headers['x-tainacan-total-collections-private'],
|
||||
commit('setRepositoryTotalCollections', {
|
||||
draft: res.headers['x-tainacan-total-collections-draft'],
|
||||
trash: res.headers['x-tainacan-total-collections-trash'],
|
||||
publish: res.headers['x-tainacan-total-collections-publish'],
|
||||
private: res.headers['x-tainacan-total-collections-private'],
|
||||
});
|
||||
|
||||
resolve({'collections': collections, 'total': res.headers['x-wp-total'] });
|
||||
})
|
||||
.catch(error => {
|
||||
console.log(error);
|
||||
reject(error);
|
||||
});
|
||||
|
||||
resolve({'collections': collections, 'total': res.headers['x-wp-total'] });
|
||||
})
|
||||
.catch(error => {
|
||||
console.log(error);
|
||||
reject(error);
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue