Removes instances of v-for and v-if in the same tag. First step towards #794.

This commit is contained in:
mateuswetah 2023-07-10 10:34:38 -03:00
parent 0ef39e2c35
commit f125790799
22 changed files with 721 additions and 642 deletions

View File

@ -22,8 +22,6 @@ module.exports = {
'vue/singleline-html-element-content-newline': 'off', 'vue/singleline-html-element-content-newline': 'off',
'vue/multiline-html-element-content-newline': 'off', 'vue/multiline-html-element-content-newline': 'off',
'vue/prop-name-casing': 'off', 'vue/prop-name-casing': 'off',
'vue/no-confusing-v-for-v-if': 'off',
'vue/no-use-v-if-with-v-for': 'warn',
'vue/multi-word-component-names': 'off', 'vue/multi-word-component-names': 'off',
'vue/require-default-prop': 'off', 'vue/require-default-prop': 'off',
'vue/no-v-text-v-html-on-component': 'off' 'vue/no-v-text-v-html-on-component': 'off'

View File

@ -18,16 +18,17 @@
<div <div
role="list" role="list"
class="exporter-types-container"> class="exporter-types-container">
<template v-for="exporterType in availableExporters">
<div <div
role="listitem" role="listitem"
class="exporter-type" class="exporter-type"
v-for="exporterType in availableExporters"
:key="exporterType.slug" :key="exporterType.slug"
v-if="!(hideWhenManualCollection && !exporterType.manual_collection)" v-if="!(hideWhenManualCollection && !exporterType.manual_collection)"
@click="onSelectExporter(exporterType)"> @click="onSelectExporter(exporterType)">
<h4>{{ exporterType.name }}</h4> <h4>{{ exporterType.name }}</h4>
<p>{{ exporterType.description }}</p> <p>{{ exporterType.description }}</p>
</div> </div>
</template>
</div> </div>
<footer class="field is-grouped form-submit"> <footer class="field is-grouped form-submit">
<div class="control"> <div class="control">

View File

@ -7,9 +7,7 @@
tabindex="-1" tabindex="-1"
aria-modal aria-modal
ref="availableImportersModal"> ref="availableImportersModal">
<div <div style="width: auto">
class="tainacan-modal-content"
style="width: auto">
<header class="tainacan-modal-title"> <header class="tainacan-modal-title">
<h2>{{ $i18n.get('importers') }}</h2> <h2>{{ $i18n.get('importers') }}</h2>
<hr> <hr>
@ -19,16 +17,17 @@
<div <div
role="list" role="list"
class="importer-types-container"> class="importer-types-container">
<template v-for="importerType in availableImporters">
<div <div
role="listitem" role="listitem"
class="importer-type" class="importer-type"
v-for="importerType in availableImporters"
:key="importerType.slug" :key="importerType.slug"
v-if="!(hideWhenManualCollection && !importerType.manual_collection)" v-if="!(hideWhenManualCollection && !importerType.manual_collection)"
@click="onSelectImporter(importerType)"> @click="onSelectImporter(importerType)">
<h4>{{ importerType.name }}</h4> <h4>{{ importerType.name }}</h4>
<p>{{ importerType.description }}</p> <p>{{ importerType.description }}</p>
</div> </div>
</template>
<b-loading <b-loading
:is-full-page="false" :is-full-page="false"

View File

@ -42,13 +42,14 @@
v-if="metadatum.id && metadatum.metadata_type_object.component === 'tainacan-compound' && metadatum.multiple !== 'yes'" v-if="metadatum.id && metadatum.metadata_type_object.component === 'tainacan-compound' && metadatum.multiple !== 'yes'"
:key="index" :key="index"
:label="metadatum.name"> :label="metadatum.name">
<template v-for="(childMetadatum, childIndex) of metadatum.metadata_type_options.children_objects">
<option <option
v-for="(childMetadatum, childIndex) of metadatum.metadata_type_options.children_objects"
:key="childIndex" :key="childIndex"
v-if="childMetadatum.id" v-if="childMetadatum.id"
:value="childMetadatum"> :value="childMetadatum">
{{ childMetadatum.name }} {{ childMetadatum.name }}
</option> </option>
</template>
</optgroup> </optgroup>
</template> </template>
<option :value="{ id: 'status' }"> <option :value="{ id: 'status' }">
@ -172,13 +173,14 @@
v-if="metadatumForCopy.id && metadatumForCopy.metadata_type_object.component === 'tainacan-compound'" v-if="metadatumForCopy.id && metadatumForCopy.metadata_type_object.component === 'tainacan-compound'"
:key="index" :key="index"
:label="metadatumForCopy.name"> :label="metadatumForCopy.name">
<template v-for="(childmetadatumForCopy, childIndex) of metadatumForCopy.metadata_type_options.children_objects">
<option <option
v-for="(childmetadatumForCopy, childIndex) of metadatumForCopy.metadata_type_options.children_objects"
:key="childIndex" :key="childIndex"
v-if="childMetadatumForCopy.id" v-if="childMetadatumForCopy.id"
:value="childMetadatumForCopy.id"> :value="childMetadatumForCopy.id">
{{ childMetadatumForCopy.name }} {{ childMetadatumForCopy.name }}
</option> </option>
</template>
</optgroup> </optgroup>
</template> </template>
<option <option

View File

@ -16,15 +16,16 @@
<p>{{ $i18n.get('info_associated_roles') }}</p> <p>{{ $i18n.get('info_associated_roles') }}</p>
<br> <br>
<div class="roles-list"> <div class="roles-list">
<template v-for="(role, roleIndex) of existingRoles">
<b-checkbox <b-checkbox
v-if="!capability.roles_inherited[role.slug]" v-if="!capability.roles_inherited[role.slug]"
v-for="(role, roleIndex) of existingRoles"
:key="roleIndex" :key="roleIndex"
:value="capability.roles[role.slug] || capability.roles_inherited[role.slug] ? true : false" :value="capability.roles[role.slug] || capability.roles_inherited[role.slug] ? true : false"
@input="($event) => updateRole(role.slug, $event)" @input="($event) => updateRole(role.slug, $event)"
name="roles"> name="roles">
{{ role.name }} {{ role.name }}
</b-checkbox> </b-checkbox>
</template>
</div> </div>
</b-field> </b-field>
</template> </template>
@ -48,9 +49,9 @@
</label> </label>
<br> <br>
<div class="roles-list"> <div class="roles-list">
<template v-for="(role, roleIndex) of existingRoles">
<b-checkbox <b-checkbox
v-if="capability.roles_inherited[role.slug]" v-if="capability.roles_inherited[role.slug]"
v-for="(role, roleIndex) of existingRoles"
:key="roleIndex" :key="roleIndex"
class="has-text-yellow2" class="has-text-yellow2"
:value="capability.roles[role.slug] || capability.roles_inherited[role.slug] ? true : false" :value="capability.roles[role.slug] || capability.roles_inherited[role.slug] ? true : false"
@ -58,6 +59,7 @@
disabled> disabled>
{{ role.name }} {{ role.name }}
</b-checkbox> </b-checkbox>
</template>
</div> </div>
</b-field> </b-field>
</template> </template>

View File

@ -59,16 +59,17 @@
v-if="selectedEstrategy == 'mappers'" v-if="selectedEstrategy == 'mappers'"
class="collection-creation-options-container" class="collection-creation-options-container"
role="list"> role="list">
<template v-for="metadatumMapper in metadatumMappers">
<button <button
class="collection-creation-option" class="collection-creation-option"
@click="$router.push($routerHelper.getNewMappedCollectionPath(metadatumMapper.slug)); $parent.close();" @click="$router.push($routerHelper.getNewMappedCollectionPath(metadatumMapper.slug)); $parent.close();"
:key="metadatumMapper.slug" :key="metadatumMapper.slug"
v-for="metadatumMapper in metadatumMappers"
v-if="metadatumMapper.metadata != false" v-if="metadatumMapper.metadata != false"
aria-role="listitem"> aria-role="listitem">
<h3>{{ metadatumMapper.name }}</h3> <h3>{{ metadatumMapper.name }}</h3>
<p>{{ metadatumMapper.description }}</p> <p>{{ metadatumMapper.description }}</p>
</button> </button>
</template>
</div> </div>
<div <div

View File

@ -19,15 +19,16 @@
<div <div
v-if="!isLoading" v-if="!isLoading"
class="collection-types-container"> class="collection-types-container">
<template v-for="(collection, index) in collections">
<div <div
class="collection-type" class="collection-type"
v-for="(collection, index) in collections"
:key="index" :key="index"
v-if="collection && collection.current_user_can_edit_items" v-if="collection && collection.current_user_can_edit_items"
@click="onSelectCollection(collection)"> @click="onSelectCollection(collection)">
<h4>{{ collection.name }}</h4> <h4>{{ collection.name }}</h4>
<p>{{ collection.description.length > 200 ? (collection.description.substring(0,197) + '...') : collection.description }}</p> <p>{{ collection.description.length > 200 ? (collection.description.substring(0,197) + '...') : collection.description }}</p>
</div> </div>
</template>
<div <div
v-if="collections.length <= 0" v-if="collections.length <= 0"
class="block"> class="block">

View File

@ -18,8 +18,8 @@
</span> </span>
</a> </a>
</li> </li>
<template v-for="(statusOption, index) of $statusHelper.getStatuses()">
<li <li
v-for="(statusOption, index) of $statusHelper.getStatuses()"
v-if="(isRepositoryLevel || statusOption.slug != 'private') || (statusOption.slug == 'private' && collection && collection.current_user_can_read_private_items)" v-if="(isRepositoryLevel || statusOption.slug != 'private') || (statusOption.slug == 'private' && collection && collection.current_user_can_read_private_items)"
:key="index" :key="index"
@click="onChangeTab(statusOption.slug)" @click="onChangeTab(statusOption.slug)"
@ -48,6 +48,7 @@
</span> </span>
</a> </a>
</li> </li>
</template>
</ul> </ul>
</div> </div>
</template> </template>

View File

@ -49,10 +49,10 @@
<!-- TAXONOMY TERM ITEMS FILTERS --> <!-- TAXONOMY TERM ITEMS FILTERS -->
<template v-if="taxonomy && taxonomyFilters"> <template v-if="taxonomy && taxonomyFilters">
<template v-for="(taxonomyFilter, key, index) of taxonomyFilters">
<div <div
v-if="key == 'repository-filters'" v-if="key == 'repository-filters'"
:key="index" :key="index">
v-for="(taxonomyFilter, key, index) of taxonomyFilters">
<div <div
v-tooltip="{ v-tooltip="{
delay: { delay: {
@ -98,10 +98,11 @@
</p> --> </p> -->
<hr v-if="taxonomyFilter.length > 1"> <hr v-if="taxonomyFilter.length > 1">
</div> </div>
</template>
<template v-for="(taxonomyFilter, key, index) of taxonomyFilters">
<div <div
v-if="key != 'repository-filters'" v-if="key != 'repository-filters'"
:key="index" :key="index">
v-for="(taxonomyFilter, key, index) of taxonomyFilters">
<div <div
v-tooltip="{ v-tooltip="{
delay: { delay: {
@ -148,13 +149,14 @@
<hr v-if="taxonomyFilter.length > 1"> <hr v-if="taxonomyFilter.length > 1">
</div> </div>
</template> </template>
</template>
<!-- REPOSITORY ITEMS FILTERS --> <!-- REPOSITORY ITEMS FILTERS -->
<template v-else-if="isRepositoryLevel && !taxonomy"> <template v-else-if="isRepositoryLevel && !taxonomy">
<template v-for="(repositoryCollectionFilter, key, index) of repositoryCollectionFilters">
<div <div
v-if="key == 'repository-filters'" v-if="key == 'repository-filters'"
:key="index" :key="index">
v-for="(repositoryCollectionFilter, key, index) of repositoryCollectionFilters">
<div <div
v-tooltip="{ v-tooltip="{
delay: { delay: {
@ -200,10 +202,11 @@
</p> --> </p> -->
<hr v-if="repositoryCollectionFilters.length > 1"> <hr v-if="repositoryCollectionFilters.length > 1">
</div> </div>
</template>
<template v-for="(repositoryCollectionFilter, key, index) of repositoryCollectionFilters">
<div <div
v-if="key != 'repository-filters'" v-if="key != 'repository-filters'"
:key="index" :key="index">
v-for="(repositoryCollectionFilter, key, index) of repositoryCollectionFilters">
<div <div
v-tooltip="{ v-tooltip="{
delay: { delay: {
@ -250,6 +253,7 @@
<hr v-if="repositoryCollectionFilters.length > 1"> <hr v-if="repositoryCollectionFilters.length > 1">
</div> </div>
</template> </template>
</template>
<!-- COLLECTION ITEMS FILTERS --> <!-- COLLECTION ITEMS FILTERS -->
<template v-else> <template v-else>

View File

@ -42,13 +42,14 @@
aria-controls="items-list-results" aria-controls="items-list-results"
aria-labelledby="items-per-page-select" aria-labelledby="items-per-page-select"
@input="onChangeItemsPerPage"> @input="onChangeItemsPerPage">
<template v-for="(itemsPerPageOption, index) of itemsPerPageOptions">
<option <option
v-for="(itemsPerPageOption, index) of itemsPerPageOptions"
:key="index" :key="index"
v-if="maxItemsPerPage >= 12" v-if="maxItemsPerPage >= 12"
:value="itemsPerPageOption"> :value="itemsPerPageOption">
{{ itemsPerPageOption }} &nbsp; {{ itemsPerPageOption }} &nbsp;
</option> </option>
</template>
</b-select> </b-select>
</b-field> </b-field>
</div> </div>

View File

@ -205,9 +205,8 @@
</a> </a>
</li> </li>
<li <li
v-for="(statusOption, index) of $statusHelper.getStatuses().filter((status) => status.slug != 'draft')" v-for="(statusOption, index) of statusOptionsForCollections"
:key="index" :key="index"
v-if="statusOption.slug != 'private' || (statusOption.slug == 'private' && $userCaps.hasCapability('tnc_rep_read_private_collections'))"
@click="onChangeTab(statusOption.slug)" @click="onChangeTab(statusOption.slug)"
:class="{ 'is-active': status == statusOption.slug}" :class="{ 'is-active': status == statusOption.slug}"
:style="{ marginRight: statusOption.slug == 'private' ? 'auto' : '', marginLeft: statusOption.slug == 'trash' ? 'auto' : '' }" :style="{ marginRight: statusOption.slug == 'private' ? 'auto' : '', marginLeft: statusOption.slug == 'trash' ? 'auto' : '' }"
@ -252,13 +251,7 @@
</span> </span>
</p> </p>
<p v-if="status == undefined || status == ''">{{ $i18n.get('info_no_collection_created') }}</p> <p v-if="status == undefined || status == ''">{{ $i18n.get('info_no_collection_created') }}</p>
<p <p v-else>{{ $i18n.get('info_no_collections_' + status) }}</p>
v-for="(statusOption, index) of $statusHelper.getStatuses()"
:key="index"
v-if="status == statusOption.slug">
{{ $i18n.get('info_no_collections_' + statusOption.slug) }}
</p>
<div v-if="!$adminOptions.hideCollectionsListCreationDropdown && $userCaps.hasCapability('tnc_rep_edit_collections') && status == undefined || status == ''"> <div v-if="!$adminOptions.hideCollectionsListCreationDropdown && $userCaps.hasCapability('tnc_rep_edit_collections') && status == undefined || status == ''">
<b-dropdown <b-dropdown
id="collection-creation-options-dropdown" id="collection-creation-options-dropdown"
@ -406,6 +399,9 @@ export default {
} }
return {}; return {};
},
statusOptionsForCollections() {
return this.$statusHelper.getStatuses().filter((status) => status.slug != 'draft' && (status.slug != 'private' || (status.slug == 'private' && this.$userCaps.hasCapability('tnc_rep_read_private_collections'))));
} }
}, },
created() { created() {

View File

@ -321,17 +321,18 @@
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" /> <i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span> </span>
</button> </button>
<template v-for="metadatum of sortingMetadata">
<b-dropdown-item <b-dropdown-item
aria-controls="items-list-results" aria-controls="items-list-results"
role="button" role="button"
:class="{ 'is-active': (orderBy != 'meta_value' && orderBy != 'meta_value_num' && orderBy == metadatum.slug) || ((orderBy == 'meta_value' || orderBy == 'meta_value_num') && metaKey == metadatum.id) }" :class="{ 'is-active': (orderBy != 'meta_value' && orderBy != 'meta_value_num' && orderBy == metadatum.slug) || ((orderBy == 'meta_value' || orderBy == 'meta_value_num') && metaKey == metadatum.id) }"
v-for="metadatum of sortingMetadata"
v-if="metadatum != undefined" v-if="metadatum != undefined"
:value="metadatum" :value="metadatum"
:key="metadatum.slug" :key="metadatum.slug"
aria-role="listitem"> aria-role="listitem">
{{ metadatum.name }} {{ metadatum.name }}
</b-dropdown-item> </b-dropdown-item>
</template>
</b-dropdown> </b-dropdown>
</b-field> </b-field>
</div> </div>
@ -630,11 +631,8 @@
<p v-if="status == undefined || status == '' || status == 'publish,private,draft'"> <p v-if="status == undefined || status == '' || status == 'publish,private,draft'">
{{ (hasFiltered || openAdvancedSearch || searchQuery) ? $i18n.get('info_no_item_found_filter') : (isSortingByCustomMetadata ? $i18n.get('info_no_item_found') : $i18n.get('info_no_item_created')) }} {{ (hasFiltered || openAdvancedSearch || searchQuery) ? $i18n.get('info_no_item_found_filter') : (isSortingByCustomMetadata ? $i18n.get('info_no_item_found') : $i18n.get('info_no_item_created')) }}
</p> </p>
<p <p v-else>
v-for="(statusOption, index) of $statusHelper.getStatuses()" {{ $i18n.get('info_no_items_' + status) }}
:key="index"
v-if="status == statusOption.slug">
{{ $i18n.get('info_no_items_' + statusOption.slug) }}
</p> </p>
<router-link <router-link

View File

@ -125,9 +125,8 @@
</a> </a>
</li> </li>
<li <li
v-for="(statusOption, index) of $statusHelper.getStatuses().filter((status) => status.slug != 'draft')" v-for="(statusOption, index) of statusOptionsForTaxonomies"
:key="index" :key="index"
v-if="statusOption.slug != 'private' || (statusOption.slug == 'private' && $userCaps.hasCapability('tnc_rep_read_private_taxonomies'))"
@click="onChangeTab(statusOption.slug)" @click="onChangeTab(statusOption.slug)"
:class="{ 'is-active': status == statusOption.slug}" :class="{ 'is-active': status == statusOption.slug}"
:style="{ marginRight: statusOption.slug == 'draft' ? 'auto' : '', marginLeft: statusOption.slug == 'trash' ? 'auto' : '' }" :style="{ marginRight: statusOption.slug == 'draft' ? 'auto' : '', marginLeft: statusOption.slug == 'trash' ? 'auto' : '' }"
@ -171,11 +170,8 @@
</span> </span>
</p> </p>
<p v-if="status == undefined || status == ''">{{ $i18n.get('info_no_taxonomy_created') }}</p> <p v-if="status == undefined || status == ''">{{ $i18n.get('info_no_taxonomy_created') }}</p>
<p <p v-else>
v-for="(statusOption, index) of $statusHelper.getStatuses()" {{ $i18n.get('info_no_taxonomies_' + status) }}
:key="index"
v-if="status == statusOption.slug">
{{ $i18n.get('info_no_taxonomies_' + statusOption.slug) }}
</p> </p>
<router-link <router-link
v-if="status == undefined || status == ''" v-if="status == undefined || status == ''"
@ -269,6 +265,9 @@
}, },
repositoryTotalTaxonomies(){ repositoryTotalTaxonomies(){
return this.getRepositoryTotalTaxonomies(); return this.getRepositoryTotalTaxonomies();
},
statusOptionsForTaxonomies() {
return this.$statusHelper.getStatuses().filter((status) => status.slug != 'draft' && (status.slug != 'private' || (status.slug == 'private' && this.$userCaps.hasCapability('tnc_rep_read_private_taxonomies'))));
} }
}, },
created() { created() {

View File

@ -45,16 +45,28 @@
shown: 500, shown: 500,
hide: 300, hide: 300,
}, },
content: item.metadata != undefined ? renderMetadata(item, column) : '', content: item.metadata != undefined ? renderMetadata(item, titleItemMetadatum) : '',
html: true, html: true,
autoHide: false, autoHide: false,
placement: 'auto-start', placement: 'auto-start',
popperClass: ['tainacan-tooltip', 'tooltip'] popperClass: ['tainacan-tooltip', 'tooltip']
}" }"
v-for="(column, metadatumIndex) in displayedMetadata" v-if="collectionId && titleItemMetadatum"
:key="metadatumIndex" v-html="item.metadata != undefined ? renderMetadata(item, titleItemMetadatum) : ''" />
v-if="column.display && column.metadata_type_object != undefined && (column.metadata_type_object.related_mapped_prop == 'title')" <p
v-html="item.metadata != undefined && collectionId ? renderMetadata(item, column) : (item.title ? item.title :`<span class='has-text-gray3 is-italic'>` + $i18n.get('label_value_not_provided') + `</span>`)" /> v-tooltip="{
delay: {
shown: 500,
hide: 300,
},
content: item.title != undefined ? item.title : (`<span class='has-text-gray3 is-italic'>` + $i18n.get('label_value_not_provided') + `</span>`),
html: true,
autoHide: false,
placement: 'auto-start',
popperClass: ['tainacan-tooltip', 'tooltip']
}"
v-if="!collectionId && titleItemMetadatum"
v-html="item.title != undefined ? item.title : (`<span class='has-text-gray3 is-italic'>` + $i18n.get('label_value_not_provided') + `</span>`)" />
<span <span
v-if="isSlideshowViewModeEnabled" v-if="isSlideshowViewModeEnabled"
v-tooltip="{ v-tooltip="{
@ -94,8 +106,8 @@
:src="$thumbHelper.getSrc(item['thumbnail'], 'tainacan-medium-full', item.document_mimetype)"> --> :src="$thumbHelper.getSrc(item['thumbnail'], 'tainacan-medium-full', item.document_mimetype)"> -->
</div> </div>
<div class="list-metadata media-body"> <div class="list-metadata media-body">
<template v-for="(column, metadatumIndex) in displayedMetadata">
<span <span
v-for="(column, metadatumIndex) in displayedMetadata"
:key="metadatumIndex" :key="metadatumIndex"
:class="{ 'metadata-type-textarea': column.metadata_type_object.component == 'tainacan-textarea' }" :class="{ 'metadata-type-textarea': column.metadata_type_object.component == 'tainacan-textarea' }"
v-if="renderMetadata(item, column) != '' && column.display && column.slug != 'thumbnail' && column.metadata_type_object != undefined && (column.metadata_type_object.related_mapped_prop != 'title')"> v-if="renderMetadata(item, column) != '' && column.display && column.slug != 'thumbnail' && column.metadata_type_object != undefined && (column.metadata_type_object.related_mapped_prop != 'title')">
@ -104,6 +116,7 @@
v-html="renderMetadata(item, column)" v-html="renderMetadata(item, column)"
class="metadata-value"/> class="metadata-value"/>
</span> </span>
</template>
</div> </div>
</div> </div>

View File

@ -45,16 +45,28 @@
shown: 500, shown: 500,
hide: 300, hide: 300,
}, },
content: item.metadata != undefined ? renderMetadata(item, column) : '', content: item.metadata != undefined ? renderMetadata(item, titleItemMetadatum) : '',
html: true, html: true,
autoHide: false, autoHide: false,
placement: 'top-start', placement: 'top-start',
popperClass: ['tainacan-tooltip', 'tooltip'] popperClass: ['tainacan-tooltip', 'tooltip']
}" }"
v-for="(column, metadatumIndex) in displayedMetadata" v-if="collectionId && titleItemMetadatum"
:key="metadatumIndex" v-html="item.metadata != undefined ? renderMetadata(item, titleItemMetadatum) : ''" />
v-if="column.display && column.metadata_type_object != undefined && (column.metadata_type_object.related_mapped_prop == 'title')" <p
v-html="item.metadata != undefined && collectionId && renderMetadata(item, column) ? renderMetadata(item, column) : (item.title ? item.title :`<span class='has-text-gray3 is-italic'>` + $i18n.get('label_value_not_provided') + `</span>`)" /> v-tooltip="{
delay: {
shown: 500,
hide: 300,
},
content: item.title != undefined ? item.title : (`<span class='has-text-gray3 is-italic'>` + $i18n.get('label_value_not_provided') + `</span>`),
html: true,
autoHide: false,
placement: 'top-start',
popperClass: ['tainacan-tooltip', 'tooltip']
}"
v-if="!collectionId && titleItemMetadatum"
v-html="item.title != undefined ? item.title : (`<span class='has-text-gray3 is-italic'>` + $i18n.get('label_value_not_provided') + `</span>`)" />
<div class="tainacan-map-card-thumbnail"> <div class="tainacan-map-card-thumbnail">
<blur-hash-image <blur-hash-image
v-if="item.thumbnail != undefined" v-if="item.thumbnail != undefined"
@ -257,16 +269,28 @@
shown: 500, shown: 500,
hide: 300, hide: 300,
}, },
content: item.metadata != undefined ? renderMetadata(item, column) : '', content: item.metadata != undefined ? renderMetadata(item, titleItemMetadatum) : '',
html: true, html: true,
autoHide: false, autoHide: false,
placement: 'auto-start', placement: 'auto-start',
popperClass: ['tainacan-tooltip', 'tooltip'] popperClass: ['tainacan-tooltip', 'tooltip']
}" }"
v-for="(column, metadatumIndex) in displayedMetadata" v-if="collectionId && titleItemMetadatum"
:key="metadatumIndex" v-html="item.metadata != undefined ? renderMetadata(item, titleItemMetadatum) : ''" />
v-if="column.display && column.metadata_type_object != undefined && (column.metadata_type_object.related_mapped_prop == 'title')" <p
v-html="item.metadata != undefined && collectionId ? renderMetadata(item, column) : (item.title ? item.title :`<span class='has-text-gray3 is-italic'>` + $i18n.get('label_value_not_provided') + `</span>`)" /> v-tooltip="{
delay: {
shown: 500,
hide: 300,
},
content: item.title != undefined ? item.title : (`<span class='has-text-gray3 is-italic'>` + $i18n.get('label_value_not_provided') + `</span>`),
html: true,
autoHide: false,
placement: 'auto-start',
popperClass: ['tainacan-tooltip', 'tooltip']
}"
v-if="!collectionId && titleItemMetadatum"
v-html="item.title != undefined ? item.title : (`<span class='has-text-gray3 is-italic'>` + $i18n.get('label_value_not_provided') + `</span>`)" />
<span <span
v-if="isSlideshowViewModeEnabled" v-if="isSlideshowViewModeEnabled"
v-tooltip="{ v-tooltip="{
@ -309,8 +333,8 @@
marginTop: '-' + getItemImageHeight(item['thumbnail']['tainacan-medium-full'] ? item['thumbnail']['tainacan-medium-full'][1] : (item['thumbnail'].medium_large ? item['thumbnail'].medium_large[1] : 120), item['thumbnail']['tainacan-medium-full'] ? item['thumbnail']['tainacan-medium-full'][2] : (item['thumbnail'].medium_large ? item['thumbnail'].medium_large[2] : 120)) + 'px' marginTop: '-' + getItemImageHeight(item['thumbnail']['tainacan-medium-full'] ? item['thumbnail']['tainacan-medium-full'][1] : (item['thumbnail'].medium_large ? item['thumbnail'].medium_large[1] : 120), item['thumbnail']['tainacan-medium-full'] ? item['thumbnail']['tainacan-medium-full'][2] : (item['thumbnail'].medium_large ? item['thumbnail'].medium_large[2] : 120)) + 'px'
}" /> }" />
</div> </div>
<template v-for="(column, metadatumIndex) in displayedMetadata">
<span <span
v-for="(column, metadatumIndex) in displayedMetadata"
:key="metadatumIndex" :key="metadatumIndex"
:class="{ 'metadata-type-textarea': column.metadata_type_object.component == 'tainacan-textarea' }" :class="{ 'metadata-type-textarea': column.metadata_type_object.component == 'tainacan-textarea' }"
v-if="renderMetadata(item, column) != '' && v-if="renderMetadata(item, column) != '' &&
@ -323,6 +347,7 @@
v-html="renderMetadata(item, column)" v-html="renderMetadata(item, column)"
class="metadata-value"/> class="metadata-value"/>
</span> </span>
</template>
</div> </div>
</div> </div>

View File

@ -48,16 +48,28 @@
shown: 500, shown: 500,
hide: 300, hide: 300,
}, },
content: item.metadata != undefined ? renderMetadata(item, column) : '', content: item.metadata != undefined ? renderMetadata(item, titleItemMetadatum) : '',
html: true, html: true,
autoHide: false, autoHide: false,
placement: 'auto-start', placement: 'auto-start',
popperClass: ['tainacan-tooltip', 'tooltip'] popperClass: ['tainacan-tooltip', 'tooltip']
}" }"
v-for="(column, metadatumIndex) in displayedMetadata" v-if="collectionId && titleItemMetadatum"
:key="metadatumIndex" v-html="item.metadata != undefined ? renderMetadata(item, titleItemMetadatum) : ''" />
v-if="column.display && column.metadata_type_object != undefined && (column.metadata_type_object.related_mapped_prop == 'title')" <p
v-html="item.metadata != undefined && collectionId ? renderMetadata(item, column) : (item.title ? item.title :`<span class='has-text-gray3 is-italic'>` + $i18n.get('label_value_not_provided') + `</span>`)" /> v-tooltip="{
delay: {
shown: 500,
hide: 300,
},
content: item.title != undefined ? item.title : (`<span class='has-text-gray3 is-italic'>` + $i18n.get('label_value_not_provided') + `</span>`),
html: true,
autoHide: false,
placement: 'auto-start',
popperClass: ['tainacan-tooltip', 'tooltip']
}"
v-if="!collectionId && titleItemMetadatum"
v-html="item.title != undefined ? item.title : (`<span class='has-text-gray3 is-italic'>` + $i18n.get('label_value_not_provided') + `</span>`)" />
<span <span
v-if="isSlideshowViewModeEnabled" v-if="isSlideshowViewModeEnabled"
v-tooltip="{ v-tooltip="{
@ -100,8 +112,8 @@
marginTop: '-' + getItemImageHeight(item['thumbnail']['tainacan-medium-full'] ? item['thumbnail']['tainacan-medium-full'][1] : (item['thumbnail'].medium_large ? item['thumbnail'].medium_large[1] : 120), item['thumbnail']['tainacan-medium-full'] ? item['thumbnail']['tainacan-medium-full'][2] : (item['thumbnail'].medium_large ? item['thumbnail'].medium_large[2] : 120)) + 'px' marginTop: '-' + getItemImageHeight(item['thumbnail']['tainacan-medium-full'] ? item['thumbnail']['tainacan-medium-full'][1] : (item['thumbnail'].medium_large ? item['thumbnail'].medium_large[1] : 120), item['thumbnail']['tainacan-medium-full'] ? item['thumbnail']['tainacan-medium-full'][2] : (item['thumbnail'].medium_large ? item['thumbnail'].medium_large[2] : 120)) + 'px'
}" /> }" />
</div> </div>
<template v-for="(column, metadatumIndex) in displayedMetadata">
<span <span
v-for="(column, metadatumIndex) in displayedMetadata"
:key="metadatumIndex" :key="metadatumIndex"
:class="{ 'metadata-type-textarea': column.metadata_type_object.component == 'tainacan-textarea' }" :class="{ 'metadata-type-textarea': column.metadata_type_object.component == 'tainacan-textarea' }"
v-if="renderMetadata(item, column) != '' && column.display && column.slug != 'thumbnail' && column.metadata_type_object != undefined && (column.metadata_type_object.related_mapped_prop != 'title')"> v-if="renderMetadata(item, column) != '' && column.display && column.slug != 'thumbnail' && column.metadata_type_object != undefined && (column.metadata_type_object.related_mapped_prop != 'title')">
@ -110,6 +122,7 @@
v-html="renderMetadata(item, column)" v-html="renderMetadata(item, column)"
class="metadata-value"/> class="metadata-value"/>
</span> </span>
</template>
</div> </div>
</div> </div>

View File

@ -288,8 +288,8 @@
<div class="is-large control has-icons-right is-loading is-clearfix" /> <div class="is-large control has-icons-right is-loading is-clearfix" />
</span> </span>
<template v-for="(metadatum, index) of item.metadata">
<div <div
v-for="(metadatum, index) of item.metadata"
v-if="metadatum.value_as_html != undefined && metadatum.value_as_html != ''" v-if="metadatum.value_as_html != undefined && metadatum.value_as_html != ''"
:key="index" :key="index"
class="field"> class="field">
@ -328,7 +328,7 @@
</b-collapse> </b-collapse>
</div> </div>
</template>
<br> <br>
<br> <br>

View File

@ -12,8 +12,8 @@
class="tainacan-table tainacan-table-skeleton" class="tainacan-table tainacan-table-skeleton"
tabindex="0"> tabindex="0">
<thead> <thead>
<template v-for="(column, metadatumIndex) in displayedMetadata">
<th <th
v-for="(column, metadatumIndex) in displayedMetadata"
:key="metadatumIndex" :key="metadatumIndex"
v-if="column.display" v-if="column.display"
class="column-default-width" class="column-default-width"
@ -29,17 +29,19 @@
}"> }">
<div class="th-wrap">{{ column.name }}</div> <div class="th-wrap">{{ column.name }}</div>
</th> </th>
</template>
</thead> </thead>
<tbody> <tbody>
<tr <tr
:key="item" :key="item"
v-for="item in 12"> v-for="item in 12">
<template v-for="(column, metadatumIndex) in displayedMetadata">
<td <td
v-for="(column, metadatumIndex) in displayedMetadata"
:key="metadatumIndex" :key="metadatumIndex"
v-if="column.display" v-if="column.display"
:class="{ 'thumbnail-cell': metadatumIndex == 0 }" :class="{ 'thumbnail-cell': metadatumIndex == 0 }"
class="column-default-width skeleton"/> class="column-default-width skeleton"/>
</template>
</tr> </tr>
</tbody> </tbody>
</table> </table>
@ -51,8 +53,8 @@
<thead> <thead>
<tr> <tr>
<!-- Displayed Metadata --> <!-- Displayed Metadata -->
<template v-for="(column, index) in displayedMetadata">
<th <th
v-for="(column, index) in displayedMetadata"
:key="index" :key="index"
v-if="column.display" v-if="column.display"
class="column-default-width" class="column-default-width"
@ -71,7 +73,7 @@
}"> }">
<div class="th-wrap">{{ column.name }}</div> <div class="th-wrap">{{ column.name }}</div>
</th> </th>
</template>
<th <th
v-if="isSlideshowViewModeEnabled" v-if="isSlideshowViewModeEnabled"
class="actions-header"> class="actions-header">
@ -99,9 +101,9 @@
v-html="getBeforeHook(item)" /> v-html="getBeforeHook(item)" />
<!-- Item Displayed Metadata --> <!-- Item Displayed Metadata -->
<template v-for="(column, metadatumIndex) in displayedMetadata">
<td <td
:key="metadatumIndex" :key="metadatumIndex"
v-for="(column, metadatumIndex) in displayedMetadata"
v-if="column.display" v-if="column.display"
class="column-default-width" class="column-default-width"
:class="{ :class="{
@ -183,6 +185,7 @@
</span> </span>
</a> </a>
</td> </td>
</template>
<!-- Actions --> <!-- Actions -->
<td <td
@ -212,6 +215,7 @@
v-if="hasAfterHook()" v-if="hasAfterHook()"
class="faceted-search-hook faceted-search-hook-item-after" class="faceted-search-hook faceted-search-hook-item-after"
v-html="getAfterHook(item)" /> v-html="getAfterHook(item)" />
</tr> </tr>
</tbody> </tbody>
</table> </table>

View File

@ -28,7 +28,23 @@ export const viewModesMixin = {
delete currentQueries['fetch_only_meta']; delete currentQueries['fetch_only_meta'];
} }
return currentQueries return currentQueries
} },
/*
* This computed property only returns the metadatum object where the title is.
* In repository level, there is not "title metadatum", this information comes directly from the item.title.
*/
titleItemMetadatum() {
const possibleTitleItemMetadatum = this.displayedMetadata.find(aMetadatum => aMetadatum.display && aMetadatum.metadata_type_object && aMetadatum.metadata_type_object.related_mapped_prop == 'title');
return possibleTitleItemMetadatum ? possibleTitleItemMetadatum : false;
},
/*
* This computed property only returns the metadatum object where the description is.
* In repository level, there is not "description metadatum", this information comes directly from the item.description.
*/
descriptionItemMetadatum() {
const possibleDescriptionItemMetadatum = this.displayedMetadata.find(aMetadatum => aMetadatum.display && aMetadatum.metadata_type_object && aMetadatum.metadata_type_object.related_mapped_prop == 'description');
return possibleDescriptionItemMetadatum ? possibleDescriptionItemMetadatum : false;
},
}, },
mounted() { mounted() {
this.isSlideshowViewModeEnabled = (this.enabledViewModes && Array.isArray(this.enabledViewModes)) ? (this.enabledViewModes.findIndex((viewMode) => viewMode == 'slideshow') >= 0) : false; this.isSlideshowViewModeEnabled = (this.enabledViewModes && Array.isArray(this.enabledViewModes)) ? (this.enabledViewModes.findIndex((viewMode) => viewMode == 'slideshow') >= 0) : false;

View File

@ -273,17 +273,18 @@
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" /> <i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span> </span>
</button> </button>
<template v-for="metadatum of sortingMetadata">
<b-dropdown-item <b-dropdown-item
aria-controls="items-list-results" aria-controls="items-list-results"
role="button" role="button"
:class="{ 'is-active': (orderBy != 'meta_value' && orderBy != 'meta_value_num' && orderBy == metadatum.slug) || ((orderBy == 'meta_value' || orderBy == 'meta_value_num') && metaKey == metadatum.id) }" :class="{ 'is-active': (orderBy != 'meta_value' && orderBy != 'meta_value_num' && orderBy == metadatum.slug) || ((orderBy == 'meta_value' || orderBy == 'meta_value_num') && metaKey == metadatum.id) }"
v-for="metadatum of sortingMetadata"
v-if="metadatum != undefined" v-if="metadatum != undefined"
:value="metadatum" :value="metadatum"
:key="metadatum.slug" :key="metadatum.slug"
aria-role="listitem"> aria-role="listitem">
{{ metadatum.name }} {{ metadatum.name }}
</b-dropdown-item> </b-dropdown-item>
</template>
</b-dropdown> </b-dropdown>
</template> </template>
</b-field> </b-field>
@ -325,14 +326,14 @@
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" /> <i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span> </span>
</button> </button>
<template v-for="(viewModeOption, index) of enabledViewModes">
<b-dropdown-item <b-dropdown-item
aria-controls="items-list-results" aria-controls="items-list-results"
role="button" role="button"
:class="{ 'is-active': viewModeOption == viewMode }" :class="{ 'is-active': viewModeOption == viewMode }"
v-for="(viewModeOption, index) of enabledViewModes" v-if="(registeredViewModes[viewModeOption] != undefined && registeredViewModes[viewModeOption].full_screen == false) || (showFullscreenWithViewModes && registeredViewModes[viewModeOption] != undefined)"
:key="index" :key="index"
:value="viewModeOption" :value="viewModeOption"
v-if="(registeredViewModes[viewModeOption] != undefined && registeredViewModes[viewModeOption].full_screen == false) || (showFullscreenWithViewModes && registeredViewModes[viewModeOption] != undefined)"
aria-role="listitem"> aria-role="listitem">
<span <span
v-if="!showInlineViewModeOptions" v-if="!showInlineViewModeOptions"
@ -354,6 +355,7 @@
v-html="registeredViewModes[viewModeOption].icon"/> v-html="registeredViewModes[viewModeOption].icon"/>
<span v-if="!showInlineViewModeOptions">{{ registeredViewModes[viewModeOption].label }}</span> <span v-if="!showInlineViewModeOptions">{{ registeredViewModes[viewModeOption].label }}</span>
</b-dropdown-item> </b-dropdown-item>
</template>
</b-dropdown> </b-dropdown>
</b-field> </b-field>
</div> </div>
@ -362,19 +364,20 @@
<div <div
id="tainacanFullScreenViewMode" id="tainacanFullScreenViewMode"
class="search-control-item search-control-item--full-screen-view-mode"> class="search-control-item search-control-item--full-screen-view-mode">
<template v-for="(viewModeOption, index) of enabledViewModes">
<button <button
class="button is-white" class="button is-white"
:aria-label="$i18n.get('label_slides')" :aria-label="$i18n.get('label_slides')"
@click="onChangeViewMode(viewModeOption)" @click="onChangeViewMode(viewModeOption)"
v-for="(viewModeOption, index) of enabledViewModes" v-if="!showFullscreenWithViewModes && registeredViewModes[viewModeOption] != undefined && registeredViewModes[viewModeOption].full_screen == true"
:key="index" :key="index"
:value="viewModeOption" :value="viewModeOption">
v-if="!showFullscreenWithViewModes && registeredViewModes[viewModeOption] != undefined && registeredViewModes[viewModeOption].full_screen == true ">
<span <span
class="gray-icon view-mode-icon" class="gray-icon view-mode-icon"
v-html="registeredViewModes[viewModeOption].icon"/> v-html="registeredViewModes[viewModeOption].icon"/>
<span class="is-hidden-tablet-only">{{ registeredViewModes[viewModeOption].label }}</span> <span class="is-hidden-tablet-only">{{ registeredViewModes[viewModeOption].label }}</span>
</button> </button>
</template>
</div> </div>
<!-- Exposers or alternative links modal button --> <!-- Exposers or alternative links modal button -->

View File

@ -17,8 +17,8 @@
&nbsp;{{ $i18n.get(entityType) }} &nbsp;{{ $i18n.get(entityType) }}
</p> </p>
<ul class="has-text-gray status-list"> <ul class="has-text-gray status-list">
<template v-for="(statusOption, index) of $statusHelper.getStatuses()">
<li <li
v-for="(statusOption, index) of $statusHelper.getStatuses()"
:key="index" :key="index"
@mouseenter="currentHoveredStatus = statusOption.slug" @mouseenter="currentHoveredStatus = statusOption.slug"
@mouseleave="currentHoveredStatus = ''" @mouseleave="currentHoveredStatus = ''"
@ -40,6 +40,7 @@
</span> </span>
<!-- {{ statusOption.name }} --> <!-- {{ statusOption.name }} -->
</li> </li>
</template>
</ul> </ul>
<p <p
v-if="summary.totals && summary.totals[entityType] && entityType == 'taxonomies'" v-if="summary.totals && summary.totals[entityType] && entityType == 'taxonomies'"

View File

@ -29,14 +29,15 @@
:aria-hidden="showDropdownMenu"> :aria-hidden="showDropdownMenu">
<!-- <p class="dropdown-menu-intro">{{ $i18n.get('Create a new role based on: ') }}</p> --> <!-- <p class="dropdown-menu-intro">{{ $i18n.get('Create a new role based on: ') }}</p> -->
<ul> <ul>
<template v-for="role of roles">
<li <li
v-for="role of roles"
:key="role.slug" :key="role.slug"
v-if="role.slug.match('tainacan')"> v-if="role.slug.match('tainacan')">
<router-link :to="'/roles/new?template=' + role.slug"> <router-link :to="'/roles/new?template=' + role.slug">
{{ role.name }} {{ role.name }}
</router-link> </router-link>
</li> </li>
</template>
<li><router-link to="/roles/new"><em>{{ $i18n.get('Blank') }}</em></router-link></li> <li><router-link to="/roles/new"><em>{{ $i18n.get('Blank') }}</em></router-link></li>
</ul> </ul>
</div> </div>