From 318a43805805fbe42b42fd4ceafdbae9d83477c9 Mon Sep 17 00:00:00 2001 From: Mateus Machado Luna Date: Tue, 30 Oct 2018 14:07:59 -0300 Subject: [PATCH] Error output on form submission after status change. --- .../item-metadata-bulk-edition-form.vue | 244 ++++++++++++------ src/admin/scss/_buttons.scss | 5 +- 2 files changed, 168 insertions(+), 81 deletions(-) diff --git a/src/admin/components/edition/item-metadata-bulk-edition-form.vue b/src/admin/components/edition/item-metadata-bulk-edition-form.vue index 9c08251e2..edf5b44a5 100644 --- a/src/admin/components/edition/item-metadata-bulk-edition-form.vue +++ b/src/admin/components/edition/item-metadata-bulk-edition-form.vue @@ -88,42 +88,36 @@ + :message="getErrorMessage(formErrors[metadatum.id])" + :type="getErrorMessage(formErrors[metadatum.id]) != '' ? 'is-danger' : ''"> + @click="changeCollapse(!metadatumCollapses[index], index)"> + :icon="metadatumCollapses[index] ? 'menu-down' : 'menu-right'" /> * + class="required-metadatum-asterisk">* ({{ $i18n.get(metadatum.metadata_type_object.component) }}) -
- - - +
+ +
@@ -155,14 +149,17 @@
{{ $i18n.get('label_send_to_trash') }}
{{ $i18n.get('label_send_to_trash') }}
@@ -220,12 +224,15 @@ export default { isLoadingItems: false, isLoadingMetadata: false, isExecutingBulkEdit: false, + isUpdatingItems: false, + isTrashingItems: false, + isPublishingItems: false, collectionName: '', items: '', visibility: 'publish', collapseAll: true, metadatumCollapses: [], - metadatumTypeMessage:'', + formErrors: {}, status: 'draft', groupID: null } @@ -236,6 +243,9 @@ export default { } }, methods: { + ...mapActions('item', [ + 'updateItem' + ]), ...mapActions('collection', [ 'fetchCollectionName' ]), @@ -253,7 +263,8 @@ export default { 'setStatusInBulk', 'removeValueInBulk', 'deleteItemsInBulk', - 'trashItemsInBulk' + 'trashItemsInBulk', + 'fetchItemIdInSequence' ]), ...mapGetters('bulkedition', [ 'getItemIdInSequence', @@ -268,76 +279,60 @@ export default { changeCollapse(event, index) { this.metadatumCollapses.splice(index, 1, event); }, - getErrorMessage(metadatum) { - - let msg = ''; - // let errors = eventBus.getErrors(metadatum.id); - - // if ( errors) { - // this.metadatumTypeMessage = 'is-danger'; - // for (let error of errors) { - // for (let index of Object.keys(error)) { - // // this.$console.log(index); - // msg += error[index] + '\n'; - // } - // } - // } else { - // this.metadatumTypeMessage = ''; - // } - - return msg; - }, - isTextInputComponent( component ){ - let array = ['tainacan-relationship','tainacan-taxonomy']; - return !( array.indexOf( component ) >= 0 ); - }, bulkEdit: _.debounce(function(newValue, metadatum) { - this.isExecutingBulkEdit = true; - this.setValueInBulk({ - collectionID: this.collectionId, - groupID: this.groupID, - bodyParams: { - metadatum_id: metadatum.id, - value: newValue, - } - }).then(() => { - this.isExecutingBulkEdit = false; - // this.finalizeProcedure(criterion); - }).catch(() => this.isExecutingBulkEdit = false); + let values = []; + if (!(Array.isArray(newValue))) + values.push(newValue); + else + values = newValue; + + for (let value of values) { + this.isExecutingBulkEdit = true; + this.setValueInBulk({ + collectionID: this.collectionId, + groupID: this.groupID, + bodyParams: { + metadatum_id: metadatum.id, + value: value, + } + }).then(() => { + this.isExecutingBulkEdit = false; + // this.finalizeProcedure(criterion); + }).catch(() => this.isExecutingBulkEdit = false); + } + }, 1000), onSubmit(status) { this.isExecutingBulkEdit = true; - console.log(status) + if (this.status != status && status != 'trash') { - - this.setStatusInBulk({ - groupID: this.groupID, - collectionID: this.collectionId, - bodyParams: { value: status } - }).then(() => { - this.status = status; - this.isExecutingBulkEdit = false; - - if (this.status != 'draft' && this.status != 'auto-draft') - this.$router.push(this.$routerHelper.getCollectionItemsPath(this.collectionId)); - }).catch(() => this.isExecutingBulkEdit = false); + this.changeStatus(status); } else if (this.status != status && status == 'trash') { - + + this.isTrashingItems = true; this.trashItemsInBulk({ groupID: this.groupID, collectionID: this.collectionId }).then(() => { this.status = status; + this.isTrashingItems = false; this.isExecutingBulkEdit = false; this.$router.push(this.$routerHelper.getCollectionItemsPath(this.collectionId)); - }).catch(() => this.isExecutingBulkEdit = false); + }).catch(() => { + this.isExecutingBulkEdit = false; + this.isTrashingItems = false; + }); } else { - - // Triggers updating animation. + + // Sets loading to cause a visual impression of updating this.isExecutingBulkEdit = true; - this.isExecutingBulkEdit = false; + this.isUpdatingItems = true; + setTimeout(() => { + this.isExecutingBulkEdit = false; + this.isUpdatingItems = false; + }, 1000); if (this.status != 'draft' && this.status != 'auto-draft') this.$router.push(this.$routerHelper.getCollectionItemsPath(this.collectionId)); @@ -345,17 +340,95 @@ export default { }, onDeletePermanently() { this.isExecutingBulkEdit = true; + this.isTrashingItems = true; this.deleteItemsInBulk({ collectionID: this.collectionId, groupID: this.groupID }).then(() => { this.isExecutingBulkEdit = false; + this.isTrashingItems = false; this.$router.push(this.$routerHelper.getCollectionItemsPath(this.collectionId)); - }).catch(() => this.isExecutingBulkEdit = false); + }).catch(() => { + this.isExecutingBulkEdit = false; + this.isTrashingItems = false; + }); }, onDiscard() { this.$router.push(this.$routerHelper.getCollectionItemsPath(this.collectionId)); - } + }, + changeStatus(status) { + this.isPublishingItems = true; + + // Gets an item from the bulk group + this.fetchItemIdInSequence({ collectionId: this.collectionId, sequenceId: this.groupID, itemPosition: 1 }) + .then((itemId) => { + + // Test if this item can be set to this status + this.updateItem({ id: itemId, status: status }) + .then(() => { + + // The status can be applied to everyone. + this.setStatusInBulk({ + groupID: this.groupID, + collectionID: this.collectionId, + bodyParams: { value: status } + }).then(() => { + + this.status = status; + this.isPublishingItems = false; + this.isExecutingBulkEdit = false; + + if (this.status != 'draft' && this.status != 'auto-draft') + this.$router.push(this.$routerHelper.getCollectionItemsPath(this.collectionId)); + + }).catch(() => { + this.isPublishingItems = false; + this.isExecutingBulkEdit = false; + }); + }) + .catch((errors) => { + // The status can not be applied. + this.isPublishingItems = false; + this.isExecutingBulkEdit = false; + + for (let error of errors.errors) { + for (let metadatum of Object.keys(error)){ + this.formErrors[metadatum] = error[metadatum]; + } + } + this.formErrorMessage = errors.error_message; + }); + }) + .catch(() => { + this.isPublishingItems = false; + this.isExecutingBulkEdit = false; + }); + }, + clearErrorMessage(metadatumId) { + console.log(this.formErrors[metadatumId]); + this.formErrors[metadatumId] = false; + let amountClean = 0; + + for (let formError in this.formErrors) { + if (formError == false || formError == undefined) + amountClean++; + } + + if (amountClean == 0) + this.formErrorMessage = ''; + }, + getErrorMessage(errors) { + + let msg = ''; + if ( errors != undefined && errors != false) { + for (let error of errors) { + for (let index of Object.keys(error)) { + msg += error[index] + '\n'; + } + } + } + return msg; + }, }, created() { // Obtains collection ID @@ -480,6 +553,17 @@ export default { .column { + .section-status{ + padding: 16px 0; + .field .b-radio { + margin-right: 24px; + .icon { + font-size: 18px !important; + color: $gray3; + } + } + } + .section-label { position: relative; label { diff --git a/src/admin/scss/_buttons.scss b/src/admin/scss/_buttons.scss index 70d3cefbc..f656622da 100644 --- a/src/admin/scss/_buttons.scss +++ b/src/admin/scss/_buttons.scss @@ -28,10 +28,13 @@ transform: none !important; } &.is-outlined { - color: $turquoise5 !important; + color: $turquoise5; background-color: white !important; border-color: $gray4 !important; } + &.is-outlined:hover { + color: $turquoise5 !important; + } &:focus { outline: 0px; }