Uses modelValue on Buefy components. Begins refactor from VueDraggable to Sortable. #794.

This commit is contained in:
mateuswetah 2023-08-14 17:58:59 -03:00
parent f765fca188
commit 6c3869cb0f
107 changed files with 2458 additions and 2375 deletions

35
package-lock.json generated
View File

@ -1610,9 +1610,9 @@
}
},
"@ntohq/buefy-next": {
"version": "0.1.0",
"resolved": "https://registry.npmjs.org/@ntohq/buefy-next/-/buefy-next-0.1.0.tgz",
"integrity": "sha512-47kqY9zl/kqw72AwHA2lLk44BFgQDvGnGyWrLmxsS88RpH8Dhw3ECH4+fPK+CYSIsL6V6og13BtxWG//nlpKzA==",
"version": "0.1.1",
"resolved": "https://registry.npmjs.org/@ntohq/buefy-next/-/buefy-next-0.1.1.tgz",
"integrity": "sha512-5ZX1S9bhLqPFEmkmZeaUCRg289Ui/k3mT2qKQQ2p8ihTTCsW2ozXTcpcV3wmwsf81kPjT90ykU18u2ve92M2fA==",
"requires": {
"@babel/runtime": "7.18.9",
"bulma": "0.9.4"
@ -5846,9 +5846,9 @@
}
},
"semver": {
"version": "5.7.1",
"resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
"integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ=="
"version": "5.7.2",
"resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz",
"integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g=="
},
"type-fest": {
"version": "0.6.0",
@ -6433,9 +6433,18 @@
}
},
"sortablejs": {
"version": "1.14.0",
"resolved": "https://registry.npmjs.org/sortablejs/-/sortablejs-1.14.0.tgz",
"integrity": "sha512-pBXvQCs5/33fdN1/39pPL0NZF20LeRbLQ5jtnheIPN9JQAaufGjKdWduZn4U7wCtVuzKhmRkI0DFYHYRbB2H1w=="
"version": "1.15.0",
"resolved": "https://registry.npmjs.org/sortablejs/-/sortablejs-1.15.0.tgz",
"integrity": "sha512-bv9qgVMjUMf89wAvM6AxVvS/4MX3sPeN0+agqShejLU5z5GX4C75ow1O2e5k4L6XItUyAK3gH6AxSbXrOM5e8w=="
},
"sortablejs-vue3": {
"version": "1.2.9",
"resolved": "https://registry.npmjs.org/sortablejs-vue3/-/sortablejs-vue3-1.2.9.tgz",
"integrity": "sha512-l0IIBdu+nRIwC2+KOkiavXw5vRfsn6MIPVSVSf7ItBevcuRZ4mVzC7dgnr/Hs/VPH2Q+nF2PYP3FsrnrG+7qCw==",
"requires": {
"sortablejs": "^1.15.0",
"vue": "^3.2.37"
}
},
"source-map": {
"version": "0.7.4",
@ -7127,14 +7136,6 @@
"resolved": "https://registry.npmjs.org/vue3-apexcharts/-/vue3-apexcharts-1.4.4.tgz",
"integrity": "sha512-TH89uZrxGjaDvkaYAISvj8+k6Bf1rUKFillc8oJirs5XZEPiwM1ELKZQ786wz0rfPqkSHHny2lqqUCK7Rw+LcQ=="
},
"vuedraggable": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/vuedraggable/-/vuedraggable-4.1.0.tgz",
"integrity": "sha512-FU5HCWBmsf20GpP3eudURW3WdWTKIbEIQxh9/8GE806hydR9qZqRRxRE3RjqX7PkuLuMQG/A7n3cfj9rCEchww==",
"requires": {
"sortablejs": "1.14.0"
}
},
"vuex": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/vuex/-/vuex-4.1.0.tgz",

View File

@ -8,13 +8,13 @@
"build-prod": "cross-env NODE_ENV=production webpack --config webpack.prod.js --progress --mode production"
},
"dependencies": {
"@ntohq/buefy-next": "^0.1.1",
"@vue-leaflet/vue-leaflet": "^0.10.1",
"@vue/compat": "^3.3.4",
"another-vue3-blurhash": "^0.0.1",
"apexcharts": "^3.41.0",
"axios": "^1.4.0",
"blurhash": "^2.0.5",
"@ntohq/buefy-next": "^0.1.0",
"bulma": "^0.9.4",
"conditioner-core": "^2.3.3",
"countup.js": "^2.7.0",
@ -30,13 +30,14 @@
"qs": "^6.11.2",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"sortablejs": "^1.15.0",
"sortablejs-vue3": "^1.2.9",
"swiper": "^8.4.5",
"vue": "^3.3.4",
"vue3-apexcharts": "^1.4.4",
"vue-countup-v3": "^1.3.0",
"vue-router": "^4.2.4",
"vue-the-mask": "^0.11.1",
"vuedraggable": "^4.1.0",
"vue3-apexcharts": "^1.4.4",
"vuex": "^4.1.0"
},
"devDependencies": {

View File

@ -26,7 +26,7 @@
<b-input
id="tainacan-text-name"
:placeholder="$i18n.get('instruction_collection_name')"
v-model:value="form.name"
v-model="form.name"
@blur="updateSlug"
@focus="clearErrors('name')"/>
</b-field>
@ -53,7 +53,7 @@
type="textarea"
rows="3"
:placeholder="$i18n.get('instruction_collection_description')"
v-model:value="form.description"
v-model="form.description"
@focus="clearErrors('description')"/>
</b-field>
@ -68,8 +68,8 @@
:message="$i18n.getHelperMessage('collections', 'slug')"/>
<b-input
id="tainacan-text-slug"
@input="updateSlug"
v-model:value="form.slug"
@update:model-value="updateSlug"
v-model="form.slug"
@focus="clearErrors('slug')"
:disabled="isUpdatingSlug"
:loading="isUpdatingSlug"/>
@ -88,7 +88,7 @@
<label class="label">{{ $i18n.get('label_sort') }}&nbsp;</label>
<b-select
id="tainacan-select-default_order"
v-model:value="form.default_order">
v-model="form.default_order">
<option
role="button"
:class="{ 'is-active': form.default_order == 'DESC' }"
@ -110,7 +110,7 @@
<b-select
expanded
:loading="isLoadingMetadata"
v-model:value="localDefaultOrderBy"
v-model="localDefaultOrderBy"
id="tainacan-select-default_orderby">
<option
v-for="metadatum of sortingMetadata"
@ -141,16 +141,17 @@
aria-role="list"
trap-focus
position="is-top-right">
<button
class="button is-white"
slot="trigger"
position="is-top-right"
type="button">
<span>{{ $i18n.get('label_enabled_view_modes') }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown"/>
</span>
</button>
<template #trigger>
<button
class="button is-white"
position="is-top-right"
type="button">
<span>{{ $i18n.get('label_enabled_view_modes') }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown"/>
</span>
</button>
</template>
<b-dropdown-item
v-for="(viewMode, index) in Object.keys(registeredViewModes)"
:key="index"
@ -158,8 +159,8 @@
aria-role="listitem">
<b-checkbox
v-if="registeredViewModes[viewMode] != undefined"
@input="updateViewModeslist(viewMode)"
:value="checkIfViewModeEnabled(viewMode)"
@update:model-value="updateViewModeslist(viewMode)"
:model-value="checkIfViewModeEnabled(viewMode)"
:disabled="checkIfViewModeEnabled(viewMode) && form.enabled_view_modes.filter((aViewMode) => (registeredViewModes[aViewMode] && registeredViewModes[aViewMode].full_screen != true)).length <= 1">
<p>
<strong>
@ -193,7 +194,7 @@
<b-select
expanded
id="tainacan-select-default_view_mode"
v-model:value="form.default_view_mode"
v-model="form.default_view_mode"
@focus="clearErrors('default_view_mode')">
<option
v-for="(viewMode, index) of validDefaultViewModes"
@ -215,7 +216,7 @@
size="is-small"
true-value="yes"
false-value="no"
v-model:value="form.hide_items_thumbnail_on_lists" />
v-model="form.hide_items_thumbnail_on_lists" />
<help-button
:title="$i18n.getHelperTitle('collections', 'hide_items_thumbnail_on_lists')"
:message="$i18n.getHelperMessage('collections', 'hide_items_thumbnail_on_lists')"/>
@ -231,7 +232,7 @@
size="is-small"
true-value="open"
false-value="closed"
v-model:value="form.allow_comments" />
v-model="form.allow_comments" />
<help-button
:title="$i18n.getHelperTitle('collections', 'allow_comments')"
:message="$i18n.getHelperMessage('collections', 'allow_comments')"/>
@ -249,7 +250,7 @@
size="is-small"
true-value="yes"
false-value="no"
v-model:value="form.allows_submission" />
v-model="form.allows_submission" />
<help-button
:title="$i18n.getHelperTitle('collections', 'allows_submission')"
:message="$i18n.getHelperMessage('collections', 'allows_submission')"/>
@ -272,7 +273,7 @@
size="is-small"
true-value="yes"
false-value="no"
v-model:value="form.submission_anonymous_user" />
v-model="form.submission_anonymous_user" />
<help-button
:title="$i18n.getHelperTitle('collections', 'submission_anonymous_user')"
:message="$i18n.getHelperMessage('collections', 'submission_anonymous_user')"/>
@ -289,7 +290,7 @@
:message="$i18n.getHelperMessage('collections', 'submission_default_status')"/>
<div class="status-radios">
<b-radio
v-model:value="form.submission_default_status"
v-model="form.submission_default_status"
v-for="(statusOption, index) of $statusHelper.getStatuses().filter((status) => status.slug != 'trash')"
:key="index"
:native-value="statusOption.slug">
@ -322,7 +323,7 @@
size="is-small"
true-value="yes"
false-value="no"
v-model:value="form.submission_use_recaptcha" />
v-model="form.submission_use_recaptcha" />
<help-button
:title="$i18n.getHelperTitle('collections', 'submission_use_recaptcha')"
:message="$i18n.getHelperMessage('collections', 'submission_use_recaptcha')"/>
@ -358,7 +359,7 @@
:message="$i18n.getHelperMessage('collections', 'status')"/>
<div class="status-radios">
<b-radio
v-model:value="form.status"
v-model="form.status"
v-for="(statusOption, index) of $statusHelper.getStatuses().filter((status) => status.slug != 'draft')"
:key="index"
:native-value="statusOption.slug">
@ -505,7 +506,7 @@
size="is-small"
true-value="yes"
false-value="no"
v-model:value="form.enable_cover_page" />
v-model="form.enable_cover_page" />
<help-button
:title="$i18n.getHelperTitle('collections', 'cover_page_id')"
:message="$i18n.getHelperMessage('collections', 'cover_page_id')"/>
@ -513,10 +514,10 @@
id="tainacan-text-cover-page"
:placeholder="$i18n.get('instruction_cover_page')"
:data="coverPages"
v-model:value="coverPageTitle"
v-model="coverPageTitle"
@select="onSelectCoverPage($event)"
:loading="isFetchingPages"
@input="fecthCoverPages"
@update:model-value="fecthCoverPages"
@focus="clearErrors('cover_page_id')"
v-if="coverPage == undefined || coverPage.title == undefined"
:disabled="form.enable_cover_page != 'yes'"
@ -608,7 +609,7 @@
<b-select
expanded
id="tainacan-select-parent"
v-model:value="form.parent"
v-model="form.parent"
@focus="clearErrors('parent')"
:loading="isFetchingCollections"
:placeholder="$i18n.get('instruction_select_a_parent_collection')">
@ -683,7 +684,7 @@
</div>
<b-loading
v-model:active="isLoading"
v-model="isLoading"
:can-cancel="false"/>
</div>
</template>

View File

@ -6,7 +6,7 @@
{ path: '', label: exporterType != undefined ? (exporterName != undefined ? exporterName : exporterType) : $i18n.get('title_exporter_page') }
]"/>
<b-loading
v-model:active="isLoading"
v-model="isLoading"
:can-cancel="false"/>
<form
@click="formErrorMessage = ''"
@ -34,9 +34,9 @@
extra-classes="tainacan-repository-tooltip"/>
<br>
<b-select
@input="formErrorMessage = null"
@update:model-value="formErrorMessage = null"
expanded
v-model:value="selectedCollection"
v-model="selectedCollection"
:loading="isFetchingCollections"
:placeholder="$i18n.get('instruction_select_a_collection')">
<option
@ -55,9 +55,9 @@
exporterSession.mapping_list.length"
:label="$i18n.get('mapping')">
<b-select
@input="formErrorMessage = null"
@update:model-value="formErrorMessage = null"
expanded
v-model:value="selectedMapping"
v-model="selectedMapping"
:placeholder="$i18n.get('instruction_select_a_mapper')">
<option
v-if="exporterSession.accept_no_mapping"
@ -81,8 +81,8 @@
<b-checkbox
true-value="1"
false-value="0"
v-model:value="sendEmail"
@input="formErrorMessage = null">
v-model="sendEmail"
@update:model-value="formErrorMessage = null">
{{ $i18n.get('label_yes') }}
</b-checkbox>
</b-field>

View File

@ -18,7 +18,7 @@
:message="$i18n.getHelperMessage('filters', 'name')"/>
</label>
<b-input
v-model:value="form.name"
v-model="form.name"
name="name"
@focus="clearErrors('name')"/>
</b-field>
@ -45,7 +45,7 @@
type="textarea"
name="description"
:rows="3"
v-model:value="form.description"
v-model="form.description"
@focus="clearErrors('description')" />
</b-field>
@ -64,7 +64,7 @@
@focus="clearErrors('label_status')"
id="tainacan-select-status-publish"
name="status"
v-model:value="form.status"
v-model="form.status"
native-value="publish">
<span class="icon has-text-gray3">
<i class="tainacan-icon tainacan-icon-public"/>
@ -76,7 +76,7 @@
@focus="clearErrors('label_status')"
id="tainacan-select-status-private"
name="status"
v-model:value="form.status"
v-model="form.status"
native-value="private">
<span class="icon has-text-gray3">
<i class="tainacan-icon tainacan-icon-private"/>
@ -101,7 +101,7 @@
class="is-flex">
<b-select
name="max_options"
v-model:value="form.max_options"
v-model="form.max_options"
:placeholder="$i18n.get('instruction_select_max_options_to_show')">
<option value="4">4</option>
<option value="8">8</option>
@ -132,7 +132,7 @@
class="is-flex">
<b-input
name="max_options"
v-model:value="form.max_options"
v-model="form.max_options"
type="number"
step="1" />
<button
@ -160,8 +160,8 @@
&nbsp;
<b-switch
size="is-small"
@input="clearErrors('begin_with_filter_collapsed')"
v-model:value="form.begin_with_filter_collapsed"
@update:model-value="clearErrors('begin_with_filter_collapsed')"
v-model="form.begin_with_filter_collapsed"
:true-value="'yes'"
:false-value="'no'"
:native-value="form.begin_with_filter_collapsed == 'yes' ? 'yes' : 'no'"
@ -197,8 +197,9 @@
<button
type="button"
class="button is-outlined"
@click.prevent="cancelEdition()"
slot="trigger">{{ $i18n.get('cancel') }}</button>
@click.prevent="cancelEdition()">
{{ $i18n.get('cancel') }}
</button>
</div>
<div class="control">
<b-button

View File

@ -29,7 +29,7 @@
<br>
<b-upload
v-if="importer.tmp_file == undefined && (importerFile == undefined || importerFile == null || importerFile == '')"
v-model:value="importerFile"
v-model="importerFile"
drag-drop
class="source-file-upload">
<section class="drop-inner">
@ -80,7 +80,7 @@
extra-classes="tainacan-repository-tooltip"/>
<b-input
id="tainacan-url-link-source"
v-model:value="url"/>
v-model="url"/>
</b-field>
</div>
@ -109,8 +109,8 @@
<b-select
expanded
id="tainacan-select-target-collection"
:value="collectionId"
@input="onSelectCollection($event)"
:model-value="collectionId"
@update:model-value="onSelectCollection($event)"
:loading="isFetchingCollections"
:placeholder="$i18n.get('instruction_select_a_target_collection')">
<option
@ -192,7 +192,7 @@
</form>
<b-loading
v-model:active="isLoading"
v-model="isLoading"
:can-cancel="false"/>
</div>
</template>

View File

@ -23,7 +23,7 @@
</div>
<b-loading
v-model:active="isLoading"
v-model="isLoading"
:can-cancel="false"/>
<form
@ -35,7 +35,7 @@
<b-loading
:is-full-page="false"
v-model:active="isLoadingSourceInfo"
v-model="isLoadingSourceInfo"
:can-cancel="false"/>
<!-- Metadata Mapping -->
@ -88,8 +88,8 @@
v-if="collectionMetadata != undefined &&
collectionMetadata.length > 0 &&
!isFetchingCollectionMetadata"
:value="checkCurrentSelectedCollectionMetadatum(sourceMetadatum)"
@input="onSelectCollectionMetadata($event, sourceMetadatum)"
:model-value="checkCurrentSelectedCollectionMetadatum(sourceMetadatum)"
@update:model-value="onSelectCollectionMetadata($event, sourceMetadatum)"
:placeholder="$i18n.get('label_select_metadatum')">
<option :value="null">
{{ $i18n.get('label_select_metadatum') }}
@ -124,8 +124,8 @@
v-if="collectionMetadata != undefined &&
collectionMetadata.length > 0 &&
!isFetchingCollectionMetadata"
:value="checkCurrentSelectedCollectionMetadatum(Object.entries(sourceMetadatum)[0][0], true)"
@input="onSelectCollectionMetadata($event, Object.entries(sourceMetadatum)[0][0], true, Object.entries(sourceMetadatum)[0][1])"
:model-value="checkCurrentSelectedCollectionMetadatum(Object.entries(sourceMetadatum)[0][0], true)"
@update:model-value="onSelectCollectionMetadata($event, Object.entries(sourceMetadatum)[0][0], true, Object.entries(sourceMetadatum)[0][1])"
:placeholder="$i18n.get('label_select_metadatum')">
<option :value="null">
{{ $i18n.get('label_select_metadatum') }}
@ -161,8 +161,8 @@
collectionMetadata.length > 0 &&
!isFetchingCollectionMetadata"
:disabled="[undefined, null, false, 'create_metadata' + index].includes(checkCurrentSelectedCollectionMetadatum(Object.entries(sourceMetadatum)[0][0], true))"
:value="checkCurrentSelectedCollectionChildMetadatum(childSourceMetadatum, checkCurrentSelectedCollectionMetadatum(Object.entries(sourceMetadatum)[0][0], true))"
@input="onSelectCollectionChildMetadata($event, childSourceMetadatum, checkCurrentSelectedCollectionMetadatum(Object.entries(sourceMetadatum)[0][0], true), Object.entries(sourceMetadatum)[0][0])"
:model-value="checkCurrentSelectedCollectionChildMetadatum(childSourceMetadatum, checkCurrentSelectedCollectionMetadatum(Object.entries(sourceMetadatum)[0][0], true))"
@update:model-value="onSelectCollectionChildMetadata($event, childSourceMetadatum, checkCurrentSelectedCollectionMetadatum(Object.entries(sourceMetadatum)[0][0], true), Object.entries(sourceMetadatum)[0][0])"
:placeholder="$i18n.get('label_select_metadatum')">
<option :value="null">
{{ $i18n.get('label_select_metadatum') }}
@ -200,7 +200,7 @@
<b-modal
@close="onMetadatumEditionCanceled()"
v-model:active="isNewMetadatumModalActive"
v-model="isNewMetadatumModalActive"
trap-focus
aria-modal
aria-role="dialog"
@ -214,7 +214,7 @@
v-if="selectedMetadatumType == undefined && !isEditingMetadatum">
<b-loading
:is-full-page="isFullPage"
v-model:active="isLoadingMetadatumTypes"/>
v-model="isLoadingMetadatumTypes"/>
<div
class="tainacan-modal-content">
@ -287,7 +287,7 @@
<!-- Prompt to show title -->
<b-modal
v-if="importerSourceInfo"
v-model:active="showTitlePromptModal"
v-model="showTitlePromptModal"
:can-cancel="false"
:width="820"
scroll="keep"
@ -309,7 +309,7 @@
<b-field>
<b-select
expanded
v-model:value="selectedTitle"
v-model="selectedTitle"
:placeholder="$i18n.get('label_select_metadatum')">
<option
v-for="(sourceMetadatum, index) of importerSourceInfo.source_metadata"

View File

@ -2,7 +2,7 @@
<div>
<b-loading
:is-full-page="false"
v-model:active="isLoading"
v-model="isLoading"
:can-cancel="false"/>
<div
v-if="!$adminOptions.hideBulkEditionPageTitle"
@ -26,10 +26,10 @@
<br>
<b-upload
native
v-model:value="submitedFileList"
v-model="submitedFileList"
drag-drop
multiple
@input="uploadFiles()"
@update:model-value="uploadFiles()"
class="source-file-upload">
<section class="drop-inner">
<div class="content has-text-centered">
@ -150,8 +150,9 @@
<button
type="button"
class="button is-outlined"
@click.prevent="$router.go(-1)"
slot="trigger">{{ $i18n.get('cancel') }}</button>
@click.prevent="$router.go(-1)">
{{ $i18n.get('cancel') }}
</button>
</div>
<div
style="margin-left: auto;"
@ -161,7 +162,9 @@
class="button is-secondary"
:class="{'is-loading': isCreatingSequenceEditGroup }"
@click.prevent="sequenceEditGroup()"
type="submit">{{ $i18n.get('label_sequence_edit_items') }}</button>
type="submit">
{{ $i18n.get('label_sequence_edit_items') }}
</button>
</div>
<div class="control">
<button

View File

@ -2,7 +2,7 @@
<div :class="isCreatingNewItem ? 'item-creation-container' : 'item-edition-container'"><!-- Do NOT remove this classes, they may be used by third party plugins -->
<b-loading
:is-full-page="false"
v-model:active="isLoading"
v-model="isLoading"
:can-cancel="false"/>
<tainacan-title
@ -216,8 +216,7 @@
</ul>
<button
class="swiper-button-prev"
id="tainacan-tabs-prev"
slot="button-prev">
id="tainacan-tabs-prev">
<svg
width="24"
height="24"
@ -344,7 +343,7 @@
id="tainacan-switch-required-metadata"
:style="'font-size: 0.625em;' + (isMobileScreen ? 'margin-right: 2rem;' : '')"
size="is-small"
v-model:value="showOnlyRequiredMetadata">
v-model="showOnlyRequiredMetadata">
{{ isMobileScreen ? $i18n.get('label_required') : $i18n.get('label_only_required') }} *
</b-switch>
@ -354,7 +353,7 @@
<b-input
v-if="!isMobileScreen || openMetadataNameFilter"
:placeholder="$i18n.get('instruction_type_search_metadata_filter')"
v-model:value="metadataNameFilterString"
v-model="metadataNameFilterString"
icon="magnify"
size="is-small"
icon-right="close-circle"
@ -676,7 +675,7 @@
size="is-small"
true-value="open"
false-value="closed"
v-model:value="form.comment_status">
v-model="form.comment_status">
<span class="icon has-text-gray4">
<i class="tainacan-icon tainacan-icon-comment"/>
</span>

View File

@ -30,7 +30,7 @@
:extra-classes="isRepositoryLevel ? 'tainacan-repository-tooltip' : ''" />
</label>
<b-input
v-model:value="form.name"
v-model="form.name"
name="name"
@focus="clearErrors('name')"/>
</b-field>
@ -59,7 +59,7 @@
type="textarea"
name="description"
rows="3"
v-model:value="form.description"
v-model="form.description"
@focus="clearErrors('description')"/>
</b-field>
@ -71,8 +71,8 @@
&nbsp;
<b-switch
size="is-small"
@input="clearErrors('description_bellow_name')"
v-model:value="form.description_bellow_name"
@update:model-value="clearErrors('description_bellow_name')"
v-model="form.description_bellow_name"
true-value="yes"
false-value="no"
name="description_bellow_name">
@ -100,7 +100,7 @@
@focus="clearErrors('label_status')"
id="tainacan-select-status-publish"
name="status"
v-model:value="form.status"
v-model="form.status"
native-value="publish">
<span class="icon has-text-gray3">
<i class="tainacan-icon tainacan-icon-public"/>
@ -111,7 +111,7 @@
@focus="clearErrors('label_status')"
id="tainacan-select-status-private"
name="status"
v-model:value="form.status"
v-model="form.status"
native-value="private">
<span class="icon has-text-gray3">
<i class="tainacan-icon tainacan-icon-private"/>
@ -151,8 +151,8 @@
&nbsp;
<b-switch
size="is-small"
@input="clearErrors('is_conditional_section')"
v-model:value="form.is_conditional_section"
@update:model-value="clearErrors('is_conditional_section')"
v-model="form.is_conditional_section"
true-value="yes"
false-value="no"
name="is_conditional_section">
@ -179,7 +179,7 @@
:extra-classes="isRepositoryLevel ? 'tainacan-repository-tooltip' : ''" />
</label>
<b-select
v-model:value="selectedConditionalMetadatum"
v-model="selectedConditionalMetadatum"
:placeholder="$i18n.get('label_select_metadatum')">
<option
v-for="conditionalMetadatum of availableConditionalMetadata"
@ -201,7 +201,7 @@
</label>
<div style="overflow-y: auto; overflow-x: hidden; max-height: 100px;">
<b-checkbox
v-model:value="selectedConditionalValue"
v-model="selectedConditionalValue"
v-for="(conditionalValue, conditionalValueIndex) of availableConditionalMetadata.find((availableMetadatum) => availableMetadatum.id == selectedConditionalMetadatum).metadata_type_object.options.options.split('\n')"
:key="conditionalValueIndex"
:native-value="conditionalValue">
@ -228,8 +228,8 @@
<button
type="button"
class="button is-outlined"
@click.prevent="cancelEdition()"
slot="trigger">{{ $i18n.get('cancel') }}
@click.prevent="cancelEdition()">
{{ $i18n.get('cancel') }}
</button>
</div>
<p class="help is-danger">{{ formErrorMessage }}</p>

View File

@ -38,7 +38,7 @@
:extra-classes="isRepositoryLevel ? 'tainacan-repository-tooltip' : ''" />
</label>
<b-input
v-model:value="form.name"
v-model="form.name"
name="name"
@focus="clearErrors('name')"/>
</b-field>
@ -67,7 +67,7 @@
type="textarea"
name="description"
rows="3"
v-model:value="form.description"
v-model="form.description"
@focus="clearErrors('description')"/>
</b-field>
@ -79,8 +79,8 @@
&nbsp;
<b-switch
size="is-small"
@input="clearErrors('description_bellow_name')"
v-model:value="form.description_bellow_name"
@update:model-value="clearErrors('description_bellow_name')"
v-model="form.description_bellow_name"
true-value="yes"
false-value="no"
name="description_bellow_name">
@ -104,7 +104,7 @@
:extra-classes="isRepositoryLevel ? 'tainacan-repository-tooltip' : ''" />
</label>
<b-input
v-model:value="form.placeholder"
v-model="form.placeholder"
name="placeholder"
@focus="clearErrors('placeholder')"/>
</b-field>
@ -126,7 +126,7 @@
@focus="clearErrors('label_status')"
id="tainacan-select-status-publish"
name="status"
v-model:value="form.status"
v-model="form.status"
native-value="publish">
<span class="icon has-text-gray3">
<i class="tainacan-icon tainacan-icon-public"/>
@ -137,7 +137,7 @@
@focus="clearErrors('label_status')"
id="tainacan-select-status-private"
name="status"
v-model:value="form.status"
v-model="form.status"
native-value="private">
<span class="icon has-text-gray3">
<i class="tainacan-icon tainacan-icon-private"/>
@ -162,8 +162,8 @@
</label>
<b-select
expanded
v-model:value="form.display"
@input="clearErrors('display')">
v-model="form.display"
@update:model-value="clearErrors('display')">
<option value="yes">
{{ $i18n.get('label_display_default') }}
</option>
@ -185,8 +185,8 @@
:type="formErrors['required'] != undefined ? 'is-danger' : ''"
:message="formErrors['required'] != undefined ? formErrors['required'] : ''">
<b-checkbox
@input="clearErrors('required')"
v-model:value="form.required"
@update:model-value="clearErrors('required')"
v-model="form.required"
true-value="yes"
false-value="no"
class="is-inline-block"
@ -204,8 +204,8 @@
:type="formErrors['collection_key'] != undefined ? 'is-danger' : ''"
:message="formErrors['collection_key'] != undefined ? formErrors['collection_key'] : ''">
<b-checkbox
@input="clearErrors('collection_key')"
v-model:value="form.collection_key"
@update:model-value="clearErrors('collection_key')"
v-model="form.collection_key"
true-value="yes"
false-value="no"
class="is-inline-block"
@ -223,8 +223,8 @@
:type="formErrors['multiple'] != undefined ? 'is-danger' : ''"
:message="formErrors['multiple'] != undefined ? formErrors['multiple'] : ''">
<b-checkbox
@input="clearErrors('multiple')"
v-model:value="form.multiple"
@update:model-value="clearErrors('multiple')"
v-model="form.multiple"
true-value="yes"
false-value="no"
class="is-inline-block"
@ -247,7 +247,7 @@
<b-switch
size="is-small"
:disabled="form.multiple != 'yes'"
v-model:value="showCardinalityOptions" />
v-model="showCardinalityOptions" />
</b-field>
<b-field
@ -267,14 +267,14 @@
name="cardinality"
step="1"
min="2"
v-model:value="form.cardinality"/>
v-model="form.cardinality"/>
</b-field>
<b-field v-if="!isRepositoryLevel && isInsideImporterFlow">
<b-checkbox
class="is-inline-block"
v-model:value="form.repository_level"
@input="clearErrors('repository_level')"
v-model="form.repository_level"
@update:model-value="clearErrors('repository_level')"
name="repository_level"
true-value="yes"
false-value="no">
@ -354,7 +354,7 @@
:extra-classes="isRepositoryLevel ? 'tainacan-repository-tooltip' : ''" />
</label>
<b-input
v-model:value="form.semantic_uri"
v-model="form.semantic_uri"
name="semantic_uri"
type="url"
@focus="clearErrors('semantic_uri')"/>
@ -369,8 +369,8 @@
<button
type="button"
class="button is-outlined"
@click.prevent="cancelEdition()"
slot="trigger">{{ $i18n.get('cancel') }}
@click.prevent="cancelEdition()">
{{ $i18n.get('cancel') }}
</button>
</div>
<p class="help is-danger">{{ formErrorMessage }}</p>

View File

@ -27,7 +27,7 @@
extra-classes="tainacan-repository-tooltip"/>
<b-input
id="tainacan-text-name"
v-model:value="form.name"
v-model="form.name"
@focus="clearErrors('name')"
@blur="updateSlug()"
:disabled="isUpdatingSlug"
@ -56,7 +56,7 @@
id="tainacan-text-description"
type="textarea"
rows="3"
v-model:value="form.description"
v-model="form.description"
@focus="clearErrors('description')"/>
</b-field>
@ -67,7 +67,7 @@
<b-switch
id="tainacan-checkbox-allow-insert"
size="is-small"
v-model:value="form.allowInsert"
v-model="form.allowInsert"
true-value="yes"
false-value="no" />
<help-button
@ -84,7 +84,7 @@
<b-switch
id="tainacan-checkbox-allow-insert"
size="is-small"
v-model:value="form.hierarchical"
v-model="form.hierarchical"
true-value="yes"
false-value="no" />
<help-button
@ -105,9 +105,9 @@
:message="$i18n.getHelperMessage('taxonomies', 'slug')"
extra-classes="tainacan-repository-tooltip"/>
<b-input
@input="updateSlug()"
@update:model-value="updateSlug()"
id="tainacan-text-slug"
v-model:value="form.slug"
v-model="form.slug"
@focus="clearErrors('slug')"
:disabled="isUpdatingSlug"/>
</b-field>
@ -132,7 +132,7 @@
:native-value="wpPostType.slug"
:true-value="wpPostType.slug"
false-value=""
v-model:value="form.enabledPostTypes"
v-model="form.enabledPostTypes"
name="enabled_post_types" >
{{ wpPostType.label }}
</b-checkbox>
@ -156,7 +156,7 @@
extra-classes="tainacan-repository-tooltip"/>
<div class="status-radios">
<b-radio
v-model:value="form.status"
v-model="form.status"
v-for="(statusOption, index) of $statusHelper.getStatuses().filter((status) => status.slug != 'draft')"
:key="index"
:native-value="statusOption.slug">
@ -258,7 +258,7 @@
</div>
<b-loading
v-model:active="isLoadingTaxonomy"
v-model="isLoadingTaxonomy"
:can-cancel="false"/>
</div>

View File

@ -25,7 +25,7 @@
<div class="modal-card-body">
<b-loading
:is-full-page="false"
v-model:active="isLoading" />
v-model="isLoading" />
<!-- Name -------------- -->
<b-field
@ -42,7 +42,7 @@
</label>
<b-input
:placeholder="$i18n.get('label_term_without_name')"
v-model:value="form.name"
v-model="form.name"
name="name"
@focus="clearErrors({ name: 'name', repeated: 'repeated' })"/>
</b-field>
@ -126,7 +126,7 @@
<b-input
type="textarea"
name="description"
v-model:value="form.description"
v-model="form.description"
@focus="clearErrors('description')"/>
</b-field>
</div>
@ -141,10 +141,10 @@
<label class="label is-inline">
{{ $i18n.get('label_parent_term') }}
<b-switch
@input="onToggleSwitch()"
@update:model-value="onToggleSwitch()"
id="tainacan-checkbox-has-parent"
size="is-small"
v-model:value="hasParent" />
v-model="hasParent" />
<help-button
:title="$i18n.get('label_parent_term')"
:message="$i18n.get('info_help_parent_term')"
@ -156,10 +156,10 @@
:data="parentTerms"
field="name"
clearable
v-model:value="parentTermName"
v-model="parentTermName"
@select="onSelectParentTerm($event)"
:loading="isFetchingParentTerms"
@input="fetchParentTerms"
@update:model-value="fetchParentTerms"
@focus="clearErrors('parent');"
:disabled="!hasParent"
:append-to-body="true"
@ -204,8 +204,7 @@
<button
type="button"
class="button is-outlined"
@click.prevent="cancelEdition()"
slot="trigger">
@click.prevent="cancelEdition()">
{{ $i18n.get('cancel') }}
</button>
</div>

View File

@ -4,11 +4,11 @@
icon="magnify"
size="is-small"
:aria-labelledby="'filter-label-id-' + filter.id"
v-model:value="selected"
v-model="selected"
:data="options"
expanded
:loading="isLoadingOptions"
@input="($event) => { resetPage(); search($event); }"
@update:model-value="($event) => { resetPage(); search($event); }"
field="label"
@select="onSelect"
clearable

View File

@ -107,10 +107,10 @@
this.loadOptions();
},
created() {
this.$eventBusSearch.$emitter.on('hasToReloadFacets', this.reloadOptions);
this.$eventBusSearchEmitter.on('hasToReloadFacets', this.reloadOptions);
},
beforeUnmount() {
this.$eventBusSearch.$emitter.off('hasToReloadFacets', this.reloadOptions);
this.$eventBusSearchEmitter.off('hasToReloadFacets', this.reloadOptions);
},
methods: {
reloadOptions(shouldReload) {

View File

@ -3,9 +3,9 @@
<b-datepicker
:aria-labelledby="'filter-label-id-' + filter.id"
:placeholder="$i18n.get('label_selectbox_init')"
v-model:value="dateInit"
v-model="dateInit"
@focus="isTouched = true"
@input="($event) => { resetPage(); validadeValues($event) }"
@update:model-value="($event) => { resetPage(); validadeValues($event) }"
editable
:trap-focus="false"
:date-formatter="(date) => dateFormatter(date)"
@ -29,8 +29,8 @@
<b-datepicker
:aria-labelledby="'filter-label-id-' + filter.id"
:placeholder="$i18n.get('label_selectbox_init')"
v-model:value="dateEnd"
@input="validadeValues()"
v-model="dateEnd"
@update:model-value="validadeValues()"
@focus="isTouched = true"
editable
:trap-focus="false"

View File

@ -2,20 +2,21 @@
<div class="date-filter-container">
<b-dropdown
:mobile-modal="true"
@input="($event) => { resetPage(); onChangeComparator($event) }"
@update:model-value="($event) => { resetPage(); onChangeComparator($event) }"
aria-role="list"
trap-focus>
<button
:aria-label="$i18n.get('label_comparator')"
class="button is-white"
slot="trigger">
<span class="icon is-small">
<i v-html="comparatorSymbol" />
</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
<template #trigger>
<button
:aria-label="$i18n.get('label_comparator')"
class="button is-white">
<span class="icon is-small">
<i v-html="comparatorSymbol" />
</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
</template>
<b-dropdown-item
role="button"
:class="{ 'is-active': comparator == '=' }"
@ -67,14 +68,14 @@
:aria-plus-label="$i18n.get('label_increase')"
size="is-small"
step="1"
@input="emitOnlyYear($event)"
v-model:value="yearsOnlyValue"/> -->
@update:model-value="emitOnlyYear($event)"
v-model="yearsOnlyValue"/> -->
<b-datepicker
position="is-bottom-left"
:aria-labelledby="'filter-label-id-' + filter.id"
:placeholder="$i18n.get('instruction_select_a_date')"
v-model:value="value"
@input="($event) => { resetPage(); emit($event); }"
v-model="value"
@update:model-value="($event) => { resetPage(); emit($event); }"
editable
:trap-focus="false"
:date-formatter="(date) => dateFormatter(date)"

View File

@ -9,8 +9,8 @@
</label>
<b-select
name="type_options"
v-model:value="type"
@input="onUpdateType">
v-model="type"
@update:model-value="onUpdateType">
<option value="day">{{ $i18n.get('label_day') }}</option>
<option value="month">{{ $i18n.get('label_month') }}</option>
<option value="year">{{ $i18n.get('label_year') }}</option>

View File

@ -12,8 +12,8 @@
class="is-flex">
<b-select
name="step_options"
v-model:value="step"
@input="onUpdateStep">
v-model="step"
@update:model-value="onUpdateStep">
<option value="0.001">0.001</option>
<option value="0.01">0.01</option>
<option value="0.1">0.1</option>
@ -49,8 +49,8 @@
class="is-flex">
<b-input
name="max_options"
v-model:value="step"
@input="onUpdateStep"
v-model="step"
@update:model-value="onUpdateStep"
type="number"
step="1" />
<button

View File

@ -5,9 +5,9 @@
:aria-minus-label="$i18n.get('label_decrease')"
:aria-plus-label="$i18n.get('label_increase')"
size="is-small"
@input="($event) => { resetPage(); validadeValues($event) }"
@update:model-value="($event) => { resetPage(); validadeValues($event) }"
:step="filterTypeOptions.step"
v-model:value="valueInit"
v-model="valueInit"
/>
<p
style="font-size: 0.75em; margin-bottom: 0.125em;"
@ -19,9 +19,9 @@
:aria-minus-label="$i18n.get('label_decrease')"
:aria-plus-label="$i18n.get('label_increase')"
size="is-small"
@input="($event) => { resetPage(); validadeValues($event) }"
@update:model-value="($event) => { resetPage(); validadeValues($event) }"
:step="filterTypeOptions.step"
v-model:value="valueEnd"/>
v-model="valueEnd"/>
</div>
</template>

View File

@ -10,8 +10,8 @@
<div>
<b-field>
<b-checkbox
v-model:value="showIntervalOnTag"
@input="onUpdateShowIntervalOnTag()">
v-model="showIntervalOnTag"
@update:model-value="onUpdateShowIntervalOnTag()">
{{ $i18n.get('info_show_interval_on_tag') }}
</b-checkbox>
</b-field>
@ -33,8 +33,8 @@
<b-input
expanded
:placeholder="$i18n.get('label')"
@input="onUpdate(interval)"
v-model:value="interval.label" />
@update:model-value="onUpdate(interval)"
v-model="interval.label" />
</b-field>
<b-field>
<b-input
@ -42,15 +42,15 @@
type="number"
step="0.01"
:placeholder="$i18n.get('info_initial_value')"
@input="onUpdate(interval, true)"
v-model:value="interval.from" />
@update:model-value="onUpdate(interval, true)"
v-model="interval.from" />
<b-input
expanded
type="number"
step="0.01"
:placeholder="$i18n.get('info_final_value')"
@input="onUpdate(interval, true)"
v-model:value="interval.to" />
@update:model-value="onUpdate(interval, true)"
v-model="interval.to" />
</b-field>
<p class="control">
<a

View File

@ -3,8 +3,8 @@
<b-select
expanded
:placeholder="$i18n.get('instruction_select_a_interval')"
@input="($event) => { resetPage; changeInterval($event) }"
v-model:value="selectedInterval">
@update:model-value="($event) => { resetPage; changeInterval($event) }"
v-model="selectedInterval">
<option value="">
{{ $i18n.get('label_selectbox_init') }}...
</option>

View File

@ -12,8 +12,8 @@
class="is-flex">
<b-select
name="step_options"
v-model:value="step"
@input="onUpdateStep">
v-model="step"
@update:model-value="onUpdateStep">
<option value="0.001">0.001</option>
<option value="0.01">0.01</option>
<option value="0.1">0.1</option>
@ -49,8 +49,8 @@
class="is-flex">
<b-input
name="max_options"
v-model:value="step"
@input="onUpdateStep"
v-model="step"
@update:model-value="onUpdateStep"
type="number"
step="1" />
<button

View File

@ -2,20 +2,21 @@
<div class="numeric-filter-container">
<b-dropdown
:mobile-modal="true"
@input="($event) => { resetPage(); onChangeComparator($event) }"
@update:model-value="($event) => { resetPage(); onChangeComparator($event) }"
aria-role="list"
trap-focus>
<button
:aria-label="$i18n.get('label_comparator')"
class="button is-white"
slot="trigger">
<span class="icon is-small">
<i v-html="comparatorSymbol" />
</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
<template #trigger>
<button
:aria-label="$i18n.get('label_comparator')"
class="button is-white">
<span class="icon is-small">
<i v-html="comparatorSymbol" />
</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
</template>
<b-dropdown-item
role="button"
:class="{ 'is-active': comparator == '=' }"
@ -66,8 +67,8 @@
:aria-plus-label="$i18n.get('label_increase')"
size="is-small"
:step="Number(filterTypeOptions.step)"
@input="($event) => { resetPage($event); emit($event); }"
v-model:value="value"/>
@update:model-value="($event) => { resetPage($event); emit($event); }"
v-model="value"/>
</div>
</template>

View File

@ -4,9 +4,9 @@
class="block">
<b-select
v-if="!isLoadingOptions"
:value="selected"
:model-value="selected"
:aria-labelledby="'filter-label-id-' + filter.id"
@input="($event) => { resetPage(); onSelect($event) }"
@update:model-value="($event) => { resetPage(); onSelect($event) }"
:placeholder="$i18n.get('label_selectbox_init')"
expanded>
<option value="">{{ $i18n.get('label_selectbox_init') }}...</option>
@ -55,10 +55,10 @@
this.loadOptions();
},
created() {
this.$eventBusSearch.$emitter.on('hasToReloadFacets', this.reloadOptions);
this.$eventBusSearchEmitter.on('hasToReloadFacets', this.reloadOptions);
},
beforeUnmount() {
this.$eventBusSearch.$emitter.off('hasToReloadFacets', this.reloadOptions);
this.$eventBusSearchEmitter.off('hasToReloadFacets', this.reloadOptions);
},
methods: {
reloadOptions(shouldReload) {

View File

@ -10,7 +10,7 @@
:remove-on-keys="[]"
field="label"
attached
@input="($event) => { resetPage(); onSelect($event) }"
@update:model-value="($event) => { resetPage(); onSelect($event) }"
@typing="search"
:aria-close-label="$i18n.get('remove_value')"
:aria-labelledby="'filter-label-id-' + filter.id"

View File

@ -8,38 +8,38 @@
<b-collapse
v-if="displayFilter"
class="show"
v-model:open="singleCollapseOpen"
v-model="singleCollapseOpen"
animation="filter-item">
<button
:for="'filter-input-id-' + filter.id"
:aria-controls="'filter-input-id-' + filter.id"
:aria-expanded="singleCollapseOpen"
v-tooltip="{
delay: {
shown: 500,
hide: 300,
},
content: filter.name,
html: false,
autoHide: false,
placement: 'top-start',
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : '']
}"
:id="'filter-label-id-' + filter.id"
:aria-label="filter.name"
class="label"
slot="trigger"
slot-scope="props">
<span class="icon">
<i
:class="{
'tainacan-icon-arrowdown' : props.open,
'tainacan-icon-arrowright' : !props.open
}"
class="tainacan-icon tainacan-icon-1-25em"/>
</span>
<span class="collapse-label">{{ filter.name }}</span>
</button>
<template #trigger="{ props }">
<button
:for="'filter-input-id-' + filter.id"
:aria-controls="'filter-input-id-' + filter.id"
:aria-expanded="singleCollapseOpen"
v-tooltip="{
delay: {
shown: 500,
hide: 300,
},
content: filter.name,
html: false,
autoHide: false,
placement: 'top-start',
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : '']
}"
:id="'filter-label-id-' + filter.id"
:aria-label="filter.name"
class="label">
<span class="icon">
<i
:class="{
'tainacan-icon-arrowdown' : props.open,
'tainacan-icon-arrowright' : !props.open
}"
class="tainacan-icon tainacan-icon-1-25em"/>
</span>
<span class="collapse-label">{{ filter.name }}</span>
</button>
</template>
<div :id="'filter-input-id-' + filter.id">
<component
:is="filter.filter_type_object ? filter.filter_type_object.component : null"
@ -150,7 +150,7 @@
},
methods: {
onInput(inputEvent) {
this.$eventBusSearch.$emit('input', inputEvent);
this.$eventBusSearchEmitter.emit('input', inputEvent);
},
onFilterUpdateParentCollapse(open) {
const componentsThatShouldCollapseIfEmpty = ['tainacan-filter-taxonomy-checkbox', 'tainacan-filter-selectbox', 'tainacan-filter-checkbox'];

View File

@ -133,7 +133,7 @@
this.taxonomyId = this.filter.metadatum.metadata_type_object.options.taxonomy_id;
this.taxonomy = this.filter.metadatum.metadata_type_object.options.taxonomy;
}
this.$eventBusSearch.$emitter.on('hasToReloadFacets', this.reloadOptions);
this.$eventBusSearchEmitter.on('hasToReloadFacets', this.reloadOptions);
},
mounted(){
if (!this.isUsingElasticSearch)
@ -145,7 +145,7 @@
if (this.getOptionsValuesCancel != undefined)
this.getOptionsValuesCancel.cancel('Facet search Canceled.');
this.$eventBusSearch.$emitter.off('hasToReloadFacets', this.reloadOptions);
this.$eventBusSearchEmitter.off('hasToReloadFacets', this.reloadOptions);
},
methods: {
...mapGetters('search', [

View File

@ -14,7 +14,7 @@
:aria-labelledby="'filter-label-id-' + filter.id"
:class="{'has-selected': selected != undefined && selected != []}"
@typing="search"
@input="($event) => { resetPage(); onSelect($event) }"
@update:model-value="($event) => { resetPage(); onSelect($event) }"
:placeholder="$i18n.get('info_type_to_add_terms')"
check-infinite-scroll
@infinite-scroll="searchMore">

View File

@ -5,7 +5,7 @@
class="table-container">
<b-loading
:is-full-page="false"
v-model:active="isLoading" />
v-model="isLoading" />
<div
v-if="attachments.length > 0"
class="table-wrapper">
@ -74,7 +74,7 @@
<b-pagination
@change="onPageChange"
:total="totalAttachments"
v-model:current="attachmentsPage"
v-model="attachmentsPage"
order="is-centered"
size="is-small"
:per-page="attachmentsPerPage"

View File

@ -1,7 +1,7 @@
<template>
<div class="column">
<b-loading v-model:active="isLoadingMetadataSections"/>
<b-loading v-model="isLoadingMetadataSections"/>
<div class="tainacan-form sub-header">
<template v-if="activeMetadataSectionsList">
@ -27,15 +27,16 @@
class="show metadata-options-dropdown"
aria-role="list"
trap-focus>
<button
:aria-label="$i18n.get('label_filter_by_metadata_type')"
class="button is-white"
slot="trigger">
<span>{{ $i18n.get('label_filter_by_metadata_type') }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown"/>
</span>
</button>
<template #trigger>
<button
:aria-label="$i18n.get('label_filter_by_metadata_type')"
class="button is-white">
<span>{{ $i18n.get('label_filter_by_metadata_type') }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown"/>
</span>
</button>
</template>
<div class="metadata-options-container">
<b-dropdown-item
v-for="(metadataType, index) in metadataTypeFilterOptions"
@ -44,7 +45,7 @@
custom
aria-role="listitem">
<b-checkbox
v-model:value="metadataType.enabled"
v-model="metadataType.enabled"
:native-value="metadataType.enabled">
{{ metadataType.name }}
</b-checkbox>
@ -55,7 +56,7 @@
<b-field class="header-item">
<b-input
:placeholder="$i18n.get('instruction_type_search_metadata_filter')"
v-model:value="metadataNameFilterString"
v-model="metadataNameFilterString"
icon="magnify"
size="is-small"
icon-right="close-circle"
@ -79,419 +80,436 @@
</section>
<!-- The Metadata Sections list -->
<draggable
v-model:value="activeMetadataSectionsList"
<sortable
:list="activeMetadataSectionsList"
item-key="id"
class="active-metadata-sections-area"
@change="handleSectionChange($event)"
:group="{ name:'metadata-sections', pull: false, put: [ 'metadata-sections' ] }"
:sort="(openedMetadataSectionId == '' || openedMetadataSectionId == undefined) && (openedMetadatumId == '' || openedMetadatumId == undefined)"
:handle="'.handle'"
ghost-class="sortable-ghost"
chosen-class="sortable-chosen"
filter=".not-sortable-item"
:prevent-on-filter="false"
:animation="250">
<div
v-for="(metadataSection, sectionIndex) in activeMetadataSectionsList"
:key="metadataSection.id">
<div
class="active-metadata-sections-item"
:class="{
'is-compact-item': !isCollapseOpen(metadataSection.id),
'not-sortable-item':
metadataSection.id == undefined ||
openedMetadatumId != '' ||
openedMetadataSectionId != '' ||
isUpdatingMetadataOrder ||
isUpdatingMetadatum ||
isUpdatingMetadataSectionsOrder ||
metadataNameFilterString != '' ||
hasSomeMetadataTypeFilterApplied,
'not-focusable-item': openedMetadataSectionId == metadataSection.id,
'disabled-metadatum': metadataSection.enabled == false,
'inherited-metadatum': false
}">
@update="handleSectionChange($event)"
@add="handleSectionChange($event)"
@remove="handleSectionChange($event)"
:options="{
group: {
name:'metadata-sections',
pull: false,
put: [ 'metadata-sections' ]
},
sort: (openedMetadataSectionId == '' || openedMetadataSectionId == undefined) && (openedMetadatumId == '' || openedMetadatumId == undefined),
handle: '.handle',
ghostClass: 'sortable-ghost',
chosenClass: 'sortable-chosen',
filter: '.not-sortable-item',
preventOnFilter: false,
animation: 250
}">
<template #item="{ element: metadataSection, index: sectionIndex }">
<div :key="metadataSection.id">
<div
:ref="'metadata-section-handler-' + metadataSection.id"
class="handle">
<span class="sorting-buttons">
<button
:disabled="sectionIndex == 0"
class="link-button"
@click="moveMetadataSectionUpViaButon(sectionIndex)">
<span class="icon">
<i class="tainacan-icon tainacan-icon-previous tainacan-icon-rotate-90" />
</span>
</button>
<button
:disabled="sectionIndex == activeMetadataSectionsList.length - 1"
class="link-button"
@click="moveMetadataSectionDownViaButton(sectionIndex)">
<span class="icon">
<i class="tainacan-icon tainacan-icon-next tainacan-icon-rotate-90" />
</span>
</button>
</span>
<span
:style="{ opacity: !(metadataSection.id == undefined || openedMetadatumId != '' || isUpdatingMetadataOrder || openedMetadataSectionId != '' || isUpdatingMetadataSectionsOrder || metadataNameFilterString != '' || hasSomeMetadataTypeFilterApplied) ? '1.0' : '0.0' }"
v-tooltip="{
content: metadataSection.id == undefined || openedMetadatumId != '' || isUpdatingMetadataOrder || openedMetadataSectionId != '' || isUpdatingMetadataSectionsOrder || isUpdatingMetadatum ? $i18n.get('info_not_allowed_change_order_metadata_sections') : $i18n.get('instruction_drag_and_drop_metadata_sections_sort'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip'],
placement: 'auto-start'
}"
class="icon grip-icon">
<svg
xmlns="http://www.w3.org/2000/svg"
height="24px"
viewBox="0 0 24 24"
width="24px"
fill="currentColor">
<path
d="M0 0h24v24H0V0z"
fill="transparent"/>
<path d="M11 18c0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2 2 .9 2 2zm-2-8c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm6 4c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/>
</svg>
</span>
<span class="metadatum-name">
<h3>{{ metadataSection.name }}</h3>
</span>
<span
v-if="metadataSection.id != undefined"
class="label-details"
:class="{ 'has-text-weight-bold': metadataSection.id === 'default_section' }">
class="active-metadata-sections-item"
:class="{
'is-compact-item': !isCollapseOpen(metadataSection.id),
'not-sortable-item':
metadataSection.id == undefined ||
openedMetadatumId != '' ||
openedMetadataSectionId != '' ||
isUpdatingMetadataOrder ||
isUpdatingMetadatum ||
isUpdatingMetadataSectionsOrder ||
metadataNameFilterString != '' ||
hasSomeMetadataTypeFilterApplied,
'not-focusable-item': openedMetadataSectionId == metadataSection.id,
'disabled-metadatum': metadataSection.enabled == false,
'inherited-metadatum': false
}">
<div
:ref="'metadata-section-handler-' + metadataSection.id"
class="handle">
<span class="sorting-buttons">
<button
:disabled="sectionIndex == 0"
class="link-button"
@click="moveMetadataSectionUpViaButon(sectionIndex)">
<span class="icon">
<i class="tainacan-icon tainacan-icon-previous tainacan-icon-rotate-90" />
</span>
</button>
<button
:disabled="sectionIndex == activeMetadataSectionsList.length - 1"
class="link-button"
@click="moveMetadataSectionDownViaButton(sectionIndex)">
<span class="icon">
<i class="tainacan-icon tainacan-icon-next tainacan-icon-rotate-90" />
</span>
</button>
</span>
<span
v-if="metadataSection.id === 'default_section'"
:style="{ opacity: !(metadataSection.id == undefined || openedMetadatumId != '' || isUpdatingMetadataOrder || openedMetadataSectionId != '' || isUpdatingMetadataSectionsOrder || metadataNameFilterString != '' || hasSomeMetadataTypeFilterApplied) ? '1.0' : '0.0' }"
v-tooltip="{
content: $i18n.get('label_required'),
content: metadataSection.id == undefined || openedMetadatumId != '' || isUpdatingMetadataOrder || openedMetadataSectionId != '' || isUpdatingMetadataSectionsOrder || isUpdatingMetadatum ? $i18n.get('info_not_allowed_change_order_metadata_sections') : $i18n.get('instruction_drag_and_drop_metadata_sections_sort'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip'],
placement: 'auto-start'
}">
*&nbsp;({{ $i18n.get('label_default_section') }})
}"
class="icon grip-icon">
<svg
xmlns="http://www.w3.org/2000/svg"
height="24px"
viewBox="0 0 24 24"
width="24px"
fill="currentColor">
<path
d="M0 0h24v24H0V0z"
fill="transparent"/>
<path d="M11 18c0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2 2 .9 2 2zm-2-8c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm6 4c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/>
</svg>
</span>
<span
v-if="metadataSection.status === 'private'"
class="icon"
v-tooltip="{
content: $i18n.get('status_private'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip'],
placement: 'auto-start'
}">
<i class="tainacan-icon tainacan-icon-private"/>
<span class="metadatum-name">
<h3>{{ metadataSection.name }}</h3>
</span>
</span>
<span
class="loading-spinner"
v-if="metadataSection.id == undefined"/>
<span
class="controls"
v-if="metadataSection.id !== undefined">
<b-switch
:disabled="isUpdatingMetadataSectionsOrder"
size="is-small"
:value="metadataSection.enabled"
@input="onChangeEnableSection($event, sectionIndex)"/>
<a
v-if="metadataSection.current_user_can_edit"
:style="{ visibility:
metadataSection.collection_id != collectionId
? 'hidden' : 'visible'
}"
@click.prevent="toggleMetadataSectionEdition(metadataSection)">
<span
v-if="metadataSection.id != undefined"
class="label-details"
:class="{ 'has-text-weight-bold': metadataSection.id === 'default_section' }">
<span
v-if="metadataSection.id === 'default_section'"
v-tooltip="{
content: $i18n.get('edit'),
content: $i18n.get('label_required'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip'],
placement: 'auto-start'
}"
class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-edit"/>
}">
*&nbsp;({{ $i18n.get('label_default_section') }})
</span>
</a>
<a
v-if="metadataSection.current_user_can_delete"
:disabled="metadataSection.metadata_object_list.length"
:style="{ visibility: metadataSection.collection_id != collectionId || metadataSection.id === 'default_section' || metadataSection.metadata_object_list.length ? 'hidden' : 'visible' }"
@click.prevent="removeMetadataSection(metadataSection)">
<span
<span
v-if="metadataSection.status === 'private'"
class="icon"
v-tooltip="{
content: $i18n.get('delete'),
content: $i18n.get('status_private'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip'],
placement: 'auto-start'
}"
class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-delete"/>
}">
<i class="tainacan-icon tainacan-icon-private"/>
</span>
</a>
</span>
</div>
</div>
<section
v-if="metadataSection.metadata_object_list && metadataSection.metadata_object_list.length <= 0"
class="field is-grouped-centered section">
<div class="content has-text-gray has-text-centered">
<p>
<span class="icon is-large">
<i class="tainacan-icon tainacan-icon-36px tainacan-icon-metadata"/>
</span>
</p>
<p>{{ $i18n.get('info_there_is_no_metadatum' ) }}</p>
<p>{{ $i18n.get('info_create_metadata' ) }}</p>
<span
class="loading-spinner"
v-if="metadataSection.id == undefined"/>
<span
class="controls"
v-if="metadataSection.id !== undefined">
<b-switch
:disabled="isUpdatingMetadataSectionsOrder"
size="is-small"
:model-value="metadataSection.enabled"
@update:model-value="onChangeEnableSection($event, sectionIndex)"/>
<a
v-if="metadataSection.current_user_can_edit"
:style="{ visibility:
metadataSection.collection_id != collectionId
? 'hidden' : 'visible'
}"
@click.prevent="toggleMetadataSectionEdition(metadataSection)">
<span
v-tooltip="{
content: $i18n.get('edit'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip'],
placement: 'auto-start'
}"
class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-edit"/>
</span>
</a>
<a
v-if="metadataSection.current_user_can_delete"
:disabled="metadataSection.metadata_object_list.length"
:style="{ visibility: metadataSection.collection_id != collectionId || metadataSection.id === 'default_section' || metadataSection.metadata_object_list.length ? 'hidden' : 'visible' }"
@click.prevent="removeMetadataSection(metadataSection)">
<span
v-tooltip="{
content: $i18n.get('delete'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip'],
placement: 'auto-start'
}"
class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-delete"/>
</span>
</a>
</span>
</div>
</div>
</section>
<b-loading v-model:active="isUpdatingMetadatum"/>
<section
v-if="metadataSection.metadata_object_list && metadataSection.metadata_object_list.length <= 0"
class="field is-grouped-centered section">
<div class="content has-text-gray has-text-centered">
<p>
<span class="icon is-large">
<i class="tainacan-icon tainacan-icon-36px tainacan-icon-metadata"/>
</span>
</p>
<p>{{ $i18n.get('info_there_is_no_metadatum' ) }}</p>
<p>{{ $i18n.get('info_create_metadata' ) }}</p>
</div>
</section>
<!-- The Metadata list, inside each metadata section -->
<template v-if="metadataSection.metadata_object_list && Array.isArray(metadataSection.metadata_object_list)">
<draggable
v-model:value="metadataSection.metadata_object_list"
class="active-metadata-area"
@change="handleChange($event, sectionIndex)"
:group="{ name:'metadata', pull: [ 'metadata' ], put: [ 'metadata' ] }"
:sort="(openedMetadatumId == '' || openedMetadatumId == undefined)"
:handle="'.handle'"
ghost-class="sortable-ghost"
chosen-class="sortable-chosen"
filter=".not-sortable-item"
:prevent-on-filter="false"
:animation="250">
<div
v-for="(metadatum, index) in metadataSection.metadata_object_list.filter((meta) => meta != undefined && meta.parent == 0)"
:key="metadatum.id"
v-show="(metadataNameFilterString == '' || filterByMetadatumName(metadatum)) && filterByMetadatumType(metadatum)">
<div
class="active-metadatum-item"
:class="{
'is-compact-item': !isCollapseOpen(metadatum.id),
'not-sortable-item': metadatum.id == undefined || openedMetadatumId != '' || isUpdatingMetadataOrder || metadataNameFilterString != '' || hasSomeMetadataTypeFilterApplied || isUpdatingMetadatum,
'not-focusable-item': openedMetadatumId == metadatum.id,
'disabled-metadatum': metadataSection.enabled == false || metadatum.enabled == false,
'inherited-metadatum': metadatum.inherited,
'child-metadatum': metadatum.parent > 0
}">
<b-loading v-model="isUpdatingMetadatum"/>
<!-- The Metadata list, inside each metadata section -->
<template v-if="metadataSection.metadata_object_list && Array.isArray(metadataSection.metadata_object_list)">
<sortable
:list="metadataSection.metadata_object_list"
item-key="id"
class="active-metadata-area"
@update="handleChange($event, sectionIndex)"
@add="handleChange($event, sectionIndex)"
@remove="handleChange($event, sectionIndex)"
:options="{
group: {
name:'metadata',
pull: [ 'metadata' ],
put: [ 'metadata' ]
},
sort: (openedMetadatumId == '' || openedMetadatumId == undefined) && (openedMetadataSectionId == '' || openedMetadataSectionId == undefined),
handle: '.handle',
ghostClass: 'sortable-ghost',
chosenClass: 'sortable-chosen',
filter: '.not-sortable-item',
preventOnFilter: false,
animation: 250
}">
<template #item="{ element: metadatum, index }">
<div
:ref="'metadatum-handler-' + metadatum.id"
class="handle">
<span class="sorting-buttons">
<button
:disabled="index == 0"
class="link-button"
@click="moveMetadatumUpViaButton(index, sectionIndex)"
:aria-label="$i18n.get('label_move_up')">
<span class="icon">
<i class="tainacan-icon tainacan-icon-previous tainacan-icon-rotate-90" />
</span>
</button>
<button
:disabled="index == metadataSection.metadata_object_list.filter((meta) => meta != undefined && meta.parent == 0).length - 1"
class="link-button"
@click="moveMetadatumDownViaButton(index, sectionIndex)"
:aria-label="$i18n.get('label_move_down')">
<span class="icon">
<i class="tainacan-icon tainacan-icon-next tainacan-icon-rotate-90" />
</span>
</button>
</span>
<span
:style="{ opacity: !(metadatum.id == undefined || openedMetadatumId != '' || isUpdatingMetadataOrder || metadataNameFilterString != '' || hasSomeMetadataTypeFilterApplied) ? '1.0' : '0.0' }"
v-tooltip="{
content: metadatum.id == undefined || openedMetadatumId != '' || isUpdatingMetadataOrder || isUpdatingMetadatum ? $i18n.get('info_not_allowed_change_order_metadata') : $i18n.get('instruction_drag_and_drop_metadatum_sort'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip'],
placement: 'auto-start'
}"
class="icon grip-icon">
<svg
xmlns="http://www.w3.org/2000/svg"
height="24px"
viewBox="0 0 24 24"
width="24px"
fill="currentColor">
<path
d="M0 0h24v24H0V0z"
fill="transparent"/>
<path d="M11 18c0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2 2 .9 2 2zm-2-8c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm6 4c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/>
</svg>
</span>
<span
v-tooltip="{
content: $i18n.get('label_view_metadata_details'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip'],
placement: 'auto-start'
}"
@click="Object.assign(collapses, { [metadatum.id]: !isCollapseOpen(metadatum.id) })"
class="gray-icon icon"
:style="{ cursor: 'pointer', opacity: openedMetadatumId != metadatum.id ? '1.0' : '0.0' }">
<i :class="'tainacan-icon tainacan-icon-1-25em tainacan-icon-' + (isCollapseOpen(metadatum.id) ? 'arrowdown' : 'arrowright')" />
</span>
v-if="metadatum != undefined && metadatum.parent == 0"
v-show="(metadataNameFilterString == '' || filterByMetadatumName(metadatum)) && filterByMetadatumType(metadatum)"
class="active-metadatum-item"
:class="{
'is-compact-item': !isCollapseOpen(metadatum.id),
'not-sortable-item': metadatum.id == undefined || openedMetadatumId != '' || isUpdatingMetadataOrder || metadataNameFilterString != '' || hasSomeMetadataTypeFilterApplied || isUpdatingMetadatum,
'not-focusable-item': openedMetadatumId == metadatum.id,
'disabled-metadatum': metadataSection.enabled == false || metadatum.enabled == false,
'inherited-metadatum': metadatum.inherited,
'child-metadatum': metadatum.parent > 0
}">
<div
:ref="'metadatum-handler-' + metadatum.id"
class="handle">
<span class="sorting-buttons">
<button
:disabled="index == 0"
class="link-button"
@click="moveMetadatumUpViaButton(index, sectionIndex)"
:aria-label="$i18n.get('label_move_up')">
<span class="icon">
<i class="tainacan-icon tainacan-icon-previous tainacan-icon-rotate-90" />
</span>
</button>
<button
:disabled="index == metadataSection.metadata_object_list.filter((meta) => meta != undefined && meta.parent == 0).length - 1"
class="link-button"
@click="moveMetadatumDownViaButton(index, sectionIndex)"
:aria-label="$i18n.get('label_move_down')">
<span class="icon">
<i class="tainacan-icon tainacan-icon-next tainacan-icon-rotate-90" />
</span>
</button>
</span>
<span
:style="{ opacity: !(metadatum.id == undefined || openedMetadatumId != '' || isUpdatingMetadataOrder || metadataNameFilterString != '' || hasSomeMetadataTypeFilterApplied) ? '1.0' : '0.0' }"
v-tooltip="{
content: metadatum.id == undefined || openedMetadatumId != '' || isUpdatingMetadataOrder || isUpdatingMetadatum ? $i18n.get('info_not_allowed_change_order_metadata') : $i18n.get('instruction_drag_and_drop_metadatum_sort'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip'],
placement: 'auto-start'
}"
class="icon grip-icon">
<svg
xmlns="http://www.w3.org/2000/svg"
height="24px"
viewBox="0 0 24 24"
width="24px"
fill="currentColor">
<path
d="M0 0h24v24H0V0z"
fill="transparent"/>
<path d="M11 18c0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2 2 .9 2 2zm-2-8c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm6 4c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/>
</svg>
</span>
<span
v-tooltip="{
content: $i18n.get('label_view_metadata_details'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip'],
placement: 'auto-start'
}"
@click="Object.assign(collapses, { [metadatum.id]: !isCollapseOpen(metadatum.id) })"
class="gray-icon icon"
:style="{ cursor: 'pointer', opacity: openedMetadatumId != metadatum.id ? '1.0' : '0.0' }">
<i :class="'tainacan-icon tainacan-icon-1-25em tainacan-icon-' + (isCollapseOpen(metadatum.id) ? 'arrowdown' : 'arrowright')" />
</span>
<span class="metadatum-name">
{{ metadatum.name }}
</span>
<span
v-if="metadatum.id != undefined && metadatum.metadata_type_object"
class="label-details"
:class="{ 'has-text-weight-bold': metadatum.metadata_type_object.core }">
<span
v-if="metadatum.required === 'yes'"
v-tooltip="{
content: $i18n.get('label_required'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip'],
placement: 'auto-start'
}">
*&nbsp;
<span class="metadatum-name">
{{ metadatum.name }}
</span>
({{ metadatum.metadata_type_object.name }})
<span
v-if="metadatum.status === 'private'"
class="icon"
v-tooltip="{
content: $i18n.get('status_private'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip'],
placement: 'auto-start'
}">
<i class="tainacan-icon tainacan-icon-private"/>
</span>
<span
v-tooltip="{
content: (metadatum.collection_id == 'default') ? $i18n.get('label_repository_metadatum') : $i18n.get('label_collection_metadatum'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip'],
placement: 'auto-start'
}"
class="icon icon-level-identifier">
<i
v-if="metadatum.collection_id == 'default'"
:class="{
'has-text-blue5': metadatum.enabled,
'has-text-gray3': !metadatum.enabled
}"
class="tainacan-icon tainacan-icon-repository" />
<i
v-else
:class="{
'has-text-turquoise5': metadatum.enabled,
'has-text-gray3': !metadatum.enabled
}"
class="tainacan-icon tainacan-icon-collection" />
</span>
</span>
<span
class="loading-spinner"
v-if="metadatum.id == undefined || isUpdatingMetadatum"/>
<span
class="controls"
v-if="metadatum.id !== undefined">
<b-switch
:style="{ visibility: !metadataSection.enabled ? 'hidden' : 'visible' }"
:disabled="isUpdatingMetadataOrder || !metadataSection.enabled"
size="is-small"
:value="metadatum.enabled"
@input="onChangeEnable($event, index, sectionIndex)"/>
<a
v-if="metadatum.current_user_can_edit"
:style="{ visibility:
metadatum.collection_id != collectionId
? 'hidden' : 'visible'
}"
@click.prevent="toggleMetadatumEdition(metadatum)">
<span
v-if="metadatum.id != undefined && metadatum.metadata_type_object"
class="label-details"
:class="{ 'has-text-weight-bold': metadatum.metadata_type_object.core }">
<span
v-if="metadatum.required === 'yes'"
v-tooltip="{
content: $i18n.get('label_required'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip'],
placement: 'auto-start'
}">
*&nbsp;
</span>
({{ metadatum.metadata_type_object.name }})
<span
v-if="metadatum.status === 'private'"
class="icon"
v-tooltip="{
content: $i18n.get('status_private'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip'],
placement: 'auto-start'
}">
<i class="tainacan-icon tainacan-icon-private"/>
</span>
<span
v-tooltip="{
content: $i18n.get('edit'),
content: (metadatum.collection_id == 'default') ? $i18n.get('label_repository_metadatum') : $i18n.get('label_collection_metadatum'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip'],
placement: 'auto-start'
}"
class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-edit"/>
</span>
</a>
<a
v-if="metadatum.current_user_can_delete"
:style="{ visibility: metadatum.collection_id != collectionId || metadatum.metadata_type_object.core ? 'hidden' : 'visible' }"
@click.prevent="removeMetadatum(metadatum, sectionIndex)">
<span
v-tooltip="{
content: $i18n.get('delete'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip'],
placement: 'auto-start'
class="icon icon-level-identifier">
<i
v-if="metadatum.collection_id == 'default'"
:class="{
'has-text-blue5': metadatum.enabled,
'has-text-gray3': !metadatum.enabled
}"
class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-delete"/>
class="tainacan-icon tainacan-icon-repository" />
<i
v-else
:class="{
'has-text-turquoise5': metadatum.enabled,
'has-text-gray3': !metadatum.enabled
}"
class="tainacan-icon tainacan-icon-collection" />
</span>
</a>
</span>
</span>
<span
class="loading-spinner"
v-if="metadatum.id == undefined || isUpdatingMetadatum"/>
<span
class="controls"
v-if="metadatum.id !== undefined">
<b-switch
:style="{ visibility: !metadataSection.enabled ? 'hidden' : 'visible' }"
:disabled="isUpdatingMetadataOrder || !metadataSection.enabled"
size="is-small"
:model-value="metadatum.enabled"
@update:model-value="onChangeEnable($event, index, sectionIndex)"/>
<a
v-if="metadatum.current_user_can_edit"
:style="{ visibility:
metadatum.collection_id != collectionId
? 'hidden' : 'visible'
}"
@click.prevent="toggleMetadatumEdition(metadatum)">
<span
v-tooltip="{
content: $i18n.get('edit'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip'],
placement: 'auto-start'
}"
class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-edit"/>
</span>
</a>
<a
v-if="metadatum.current_user_can_delete"
:style="{ visibility: metadatum.collection_id != collectionId || metadatum.metadata_type_object.core ? 'hidden' : 'visible' }"
@click.prevent="removeMetadatum(metadatum, sectionIndex)">
<span
v-tooltip="{
content: $i18n.get('delete'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip'],
placement: 'auto-start'
}"
class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-delete"/>
</span>
</a>
</span>
</div>
<transition name="form-collapse">
<metadatum-details
v-if="isCollapseOpen(metadatum.id) && openedMetadatumId !== metadatum.id"
:metadatum="metadatum" />
</transition>
</div>
<transition name="form-collapse">
<metadatum-details
v-if="isCollapseOpen(metadatum.id) && openedMetadatumId !== metadatum.id"
:metadatum="metadatum" />
</transition>
</div>
<!-- Child metadata list, inside each compound metadata -->
<child-metadata-list
v-if="metadatum.metadata_type_object && metadatum.metadata_type_object.component == 'tainacan-compound'"
:parent="metadatum"
:metadata-name-filter-string="metadataNameFilterString"
:metadata-type-filter-options="metadataTypeFilterOptions"
:has-some-metadata-type-filter-applied="hasSomeMetadataTypeFilterApplied"
:is-parent-multiple="metadatum.multiple == 'yes'"
:is-repository-level="false"
:collapse-all="collapseAll"
:section-id="metadataSection.id" />
<!-- Metadata edition form, for each metadata -->
<b-modal
@close="onEditionCanceled()"
:active="openedMetadatumId == metadatum.id"
trap-focus
aria-modal
aria-role="dialog"
custom-class="tainacan-modal"
:close-button-aria-label="$i18n.get('close')">
<metadatum-edition-form
:collection-id="collectionId"
:original-metadatum="metadatum"
<!-- Child metadata list, inside each compound metadata -->
<child-metadata-list
v-if="metadatum.metadata_type_object && metadatum.metadata_type_object.component == 'tainacan-compound'"
:parent="metadatum"
:metadata-name-filter-string="metadataNameFilterString"
:metadata-type-filter-options="metadataTypeFilterOptions"
:has-some-metadata-type-filter-applied="hasSomeMetadataTypeFilterApplied"
:is-parent-multiple="metadatum.multiple == 'yes'"
:is-repository-level="false"
@onEditionFinished="onEditionFinished()"
@onEditionCanceled="onEditionCanceled()"
:index="index" />
</b-modal>
:collapse-all="collapseAll"
:section-id="metadataSection.id" />
<!-- Metadata edition form, for each metadata -->
<b-modal
@close="onEditionCanceled()"
:model-value="openedMetadatumId == metadatum.id"
trap-focus
aria-modal
aria-role="dialog"
custom-class="tainacan-modal"
:close-button-aria-label="$i18n.get('close')">
<metadatum-edition-form
:collection-id="collectionId"
:original-metadatum="metadatum"
:is-repository-level="false"
@onEditionFinished="onEditionFinished()"
@onEditionCanceled="onEditionCanceled()"
:index="index" />
</b-modal>
</div>
</draggable><!-- End of .active-metadata-area -->
</template>
<!-- Metadata Section edition form, for each metadata section -->
<b-modal
@close="onSectionEditionCanceled()"
:active="openedMetadataSectionId == metadataSection.id"
trap-focus
aria-modal
aria-role="dialog"
custom-class="tainacan-modal"
:close-button-aria-label="$i18n.get('close')">
<metadata-section-edition-form
:collection-id="collectionId"
:original-metadata-section="metadataSection"
@onEditionFinished="onSectionEditionFinished()"
@onEditionCanceled="onSectionEditionCanceled()"
:index="sectionIndex" />
</b-modal>
</template>
</sortable><!-- End of .active-metadata-area -->
</template>
<!-- Metadata Section edition form, for each metadata section -->
<b-modal
@close="onSectionEditionCanceled()"
:model-value="openedMetadataSectionId == metadataSection.id"
trap-focus
aria-modal
aria-role="dialog"
custom-class="tainacan-modal"
:close-button-aria-label="$i18n.get('close')">
<metadata-section-edition-form
:collection-id="collectionId"
:original-metadata-section="metadataSection"
@onEditionFinished="onSectionEditionFinished()"
@onEditionCanceled="onSectionEditionCanceled()"
:index="sectionIndex" />
</b-modal>
</div>
</draggable> <!-- End of .active-metadata-sections-area -->
</div>
</template>
</sortable> <!-- End of .active-metadata-sections-area -->
</div> <!-- End of .columns -->
</template>
@ -503,13 +521,16 @@ import ChildMetadataList from '../../components/metadata-types/compound/child-me
import CustomDialog from '../../components/other/custom-dialog.vue';
import { mapGetters, mapActions } from 'vuex';
import { Sortable } from "sortablejs-vue3";
export default {
name: 'CollectionMetadataList',
components: {
MetadatumEditionForm,
MetadataSectionEditionForm,
ChildMetadataList,
MetadatumDetails
MetadatumDetails,
Sortable
},
props: {
metadataTypeFilterOptions: Array
@ -582,8 +603,8 @@ export default {
mounted() {
this.cleanMetadataSections();
this.$eventBusMetadataList.$emitter.on('addMetadatumViaButton', this.addMetadatumViaButton);
this.$eventBusMetadataList.$emitter.on('addMetadataSectionViaButton', this.addMetadataSectionViaButton);
this.$eventBusMetadataList.on('addMetadatumViaButton', this.addMetadatumViaButton);
this.$eventBusMetadataList.on('addMetadataSectionViaButton', this.addMetadataSectionViaButton);
this.collectionId = this.$route.params.collectionId;
this.isLoadingMetadataSections = true;
@ -601,8 +622,8 @@ export default {
if (this.metadataSearchCancel != undefined)
this.metadataSearchCancel.cancel('Metadata search Canceled.');
this.$eventBusMetadataList.$emitter.off('addMetadatumViaButton', this.addMetadatumViaButton);
this.$eventBusMetadataList.$emitter.off('addMetadataSectionViaButton', this.addMetadataSectionViaButton);
this.$eventBusMetadataList.off('addMetadatumViaButton', this.addMetadatumViaButton);
this.$eventBusMetadataList.off('addMetadataSectionViaButton', this.addMetadataSectionViaButton);
},
methods: {
...mapActions('metadata', [
@ -624,33 +645,60 @@ export default {
...mapGetters('metadata',[
'getMetadataSections'
]),
handleSectionChange(event) {
if (event.added)
this.addNewMetadataSection(event.added.newIndex);
else if (event.removed)
this.removeMetadataSection(event.removed.element);
else if (event.moved)
this.updateMetadataSectionsOrder();
},
handleChange(event, sectionIndex) {
if (event.added) {
if (!event.added.element.id)
this.addNewMetadatum(event.added.element, event.added.newIndex, sectionIndex);
else {
this.updateMetadatum({
collectionId: this.collectionId,
metadatumId: event.added.element.id,
isRepositoryLevel: event.added.element.collection_id === 'default',
index: event.added.newIndex,
options: {},
includeOptionsAsHtml: true,
sectionId: this.activeMetadataSectionsList[sectionIndex].id
});
this.updateMetadataSectionsOrder(sectionIndex);
handleSectionChange($event) {
switch ( $event.type ) {
case 'add':
this.addNewMetadataSection($event.newIndex);
break;
case 'remove':
this.removeMetadataSection(this.activeFiltersList[$event.oldIndex]);
break;
case 'update': {
const newMetadataSectionsList = JSON.parse(JSON.stringify(this.activeMetadataSectionsList));
const element = newMetadataSectionsList.splice($event.oldIndex, 1)[0];
newMetadataSectionsList.splice($event.newIndex, 0, element);
this.updateMetadataSections(newMetadataSectionsList);
this.updateMetadataSectionsOrder();
break;
}
}
else if (event.moved)
this.updateMetadataOrder(sectionIndex);
},
handleChange($event, sectionIndex) {
switch ( $event.type ) {
case 'add':
if ( !this.activeMetadataSectionsList[sectionIndex].metadata_object_list[$event.oldIndex]['id'] )
this.addNewMetadatum(this.activeMetadataSectionsList[sectionIndex].metadata_object_list[$event.oldIndex], $event.newIndex, sectionIndex);
else {
this.updateMetadatum({
collectionId: this.collectionId,
metadatumId: this.activeMetadataSectionsList[sectionIndex].metadata_object_list[$event.oldIndex].id,
isRepositoryLevel: this.activeMetadataSectionsList[sectionIndex].metadata_object_list[$event.oldIndex].collection_id === 'default',
index: $event.newIndex,
options: {},
includeOptionsAsHtml: true,
sectionId: this.activeMetadataSectionsList[sectionIndex].id
});
const newSectionMetadataObjectList = JSON.parse(JSON.stringify(this.activeMetadataSectionsList[sectionIndex].metadata_object_list));
const element = newSectionMetadataObjectList.splice($event.oldIndex, 1)[0];
newSectionMetadataObjectList.splice($event.newIndex, 0, element);
const newMetadataSectionsList = JSON.parse(JSON.stringify(this.activeMetadataSectionsList));
newMetadataSectionsList[sectionIndex].metadata_object_list = newSectionMetadataObjectList;
this.updateMetadataSections(newMetadataSectionsList);
this.updateMetadataSectionsOrder(sectionIndex);
}
break;
case 'update':
this.updateMetadataOrder(sectionIndex);
break;
}
},
updateMetadataOrder(sectionIndex) {
let metadataOrder = [];

View File

@ -9,7 +9,7 @@
<span>
<b-checkbox
@click="selectAllCollectionsOnPage()"
:value="allCollectionsOnPageSelected">{{ $i18n.get('label_select_all_collections_page') }}</b-checkbox>
:model-value="allCollectionsOnPageSelected">{{ $i18n.get('label_select_all_collections_page') }}</b-checkbox>
</span>
</div>
<div class="field is-pulled-right">
@ -19,15 +19,14 @@
id="bulk-actions-dropdown"
aria-role="list"
trap-focus>
<button
class="button is-white"
slot="trigger">
<span>{{ $i18n.get('label_bulk_actions') }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown"/>
</span>
</button>
<template #trigger>
<button class="button is-white">
<span>{{ $i18n.get('label_bulk_actions') }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown"/>
</span>
</button>
</template>
<b-dropdown-item
id="item-delete-selected-items"
@click="deleteSelectedCollections()"
@ -143,7 +142,7 @@
v-if="$userCaps.hasCapability('tnc_rep_delete_collections')"
:class="{ 'is-selecting': isSelectingCollections }"
class="checkbox-cell">
<b-checkbox v-model:value="selectedCollections[index]"/>
<b-checkbox v-model="selectedCollections[index]"/>
</td>
<!-- Status icon -->
<td

View File

@ -11,7 +11,7 @@
<span>
<b-checkbox
@click.prevent="selectAllItemsOnPage()"
:value="allItemsOnPageSelected">
:model-value="allItemsOnPageSelected">
{{ $i18n.get('label_select_all_items_page') }}
</b-checkbox>
</span>
@ -20,7 +20,7 @@
style="margin-left: 10px"
v-if="totalPages > 1 && allItemsOnPageSelected && Array.isArray(items) && items.length > 1">
<b-checkbox
v-model:value="isAllItemsSelected">
v-model="isAllItemsSelected">
{{ $i18n.getWithVariables('label_select_all_%s_items', [totalItems]) }}
</b-checkbox>
</span>
@ -61,15 +61,14 @@
id="bulk-actions-dropdown"
aria-role="list"
trap-focus>
<button
class="button is-white"
slot="trigger">
<span>{{ $i18n.get('label_actions_for_the_selection') }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown"/>
</span>
</button>
<template #trigger>
<button class="button is-white">
<span>{{ $i18n.get('label_actions_for_the_selection') }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown"/>
</span>
</button>
</template>
<b-dropdown-item
v-if="!isAllItemsSelected && selectedItems.length"
@click="filterBySelectedItems()"
@ -183,15 +182,15 @@
class="grid-item-checkbox">
<b-checkbox
v-if="!$adminOptions.itemsSingleSelectionMode"
:value="getSelectedItemChecked(item.id)"
@input="setSelectedItemChecked(item.id)">
:model-value="getSelectedItemChecked(item.id)"
@update:model-value="setSelectedItemChecked(item.id)">
<span class="sr-only">{{ $i18n.get('label_select_item') }}</span>
</b-checkbox>
<b-radio
v-else
name="item-single-selection"
:native-value="item.id"
v-model:value="singleItemSelection"
v-model="singleItemSelection"
:aria-label="$i18n.get('label_select_item')">
<span class="sr-only">{{ $i18n.get('label_select_item') }}</span>
</b-radio>
@ -475,15 +474,15 @@
class="card-checkbox">
<b-checkbox
v-if="!$adminOptions.itemsSingleSelectionMode"
:value="getSelectedItemChecked(item.id)"
@input="setSelectedItemChecked(item.id)">
:model-value="getSelectedItemChecked(item.id)"
@update:model-value="setSelectedItemChecked(item.id)">
<span class="sr-only">{{ $i18n.get('label_select_item') }}</span>
</b-checkbox>
<b-radio
v-else
name="item-single-selection"
:native-value="item.id"
v-model:value="singleItemSelection">
v-model="singleItemSelection">
<span class="sr-only">{{ $i18n.get('label_select_item') }}</span>
</b-radio>
</div>
@ -926,15 +925,15 @@
class="checkbox-cell">
<b-checkbox
v-if="!$adminOptions.itemsSingleSelectionMode"
:value="getSelectedItemChecked(item.id)"
@input="setSelectedItemChecked(item.id)">
:model-value="getSelectedItemChecked(item.id)"
@update:model-value="setSelectedItemChecked(item.id)">
<span class="sr-only">{{ $i18n.get('label_select_item') }}</span>
</b-checkbox>
<b-radio
v-else
name="item-single-selection"
:native-value="item.id"
v-model:value="singleItemSelection">
v-model="singleItemSelection">
<span class="sr-only">{{ $i18n.get('label_select_item') }}</span>
</b-radio>
</td>
@ -1588,7 +1587,7 @@
<b-select
:placeholder="$i18n.get('instruction_select_geocoordinate_metadatum')"
id="tainacan-select-geocoordinate-metatum"
v-model:value="selectedGeocoordinateMetadatumId">
v-model="selectedGeocoordinateMetadatumId">
<option
v-for="(geocoordinateMetadatum, geocoordinateMetadatumId) in geocoordinateMetadata"
:key="geocoordinateMetadatum.id"

View File

@ -3,11 +3,11 @@
<b-loading
:can-cancel="false"
:is-full-page="false"
v-model:active="isLoadingMetadatumMappers"/>
v-model="isLoadingMetadatumMappers"/>
<b-loading
:can-cancel="false"
:is-full-page="false"
v-model:active="isLoadingMetadata"/>
v-model="isLoadingMetadata"/>
<b-field>
<p style="line-height: 2em;">{{ $i18n.get('info_metadata_mapper_helper') }}</p>
@ -15,8 +15,8 @@
id="mappers-options-dropdown"
size="is-small"
:placeholder="$i18n.get('instruction_select_a_mapper')"
:value="mapper"
@input="onSelectMetadataMapper($event)">
:model-value="mapper"
@update:model-value="onSelectMetadataMapper($event)">
<option
v-for="metadatumMapper in metadatumMappers"
:key="metadatumMapper.slug"
@ -79,8 +79,8 @@
<b-select
:name="'mappers-metadatum-select-' + mapperMetadatum.slug"
v-model:value="mapperMetadatum.selected"
@input="onSelectMetadatumForMapperMetadata">
v-model="mapperMetadatum.selected"
@update:model-value="onSelectMetadatumForMapperMetadata">
<option
value="">
{{ $i18n.get('instruction_select_a_metadatum') }}
@ -154,7 +154,7 @@
<b-modal
@close="onCancelNewMetadataMapperMetadata"
v-model:active="isMapperMetadataCreating"
v-model="isMapperMetadataCreating"
trap-focus
aria-modal
aria-role="dialog"
@ -172,7 +172,7 @@
</div>
<b-field>
<b-input
v-model:value="newMetadataLabel"
v-model="newMetadataLabel"
required
:placeholder="$i18n.get('label_name')"/>
</b-field>
@ -181,7 +181,7 @@
placeholder="URI"
type="url"
required
v-model:value="newMetadataUri"/>
v-model="newMetadataUri"/>
</b-field>
<div class="field is-grouped form-submit">
<div class="control">

View File

@ -3,127 +3,147 @@
v-if="(isRepositoryLevel && $userCaps.hasCapability('tnc_rep_edit_metadata')) || !isRepositoryLevel"
class="column available-metadata-types-area" >
<b-loading v-model:active="isLoadingMetadataTypes"/>
<b-loading v-model="isLoadingMetadataTypes"/>
<div class="field">
<h3 class="label">{{ $i18n.get('label_available_metadata_types') }}</h3>
<draggable
v-model:value="availableMetadatumList"
:sort="false"
:group="{ name:'metadata', pull: 'clone', put: false, revertClone: true }"
drag-class="sortable-drag">
<div
:id="metadatum.component"
@click.prevent.once="addMetadatumViaButton(metadatum)"
class="available-metadatum-item"
:class="{ 'highlighted-metadatum' : highlightedMetadatum == metadatum.name, 'inherited-metadatum': metadatum.inherited || isRepositoryLevel }"
v-for="(metadatum, index) in availableMetadatumList"
:key="index">
<span
v-tooltip="{
content: $i18n.get('instruction_click_or_drag_metadatum_create'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'auto-start'
}"
class="icon grip-icon">
<!-- <i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-drag"/> -->
<svg
xmlns="http://www.w3.org/2000/svg"
height="24px"
viewBox="0 0 24 24"
width="24px"
fill="currentColor">
<path
d="M0 0h24v24H0V0z"
fill="transparent"/>
<path d="M11 18c0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2 2 .9 2 2zm-2-8c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm6 4c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/>
</svg>
</span>
<span class="metadatum-name">
{{ metadatum.name }}
<span
<sortable
:list="availableMetadatumList"
item-key="id"
:options="{
group: {
name: 'metadata',
pull: 'clone',
put: false,
revertClone: true
},
sort: false,
dragClass: 'sortable-drag'
}">
<template #item="{ element: metadatum }">
<div
:id="metadatum.component"
@click.prevent.once="addMetadatumViaButton(metadatum)"
class="available-metadatum-item"
:class="{ 'highlighted-metadatum' : highlightedMetadatum == metadatum.name, 'inherited-metadatum': metadatum.inherited || isRepositoryLevel }">
<span
v-tooltip="{
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : '', 'metadata-type-preview-tooltip'],
content: getPreviewTemplateContent(metadatum),
html: true,
delay: {
shown: 0,
hide: 100,
},
placement: 'top',
}"
class="icon preview-help-icon has-text-secondary">
<i class="tainacan-icon tainacan-icon-help"/>
content: $i18n.get('instruction_click_or_drag_metadatum_create'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'auto-start'
}"
class="icon grip-icon">
<!-- <i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-drag"/> -->
<svg
xmlns="http://www.w3.org/2000/svg"
height="24px"
viewBox="0 0 24 24"
width="24px"
fill="currentColor">
<path
d="M0 0h24v24H0V0z"
fill="transparent"/>
<path d="M11 18c0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2 2 .9 2 2zm-2-8c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm6 4c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/>
</svg>
</span>
</span>
<span
class="loading-spinner"
v-if="highlightedMetadatum == metadatum.name"/>
</div>
</draggable>
<span class="metadatum-name">
{{ metadatum.name }}
<span
v-tooltip="{
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : '', 'metadata-type-preview-tooltip'],
content: getPreviewTemplateContent(metadatum),
html: true,
delay: {
shown: 0,
hide: 100,
},
placement: 'top',
}"
class="icon preview-help-icon has-text-secondary">
<i class="tainacan-icon tainacan-icon-help"/>
</span>
</span>
<span
class="loading-spinner"
v-if="highlightedMetadatum == metadatum.name"/>
</div>
</template>
</sortable>
<draggable
<sortable
v-if="!isRepositoryLevel"
v-model:value="availableMetadataSectionsList"
:sort="false"
:group="{ name:'metadata-sections', pull: 'clone', put: false, revertClone: true }"
drag-class="sortable-drag">
<div
:id="metadataSection.id"
@click.prevent="addMetadataSectionViaButton()"
class="available-metadata-section-item"
v-for="(metadataSection, index) in availableMetadataSectionsList"
:key="index">
<span
v-tooltip="{
content: $i18n.get('instruction_click_or_drag_metadatum_create'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'auto-start'
}"
class="icon grip-icon">
<!-- <i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-drag"/> -->
<svg
xmlns="http://www.w3.org/2000/svg"
height="24px"
viewBox="0 0 24 24"
width="24px"
fill="currentColor">
<path
d="M0 0h24v24H0V0z"
fill="transparent"/>
<path d="M11 18c0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2 2 .9 2 2zm-2-8c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm6 4c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/>
</svg>
</span>
<span class="metadatum-name">
{{ metadataSection.label }}
<span
:list="availableMetadataSectionsList"
item-key="id"
:options="{
group: {
name: 'metadata-sections',
pull: 'clone',
put: false,
revertClone: true
},
sort: false,
dragClass: 'sortable-drag'
}">
<template #item="{ element: metadataSection }">
<div
:id="metadataSection.id"
@click.prevent="addMetadataSectionViaButton()"
class="available-metadata-section-item">
<span
v-tooltip="{
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : '', 'metadata-type-preview-tooltip'],
content: $i18n.get('info_create_section'),
html: true,
delay: {
shown: 0,
hide: 100,
},
placement: 'top',
}"
class="icon preview-help-icon has-text-secondary">
<i class="tainacan-icon tainacan-icon-help"/>
content: $i18n.get('instruction_click_or_drag_metadatum_create'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'auto-start'
}"
class="icon grip-icon">
<!-- <i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-drag"/> -->
<svg
xmlns="http://www.w3.org/2000/svg"
height="24px"
viewBox="0 0 24 24"
width="24px"
fill="currentColor">
<path
d="M0 0h24v24H0V0z"
fill="transparent"/>
<path d="M11 18c0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2 2 .9 2 2zm-2-8c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm6 4c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/>
</svg>
</span>
</span>
</div>
</draggable>
<span class="metadatum-name">
{{ metadataSection.label }}
<span
v-tooltip="{
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : '', 'metadata-type-preview-tooltip'],
content: $i18n.get('info_create_section'),
html: true,
delay: {
shown: 0,
hide: 100,
},
placement: 'top',
}"
class="icon preview-help-icon has-text-secondary">
<i class="tainacan-icon tainacan-icon-help"/>
</span>
</span>
</div>
</template>
</sortable>
</div>
</div>
</template>
<script>
import { mapGetters, mapActions } from 'vuex';
import { Sortable } from "sortablejs-vue3";
export default {
name: 'MetadataTypesList',
components: {
Sortable
},
props: {
isRepositoryLevel: Boolean,
highlightedMetadatum: String
@ -172,10 +192,10 @@ export default {
'getMetadatumTypes'
]),
addMetadatumViaButton(metadatumType) {
this.$eventBusMetadataList.onAddMetadatumViaButton(metadatumType);
this.$eventBusMetadataList.emit('addMetadatumViaButton', metadatumType);
},
addMetadataSectionViaButton() {
this.$eventBusMetadataList.onAddMetadataSectionViaButton();
this.$eventBusMetadataList.emit('addMetadataSectionViaButton');
},
getPreviewTemplateContent(metadatum) {
return `<div class="metadata-type-preview tainacan-form">
@ -242,6 +262,7 @@ export default {
.grip-icon {
color: var(--tainacan-gray3);
position: relative;
flex-shrink: 0;
}
.icon {
position: relative;

View File

@ -10,7 +10,7 @@
<span>
<b-checkbox
@click="selectAllOnPage()"
:value="allOnPageSelected">{{ $i18n.get('label_select_all_processes_page') }}</b-checkbox>
:model-value="allOnPageSelected">{{ $i18n.get('label_select_all_processes_page') }}</b-checkbox>
</span>
</div>
<div class="field is-pulled-right">
@ -19,15 +19,14 @@
:disabled="!isSelecting"
id="bulk-actions-dropdown"
trap-focus>
<button
class="button is-white"
slot="trigger">
<span>{{ $i18n.get('label_bulk_actions') }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown"/>
</span>
</button>
<template #trigger>
<button class="button is-white">
<span>{{ $i18n.get('label_bulk_actions') }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown"/>
</span>
</button>
</template>
<b-dropdown-item
id="item-delete-selected-items"
@click="deleteSelected()">
@ -64,7 +63,7 @@
:class="{ 'is-selecting': isSelecting }"
class="checkbox-cell">
<b-checkbox
v-model:value="selected[index]"/>
v-model="selected[index]"/>
</span> -->
<!-- Name -->
<span

View File

@ -3,7 +3,7 @@
<div class="table-container">
<b-loading
is-full-page="false"
v-model:active="displayLoading" />
v-model="displayLoading" />
<div class="table-wrapper">
<div class="related-items-list">
<div
@ -137,7 +137,7 @@
</div>
<b-modal
:width="1200"
v-model:active="editItemModal"
v-model="editItemModal"
@after-leave="reloadRelatedItems"
custom-class="tainacan-modal"
:close-button-aria-label="$i18n.get('close')">

View File

@ -1,7 +1,7 @@
<template>
<div class="column">
<b-loading v-model:active="isLoadingMetadata"/>
<b-loading v-model="isLoadingMetadata"/>
<div class="tainacan-form sub-header">
<!-- <h3>{{ $i18n.get('metadata') }}<span class="has-text-gray">{{ ( activeMetadatumList && activeMetadatumList.length ? (' (' + activeMetadatumList.length + ')') : '' ) }}</span></h3> -->
@ -29,15 +29,16 @@
class="show metadata-options-dropdown"
aria-role="list"
trap-focus>
<button
:aria-label="$i18n.get('label_filter_by_metadata_type')"
class="button is-white"
slot="trigger">
<span>{{ $i18n.get('label_filter_by_metadata_type') }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown"/>
</span>
</button>
<template #trigger>
<button
:aria-label="$i18n.get('label_filter_by_metadata_type')"
class="button is-white">
<span>{{ $i18n.get('label_filter_by_metadata_type') }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown"/>
</span>
</button>
</template>
<div class="metadata-options-container">
<b-dropdown-item
v-for="(metadataType, index) in metadataTypeFilterOptions"
@ -46,7 +47,7 @@
custom
aria-role="listitem">
<b-checkbox
v-model:value="metadataType.enabled"
v-model="metadataType.enabled"
:native-value="metadataType.enabled">
{{ metadataType.name }}
</b-checkbox>
@ -57,7 +58,7 @@
<b-field class="header-item">
<b-input
:placeholder="$i18n.get('instruction_type_search_metadata_filter')"
v-model:value="metadataNameFilterString"
v-model="metadataNameFilterString"
icon="magnify"
size="is-small"
icon-right="close-circle"
@ -83,211 +84,217 @@
<!-- The Repository Metadata list -->
<div class="active-metadata-sections-area">
<draggable
v-model:value="activeMetadatumList"
<sortable
:list="activeMetadatumList"
item-key="id"
class="active-metadata-area"
@change="handleChange($event)"
:group="{ name:'metadata', pull: false, put: true }"
:sort="false"
:handle="'.handle'"
ghost-class="sortable-ghost"
chosen-class="sortable-chosen"
filter=".not-sortable-item"
:prevent-on-filter="false"
:animation="250">
<div
v-for="(metadatum, index) in activeMetadatumList.filter((meta) => meta != undefined && meta.parent == 0)"
:key="metadatum.id"
v-show="(metadataNameFilterString == '' || filterByMetadatumName(metadatum)) && filterByMetadatumType(metadatum)">
<div
class="active-metadatum-item"
:class="{
'is-compact-item': !isCollapseOpen(metadatum.id),
'not-sortable-item': true,
'not-focusable-item': openedMetadatumId == metadatum.id,
'disabled-metadatum': metadatum.enabled == false,
'inherited-metadatum': true,
'child-metadatum': metadatum.parent > 0
}">
@add="handleChange($event)"
@remove="handleChange($event)"
:options="{
group: { name:'metadata', pull: false, put: true },
handle: '.handle',
ghostClass: 'sortable-ghost',
chosenClass: 'sortable-chosen',
filter: '.not-sortable-item',
preventOnFilter: false,
animation: 250
}">
<template #item="{ element: metadatum, index }">
<div
v-if="metadatum != undefined && metadatum.parent == 0"
v-show="(metadataNameFilterString == '' || filterByMetadatumName(metadatum)) && filterByMetadatumType(metadatum)">
<div
:ref="'metadatum-handler-' + metadatum.id"
class="handle">
<span
:style="{ opacity: '0.0' }"
v-tooltip="{
content: $i18n.get('info_not_allowed_change_order_metadata'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', 'tainacan-repository-tooltip'],
placement: 'auto-start'
}"
class="icon grip-icon">
<svg
xmlns="http://www.w3.org/2000/svg"
height="24px"
viewBox="0 0 24 24"
width="24px"
fill="currentColor">
<path
d="M0 0h24v24H0V0z"
fill="transparent"/>
<path d="M11 18c0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2 2 .9 2 2zm-2-8c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm6 4c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/>
</svg>
</span>
<span
v-tooltip="{
content: $i18n.get('label_view_metadata_details'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', 'tainacan-repository-tooltip'],
placement: 'auto-start'
}"
@click="Object.assign( collapses, { [metadatum.id]: !isCollapseOpen(metadatum.id) })"
class="gray-icon icon"
:style="{ cursor: 'pointer', opacity: openedMetadatumId != metadatum.id ? '1.0' : '0.0' }">
<i :class="'tainacan-icon tainacan-icon-1-25em tainacan-icon-' + (isCollapseOpen(metadatum.id) ? 'arrowdown' : 'arrowright')" />
</span>
class="active-metadatum-item"
:class="{
'is-compact-item': !isCollapseOpen(metadatum.id),
'not-sortable-item': true,
'not-focusable-item': openedMetadatumId == metadatum.id,
'disabled-metadatum': metadatum.enabled == false,
'inherited-metadatum': true,
'child-metadatum': metadatum.parent > 0
}">
<div
:ref="'metadatum-handler-' + metadatum.id"
class="handle">
<span
:style="{ opacity: '0.0' }"
v-tooltip="{
content: $i18n.get('info_not_allowed_change_order_metadata'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', 'tainacan-repository-tooltip'],
placement: 'auto-start'
}"
class="icon grip-icon">
<svg
xmlns="http://www.w3.org/2000/svg"
height="24px"
viewBox="0 0 24 24"
width="24px"
fill="currentColor">
<path
d="M0 0h24v24H0V0z"
fill="transparent"/>
<path d="M11 18c0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2 2 .9 2 2zm-2-8c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm6 4c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/>
</svg>
</span>
<span
v-tooltip="{
content: $i18n.get('label_view_metadata_details'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', 'tainacan-repository-tooltip'],
placement: 'auto-start'
}"
@click="Object.assign( collapses, { [metadatum.id]: !isCollapseOpen(metadatum.id) })"
class="gray-icon icon"
:style="{ cursor: 'pointer', opacity: openedMetadatumId != metadatum.id ? '1.0' : '0.0' }">
<i :class="'tainacan-icon tainacan-icon-1-25em tainacan-icon-' + (isCollapseOpen(metadatum.id) ? 'arrowdown' : 'arrowright')" />
</span>
<span class="metadatum-name">
{{ metadatum.name }}
</span>
<span
v-if="metadatum.id != undefined && metadatum.metadata_type_object"
class="label-details"
:class="{ 'has-text-weight-bold': metadatum.metadata_type_object.core }">
<span
v-if="metadatum.required === 'yes'"
v-tooltip="{
content: $i18n.get('label_required'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', 'tainacan-repository-tooltip'],
placement: 'auto-start'
}">
*&nbsp;
<span class="metadatum-name">
{{ metadatum.name }}
</span>
({{ metadatum.metadata_type_object.name }})
<span
v-if="metadatum.status === 'private'"
class="icon"
v-tooltip="{
content: $i18n.get('status_private'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', 'tainacan-repository-tooltip'],
placement: 'auto-start'
}">
<i class="tainacan-icon tainacan-icon-private"/>
</span>
<span
v-tooltip="{
content: $i18n.get('label_repository_metadatum'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', 'tainacan-repository-tooltip'],
placement: 'auto-start'
}"
class="icon icon-level-identifier">
<i
:class="{
'has-text-blue5': metadatum.enabled,
'has-text-gray3': !metadatum.enabled
}"
class="tainacan-icon tainacan-icon-repository" />
</span>
</span>
<span
class="loading-spinner"
v-if="metadatum.id == undefined"/>
<span
class="controls"
v-if="metadatum.id !== undefined">
<a
v-if="metadatum.current_user_can_edit"
:style="{ visibility:
metadatum.collection_id != collectionId
? 'hidden' : 'visible'
}"
@click.prevent="toggleMetadatumEdition(metadatum)">
<span
v-if="metadatum.id != undefined && metadatum.metadata_type_object"
class="label-details"
:class="{ 'has-text-weight-bold': metadatum.metadata_type_object.core }">
<span
v-if="metadatum.required === 'yes'"
v-tooltip="{
content: $i18n.get('label_required'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', 'tainacan-repository-tooltip'],
placement: 'auto-start'
}">
*&nbsp;
</span>
({{ metadatum.metadata_type_object.name }})
<span
v-if="metadatum.status === 'private'"
class="icon"
v-tooltip="{
content: $i18n.get('status_private'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', 'tainacan-repository-tooltip'],
placement: 'auto-start'
}">
<i class="tainacan-icon tainacan-icon-private"/>
</span>
<span
v-tooltip="{
content: $i18n.get('edit'),
content: $i18n.get('label_repository_metadatum'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', 'tainacan-repository-tooltip'],
placement: 'auto-start'
}"
class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-edit"/>
</span>
</a>
<a
v-if="metadatum.current_user_can_delete"
:style="{ visibility: metadatum.collection_id != collectionId || metadatum.metadata_type_object.core ? 'hidden' : 'visible' }"
@click.prevent="removeMetadatum(metadatum)">
<span
v-tooltip="{
content: $i18n.get('delete'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', 'tainacan-repository-tooltip'],
placement: 'auto-start'
class="icon icon-level-identifier">
<i
:class="{
'has-text-blue5': metadatum.enabled,
'has-text-gray3': !metadatum.enabled
}"
class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-delete"/>
class="tainacan-icon tainacan-icon-repository" />
</span>
</a>
</span>
</span>
<span
class="loading-spinner"
v-if="metadatum.id == undefined"/>
<span
class="controls"
v-if="metadatum.id !== undefined">
<a
v-if="metadatum.current_user_can_edit"
:style="{ visibility:
metadatum.collection_id != collectionId
? 'hidden' : 'visible'
}"
@click.prevent="toggleMetadatumEdition(metadatum)">
<span
v-tooltip="{
content: $i18n.get('edit'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', 'tainacan-repository-tooltip'],
placement: 'auto-start'
}"
class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-edit"/>
</span>
</a>
<a
v-if="metadatum.current_user_can_delete"
:style="{ visibility: metadatum.collection_id != collectionId || metadatum.metadata_type_object.core ? 'hidden' : 'visible' }"
@click.prevent="removeMetadatum(metadatum)">
<span
v-tooltip="{
content: $i18n.get('delete'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', 'tainacan-repository-tooltip'],
placement: 'auto-start'
}"
class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-delete"/>
</span>
</a>
</span>
</div>
<transition name="form-collapse">
<metadatum-details
v-if="isCollapseOpen(metadatum.id) && openedMetadatumId !== metadatum.id"
:metadatum="metadatum" />
</transition>
</div>
<transition name="form-collapse">
<metadatum-details
v-if="isCollapseOpen(metadatum.id) && openedMetadatumId !== metadatum.id"
:metadatum="metadatum" />
</transition>
</div>
<!-- Child metadata list, inside each compound metadata -->
<child-metadata-list
v-if="metadatum.metadata_type_object && metadatum.metadata_type_object.component == 'tainacan-compound'"
:parent="metadatum"
:metadata-name-filter-string="metadataNameFilterString"
:metadata-type-filter-options="metadataTypeFilterOptions"
:has-some-metadata-type-filter-applied="hasSomeMetadataTypeFilterApplied"
:is-parent-multiple="metadatum.multiple == 'yes'"
:is-repository-level="true"
:collapse-all="collapseAll" />
<!-- Metadata edition form, for each metadata -->
<b-modal
@close="onEditionCanceled()"
:active="openedMetadatumId == metadatum.id"
trap-focus
aria-modal
aria-role="dialog"
custom-class="tainacan-modal"
:close-button-aria-label="$i18n.get('close')">
<metadatum-edition-form
:collection-id="collectionId"
:original-metadatum="metadatum"
<!-- Child metadata list, inside each compound metadata -->
<child-metadata-list
v-if="metadatum.metadata_type_object && metadatum.metadata_type_object.component == 'tainacan-compound'"
:parent="metadatum"
:metadata-name-filter-string="metadataNameFilterString"
:metadata-type-filter-options="metadataTypeFilterOptions"
:has-some-metadata-type-filter-applied="hasSomeMetadataTypeFilterApplied"
:is-parent-multiple="metadatum.multiple == 'yes'"
:is-repository-level="true"
@onEditionFinished="onEditionFinished()"
@onEditionCanceled="onEditionCanceled()"
:index="index" />
</b-modal>
:collapse-all="collapseAll" />
<!-- Metadata edition form, for each metadata -->
<b-modal
@close="onEditionCanceled()"
:model-value="openedMetadatumId == metadatum.id"
trap-focus
aria-modal
aria-role="dialog"
custom-class="tainacan-modal"
:close-button-aria-label="$i18n.get('close')">
<metadatum-edition-form
:collection-id="collectionId"
:original-metadatum="metadatum"
:is-repository-level="true"
@onEditionFinished="onEditionFinished()"
@onEditionCanceled="onEditionCanceled()"
:index="index" />
</b-modal>
</div>
</draggable><!-- End of .active-metadata-area -->
</div>
</template>
</sortable><!-- End of .active-metadata-area -->
</div>
</div> <!-- End of .columns -->
</template>
<script>
import MetadatumEditionForm from '../edition/metadatum-edition-form.vue';
import MetadatumDetails from '../other/metadatum-details.vue';
import ChildMetadataList from '../metadata-types/compound/child-metadata-list.vue';
import CustomDialog from '../other/custom-dialog.vue';
import { mapGetters, mapActions } from 'vuex';
import { Sortable } from 'sortablejs-vue3';
export default {
name: 'RepositoryMetadataList',
components: {
MetadatumEditionForm,
ChildMetadataList,
MetadatumDetails
MetadatumDetails,
Sortable
},
props: {
metadataTypeFilterOptions: Array
@ -339,7 +346,7 @@ export default {
mounted() {
this.cleanMetadata();
this.loadMetadata();
this.$eventBusMetadataList.$emitter.on('addMetadatumViaButton', this.addMetadatumViaButton);
this.$eventBusMetadataList.on('addMetadatumViaButton', this.addMetadatumViaButton);
},
beforeUnmount() {
// Cancels previous Request
@ -357,11 +364,15 @@ export default {
...mapGetters('metadata',[
'getMetadata'
]),
handleChange(event) {
if (event.added)
this.addNewMetadatum(event.added.element, event.added.newIndex);
else if (event.removed)
this.removeMetadatum(event.removed.element);
handleChange($event) {
switch ($event.type) {
case 'add':
this.addNewMetadatum(this.activeMetadatumList[$event.oldIndex], $event.newIndex);
break;
case 'remove':
this.removeMetadatum(this.activeMetadatumList[$event.oldIndex]);
break;
}
},
addMetadatumViaButton(metadatumType) {
let lastIndex = this.activeMetadatumList.length;

View File

@ -10,7 +10,7 @@
<span>
<b-checkbox
@click="selectAllOnPage()"
:value="allOnPageSelected">{{ $i18n.get('label_select_all_taxonomies_page') }}</b-checkbox>
:model-value="allOnPageSelected">{{ $i18n.get('label_select_all_taxonomies_page') }}</b-checkbox>
</span>
</div>
<div class="field is-pulled-right">
@ -20,15 +20,14 @@
id="bulk-actions-dropdown"
aria-role="list"
trap-focus>
<button
class="button is-white"
slot="trigger">
<span>{{ $i18n.get('label_bulk_actions') }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown"/>
</span>
</button>
<template #trigger>
<button class="button is-white">
<span>{{ $i18n.get('label_bulk_actions') }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown"/>
</span>
</button>
</template>
<b-dropdown-item
id="item-delete-selected-items"
@click="deleteSelected()"
@ -92,7 +91,7 @@
:class="{ 'is-selecting': isSelecting }"
class="checkbox-cell">
<b-checkbox
v-model:value="selected[index]"/>
v-model="selected[index]"/>
</td>
<!-- Status icon -->
<td

View File

@ -3,7 +3,7 @@
<b-loading
:is-full-page="false"
v-model:active="isColumnLoading"/>
v-model="isColumnLoading"/>
<transition name="appear-from-top">
<button
@ -243,7 +243,7 @@
</section>
<b-modal
v-model:value="isEditingTerm"
v-model="isEditingTerm"
:width="768"
trap-focus
aria-role="dialog"

View File

@ -10,7 +10,7 @@
autocomplete="on"
:placeholder="$i18n.get('instruction_search')"
:aria-name="$i18n.get('instruction_search')"
v-model:value="searchString"
v-model="searchString"
icon-right="magnify"
type="search" />
</b-field>
@ -37,15 +37,16 @@
aria-role="list"
trap-focus
position="is-bottom-left">
<button
type="button"
class="button is-white"
slot="trigger">
<span>{{ selected.length == 1 ? $i18n.get('label_one_selected_term') : $i18n.getWithVariables('label_%s_selected_terms', [ selected.length ]) }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown"/>
</span>
</button>
<template #trigger>
<button
type="button"
class="button is-white">
<span>{{ selected.length == 1 ? $i18n.get('label_one_selected_term') : $i18n.getWithVariables('label_%s_selected_terms', [ selected.length ]) }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown"/>
</span>
</button>
</template>
<b-dropdown-item
custom
v-for="term of selected"
@ -78,15 +79,16 @@
id="bulk-actions-dropdown"
aria-role="list"
trap-focus>
<button
type="button"
class="button is-white"
slot="trigger">
<span>{{ $i18n.get('label_actions_for_the_selection') }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown"/>
</span>
</button>
<template #trigger>
<button
type="button"
class="button is-white">
<span>{{ $i18n.get('label_actions_for_the_selection') }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown"/>
</span>
</button>
</template>
<b-dropdown-item
@click="$emit('deleteSelectedTerms')"
id="item-delete-selected-terms"

View File

@ -15,215 +15,222 @@
<p>{{ $i18n.get('info_create_child_metadata') }}</p>
</div>
</section>
<draggable
v-model:value="childrenMetadata"
<sortable
:list="childrenMetadata"
:style="{ minHeight: childrenMetadata.length > 0 ? '40px' : '70px' }"
class="active-metadata-area child-metadata-area"
item-key="id"
@change="handleChange"
:group="{ name:'metadata', pull: false, put: isAvailableChildMetadata }"
:sort="(openedMetadatumId == '' || openedMetadatumId == undefined)"
:handle="'.handle'"
ghost-class="sortable-ghost"
chosen-class="sortable-chosen"
filter=".not-sortable-item"
:prevent-on-filter="false"
:animation="250">
<div
class="active-metadatum-item"
:class="{
'not-sortable-item': metadatum.id == undefined || openedMetadatumId != '' || isUpdatingMetadataOrder || metadatum.parent == 0 || metadatum.collection_id != collectionId || metadataNameFilterString != '' || hasSomeMetadataTypeFilterApplied,
'not-focusable-item': openedMetadatumId == metadatum.id,
'disabled-metadatum': parent.enabled == false,
'inherited-metadatum': (metadatum.collection_id != collectionId && metadatum.parent == 0) || isRepositoryLevel
}"
v-for="(metadatum, index) in childrenMetadata"
:key="metadatum.id"
v-show="(metadataNameFilterString == '' || filterByMetadatumName(metadatum)) && filterByMetadatumType(metadatum)">
:options="{
group: {
name: 'metadata',
pull: false,
put: isAvailableChildMetadata
},
sort: (openedMetadatumId == '' || openedMetadatumId == undefined),
handle: '.handle',
ghostClass: 'sortable-ghost',
chosenClass: 'sortable-chosen',
filter: '.not-sortable-item',
preventOnFilter: false,
animation: 250
}">
<template #item="{ element: metadatum, index }">
<div
:ref="'metadatum-handler-' + metadatum.id"
class="handle">
<span class="sorting-buttons">
<button
:disabled="index == 0"
class="link-button"
@click="moveMetadatumUpViaButton(index)"
:aria-label="$i18n.get('label_move_up')">
<span class="icon">
<i class="tainacan-icon tainacan-icon-previous tainacan-icon-rotate-90" />
</span>
</button>
<button
:disabled="index == childrenMetadata.length - 1"
class="link-button"
@click="moveMetadatumDownViaButton(index)"
:aria-label="$i18n.get('label_move_down')">
<span class="icon">
<i class="tainacan-icon tainacan-icon-next tainacan-icon-rotate-90" />
</span>
</button>
</span>
<span
:style="{ opacity: !(metadatum.id == undefined || openedMetadatumId != '' || isUpdatingMetadataOrder || metadatum.parent == 0 || metadatum.collection_id != collectionId || metadataNameFilterString != '' || hasSomeMetadataTypeFilterApplied) ? '1.0' : '0.0' }"
v-tooltip="{
content: metadatum.id == undefined || openedMetadatumId != '' || isUpdatingMetadataOrder ? $i18n.get('info_not_allowed_change_order_metadata') : $i18n.get('instruction_drag_and_drop_metadatum_sort'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'auto-start'
}"
class="icon grip-icon">
<!-- <i class="tainacan-icon tainacan-icon-18px tainacan-icon-drag"/> -->
<svg
xmlns="http://www.w3.org/2000/svg"
height="24px"
viewBox="0 0 24 24"
width="24px"
fill="currentColor">
<path
d="M0 0h24v24H0V0z"
fill="transparent"/>
<path d="M11 18c0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2 2 .9 2 2zm-2-8c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm6 4c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/>
</svg>
</span>
<span
v-tooltip="{
content: $i18n.get('label_view_metadata_details'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'auto-start'
}"
@click="Object.assign( collapses, { [metadatum.id]: !isCollapseOpen(metadatum.id) })"
class="gray-icon icon"
:style="{ cursor: 'pointer', opacity: openedMetadatumId != metadatum.id ? '1.0' : '0.0' }">
<i :class="'tainacan-icon tainacan-icon-1-25em tainacan-icon-' + (isCollapseOpen(metadatum.id) ? 'arrowdown' : 'arrowright')" />
</span>
<span class="metadatum-name">
{{ metadatum.name }}
</span>
<span
v-if="metadatum.id != undefined && metadatum.metadata_type_object"
class="label-details">
<span
v-if="metadatum.required === 'yes'"
v-tooltip="{
content: $i18n.get('label_required'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'auto-start'
}">
*&nbsp;
</span>
({{ metadatum.metadata_type_object.name }})
<!-- <em v-if="metadatum.collection_id != collectionId">{{ $i18n.get('label_inherited') }}</em> -->
<em
v-if="metadatum.metadata_type_object.core &&
metadatum.metadata_type_object.related_mapped_prop == 'title'">
{{ $i18n.get('label_core_title') }}
</em>
<em
v-if="metadatum.metadata_type_object.core &&
metadatum.metadata_type_object.related_mapped_prop == 'description'">
{{ $i18n.get('label_core_description') }}
</em>
<span
v-if="metadatum.status == 'private'"
class="icon"
v-tooltip="{
content: $i18n.get('status_private'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'auto-start'
}">
<i class="tainacan-icon tainacan-icon-private"/>
class="active-metadatum-item"
:class="{
'not-sortable-item': metadatum.id == undefined || openedMetadatumId != '' || isUpdatingMetadataOrder || metadatum.parent == 0 || metadatum.collection_id != collectionId || metadataNameFilterString != '' || hasSomeMetadataTypeFilterApplied,
'not-focusable-item': openedMetadatumId == metadatum.id,
'disabled-metadatum': parent.enabled == false,
'inherited-metadatum': (metadatum.collection_id != collectionId && metadatum.parent == 0) || isRepositoryLevel
}"
v-show="(metadataNameFilterString == '' || filterByMetadatumName(metadatum)) && filterByMetadatumType(metadatum)">
<div
:ref="'metadatum-handler-' + metadatum.id"
class="handle">
<span class="sorting-buttons">
<button
:disabled="index == 0"
class="link-button"
@click="moveMetadatumUpViaButton(index)"
:aria-label="$i18n.get('label_move_up')">
<span class="icon">
<i class="tainacan-icon tainacan-icon-previous tainacan-icon-rotate-90" />
</span>
</button>
<button
:disabled="index == childrenMetadata.length - 1"
class="link-button"
@click="moveMetadatumDownViaButton(index)"
:aria-label="$i18n.get('label_move_down')">
<span class="icon">
<i class="tainacan-icon tainacan-icon-next tainacan-icon-rotate-90" />
</span>
</button>
</span>
<span
:style="{ opacity: !(metadatum.id == undefined || openedMetadatumId != '' || isUpdatingMetadataOrder || metadatum.parent == 0 || metadatum.collection_id != collectionId || metadataNameFilterString != '' || hasSomeMetadataTypeFilterApplied) ? '1.0' : '0.0' }"
v-tooltip="{
content: (metadatum.collection_id == 'default') || isRepositoryLevel ? $i18n.get('label_repository_metadatum') : $i18n.get('label_collection_metadatum'),
content: metadatum.id == undefined || openedMetadatumId != '' || isUpdatingMetadataOrder ? $i18n.get('info_not_allowed_change_order_metadata') : $i18n.get('instruction_drag_and_drop_metadatum_sort'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'auto-start'
}"
class="icon icon-level-identifier">
<i
:class="{
'tainacan-icon-collection': (metadatum.collection_id != 'default' && !isRepositoryLevel),
'tainacan-icon-repository': (metadatum.collection_id == 'default') || isRepositoryLevel,
'has-text-turquoise5': (metadatum.collection_id != 'default' && !isRepositoryLevel),
'has-text-blue5': (metadatum.collection_id == 'default' || isRepositoryLevel),
'has-text-gray3': !parent.enabled
}"
class="tainacan-icon" />
class="icon grip-icon">
<!-- <i class="tainacan-icon tainacan-icon-18px tainacan-icon-drag"/> -->
<svg
xmlns="http://www.w3.org/2000/svg"
height="24px"
viewBox="0 0 24 24"
width="24px"
fill="currentColor">
<path
d="M0 0h24v24H0V0z"
fill="transparent"/>
<path d="M11 18c0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2 2 .9 2 2zm-2-8c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm6 4c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/>
</svg>
</span>
</span>
<span
class="loading-spinner"
v-if="metadatum.id == undefined"/>
<span
class="controls"
v-if="metadatum.id !== undefined">
<a
v-if="metadatum.current_user_can_edit"
:style="{ visibility:
metadatum.collection_id != collectionId
? 'hidden' : 'visible'
}"
@click.prevent="toggleMetadatumEdition(metadatum.id)">
<span
v-tooltip="{
content: $i18n.get('label_view_metadata_details'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'auto-start'
}"
@click="Object.assign( collapses, { [metadatum.id]: !isCollapseOpen(metadatum.id) })"
class="gray-icon icon"
:style="{ cursor: 'pointer', opacity: openedMetadatumId != metadatum.id ? '1.0' : '0.0' }">
<i :class="'tainacan-icon tainacan-icon-1-25em tainacan-icon-' + (isCollapseOpen(metadatum.id) ? 'arrowdown' : 'arrowright')" />
</span>
<span class="metadatum-name">
{{ metadatum.name }}
</span>
<span
v-if="metadatum.id != undefined && metadatum.metadata_type_object"
class="label-details">
<span
v-if="metadatum.required === 'yes'"
v-tooltip="{
content: $i18n.get('label_required'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'auto-start'
}">
*&nbsp;
</span>
({{ metadatum.metadata_type_object.name }})
<!-- <em v-if="metadatum.collection_id != collectionId">{{ $i18n.get('label_inherited') }}</em> -->
<em
v-if="metadatum.metadata_type_object.core &&
metadatum.metadata_type_object.related_mapped_prop == 'title'">
{{ $i18n.get('label_core_title') }}
</em>
<em
v-if="metadatum.metadata_type_object.core &&
metadatum.metadata_type_object.related_mapped_prop == 'description'">
{{ $i18n.get('label_core_description') }}
</em>
<span
v-if="metadatum.status == 'private'"
class="icon"
v-tooltip="{
content: $i18n.get('status_private'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'auto-start'
}">
<i class="tainacan-icon tainacan-icon-private"/>
</span>
<span
v-tooltip="{
content: $i18n.get('edit'),
content: (metadatum.collection_id == 'default') || isRepositoryLevel ? $i18n.get('label_repository_metadatum') : $i18n.get('label_collection_metadatum'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'auto-start'
}"
class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-edit"/>
</span>
</a>
<a
v-if="metadatum.current_user_can_delete"
:style="{ visibility:
metadatum.collection_id != collectionId ||
metadatum.metadata_type_object.related_mapped_prop == 'title' ||
metadatum.metadata_type_object.related_mapped_prop == 'description'
? 'hidden' : 'visible'
}"
@click.prevent="removeMetadatum(metadatum)">
<span
v-tooltip="{
content: $i18n.get('delete'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'auto-start'
class="icon icon-level-identifier">
<i
:class="{
'tainacan-icon-collection': (metadatum.collection_id != 'default' && !isRepositoryLevel),
'tainacan-icon-repository': (metadatum.collection_id == 'default') || isRepositoryLevel,
'has-text-turquoise5': (metadatum.collection_id != 'default' && !isRepositoryLevel),
'has-text-blue5': (metadatum.collection_id == 'default' || isRepositoryLevel),
'has-text-gray3': !parent.enabled
}"
class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-delete"/>
class="tainacan-icon" />
</span>
</a>
</span>
</span>
<span
class="loading-spinner"
v-if="metadatum.id == undefined"/>
<span
class="controls"
v-if="metadatum.id !== undefined">
<a
v-if="metadatum.current_user_can_edit"
:style="{ visibility:
metadatum.collection_id != collectionId
? 'hidden' : 'visible'
}"
@click.prevent="toggleMetadatumEdition(metadatum.id)">
<span
v-tooltip="{
content: $i18n.get('edit'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'auto-start'
}"
class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-edit"/>
</span>
</a>
<a
v-if="metadatum.current_user_can_delete"
:style="{ visibility:
metadatum.collection_id != collectionId ||
metadatum.metadata_type_object.related_mapped_prop == 'title' ||
metadatum.metadata_type_object.related_mapped_prop == 'description'
? 'hidden' : 'visible'
}"
@click.prevent="removeMetadatum(metadatum)">
<span
v-tooltip="{
content: $i18n.get('delete'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'auto-start'
}"
class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-delete"/>
</span>
</a>
</span>
</div>
<transition name="form-collapse">
<metadatum-details
v-if="isCollapseOpen(metadatum.id) && openedMetadatumId !== metadatum.id"
:metadatum="metadatum" />
</transition>
<b-modal
@close="onEditionCanceled()"
:model-value="openedMetadatumId == metadatum.id"
trap-focus
aria-modal
aria-role="dialog"
custom-class="tainacan-modal"
:close-button-aria-label="$i18n.get('close')">
<metadatum-edition-form
:collection-id="collectionId"
:original-metadatum="metadatum"
:is-parent-multiple="isParentMultiple"
:is-repository-level="isRepositoryLevel"
@onEditionFinished="onEditionFinished()"
@onEditionCanceled="onEditionCanceled()"
:index="index" />
</b-modal>
</div>
<transition name="form-collapse">
<metadatum-details
v-if="isCollapseOpen(metadatum.id) && openedMetadatumId !== metadatum.id"
:metadatum="metadatum" />
</transition>
<b-modal
@close="onEditionCanceled()"
:active="openedMetadatumId == metadatum.id"
trap-focus
aria-modal
aria-role="dialog"
custom-class="tainacan-modal"
:close-button-aria-label="$i18n.get('close')">
<metadatum-edition-form
:collection-id="collectionId"
:original-metadatum="metadatum"
:is-parent-multiple="isParentMultiple"
:is-repository-level="isRepositoryLevel"
@onEditionFinished="onEditionFinished()"
@onEditionCanceled="onEditionCanceled()"
:index="index" />
</b-modal>
</div>
</draggable>
</template>
</sortable>
</div>
</template>
@ -233,10 +240,13 @@
import MetadatumDetails from '../../other/metadatum-details.vue';
import CustomDialog from '../../other/custom-dialog.vue';
import { Sortable } from 'sortablejs-vue3';
export default {
components: {
MetadatumEditionForm,
MetadatumDetails
MetadatumDetails,
Sortable
},
props: {
isRepositoryLevel: Boolean,
@ -316,13 +326,27 @@
'deleteMetadatum',
'updateChildMetadataOrder'
]),
handleChange(event) {
if (event.added)
this.addNewMetadatum(event.added.element, event.added.newIndex);
else if (event.removed)
this.removeMetadatum(event.removed.element);
else if (event.moved)
this.updateMetadataOrder();
handleChange($event) {
switch ($event.type) {
case 'add':
this.addNewMetadatum(this.childrenMetadata[$event.oldIndex], $event.newIndex);
break;
case 'remove':
this.removeMetadatum(this.childrenMetadata[$event.oldIndex]);
break;
case 'update': {
const newChildrenMetadata = JSON.parse(JSON.stringify(this.childrenMetadata));
const element = newChildrenMetadata.splice($event.oldIndex, 1)[0];
newChildrenMetadata.splice($event.newIndex, 0, element);
this.childrenMetadata = newChildrenMetadata;
this.updateMetadataOrder();
break;
}
}
},
updateMetadataOrder() {
let metadataOrder = [];

View File

@ -6,8 +6,8 @@
:custom-class="{ 'is-danger': isInvalidDate && dateValue }"
type="text"
v-mask="dateMask"
v-model:value="dateValue"
@input="onInput"
v-model="dateValue"
@update:model-value="onInput"
@blur="onBlur"
@focus="onMobileSpecialFocus"
:placeholder="itemMetadatum.metadatum.placeholder ? itemMetadatum.metadatum.placeholder : dateFormat.toLowerCase()" />
@ -15,22 +15,6 @@
v-if="isInvalidDate && dateValue"
style="font-size: 0.75em;"
class="has-text-danger is-italic">{{ $i18n.get('info_error_invalid_date') }}</p>
<!--<b-collapse-->
<!--position="is-bottom-right">-->
<!--<span class="icon"-->
<!--icon="calendar-today"-->
<!--size="is-small"-->
<!--slot="trigger" />-->
<!--<div class="field">-->
<!--<b-datepicker-->
<!--v-model:value="dateValue"-->
<!--:readonly="false"-->
<!--inline-->
<!--@input="onInput($event)"-->
<!--:placeholder="datePlaceHolder"/>-->
<!--</div>-->
<!--</b-collapse>-->
</div>
</template>

View File

@ -10,8 +10,8 @@
</label>
<b-input
name="mapProvider"
v-model:value="mapProvider"
@input="emitValues()"
v-model="mapProvider"
@update:model-value="emitValues()"
placeholder="https://tile.openstreetmap.org/{z}/{x}/{y}.png" />
</b-field>
@ -26,8 +26,8 @@
</label>
<b-input
name="attribution"
v-model:value="attribution"
@input="emitValues()"
v-model="attribution"
@update:model-value="emitValues()"
placeholder="© OpenStreetMap contributors" />
</b-field>
@ -43,8 +43,8 @@
</label>
<b-numberinput
name="initialZoom"
v-model:value="initialZoom"
@input="emitValues()"
v-model="initialZoom"
@update:model-value="emitValues()"
:step="1"
:max="19"
:min="1" />
@ -61,8 +61,8 @@
</label>
<b-numberinput
name="maximumZoom"
v-model:value="maximumZoom"
@input="emitValues()"
v-model="maximumZoom"
@update:model-value="emitValues()"
:step="1"
:max="19"
:min="1" />

View File

@ -27,16 +27,16 @@
:placeholder="-14.408656999999"
type="text"
:step="0.000000000001"
@input="onUpdateFromLatitudeInput"
:value="latitude" />
@update:model-value="onUpdateFromLatitudeInput"
:model-value="latitude" />
<b-input
v-if="editingMarkerIndex >= 0"
expanded
:placeholder="-51.316689999999"
type="text"
:step="0.000000000001"
@input="onUpdateFromLongitudeInput"
:value="longitude" />
@update:model-value="onUpdateFromLongitudeInput"
:model-value="longitude" />
<b-button
v-if="editingMarkerIndex >= 0"
outlined

View File

@ -12,8 +12,8 @@
class="is-flex">
<b-select
name="step_options"
v-model:value="step"
@input="onUpdateStep">
v-model="step"
@update:model-value="onUpdateStep">
<option value="0.001">0.001</option>
<option value="0.01">0.01</option>
<option value="0.1">0.1</option>
@ -49,8 +49,8 @@
class="is-flex">
<b-input
name="max_options"
v-model:value="step"
@input="onUpdateStep"
v-model="step"
@update:model-value="onUpdateStep"
type="number"
step="1" />
<button

View File

@ -3,8 +3,8 @@
:disabled="disabled"
:id="'tainacan-item-metadatum_id-' + itemMetadatum.metadatum.id + (itemMetadatum.parent_meta_id ? ('_parent_meta_id-' + itemMetadatum.parent_meta_id) : '')"
:placeholder="itemMetadatum.metadatum.placeholder ? itemMetadatum.metadatum.placeholder : ''"
:value="value"
@input="onInput($event);"
:model-value="value"
@update:model-value="onInput($event);"
@blur="onBlur"
@focus="onMobileSpecialFocus"
type="number"

View File

@ -14,7 +14,7 @@
<b-select
name="metadata_type_relationship[collection_id]"
:placeholder="$i18n.get('instruction_select_collection_fetch_items' )"
v-model:value="collection"
v-model="collection"
@change="emitValues()"
@focus="clear()"
:loading="loading"
@ -45,7 +45,7 @@
</label>
<b-select
name="metadata_type_relationship[search]"
v-model:value="modelSearch"
v-model="modelSearch"
expanded>
<option
v-for="(option, index) in metadata.filter(metadatum => metadatum.metadata_type_object.component !== 'tainacan-compound')"
@ -71,8 +71,8 @@
<b-checkbox
native-value="thumbnail"
name="metadata_type_relationship[display_related_item_metadata]"
@input="emitValues()"
v-model:value="displayRelatedItemMetadata">
@update:model-value="emitValues()"
v-model="displayRelatedItemMetadata">
{{ $i18n.get('label_thumbnail') }}
</b-checkbox>
<b-checkbox
@ -80,8 +80,8 @@
:key="index"
:native-value="metadatumOption.id"
name="metadata_type_relationship[display_related_item_metadata]"
@input="emitValues()"
v-model:value="displayRelatedItemMetadata"
@update:model-value="emitValues()"
v-model="displayRelatedItemMetadata"
:disabled="metadatumOption.id == modelSearch">
{{ metadatumOption.name }}
</b-checkbox>
@ -95,8 +95,8 @@
&nbsp;
<b-switch
size="is-small"
v-model:value="modelDisplayInRelatedItems"
@input="emitValues()"
v-model="modelDisplayInRelatedItems"
@update:model-value="emitValues()"
true-value="yes"
false-value="no" />
<help-button
@ -110,8 +110,8 @@
&nbsp;
<b-switch
size="is-small"
v-model:value="modelAcceptDraftItems"
@input="emitValues()"
v-model="modelAcceptDraftItems"
@update:model-value="emitValues()"
true-value="yes"
false-value="no" />
<help-button

View File

@ -3,7 +3,7 @@
<b-tabs
size="is-small"
animated
v-model:value="activeTab">
v-model="activeTab">
<b-tab-item :label="$i18n.get('label_insert_items')">
<b-taginput
expanded
@ -11,8 +11,8 @@
:id="relationshipInputId"
size="is-small"
icon="magnify"
:value="selected"
@input="onInput"
:model-value="selected"
@update:model-value="onInput"
@blur="onBlur"
@add="onAdd"
@remove="onRemove"
@ -127,7 +127,7 @@
</a>
<b-modal
:width="1200"
v-model:active="editItemModalOpen"
v-model="editItemModalOpen"
:custom-class="'tainacan-modal' + (collection && collection.id ? ' tainacan-modal-item-edition--collection-' + collection.id : '')"
:close-button-aria-label="$i18n.get('close')">
<iframe

View File

@ -23,8 +23,8 @@
</label>
<b-taginput
v-model:value="options"
@input="emitValues()"
v-model="options"
@update:model-value="emitValues()"
@focus="clear()"
attached
:confirm-keys="optionsSeparator"
@ -40,8 +40,8 @@
v-for="separator of ['Enter', 'Tab', ',', ';', '|']"
:key="separator"
name="metadata_type_selectbox[options_separator]"
@input="emitValues()"
v-model:value="optionsSeparator"
@update:model-value="emitValues()"
v-model="optionsSeparator"
:native-value="separator"
:disabled="separator == 'Enter'">
<kbd>{{ separator }}</kbd>

View File

@ -11,8 +11,8 @@
:disabled="disabled"
:id="'tainacan-item-metadatum_id-' + itemMetadatum.metadatum.id + (itemMetadatum.parent_meta_id ? ('_parent_meta_id-' + itemMetadatum.parent_meta_id) : '')"
:placeholder="itemMetadatum.metadatum.placeholder ? itemMetadatum.metadatum.placeholder : $i18n.get('label_selectbox_init')"
:value="value"
@input="onSelected($event)">
:model-value="value"
@update:model-value="onSelected($event)">
<option value="">{{ itemMetadatum.metadatum.placeholder ? itemMetadatum.metadatum.placeholder : ($i18n.get('label_selectbox_init') + '...') }}</option>
<option
v-for="(option, index) in getOptions"

View File

@ -15,8 +15,8 @@
<b-select
name="field_type_options[taxonomy_id]"
placeholder="Select the taxonomy"
v-model:value="taxonomy_id"
@input="emitValues()"
v-model="taxonomy_id"
@update:model-value="emitValues()"
@focus="clear"
:loading="loading"
expanded>
@ -41,8 +41,8 @@
v-if="listInputType"
name="metadata_type_options[component_type]"
placeholder="Select the input type for the taxonomy metadatum"
@input="emitValues()"
v-model:value="input_type"
@update:model-value="emitValues()"
v-model="input_type"
expanded>
<option
v-for="(option, index) in single_types"
@ -55,8 +55,8 @@
<b-select
name="metadata_type_options[input_type]"
placeholder="Select the input type for the taxonomy metadatum"
v-model:value="input_type"
@input="emitValues()"
v-model="input_type"
@update:model-value="emitValues()"
v-else
expanded>
<option
@ -75,8 +75,8 @@
&nbsp;
<b-switch
size="is-small"
v-model:value="visible_options_list"
@input="emitValues()" />
v-model="visible_options_list"
@update:model-value="emitValues()" />
<help-button
:title="$i18n.getHelperTitle('tainacan-taxonomy', 'visible_options_list')"
:message="$i18n.getHelperMessage('tainacan-taxonomy', 'visible_options_list')"/>
@ -88,8 +88,8 @@
&nbsp;
<b-switch
size="is-small"
v-model:value="allow_new_terms"
@input="emitValues()"
v-model="allow_new_terms"
@update:model-value="emitValues()"
true-value="yes"
false-value="no" />
<help-button
@ -103,8 +103,8 @@
&nbsp;
<b-switch
size="is-small"
v-model:value="do_not_dispaly_term_as_link"
@input="emitValues()"
v-model="do_not_dispaly_term_as_link"
@update:model-value="emitValues()"
true-value="yes"
false-value="no" />
<help-button
@ -119,12 +119,12 @@
:message="$i18n.getHelperMessage('tainacan-taxonomy', 'link_filtered_by_collections')"/>
</label>
<b-taginput
:value="getSelectedTaxonomyCollections()"
:model-value="getSelectedTaxonomyCollections()"
autocomplete
:open-on-focus="true"
:data="collections.filter((collection) => !link_filtered_by_collections.includes(collection.id) && (collectionSearchString ? (collection.name.toLowerCase().indexOf(collectionSearchString.toLowerCase()) >= 0) : true) )"
field="name"
@input="updateSelectedCollections"
@update:model-value="updateSelectedCollections"
@focus="clear()"
attached
:disabled="do_not_dispaly_term_as_link == 'yes'"
@ -160,8 +160,8 @@
&nbsp;
<b-switch
size="is-small"
v-model:value="hide_hierarchy_path"
@input="emitValues()"
v-model="hide_hierarchy_path"
@update:model-value="emitValues()"
true-value="yes"
false-value="no" />
<help-button

View File

@ -50,7 +50,7 @@
<!-- Term creation modal, used on admin for a complete term creation -->
<b-modal
v-model:value="isTermCreationModalOpen"
v-model="isTermCreationModalOpen"
:width="768"
trap-focus
aria-role="dialog"

View File

@ -8,7 +8,7 @@
:allow-new="false"
@add="emitAdd"
@remove="emitRemove"
v-model:value="selected"
v-model="selected"
:data="labels"
:maxtags="maxtags"
field="label"

View File

@ -6,8 +6,8 @@
&nbsp;
<b-switch
size="is-small"
:value="displaySuggestions"
@input="onUpdateDisplaySuggestions"
:model-value="displaySuggestions"
@update:model-value="onUpdateDisplaySuggestions"
:true-value="'yes'"
:false-value="'no'" />
<help-button

View File

@ -4,20 +4,20 @@
v-if="!getDisplayAutocomplete"
:disabled="disabled"
:id="'tainacan-item-metadatum_id-' + itemMetadatum.metadatum.id + (itemMetadatum.parent_meta_id ? ('_parent_meta_id-' + itemMetadatum.parent_meta_id) : '')"
:value="value"
:model-value="value"
:placeholder="itemMetadatum.metadatum.placeholder ? itemMetadatum.metadatum.placeholder : ''"
@input="onInput($event)"
@update:model-value="onInput($event)"
@blur="onBlur"
@focus="onMobileSpecialFocus" />
<b-autocomplete
v-else
:disabled="disabled"
:id="'tainacan-item-metadatum_id-' + itemMetadatum.metadatum.id + (itemMetadatum.parent_meta_id ? ('_parent_meta_id-' + itemMetadatum.parent_meta_id) : '')"
:value="value"
:model-value="value"
@blur="onBlur"
:data="options"
:loading="isLoadingOptions"
@input="($event) => { search($event); }"
@update:model-value="($event) => { search($event); }"
field="label"
@select="onSelect"
clearable

View File

@ -3,8 +3,8 @@
:disabled="disabled"
:id="'tainacan-item-metadatum_id-' + itemMetadatum.metadatum.id + (itemMetadatum.parent_meta_id ? ('_parent_meta_id-' + itemMetadatum.parent_meta_id) : '')"
:placeholder="itemMetadatum.metadatum.placeholder ? itemMetadatum.metadatum.placeholder : ''"
:value="value"
@input="onInput($event)"
:model-value="value"
@update:model-value="onInput($event)"
@blur="onBlur"
type="textarea"
@focus="onMobileSpecialFocus" />

View File

@ -8,8 +8,8 @@
:message="$i18n.getHelperMessage('tainacan-user', 'default_author')"/>
</label>
<b-checkbox
v-model:value="defaultAuthor"
@input="onUpdateDefaultAuthor"
v-model="defaultAuthor"
@update:model-value="onUpdateDefaultAuthor"
true-value="yes"
false-value="no">
{{ $i18n.get('label_default_author_user') }}

View File

@ -6,8 +6,8 @@
:id="'tainacan-item-metadatum_id-' + itemMetadatum.metadatum.id + (itemMetadatum.parent_meta_id ? ('_parent_meta_id-' + itemMetadatum.parent_meta_id) : '')"
size="is-small"
icon="account"
:value="selected"
@input="onInput"
:model-value="selected"
@update:model-value="onInput"
@blur="onBlur"
:data="options"
:maxtags="maxtags != undefined ? maxtags : (itemMetadatum.metadatum.multiple == 'yes' || allowNew === true ? (maxMultipleValues !== undefined ? maxMultipleValues : null) : '1')"

View File

@ -15,7 +15,7 @@
</header>
<b-loading
:is-full-page="false"
v-model:active="isLoadingActivity"
v-model="isLoadingActivity"
:can-cancel="false"/>
<div
v-if="!isLoadingActivity"

View File

@ -43,7 +43,7 @@
</footer>
<b-loading
v-model:active="isLoading"
v-model="isLoading"
:can-cancel="false"/>
</section>
</div>

View File

@ -32,7 +32,7 @@
<b-loading
:is-full-page="false"
v-model:active="isLoading"
v-model="isLoading"
:can-cancel="false"/>
</div>

View File

@ -30,7 +30,7 @@
:disabled="!!bulkEditionProcedures[criterion].metadatum || metadataIsLoading"
class="tainacan-bulk-edition-field tainacan-bulk-edition-field-not-last"
:placeholder="$i18n.get('instruction_select_a_metadatum')"
@input="addToBulkEditionProcedures($event, 'metadatum', criterion)">
@update:model-value="addToBulkEditionProcedures($event, 'metadatum', criterion)">
<template
v-for="(metadatum, index) in metadata"
:key="index">
@ -66,10 +66,10 @@
<b-select
:class="{'is-field-history': bulkEditionProcedures[criterion].isDone, 'hidden-select-arrow': !!bulkEditionProcedures[criterion].action }"
:disabled="!!bulkEditionProcedures[criterion].action || !bulkEditionProcedures[criterion].metadatum"
:value="bulkEditionProcedures[criterion].action ? bulkEditionProcedures[criterion].action : undefined"
:model-value="bulkEditionProcedures[criterion].action ? bulkEditionProcedures[criterion].action : undefined"
class="tainacan-bulk-edition-field tainacan-bulk-edition-field-not-last"
:placeholder="$i18n.get('instruction_select_a_action')"
@input="addToBulkEditionProcedures($event, 'action', criterion)">
@update:model-value="addToBulkEditionProcedures($event, 'action', criterion)">
<template v-if="bulkEditionProcedures[criterion].metadatum">
<option
v-for="(edtAct, key) in getValidEditionActions(bulkEditionProcedures[criterion].metadatum)"
@ -129,7 +129,7 @@
:disabled="bulkEditionProcedures[criterion].isDone"
class="tainacan-bulk-edition-field tainacan-bulk-edition-field-last"
:placeholder="$i18n.get('instruction_select_a_status2')"
@input="addToBulkEditionProcedures($event, 'newValue', criterion)">
@update:model-value="addToBulkEditionProcedures($event, 'newValue', criterion)">
<option
v-for="(statusOption, index) of $statusHelper.getStatuses().filter(option => { return option.value != 'trash' })"
:key="index"
@ -145,7 +145,7 @@
:disabled="bulkEditionProcedures[criterion].isDone"
class="tainacan-bulk-edition-field tainacan-bulk-edition-field-last"
:placeholder="$i18n.get('instruction_select_a_comments_status')"
@input="addToBulkEditionProcedures($event, 'newValue', criterion)">
@update:model-value="addToBulkEditionProcedures($event, 'newValue', criterion)">
<option
v-for="(statusOption, index) of $commentsStatusHelper.getStatuses()"
:key="index"
@ -162,7 +162,7 @@
:disabled="bulkEditionProcedures[criterion].isDone || bulkEditionProcedures[criterion].isExecuting && !!bulkEditionProcedures[criterion].metadatumIdCopyFrom || metadataIsLoading"
class="tainacan-bulk-edition-field tainacan-bulk-edition-field-last"
:placeholder="$i18n.get('instruction_select_a_metadatum')"
@input="addToBulkEditionProcedures($event, 'metadatumIdCopyFrom', criterion)">
@update:model-value="addToBulkEditionProcedures($event, 'metadatumIdCopyFrom', criterion)">
<template
v-for="(metadatumForCopy, index) in getAllowedMetadataForCopy(criterion)"
:key="index">

View File

@ -21,8 +21,8 @@
:key="roleIndex">
<b-checkbox
v-if="!capability.roles_inherited[role.slug]"
:value="capability.roles[role.slug] || capability.roles_inherited[role.slug] ? true : false"
@input="($event) => updateRole(role.slug, $event)"
:model-value="capability.roles[role.slug] || capability.roles_inherited[role.slug] ? true : false"
@update:model-value="($event) => updateRole(role.slug, $event)"
name="roles">
{{ role.name }}
</b-checkbox>
@ -56,7 +56,7 @@
<b-checkbox
v-if="capability.roles_inherited[role.slug]"
class="has-text-yellow2"
:value="capability.roles[role.slug] || capability.roles_inherited[role.slug] ? true : false"
:model-value="capability.roles[role.slug] || capability.roles_inherited[role.slug] ? true : false"
name="roles_inherited"
disabled>
{{ role.name }}
@ -75,7 +75,7 @@
<div v-else>
<b-loading
is-full-page="false"
v-model:active="isLoading" />
v-model="isLoading" />
</div>
<div class="field is-grouped form-submit">
<div class="control">

View File

@ -90,12 +90,12 @@
<b-loading
:is-full-page="false"
v-model:active="isLoadingMetadatumMappers"
v-model="isLoadingMetadatumMappers"
:can-cancel="false"/>
<b-loading
:is-full-page="false"
v-model:active="isCreatingCollectionPreset"
v-model="isCreatingCollectionPreset"
:can-cancel="false"/>
<footer class="field is-grouped form-submit">

View File

@ -40,7 +40,7 @@
</div>
<b-loading
:is-full-page="false"
v-model:active="isLoading"
v-model="isLoading"
:can-cancel="false"/>
<footer class="field is-grouped form-submit">

View File

@ -121,7 +121,7 @@
placement: 'bottom',
popperClass: ['tainacan-tooltip', 'tooltip']
}"
v-model:value="shouldRespectFetchOnly">{{ $i18n.get('label_expose_only_displayed_metadata') }}</b-checkbox>
v-model="shouldRespectFetchOnly">{{ $i18n.get('label_expose_only_displayed_metadata') }}</b-checkbox>
</div>
<b-field
:addons="false"
@ -228,7 +228,7 @@
<b-loading
:is-full-page="false"
v-model:active="isLoading"
v-model="isLoading"
:can-cancel="false"/>
<footer class="field is-grouped form-submit">

View File

@ -9,7 +9,7 @@
ref="item-document-text-input"
type="textarea"
:autofocus="true"
v-model:value="localTextContent"/>
v-model="localTextContent"/>
<div class="field is-grouped form-submit">
<div class="control">

View File

@ -7,7 +7,7 @@
<b-input
aria-labelledby="item-document-url-modal-title"
ref="item-document-url-input"
v-model:value="localUrlLink" />
v-model="localUrlLink" />
<br>
<b-field
:addons="false"
@ -15,7 +15,7 @@
&nbsp;
<b-switch
size="is-small"
v-model:value="localUrlForcedIframe" />
v-model="localUrlForcedIframe" />
<help-button
:title="$i18n.get('label_document_option_forced_iframe')"
:message="$i18n.get('info_document_option_forced_iframe')" />
@ -29,7 +29,7 @@
:aria-minus-label="$i18n.get('label_decrease')"
:aria-plus-label="$i18n.get('label_increase')"
min="1"
v-model:value="localUrlIframeWidth"
v-model="localUrlIframeWidth"
step="1" />
</b-field>
<b-field :label="$i18n.get('label_document_option_iframe_height')">
@ -37,7 +37,7 @@
:aria-minus-label="$i18n.get('label_decrease')"
:aria-plus-label="$i18n.get('label_increase')"
min="1"
v-model:value="localUrlIframeHeight"
v-model="localUrlIframeHeight"
step="1" />
</b-field>
</b-field>
@ -55,7 +55,7 @@
&nbsp;
<b-switch
size="is-small"
v-model:value="localUrlIsImage" />
v-model="localUrlIsImage" />
<help-button
:title="$i18n.get('label_document_option_is_image')"
:message="$i18n.get('info_document_option_is_image')" />

View File

@ -59,8 +59,8 @@
:placeholder="$i18n.get('instruction_search_in_repository')"
class="search-header"
size="is-small"
:value="searchQuery"
@input="futureSearchQuery = $event.target.value"
:model-value="searchQuery"
@update:model-value="futureSearchQuery = $event.target.value"
@keyup.enter="updateSearch()"
icon-right="magnify"
icon-right-clickable

View File

@ -20,8 +20,8 @@
<b-tabs
size="is-small"
animated
@input="fetchSelectedLabels()"
v-model:value="activeTab"
@update:model-value="fetchSelectedLabels()"
v-model="activeTab"
:class="{ 'hidden-tabs-section': !isModal || !hasToDisplaySearchBar }">
<b-tab-item
:style="{ margin: isModal ? '0' : '0 0 1rem 0' }"
@ -36,8 +36,8 @@
autocomplete="on"
:placeholder="$i18n.get('instruction_search')"
:aria-label="$i18n.get('instruction_search')"
v-model:value="optionName"
@input="autoComplete"
v-model="optionName"
@update:model-value="autoComplete"
icon-right="magnify"
type="search" />
</b-field>
@ -88,7 +88,7 @@
</template>
<b-loading
:is-full-page="false"
v-model:active="isLoadingSearch"/>
v-model="isLoadingSearch"/>
</ul>
<a
v-if="!noMoreSearchPage"
@ -151,7 +151,7 @@
</template>
<b-loading
:is-full-page="false"
v-model:active="isCheckboxListLoading"/>
v-model="isCheckboxListLoading"/>
</ul>
<a
v-if="!noMorePage"
@ -250,7 +250,7 @@
<b-loading
:is-full-page="false"
v-model:active="isColumnLoading"/>
v-model="isColumnLoading"/>
</b-tab-item>
@ -290,7 +290,7 @@
</section>
<b-loading
:is-full-page="false"
v-model:active="isSelectedTermsLoading"/>
v-model="isSelectedTermsLoading"/>
</div>
</b-tab-item>
</b-tabs>
@ -813,7 +813,7 @@
this.$eventBusSearch.resetPageOnStore();
if (this.isTaxonomy) {
this.$eventBusSearch.$emit('input', {
this.$eventBusSearchEmitter.emit('input', {
filter: 'checkbox',
taxonomy: this.taxonomy,
compare: 'IN',
@ -822,7 +822,7 @@
terms: this.selected
});
} else {
this.$eventBusSearch.$emit('input', {
this.$eventBusSearchEmitter.emit('input', {
filter: 'checkbox',
compare: 'IN',
metadatum_id: this.metadatumId ? this.metadatumId : this.filter.metatadum_id,

View File

@ -10,8 +10,8 @@
<b-tabs
size="is-small"
animated
@input="fetchSelectedLabels()"
v-model:value="activeTab"
@update:model-value="fetchSelectedLabels()"
v-model="activeTab"
:class="{ 'hidden-tabs-section': (shouldBeginWithListExpanded && !hasToDisplaySearchBar) }">
<b-tab-item :label="isTaxonomy ? $i18n.get('label_all_terms') : $i18n.get('label_all_metadatum_values')">
@ -39,8 +39,8 @@
autocomplete="on"
:placeholder="metadatum.placeholder ? metadatum.placeholder : ( expandResultsSection ? $i18n.get('instruction_search') : $i18n.get('instruction_click_to_see_or_search') )"
:aria-label="expandResultsSection ? $i18n.get('instruction_search') : $i18n.get('instruction_click_to_see_or_search')"
v-model:value="optionName"
@input="autoComplete"
v-model="optionName"
@update:model-value="autoComplete"
@focus="!shouldBeginWithListExpanded && !expandResultsSection ? toggleResultsSection() : null"
icon-right="magnify"
type="search" />
@ -101,7 +101,7 @@
</template>
<b-loading
:is-full-page="false"
v-model:active="isLoadingSearch"/>
v-model="isLoadingSearch"/>
</ul>
<a
v-if="!noMoreSearchPage"
@ -153,7 +153,7 @@
</li>
<b-loading
:is-full-page="false"
v-model:active="isCheckboxListLoading"/>
v-model="isCheckboxListLoading"/>
</ul>
<a
v-if="!noMorePage"
@ -258,7 +258,7 @@
<b-loading
:is-full-page="false"
v-model:active="isColumnLoading"/>
v-model="isColumnLoading"/>
</b-tab-item>
@ -301,7 +301,7 @@
</section>
<b-loading
:is-full-page="false"
v-model:active="isSelectedTermsLoading"/>
v-model="isSelectedTermsLoading"/>
</div>
</b-tab-item>
</b-tabs>

View File

@ -33,7 +33,7 @@
<span v-html="message" />
<div v-if="showNeverShowAgainOption">
<b-checkbox
@input="changeNeverShowMessageAgain($event)"
@update:model-value="changeNeverShowMessageAgain($event)"
:native-value="neverShowAgain">
{{ $i18n.get('instruction_never_show_message_again') }}
</b-checkbox>

View File

@ -42,9 +42,9 @@
:aria-minus-label="$i18n.get('label_decrease')"
:aria-plus-label="$i18n.get('label_increase')"
min="1"
:value="copyCount"
:model-value="copyCount"
step="1"
@input="copyCount = $event"/>
@update:model-value="copyCount = $event"/>
</b-field>
</div>
</section>

View File

@ -35,7 +35,7 @@
<!-- Status -------------------------------- -->
<div class="status-radios">
<b-radio
v-model:value="selectedStatus"
v-model="selectedStatus"
v-for="(statusOption, index) of availableStatus"
:key="index"
:native-value="statusOption.slug">

View File

@ -100,12 +100,7 @@
<span
v-if="bgProcess.status === 'running'"
class="icon has-text-success loading-icon">
<!--<progress-->
<!--:value="bgProcess.progress_value > 0 ? bgProcess.progress_value : 0"-->
<!--max="100"-->
<!--class="progress is-success is-small is-loading">-->
<!--{{ `(${ bgProcess.progress_value &lt;&equals; 0 ? 0 : bgProcess.progress_value }%)` }}-->
<!--</progress>-->
<div class="control has-icons-right is-loading is-clearfix" />
</span>
</div>

View File

@ -33,12 +33,12 @@
class="type-of-deletion-options">
<b-radio
native-value="selected"
v-model:value="typeOfDelete">
v-model="typeOfDelete">
{{ amountOfTerms > 1 ? $i18n.get('label_remove_selected_terms') : $i18n.get('label_remove_selected_term') }}
</b-radio>
<b-radio
native-value="descendants"
v-model:value="typeOfDelete">
v-model="typeOfDelete">
{{ amountOfTerms > 1 ? $i18n.get('label_remove_terms_and_descendants') : $i18n.get('label_remove_term_and_descendants') }}
</b-radio>
</div>

View File

@ -37,7 +37,7 @@
</label>
<b-taginput
v-model:value="termNames"
v-model="termNames"
attached
:confirm-keys="termNamesSeparator"
:on-paste-separators="termNamesSeparator"
@ -52,7 +52,7 @@
v-for="separator of ['Enter', ',', ';', '|']"
:key="separator"
name="term-multiple-insertion-separator"
v-model:value="termNamesSeparator"
v-model="termNamesSeparator"
:native-value="separator"
:disabled="separator == 'Enter'">
<kbd>{{ separator }}</kbd>
@ -66,12 +66,12 @@
class="parent-term-options">
<b-radio
:native-value="false"
v-model:value="hasParent">
v-model="hasParent">
{{ $i18n.get('label_no_parent_root_term') }}
</b-radio>
<b-radio
:native-value="true"
v-model:value="hasParent">
v-model="hasParent">
{{ $i18n.get('instruction_select_a_parent_term') }}
</b-radio>
<b-autocomplete
@ -81,10 +81,10 @@
:data="parentTerms"
field="name"
clearable
v-model:value="parentTermName"
v-model="parentTermName"
@select="onSelectParentTerm($event)"
:loading="isFetchingParentTerms"
@input="fetchParentTerms"
@update:model-value="fetchParentTerms"
check-infinite-scroll
:append-to-body="true"
@infinite-scroll="fetchMoreParentTerms">

View File

@ -33,12 +33,12 @@
<div class="parent-term-options">
<b-radio
:native-value="false"
v-model:value="hasParent">
v-model="hasParent">
{{ $i18n.get('label_no_parent_root_term') }}
</b-radio>
<b-radio
:native-value="true"
v-model:value="hasParent">
v-model="hasParent">
{{ $i18n.get('instruction_select_a_parent_term') }}
</b-radio>
<b-autocomplete
@ -47,10 +47,10 @@
:data="parentTerms"
field="name"
clearable
v-model:value="parentTermName"
v-model="parentTermName"
@select="onSelectParentTerm($event)"
:loading="isFetchingParentTerms"
@input="fetchParentTerms"
@update:model-value="fetchParentTerms"
:disabled="!hasParent"
check-infinite-scroll
:append-to-body="true"

View File

@ -18,8 +18,8 @@
:placeholder="$i18n.get('instruction_select_a_metadatum')"
:aria-label="$i18n.get('instruction_select_a_metadatum')"
:disabled="advancedSearchQuery[searchCriterion.type] && advancedSearchQuery[searchCriterion.type][searchCriterion.index]"
:value="(advancedSearchQuery[searchCriterion.type] && advancedSearchQuery[searchCriterion.type][searchCriterion.index] ) ? advancedSearchQuery[searchCriterion.type][searchCriterion.index].key : null"
@input="addMetadatumToAdvancedSearchQuery(
:model-value="(advancedSearchQuery[searchCriterion.type] && advancedSearchQuery[searchCriterion.type][searchCriterion.index] ) ? advancedSearchQuery[searchCriterion.type][searchCriterion.index].key : null"
@update:model-value="addMetadatumToAdvancedSearchQuery(
{
metadatumId: $event,
type: (metadataAsObject[$event] && metadataAsObject[$event].metadata_type_object) ? metadataAsObject[$event].metadata_type_object.primitive_type : '',
@ -67,8 +67,8 @@
<b-select
:loading="isLoadingMetadata"
v-if="searchCriterion.type == 'metaquery' && advancedSearchQuery.metaquery[searchCriterion.index]"
@input="addComparatorToAdvancedSearchQuery($event, searchCriterion)"
:value="advancedSearchQuery.metaquery[searchCriterion.index].compare"
@update:model-value="addComparatorToAdvancedSearchQuery($event, searchCriterion)"
:model-value="advancedSearchQuery.metaquery[searchCriterion.index].compare"
:placeholder="$i18n.get('label_criterion_to_compare')"
:aria-label="$i18n.get('label_criterion_to_compare')">
<option
@ -80,8 +80,8 @@
<b-select
:loading="isLoadingMetadata"
v-else-if="searchCriterion.type == 'taxquery' && advancedSearchQuery.taxquery[searchCriterion.index]"
@input="addComparatorToAdvancedSearchQuery($event, searchCriterion)"
:value="advancedSearchQuery.taxquery[searchCriterion.index].operator"
@update:model-value="addComparatorToAdvancedSearchQuery($event, searchCriterion)"
:model-value="advancedSearchQuery.taxquery[searchCriterion.index].operator"
:placeholder="$i18n.get('label_criterion_to_compare')"
:aria-label="$i18n.get('label_criterion_to_compare')">
<option
@ -104,8 +104,8 @@
v-if="getAdvancedSearchQueryCriterionMetadataType(searchCriterion.index) == 'int' || getAdvancedSearchQueryCriterionMetadataType(searchCriterion.index) == 'float'"
type="number"
step="any"
@input="addValueToAdvancedSearchQuery($event, searchCriterion)"
:value="advancedSearchQuery.metaquery[searchCriterion.index].value"
@update:model-value="addValueToAdvancedSearchQuery($event, searchCriterion)"
:model-value="advancedSearchQuery.metaquery[searchCriterion.index].value"
:placeholder="$i18n.get('label_number_to_search_for')"
:aria-label="$i18n.get('label_number_to_search_for')"
/>
@ -121,16 +121,16 @@
<b-input
v-else
type="text"
@input="addValueToAdvancedSearchQuery($event, searchCriterion)"
:value="advancedSearchQuery.metaquery[searchCriterion.index].value"
@update:model-value="addValueToAdvancedSearchQuery($event, searchCriterion)"
:model-value="advancedSearchQuery.metaquery[searchCriterion.index].value"
:placeholder="$i18n.get('label_string_to_search_for')"
:aria-label="$i18n.get('label_string_to_search_for')"
/>
</template>
<b-input
v-else-if="searchCriterion.type == 'taxquery' && advancedSearchQuery.taxquery[searchCriterion.index]"
:value="advancedSearchQuery.taxquery[searchCriterion.index].terms"
@input="addValueToAdvancedSearchQuery($event, searchCriterion)"
:model-value="advancedSearchQuery.taxquery[searchCriterion.index].terms"
@update:model-value="addValueToAdvancedSearchQuery($event, searchCriterion)"
type="text"
:placeholder="$i18n.get('label_string_to_search_for')"
:aria-label="$i18n.get('label_string_to_search_for')" />
@ -212,7 +212,7 @@
<b-loading
:is-full-page="false"
v-model:active="isLoadingMetadata" />
v-model="isLoadingMetadata" />
<section
v-if="!isLoadingMetadata && metadataAsArray && metadataAsArray.length <= 0"
@ -625,7 +625,7 @@
}
this.hasUpdatedSearch = false;
this.$eventBusSearch.$emit('performAdvancedSearch', this.advancedSearchQuery);
this.$eventBusSearchEmitter.emit('performAdvancedSearch', this.advancedSearchQuery);
},
getAdvancedSearchQueryCriterionMetadataType(searchCriterion) {
if (this.advancedSearchQuery.metaquery[searchCriterion] &&

View File

@ -5,7 +5,7 @@
<b-loading
:is-full-page="false"
v-model:active="isLoadingFilters"/>
v-model="isLoadingFilters"/>
<h3
id="filters-label-landmark"
@ -398,7 +398,7 @@
this.prepareFilters();
if (this.isUsingElasticSearch)
this.$eventBusSearch.$emitter.on('isLoadingItems', this.updateIsLoadingItems);
this.$eventBusSearchEmitter.on('isLoadingItems', this.updateIsLoadingItems);
},
beforeUnmount() {
// Cancels previous collection name Request
@ -414,7 +414,7 @@
this.filtersSearchCancel.cancel('Filters search Canceled.');
if (this.isUsingElasticSearch)
this.$eventBusSearch.$emitter.off('isLoadingItems', this.updateIsLoadingItems);
this.$eventBusSearchEmitter.off('isLoadingItems', this.updateIsLoadingItems);
},
methods: {

View File

@ -45,8 +45,7 @@
</ul>
<button
class="swiper-button-prev"
id="tainacan-filter-tags-prev"
slot="button-prev">
id="tainacan-filter-tags-prev">
<svg
width="24"
height="24"
@ -59,8 +58,7 @@
</button>
<button
class="swiper-button-next"
id="tainacan-filter-tags-next"
slot="button-next">
id="tainacan-filter-tags-next">
<svg
width="24"
height="24"

View File

@ -38,10 +38,10 @@
horizontal
:label="$i18n.get('label_items_per_page')">
<b-select
:value="itemsPerPage"
:model-value="itemsPerPage"
aria-controls="items-list-results"
aria-labelledby="items-per-page-select"
@input="onChangeItemsPerPage">
@update:model-value="onChangeItemsPerPage">
<template
v-for="(itemsPerPageOption, index) of itemsPerPageOptions"
:key="index">
@ -67,15 +67,16 @@
@change="onPageChange"
aria-role="list"
trap-focus>
<button
aria-labelledby="go-to-page-dropdown"
class="button is-white"
slot="trigger">
<span>{{ page }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown"/>
</span>
</button>
<template #trigger>
<button
aria-labelledby="go-to-page-dropdown"
class="button is-white">
<span>{{ page }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown"/>
</span>
</button>
</template>
<b-dropdown-item
aria-controls="items-list-results"
role="button"
@ -94,7 +95,7 @@
aria-controls="items-list-results"
@change="onPageChange"
:total="totalItems"
v-model:current="page"
v-model="page"
order="is-centered"
size="is-small"
:per-page="itemsPerPage"

View File

@ -30,7 +30,6 @@ import {
Numberinput
} from '@ntohq/buefy-next';
import VTooltip from 'floating-vue';
import draggable from 'vuedraggable';
import VueTheMask from 'vue-the-mask';
import cssVars from 'css-vars-ponyfill';
import VueBlurHash from 'another-vue3-blurhash';
@ -72,7 +71,6 @@ import TainacanTitle from '../components/navigation/tainacan-title.vue';
import store from './store/store';
import router from './router';
import eventBusSearch from './event-bus-search';
import eventBusMetadataList from './event-bus-metadata-list.js';
import {
I18NPlugin,
UserPrefsPlugin,
@ -89,6 +87,14 @@ import {
} from './utilities';
import mitt from 'mitt';
import { configureCompat } from 'vue'
// Desabilita a compatibilidade Vue2 para certos recursos já tratados no código
configureCompat({
COMPONENT_V_MODEL: false
})
export default (element) => {
function renderTainacanAdminPage() {
@ -101,8 +107,6 @@ export default (element) => {
const app = createApp({
el: '#tainacan-admin-app',
router,
store,
render: () => h(AdminPage)
});
@ -112,6 +116,9 @@ export default (element) => {
const emitter = mitt();
app.config.globalProperties.$emitter = emitter;
const eventBusMetadataList = mitt();
app.config.globalProperties.$eventBusMetadataList = emitter;
/* Registers Extra Vue Plugins passed to the window.tainacan_extra_plugins */
if (typeof window.tainacan_extra_plugins != "undefined") {
for (let [extraVuePluginName, extraVuePluginObject] of Object.entries(window.tainacan_extra_plugins))
@ -232,7 +239,6 @@ export default (element) => {
/* Others */
app.component('help-button', HelpButton);
app.component('draggable', draggable);
app.component('tainacan-title', TainacanTitle);
// Event bus are needed to facilate comunication between child-parent-child components

View File

@ -5,7 +5,6 @@ import mitt from 'mitt';
const emitter = mitt();
export const eventBusItemMetadata = createApp({
store,
data: {
errors : [],
conditionalSections: {}
@ -159,4 +158,5 @@ export const eventBusItemMetadata = createApp({
}
}
});
eventBusItemMetadata.config.globalProperties.$emitter = emitter;
eventBusItemMetadata.config.globalProperties.$emitter = emitter;
eventBusItemMetadata.use(store);

View File

@ -1,25 +0,0 @@
import { createApp } from 'vue';
import mitt from 'mitt';
const emitter = mitt();
export default {
install(app, options = {}) {
app.config.globalProperties.$emitter = emitter;
app.config.globalProperties.$eventBusMetadataList = createApp({
emits: [
'addMetadatumViaButton',
'addMetadataSectionViaButton'
],
methods: {
onAddMetadatumViaButton(metadataType) {
this.$emit('addMetadatumViaButton', metadataType);
},
onAddMetadataSectionViaButton() {
this.$emit('addMetadataSectionViaButton');
}
}
});
}
}

View File

@ -1,4 +1,3 @@
import { createApp } from 'vue';
import mitt from 'mitt';
const emitter = mitt();
@ -6,439 +5,283 @@ const emitter = mitt();
export default {
install(app, options = {}) {
app.config.globalProperties.$emitter = emitter;
app.config.globalProperties.$eventBusSearch = {
router: options.router,
store: options.store,
data: {
errors : [],
query: {},
collectionId: undefined,
defaultOrder: 'ASC',
defaultOrderBy: 'date',
taxonomy: undefined,
termId: undefined,
searchCancel: undefined
$store: app.config.globalProperties.$store,
$router: app.config.globalProperties.$router,
$route: app.config.globalProperties.$route,
errors : [],
query: {},
collectionId: undefined,
defaultOrder: 'ASC',
defaultOrderBy: 'date',
taxonomy: undefined,
termId: undefined,
searchCancel: undefined,
performAdvancedSearch(data) {
this.$store.dispatch('search/set_advanced_query', data);
this.updateURLQueries();
},
emits: [
'input',
'startSlideshowFromItem',
'hasToReloadFacets',
'isLoadingItems',
'hasFiltered',
'closeAdvancedSearch'
],
created() {
this.$emitter.on('input', data => {
if (data.taxonomy)
this.addTaxquery(data);
else
this.addMetaquery(data);
});
this.$root.$emitter.on('closeAdvancedSearch', () => {
this.$store.dispatch('search/setPage', 1);
this.performAdvancedSearch({});
});
this.$root.$emitter.on('performAdvancedSearch', advancedSearchQuery => {
this.$store.dispatch('search/setPage', 1);
this.performAdvancedSearch(advancedSearchQuery);
this.updateURLQueries();
});
addMetaquery( data ){
if ( data && data.collection_id ){
this.$store.dispatch('search/add_metaquery', data );
}
this.updateURLQueries();
},
watch: {
'$route': {
handler(to, from) {
addTaxquery( data ){
if ( data && data.collection_id ){
this.$store.dispatch('search/add_taxquery', data );
}
this.updateURLQueries();
},
removeMetaFromFilterTag(filterTag) {
if (filterTag.singleLabel != undefined || filterTag.label != undefined) {
// Should set Collection ID from URL only when in admin.
if (this.$route.name == 'CollectionItemsPage' || this.$route.name == 'ItemsPage')
this.collectionId = !this.$route.params.collectionId ? this.$route.params.collectionId : parseInt(this.$route.params.collectionId);
// Fills the URL with appropriate default values in case a query is not passed
if (this.$route.name == null || this.$route.name == undefined || this.$route.name == 'CollectionItemsPage' || this.$route.name == 'ItemsPage') {
// Items Per Page
if (this.$route.query.perpage == undefined || to.params.collectionId != from.params.collectionId) {
let perPageKey = (this.collectionId != undefined ? 'items_per_page_' + this.collectionId : 'items_per_page');
let perPageValue = this.$userPrefs.get(perPageKey);
if (perPageValue)
this.$route.query.perpage = perPageValue;
else {
this.$route.query.perpage = 12;
this.$userPrefs.set(perPageKey, 12);
}
}
// Page
if (this.$route.query.paged == undefined || to.params.collectionId != from.params.collectionId)
this.$route.query.paged = 1;
// Order (ASC, DESC)
if (this.$route.query.order == undefined || to.params.collectionId != from.params.collectionId) {
let orderKey = (this.collectionId != undefined ? 'order_' + this.collectionId : 'order');
let orderValue = this.$userPrefs.get(orderKey) ? this.$userPrefs.get(orderKey) : this.defaultOrder;
if (orderValue)
this.$route.query.order = orderValue;
else {
this.$route.query.order = 'DESC';
this.$userPrefs.set(orderKey, 'DESC');
}
}
// Order By (required extra work to deal with custom metadata ordering)
if (this.$route.query.orderby == undefined || (to.params.collectionId != from.params.collectionId)) {
let orderByKey = (this.collectionId != undefined ? 'order_by_' + this.collectionId : 'order_by');
let orderBy = this.$userPrefs.get(orderByKey) ? this.$userPrefs.get(orderByKey) : this.defaultOrderBy;
if (orderBy && orderBy != 'name') {
// Previously was stored as a metadata object, now it is a orderby object
if (orderBy.slug || typeof orderBy == 'string')
orderBy = this.$orderByHelper.getOrderByForMetadatum(orderBy);
if (orderBy.orderby)
Object.keys(orderBy).forEach((paramKey) => {
this.$route.query[paramKey] = orderBy[paramKey];
});
else
this.$route.query.orderby = 'date'
} else {
this.$route.query.orderby = 'date';
this.$userPrefs.set(orderByKey, {
slug: 'creation_date',
name: this.$i18n.get('label_creation_date')
}).catch(() => { });
}
} else if ( this.$route.query.orderby == 'creation_date' ) { // Fixes old usage of creation_date
this.$route.query.orderby = 'date'
}
// Theme View Modes
if ((this.$route.name == null || this.$route.name == undefined ) &&
this.$route.name != 'CollectionItemsPage' && this.$route.name != 'ItemsPage' &&
(this.$route.query.view_mode == undefined || to.params.collectionId != from.params.collectionId)
) {
let viewModeKey = (this.collectionId != undefined ? 'view_mode_' + this.collectionId : 'view_mode');
let viewModeValue = this.$userPrefs.get(viewModeKey);
if (viewModeValue)
this.$route.query.view_mode = viewModeValue;
else {
this.$route.query.view_mode = 'table';
this.$userPrefs.set(viewModeKey, 'table');
}
}
// Emit slideshow-from to start this view mode from index
if (this.$route.query.view_mode != 'slideshow' && this.$route.query['slideshow-from'] !== null && this.$route.query['slideshow-from'] !== undefined && this.$route.query['slideshow-from'] !== false)
this.$emit('startSlideshowFromItem', this.$route.query['slideshow-from']);
// Admin View Modes
if (this.$route.name != null && this.$route.name != undefined &&
(this.$route.name == 'CollectionItemsPage' || this.$route.name == 'ItemsPage') &&
(this.$route.query.admin_view_mode == undefined || to.params.collectionId != from.params.collectionId)
) {
let adminViewModeKey = (this.collectionId != undefined ? 'admin_view_mode_' + this.collectionId : 'admin_view_mode');
let adminViewModeValue = this.$userPrefs.get(adminViewModeKey);
if (adminViewModeValue)
this.$route.query.admin_view_mode = adminViewModeValue;
else {
this.$route.query.admin_view_mode = 'table';
this.$userPrefs.set(adminViewModeKey, 'table');
}
}
// Advanced Search
if (this.$route.query && this.$route.query.advancedSearch){
this.$store.dispatch('search/set_advanced_query', this.$route.query);
} else {
this.$store.dispatch('search/set_postquery', this.$route.query);
}
// Checks current metaqueries and taxqueries to alert filters that should reload
// For some reason, this process is not working accessing to.query, so we need to check the path string.
const oldQueryString = from.fullPath.replace(from.path + '?', '');
const newQueryString = to.fullPath.replace(from.path + '?', '');
const oldQueryArray = oldQueryString.split('&');
const newQueryArray = newQueryString.split('&');
const oldMetaQueryArray = oldQueryArray.filter(queryItem => queryItem.startsWith('metaquery'));
const newMetaQueryArray = newQueryArray.filter(queryItem => queryItem.startsWith('metaquery'));
const oldTaxQueryArray = oldQueryArray.filter(queryItem => queryItem.startsWith('taxquery'));
const newTaxQueryArray = newQueryArray.filter(queryItem => queryItem.startsWith('taxquery'));
const oldStatusArray = oldQueryArray.filter(queryItem => queryItem.startsWith('status'));
const newStatusArray = newQueryArray.filter(queryItem => queryItem.startsWith('status'));
const oldSearchQuery = oldQueryArray.filter(queryItem => queryItem.startsWith('search'));
const newSearchQuery = newQueryArray.filter(queryItem => queryItem.startsWith('search'));
if (
JSON.stringify(oldMetaQueryArray) != JSON.stringify(newMetaQueryArray) ||
JSON.stringify(oldTaxQueryArray) != JSON.stringify(newTaxQueryArray) ||
JSON.stringify(oldStatusArray) != JSON.stringify(newStatusArray) ||
JSON.stringify(oldSearchQuery) != JSON.stringify(newSearchQuery)
) {
this.$emit('hasToReloadFacets', true);
}
// Finally, loads items
if (to.fullPath != from.fullPath)
this.loadItems();
if (filterTag.argType !== 'postin') {
if (filterTag.taxonomy) {
this.$store.dispatch('search/remove_taxquery', {
filterId: filterTag.filterId,
label: filterTag.singleLabel ? filterTag.singleLabel : filterTag.label,
isMultiValue: filterTag.singleLabel ? false : true,
taxonomy: filterTag.taxonomy,
value: filterTag.value
});
} else {
this.$store.dispatch('search/remove_metaquery', {
filterId: filterTag.filterId,
label: filterTag.singleLabel ? filterTag.singleLabel : filterTag.label,
isMultiValue: filterTag.singleLabel ? false : true,
metadatum_id: filterTag.metadatumId,
value: filterTag.value
});
}
},
deep: true
} else {
this.$store.dispatch('search/remove_postin');
}
this.$store.dispatch('search/removeFilterTag', filterTag);
}
this.updateURLQueries();
},
addFetchOnly( metadatum, ignorePrefs, metadatumIDs ) {
this.$store.dispatch('search/add_fetch_only', metadatum );
this.$store.dispatch('search/add_fetch_only_meta', metadatumIDs);
this.updateURLQueries();
if (!ignorePrefs) {
let prefsFetchOnly = this.collectionId ? `fetch_only_${this.collectionId}` : 'fetch_only';
let prefsFetchOnlyMeta = this.collectionId ? `fetch_only_meta_${this.collectionId}` : 'fetch_only_meta';
if (this.$userPrefs.get(prefsFetchOnly) != metadatum)
this.$userPrefs.set(prefsFetchOnly, metadatum);
if (this.$userPrefs.get(prefsFetchOnlyMeta) != metadatumIDs)
this.$userPrefs.set(prefsFetchOnlyMeta, metadatumIDs);
}
},
methods: {
performAdvancedSearch(data) {
this.$store.dispatch('search/set_advanced_query', data);
this.updateURLQueries();
},
addMetaquery( data ){
if ( data && data.collection_id ){
this.$store.dispatch('search/add_metaquery', data );
}
this.updateURLQueries();
},
addTaxquery( data ){
if ( data && data.collection_id ){
this.$store.dispatch('search/add_taxquery', data );
}
this.updateURLQueries();
},
removeMetaFromFilterTag(filterTag) {
cleanFetchOnly() {
this.$store.dispatch('search/cleanFetchOnly');
},
removeFetchOnlyMeta( metadatum ){
this.$store.dispatch('search/remove_fetch_only_meta', metadatum );
this.updateURLQueries();
},
setPage(page) {
this.$store.dispatch('search/setPage', page);
this.updateURLQueries();
},
resetPageOnStore() {
this.$store.dispatch('search/setPage', 1);
},
setItemsPerPage(itemsPerPage, shouldNotUpdatePrefs) {
this.$store.dispatch('search/setItemsPerPage', itemsPerPage);
this.updateURLQueries();
if (filterTag.singleLabel != undefined || filterTag.label != undefined) {
if (filterTag.argType !== 'postin') {
if (filterTag.taxonomy) {
this.$store.dispatch('search/remove_taxquery', {
filterId: filterTag.filterId,
label: filterTag.singleLabel ? filterTag.singleLabel : filterTag.label,
isMultiValue: filterTag.singleLabel ? false : true,
taxonomy: filterTag.taxonomy,
value: filterTag.value
});
} else {
this.$store.dispatch('search/remove_metaquery', {
filterId: filterTag.filterId,
label: filterTag.singleLabel ? filterTag.singleLabel : filterTag.label,
isMultiValue: filterTag.singleLabel ? false : true,
metadatum_id: filterTag.metadatumId,
value: filterTag.value
});
}
} else {
this.$store.dispatch('search/remove_postin');
}
this.$store.dispatch('search/removeFilterTag', filterTag);
}
this.updateURLQueries();
},
addFetchOnly( metadatum, ignorePrefs, metadatumIDs ) {
this.$store.dispatch('search/add_fetch_only', metadatum );
this.$store.dispatch('search/add_fetch_only_meta', metadatumIDs);
this.updateURLQueries();
if (!ignorePrefs) {
let prefsFetchOnly = this.collectionId ? `fetch_only_${this.collectionId}` : 'fetch_only';
let prefsFetchOnlyMeta = this.collectionId ? `fetch_only_meta_${this.collectionId}` : 'fetch_only_meta';
if (this.$userPrefs.get(prefsFetchOnly) != metadatum)
this.$userPrefs.set(prefsFetchOnly, metadatum);
if (this.$userPrefs.get(prefsFetchOnlyMeta) != metadatumIDs)
this.$userPrefs.set(prefsFetchOnlyMeta, metadatumIDs);
}
},
cleanFetchOnly() {
this.$store.dispatch('search/cleanFetchOnly');
},
removeFetchOnlyMeta( metadatum ){
this.$store.dispatch('search/remove_fetch_only_meta', metadatum );
this.updateURLQueries();
},
setPage(page) {
this.$store.dispatch('search/setPage', page);
this.updateURLQueries();
},
resetPageOnStore() {
this.$store.dispatch('search/setPage', 1);
},
setItemsPerPage(itemsPerPage, shouldNotUpdatePrefs) {
this.$store.dispatch('search/setItemsPerPage', itemsPerPage);
this.updateURLQueries();
if (shouldNotUpdatePrefs == undefined || shouldNotUpdatePrefs == false) {
let prefsPerPage = this.collectionId != undefined ? 'items_per_page_' + this.collectionId : 'items_per_page';
if (this.$userPrefs.get(prefsPerPage) != itemsPerPage) {
this.$userPrefs.set(prefsPerPage, itemsPerPage)
.catch(() => {});
}
}
},
setOrderBy(orderBy) {
let prefsOrderBy = this.collectionId != undefined ? 'order_by_' + this.collectionId : 'order_by';
if (orderBy.metakey) {
if (!this.$userPrefs.get(prefsOrderBy) || orderBy.metakey != this.$userPrefs.get(prefsOrderBy).metakey)
this.$userPrefs.set(prefsOrderBy, orderBy).catch(() => {});
} else {
if (orderBy != this.$userPrefs.get(prefsOrderBy))
this.$userPrefs.set(prefsOrderBy, orderBy).catch(() => {});
}
this.$store.dispatch('search/setOrderBy', orderBy);
this.updateURLQueries();
},
setOrder(order) {
let prefsOrder = this.collectionId != undefined ? 'order_' + this.collectionId : 'order';
if (this.$userPrefs.get(prefsOrder) != order) {
this.$userPrefs.set(prefsOrder, order)
if (shouldNotUpdatePrefs == undefined || shouldNotUpdatePrefs == false) {
let prefsPerPage = this.collectionId != undefined ? 'items_per_page_' + this.collectionId : 'items_per_page';
if (this.$userPrefs.get(prefsPerPage) != itemsPerPage) {
this.$userPrefs.set(prefsPerPage, itemsPerPage)
.catch(() => {});
}
}
},
setOrderBy(orderBy) {
let prefsOrderBy = this.collectionId != undefined ? 'order_by_' + this.collectionId : 'order_by';
this.$store.dispatch('search/setOrder', order);
this.updateURLQueries();
},
setStatus(status) {
this.$store.dispatch('search/setStatus', status);
this.updateURLQueries();
},
setTotalItems(totalItems) {
this.$store.dispatch('search/setTotalItems', totalItems);
},
setSentenceMode(sentenceMode) {
this.$store.dispatch('search/setSentenceMode', sentenceMode);
},
setSearchQuery(searchQuery) {
this.$store.dispatch('search/setSearchQuery', searchQuery);
this.updateURLQueries();
},
setViewMode(viewMode) {
this.$store.dispatch('search/setViewMode', viewMode);
this.updateURLQueries();
let prefsViewMode = this.collectionId != undefined ? 'view_mode_' + this.collectionId : 'view_mode';
if(this.$userPrefs.get(prefsViewMode) != viewMode) {
this.$userPrefs.set(prefsViewMode, viewMode)
.catch(() => {});
}
},
setAdminViewMode(adminViewMode) {
this.$store.dispatch('search/setAdminViewMode', adminViewMode);
this.updateURLQueries();
if (orderBy.metakey) {
if (!this.$userPrefs.get(prefsOrderBy) || orderBy.metakey != this.$userPrefs.get(prefsOrderBy).metakey)
this.$userPrefs.set(prefsOrderBy, orderBy).catch(() => {});
} else {
if (orderBy != this.$userPrefs.get(prefsOrderBy))
this.$userPrefs.set(prefsOrderBy, orderBy).catch(() => {});
}
this.$store.dispatch('search/setOrderBy', orderBy);
this.updateURLQueries();
},
setOrder(order) {
let prefsOrder = this.collectionId != undefined ? 'order_' + this.collectionId : 'order';
if (this.$userPrefs.get(prefsOrder) != order) {
this.$userPrefs.set(prefsOrder, order)
.catch(() => {});
}
let prefsAdminViewMode = this.collectionId != undefined ? 'admin_view_mode_' + this.collectionId : 'admin_view_mode';
if (this.$userPrefs.get(prefsAdminViewMode) != adminViewMode) {
this.$userPrefs.set(prefsAdminViewMode, adminViewMode)
.catch(() => { });
}
},
setInitialViewMode(viewMode) {
this.$store.dispatch('search/setViewMode', viewMode);
this.updateURLQueries();
},
setInitialAdminViewMode(adminViewMode) {
this.$store.dispatch('search/setAdminViewMode', adminViewMode);
this.updateURLQueries();
},
setSelectedItemsForIframe(selectedItems, singleSelection) {
if (singleSelection)
this.$store.dispatch('search/cleanSelectedItems');
this.$store.dispatch('search/setOrder', order);
this.updateURLQueries();
},
setStatus(status) {
this.$store.dispatch('search/setStatus', status);
this.updateURLQueries();
},
setTotalItems(totalItems) {
this.$store.dispatch('search/setTotalItems', totalItems);
},
setSentenceMode(sentenceMode) {
this.$store.dispatch('search/setSentenceMode', sentenceMode);
},
setSearchQuery(searchQuery) {
this.$store.dispatch('search/setSearchQuery', searchQuery);
this.updateURLQueries();
},
setViewMode(viewMode) {
this.$store.dispatch('search/setViewMode', viewMode);
this.updateURLQueries();
let prefsViewMode = this.collectionId != undefined ? 'view_mode_' + this.collectionId : 'view_mode';
if(this.$userPrefs.get(prefsViewMode) != viewMode) {
this.$userPrefs.set(prefsViewMode, viewMode)
.catch(() => {});
}
},
setAdminViewMode(adminViewMode) {
this.$store.dispatch('search/setAdminViewMode', adminViewMode);
this.updateURLQueries();
this.$store.dispatch('search/setSelectedItems', selectedItems);
let currentSelectedItems = this.$store.getters['search/getSelectedItems'];
let prefsAdminViewMode = this.collectionId != undefined ? 'admin_view_mode_' + this.collectionId : 'admin_view_mode';
if (this.$userPrefs.get(prefsAdminViewMode) != adminViewMode) {
this.$userPrefs.set(prefsAdminViewMode, adminViewMode)
.catch(() => { });
}
},
setInitialViewMode(viewMode) {
this.$store.dispatch('search/setViewMode', viewMode);
this.updateURLQueries();
},
setInitialAdminViewMode(adminViewMode) {
this.$store.dispatch('search/setAdminViewMode', adminViewMode);
this.updateURLQueries();
},
setSelectedItemsForIframe(selectedItems, singleSelection) {
if (window.history.pushState) {
let searchParams = new URLSearchParams(window.location.search);
searchParams.delete('selecteditems');
for (let selectedItem of currentSelectedItems)
searchParams.append('selecteditems', selectedItem);
let newurl = window.location.protocol + "//" + window.location.host + window.location.pathname + '?' + searchParams.toString() + window.location.hash;
window.history.pushState({path: newurl}, '', newurl);
}
},
cleanSelectedItems() {
if (singleSelection)
this.$store.dispatch('search/cleanSelectedItems');
},
filterBySelectedItems(selectedItems) {
this.$router.replace({ query: {} });
this.$router.replace({ query: { postin: selectedItems } });
},
highlightsItem(itemId) {
this.$store.dispatch('search/highlightsItem', itemId);
this.updateURLQueries();
},
updateURLQueries() {
this.$router.replace({ query: {} });
this.$router.replace({ query: this.$store.getters['search/getPostQuery'] });
},
updateStoreFromURL() {
this.$store.dispatch('search/set_postquery', this.$route.query);
},
loadItems() {
// Forces fetch_only to be filled before any search happens
if (this.$store.getters['search/getPostQuery']['fetch_only'] != undefined) {
this.$store.dispatch('search/setSelectedItems', selectedItems);
this.$emit( 'isLoadingItems', true);
// Cancels previous Request
if (this.searchCancel != undefined)
this.searchCancel.cancel('Item search Canceled.');
this.$store.dispatch('collection/fetchItems', {
'collectionId': this.collectionId,
'isOnTheme': (this.$route.name == null),
'termId': this.termId,
'taxonomy': this.taxonomy
}).then((resp) => {
// The actual fetch item request
resp.request.then((res) => {
this.$emit( 'isLoadingItems', false);
this.$emit( 'hasFiltered', res.hasFiltered);
})
.catch(() => {
this.$emit( 'isLoadingItems', false);
});
let currentSelectedItems = this.$store.getters['search/getSelectedItems'];
// Search Request Token for cancelling
this.searchCancel = resp.source;
if (window.history.pushState) {
let searchParams = new URLSearchParams(window.location.search);
searchParams.delete('selecteditems');
for (let selectedItem of currentSelectedItems)
searchParams.append('selecteditems', selectedItem);
let newurl = window.location.protocol + "//" + window.location.host + window.location.pathname + '?' + searchParams.toString() + window.location.hash;
window.history.pushState({path: newurl}, '', newurl);
}
},
cleanSelectedItems() {
this.$store.dispatch('search/cleanSelectedItems');
},
filterBySelectedItems(selectedItems) {
this.$router.replace({ query: {} });
this.$router.replace({ query: { postin: selectedItems } });
},
highlightsItem(itemId) {
this.$store.dispatch('search/highlightsItem', itemId);
this.updateURLQueries();
},
updateURLQueries() {
this.$router.replace({ query: {} });
this.$router.replace({ query: this.$store.getters['search/getPostQuery'] });
},
updateStoreFromURL() {
this.$store.dispatch('search/set_postquery', this.$route.query);
},
loadItems() {
// Forces fetch_only to be filled before any search happens
if (this.$store.getters['search/getPostQuery']['fetch_only'] != undefined) {
this.$eventBusSearchEmitter.emit( 'isLoadingItems', true);
// Cancels previous Request
if (this.searchCancel != undefined)
this.searchCancel.cancel('Item search Canceled.');
this.$store.dispatch('collection/fetchItems', {
'collectionId': this.collectionId,
'isOnTheme': (this.$route.name == null),
'termId': this.termId,
'taxonomy': this.taxonomy
}).then((resp) => {
// The actual fetch item request
resp.request.then((res) => {
this.$eventBusSearchEmitter.emit( 'isLoadingItems', false);
this.$eventBusSearchEmitter.emit( 'hasFiltered', res.hasFiltered);
})
.catch(() => {
this.$eventBusSearchEmitter.emit( 'isLoadingItems', false);
});
}
},
setCollectionId(collectionId) {
this.setTotalItems(null);
this.collectionId = collectionId;
},
setDefaultOrder(defaultOrder) {
this.defaultOrder = defaultOrder;
},
setDefaultOrderBy(defaultOrderBy) {
this.defaultOrderBy = defaultOrderBy;
},
setTerm(termId, taxonomy) {
this.termId = termId;
this.taxonomy = taxonomy;
},
clearAllFilters() {
this.$store.dispatch('search/cleanFilterTags');
this.$store.dispatch('search/cleanMetaQueries', { keepCollections: true });
this.$store.dispatch('search/cleanTaxQueries');
this.updateURLQueries();
}
// Search Request Token for cancelling
this.searchCancel = resp.source;
});
}
},
setCollectionId(collectionId) {
this.setTotalItems(null);
this.collectionId = collectionId;
},
setDefaultOrder(defaultOrder) {
this.defaultOrder = defaultOrder;
},
setDefaultOrderBy(defaultOrderBy) {
this.defaultOrderBy = defaultOrderBy;
},
setTerm(termId, taxonomy) {
this.termId = termId;
this.taxonomy = taxonomy;
},
clearAllFilters() {
this.$store.dispatch('search/cleanFilterTags');
this.$store.dispatch('search/cleanMetaQueries', { keepCollections: true });
this.$store.dispatch('search/cleanTaxQueries');
this.updateURLQueries();
}
};
}
// Defines the global $eventBusSearchEmitter for handling events across different search components
emitter.on('input', data => {
if (data.taxonomy)
$eventBusSearch.addTaxquery(data);
else
$eventBusSearch.addMetaquery(data);
});
emitter.on('closeAdvancedSearch', () => {
$eventBusSearch.$store.dispatch('search/setPage', 1);
$eventBusSearch.performAdvancedSearch({});
});
emitter.on('performAdvancedSearch', advancedSearchQuery => {
$eventBusSearch.$store.dispatch('search/setPage', 1);
$eventBusSearch.performAdvancedSearch(advancedSearchQuery);
$eventBusSearch.updateURLQueries();
});
app.config.globalProperties.$eventBusSearchEmitter = emitter;
}
}

View File

@ -1,6 +1,6 @@
<template>
<div class="home-page page-container">
<b-loading v-model:active="isLoadingCollections"/>
<b-loading v-model="isLoadingCollections"/>
<section
v-if="!$adminOptions.hideHomeRepositorySection"
class="home-section home-section-repository">

View File

@ -33,7 +33,7 @@
<b-loading
:is-full-page="false"
v-model:active="isLoading"
v-model="isLoading"
:can-cancel="false"/>
<div
@ -44,10 +44,10 @@
<b-datepicker
ref="datepicker"
:placeholder="$i18n.get('instruction_filter_activities_date')"
v-model:value="searchDates"
v-model="searchDates"
range
:trap-focus="false"
@input="searchActivities()"
@update:model-value="searchActivities()"
:date-formatter="(date) => dateFormatter(date)"
:date-parser="(date) => dateParser(date)"
icon="calendar-today"
@ -95,7 +95,7 @@
:placeholder="$i18n.get('instruction_type_search_users_filter')"
keep-first
open-on-focus
@input="fetchUsersForFiltering"
@update:model-value="fetchUsersForFiltering"
@focus.once="($event) => fetchUsersForFiltering($event.target.value)"
@select="filterActivitiesByUser"
:loading="isFetchingUsers"
@ -132,7 +132,7 @@
size="is-small"
:aria-label="$i18n.get('instruction_search') + ' ' + $i18n.get('activities')"
autocomplete="on"
v-model:value="searchQuery"
v-model="searchQuery"
@keyup.enter="searchActivities()"
icon-right="magnify"
icon-right-clickable
@ -149,8 +149,8 @@
:placeholder="$i18n.get('instruction_filter_activities_date')"
range
icon="calendar-today"
v-model:value="searchDates"
@input="searchProcesses()"
v-model="searchDates"
@update:model-value="searchProcesses()"
:date-formatter="(date) => dateFormatter(date)"
:date-parser="(date) => dateParser(date)"
:years-range="[-50, 3]"
@ -196,7 +196,7 @@
size="is-small"
:aria-label="$i18n.get('instruction_search') + ' ' + $i18n.get('activities')"
autocomplete="on"
v-model:value="searchQuery"
v-model="searchQuery"
@keyup.enter="searchProcesses()"
icon-right="magnify"
icon-right-clickable
@ -265,8 +265,8 @@
horizontal
:label="$i18n.get('label_activities_per_page')">
<b-select
:value="activitiesPerPage"
@input="onChangeActivitiesPerPage"
:model-value="activitiesPerPage"
@update:model-value="onChangeActivitiesPerPage"
:disabled="activities.length <= 0">
<option value="12">12</option>
<option value="24">24</option>
@ -279,7 +279,7 @@
<b-pagination
@change="onPageChange"
:total="totalActivities"
v-model:current="activitiesPage"
v-model="activitiesPage"
order="is-centered"
size="is-small"
:per-page="activitiesPerPage"
@ -306,8 +306,8 @@
horizontal
:label="$i18n.get('label_processes_per_page')">
<b-select
:value="processesPerPage"
@input="onChangeProcessesPerPage"
:model-value="processesPerPage"
@update:model-value="onChangeProcessesPerPage"
:disabled="processes.length <= 0">
<option value="12">12</option>
<option value="24">24</option>
@ -320,7 +320,7 @@
<b-pagination
@change="onPageChange"
:total="totalProcesses"
v-model:current="processesPage"
v-model="processesPage"
order="is-centered"
size="is-small"
:per-page="processesPerPage"

View File

@ -18,7 +18,7 @@
</div>
<b-loading
v-model:active="isLoading"
v-model="isLoading"
:can-cancel="false"/>
</div>
</template>

View File

@ -18,7 +18,7 @@
</div>
<b-loading
v-model:active="isLoading"
v-model="isLoading"
:can-cancel="false"/>
</div>
</template>

View File

@ -14,7 +14,7 @@
<div class="control has-icons-right is-small is-clearfix">
<b-autocomplete
clearable
v-model:value="filteredRole"
v-model="filteredRole"
:data="filteredRoles"
:placeholder="$i18n.get('instruction_type_search_roles_filter')"
keep-first
@ -28,7 +28,7 @@
<div>
<b-loading
:is-full-page="true"
v-model:active="isLoading"
v-model="isLoading"
:can-cancel="false"/>
<capabilities-list

View File

@ -1,6 +1,6 @@
<template>
<div class="repository-level-page page-container">
<b-loading v-model:active="isLoading"/>
<b-loading v-model="isLoading"/>
<tainacan-title
:bread-crumb-items="[{ path: '', label: $i18n.get('collections') }]"/>
<div class="sub-header">
@ -13,14 +13,14 @@
aria-role="list"
id="collection-creation-options-dropdown"
trap-focus>
<button
class="button is-secondary"
slot="trigger">
<div>{{ $i18n.getFrom('collections', 'new_item') }}</div>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
<template #trigger>
<button class="button is-secondary">
<div>{{ $i18n.getFrom('collections', 'new_item') }}</div>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
</template>
<b-dropdown-item aria-role="listitem">
<router-link
:to="{ path: $routerHelper.getNewCollectionPath() }"
@ -71,15 +71,16 @@
class="show metadata-options-dropdown"
aria-role="list"
trap-focus>
<button
:aria-label="collectionTaxonomy['name']"
class="button is-white"
slot="trigger">
<span>{{ collectionTaxonomy['name'] }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
<template #trigger>
<button
:aria-label="collectionTaxonomy['name']"
class="button is-white">
<span>{{ collectionTaxonomy['name'] }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
</template>
<div class="metadata-options-container">
<b-dropdown-item
v-for="(collectionTaxonomyTerm, index) in collectionTaxonomy['terms']"
@ -88,7 +89,7 @@
custom
aria-role="listitem">
<b-checkbox
v-model:value="collectionTaxonomyTerm.enabled"
v-model="collectionTaxonomyTerm.enabled"
:native-value="collectionTaxonomyTerm.enabled">
{{ collectionTaxonomyTerm.name }}
</b-checkbox>
@ -109,29 +110,28 @@
<!-- Sorting options ---- -->
<b-field class="header-item">
<label class="label">{{ $i18n.get('label_sort') }}&nbsp;</label>
<pre>{{ collections.length }}</pre>
<pre>{{ isLoading }}</pre>
<b-dropdown
:mobile-modal="true"
:disabled="collections.length <= 0 || isLoading"
@input="onChangeOrder"
@update:model-value="onChangeOrder"
aria-role="list"
trap-focus>
<button
:aria-label="$i18n.get('label_sorting_direction')"
class="button is-white"
slot="trigger">
<span
style="margin-top: -2px;"
class="icon is-small gray-icon">
<i
:class="order == 'desc' ? 'tainacan-icon-sortdescending' : 'tainacan-icon-sortascending'"
class="tainacan-icon tainacan-icon-1-125em"/>
</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
<template #trigger>
<button
:aria-label="$i18n.get('label_sorting_direction')"
class="button is-white">
<span
style="margin-top: -2px;"
class="icon is-small gray-icon">
<i
:class="order == 'desc' ? 'tainacan-icon-sortdescending' : 'tainacan-icon-sortascending'"
class="tainacan-icon tainacan-icon-1-125em"/>
</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
</template>
<b-dropdown-item
aria-controls="items-list-results"
role="button"
@ -165,8 +165,8 @@
<b-select
class="sorting-select"
:disabled="collections.length <= 0"
@input="onChangeOrderBy($event)"
:value="orderBy"
@update:model-value="onChangeOrderBy($event)"
:model-value="orderBy"
:label="$i18n.get('label_sorting')">
<option
v-for="(option, index) in sortingOptions"
@ -185,7 +185,7 @@
size="is-small"
:aria-label="$i18n.get('instruction_search') + ' ' + $i18n.get('collections')"
autocomplete="on"
v-model:value="searchQuery"
v-model="searchQuery"
@keyup.enter="searchCollections()"
icon-right="magnify"
icon-right-clickable
@ -263,14 +263,14 @@
id="collection-creation-options-dropdown"
aria-role="list"
trap-focus>
<button
class="button is-secondary"
slot="trigger">
<div>{{ $i18n.getFrom('collections', 'new_item') }}</div>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
<template #trigger>
<button class="button is-secondary">
<div>{{ $i18n.getFrom('collections', 'new_item') }}</div>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
</template>
<b-dropdown-item aria-role="listitem">
<router-link
:to="{ path: $routerHelper.getNewCollectionPath() }"
@ -330,8 +330,8 @@
horizontal
:label="$i18n.get('label_collections_per_page')">
<b-select
:value="collectionsPerPage"
@input="onChangeCollectionsPerPage"
:model-value="collectionsPerPage"
@update:model-value="onChangeCollectionsPerPage"
:disabled="collections.length <= 0">
<option value="12">12</option>
<option value="24">24</option>
@ -344,7 +344,7 @@
<b-pagination
@change="onPageChange"
:total="totalCollections"
v-model:current="page"
v-model="page"
order="is-centered"
size="is-small"
:per-page="collectionsPerPage"
@ -392,9 +392,7 @@ export default {
},
computed: {
collections() {
const ope = this.getCollections();
console.log(ope.length)
return ope;
return this.getCollections();
},
repositoryTotalCollections(){
return this.getRepositoryTotalCollections();
@ -537,7 +535,6 @@ export default {
.then((res) => {
this.isLoading = false;
this.totalCollections = res.total;
console.log(this.isLoading)
})
.catch(() => {
this.isLoading = false;

View File

@ -8,7 +8,7 @@
</template>
<div class="filters-list-page">
<b-loading v-model:active="isLoadingMetadatumTypes"/>
<b-loading v-model="isLoadingMetadatumTypes"/>
<div
v-if="(isRepositoryLevel && $userCaps.hasCapability('tnc_rep_edit_filters') || (!isRepositoryLevel && collection && collection.current_user_can_edit_filters))"
@ -25,7 +25,7 @@
<b-field class="header-item">
<b-input
:placeholder="$i18n.get('instruction_type_search_filter_filter')"
v-model:value="filterNameFilterString"
v-model="filterNameFilterString"
icon="magnify"
size="is-small"
icon-right="close-circle"
@ -49,176 +49,181 @@
</div>
</section>
<draggable
<sortable
:list="activeFiltersList"
item-key="id"
@update="handleChangeOnFilter"
@add="handleChangeOnFilter"
@remove="handleChangeOnFilter"
class="active-filters-area"
@change="handleChangeOnFilter"
:class="{'filters-area-receive': isDraggingFromAvailable}"
v-model:value="activeFiltersList"
:group="{ name:'filters', pull: false, put: true }"
:sort="(openedFilterId == '' || openedFilterId == undefined) && !isRepositoryLevel"
:handle="'.handle'"
ghost-class="sortable-ghost"
filter=".not-sortable-item"
:prevent-on-filter="false"
:animation="250">
<div
class="active-filter-item"
:class="{
'not-sortable-item': (isRepositoryLevel || isSelectingFilterType || filter.id == undefined || openedFilterId != '' || choosenMetadatum.name == filter.name || isUpdatingFiltersOrder == true || filterNameFilterString != ''),
'not-focusable-item': openedFilterId == filter.id,
'disabled-filter': filter.enabled == false,
'inherited-filter': filter.collection_id != collectionId || isRepositoryLevel
}"
v-for="(filter, index) in activeFiltersList"
:key="filter.id"
v-show="filterNameFilterString == '' || filter.name.toString().toLowerCase().indexOf(filterNameFilterString.toString().toLowerCase()) >= 0">
<div class="handle">
<span
v-if="!isRepositoryLevel"
class="sorting-buttons">
<button
:disabled="index == 0"
class="link-button"
@click="moveFilterUpViaButton(index)"
:aria-label="$i18n.get('label_move_up')">
<span class="icon">
<i class="tainacan-icon tainacan-icon-previous tainacan-icon-rotate-90" />
</span>
</button>
<button
:disabled="index == activeFiltersList.length - 1"
class="link-button"
@click="moveFilterDownViaButton(index)"
:aria-label="$i18n.get('label_move_down')">
<span class="icon">
<i class="tainacan-icon tainacan-icon-next tainacan-icon-rotate-90" />
</span>
</button>
</span>
<span
:style="{ opacity: !(isSelectingFilterType || filter.id == undefined || openedFilterId != '' || choosenMetadatum.name == filter.name || isUpdatingFiltersOrder == true || isRepositoryLevel || filterNameFilterString != '') ? '1.0' : '0.0' }"
v-tooltip="{
content: (isSelectingFilterType || filter.id == undefined || openedFilterId != '' || choosenMetadatum.name == filter.name || isUpdatingFiltersOrder == true) ? $i18n.get('info_not_allowed_change_order_filters') : $i18n.get('instruction_drag_and_drop_filter_sort'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'auto-start'
}"
class="icon grip-icon">
<svg
xmlns="http://www.w3.org/2000/svg"
height="24px"
viewBox="0 0 24 24"
width="24px"
fill="currentColor">
<path
d="M0 0h24v24H0V0z"
fill="transparent"/>
<path d="M11 18c0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2 2 .9 2 2zm-2-8c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm6 4c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/>
</svg>
</span>
<span
class="filter-name"
:class="{'is-danger': formWithErrors == filter.id }">
{{ filter.name }}
</span>
<span
v-if="filter.filter_type_object != undefined"
class="label-details">
({{ filter.filter_type_object.name }})
<!-- <em v-if="filter.inherited">{{ $i18n.get('label_inherited') }}</em> -->
<span
class="not-saved"
v-if="(editForms[filter.id] != undefined && editForms[filter.id].saved != true) ||filter.status == 'auto-draft'">
{{ $i18n.get('info_not_saved') }}
</span>
<span
v-if="filter.status == 'private'"
class="icon"
v-tooltip="{
content: $i18n.get('status_private'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'auto-start'
}">
<i class="tainacan-icon tainacan-icon-private"/>
</span>
<span
v-tooltip="{
content: filter.collection_id != collectionId ? $i18n.get('label_repository_filter') : $i18n.get('label_collection_filter'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'auto-start'
}"
class="icon icon-level-identifier">
<i
:class="{
'tainacan-icon-collection': filter.collection_id == collectionId,
'tainacan-icon-repository': filter.collection_id != collectionId,
'has-text-turquoise5': filter.enabled && filter.collection_id != 'default',
'has-text-blue5': filter.enabled && filter.collection_id == 'default',
'has-text-gray3': !filter.enabled
}"
class="tainacan-icon" />
</span>
</span>
<span
class="loading-spinner"
v-if="filter.id == undefined"/>
<span
class="controls"
v-if="filter.filter_type != undefined">
<b-switch
:class="{ 'filters-area-receive': isDraggingFromAvailable }"
:options="{
group: { name:'filters', pull: false, put: true },
sort: (openedFilterId == '' || openedFilterId == undefined) && !isRepositoryLevel,
handle: '.handle',
hostClass: 'sortable-ghost',
filter: '.not-sortable-item',
preventOnFilter: false,
animation: 250
}">
<template #item="{ element: filter, index }">
<div
class="active-filter-item"
:class="{
'not-sortable-item': (isRepositoryLevel || isSelectingFilterType || filter.id == undefined || openedFilterId != '' || choosenMetadatum.name == filter.name || isUpdatingFiltersOrder == true || filterNameFilterString != ''),
'not-focusable-item': openedFilterId == filter.id,
'disabled-filter': filter.enabled == false,
'inherited-filter': filter.collection_id != collectionId || isRepositoryLevel
}"
v-show="filterNameFilterString == '' || filter.name.toString().toLowerCase().indexOf(filterNameFilterString.toString().toLowerCase()) >= 0">
<div class="handle">
<span
v-if="!isRepositoryLevel"
:disabled="isUpdatingFiltersOrder"
size="is-small"
:value="filter.enabled"
@input="onChangeEnable($event, index)"/>
<a
v-if="filter.current_user_can_delete"
:style="{ visibility: filter.collection_id != collectionId && !isRepositoryLevel? 'hidden' : 'visible' }"
@click.prevent="toggleFilterEdition(filter.id)">
class="sorting-buttons">
<button
:disabled="index == 0"
class="link-button"
@click="moveFilterUpViaButton(index)"
:aria-label="$i18n.get('label_move_up')">
<span class="icon">
<i class="tainacan-icon tainacan-icon-previous tainacan-icon-rotate-90" />
</span>
</button>
<button
:disabled="index == activeFiltersList.length - 1"
class="link-button"
@click="moveFilterDownViaButton(index)"
:aria-label="$i18n.get('label_move_down')">
<span class="icon">
<i class="tainacan-icon tainacan-icon-next tainacan-icon-rotate-90" />
</span>
</button>
</span>
<span
:style="{ opacity: !(isSelectingFilterType || filter.id == undefined || openedFilterId != '' || choosenMetadatum.name == filter.name || isUpdatingFiltersOrder == true || isRepositoryLevel || filterNameFilterString != '') ? '1.0' : '0.0' }"
v-tooltip="{
content: (isSelectingFilterType || filter.id == undefined || openedFilterId != '' || choosenMetadatum.name == filter.name || isUpdatingFiltersOrder == true) ? $i18n.get('info_not_allowed_change_order_filters') : $i18n.get('instruction_drag_and_drop_filter_sort'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'auto-start'
}"
class="icon grip-icon">
<svg
xmlns="http://www.w3.org/2000/svg"
height="24px"
viewBox="0 0 24 24"
width="24px"
fill="currentColor">
<path
d="M0 0h24v24H0V0z"
fill="transparent"/>
<path d="M11 18c0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2 2 .9 2 2zm-2-8c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm6 4c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/>
</svg>
</span>
<span
class="filter-name"
:class="{'is-danger': formWithErrors == filter.id }">
{{ filter.name }}
</span>
<span
v-if="filter.filter_type_object != undefined"
class="label-details">
({{ filter.filter_type_object.name }})
<!-- <em v-if="filter.inherited">{{ $i18n.get('label_inherited') }}</em> -->
<span
class="not-saved"
v-if="(editForms[filter.id] != undefined && editForms[filter.id].saved != true) ||filter.status == 'auto-draft'">
{{ $i18n.get('info_not_saved') }}
</span>
<span
v-if="filter.status == 'private'"
class="icon"
v-tooltip="{
content: $i18n.get('status_private'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'auto-start'
}">
<i class="tainacan-icon tainacan-icon-private"/>
</span>
<span
v-tooltip="{
content: $i18n.get('edit'),
content: filter.collection_id != collectionId ? $i18n.get('label_repository_filter') : $i18n.get('label_collection_filter'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'bottom'
placement: 'auto-start'
}"
class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-edit"/>
</span>
</a>
<a
v-if="filter.current_user_can_delete"
:style="{ visibility: filter.collection_id != collectionId && !isRepositoryLevel ? 'hidden' : 'visible' }"
@click.prevent="removeFilter(filter)">
<span
v-tooltip="{
content: $i18n.get('delete'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'bottom'
class="icon icon-level-identifier">
<i
:class="{
'tainacan-icon-collection': filter.collection_id == collectionId,
'tainacan-icon-repository': filter.collection_id != collectionId,
'has-text-turquoise5': filter.enabled && filter.collection_id != 'default',
'has-text-blue5': filter.enabled && filter.collection_id == 'default',
'has-text-gray3': !filter.enabled
}"
class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-delete"/>
</span>
</a>
</span>
class="tainacan-icon" />
</span>
</span>
<span
class="loading-spinner"
v-if="filter.id == undefined"/>
<span
class="controls"
v-if="filter.filter_type != undefined">
<b-switch
v-if="!isRepositoryLevel"
:disabled="isUpdatingFiltersOrder"
size="is-small"
:model-value="filter.enabled"
@update:model-value="onChangeEnable($event, index)"/>
<a
v-if="filter.current_user_can_delete"
:style="{ visibility: filter.collection_id != collectionId && !isRepositoryLevel? 'hidden' : 'visible' }"
@click.prevent="toggleFilterEdition(filter.id)">
<span
v-tooltip="{
content: $i18n.get('edit'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'bottom'
}"
class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-edit"/>
</span>
</a>
<a
v-if="filter.current_user_can_delete"
:style="{ visibility: filter.collection_id != collectionId && !isRepositoryLevel ? 'hidden' : 'visible' }"
@click.prevent="removeFilter(filter)">
<span
v-tooltip="{
content: $i18n.get('delete'),
autoHide: true,
popperClass: ['tainacan-tooltip', 'tooltip', isRepositoryLevel ? 'tainacan-repository-tooltip' : ''],
placement: 'bottom'
}"
class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-delete"/>
</span>
</a>
</span>
</div>
<transition name="form-collapse">
<b-field v-if="openedFilterId == filter.id">
<filter-edition-form
@onEditionFinished="onEditionFinished()"
@onEditionCanceled="onEditionCanceled()"
@onErrorFound="formWithErrors = filter.id"
@onUpdateSavedState="(state) => editForms[filter.id].saved = state"
:index="index"
:original-filter="filter"
:edited-filter="editForms[openedFilterId]"/>
</b-field>
</transition>
</div>
<transition name="form-collapse">
<b-field v-if="openedFilterId == filter.id">
<filter-edition-form
@onEditionFinished="onEditionFinished()"
@onEditionCanceled="onEditionCanceled()"
@onErrorFound="formWithErrors = filter.id"
@onUpdateSavedState="(state) => editForms[filter.id].saved = state"
:index="index"
:original-filter="filter"
:edited-filter="editForms[openedFilterId]"/>
</b-field>
</transition>
</div>
</draggable>
</template>
</sortable>
</div>
<div
v-if="(isRepositoryLevel && $userCaps.hasCapability('tnc_rep_edit_filters') || !isRepositoryLevel)"
@ -231,7 +236,7 @@
<b-field class="header-item">
<b-input
:placeholder="$i18n.get('instruction_type_search_metadata_filter')"
v-model:value="metadatumNameFilterString"
v-model="metadatumNameFilterString"
icon="magnify"
size="is-small"
icon-right="close-circle"
@ -241,19 +246,24 @@
</template>
</div>
<div class="field" >
<draggable
@change="handleChangeOnMetadata"
<sortable
v-if="availableMetadata.length > 0 && !isLoadingMetadatumTypes"
v-model:value="availableMetadata"
:sort="false"
filter=".not-sortable-item"
:prevent-on-filter="false"
:group="{ name:'filters', pull: !isSelectingFilterType, put: false, revertClone: true }"
drag-class="sortable-drag">
<template
v-for="(metadatum, index) in availableMetadata"
:key="index">
:list="availableMetadata"
item-key="id"
@change="handleChangeOnMetadata"
:options="{
group: {
name:'filters',
pull: !isSelectingFilterType,
put: false, revertClone: true
},
sort: false,
filter: '.not-sortable-item',
preventOnFilter: false,
dragClass: 'sortable-drag'
}">
<template #item="{ element: metadatum, index }">
<div
class="available-metadatum-item"
:class="{
@ -317,7 +327,7 @@
</span>
</div>
</template>
</draggable>
</sortable>
<section
v-if="availableMetadata.length <= 0 && !isLoadingMetadatumTypes"
@ -361,11 +371,10 @@
</div>
</section>
<b-modal
ref="filterTypeModal"
:width="680"
v-model:active="isSelectingFilterType"
v-model="isSelectingFilterType"
trap-focus
aria-modal
aria-role="dialog"
@ -442,7 +451,7 @@
</section>
</div>
</b-modal>
</div>
</div>
</div>
</template>
@ -452,11 +461,13 @@ import { mapActions, mapGetters } from 'vuex';
import FilterEditionForm from '../../components/edition/filter-edition-form.vue';
import CustomDialog from '../../components/other/custom-dialog.vue';
import { Sortable } from "sortablejs-vue3";
export default {
name: 'FiltersPage',
components: {
FilterEditionForm
FilterEditionForm,
Sortable
},
beforeRouteLeave ( to, from, next ) {
let hasUnsavedForms = false;
@ -613,14 +624,26 @@ export default {
...mapGetters('collection', [
'getCollection',
]),
handleChangeOnFilter($event) {
if ($event.added) {
this.prepareFilterTypeSelection($event.added.element, $event.added.newIndex);
} else if ($event.removed) {
this.removeFilter($event.removed.element);
} else if ($event.moved) {
if (!this.isRepositoryLevel)
this.updateFiltersOrder();
handleChangeOnFilter($event) {
switch( $event.type ) {
case 'add':
this.prepareFilterTypeSelection(this.availableMetadata[$event.oldIndex], $event.newIndex);
break;
case 'remove':
this.removeFilter(this.activeFiltersList[$event.oldIndex]);
break;
case 'update': {
const newActiveFiltersList = JSON.parse(JSON.stringify(this.activeFiltersList));
const element = newActiveFiltersList.splice($event.oldIndex, 1)[0];
newActiveFiltersList.splice($event.newIndex, 0, element);
this.updateFilters(newActiveFiltersList);
if (!this.isRepositoryLevel)
this.updateFiltersOrder();
break;
}
}
},
prepareFilterTypeSelection(choosenMetadatum, newFilterIndex) {
@ -692,6 +715,7 @@ export default {
},
updateListOfMetadata() {
const availableMetadata = JSON.parse(JSON.stringify(this.getMetadata()));
const availableMetadataNames = {};
let lastParentName = '';
@ -1069,6 +1093,7 @@ export default {
.grip-icon {
color: var(--tainacan-gray3);
position: relative;
flex-shrink: 0;
}
.filter-name {
text-overflow: ellipsis;
@ -1207,6 +1232,7 @@ export default {
.grip-icon {
color: var(--tainacan-gray3);
position: relative;
flex-shrink: 0;
}
.icon-level-identifier {
position: relative;

View File

@ -26,7 +26,7 @@
</h3>
<!-- <b-loading
:is-full-page="false"
v-model:active="isLoadingMetadata"/> -->
v-model="isLoadingMetadata"/> -->
<!-- Button for hiding filters -->
<button
aria-controls="filters-modal"
@ -65,19 +65,20 @@
:mobile-modal="false"
:disabled="openAdvancedSearch"
:triggers="hasSearchByMoreThanOneWord ? ['click','contextmenu','focus'] : []">
<b-input
slot="trigger"
size="is-small"
:placeholder="$i18n.get('instruction_search')"
type="search"
:aria-label="$i18n.get('instruction_search') + ' ' + $i18n.get('items')"
:value="searchQuery"
@input="typeFutureSearch"
@keyup.enter="updateSearch()"
icon-right="magnify"
icon-right-clickable
@icon-right-click="updateSearch()"
:disabled="openAdvancedSearch" />
<template #trigger>
<b-input
size="is-small"
:placeholder="$i18n.get('instruction_search')"
type="search"
:aria-label="$i18n.get('instruction_search') + ' ' + $i18n.get('items')"
:model-value="searchQuery"
@update:model-value="typeFutureSearch"
@keyup.enter="updateSearch()"
icon-right="magnify"
icon-right-clickable
@icon-right-click="updateSearch()"
:disabled="openAdvancedSearch" />
</template>
<b-dropdown-item
@click="updateSearch()"
:focusable="false">
@ -88,10 +89,10 @@
custom
:focusable="false">
<b-checkbox
:value="sentenceMode"
:model-value="sentenceMode"
:true-value="false"
:false-value="true"
@input="$eventBusSearch.setSentenceMode($event)">
@update:model-value="$eventBusSearch.setSentenceMode($event)">
{{ $i18n.get('label_use_search_separated_words') }}
</b-checkbox>
<small class="is-small help">{{ $i18n.get('info_use_search_separated_words') }}</small>
@ -151,16 +152,15 @@
id="item-creation-options-dropdown"
aria-role="list"
trap-focus>
<button
class="button is-secondary"
slot="trigger">
<span class="is-hidden-touch">{{ $i18n.getFrom('items','add_new') }}</span>
<span class="is-hidden-desktop">{{ $i18n.get('add') }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
<template #trigger>
<button class="button is-secondary">
<span class="is-hidden-touch">{{ $i18n.getFrom('items','add_new') }}</span>
<span class="is-hidden-desktop">{{ $i18n.get('add') }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
</template>
<b-dropdown-item
v-if="!isRepositoryLevel"
aria-role="listitem">
@ -237,16 +237,17 @@
class="show metadata-options-dropdown"
aria-role="list"
trap-focus>
<button
:aria-label="$i18n.get('label_displayed_metadata')"
class="button is-white"
slot="trigger">
<span class="is-hidden-touch is-hidden-desktop-only">{{ $i18n.get('label_displayed_metadata') }}</span>
<span class="is-hidden-widescreen">{{ $i18n.get('metadata') }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
<template #trigger>
<button
:aria-label="$i18n.get('label_displayed_metadata')"
class="button is-white">
<span class="is-hidden-touch is-hidden-desktop-only">{{ $i18n.get('label_displayed_metadata') }}</span>
<span class="is-hidden-widescreen">{{ $i18n.get('metadata') }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
</template>
<div class="metadata-options-container">
<b-dropdown-item
v-for="(column, index) in localDisplayedMetadata"
@ -255,7 +256,7 @@
custom
aria-role="listitem">
<b-checkbox
v-model:value="column.display"
v-model="column.display"
:native-value="column.display">
{{ column.name }}
</b-checkbox>
@ -278,28 +279,29 @@
<label class="label">{{ $i18n.get('label_sort') }}&nbsp;</label>
<b-dropdown
:mobile-modal="true"
@input="onChangeOrder"
@update:model-value="onChangeOrder"
aria-role="list"
trap-focus>
<button
:aria-label="$i18n.get('label_sorting_direction')"
class="button is-white"
slot="trigger"
style="padding-right: 3px !important;">
<span class="icon is-small gray-icon">
<i
:class="order == 'DESC' ? 'tainacan-icon-sortdescending' : 'tainacan-icon-sortascending'"
class="tainacan-icon"/>
</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
<template #trigger>
<button
:aria-label="$i18n.get('label_sorting_direction')"
class="button is-white"
style="padding-right: 3px !important;">
<span class="icon is-small gray-icon">
<i
:class="order == 'DESC' ? 'tainacan-icon-sortdescending' : 'tainacan-icon-sortascending'"
class="tainacan-icon"/>
</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
</template>
<b-dropdown-item
aria-controls="items-list-results"
role="button"
:class="{ 'is-active': order == 'DESC' }"
:value="'DESC'"
:model-value="'DESC'"
aria-role="listitem">
<span class="icon gray-icon">
<i class="tainacan-icon tainacan-icon-18px tainacan-icon-sortdescending"/>
@ -310,7 +312,7 @@
aria-controls="items-list-results"
role="button"
:class="{ 'is-active': order == 'ASC' }"
:value="'ASC'"
:model-value="'ASC'"
aria-role="listitem">
<span class="icon gray-icon">
<i class="tainacan-icon tainacan-icon-18px tainacan-icon-sortascending"/>
@ -325,18 +327,19 @@
</span>
<b-dropdown
:mobile-modal="true"
@input="onChangeOrderBy($event)"
@update:model-value="onChangeOrderBy($event)"
aria-role="list"
trap-focus>
<button
:aria-label="$i18n.get('label_sorting')"
class="button is-white"
slot="trigger">
<span>{{ orderByName }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
<template #trigger>
<button
:aria-label="$i18n.get('label_sorting')"
class="button is-white">
<span>{{ orderByName }}</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
</template>
<template
v-for="metadatum of sortingMetadata"
:key="metadatum.slug">
@ -373,33 +376,34 @@
:aria-label="$i18n.get('label_view_mode')"
aria-role="list"
trap-focus>
<button
:aria-label="$i18n.get('label_view_mode')"
class="button is-white"
slot="trigger">
<span class="view-mode-icon icon is-small gray-icon">
<i
v-if="adminViewMode !== 'map'"
:class="{'tainacan-icon-viewtable' : ( adminViewMode == 'table' || adminViewMode == undefined),
'tainacan-icon-viewcards' : adminViewMode == 'cards',
'tainacan-icon-viewminiature' : adminViewMode == 'grid',
'tainacan-icon-viewrecords' : adminViewMode == 'records',
'tainacan-icon-viewlist' : adminViewMode == 'list',
'tainacan-icon-viewmasonry' : adminViewMode == 'masonry' }"
class="tainacan-icon tainacan-icon-1-25em"/>
<svg
v-else
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
style="fill: var(--tainacan-info-color)">
<path d="M15,19L9,16.89V5L15,7.11M20.5,3C20.44,3 20.39,3 20.34,3L15,5.1L9,3L3.36,4.9C3.15,4.97 3,5.15 3,5.38V20.5A0.5,0.5 0 0,0 3.5,21C3.55,21 3.61,21 3.66,20.97L9,18.9L15,21L20.64,19.1C20.85,19 21,18.85 21,18.62V3.5A0.5,0.5 0 0,0 20.5,3Z" />
</svg>
</span>
&nbsp;&nbsp;&nbsp;{{ adminViewMode != undefined ? $i18n.get('label_' + adminViewMode) : $i18n.get('label_table') }}
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
<template #trigger>
<button
:aria-label="$i18n.get('label_view_mode')"
class="button is-white">
<span class="view-mode-icon icon is-small gray-icon">
<i
v-if="adminViewMode !== 'map'"
:class="{'tainacan-icon-viewtable' : ( adminViewMode == 'table' || adminViewMode == undefined),
'tainacan-icon-viewcards' : adminViewMode == 'cards',
'tainacan-icon-viewminiature' : adminViewMode == 'grid',
'tainacan-icon-viewrecords' : adminViewMode == 'records',
'tainacan-icon-viewlist' : adminViewMode == 'list',
'tainacan-icon-viewmasonry' : adminViewMode == 'masonry' }"
class="tainacan-icon tainacan-icon-1-25em"/>
<svg
v-else
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
style="fill: var(--tainacan-info-color)">
<path d="M15,19L9,16.89V5L15,7.11M20.5,3C20.44,3 20.39,3 20.34,3L15,5.1L9,3L3.36,4.9C3.15,4.97 3,5.15 3,5.38V20.5A0.5,0.5 0 0,0 3.5,21C3.55,21 3.61,21 3.66,20.97L9,18.9L15,21L20.64,19.1C20.85,19 21,18.85 21,18.62V3.5A0.5,0.5 0 0,0 20.5,3Z" />
</svg>
</span>
&nbsp;&nbsp;&nbsp;{{ adminViewMode != undefined ? $i18n.get('label_' + adminViewMode) : $i18n.get('label_table') }}
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
</template>
<b-dropdown-item
aria-controls="items-list-results"
role="button"
@ -513,7 +517,7 @@
role="region"
id="filters-modal"
ref="filters-modal"
v-model:active="isFiltersModalActive"
v-model="isFiltersModalActive"
:width="736"
animation="slide-menu"
trap-focus
@ -587,7 +591,7 @@
<b-loading
v-if="!(registeredViewModes[viewMode] != undefined && registeredViewModes[viewMode].skeleton_template != undefined)"
:is-full-page="false"
:active="showLoading"/>
:model-value="showLoading"/>
<!-- Custom skeleton templates used by some view modes -->
<div
@ -685,10 +689,10 @@
</template>
<br>
<b-checkbox
:value="sentenceMode"
:model-value="sentenceMode"
:true-value="false"
:false-value="true"
@input="$eventBusSearch.setSentenceMode($event); updateSearch();">
@update:model-value="$eventBusSearch.setSentenceMode($event); updateSearch();">
{{ $i18n.get('label_use_search_separated_words') }}
</b-checkbox>
</p>
@ -816,6 +820,152 @@
}
},
watch: {
'$route': {
handler(to, from) {
// Should set Collection ID from URL only when in admin.
if (this.$route.name == 'CollectionItemsPage' || this.$route.name == 'ItemsPage')
this.$eventBusSearch.setCollectionId( !this.$route.params.collectionId ? this.$route.params.collectionId : parseInt(this.$route.params.collectionId) );
// Fills the URL with appropriate default values in case a query is not passed
if (this.$route.name == null || this.$route.name == undefined || this.$route.name == 'CollectionItemsPage' || this.$route.name == 'ItemsPage') {
// Items Per Page
if (this.$route.query.perpage == undefined || to.params.collectionId != from.params.collectionId) {
let perPageKey = (this.collectionId != undefined ? 'items_per_page_' + this.collectionId : 'items_per_page');
let perPageValue = this.$userPrefs.get(perPageKey);
if (perPageValue)
this.$route.query.perpage = perPageValue;
else {
this.$route.query.perpage = 12;
this.$userPrefs.set(perPageKey, 12);
}
}
// Page
if (this.$route.query.paged == undefined || to.params.collectionId != from.params.collectionId)
this.$route.query.paged = 1;
// Order (ASC, DESC)
if (this.$route.query.order == undefined || to.params.collectionId != from.params.collectionId) {
let orderKey = (this.collectionId != undefined ? 'order_' + this.collectionId : 'order');
let orderValue = this.$userPrefs.get(orderKey) ? this.$userPrefs.get(orderKey) : this.defaultOrder;
if (orderValue)
this.$route.query.order = orderValue;
else {
this.$route.query.order = 'DESC';
this.$userPrefs.set(orderKey, 'DESC');
}
}
// Order By (required extra work to deal with custom metadata ordering)
if (this.$route.query.orderby == undefined || (to.params.collectionId != from.params.collectionId)) {
let orderByKey = (this.collectionId != undefined ? 'order_by_' + this.collectionId : 'order_by');
let orderBy = this.$userPrefs.get(orderByKey) ? this.$userPrefs.get(orderByKey) : this.defaultOrderBy;
if (orderBy && orderBy != 'name') {
// Previously was stored as a metadata object, now it is a orderby object
if (orderBy.slug || typeof orderBy == 'string')
orderBy = this.$orderByHelper.getOrderByForMetadatum(orderBy);
if (orderBy.orderby)
Object.keys(orderBy).forEach((paramKey) => {
this.$route.query[paramKey] = orderBy[paramKey];
});
else
this.$route.query.orderby = 'date'
} else {
this.$route.query.orderby = 'date';
this.$userPrefs.set(orderByKey, {
slug: 'creation_date',
name: this.$i18n.get('label_creation_date')
}).catch(() => { });
}
} else if ( this.$route.query.orderby == 'creation_date' ) { // Fixes old usage of creation_date
this.$route.query.orderby = 'date'
}
// Theme View Modes
if ((this.$route.name == null || this.$route.name == undefined ) &&
this.$route.name != 'CollectionItemsPage' && this.$route.name != 'ItemsPage' &&
(this.$route.query.view_mode == undefined || to.params.collectionId != from.params.collectionId)
) {
let viewModeKey = (this.collectionId != undefined ? 'view_mode_' + this.collectionId : 'view_mode');
let viewModeValue = this.$userPrefs.get(viewModeKey);
if (viewModeValue)
this.$route.query.view_mode = viewModeValue;
else {
this.$route.query.view_mode = 'table';
this.$userPrefs.set(viewModeKey, 'table');
}
}
// Emit slideshow-from to start this view mode from index
if (this.$route.query.view_mode != 'slideshow' && this.$route.query['slideshow-from'] !== null && this.$route.query['slideshow-from'] !== undefined && this.$route.query['slideshow-from'] !== false)
this.$eventBusSearchEmitter.emit('startSlideshowFromItem', this.$route.query['slideshow-from']);
// Admin View Modes
if (this.$route.name != null && this.$route.name != undefined &&
(this.$route.name == 'CollectionItemsPage' || this.$route.name == 'ItemsPage') &&
(this.$route.query.admin_view_mode == undefined || to.params.collectionId != from.params.collectionId)
) {
let adminViewModeKey = (this.collectionId != undefined ? 'admin_view_mode_' + this.collectionId : 'admin_view_mode');
let adminViewModeValue = this.$userPrefs.get(adminViewModeKey);
if (adminViewModeValue)
this.$route.query.admin_view_mode = adminViewModeValue;
else {
this.$route.query.admin_view_mode = 'table';
this.$userPrefs.set(adminViewModeKey, 'table');
}
}
// Advanced Search
if (this.$route.query && this.$route.query.advancedSearch){
this.$store.dispatch('search/set_advanced_query', this.$route.query);
} else {
this.$store.dispatch('search/set_postquery', this.$route.query);
}
// Checks current metaqueries and taxqueries to alert filters that should reload
// For some reason, this process is not working accessing to.query, so we need to check the path string.
const oldQueryString = from.fullPath.replace(from.path + '?', '');
const newQueryString = to.fullPath.replace(from.path + '?', '');
const oldQueryArray = oldQueryString.split('&');
const newQueryArray = newQueryString.split('&');
const oldMetaQueryArray = oldQueryArray.filter(queryItem => queryItem.startsWith('metaquery'));
const newMetaQueryArray = newQueryArray.filter(queryItem => queryItem.startsWith('metaquery'));
const oldTaxQueryArray = oldQueryArray.filter(queryItem => queryItem.startsWith('taxquery'));
const newTaxQueryArray = newQueryArray.filter(queryItem => queryItem.startsWith('taxquery'));
const oldStatusArray = oldQueryArray.filter(queryItem => queryItem.startsWith('status'));
const newStatusArray = newQueryArray.filter(queryItem => queryItem.startsWith('status'));
const oldSearchQuery = oldQueryArray.filter(queryItem => queryItem.startsWith('search'));
const newSearchQuery = newQueryArray.filter(queryItem => queryItem.startsWith('search'));
if (
JSON.stringify(oldMetaQueryArray) != JSON.stringify(newMetaQueryArray) ||
JSON.stringify(oldTaxQueryArray) != JSON.stringify(newTaxQueryArray) ||
JSON.stringify(oldStatusArray) != JSON.stringify(newStatusArray) ||
JSON.stringify(oldSearchQuery) != JSON.stringify(newSearchQuery)
) {
this.$eventBusSearchEmitter.emit('hasToReloadFacets', true);
}
// Finally, loads items
if (to.fullPath != from.fullPath)
this.$eventBusSearch.loadItems();
}
},
deep: true
},
displayedMetadata: {
handler() {
this.localDisplayedMetadata = JSON.parse(JSON.stringify(this.displayedMetadata));
@ -824,7 +974,7 @@
},
openAdvancedSearch(newValue) {
if (newValue == false){
this.$eventBusSearch.$emit('closeAdvancedSearch');
this.$eventBusSearchEmitter.emit('closeAdvancedSearch');
this.futureSearchQuery = '';
this.isFiltersModalActive = true;
} else {
@ -851,7 +1001,7 @@
this.$eventBusSearch.setCollectionId(this.collectionId);
this.$eventBusSearch.updateStoreFromURL();
this.$eventBusSearch.$emitter.on('isLoadingItems', isLoadingItems => {
this.$eventBusSearchEmitter.on('isLoadingItems', isLoadingItems => {
if (isLoadingItems != this.isLoadingItems && this.$refs['items-page-container'] && this.$refs['search-control']) {
@ -864,7 +1014,7 @@
this.isLoadingItems = isLoadingItems;
});
this.$eventBusSearch.$emitter.on('hasFiltered', hasFiltered => {
this.$eventBusSearchEmitter.on('hasFiltered', hasFiltered => {
this.hasFiltered = hasFiltered;
});
@ -1402,8 +1552,8 @@
// $root
this.$root.$emitter.off('openAdvancedSearch');
// $eventBusSearch
this.$eventBusSearch.$emitter.off('isLoadingItems');
this.$eventBusSearch.$emitter.off('hasFiltered');
this.$eventBusSearchEmitter.off('isLoadingItems');
this.$eventBusSearchEmitter.off('hasFiltered');
}
}
}

View File

@ -13,7 +13,7 @@
<div class="metadata-list-page">
<b-tabs
v-if="(isRepositoryLevel && $userCaps.hasCapability('tnc_rep_edit_metadata') || (!isRepositoryLevel && collection && collection.current_user_can_edit_metadata))"
v-model:value="activeTab">
v-model="activeTab">
<b-tab-item :label="isRepositoryLevel ? repositoryTabLabel : collectionTabLabel">
<div class="columns">
@ -326,6 +326,7 @@ export default {
.grip-icon {
color: var(--tainacan-gray3);
position: relative;
flex-shrink: 0;
}
.metadatum-name {
white-space: nowrap;

View File

@ -31,24 +31,25 @@
<b-dropdown
:mobile-modal="true"
:disabled="taxonomies.length <= 0 || isLoading"
@input="onChangeOrder"
@update:model-value="onChangeOrder"
aria-role="list"
trap-focus>
<button
:aria-label="$i18n.get('label_sorting_direction')"
class="button is-white"
slot="trigger">
<span
style="margin-top: -2px;"
class="icon is-small gray-icon">
<i
:class="order == 'desc' ? 'tainacan-icon-sortdescending' : 'tainacan-icon-sortascending'"
class="tainacan-icon tainacan-icon-1-125em"/>
</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
<template #trigger>
<button
:aria-label="$i18n.get('label_sorting_direction')"
class="button is-white">
<span
style="margin-top: -2px;"
class="icon is-small gray-icon">
<i
:class="order == 'desc' ? 'tainacan-icon-sortdescending' : 'tainacan-icon-sortascending'"
class="tainacan-icon tainacan-icon-1-125em"/>
</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
</template>
<b-dropdown-item
aria-controls="items-list-results"
role="button"
@ -82,8 +83,8 @@
<b-select
class="sorting-select"
:disabled="taxonomies.length <= 0"
@input="onChangeOrderBy($event)"
:value="orderBy"
@update:model-value="onChangeOrderBy($event)"
:model-value="orderBy"
:label="$i18n.get('label_sorting')">
<option
v-for="(option, index) in sortingOptions"
@ -102,7 +103,7 @@
size="is-small"
:aria-label="$i18n.get('instruction_search') + ' ' + $i18n.get('taxonomies')"
autocomplete="on"
v-model:value="searchQuery"
v-model="searchQuery"
@keyup.enter="searchTaxonomies()"
icon-right="magnify"
icon-right-clickable
@ -113,7 +114,7 @@
<div class="above-subheader">
<b-loading
:is-full-page="true"
v-model:active="isLoading"
v-model="isLoading"
:can-cancel="false"/>
<div class="tabs">
<ul>
@ -215,8 +216,8 @@
horizontal
:label="$i18n.get('label_taxonomies_per_page')">
<b-select
:value="taxonomiesPerPage"
@input="onChangePerPage"
:model-value="taxonomiesPerPage"
@update:model-value="onChangePerPage"
:disabled="taxonomies.length <= 0">
<option value="12">12</option>
<option value="24">24</option>
@ -229,7 +230,7 @@
<b-pagination
@change="onPageChange"
:total="total"
v-model:current="page"
v-model="page"
order="is-centered"
size="is-small"
:per-page="taxonomiesPerPage"

View File

@ -62,7 +62,6 @@ export default {
},
created() {
this.collectionId = this.$route.params.collectionId;
console.log(this.$eventBusSearch)
this.$eventBusSearch.setCollectionId(this.collectionId);
// Loads to store basic collection info such as name, url, current_user_can_edit... etc.

View File

@ -1,7 +1,7 @@
<template>
<div>
<b-loading
v-model:active="isLoading"
v-model="isLoading"
:can-cancel="false"/>
<tainacan-title
@ -262,7 +262,7 @@
<div
v-if="!$adminOptions.hideItemSingleAttachments"
class="section-label">
<label slot="header">
<label>
<span class="icon has-text-gray4">
<i class="tainacan-icon tainacan-icon-1-125em tainacan-icon-attachments"/>
</span>
@ -274,7 +274,7 @@
({{ totalAttachments }})
</span>
</span>
</label>
</label>
</div>
<div
v-if="item != undefined && item.id != undefined && !isLoading && !$adminOptions.hideItemSingleAttachments"

View File

@ -101,7 +101,6 @@
<button
class="swiper-button-prev"
:id="blockId + '-prev'"
slot="button-prev"
:style="hideName ? 'top: calc(50% - 21px)' : 'top: calc(50% - ' + (largeArrows ? '60' : '42') + 'px)'">
<svg
:width="largeArrows ? 60 : 42"
@ -121,7 +120,6 @@
<button
class="swiper-button-next"
:id="blockId + '-next'"
slot="button-next"
:style="hideName ? 'top: calc(50% - 21px)' : 'top: calc(50% - ' + (largeArrows ? '60' : '42') + 'px)'">
<svg
:width="largeArrows ? 60 : 42"

Some files were not shown because too many files have changed in this diff Show More