Show errors on TermEditionForm. Fixes loading loop when switching to Terms tab in a not-saved Category edition page.
This commit is contained in:
parent
83ac7239d5
commit
57d3fc5905
|
@ -147,7 +147,7 @@
|
|||
mixins: [ wpAjax ],
|
||||
data(){
|
||||
return {
|
||||
categoryId: Number,
|
||||
categoryId: String,
|
||||
activeTab: 0,
|
||||
category: null,
|
||||
isLoadingCategory: false,
|
||||
|
@ -184,7 +184,7 @@
|
|||
'createCategory',
|
||||
'updateCategory',
|
||||
'fetchCategory',
|
||||
'fetchOnlySlug',
|
||||
'fetchOnlySlug'
|
||||
]),
|
||||
...mapGetters('category',[
|
||||
'getCategory',
|
||||
|
|
|
@ -222,13 +222,11 @@ export default {
|
|||
this.$router.push(this.$routerHelper.getItemPath(this.form.collectionId, this.itemId));
|
||||
})
|
||||
.catch((errors) => {
|
||||
this.$console.log(errors);
|
||||
for (let error of errors.errors) {
|
||||
for (let attribute of Object.keys(error)){
|
||||
eventBus.errors.push({ field_id: attribute, errors: error[attribute]});
|
||||
for (let field of Object.keys(error)){
|
||||
eventBus.errors.push({ field_id: attribute, errors: error[field]});
|
||||
}
|
||||
}
|
||||
this.$console.log(eventBus.errors);
|
||||
this.formErrorMessage = errors.error_message;
|
||||
|
||||
this.isLoading = false;
|
||||
|
|
|
@ -6,13 +6,11 @@
|
|||
|
||||
<b-field
|
||||
:addons="false"
|
||||
:type="editForm.name == '' ? 'is-danger' : ''"
|
||||
:message="editForm.name == '' ? $i18n.get('info_name_is_required') : ''">
|
||||
:type="(formErrors.name != '' && formErrors.name != undefined) ? 'is-danger' : ''"
|
||||
:message="formErrors.name">
|
||||
<label class="label">
|
||||
{{ $i18n.get('label_name') }}
|
||||
<span
|
||||
class="required-term-asterisk"
|
||||
:class="editForm.name == '' ? 'is-danger' : ''">*</span>
|
||||
<span class="required-term-asterisk">*</span>
|
||||
<help-button
|
||||
:title="$i18n.getHelperTitle('terms', 'name')"
|
||||
:message="$i18n.getHelperMessage('terms', 'name')"/>
|
||||
|
@ -22,7 +20,10 @@
|
|||
name="name"/>
|
||||
</b-field>
|
||||
|
||||
<b-field :addons="false">
|
||||
<b-field
|
||||
:addons="false"
|
||||
:type="formErrors['description'] != '' && formErrors['description'] != undefined ? 'is-danger' : ''"
|
||||
:message="formErrors['description']">
|
||||
<label class="label">
|
||||
{{ $i18n.get('label_description') }}
|
||||
<help-button
|
||||
|
@ -47,8 +48,7 @@
|
|||
<div class="control">
|
||||
<button
|
||||
class="button is-success"
|
||||
type="submit"
|
||||
:disabled="editForm.name == '' || editForm.name == undefined">
|
||||
type="submit">
|
||||
{{ $i18n.get('save') }}
|
||||
</button>
|
||||
</div>
|
||||
|
@ -61,6 +61,11 @@ import { mapActions, mapGetters } from 'vuex';
|
|||
|
||||
export default {
|
||||
name: 'TermEditionForm',
|
||||
data () {
|
||||
return {
|
||||
formErrors: {}
|
||||
}
|
||||
},
|
||||
props: {
|
||||
editForm: Object,
|
||||
categoryId: ''
|
||||
|
@ -84,11 +89,16 @@ export default {
|
|||
})
|
||||
.then(() => {
|
||||
this.editForm = {};
|
||||
this.formErrors = {};
|
||||
this.$emit('onEditionFinished');
|
||||
})
|
||||
.catch((error) => {
|
||||
.catch((errors) => {
|
||||
for (let error of errors.errors) {
|
||||
for (let field of Object.keys(error)){
|
||||
this.$set(this.formErrors, field, (this.formErrors[field] != undefined ? this.formErrors[field] : '') + error[field] + '\n');
|
||||
}
|
||||
}
|
||||
this.$emit('onErrorFound');
|
||||
this.$console.log(error);
|
||||
});
|
||||
|
||||
} else {
|
||||
|
@ -101,11 +111,16 @@ export default {
|
|||
})
|
||||
.then(() => {
|
||||
this.editForm.saved = true;
|
||||
this.formErrors = {};
|
||||
this.$emit('onEditionFinished');
|
||||
})
|
||||
.catch((error) => {
|
||||
.catch((errors) => {
|
||||
for (let error of errors.errors) {
|
||||
for (let field of Object.keys(error)){
|
||||
this.$set(this.formErrors, field, (this.formErrors[field] != undefined ? this.formErrors[field] : '') + error[field] + '\n');
|
||||
}
|
||||
}
|
||||
this.$emit('onErrorFound');
|
||||
this.$console.log(error);
|
||||
});
|
||||
}
|
||||
},
|
||||
|
|
|
@ -97,37 +97,19 @@ export default {
|
|||
watch: {
|
||||
termsList() {
|
||||
this.generateOrderedTerms();
|
||||
},
|
||||
categoryId() {
|
||||
this.loadTerms();
|
||||
}
|
||||
},
|
||||
components: {
|
||||
TermEditionForm
|
||||
},
|
||||
beforeRouteUpdate ( to, from, next ) {
|
||||
let hasUnsavedForms = false;
|
||||
for (let term in this.orderedTermsList) {
|
||||
if (!term.saved || term.opened || term.id == 'new')
|
||||
hasUnsavedForms = true;
|
||||
}
|
||||
if (hasUnsavedForms) {
|
||||
this.$dialog.confirm({
|
||||
message: this.$i18n.get('info_warning_terms_not_saved'),
|
||||
onConfirm: () => {
|
||||
this.onEditionCanceled();
|
||||
next();
|
||||
},
|
||||
cancelText: this.$i18n.get('cancel'),
|
||||
confirmText: this.$i18n.get('continue'),
|
||||
type: 'is-secondary'
|
||||
});
|
||||
} else {
|
||||
next()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
...mapActions('category', [
|
||||
'fetchTerms',
|
||||
'updateTerm',
|
||||
'deleteTerm'
|
||||
'deleteTerm',
|
||||
'fetchTerms'
|
||||
]),
|
||||
...mapGetters('category',[
|
||||
'getTerms'
|
||||
|
@ -299,7 +281,8 @@ export default {
|
|||
term.opened = (this.orderedTermsList[term.id].opened == undefined ? false : this.orderedTermsList[term.id].opened);
|
||||
term.saved = (this.orderedTermsList[term.id].saved == undefined ? true : this.orderedTermsList[term.id].saved);
|
||||
}
|
||||
this.orderedTermsList.push(JSON.parse(JSON.stringify(term)));
|
||||
if (term.taxonomy != null)
|
||||
this.orderedTermsList.push(JSON.parse(JSON.stringify(term)));
|
||||
|
||||
this.buildOrderedTermsList(term.id, termDepth + 1);
|
||||
}
|
||||
|
@ -314,22 +297,26 @@ export default {
|
|||
return this.termsList[originalIndex].name;
|
||||
else
|
||||
return term.name;
|
||||
},
|
||||
loadTerms() {
|
||||
this.isLoadingTerms = true;
|
||||
this.fetchTerms(this.categoryId)
|
||||
.then(() => {
|
||||
// Fill this.form data with current data.
|
||||
this.isLoadingTerms = false;
|
||||
this.generateOrderedTerms();
|
||||
})
|
||||
.catch((error) => {
|
||||
this.$console.log(error);
|
||||
});
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
||||
this.isLoadingTerms = true;
|
||||
|
||||
this.fetchTerms(this.categoryId)
|
||||
.then(() => {
|
||||
// Fill this.form data with current data.
|
||||
this.isLoadingTerms = false;
|
||||
this.generateOrderedTerms();
|
||||
})
|
||||
.catch((error) => {
|
||||
this.$console.log(error);
|
||||
});
|
||||
if (this.categoryId !== String) {
|
||||
this.loadTerms();
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
|
@ -83,6 +83,7 @@ html {
|
|||
padding: 1em 1.2em 0.4em 1.2em;
|
||||
margin-bottom: 0px;
|
||||
.button {
|
||||
border-width: 1px;
|
||||
padding: 2px 30px !important;
|
||||
}
|
||||
.button.is-outlined {
|
||||
|
@ -154,7 +155,7 @@ html {
|
|||
|
||||
// Some components have a different style in listing pages
|
||||
.button {
|
||||
border: none;
|
||||
border-width: 0;
|
||||
border-radius: 6px !important;
|
||||
font-weight: normal;
|
||||
padding: 2px 15px !important;
|
||||
|
|
|
@ -125,7 +125,7 @@ export const sendTerm = ({commit}, { categoryId, name, description, parent }) =>
|
|||
resolve( term );
|
||||
})
|
||||
.catch(error => {
|
||||
reject( error );
|
||||
reject({ error_message: error['response']['data'].error_message, errors: error['response']['data'].errors });
|
||||
});
|
||||
});
|
||||
};
|
||||
|
@ -139,7 +139,7 @@ export const deleteTerm = ({ commit }, { categoryId, termId }) => {
|
|||
resolve( term );
|
||||
})
|
||||
.catch(error => {
|
||||
reject( error )
|
||||
reject({ error_message: error['response']['data'].error_message, errors: error['response']['data'].errors });
|
||||
});
|
||||
});
|
||||
};
|
||||
|
@ -157,8 +157,7 @@ export const updateTerm = ({ commit }, { categoryId, termId, name, description,
|
|||
resolve( term );
|
||||
})
|
||||
.catch(error => {
|
||||
reject(error)
|
||||
//reject({ error_message: error['response']['data'].error_message, errors: error['response']['data'].errors });
|
||||
reject({ error_message: error['response']['data'].error_message, errors: error['response']['data'].errors });
|
||||
});
|
||||
});
|
||||
};
|
||||
|
|
Loading…
Reference in New Issue