Adds Clear all tags button. Adjustments on ItemEditionPage css and introdution of toasts notices to updated metadata.
This commit is contained in:
Mateus Machado Luna
parent
fb56186cb6
commit
0b3c96c400
|
|
@ -13,52 +13,6 @@
|
|||
<div class="columns">
|
||||
<div class="column is-5-5">
|
||||
|
||||
<!-- Status -------------------------------- -->
|
||||
<div class="section-label">
|
||||
<label>{{ $i18n.get('label_status') }}</label>
|
||||
<span class="required-metadatum-asterisk">*</span>
|
||||
<help-button
|
||||
:title="$i18n.getHelperTitle('items', 'status')"
|
||||
:message="$i18n.getHelperMessage('items', 'status')"/>
|
||||
</div>
|
||||
<!-- Last Updated Info -->
|
||||
<p>{{ ($i18n.get('info_updated_at') + ' ' + lastUpdated) }}
|
||||
<em>
|
||||
<span v-if="isUpdatingValues && !isEditingValues"> {{ $i18n.get('info_updating_metadata_values') }}</span>
|
||||
<span v-if="isEditingValues"> {{ $i18n.get('info_editing_metadata_values') }}</span>
|
||||
</em>
|
||||
</p>
|
||||
<div class="section-status">
|
||||
<div class="field has-addons">
|
||||
<b-select
|
||||
v-model="form.status"
|
||||
:placeholder="$i18n.get('instruction_select_a_status')">
|
||||
<option
|
||||
:id="`status-option-${statusOption.value}`"
|
||||
v-for="statusOption in statusOptions"
|
||||
:key="statusOption.value"
|
||||
:value="statusOption.value"
|
||||
:disabled="statusOption.disabled">{{ statusOption.label }}
|
||||
</option>
|
||||
</b-select>
|
||||
<div class="control">
|
||||
<button
|
||||
type="button"
|
||||
id="button-submit-item-creation"
|
||||
@click.prevent="onSubmit"
|
||||
class="button is-success">
|
||||
{{ $i18n.get('save') }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<p
|
||||
v-if="item.status == 'auto-draft'"
|
||||
class="help is-danger">
|
||||
{{ $i18n.get('info_item_not_saved') }}
|
||||
</p>
|
||||
<p class="help is-danger">{{ formErrorMessage }}</p>
|
||||
</div>
|
||||
|
||||
<!-- Document -------------------------------- -->
|
||||
<div class="section-label">
|
||||
<label>{{ form.document != undefined && form.document != null && form.document != '' ? $i18n.get('label_document') : $i18n.get('label_document_empty') }}</label>
|
||||
|
|
@ -66,61 +20,84 @@
|
|||
:title="$i18n.getHelperTitle('items', 'document')"
|
||||
:message="$i18n.getHelperMessage('items', 'document')"/>
|
||||
</div>
|
||||
<div class="section-box ">
|
||||
<div class="section-box document-field">
|
||||
<div
|
||||
v-if="form.document != undefined && form.document != null &&
|
||||
form.document_type != undefined && form.document_type != null &&
|
||||
form.document != '' && form.document_type != 'empty'">
|
||||
<div v-if="form.document_type == 'attachment'">
|
||||
<div v-html="item.document_as_html" />
|
||||
<button
|
||||
type="button"
|
||||
class="button is-primary"
|
||||
size="is-small"
|
||||
@click.prevent="setFileDocument($event)">
|
||||
{{ $i18n.get('edit') }}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="button is-primary"
|
||||
size="is-small"
|
||||
@click.prevent="removeDocument()">
|
||||
{{ $i18n.get('remove') }}
|
||||
</button>
|
||||
<div class="document-buttons-row">
|
||||
<a
|
||||
class="button is-rounded is-secondary"
|
||||
size="is-small"
|
||||
id="button-edit-document"
|
||||
:aria-label="$i18n.get('label_button_edit_document')"
|
||||
@click.prevent="setFileDocument($event)">
|
||||
<b-icon
|
||||
size="is-small"
|
||||
icon="pencil" />
|
||||
</a>
|
||||
<a
|
||||
class="button is-rounded is-secondary"
|
||||
size="is-small"
|
||||
id="button-delete-document"
|
||||
:aria-label="$i18n.get('label_button_delete_document')"
|
||||
@click.prevent="removeDocument()">
|
||||
<b-icon
|
||||
size="is-small"
|
||||
icon="delete" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="form.document_type == 'text'">
|
||||
<div v-html="item.document_as_html" />
|
||||
<button
|
||||
type="button"
|
||||
class="button is-primary"
|
||||
size="is-small"
|
||||
@click.prevent="setTextDocument()">
|
||||
{{ $i18n.get('edit') }}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="button is-primary"
|
||||
size="is-small"
|
||||
@click.prevent="removeDocument()">
|
||||
{{ $i18n.get('remove') }}
|
||||
</button>
|
||||
<div class="document-buttons-row">
|
||||
<a
|
||||
class="button is-rounded is-secondary"
|
||||
:aria-label="$i18n.get('label_button_edit_document')"
|
||||
id="button-edit-document"
|
||||
@click.prevent="setTextDocument()">
|
||||
<b-icon
|
||||
size="is-small"
|
||||
icon="pencil" />
|
||||
</a>
|
||||
<a
|
||||
class="button is-rounded is-secondary"
|
||||
size="is-small"
|
||||
:aria-label="$i18n.get('label_button_delete_document')"
|
||||
id="button-delete-document"
|
||||
@click.prevent="removeDocument()">
|
||||
<b-icon
|
||||
size="is-small"
|
||||
icon="delete" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="form.document_type == 'url'">
|
||||
<div v-html="item.document_as_html" />
|
||||
<button
|
||||
type="button"
|
||||
class="button is-secondary"
|
||||
size="is-small"
|
||||
@click.prevent="setURLDocument()">
|
||||
{{ $i18n.get('edit') }}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="button is-secondary"
|
||||
size="is-small"
|
||||
@click.prevent="removeDocument()">
|
||||
{{ $i18n.get('remove') }}
|
||||
</button>
|
||||
<div class="document-buttons-row">
|
||||
<a
|
||||
class="button is-rounded is-secondary"
|
||||
size="is-small"
|
||||
:aria-label="$i18n.get('label_button_edit_document')"
|
||||
id="button-edit-document"
|
||||
@click.prevent="setURLDocument()">
|
||||
<b-icon
|
||||
size="is-small"
|
||||
icon="pencil" />
|
||||
</a>
|
||||
<a
|
||||
class="button is-rounded is-secondary"
|
||||
size="is-small"
|
||||
:aria-label="$i18n.get('label_button_delete_document')"
|
||||
id="button-delete-document"
|
||||
@click.prevent="removeDocument()">
|
||||
<b-icon
|
||||
size="is-small"
|
||||
icon="delete" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<ul v-else>
|
||||
|
|
@ -229,16 +206,10 @@
|
|||
</div>
|
||||
<div class="section-box section-thumbnail">
|
||||
<div class="thumbnail-field">
|
||||
<a
|
||||
class="button is-rounded is-secondary"
|
||||
id="button-edit-thumbnail"
|
||||
:aria-label="$i18n.get('label_button_edit_thumb')"
|
||||
@click.prevent="thumbnailMediaFrame.openFrame($event)">
|
||||
<b-icon icon="pencil" />
|
||||
</a>
|
||||
<file-item
|
||||
v-if="item.thumbnail.thumb != undefined && item.thumbnail.thumb != false"
|
||||
:show-name="false"
|
||||
:size="178"
|
||||
:file="{
|
||||
media_type: 'image',
|
||||
guid: { rendered: item.thumbnail.thumb },
|
||||
|
|
@ -254,13 +225,22 @@
|
|||
</figure>
|
||||
<div class="thumbnail-buttons-row">
|
||||
<a
|
||||
id="button-delete"
|
||||
class="button is-rounded is-secondary"
|
||||
id="button-edit-thumbnail"
|
||||
:aria-label="$i18n.get('label_button_edit_thumb')"
|
||||
@click.prevent="thumbnailMediaFrame.openFrame($event)">
|
||||
<b-icon
|
||||
size="is-small"
|
||||
icon="pencil" />
|
||||
</a>
|
||||
<a
|
||||
id="button-delete-thumbnail"
|
||||
class="button is-rounded is-secondary"
|
||||
:aria-label="$i18n.get('label_button_delete_thumb')"
|
||||
@click="deleteThumbnail()">
|
||||
<b-icon
|
||||
type="is-gray"
|
||||
size="is-small"
|
||||
icon="delete" />
|
||||
<span class="text">{{ $i18n.get('remove') }} </span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -294,6 +274,53 @@
|
|||
<div
|
||||
class="column is-4-5"
|
||||
v-show="!isMetadataColumnCompressed">
|
||||
|
||||
<!-- Status -------------------------------- -->
|
||||
<div class="section-label">
|
||||
<label>{{ $i18n.get('label_status') }}</label>
|
||||
<span class="required-metadatum-asterisk">*</span>
|
||||
<help-button
|
||||
:title="$i18n.getHelperTitle('items', 'status')"
|
||||
:message="$i18n.getHelperMessage('items', 'status')"/>
|
||||
</div>
|
||||
<!-- Last Updated Info -->
|
||||
<p>{{ ($i18n.get('info_updated_at') + ' ' + lastUpdated) }}
|
||||
<em>
|
||||
<span v-if="isUpdatingValues && !isEditingValues"> {{ $i18n.get('info_updating_metadata_values') }}</span>
|
||||
<span v-if="isEditingValues"> {{ $i18n.get('info_editing_metadata_values') }}</span>
|
||||
</em>
|
||||
</p>
|
||||
<div class="section-status">
|
||||
<div class="field has-addons">
|
||||
<b-select
|
||||
v-model="form.status"
|
||||
:placeholder="$i18n.get('instruction_select_a_status')">
|
||||
<option
|
||||
:id="`status-option-${statusOption.value}`"
|
||||
v-for="statusOption in statusOptions"
|
||||
:key="statusOption.value"
|
||||
:value="statusOption.value"
|
||||
:disabled="statusOption.disabled">{{ statusOption.label }}
|
||||
</option>
|
||||
</b-select>
|
||||
<div class="control">
|
||||
<button
|
||||
type="button"
|
||||
id="button-submit-item-creation"
|
||||
@click.prevent="onSubmit"
|
||||
class="button is-success">
|
||||
{{ $i18n.get('save') }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<p
|
||||
v-if="item.status == 'auto-draft'"
|
||||
class="help is-danger">
|
||||
{{ $i18n.get('info_item_not_saved') }}
|
||||
</p>
|
||||
<p class="help is-danger">{{ formErrorMessage }}</p>
|
||||
</div>
|
||||
|
||||
<label class="section-label">{{ $i18n.get('metadata') }}</label>
|
||||
<br>
|
||||
<a
|
||||
|
|
@ -673,10 +700,22 @@ export default {
|
|||
this.isEditingValues = true;
|
||||
setTimeout(()=> {
|
||||
this.isEditingValues = false;
|
||||
}, 1000)
|
||||
}, 2000)
|
||||
this.$toast.open({
|
||||
duration: 2000,
|
||||
message: this.$i18n.get('info_editing_metadata_values'),
|
||||
position: 'is-bottom',
|
||||
})
|
||||
});
|
||||
eventBus.$on('isUpdatingValue', (status) => {
|
||||
this.isUpdatingValues = status;
|
||||
if (this.isUpdatingValues) {
|
||||
this.$toast.open({
|
||||
duration: 2000,
|
||||
message: this.$i18n.get('info_updating_metadata_values'),
|
||||
position: 'is-bottom',
|
||||
})
|
||||
}
|
||||
});
|
||||
this.cleanLastUpdated();
|
||||
},
|
||||
|
|
@ -784,7 +823,7 @@ export default {
|
|||
}
|
||||
|
||||
.section-box {
|
||||
border: 1px solid $draggable-border-color;
|
||||
|
||||
background-color: white;
|
||||
padding: 26px;
|
||||
margin-top: 16px;
|
||||
|
|
@ -815,12 +854,8 @@ export default {
|
|||
.section-status{
|
||||
padding: 16px 0;
|
||||
}
|
||||
.section-thumbnail {
|
||||
width: 174px;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
.section-attachments {
|
||||
border: 1px solid $draggable-border-color;
|
||||
height: 250px;
|
||||
max-width: 100%;
|
||||
resize: vertical;
|
||||
|
|
@ -836,8 +871,36 @@ export default {
|
|||
margin-right: -15px;
|
||||
}
|
||||
|
||||
.document-field {
|
||||
|
||||
.document-buttons-row {
|
||||
text-align: right;
|
||||
top: -21px;
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
|
||||
#button-edit-thumbnail,
|
||||
#button-edit-document,
|
||||
#button-delete-thumbnail,
|
||||
#button-delete-document {
|
||||
|
||||
border-radius: 100px !important;
|
||||
height: 30px !important;
|
||||
width: 30px !important;
|
||||
z-index: 99;
|
||||
margin-left: 10px !important;
|
||||
|
||||
.icon {
|
||||
display: inherit;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
margin-top: 1px;
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
|
||||
.thumbnail-field {
|
||||
margin-top: -8px;
|
||||
|
||||
.content {
|
||||
padding: 10px;
|
||||
|
|
@ -859,36 +922,11 @@ export default {
|
|||
top: 38px;
|
||||
max-width: 90px;
|
||||
}
|
||||
#button-edit-thumbnail {
|
||||
|
||||
border-radius: 100px !important;
|
||||
height: 40px !important;
|
||||
width: 40px !important;
|
||||
bottom: -20px;
|
||||
left: -20px;
|
||||
z-index: 99;
|
||||
|
||||
.icon {
|
||||
display: inherit;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
margin-top: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
.thumbnail-buttons-row {
|
||||
display: inline-block;
|
||||
padding: 8px 0px;
|
||||
border-radius: 0px 0px 0px 4px;
|
||||
font-size: 14px;
|
||||
a { color: $tainacan-input-color; }
|
||||
.text {
|
||||
top: -3px;
|
||||
position: relative;
|
||||
}
|
||||
i.mdi-24px.mdi-set, i.mdi-24px.mdi::before {
|
||||
font-size: 20px;
|
||||
}
|
||||
position: relative;
|
||||
left: 90px;
|
||||
bottom: 22px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,43 @@
|
|||
<template>
|
||||
<form action="">
|
||||
<div
|
||||
class="tainacan-modal-content"
|
||||
style="width: auto">
|
||||
<header class="tainacan-modal-title">
|
||||
<h2>{{ this.$i18n.get('filter') }} <em>{{ title }}</em></h2>
|
||||
<hr>
|
||||
</header>
|
||||
<section class="tainacan-form">
|
||||
|
||||
|
||||
<footer class="field is-grouped form-submit">
|
||||
<div class="control">
|
||||
<button
|
||||
class="button is-outlined"
|
||||
type="button"
|
||||
@click="$parent.close()">Close</button>
|
||||
</div>
|
||||
<div class="control">
|
||||
<button class="button is-success">Login</button>
|
||||
</div>
|
||||
</footer>
|
||||
</section>
|
||||
</div>
|
||||
</form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'CheckboxFilterModal',
|
||||
props: {
|
||||
title: ''
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
|
||||
|
|
@ -18,7 +18,7 @@
|
|||
</section>
|
||||
<footer class="modal-card-foot form-submit">
|
||||
<button
|
||||
class="button is-outline"
|
||||
class="button is-outlined"
|
||||
type="button"
|
||||
@click="$parent.close()">
|
||||
{{ $i18n.get('cancel') }}
|
||||
|
|
|
|||
|
|
@ -3,7 +3,11 @@
|
|||
<figure
|
||||
class="file-item"
|
||||
@click="isPreviewModalActive = true">
|
||||
<div class="image-wrapper">
|
||||
<figcaption v-if="showName">{{ file.title.rendered }}</figcaption>
|
||||
<div
|
||||
:class="{ 'rounded': showName }"
|
||||
:style="{ 'width': size != undefined ? size + 'px' : '112px', 'height': size != undefined ? size + 'px' : '112px' }"
|
||||
class="image-wrapper">
|
||||
<div
|
||||
v-if="file.media_type == 'image'"
|
||||
class="image"
|
||||
|
|
@ -17,7 +21,6 @@
|
|||
type="is-gray"/>
|
||||
</div>
|
||||
</div>
|
||||
<figcaption v-if="showName">{{ file.title.rendered }}</figcaption>
|
||||
</figure>
|
||||
|
||||
<!-- Preview Modal ----------------- -->
|
||||
|
|
@ -54,6 +57,7 @@ export default {
|
|||
name: 'FileItem',
|
||||
props: {
|
||||
file: Object,
|
||||
size: 112,
|
||||
showName: false,
|
||||
isSelected: false,
|
||||
isPreviewModalActive: false
|
||||
|
|
@ -100,14 +104,16 @@ export default {
|
|||
}
|
||||
}
|
||||
.image-wrapper {
|
||||
height: 112px;
|
||||
width: 112px;
|
||||
border-radius: 2px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
background-color: $tainacan-input-background;
|
||||
|
||||
&.rounded {
|
||||
border-bottom-left-radius: 5px;
|
||||
border-bottom-right-radius: 5px;
|
||||
}
|
||||
|
||||
.image {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
|
|
@ -136,12 +142,11 @@ export default {
|
|||
|
||||
figcaption {
|
||||
background-color: $tainacan-input-background;
|
||||
border-bottom-left-radius: 7px;
|
||||
border-bottom-right-radius: 7px;
|
||||
padding: 5px 15px;
|
||||
border-top-left-radius: 5px;
|
||||
border-top-right-radius: 5px;
|
||||
padding: 8px 15px;
|
||||
font-size: 9px;
|
||||
margin-top: -4px;
|
||||
width: 112px;
|
||||
width: 100%;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
|
|
|
|||
|
|
@ -10,6 +10,12 @@
|
|||
@close="removeMetaQuery(filterTag.filterId, filterTag.value, filterTag.singleValue)">
|
||||
{{ filterTag.singleValue != undefined ? filterTag.singleValue : filterTag.value }}
|
||||
</b-tag>
|
||||
<button
|
||||
@click="clearAllFilters()"
|
||||
id="button-clear-all"
|
||||
class="button is-outlined">
|
||||
{{ $i18n.get('label_clear_filters') }}
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
|
@ -48,6 +54,12 @@
|
|||
this.$eventBusSearch.removeMetaFromFilterTag({ filterId: filterId, singleValue: singleValue });
|
||||
else
|
||||
this.$eventBusSearch.removeMetaFromFilterTag({ filterId: filterId, value: value });
|
||||
},
|
||||
clearAllFilters() {
|
||||
// this.$eventBusSearch.clearAllFilters();
|
||||
for (let tag of this.filterTags) {
|
||||
this.removeMetaQuery(tag.filterId, tag.value, tag.singleValue);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -66,7 +78,11 @@
|
|||
&.is-inline-flex {
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
}
|
||||
|
||||
#button-clear-all {
|
||||
margin-left: auto;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -914,7 +914,6 @@
|
|||
visibility: visible;
|
||||
display: block;
|
||||
transition: visibility ease 0.5s, display ease 0.5s;
|
||||
margin-bottom: -0.1rem;
|
||||
|
||||
h3 {
|
||||
font-size: 100%;
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@
|
|||
}
|
||||
&.is-outlined {
|
||||
color: #150e38 !important;
|
||||
background-color: white;
|
||||
background-color: white !important;
|
||||
border-color: $gray-light !important;
|
||||
}
|
||||
&:focus {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,18 @@
|
|||
.notices .toast {
|
||||
font-size: 0.75rem;
|
||||
border-radius: 8px;
|
||||
box-shadow: none;
|
||||
|
||||
&.is-dark {
|
||||
background-color: $tainacan-input-background;
|
||||
color: $gray-light;
|
||||
}
|
||||
&.is-warning {
|
||||
background-color: #e7dede;
|
||||
color: $danger;
|
||||
}
|
||||
&.is-success {
|
||||
background-color: #d6feed;
|
||||
color: $success;
|
||||
}
|
||||
}
|
||||
|
|
@ -21,6 +21,7 @@
|
|||
@import "../scss/_pagination.scss";
|
||||
@import "../scss/_modals.scss";
|
||||
@import "../scss/_tags.scss";
|
||||
@import "../scss/_notices.scss";
|
||||
|
||||
// Clears wordpress content
|
||||
body.tainacan-admin-page #adminmenumain, body.tainacan-admin-page #wpfooter, body.tainacan-admin-page #wp-auth-check-wrap {
|
||||
|
|
|
|||
|
|
@ -103,6 +103,7 @@ return apply_filters( 'tainacan-admin-i18n', [
|
|||
|
||||
// Labels (used mainly on Aria Labels and Inputs)
|
||||
'label_clean' => __( 'Clear', 'tainacan' ),
|
||||
'label_clear_filters' => __( 'Clear filters', 'tainacan' ),
|
||||
'label_selected' => __( 'Selected', 'tainacan' ),
|
||||
'label_relationship_new_search' => __( 'New Search', 'tainacan' ),
|
||||
'label_relationship_items_found' => __( 'Items found', 'tainacan' ),
|
||||
|
|
@ -128,6 +129,8 @@ return apply_filters( 'tainacan-admin-i18n', [
|
|||
'label_button_delete_header_image' => __( 'Button Delete Header Image', 'tainacan' ),
|
||||
'label_button_edit_thumb' => __( 'Button Edit Thumbnail', 'tainacan' ),
|
||||
'label_button_edit_header_image' => __( 'Button Edit Header Image', 'tainacan' ),
|
||||
'label_button_edit_document' => __( 'Button Edit Document', 'tainacan' ),
|
||||
'label_button_delete_document' => __( 'Button Delete Document', 'tainacan' ),
|
||||
'label_choose_thumb' => __( 'Choose Thumbnail', 'tainacan' ),
|
||||
'label_button_delete_thumb' => __( 'Button Delete Thumbnail', 'tainacan' ),
|
||||
'label_collections_per_page' => __( 'Collections per Page:', 'tainacan' ),
|
||||
|
|
@ -240,6 +243,8 @@ return apply_filters( 'tainacan-admin-i18n', [
|
|||
'label_remove_value' => __( 'Remove value', 'tainacan' ),
|
||||
'label_create_new_page' => __( 'Create new page', 'tainacan' ),
|
||||
'label_total_items' => __( 'Total items', 'tainacan' ),
|
||||
'label_see_more' => __( 'See more', 'tainacan' ),
|
||||
'label_until' => __( 'until', 'tainacan' ),
|
||||
|
||||
// Instructions. More complex sentences to guide user and placeholders
|
||||
'instruction_delete_selected_collections' => __( 'Delete selected collections', 'tainacan' ),
|
||||
|
|
|
|||
|
|
@ -7,7 +7,6 @@
|
|||
v-model="selected"
|
||||
:data="options"
|
||||
expanded
|
||||
:clear-on-select="true"
|
||||
@input="search"
|
||||
field="label"
|
||||
@select="option => setResults(option) "
|
||||
|
|
@ -100,22 +99,24 @@
|
|||
this.selectedValues();
|
||||
},
|
||||
search( query ){
|
||||
|
||||
let promise = null;
|
||||
this.options = [];
|
||||
if ( this.type === 'Tainacan\\Metadata_Types\\Relationship' ) {
|
||||
let collectionTarget = ( this.metadatum_object && this.metadatum_object.metadata_type_options.collection_id ) ?
|
||||
this.metadatum_object.metadata_type_options.collection_id : this.collection_id;
|
||||
promise = this.getValuesRelationship( collectionTarget, query );
|
||||
if (query != '') {
|
||||
let promise = null;
|
||||
this.options = [];
|
||||
if ( this.type === 'Tainacan\\Metadata_Types\\Relationship' ) {
|
||||
let collectionTarget = ( this.metadatum_object && this.metadatum_object.metadata_type_options.collection_id ) ?
|
||||
this.metadatum_object.metadata_type_options.collection_id : this.collection_id;
|
||||
promise = this.getValuesRelationship( collectionTarget, query );
|
||||
|
||||
} else {
|
||||
promise = this.getValuesPlainText( this.metadatum, query, this.isRepositoryLevel );
|
||||
}
|
||||
|
||||
promise.catch( error => {
|
||||
this.$console.log('error select', error );
|
||||
});
|
||||
} else {
|
||||
promise = this.getValuesPlainText( this.metadatum, query, this.isRepositoryLevel );
|
||||
this.cleanSearch();
|
||||
}
|
||||
|
||||
promise.catch( error => {
|
||||
this.$console.log('error select', error );
|
||||
});
|
||||
|
||||
},
|
||||
selectedValues(){
|
||||
const instance = this;
|
||||
|
|
@ -138,6 +139,7 @@
|
|||
let item = res.data;
|
||||
instance.results = item.title;
|
||||
instance.label = item.title;
|
||||
instance.selected = item.title;
|
||||
|
||||
this.$eventBusSearch.$emit( 'sendValuesToTags', {
|
||||
filterId: instance.filter.id,
|
||||
|
|
@ -149,6 +151,8 @@
|
|||
});
|
||||
} else {
|
||||
instance.results = metadata.value;
|
||||
instance.label = metadata.value;
|
||||
instance.selected = metadata.value;
|
||||
|
||||
this.$eventBusSearch.$emit( 'sendValuesToTags', {
|
||||
filterId: instance.filter.id,
|
||||
|
|
|
|||
|
|
@ -6,15 +6,22 @@
|
|||
class="metadatum">
|
||||
<b-checkbox
|
||||
v-model="selected"
|
||||
:native-value="option.value"
|
||||
>{{ option.label }}</b-checkbox>
|
||||
:native-value="option.value">
|
||||
{{ option.label }}
|
||||
</b-checkbox>
|
||||
</div>
|
||||
<!-- <a
|
||||
@click="openCheckboxModal()"
|
||||
class="add-link">
|
||||
{{ $i18n.get('label_see_more') }}
|
||||
</a> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { tainacan as axios } from '../../../js/axios/axios';
|
||||
import { filter_type_mixin } from '../filter-types-mixin'
|
||||
// import CheckboxFilterModal from '../../../admin/components/other/checkbox-filter-modal.vue'
|
||||
|
||||
export default {
|
||||
created(){
|
||||
|
|
@ -138,7 +145,16 @@
|
|||
this.selected = [];
|
||||
return false;
|
||||
}
|
||||
}
|
||||
},
|
||||
// openCheckboxModal() {
|
||||
// this.$modal.open({
|
||||
// parent: this,
|
||||
// component: CheckboxFilterModal,
|
||||
// props: {
|
||||
// title: this.filter.name
|
||||
// }
|
||||
// });
|
||||
// }
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -9,6 +9,7 @@
|
|||
@focus="isTouched = true"
|
||||
@input="validate_values()"
|
||||
icon="calendar-today"/>
|
||||
<p class="is-size-7 has-text-centered">{{ $i18n.get('label_until') }}</p>
|
||||
<b-datepicker
|
||||
:placeholder="$i18n.get('label_selectbox_init')"
|
||||
v-model="date_end"
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div>
|
||||
<div :class="{ 'is-flex': metadatum.metadatum.multiple != 'yes' }">
|
||||
<b-taginput
|
||||
:id="id"
|
||||
v-model="selected"
|
||||
|
|
@ -147,4 +147,7 @@
|
|||
.help.counter {
|
||||
display: none;
|
||||
}
|
||||
div.is-flex {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -323,6 +323,12 @@ export default {
|
|||
},
|
||||
setCollectionId(collectionId) {
|
||||
this.collectionId = collectionId;
|
||||
},
|
||||
clearAllFilters() {
|
||||
this.$store.dispatch('search/cleanFilterTags');
|
||||
this.$store.dispatch('search/cleanMetaQueries');
|
||||
this.$store.dispatch('search/cleanTaxQueries');
|
||||
this.updateURLQueries();
|
||||
},
|
||||
/* Dev interfaces methods */
|
||||
|
||||
|
|
|
|||
|
|
@ -127,3 +127,11 @@ export const removeFilterTag = ( { commit }, filterTag ) => {
|
|||
export const cleanFilterTags = ( { commit } ) => {
|
||||
commit('cleanFilterTags');
|
||||
};
|
||||
|
||||
export const cleanMetaQueries = ( { commit } ) => {
|
||||
commit('cleanMetaQueries');
|
||||
};
|
||||
|
||||
export const cleanTaxQueries = ({ commit }) => {
|
||||
commit('cleanTaxQueries');
|
||||
};
|
||||
|
|
|
|||
|
|
@ -154,4 +154,12 @@ export const removeFilterTag = ( state, filterTag ) => {
|
|||
|
||||
export const cleanFilterTags = ( state ) => {
|
||||
state.filter_tags = [];
|
||||
};
|
||||
|
||||
export const cleanMetaQueries = (state) => {
|
||||
state.postquery.metaquery = [];
|
||||
};
|
||||
|
||||
export const cleanTaxQueries = (state) => {
|
||||
state.postquery.taxquery = [];
|
||||
};
|
||||
Loading…
Reference in New Issue