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

refactor sequence edit front-end #200 

Now independent from bulk edit
This commit is contained in:
leogermani 2019-12-11 08:50:38 -03:00
parent 04ed966369
commit 61ed5b4e5d
4 changed files with 346 additions and 280 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

263
src/admin/components/edition/item-edition-form.vue
View File

@ -7,27 +7,27 @@
<div class="tainacan-page-title">
<h1 v-if="isCreatingNewItem">
<span
<span
v-if="(item != null && item != undefined && item.status != undefined && !isLoading)"
class="status-tag">{{ $i18n.get('status_' + item.status) }}</span>
{{ $i18n.get('title_create_item_collection') + ' ' }}
<span style="font-weight: 600;">{{ collectionName }}</span>
</h1>
<h1 v-else>
<span
<span
v-if="(item != null && item != undefined && item.status != undefined && !isLoading)"
class="status-tag">{{ $i18n.get('status_' + item.status) }}</span>
{{ $i18n.get('title_edit_item') + ' ' }}
<span style="font-weight: 600;">{{ (item != null && item != undefined) ? item.title : '' }}</span>
</h1>
<a
<a
@click="$router.go(-1)"
class="back-link has-text-secondary">
{{ $i18n.get('back') }}
</a>
<hr>
</div>
<transition
<transition
mode="out-in"
:name="(isOnSequenceEdit && sequenceRightDirection != undefined) ? (sequenceRightDirection ? 'page-right' : 'page-left') : ''">
<form
@ -38,11 +38,11 @@
<div class="column is-5">
<!-- Hook for extra Form options -->
<template
v-if="formHooks != undefined &&
<template
v-if="formHooks != undefined &&
formHooks['item'] != undefined &&
formHooks['item']['begin-left'] != undefined">
<form
formHooks['item']['begin-left'] != undefined">
<form
id="form-item-begin-left"
class="form-hook-region"
v-html="formHooks['item']['begin-left'].join('')"/>
@ -71,7 +71,7 @@
id="button-edit-document"
:aria-label="$i18n.get('label_button_edit_document')"
@click.prevent="setFileDocument($event)">
<span
<span
v-tooltip="{
content: $i18n.get('edit'),
autoHide: true,
@ -87,7 +87,7 @@
id="button-delete-document"
:aria-label="$i18n.get('label_button_delete_document')"
@click.prevent="removeDocument()">
<span
<span
v-tooltip="{
content: $i18n.get('delete'),
autoHide: true,
@ -107,7 +107,7 @@
:aria-label="$i18n.get('label_button_edit_document')"
id="button-edit-document"
@click.prevent="setTextDocument()">
<span
<span
v-tooltip="{
content: $i18n.get('edit'),
autoHide: true,
@ -123,7 +123,7 @@
:aria-label="$i18n.get('label_button_delete_document')"
id="button-delete-document"
@click.prevent="removeDocument()">
<span
<span
v-tooltip="{
content: $i18n.get('delete'),
autoHide: true,
@ -144,7 +144,7 @@
:aria-label="$i18n.get('label_button_edit_document')"
id="button-edit-document"
@click.prevent="setURLDocument()">
<span
<span
v-tooltip="{
content: $i18n.get('edit'),
autoHide: true,
@ -175,7 +175,7 @@
</div>
<ul v-else>
<li>
<button
<button
type="button"
@click.prevent="setFileDocument($event)">
<span class="icon">
@ -185,7 +185,7 @@
<p>{{ $i18n.get('label_file') }}</p>
</li>
<li>
<button
<button
type="button"
@click.prevent="setTextDocument()">
<span class="icon">
@ -195,7 +195,7 @@
<p>{{ $i18n.get('label_text') }}</p>
</li>
<li>
<button
<button
type="button"
@click.prevent="setURLDocument()">
<span class="icon">
@ -252,7 +252,7 @@
:active.sync="isURLModalActive"
:width="640"
scroll="keep"
trap-focus
trap-focus
role="dialog"
tabindex="-1"
aria-modal
@ -291,7 +291,7 @@
:title="$i18n.getHelperTitle('items', '_thumbnail_id')"
:message="$i18n.getHelperMessage('items', '_thumbnail_id')"/>
</div>
</div>
<div class="section-box section-thumbnail">
<div class="thumbnail-field">
<file-item
@ -299,12 +299,12 @@
:show-name="false"
:modal-on-click="false"
:size="178"
:file="{
media_type: 'image',
:file="{
media_type: 'image',
guid: { rendered: item.thumbnail['tainacan-medium'] ? item.thumbnail['tainacan-medium'][0] : item.thumbnail.medium[0] },
title: { rendered: $i18n.get('label_thumbnail')},
description: { rendered: `<img alt='` + $i18n.get('label_thumbnail') + `' src='` + item.thumbnail.full[0] + `'/>` }}"/>
<figure
<figure
v-if="item.thumbnail == undefined || ((item.thumbnail.medium == undefined || item.thumbnail.medium == false) && (item.thumbnail['tainacan-medium'] == undefined || item.thumbnail['tainacan-medium'] == false))"
class="image">
<span class="image-placeholder">{{ $i18n.get('label_empty_thumbnail') }}</span>
@ -318,7 +318,7 @@
id="button-edit-thumbnail"
:aria-label="$i18n.get('label_button_edit_thumb')"
@click.prevent="thumbnailMediaFrame.openFrame($event)">
<span
<span
v-tooltip="{
content: $i18n.get('edit'),
autoHide: true,
@ -334,7 +334,7 @@
class="button is-rounded is-secondary"
:aria-label="$i18n.get('label_button_delete_thumb')"
@click="deleteThumbnail()">
<span
<span
v-tooltip="{
content: $i18n.get('delete'),
autoHide: true,
@ -349,25 +349,25 @@
</div>
<!-- Hook for extra Form options -->
<template
v-if="formHooks != undefined &&
<template
v-if="formHooks != undefined &&
formHooks['item'] != undefined &&
formHooks['item']['end-left'] != undefined">
<form
formHooks['item']['end-left'] != undefined">
<form
id="form-item-end-left"
class="form-hook-region"
v-html="formHooks['item']['end-left'].join('')"/>
</template>
</div>
</div>
<div class="column is-7">
<!-- Hook for extra Form options -->
<template
v-if="formHooks != undefined &&
<template
v-if="formHooks != undefined &&
formHooks['item'] != undefined &&
formHooks['item']['begin-right'] != undefined">
<form
formHooks['item']['begin-right'] != undefined">
<form
id="form-item-begin-right"
class="form-hook-region"
v-html="formHooks['item']['begin-right'].join('')"/>
@ -429,22 +429,22 @@
</div>
</div>
<!-- Comment Status ------------------------ -->
<div
<!-- Comment Status ------------------------ -->
<div
class="column is-narrow"
v-if="collectionAllowComments == 'open'">
<div class="section-label">
<label>{{ $i18n.get('label_comments') }}</label>
<help-button
:title="$i18n.getHelperTitle('items', 'comment_status')"
<help-button
:title="$i18n.getHelperTitle('items', 'comment_status')"
:message="$i18n.getHelperMessage('items', 'comment_status')"/>
</div>
<div class="section-status">
<div class="field has-addons">
<b-switch
id="tainacan-checkbox-comment-status"
id="tainacan-checkbox-comment-status"
size="is-small"
true-value="open"
true-value="open"
false-value="closed"
v-model="form.comment_status">
{{ $i18n.get('label_allow_comments') }}
@ -454,7 +454,7 @@
</div>
</div>
<b-tabs v-model="activeTab">
<!-- Metadata from Collection-------------------------------- -->
@ -465,13 +465,13 @@
</span>
<span>{{ $i18n.get('metadata') }}</span>
</template>
<a
class="collapse-all"
@click="toggleCollapseAll()">
{{ collapseAll ? $i18n.get('label_collapse_all') : $i18n.get('label_expand_all') }}
<span class="icon">
<i
<i
:class="{ 'tainacan-icon-arrowdown' : collapseAll, 'tainacan-icon-arrowright' : !collapseAll }"
class="tainacan-icon tainacan-icon-20px"/>
</span>
@ -484,11 +484,11 @@
@changeCollapse="onChangeCollapse($event, index)"/>
<!-- Hook for extra Form options -->
<template
v-if="formHooks != undefined &&
<template
v-if="formHooks != undefined &&
formHooks['item'] != undefined &&
formHooks['item']['end-right'] != undefined">
<form
formHooks['item']['end-right'] != undefined">
<form
id="form-item-end-right"
class="form-hook-region"
v-html="formHooks['item']['end-right'].join('')"/>
@ -510,7 +510,7 @@
</span>
</span>
</template>
<div v-if="item != undefined && item.id != undefined">
<br>
<button
@ -527,38 +527,38 @@
:is-editable="true"
:is-loading.sync="isLoadingAttachments"
@isLoadingAttachments="(isLoading) => isLoadingAttachments = isLoading"
@onDeleteAttachment="deleteAttachment($event)"/>
@onDeleteAttachment="deleteAttachment($event)"/>
</div>
</b-tab-item>
</b-tabs>
</div>
</div>
</form>
</transition>
<footer class="footer">
<!-- Sequence Progress -->
<div
<div
v-if="isOnSequenceEdit"
class="sequence-progress-background"/>
<div
<div
v-if="isOnSequenceEdit && itemPosition != undefined && group != null && group.items_count != undefined"
:style="{ width: (itemPosition/group.items_count)*100 + '%' }"
class="sequence-progress"/>
<!-- Last Updated Info -->
<!-- Last Updated Info -->
<div class="update-info-section">
<p
<p
class="has-text-gray5"
v-if="isOnSequenceEdit">
{{ $i18n.get('label_sequence_editing_item') + " " + itemPosition + " " + $i18n.get('info_of') + " " + ((group != null && group.items_count != undefined) ? group.items_count : '') + "." }}
</p>
</p>
<p v-if="!isUpdatingValues">
{{ ($i18n.get('info_updated_at') + ' ' + lastUpdated) }}
<span class="help is-danger">{{ formErrorMessage }}</span>
</p>
<p
</p>
<p
class="update-warning"
v-if="isUpdatingValues">
<span class="icon">
@ -566,53 +566,53 @@
</span>
{{ $i18n.get('info_updating_metadata_values') }}
<span class="help is-danger">{{ formErrorMessage }}</span>
</p>
</div>
<div
</p>
</div>
<div
class="form-submission-footer"
v-if="form.status == 'trash'">
<button
<button
@click="onDeletePermanently()"
type="button"
class="button is-outlined">{{ $i18n.get('label_delete_permanently') }}</button>
<button
<button
@click="onSubmit('draft')"
type="button"
class="button is-secondary">{{ $i18n.get('label_save_as_draft') }}</button>
<button
<button
@click="onSubmit(visibility)"
type="button"
class="button is-success">{{ $i18n.get('label_publish') }}</button>
</div>
<div
<div
class="form-submission-footer"
v-if="form.status == 'auto-draft' || form.status == 'draft' || form.status == undefined">
<button
<button
v-if="isOnSequenceEdit && itemPosition > 1"
@click="onPrevInSequence()"
type="button"
class="button sequence-button">
class="button sequence-button">
<span class="icon is-large">
<i class="tainacan-icon tainacan-icon-20px tainacan-icon-previous"/>
</span>
<span>{{ $i18n.get('previous') }}</span>
</button>
<button
<button
v-if="form.status == 'draft' && !isOnSequenceEdit"
@click="onSubmit('trash')"
type="button"
class="button is-outlined">{{ $i18n.get('label_send_to_trash') }}</button>
<button
<button
v-if="form.status == 'auto-draft'"
@click="onDiscard()"
type="button"
class="button is-outlined">{{ $i18n.get('label_discard') }}</button>
<button
<button
v-if="!isOnSequenceEdit || (group != null && group.items_count != undefined && group.items_count == itemPosition)"
@click="onSubmit('draft')"
type="button"
class="button is-secondary">{{ form.status == 'draft' ? $i18n.get('label_update') : $i18n.get('label_save_as_draft') }}</button>
<button
<button
v-else
@click="onSubmit('draft'); onNextInSequence();"
type="button"
@ -622,12 +622,12 @@
<i class="tainacan-icon tainacan-icon-20px tainacan-icon-next"/>
</span>
</button>
<button
<button
v-if="!isOnSequenceEdit || (group != null && group.items_count != undefined && group.items_count == itemPosition)"
@click="onSubmit(visibility)"
type="button"
class="button is-success">{{ $i18n.get('label_publish') }}</button>
<button
<button
v-else
@click="onSubmit(visibility, 'next')"
type="button"
@ -637,7 +637,7 @@
<i class="tainacan-icon tainacan-icon-20px tainacan-icon-next"/>
</span>
</button>
<button
<button
v-if="isOnSequenceEdit && (group != null && group.items_count != undefined && group.items_count == itemPosition)"
@click="$router.push($routerHelper.getCollectionPath(form.collectionId))"
type="button"
@ -648,10 +648,10 @@
<span>{{ $i18n.get('finish') }}</span>
</button>
</div>
<div
<div
class="form-submission-footer"
v-if="form.status == 'publish' || form.status == 'private'">
<button
<button
v-if="isOnSequenceEdit && itemPosition > 1"
@click="onPrevInSequence()"
type="button"
@ -661,17 +661,17 @@
</span>
<span>{{ $i18n.get('previous') }}</span>
</button>
<button
<button
v-if="!isOnSequenceEdit"
@click="onSubmit('trash')"
type="button"
class="button is-outlined">{{ $i18n.get('label_send_to_trash') }}</button>
<button
<button
v-if="!isOnSequenceEdit || (group != null && group.items_count != undefined && group.items_count == itemPosition)"
@click="onSubmit('draft')"
type="button"
class="button is-secondary">{{ isOnSequenceEdit ? $i18n.get('label_save_as_draft') : $i18n.get('label_return_to_draft') }}</button>
<button
<button
v-else
@click="onSubmit('draft', 'next')"
type="button"
@ -681,13 +681,13 @@
<i class="tainacan-icon tainacan-icon-20px tainacan-icon-next"/>
</span>
</button>
<button
<button
v-if="!isOnSequenceEdit || (group != null && group.items_count != undefined && group.items_count == itemPosition)"
:disabled="formErrorMessage != undefined && formErrorMessage != ''"
@click="onSubmit(visibility)"
type="button"
class="button is-success">{{ $i18n.get('label_update') }}</button>
<button
<button
v-else
:disabled="formErrorMessage != undefined && formErrorMessage != ''"
@click="onSubmit(visibility, 'next')"
@ -698,7 +698,7 @@
<i class="tainacan-icon tainacan-icon-20px tainacan-icon-next"/>
</span>
</button>
<button
<button
v-if="isOnSequenceEdit && (group != null && group.items_count != undefined && group.items_count == itemPosition)"
@click="$router.push($routerHelper.getCollectionPath(form.collectionId))"
type="button"
@ -792,8 +792,8 @@ export default {
watch: {
'$route.params.itemPosition'(newItemPosition, oldItemPosition) {
if (oldItemPosition == undefined || oldItemPosition == newItemPosition)
this.sequenceRightDirection = undefined;
this.sequenceRightDirection = undefined;
this.itemPosition = Number(newItemPosition);
// Saves current itemPosition to user prefs
@ -803,7 +803,7 @@ export default {
this.cleanMetadata();
eventBus.clearAllErrors();
this.formErrorMessage = '';
this.isLoading = true;
// Obtains current Item ID from Sequence
@ -815,9 +815,9 @@ export default {
.catch(() => {
this.isLoading = false;
});
// Obtains current Sequence Group Info
this.fetchGroup({ collectionId: this.collectionId, groupId: this.sequenceId });
this.fetchSequenceGroup({ collectionId: this.collectionId, groupId: this.sequenceId });
}
},
methods: {
@ -849,7 +849,8 @@ export default {
]),
...mapActions('bulkedition', [
'fetchItemIdInSequence',
'fetchGroup'
'fetchGroup',
'fetchSequenceGroup'
]),
...mapGetters('bulkedition', [
'getItemIdInSequence',
@ -858,7 +859,7 @@ export default {
onSubmit(status, sequenceDirection) {
// Puts loading on Item edition
this.isLoading = true;
this.sequenceRightDirection = undefined;
this.sequenceRightDirection = undefined;
let previousStatus = this.form.status;
this.form.status = status;
@ -873,12 +874,12 @@ export default {
promise = this.deleteItem({ itemId: this.itemId, isPermanently: false });
else
promise = this.updateItem(data);
promise.then(updatedItem => {
this.item = updatedItem;
// Fills hook forms with it's real values
// Fills hook forms with it's real values
this.updateExtraFormData(this.item);
// Fill this.form data with current data.
@ -889,7 +890,7 @@ export default {
this.isLoading = false;
if (!this.isOnSequenceEdit) {
if (!this.isOnSequenceEdit) {
if (this.form.status != 'trash') {
if (previousStatus == 'auto-draft')
this.$router.push({ path: this.$routerHelper.getItemPath(this.form.collectionId, this.itemId), query: { recent: true } });
@ -910,7 +911,7 @@ export default {
for (let metadatum of Object.keys(error)){
eventBus.errors.push({ metadatum_id: metadatum, errors: error[metadatum]});
}
}
this.formErrorMessage = errors.error_message;
}
@ -1053,10 +1054,10 @@ export default {
this.urlLink = '';
this.form.document_type = 'empty';
this.form.document = '';
this.updateItemDocument({
item_id: this.itemId,
document: this.form.document,
document_type: this.form.document_type
this.updateItemDocument({
item_id: this.itemId,
document: this.form.document,
document_type: this.form.document_type
})
.then(() => {
this.isLoadingAttachments = true;
@ -1092,9 +1093,9 @@ export default {
message: this.$i18n.get('info_warning_attachment_delete'),
onConfirm: () => {
this.deletePermanentlyAttachment(attachment.id)
.then(() => {
.then(() => {
this.isLoadingAttachments = true;
this.fetchAttachments({ page: 1, attachmentsPerPage: 24, itemId: this.itemId, documentId: this.item.document })
.then(() => this.isLoadingAttachments = false)
.catch(() => this.isLoadingAttachments = false);
@ -1104,7 +1105,7 @@ export default {
});
}
},
trapFocus: true
trapFocus: true
});
},
@ -1208,10 +1209,10 @@ export default {
// Initializes Media Frames now that itemId exists
this.initializeMediaFrames();
this.fetchItem({
itemId: this.itemId,
contextEdit: true,
fetchOnly: 'title,thumbnail,status,modification_date,document_type,document,comment_status,document_as_html'
this.fetchItem({
itemId: this.itemId,
contextEdit: true,
fetchOnly: 'title,thumbnail,status,modification_date,document_type,document,comment_status,document_as_html'
})
.then(res => {
this.item = res;
@ -1225,7 +1226,7 @@ export default {
this.$root.$emit('onCollectionBreadCrumbUpdate', [
{ path: this.$routerHelper.getCollectionPath(this.collectionId), label: this.$i18n.get('items') },
{ path: '', label: this.$i18n.get('sequence') },
{ path: '', label: this.item.title },
{ path: '', label: this.item.title },
{ path: '', label: this.$i18n.get('edit') }
]);
} else {
@ -1236,18 +1237,18 @@ export default {
]);
}
// Fills hook forms with it's real values
// Fills hook forms with it's real values
this.$nextTick()
.then(() => {
this.updateExtraFormData(this.item);
});
// Fill this.form data with current data.
this.form.status = this.item.status;
this.form.document = this.item.document;
this.form.document_type = this.item.document_type;
this.form.comment_status = this.item.comment_status;
if (this.form.document_type != undefined && this.form.document_type == 'url')
this.urlLink = this.form.document;
if (this.form.document_type != undefined && this.form.document_type == 'text')
@ -1264,14 +1265,14 @@ export default {
this.fetchAttachments({ page: 1, attachmentsPerPage: 24, itemId: this.itemId, documentId: this.item.document });
},
onNextInSequence() {
this.sequenceRightDirection = true;
this.$router.push({
path: this.$routerHelper.getCollectionSequenceEditPath(this.collectionId, this.sequenceId, this.itemPosition + 1),
this.sequenceRightDirection = true;
this.$router.push({
path: this.$routerHelper.getCollectionSequenceEditPath(this.collectionId, this.sequenceId, this.itemPosition + 1),
query: { collapses: this.metadataCollapses }
});
},
onPrevInSequence() {
this.sequenceRightDirection = false;
this.sequenceRightDirection = false;
this.$router.push({
path: this.$routerHelper.getCollectionSequenceEditPath(this.collectionId, this.sequenceId, this.itemPosition - 1),
query: { collapses: this.metadataCollapses }
@ -1304,7 +1305,7 @@ export default {
this.isLoading = true;
this.sequenceId = this.$route.params.sequenceId;
let savedItemPosition = (this.$userPrefs.get('sequence_' + this.sequenceId + '_position') != undefined ? Number(this.$userPrefs.get('sequence_' + this.sequenceId + '_position')) : 1);
let savedItemPosition = (this.$userPrefs.get('sequence_' + this.sequenceId + '_position') != undefined ? Number(this.$userPrefs.get('sequence_' + this.sequenceId + '_position')) : 1);
this.itemPosition = this.$route.params.itemPosition != undefined ? Number(this.$route.params.itemPosition) : savedItemPosition;
this.isOnSequenceEdit = true;
@ -1321,9 +1322,9 @@ export default {
.catch(() => {
this.isLoading = false;
});
// Obtains current Sequence Group Info
this.fetchGroup({ collectionId: this.collectionId, groupId: this.sequenceId });
this.fetchSequenceGroup({ collectionId: this.collectionId, groupId: this.sequenceId });
}
// Obtains collection name
@ -1339,12 +1340,12 @@ export default {
.then((collectionName) => {
this.collectionName = collectionName;
});
// Search Request Token for cancelling
this.collectionNameSearchCancel = resp.source;
})
}
// Obtains if collection allow items comments
this.fetchCollectionAllowComments(this.collectionId).then((collectionAllowComments) => {
this.collectionAllowComments = collectionAllowComments;
@ -1357,7 +1358,7 @@ export default {
eventBus.$on('hasErrorsOnForm', (hasErrors) => {
if (hasErrors)
this.formErrorMessage = this.$i18n.get('info_errors_in_form');
else
else
this.formErrorMessage = '';
});
this.cleanLastUpdated();
@ -1384,10 +1385,10 @@ export default {
},
},
trapFocus: true
});
});
} else {
next()
}
}
}
}
</script>
@ -1444,7 +1445,7 @@ export default {
margin-top: 5px;
}
hr{
margin: 3px 0px 4px 0px;
margin: 3px 0px 4px 0px;
height: 1px;
background-color: $secondary;
width: 100%;
@ -1503,8 +1504,8 @@ export default {
.collapse-all {
font-size: 12px;
.icon {
vertical-align: bottom;
.icon {
vertical-align: bottom;
}
}
@ -1537,9 +1538,9 @@ export default {
}
}
.section-status {
padding-bottom: 16px;
font-size: 0.75rem;
padding-bottom: 16px;
font-size: 0.75rem;
.field {
padding: 10px 0 14px 0px !important;
@ -1548,13 +1549,13 @@ export default {
margin-left: 0;
}
.icon {
font-size: 18px !important;
font-size: 18px !important;
color: $gray3;
}
}
}
.document-field {
.document-field {
.document-buttons-row {
text-align: right;
top: -21px;
@ -1562,9 +1563,9 @@ export default {
}
}
#button-edit-thumbnail,
#button-edit-thumbnail,
#button-edit-document,
#button-delete-thumbnail,
#button-delete-thumbnail,
#button-delete-document {
border-radius: 100px !important;
@ -1575,7 +1576,7 @@ export default {
padding: 0 !important;
z-index: 99;
margin-left: 12px !important;
.icon {
display: inherit;
padding: 0;
@ -1607,7 +1608,7 @@ export default {
top: 70px;
max-width: 90px;
}
.thumbnail-buttons-row {
position: relative;
left: 90px;
@ -1627,7 +1628,7 @@ export default {
justify-content: flex-end;
align-items: center;
.form-submission-footer {
.form-submission-footer {
.button {
margin-left: 16px;
margin-right: 6px;

273
src/admin/components/lists/items-list.vue
View File

@ -12,7 +12,7 @@
:value="allItemsOnPageSelected">
{{ $i18n.get('label_select_all_items_page') }}
</b-checkbox>
</span>
</span>
<span
style="margin-left: 10px"
@ -74,22 +74,22 @@
<div class="table-wrapper">
<!-- Context menu for right click selection -->
<div
<div
v-if="cursorPosY > 0 && cursorPosX > 0 && !$route.query.readmode"
class="context-menu">
<!-- Backdrop for escaping context menu -->
<div
<div
@click.left="clearContextMenu()"
@click.right="clearContextMenu()"
class="context-menu-backdrop" />
class="context-menu-backdrop" />
<b-dropdown
<b-dropdown
inline
:style="{ top: cursorPosY + 'px', left: cursorPosX + 'px' }"
trap-focus>
<b-dropdown-item
@click="openItem()"
@click="openItem()"
v-if="!isOnTrash && !$route.query.iframemode">
{{ $i18n.getFrom('items','view_item') }}
</b-dropdown-item>
@ -98,7 +98,7 @@
v-if="!isOnTrash && !$route.query.iframemode">
{{ $i18n.get('label_open_item_new_tab') }}
</b-dropdown-item>
<b-dropdown-item
<b-dropdown-item
@click="selectItem()"
v-if="contextMenuItem != null">
{{ getSelectedItemChecked(contextMenuItem.id) == true ? $i18n.get('label_unselect_item') : $i18n.get('label_select_item') }}
@ -120,36 +120,36 @@
</b-dropdown-item>
</b-dropdown>
</div>
<!-- GRID (THUMBNAILS) VIEW MODE -->
<div
role="list"
class="tainacan-grid-container"
v-if="viewMode == 'grid'">
<div
<div
role="listitem"
:key="index"
v-for="(item, index) of items"
:class="{ 'selected-grid-item': getSelectedItemChecked(item.id) == true }"
class="tainacan-grid-item">
<!-- Checkbox -->
<!-- TODO: Remove v-if="collectionId" from this element when the bulk edit in repository is done -->
<div
v-if="collectionId && !$route.query.readmode"
:class="{ 'is-selecting': isSelectingItems }"
class="grid-item-checkbox">
<b-checkbox
<b-checkbox
size="is-small"
:value="getSelectedItemChecked(item.id)"
@input="setSelectedItemChecked(item.id)"/>
@input="setSelectedItemChecked(item.id)"/>
</div>
<!-- Title -->
<div
:style="{ 'padding-left': !collectionId ? '0.5rem !important' : '2.75rem' }"
class="metadata-title">
<p
<p
v-tooltip="{
delay: {
show: 500,
@ -159,13 +159,13 @@
html: true,
autoHide: false,
placement: 'auto-start'
}"
@click.left="onClickItem($event, item)"
}"
@click.left="onClickItem($event, item)"
@click.right="onRightClickItem($event, item)">
{{ item.title != undefined ? item.title : '' }}
</p>
</p>
</div>
<!-- Thumbnail -->
<a
v-if="item.thumbnail != undefined"
@ -173,22 +173,22 @@
@click.right="onRightClickItem($event, item)"
class="grid-item-thumbnail"
:style="{ backgroundImage: 'url(' + (item['thumbnail']['tainacan-medium'] ? item['thumbnail']['tainacan-medium'][0] : (item['thumbnail'].medium ? item['thumbnail'].medium[0] : thumbPlaceholderPath)) + ')' }">
<img
<img
:alt="$i18n.get('label_thumbnail')"
:src="item['thumbnail']['tainacan-medium'] ? item['thumbnail']['tainacan-medium'][0] : (item['thumbnail'].medium ? item['thumbnail'].medium[0] : thumbPlaceholderPath)">
</a>
<!-- Actions -->
<div
<div
v-if="item.current_user_can_edit && !$route.query.iframemode"
class="actions-area"
:label="$i18n.get('label_actions')">
<a
v-if="!isOnTrash"
id="button-edit"
:aria-label="$i18n.getFrom('items','edit_item')"
id="button-edit"
:aria-label="$i18n.getFrom('items','edit_item')"
@click.prevent.stop="goToItemEditPage(item)">
<span
<span
v-tooltip="{
content: $i18n.get('edit'),
autoHide: true,
@ -202,7 +202,7 @@
:aria-lavel="$i18n.get('label_button_untrash')"
@click.prevent.stop="untrashOneItem(item.id)"
v-if="isOnTrash">
<span
<span
v-tooltip="{
content: $i18n.get('label_recover_from_trash'),
autoHide: true,
@ -214,8 +214,8 @@
</a>
<a
v-if="collectionId"
id="button-delete"
:aria-label="$i18n.get('label_button_delete')"
id="button-delete"
:aria-label="$i18n.get('label_button_delete')"
@click.prevent.stop="deleteOneItem(item.id)">
<span
v-tooltip="{
@ -224,18 +224,18 @@
placement: 'auto'
}"
class="icon">
<i
<i
:class="{ 'tainacan-icon-delete': !isOnTrash, 'tainacan-icon-deleteforever': isOnTrash }"
class="has-text-secondary tainacan-icon tainacan-icon-20px"/>
</span>
</a>
</div>
</div>
</div>
<!-- MASONRY VIEW MODE -->
<masonry
<masonry
role="list"
v-if="viewMode == 'masonry'"
:cols="{default: 7, 1919: 6, 1407: 5, 1215: 4, 1023: 3, 767: 2, 343: 1}"
@ -246,7 +246,7 @@
:key="index"
v-for="(item, index) of items"
:class="{
'selected-masonry-item': getSelectedItemChecked(item.id) == true,
'selected-masonry-item': getSelectedItemChecked(item.id) == true,
}"
class="tainacan-masonry-item">
@ -256,14 +256,14 @@
v-if="collectionId && !$route.query.readmode"
:class="{ 'is-selecting': isSelectingItems }"
class="masonry-item-checkbox">
<label
tabindex="0"
<label
tabindex="0"
class="b-checkbox checkbox is-small">
<input
<input
type="checkbox"
:checked="getSelectedItemChecked(item.id)"
@input="setSelectedItemChecked(item.id)">
<span class="check" />
@input="setSelectedItemChecked(item.id)">
<span class="check" />
<span class="control-label" />
</label>
</div>
@ -276,30 +276,30 @@
@click.left="onClickItem($event, item)"
@click.right="onRightClickItem($event, item)"
class="metadata-title">
<p>{{ item.title != undefined ? item.title : '' }}</p>
<p>{{ item.title != undefined ? item.title : '' }}</p>
</div>
<!-- Thumbnail -->
<div
<!-- Thumbnail -->
<div
@click.left="onClickItem($event, item)"
@click.right="onRightClickItem($event, item)"
v-if="item.thumbnail != undefined"
class="tainacan-masonry-item-thumbnail"
:style="{ backgroundImage: 'url(' + (item['thumbnail']['tainacan-medium-full'] ? item['thumbnail']['tainacan-medium-full'][0] : (item['thumbnail'].medium_large ? item['thumbnail'].medium_large[0] : thumbPlaceholderPath)) + ')' }">
<img
<img
:alt="$i18n.get('label_thumbnail')"
:src="item['thumbnail']['tainacan-medium-full'] ? item['thumbnail']['tainacan-medium-full'][0] : (item['thumbnail'].medium_large ? item['thumbnail'].medium_large[0] : thumbPlaceholderPath)">
</div>
<!-- Actions -->
<div
<div
v-if="item.current_user_can_edit && !$route.query.iframemode"
class="actions-area"
:label="$i18n.get('label_actions')">
<a
v-if="!isOnTrash"
id="button-edit"
:aria-label="$i18n.getFrom('items','edit_item')"
id="button-edit"
:aria-label="$i18n.getFrom('items','edit_item')"
@click.prevent.stop="goToItemEditPage(item)">
<span
v-tooltip="{
@ -327,8 +327,8 @@
</a>
<a
v-if="collectionId"
id="button-delete"
:aria-label="$i18n.get('label_button_delete')"
id="button-delete"
:aria-label="$i18n.get('label_button_delete')"
@click.prevent.stop="deleteOneItem(item.id)">
<span
v-tooltip="{
@ -337,7 +337,7 @@
placement: 'auto'
}"
class="icon">
<i
<i
:class="{ 'tainacan-icon-delete': !isOnTrash, 'tainacan-icon-deleteforever': isOnTrash }"
class="has-text-secondary tainacan-icon tainacan-icon-20px"/>
</span>
@ -351,30 +351,30 @@
role="list"
class="tainacan-cards-container"
v-if="viewMode == 'cards'">
<div
<div
role="listitem"
:key="index"
v-for="(item, index) of items"
:class="{ 'selected-card': getSelectedItemChecked(item.id) == true }"
class="tainacan-card">
<!-- Checkbox -->
<!-- TODO: Remove v-if="collectionId" from this element when the bulk edit in repository is done -->
<div
v-if="collectionId && !$route.query.readmode"
:class="{ 'is-selecting': isSelectingItems }"
class="card-checkbox">
<b-checkbox
<b-checkbox
size="is-small"
:value="getSelectedItemChecked(item.id)"
@input="setSelectedItemChecked(item.id)"/>
@input="setSelectedItemChecked(item.id)"/>
</div>
<!-- Title -->
<div
:style="{ 'padding-left': !collectionId ? '0.5rem !important' : '2.75rem' }"
class="metadata-title">
<p
<p
v-tooltip="{
delay: {
show: 500,
@ -384,21 +384,21 @@
html: true,
autoHide: false,
placement: 'auto-start'
}"
}"
@click.left="onClickItem($event, item)"
@click.right="onRightClickItem($event, item)">
{{ item.title != undefined ? item.title : '' }}
</p>
</p>
</div>
<!-- Actions -->
<div
<div
v-if="item.current_user_can_edit && !$route.query.iframemode"
class="actions-area"
:label="$i18n.get('label_actions')">
<a
v-if="!isOnTrash"
id="button-edit"
:aria-label="$i18n.getFrom('items','edit_item')"
id="button-edit"
:aria-label="$i18n.getFrom('items','edit_item')"
@click.prevent.stop="goToItemEditPage(item)">
<span
v-tooltip="{
@ -426,8 +426,8 @@
</a>
<a
v-if="collectionId"
id="button-delete"
:aria-label="$i18n.get('label_button_delete')"
id="button-delete"
:aria-label="$i18n.get('label_button_delete')"
@click.prevent.stop="deleteOneItem(item.id)">
<span
v-tooltip="{
@ -436,22 +436,22 @@
placement: 'auto'
}"
class="icon">
<i
<i
:class="{ 'tainacan-icon-delete': !isOnTrash, 'tainacan-icon-deleteforever': isOnTrash }"
class="has-text-secondary tainacan-icon tainacan-icon-20px"/>
</span>
</a>
</div>
<!-- Remaining metadata -->
<div
<!-- Remaining metadata -->
<div
class="media"
@click.left="onClickItem($event, item)"
@click.right="onRightClickItem($event, item)">
<div
<div
:style="{ backgroundImage: 'url(' + (item['thumbnail']['tainacan-medium'] ? item['thumbnail']['tainacan-medium'][0] : (item['thumbnail'].medium ? item['thumbnail'].medium[0] : thumbPlaceholderPath)) + ')' }"
class="card-thumbnail">
<img
<img
:alt="$i18n.get('label_thumbnail')"
v-if="item.thumbnail != undefined"
:src="item['thumbnail']['tainacan-medium'] ? item['thumbnail']['tainacan-medium'][0] : (item['thumbnail'].medium ? item['thumbnail'].medium[0] : thumbPlaceholderPath)">
@ -459,7 +459,7 @@
<div class="list-metadata media-body">
<!-- Description -->
<p
<p
v-tooltip="{
delay: {
show: 500,
@ -469,11 +469,11 @@
html: true,
autoHide: false,
placement: 'auto-start'
}"
}"
class="metadata-description"
v-html="item.description != undefined && item.description != '' ? getLimitedDescription(item.description) : `<span class='has-text-gray3 is-italic'>` + $i18n.get('label_description_not_informed') + `</span>`" />
<!-- Author-->
<p
<p
v-tooltip="{
delay: {
show: 500,
@ -483,12 +483,12 @@
html: false,
autoHide: false,
placement: 'auto-start'
}"
class="metadata-author-creation">
}"
class="metadata-author-creation">
{{ $i18n.get('info_created_by') + ' ' + (item.author_name != undefined ? item.author_name : '') }}
</p>
</p>
<!-- Creation Date-->
<p
<p
v-tooltip="{
delay: {
show: 500,
@ -498,13 +498,13 @@
html: false,
autoHide: false,
placement: 'auto-start'
}"
class="metadata-author-creation">
}"
class="metadata-author-creation">
{{ $i18n.get('info_date') + ' ' + (item.creation_date != undefined ? parseDateToNavigatorLanguage(item.creation_date) : '') }}
</p>
</p>
</div>
</div>
</div>
</div>
@ -512,16 +512,16 @@
<masonry
role="list"
:cols="{default: 4, 1919: 3, 1407: 2, 1215: 2, 1023: 1, 767: 1, 343: 1}"
:gutter="30"
:gutter="30"
class="tainacan-records-container"
v-if="viewMode == 'records'">
<div
<div
role="listitem"
:key="index"
v-for="(item, index) of items"
:class="{ 'selected-record': getSelectedItemChecked(item.id) == true }"
class="tainacan-record">
<!-- Checkbox -->
<!-- TODO: Remove v-if="collectionId" from this element when the bulk edit in repository is done -->
<div
@ -539,12 +539,12 @@
<span class="control-label" />
</label>
</div>
<!-- Title -->
<div
class="metadata-title"
:style="{ 'padding-left': !collectionId ? '1.5rem !important' : '2.75rem' }">
<p
<p
v-tooltip="{
delay: {
show: 500,
@ -560,8 +560,8 @@
v-if="collectionId != undefined && column.display && column.metadata_type_object != undefined && (column.metadata_type_object.related_mapped_prop == 'title')"
@click.left="onClickItem($event, item)"
@click.right="onRightClickItem($event, item)"
v-html="item.metadata != undefined ? renderMetadata(item.metadata, column) : ''" />
<p
v-html="item.metadata != undefined ? renderMetadata(item.metadata, column) : ''" />
<p
v-tooltip="{
delay: {
show: 500,
@ -577,17 +577,17 @@
v-if="collectionId == undefined && column.display && column.metadata_type_object != undefined && (column.metadata_type_object.related_mapped_prop == 'title')"
@click.left="onClickItem($event, item)"
@click.right="onRightClickItem($event, item)"
v-html="item.title != undefined ? item.title : ''" />
v-html="item.title != undefined ? item.title : ''" />
</div>
<!-- Actions -->
<div
<div
v-if="item.current_user_can_edit && !$route.query.iframemode"
class="actions-area"
:label="$i18n.get('label_actions')">
<a
v-if="!isOnTrash"
id="button-edit"
:aria-label="$i18n.getFrom('items','edit_item')"
id="button-edit"
:aria-label="$i18n.getFrom('items','edit_item')"
@click.prevent.stop="goToItemEditPage(item)">
<span
v-tooltip="{
@ -615,8 +615,8 @@
</a>
<a
v-if="collectionId"
id="button-delete"
:aria-label="$i18n.get('label_button_delete')"
id="button-delete"
:aria-label="$i18n.get('label_button_delete')"
@click.prevent.stop="deleteOneItem(item.id)">
<span
v-tooltip="{
@ -625,62 +625,62 @@
placement: 'auto'
}"
class="icon">
<i
<i
:class="{ 'tainacan-icon-delete': !isOnTrash, 'tainacan-icon-deleteforever': isOnTrash }"
class="has-text-secondary tainacan-icon tainacan-icon-20px"/>
</span>
</a>
</div>
<!-- Remaining metadata -->
<div
<!-- Remaining metadata -->
<div
class="media"
@click.left="onClickItem($event, item)"
@click.right="onRightClickItem($event, item)">
<div class="list-metadata media-body">
<div class="tainacan-record-thumbnail">
<img
<img
:alt="$i18n.get('label_thumbnail')"
v-if="item.thumbnail != undefined"
:src="item['thumbnail']['tainacan-medium-full'] ? item['thumbnail']['tainacan-medium-full'][0] : (item['thumbnail'].medium_large ? item['thumbnail'].medium_large[0] : thumbPlaceholderPath)">
:src="item['thumbnail']['tainacan-medium-full'] ? item['thumbnail']['tainacan-medium-full'][0] : (item['thumbnail'].medium_large ? item['thumbnail'].medium_large[0] : thumbPlaceholderPath)">
</div>
<span
<span
v-for="(column, index) in tableMetadata"
:key="index"
:class="{ 'metadata-type-textarea': column.metadata_type_object != undefined && column.metadata_type_object.component == 'tainacan-textarea' }"
v-if="collectionId == undefined && column.display && column.metadata_type_object != undefined && (column.metadata_type_object.related_mapped_prop == 'description')">
<h3 class="metadata-label">{{ $i18n.get('label_description') }}</h3>
<p
<p
v-html="item.description != undefined ? item.description : ''"
class="metadata-value"/>
</span>
<span
<span
v-for="(column, index) in tableMetadata"
:key="index"
:class="{ 'metadata-type-textarea': column.metadata_type_object != undefined && column.metadata_type_object.component == 'tainacan-textarea' }"
v-if="renderMetadata(item.metadata, column) != '' && column.display && column.slug != 'thumbnail' && column.metadata_type_object != undefined && (column.metadata_type_object.related_mapped_prop != 'title')">
<h3 class="metadata-label">{{ column.name }}</h3>
<p
<p
v-html="renderMetadata(item.metadata, column)"
class="metadata-value"/>
</span>
<span
<span
v-for="(column, index) in tableMetadata"
:key="index"
v-if="(column.metadatum == 'row_creation' || column.metadatum == 'row_author') && item[column.slug] != undefined">
<h3 class="metadata-label">{{ column.name }}</h3>
<p
<p
v-html="column.metadatum == 'row_creation' ? parseDateToNavigatorLanguage(item[column.slug]) : item[column.slug]"
class="metadata-value"/>
</span>
</div>
</div>
</div>
</masonry>
<!-- TABLE VIEW MODE -->
<table
<table
v-if="viewMode == 'table'"
class="tainacan-table">
<thead>
@ -692,18 +692,18 @@
<!-- nothing to show on header for checkboxes -->
</th>
<!-- Displayed Metadata -->
<th
<th
v-for="(column, index) in tableMetadata"
:key="index"
v-if="column.display"
class="column-default-width"
:class="{
'thumbnail-cell': column.metadatum == 'row_thumbnail',
'column-small-width' : column.metadata_type_object != undefined ? (column.metadata_type_object.primitive_type == 'date' ||
'column-small-width' : column.metadata_type_object != undefined ? (column.metadata_type_object.primitive_type == 'date' ||
column.metadata_type_object.primitive_type == 'float' ||
column.metadata_type_object.primitive_type == 'int') : false,
'column-medium-width' : column.metadata_type_object != undefined ? (column.metadata_type_object.primitive_type == 'term' ||
column.metadata_type_object.primitive_type == 'item' ||
'column-medium-width' : column.metadata_type_object != undefined ? (column.metadata_type_object.primitive_type == 'term' ||
column.metadata_type_object.primitive_type == 'item' ||
column.metadata_type_object.primitive_type == 'compound') : false,
'column-large-width' : column.metadata_type_object != undefined ? (column.metadata_type_object.primitive_type == 'long_string' || column.metadata_type_object.related_mapped_prop == 'description') : false,
}">
@ -716,10 +716,10 @@
</tr>
</thead>
<tbody>
<tr
:class="{
'selected-row': getSelectedItemChecked(item.id) == true,
'highlighted-item': highlightedItem == item.id
<tr
:class="{
'selected-row': getSelectedItemChecked(item.id) == true,
'highlighted-item': highlightedItem == item.id
}"
:key="index"
v-for="(item, index) of items">
@ -729,14 +729,14 @@
v-if="collectionId && !$route.query.readmode"
:class="{ 'is-selecting': isSelectingItems }"
class="checkbox-cell">
<b-checkbox
<b-checkbox
size="is-small"
:value="getSelectedItemChecked(item.id)"
@input="setSelectedItemChecked(item.id)"/>
</td>
<!-- Item Displayed Metadata -->
<td
<td
:key="columnIndex"
v-for="(column, columnIndex) in tableMetadata"
v-if="column.display"
@ -744,13 +744,13 @@
:class="{ 'metadata-type-textarea': column.metadata_type_object != undefined && column.metadata_type_object.component == 'tainacan-textarea',
'thumbnail-cell': column.metadatum == 'row_thumbnail',
'column-main-content' : column.metadata_type_object != undefined ? (column.metadata_type_object.related_mapped_prop == 'title') : false,
'column-needed-width column-align-right' : column.metadata_type_object != undefined ? (column.metadata_type_object.primitive_type == 'float' ||
'column-needed-width column-align-right' : column.metadata_type_object != undefined ? (column.metadata_type_object.primitive_type == 'float' ||
column.metadata_type_object.primitive_type == 'int' ) : false,
'column-small-width' : column.metadata_type_object != undefined ? (column.metadata_type_object.primitive_type == 'date' ||
'column-small-width' : column.metadata_type_object != undefined ? (column.metadata_type_object.primitive_type == 'date' ||
column.metadata_type_object.primitive_type == 'int' ||
column.metadata_type_object.primitive_type == 'float') : false,
'column-medium-width' : column.metadata_type_object != undefined ? (column.metadata_type_object.primitive_type == 'item' ||
column.metadata_type_object.primitive_type == 'term' ||
'column-medium-width' : column.metadata_type_object != undefined ? (column.metadata_type_object.primitive_type == 'item' ||
column.metadata_type_object.primitive_type == 'term' ||
column.metadata_type_object.primitive_type == 'compound') : false,
'column-large-width' : column.metadata_type_object != undefined ? (column.metadata_type_object.primitive_type == 'long_string' || column.metadata_type_object.related_mapped_prop == 'description') : false,
}"
@ -769,7 +769,7 @@
placement: 'auto-start'
}"
v-if="collectionId == undefined &&
column.metadata_type_object != undefined &&
column.metadata_type_object != undefined &&
column.metadata_type_object.related_mapped_prop == 'title'"
v-html="`<span class='sr-only'>` + column.name + ': </span>' + ((item.title != undefined && item.title != '') ? item.title : `<span class='has-text-gray3 is-italic'>` + $i18n.get('label_value_not_informed') + `</span>`)"/>
<p
@ -784,7 +784,7 @@
placement: 'auto-start'
}"
v-if="collectionId == undefined &&
column.metadata_type_object != undefined &&
column.metadata_type_object != undefined &&
column.metadata_type_object.related_mapped_prop == 'description'"
v-html="`<span class='sr-only'>` + column.name + ': </span>' + ((item.description != undefined && item.description) != '' ? item.description : `<span class='has-text-gray3 is-italic'>` + $i18n.get('label_value_not_informed') + `</span>`)"/>
<p
@ -809,12 +809,12 @@
v-html="renderMetadata(item.metadata, column) != '' ? renderMetadata(item.metadata, column) : `<span class='has-text-gray3 is-italic'>` + $i18n.get('label_value_not_informed') + `</span>`"/>
<span v-if="column.metadatum == 'row_thumbnail'">
<img
<img
:alt="$i18n.get('label_thumbnail')"
class="table-thumb"
class="table-thumb"
:src="item['thumbnail']['tainacan-small'] ? item['thumbnail']['tainacan-small'][0] : (item['thumbnail'].thumbnail ? item['thumbnail'].thumbnail[0] : thumbPlaceholderPath)">
</span>
<p
</span>
<p
v-tooltip="{
delay: {
show: 500,
@ -828,7 +828,7 @@
v-if="column.metadatum == 'row_author'">
{{ item[column.slug] }}
</p>
<p
<p
v-tooltip="{
delay: {
show: 500,
@ -846,15 +846,15 @@
</td>
<!-- Actions -->
<td
<td
v-if="item.current_user_can_edit && !$route.query.iframemode"
class="actions-cell"
:label="$i18n.get('label_actions')">
<div class="actions-container">
<a
v-if="!isOnTrash"
id="button-edit"
:aria-label="$i18n.getFrom('items','edit_item')"
id="button-edit"
:aria-label="$i18n.getFrom('items','edit_item')"
@click.prevent.stop="goToItemEditPage(item)">
<span
v-tooltip="{
@ -882,8 +882,8 @@
</a>
<a
v-if="collectionId"
id="button-delete"
:aria-label="$i18n.get('label_button_delete')"
id="button-delete"
:aria-label="$i18n.get('label_button_delete')"
@click.prevent.stop="deleteOneItem(item.id)">
<span
v-tooltip="{
@ -892,7 +892,7 @@
placement: 'auto'
}"
class="icon">
<i
<i
:class="{ 'tainacan-icon-delete': !isOnTrash, 'tainacan-icon-deleteforever': isOnTrash }"
class="has-text-secondary tainacan-icon tainacan-icon-20px"/>
</span>
@ -902,7 +902,7 @@
</tr>
</tbody>
</table>
</div>
</div>
</div>
</template>
@ -952,7 +952,7 @@ export default {
selectedItems () {
if (this.$route.query.iframemode)
this.$eventBusSearch.setSelectedItemsForIframe(this.getSelectedItems());
return this.getSelectedItems();
},
isSelectingItems () {
@ -989,6 +989,7 @@ export default {
]),
...mapActions('bulkedition', [
'createEditGroup',
'createSequenceEditGroup',
'trashItemsInBulk',
'deleteItemsInBulk',
'untrashItemsInBulk'
@ -1036,11 +1037,9 @@ export default {
});
},
sequenceEditSelectedItems() {
this.createEditGroup({
this.createSequenceEditGroup({
object: Object.keys(this.queryAllItemsSelected).length ? this.queryAllItemsSelected : this.selectedItems,
collectionID: this.collectionId,
order: this.getOrder(),
orderBy: this.getOrderBy()
collectionID: this.collectionId
}).then(() => {
let sequenceId = this.getGroupID();
this.$router.push(this.$routerHelper.getCollectionSequenceEditPath(this.collectionId, sequenceId, 1));
@ -1057,7 +1056,7 @@ export default {
}
},
makeCopiesOfOneItem(itemId) {
this.$buefy.modal.open({
parent: this,
component: ItemCopyDialog,
@ -1283,7 +1282,7 @@ export default {
@import "../../scss/_view-mode-records.scss";
.selection-control {
padding: 6px 0px 0px 12px;
background: white;
height: 40px;

40
src/api/endpoints/class-tainacan-rest-sequence-edit-controller.php
View File

@ -36,15 +36,15 @@ class REST_Sequence_Edit_Controller extends REST_Controller {
),
)
);
//register_rest_route($this->namespace, '/collection/(?P<collection_id>[\d]+)/' . $this->rest_base . '/(?P<group_id>[0-9a-f]+)',
// array(
// array(
// 'methods' => \WP_REST_Server::READABLE,
// 'callback' => array($this, 'get_item'),
// 'permission_callback' => array($this, 'sequence_edit_permissions_check'),
// ),
// )
//);
register_rest_route($this->namespace, '/collection/(?P<collection_id>[\d]+)/' . $this->rest_base . '/(?P<group_id>[0-9a-f]+)',
array(
array(
'methods' => \WP_REST_Server::READABLE,
'callback' => array($this, 'get_item'),
'permission_callback' => array($this, 'sequence_edit_permissions_check'),
),
)
);
register_rest_route($this->namespace, '/collection/(?P<collection_id>[\d]+)/' . $this->rest_base . '/(?P<group_id>[0-9a-f]+)/(?P<sequence_index>[\d]+)',
array(
array(
@ -79,6 +79,7 @@ class REST_Sequence_Edit_Controller extends REST_Controller {
$args['items_ids'] = $body['items_ids'];
$count = sizeof($args['items_ids']);
$args['items_count'] = $count;
} elseif ( isset($body['use_query']) && $body['use_query'] ) {
@ -98,6 +99,8 @@ class REST_Sequence_Edit_Controller extends REST_Controller {
$items_q = $this->items_repository->fetch( $query_args, $collection_id );
$count = $items_q->found_posts;
$args['items_count'] = $count;
} else {
return new \WP_REST_Response([
@ -118,12 +121,29 @@ class REST_Sequence_Edit_Controller extends REST_Controller {
return $rest_response;
}
public function get_item($request) {
$group_id = $request['group_id'];
$group = get_option('tnc_transient_' . $group_id);
if ( is_array($group) ) {
return new \WP_REST_Response( $group, 200 );
}
return new \WP_REST_Response([
'error_message' => __('Item not found.', 'tainacan'),
], 404);
}
public function get_item_in_sequence($request) {
$group_id = $request['group_id'];
$index = (int) $request['sequence_index'];
$group = get_option('tnc_transient_' . $group_id);
//ar_dump($group);
if ( is_array($group) ) {
if ( isset($group['items_ids']) && is_array($group['items_ids']) ) {

50
src/js/store/modules/bulk-edition/actions.js
View File

@ -50,6 +50,21 @@ export const fetchGroup = ({commit}, { collectionId, groupId }) => {
});
};
export const fetchSequenceGroup = ({commit}, { collectionId, groupId }) => {
return new Promise ((resolve, reject) => {
axios.tainacan.get(`/collection/${collectionId}/sequence-edit/${groupId}`)
.then(response => {
commit('setGroup', response.data);
resolve(response.data);
})
.catch(error => {
console.log(error);
reject(error);
});
});
};
export const setValueInBulk = ({commit}, parameters) => {
let groupID = parameters.groupID;
let collectionID = parameters.collectionID;
@ -203,7 +218,7 @@ export const deleteItemsInBulk = ({commit}, parameters) => {
export const fetchItemIdInSequence = ({commit}, { collectionId, sequenceId, itemPosition }) => {
return new Promise ((resolve, reject) => {
axios.tainacan.get(`/collection/${collectionId}/bulk-edit/${sequenceId}/sequence/${itemPosition}`)
axios.tainacan.get(`/collection/${collectionId}/sequence-edit/${sequenceId}/${itemPosition}`)
.then(response => {
commit('setItemIdInSequence', response.data);
resolve(response.data);
@ -215,7 +230,38 @@ export const fetchItemIdInSequence = ({commit}, { collectionId, sequenceId, item
});
};
export const createSequenceEditGroup = ({commit}, parameters) => {
let object = parameters.object;
let collectionID = parameters.collectionID;
let sequenceEditParams = null;
if(object.constructor.name === 'Array'){
sequenceEditParams = {
items_ids: object,
};
} else if(object.constructor.name === 'Object'){
sequenceEditParams = {
use_query: object,
};
}
return new Promise ((resolve, reject) => {
axios.tainacan.post(`/collection/${collectionID}/sequence-edit`, sequenceEditParams)
.then(response => {
commit('setGroup', response.data);
resolve(response.data);
})
.catch(error => {
console.error(error);
reject(error);
});
});
};
// BULK ADD SPECIFIC
export const setBulkAddItems = ({commit}, items) => {
commit('setBulkAddItems', items);
};
};