tmdinosaurcenter
/
tainacan
mirror of https://github.com/tainacan/tainacan
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Improvements on advanced search (#22); Activation of search in header; new style for all tags.

This commit is contained in:
weryques 2018-06-20 16:24:58 -03:00
parent e73a8ea6e6
commit 4ba9d17543
7 changed files with 106 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

52
src/admin/components/advanced-search/advanced-search.vue
View File

@ -30,8 +30,8 @@
class="column is-two-thirds">
<b-input
v-if="advancedSearchQuery.metaquery[searchCriteria]"
:type="advancedSearchQuery.metaquery[searchCriteria].ptype == 'date' ?
'date' : (advancedSearchQuery.metaquery[searchCriteria].ptype == 'int' || advancedSearchQuery.metaquery[searchCriteria].ptype == 'float' ? 'number' : 'text')"
:type="advancedSearchQuery.metaquery[searchCriteria].ptype == 'int' ||
advancedSearchQuery.metaquery[searchCriteria].ptype == 'float' ? 'number' : 'text'"
@input="addValueToAdvancedSearchQuery($event, 'value', searchCriteria)"
/>
<b-taginput
@ -73,27 +73,25 @@
</b-field>
</div>
<!-- Add button -->
<div
:style="{'padding-left': '25px !important'}"
class="field column is-12">
<div class="is-inline">
<a
@click="addSearchCriteria"
class="is-secondary is-small">
<b-icon
icon="plus-circle"
size="is-small"
type="is-secondary"/>
<a
@click="addSearchCriteria"
class="is-secondary is-small">
{{ $i18n.get('add_another_search_criteria') }}</a>
</div>
{{ $i18n.get('add_another_search_criteria') }}</a>
</div>
<!-- Tags -->
<div
:class="{'tag-container-border': Object.keys(advancedSearchQuery.taxquery).length > 0 || Object.keys(advancedSearchQuery.metaquery).length > 0}"
class="field column is-12">
<b-field
:style="{'padding': '0.3rem 0 0 0'}"
grouped
group-multiline>
<div
@ -103,6 +101,7 @@
<b-tag
v-if="(advancedSearchQuery.taxquery[searchCriteria] && advancedSearchQuery.taxquery[searchCriteria].terms)"
type="is-white"
class="is-rounded"
@close="removeThis(searchCriteria)"
attached
closable>
@ -113,6 +112,7 @@
<b-tag
v-else-if="(advancedSearchQuery.metaquery[searchCriteria] && advancedSearchQuery.metaquery[searchCriteria].value)"
type="is-white"
class="is-rounded"
@close="removeThis(searchCriteria)"
attached
:loading="isFetching"
@ -124,6 +124,8 @@
</div>
</b-field>
</div>
<!-- Clear and search button -->
<div class="column">
<div class="field is-grouped is-pulled-right">
<p class="control">
@ -155,16 +157,20 @@
},
data() {
return {
metaqueryOperators: {
metaqueryOperatorsForInterval: {
'=': this.$i18n.get('is_equal_to'),
'!=': this.$i18n.get('is_not_equal_to'),
'LIKE': this.$i18n.get('contains'),
'NOT LIKE': this.$i18n.get('not_contains'),
'>': this.$i18n.get('greater_than'),
'<': this.$i18n.get('less_than'),
'>=': this.$i18n.get('greater_than_or_equal_to'),
'<=': this.$i18n.get('less_than_or_equal_to'),
},
metaqueryOperatorsRegular: {
'=': this.$i18n.get('is_equal_to'),
'!=': this.$i18n.get('is_not_equal_to'),
'LIKE': this.$i18n.get('contains'),
'NOT LIKE': this.$i18n.get('not_contains'),
},
taxqueryOperators: {
'IN': this.$i18n.get('contains'),
'NOT IN': this.$i18n.get('not_contains')
@ -222,7 +228,13 @@
if(this.advancedSearchQuery.taxquery[searchCriteria]){
return this.taxqueryOperators;
} else if(this.advancedSearchQuery.metaquery[searchCriteria]){
return this.metaqueryOperators;
if(this.advancedSearchQuery.metaquery[searchCriteria].ptype == 'int' ||
this.advancedSearchQuery.metaquery[searchCriteria].ptype == 'float' ||
this.advancedSearchQuery.metaquery[searchCriteria].ptype == 'date'){
return this.metaqueryOperatorsForInterval;
} else{
return this.metaqueryOperatorsRegular;
}
}
},
removeThis(searchCriteria){
@ -353,14 +365,6 @@
padding-left: $page-side-padding;
padding-bottom: 47px;
.tag-container-border {
border: 1px solid $tainacan-input-background;
span.tag{
color: $secondary;
}
}
.column {
padding: 0 0.3rem 0.3rem !important;
}

28
src/admin/components/navigation/tainacan-header.vue
View File

@ -16,20 +16,24 @@
</div>
</div>
<div class="level-right">
<span class="search-area">
<div class="search-area">
<div class="control has-icons-right is-small is-clearfix">
<input
autocomplete="on"
:placeholder="$i18n.get('instruction_search_on_repository')"
class="input is-small"
type="search"
v-model="searchTerm">
<span class="icon is-right">
<i class="mdi mdi-magnify" />
</span>
:value="searchQuery"
@input="futureSearchQuery = $event.target.value"
@keyup.enter="updateSearch()">
<span
@click="updateSearch()"
class="icon is-right">
<i class="mdi mdi-magnify" />
</span>
</div>
<a @click="toItemsPage">{{ $i18n.get('advanced_search') }}</a>
</span>
</div>
<a
class="level-item"
:href="wordpressAdmin">
@ -47,7 +51,8 @@ export default {
return {
logoHeader: tainacan_plugin.base_url + '/admin/images/tainacan_logo_header.png',
wordpressAdmin: window.location.origin + window.location.pathname.replace('admin.php', ''),
searchTerm: ''
searchQuery: '',
futureSearchQuery: '',
}
},
methods: {
@ -55,10 +60,13 @@ export default {
this.$router.push({
path: '/items',
query: {
openAdvancedSearch: true
advancedSearch: true
}
});
}
},
updateSearch() {
this.$eventBusSearch.setSearchQuery(this.futureSearchQuery);
},
},
props: {
isMenuCompressed: false
@ -133,7 +141,9 @@ export default {
width: 220px !important;
}
.icon {
pointer-events: all;
color: $tertiary;
cursor: pointer;
height: 27px;
font-size: 18px;
}

58
src/admin/pages/lists/items-page.vue
View File

@ -290,20 +290,36 @@
<!-- ADVANCED SEARCH -->
<div
v-if="openAdvancedSearch">
<div class="columns tnc-advanced-search-close">
<div class="column">
<button
@click="openAdvancedSearch = false"
class="button is-white is-pulled-right">
<b-icon
size="is-small"
icon="close"/>
</button>
</div>
</div>
<advanced-search
:is-repository-level="isRepositoryLevel"
:metadata="metadata" />
<b-collapse
class="show"
:open="advancedSearchResults ? false : true">
<div
slot="trigger"
slot-scope="props"
class="columns tnc-advanced-search-close">
<div class="column">
<button
@click="openAdvancedSearch = false"
class="button is-white is-pulled-right">
<b-icon
size="is-small"
icon="close"/>
</button>
<button
class="button is-white is-pulled-right">
<span>
{{ props.open ? $i18n.get('hide_advanced_search') : $i18n.get('show_advanced_search') }}
</span>
<b-icon
:style="'margin-left'"
:icon="props.open ? 'menu-down' : 'menu-up'" />
</button>
</div>
</div>
<advanced-search
:is-repository-level="isRepositoryLevel"
:metadata="metadata" />
</b-collapse>
</div>
<!-- --------------- -->
@ -365,15 +381,17 @@
:is-on-trash="status == 'trash'"
:view-mode="adminViewMode"/>
<!-- When advanced search -->
<!-- Theme View Modes -->
<div
v-if="isOnTheme &&
!isLoadingItems &&
openAdvancedSearch &&
advancedSearchResults &&
registeredViewModes[viewMode] != undefined &&
registeredViewModes[viewMode].type == 'template'"
v-html="itemsListTemplate"/>
<!-- When advanced search -->
<component
v-if="isOnTheme &&
!isLoadingItems &&
@ -388,6 +406,14 @@
:is="registeredViewModes[viewMode] != undefined ? registeredViewModes[viewMode].component : ''"/>
<!-- Regular -->
<!-- Theme View Modes -->
<div
v-if="isOnTheme &&
!isLoadingItems &&
!openAdvancedSearch &&
registeredViewModes[viewMode] != undefined &&
registeredViewModes[viewMode].type == 'template'"
v-html="itemsListTemplate"/>
<component
v-else-if="isOnTheme &&
!isLoadingItems &&

13
src/admin/scss/_tags.scss Normal file
View File

@ -0,0 +1,13 @@
.tags {
border: solid 1px $tainacan-input-background !important;
border-radius: 20px;
&:hover{
background-color: $tainacan-input-background;
}
.tag {
background: none !important;
margin-bottom: 0 !important;
}
}

1
src/admin/scss/tainacan-admin.scss
View File

@ -20,6 +20,7 @@
@import "../scss/_tooltips.scss";
@import "../scss/_pagination.scss";
@import "../scss/_modals.scss";
@import "../scss/_tags.scss";
// Clears wordpress content
body.tainacan-admin-page #adminmenumain, body.tainacan-admin-page #wpfooter, body.tainacan-admin-page #wp-auth-check-wrap {

1
src/admin/scss/theme-basics.sass
View File

@ -6,3 +6,4 @@
@import "../../../node_modules/bulma/sass/elements/tag.sass"
@import "../../../node_modules/bulma/sass/components/tabs.sass"
@import "../../../node_modules/bulma/sass/elements/button.sass"
@import "../../../node_modules/bulma/sass/grid/columns.sass"

2
src/admin/tainacan-admin-i18n.php
View File

@ -59,6 +59,8 @@ return apply_filters('tainacan-admin-i18n',[
'add_another_search_criteria' => __( 'Add another search criteria', 'tainacan' ),
'clear_search' => __( 'Clear search', 'tainacan' ),
'run' => __( 'Run', 'tainacan' ),
'show_advanced_search' => __( 'Show advanced search', 'tainacan'),
'hide_advanced_search' => __( 'Hide advanced search', 'tainacan'),
// Wordpress Status
'publish' => __( 'Publish', 'tainacan' ),