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

Now the advanced search form is recovered from the route query (#22)

This commit is contained in:
weryques 2018-07-05 22:42:06 -03:00
parent f6a1b9204a
commit aa6798a8a3
2 changed files with 165 additions and 73 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -20,6 +20,9 @@
:placeholder="$i18n.get('instruction_select_a_metadatum')"
:disabled="advancedSearchQuery.taxquery[searchCriterion] ||
advancedSearchQuery.metaquery[searchCriterion] ? true : false"
:value="advancedSearchQuery.metaquery[searchCriterion] ?
advancedSearchQuery.metaquery[searchCriterion].originalMeta :
(advancedSearchQuery.taxquery[searchCriterion] ? advancedSearchQuery.taxquery[searchCriterion].originalMeta : '')"
@input="addToAdvancedSearchQuery($event, 'metadatum', searchCriterion)">
<option
v-for="metadatum in metadata"
@ -38,11 +41,13 @@
:type="advancedSearchQuery.metaquery[searchCriterion].ptype == 'int' ||
advancedSearchQuery.metaquery[searchCriterion].ptype == 'float' ? 'number' : 'text'"
@input="addValueToAdvancedSearchQuery($event, 'value', searchCriterion)"
:value="advancedSearchQuery.metaquery[searchCriterion].value"
/>
<input
v-else-if="advancedSearchQuery.metaquery[searchCriterion] &&
advancedSearchQuery.metaquery[searchCriterion].ptype == 'date'"
class="input"
:value="parseDateToNavigatorLanguage(advancedSearchQuery.metaquery[searchCriterion].value)"
v-mask="dateMask"
@focus="addValueToAdvancedSearchQueryWithoutDelay($event, '', searchCriterion)"
@input="addValueToAdvancedSearchQueryWithoutDelay($event, 'value', searchCriterion)"
@ -51,6 +56,8 @@
<b-taginput
v-else-if="advancedSearchQuery.taxquery[searchCriterion]"
:data="terms"
:value="advancedSearchQuery.taxquery[searchCriterion].btags.length > 0 ?
Array.from(new Set(advancedSearchQuery.taxquery[searchCriterion].btags)) : []"
autocomplete
:loading="isFetching"
attached
@ -165,6 +172,8 @@
</div>
</div>
</div>
<pre>{{ terms }}</pre>
<pre>{{ advancedSearchQuery }}</pre>
</div>
</template>
@ -196,6 +205,52 @@
let localeData = moment.localeData();
this.dateFormat = localeData.longDateFormat('L');
if((this.$route.query.metaquery && Object.keys(this.$route.query.metaquery).length > 0) ||
(this.$route.query.taxquery && Object.keys(this.$route.query.taxquery).length > 0) ){
this.searchCriteria = [];
}
if(this.$route.query.metaquery && Object.keys(this.$route.query.metaquery).length > 0){
let metaquery = this.$route.query.metaquery;
for(let meta in metaquery){
this.$set(this.advancedSearchQuery.metaquery, `${meta}`, metaquery[meta]);
}
let keys = Object.keys(this.advancedSearchQuery.metaquery);
let relationIndex = keys.findIndex((element) => {
return element == 'relation';
});
keys.splice(relationIndex, 1);
for(let k of keys){
this.searchCriteria.push(k);
}
}
if(this.$route.query.taxquery && Object.keys(this.$route.query.taxquery).length > 0){
let taxquery = this.$route.query.taxquery;
for(let tax in taxquery){
this.$set(this.advancedSearchQuery.taxquery, `${tax}`, taxquery[tax]);
}
let keys = Object.keys(this.advancedSearchQuery.taxquery);
let relationIndex = keys.findIndex((element) => {
return element == 'relation';
});
keys.splice(relationIndex, 1);
for(let k of keys){
this.searchCriteria.push(k);
}
}
},
data() {
return {
@ -366,8 +421,7 @@
let value = this.advancedSearchQuery.metaquery[metaquery].value;
if(value.includes('/')){
this.advancedSearchQuery.metaquery[metaquery].value = this.convertDateToMatchInDB(value);
//this.$set(this.advancedSearchQuery.metaquery[metaquery], 'value', this.convertDateToMatchInDB(value));
this.$set(this.advancedSearchQuery.metaquery[metaquery], 'value', this.convertDateToMatchInDB(value));
}
}
}
@ -394,15 +448,19 @@
if(value.includes('-')){
this.$set(this.advancedSearchQuery.metaquery[metaquery], 'value', this.parseDateToNavigatorLanguage(value));
}
}, 110);
}, 200);
}
}
}
},
parseDateToNavigatorLanguage(date){
if(date && date.length === this.dateMask.length) {
date = new Date(date.replace(/-/g, '/'));
return moment(date, moment.ISO_8601).format(this.dateFormat);
} else {
return date;
}
},
addToAdvancedSearchQuery(value, type, searchCriterion){
@ -418,6 +476,7 @@
btags: [],
field: 'term_id',
operator: 'IN',
originalMeta: value,
taxonomy_id: Number(criteriaKey[1].match(/[\d]+/))
}
});
@ -427,14 +486,16 @@
this.advancedSearchQuery.metaquery = Object.assign({}, this.advancedSearchQuery.metaquery, {
[`${searchCriterion}`]: {
key: Number(criteriaKey[0]),
compare: 'LIKE'
compare: 'LIKE',
originalMeta: value,
}
});
} else {
this.advancedSearchQuery.metaquery = Object.assign({}, this.advancedSearchQuery.metaquery, {
[`${searchCriterion}`]: {
key: Number(criteriaKey[0]),
compare: '='
compare: '=',
originalMeta: value,
}
});
}

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

@ -31,10 +31,31 @@
@click="updateSearch()"
class="mdi mdi-magnify"/>
</span>
</div>
<a @click="toItemsPage">{{ $i18n.get('advanced_search') }}</a>
<!--<b-dropdown-->
<!--position="is-bottom-left">-->
<!--<b-icon-->
<!--class="is-right"-->
<!--slot="trigger"-->
<!--size="is-small"-->
<!--icon="menu-down"/>-->
<!--<b-dropdown-item>-->
<!--<p class="is-left">{{ $i18n.get('advanced_search') }}</p>-->
<!--<b-icon-->
<!--icon="menu-up"-->
<!--class="is-right" />-->
<!--</b-dropdown-item>-->
<!--<b-dropdown-item-->
<!--:custom="true">-->
<!--<advanced-search />-->
<!--</b-dropdown-item>-->
<!--</b-dropdown>-->
</div>
<a
:style="{color: 'white'}"
@click="toItemsPage">{{ $i18n.get('advanced_search') }}</a>
</div>
<a
:style="{color: 'white'}"
class="level-item"
:href="wordpressAdmin">
<b-icon icon="wordpress"/>
@ -45,6 +66,8 @@
<script>
import AdvancedSearch from '../advanced-search/advanced-search.vue';
export default {
name: 'TainacanHeader',
data() {
@ -55,6 +78,9 @@ export default {
futureSearchQuery: '',
}
},
components: {
AdvancedSearch,
},
methods: {
toItemsPage() {
this.$router.push({
@ -80,7 +106,7 @@ export default {
}
</script>
<style lang="scss" scoped>
<style lang="scss">
@import "../../scss/_variables.scss";
@ -122,15 +148,12 @@ export default {
}
.level-right {
padding-right: 12px;
a {
color: white;
}
.search-area {
display: flex;
align-items: center;
margin-right: 36px;
.control {
.control:not(.tnc-advanced-search-container) {
input {
border-width: 0 !important;
height: 27px;
@ -149,10 +172,18 @@ export default {
cursor: pointer;
height: 27px;
font-size: 18px;
width: auto !important;
width: 30px !important;
}
}
/*.dropdown-content {*/
/*width: 800px !important;*/
/*}*/
/*.dropdown-item:hover {*/
/*background-color: white;*/
/*}*/
a {
margin: 0px 12px;
font-size: 12px;