Merge branch 'develop' of https://github.com/tainacan/tainacan into develop
This commit is contained in:
commit
fa7a5eb2c7
|
@ -1,134 +1,137 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="page-container primary-page">
|
||||
<b-tag
|
||||
v-if="category != null && category != undefined"
|
||||
:type="'is-' + getStatusColor(category.status)"
|
||||
v-text="category.status"/>
|
||||
<form
|
||||
v-if="category != null && category != undefined"
|
||||
class="tainacan-form"
|
||||
label-width="120px">
|
||||
<b-tabs v-model="activeTab">
|
||||
|
||||
<!-- Name -------------------------------- -->
|
||||
<b-field
|
||||
:addons="false"
|
||||
:label="$i18n.get('label_name')"
|
||||
:type="editFormErrors['name'] != undefined ? 'is-danger' : ''"
|
||||
:message="editFormErrors['name'] != undefined ? editFormErrors['name'] : ''">
|
||||
<help-button
|
||||
:title="$i18n.getHelperTitle('categories', 'name')"
|
||||
:message="$i18n.getHelperMessage('categories', 'name')"/>
|
||||
<b-input
|
||||
id="tainacan-text-name"
|
||||
v-model="form.name"
|
||||
@focus="clearErrors('name')"
|
||||
@blur="updateSlug()"/>
|
||||
</b-field>
|
||||
<b-tab-item :label="$i18n.get('category')">
|
||||
<b-tag
|
||||
v-if="category != null && category != undefined"
|
||||
:type="'is-' + getStatusColor(category.status)"
|
||||
v-text="category.status"/>
|
||||
<form
|
||||
v-if="category != null && category != undefined"
|
||||
class="tainacan-form"
|
||||
label-width="120px">
|
||||
|
||||
<!-- Description -------------------------------- -->
|
||||
<b-field
|
||||
:addons="false"
|
||||
:label="$i18n.get('label_description')"
|
||||
:type="editFormErrors['description'] != undefined ? 'is-danger' : ''"
|
||||
:message="editFormErrors['description'] != undefined ? editFormErrors['description'] : ''">
|
||||
<help-button
|
||||
:title="$i18n.getHelperTitle('categories', 'description')"
|
||||
:message="$i18n.getHelperMessage('categories', 'description')"/>
|
||||
<b-input
|
||||
id="tainacan-text-description"
|
||||
type="textarea"
|
||||
v-model="form.description"
|
||||
@focus="clearErrors('description')"/>
|
||||
</b-field>
|
||||
<!-- Name -------------------------------- -->
|
||||
<b-field
|
||||
:addons="false"
|
||||
:label="$i18n.get('label_name')"
|
||||
:type="editFormErrors['name'] != undefined ? 'is-danger' : ''"
|
||||
:message="editFormErrors['name'] != undefined ? editFormErrors['name'] : ''">
|
||||
<help-button
|
||||
:title="$i18n.getHelperTitle('categories', 'name')"
|
||||
:message="$i18n.getHelperMessage('categories', 'name')"/>
|
||||
<b-input
|
||||
id="tainacan-text-name"
|
||||
v-model="form.name"
|
||||
@focus="clearErrors('name')"
|
||||
@blur="updateSlug()"/>
|
||||
</b-field>
|
||||
|
||||
<!-- Status -------------------------------- -->
|
||||
<b-field
|
||||
:addons="false"
|
||||
:label="$i18n.get('label_status')"
|
||||
:type="editFormErrors['status'] != undefined ? 'is-danger' : ''"
|
||||
:message="editFormErrors['status'] != undefined ? editFormErrors['status'] : ''">
|
||||
<help-button
|
||||
:title="$i18n.getHelperTitle('categories', 'status')"
|
||||
:message="$i18n.getHelperMessage('categories', 'status')"/>
|
||||
<b-select
|
||||
id="tainacan-select-status"
|
||||
v-model="form.status"
|
||||
@focus="clearErrors('status')"
|
||||
:placeholder="$i18n.get('instruction_select_a_status')">
|
||||
<option
|
||||
v-for="statusOption in statusOptions"
|
||||
:key="statusOption.value"
|
||||
:value="statusOption.value"
|
||||
:disabled="statusOption.disabled">{{ statusOption.label }}
|
||||
</option>
|
||||
</b-select>
|
||||
</b-field>
|
||||
<!-- Description -------------------------------- -->
|
||||
<b-field
|
||||
:addons="false"
|
||||
:label="$i18n.get('label_description')"
|
||||
:type="editFormErrors['description'] != undefined ? 'is-danger' : ''"
|
||||
:message="editFormErrors['description'] != undefined ? editFormErrors['description'] : ''">
|
||||
<help-button
|
||||
:title="$i18n.getHelperTitle('categories', 'description')"
|
||||
:message="$i18n.getHelperMessage('categories', 'description')"/>
|
||||
<b-input
|
||||
id="tainacan-text-description"
|
||||
type="textarea"
|
||||
v-model="form.description"
|
||||
@focus="clearErrors('description')"/>
|
||||
</b-field>
|
||||
|
||||
<!-- Slug -------------------------------- -->
|
||||
<b-field
|
||||
:addons="false"
|
||||
:label="$i18n.get('label_slug')"
|
||||
:type="editFormErrors['slug'] != undefined ? 'is-danger' : ''"
|
||||
:message="editFormErrors['slug'] != undefined ? editFormErrors['slug'] : ''">
|
||||
<help-button
|
||||
:title="$i18n.getHelperTitle('categories', 'slug')"
|
||||
:message="$i18n.getHelperMessage('categories', 'slug')"/>
|
||||
<b-icon :class="{'is-loading': isUpdatingSlug}"/>
|
||||
<b-input
|
||||
@input="updateSlug()"
|
||||
id="tainacan-text-slug"
|
||||
v-model="form.slug"
|
||||
@focus="clearErrors('slug')"
|
||||
:disabled="isUpdatingSlug"/>
|
||||
</b-field>
|
||||
<!-- Status -------------------------------- -->
|
||||
<b-field
|
||||
:addons="false"
|
||||
:label="$i18n.get('label_status')"
|
||||
:type="editFormErrors['status'] != undefined ? 'is-danger' : ''"
|
||||
:message="editFormErrors['status'] != undefined ? editFormErrors['status'] : ''">
|
||||
<help-button
|
||||
:title="$i18n.getHelperTitle('categories', 'status')"
|
||||
:message="$i18n.getHelperMessage('categories', 'status')"/>
|
||||
<b-select
|
||||
id="tainacan-select-status"
|
||||
v-model="form.status"
|
||||
@focus="clearErrors('status')"
|
||||
:placeholder="$i18n.get('instruction_select_a_status')">
|
||||
<option
|
||||
v-for="statusOption in statusOptions"
|
||||
:key="statusOption.value"
|
||||
:value="statusOption.value"
|
||||
:disabled="statusOption.disabled">{{ statusOption.label }}
|
||||
</option>
|
||||
</b-select>
|
||||
</b-field>
|
||||
|
||||
<!-- Allow Insert -->
|
||||
<b-field
|
||||
:addons="false"
|
||||
:label="$i18n.get('label_category_allow_new_terms')">
|
||||
<help-button
|
||||
:title="$i18n.getHelperTitle('categories', 'allow_insert')"
|
||||
:message="$i18n.getHelperMessage('categories', 'allow_insert')"/>
|
||||
<div class="block" >
|
||||
<b-checkbox
|
||||
v-model="form.allowInsert"
|
||||
true-value="yes"
|
||||
false-value="no">
|
||||
{{ labelNewTerms() }}
|
||||
</b-checkbox>
|
||||
</div>
|
||||
</b-field>
|
||||
<!-- Slug -------------------------------- -->
|
||||
<b-field
|
||||
:addons="false"
|
||||
:label="$i18n.get('label_slug')"
|
||||
:type="editFormErrors['slug'] != undefined ? 'is-danger' : ''"
|
||||
:message="editFormErrors['slug'] != undefined ? editFormErrors['slug'] : ''">
|
||||
<help-button
|
||||
:title="$i18n.getHelperTitle('categories', 'slug')"
|
||||
:message="$i18n.getHelperMessage('categories', 'slug')"/>
|
||||
<b-icon :class="{'is-loading': isUpdatingSlug}"/>
|
||||
<b-input
|
||||
@input="updateSlug()"
|
||||
id="tainacan-text-slug"
|
||||
v-model="form.slug"
|
||||
@focus="clearErrors('slug')"
|
||||
:disabled="isUpdatingSlug"/>
|
||||
</b-field>
|
||||
|
||||
<!-- Terms List -->
|
||||
<b-field
|
||||
:addons="false"
|
||||
:label="$i18n.get('label_category_terms')">
|
||||
<terms-list :category-id="categoryId"/>
|
||||
</b-field>
|
||||
<!-- Allow Insert -->
|
||||
<b-field
|
||||
:addons="false"
|
||||
:label="$i18n.get('label_category_allow_new_terms')">
|
||||
<help-button
|
||||
:title="$i18n.getHelperTitle('categories', 'allow_insert')"
|
||||
:message="$i18n.getHelperMessage('categories', 'allow_insert')"/>
|
||||
<div class="block" >
|
||||
<b-checkbox
|
||||
v-model="form.allowInsert"
|
||||
true-value="yes"
|
||||
false-value="no">
|
||||
{{ labelNewTerms() }}
|
||||
</b-checkbox>
|
||||
</div>
|
||||
</b-field>
|
||||
|
||||
<!-- Submit -->
|
||||
<div class="field is-grouped form-submit">
|
||||
<div class="control">
|
||||
<button
|
||||
id="button-cancel-category-creation"
|
||||
class="button is-outlined"
|
||||
type="button"
|
||||
@click="cancelBack">{{ $i18n.get('cancel') }}</button>
|
||||
</div>
|
||||
<div class="control">
|
||||
<button
|
||||
id="button-submit-category-creation"
|
||||
@click.prevent="onSubmit"
|
||||
class="button is-success">{{ $i18n.get('save') }}</button>
|
||||
</div>
|
||||
</div>
|
||||
<p class="help is-danger">{{ formErrorMessage }}</p>
|
||||
</form>
|
||||
<!-- Submit -->
|
||||
<div class="field is-grouped form-submit">
|
||||
<div class="control">
|
||||
<button
|
||||
id="button-cancel-category-creation"
|
||||
class="button is-outlined"
|
||||
type="button"
|
||||
@click="cancelBack">{{ $i18n.get('cancel') }}</button>
|
||||
</div>
|
||||
<div class="control">
|
||||
<button
|
||||
id="button-submit-category-creation"
|
||||
@click.prevent="onSubmit"
|
||||
class="button is-success">{{ $i18n.get('save') }}</button>
|
||||
</div>
|
||||
</div>
|
||||
<p class="help is-danger">{{ formErrorMessage }}</p>
|
||||
</form>
|
||||
</b-tab-item>
|
||||
|
||||
<b-tab-item :label="$i18n.get('terms')">
|
||||
<!-- Terms List -->
|
||||
<terms-list :category-id="categoryId"/>
|
||||
</b-tab-item>
|
||||
|
||||
<b-loading
|
||||
:active.sync="isLoadingCategory"
|
||||
:can-cancel="false"/>
|
||||
<b-loading
|
||||
:active.sync="isLoadingCategory"
|
||||
:can-cancel="false"/>
|
||||
</b-tabs>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -145,6 +148,7 @@
|
|||
data(){
|
||||
return {
|
||||
categoryId: Number,
|
||||
activeTab: 0,
|
||||
category: null,
|
||||
isLoadingCategory: false,
|
||||
isUpdatingSlug: false,
|
||||
|
|
|
@ -34,7 +34,7 @@
|
|||
name="description"
|
||||
v-model="editForm.description"/>
|
||||
</b-field>
|
||||
|
||||
<!--
|
||||
<b-field :addons="false">
|
||||
<label class="label">
|
||||
{{ $i18n.get('label_parent_term') }}
|
||||
|
@ -56,7 +56,7 @@
|
|||
</option>
|
||||
</b-select>
|
||||
</b-field>
|
||||
|
||||
-->
|
||||
<div class="field is-grouped form-submit">
|
||||
<div class="control">
|
||||
<button
|
||||
|
@ -96,17 +96,17 @@ export default {
|
|||
originalTerm: Object,
|
||||
categoryId: ''
|
||||
},
|
||||
computed: {
|
||||
parentTermsList() {
|
||||
let parentTerms = [];
|
||||
parentTerms.push({name: this.$i18n.get('label_no_parent_term'), id: 0});
|
||||
for (let term of this.getTerms()) {
|
||||
if (term.id != this.editForm.id)
|
||||
parentTerms.push({id: term.id, name: term.name});
|
||||
}
|
||||
return parentTerms;
|
||||
}
|
||||
},
|
||||
// computed: {
|
||||
// parentTermsList() {
|
||||
// let parentTerms = [];
|
||||
// parentTerms.push({name: this.$i18n.get('label_no_parent_term'), id: 0});
|
||||
// for (let term of this.getTerms()) {
|
||||
// if (term.id != this.editForm.id)
|
||||
// parentTerms.push({id: term.id, name: term.name});
|
||||
// }
|
||||
// return parentTerms;
|
||||
// }
|
||||
// },
|
||||
created() {
|
||||
this.editForm = this.editedTerm;
|
||||
this.oldForm = JSON.parse(JSON.stringify(this.originalTerm));
|
||||
|
@ -135,7 +135,7 @@ export default {
|
|||
if (term.id == 'new') {
|
||||
this.sendTerm({
|
||||
categoryId: this.categoryId,
|
||||
index: this.index,
|
||||
index: this.index,
|
||||
name: this.editForm.name,
|
||||
description: this.editForm.description,
|
||||
parent: this.editForm.parent
|
||||
|
|
|
@ -1,11 +1,17 @@
|
|||
<template>
|
||||
<div>
|
||||
<button
|
||||
class="button is-secondary is-small"
|
||||
type="button"
|
||||
@click="addNewTerm()">
|
||||
{{ $i18n.get('label_new_term') }}
|
||||
</button>
|
||||
<b-field
|
||||
:addons="false"
|
||||
:label="$i18n.get('label_category_terms')">
|
||||
<button
|
||||
class="button is-secondary is-pulled-right"
|
||||
type="button"
|
||||
@click="addNewTerm()">
|
||||
{{ $i18n.get('label_new_term') }}
|
||||
</button>
|
||||
</b-field>
|
||||
<br>
|
||||
<br>
|
||||
<div
|
||||
class="term-item"
|
||||
:class="{
|
||||
|
@ -34,20 +40,27 @@
|
|||
v-if="term.id == undefined"/>
|
||||
<span class="controls" >
|
||||
|
||||
<button
|
||||
class="button is-secondary is-small"
|
||||
type="button"
|
||||
@click="addNewChildTerm(term, index)">
|
||||
{{ $i18n.get('label_new_child') }}
|
||||
</button>
|
||||
|
||||
<a @click.prevent="editTerm(term)">
|
||||
<b-icon
|
||||
type="is-gray"
|
||||
icon="pencil"/>
|
||||
</a>
|
||||
<a
|
||||
@click.prevent="removeTerm(term)">
|
||||
@click.prevent="tryToRemoveTerm(term)">
|
||||
<b-icon
|
||||
type="is-gray"
|
||||
icon="delete"/>
|
||||
</a>
|
||||
</span>
|
||||
<div v-if="openedTermId == term.id">
|
||||
<term-edition-form
|
||||
<term-edition-form
|
||||
:category-id="categoryId"
|
||||
@onEditionFinished="onTermEditionFinished()"
|
||||
@onEditionCanceled="onTermEditionCanceled()"
|
||||
|
@ -90,6 +103,9 @@ export default {
|
|||
watch: {
|
||||
termsList() {
|
||||
this.generateOrderedTerms();
|
||||
},
|
||||
openedTermId() {
|
||||
this.$console.log(this.openedTermId);
|
||||
}
|
||||
},
|
||||
components: {
|
||||
|
@ -128,12 +144,25 @@ export default {
|
|||
addNewTerm() {
|
||||
let newTerm = {
|
||||
categoryId: this.categoryId,
|
||||
name: '',
|
||||
name: this.$i18n.get('label_term_without_name'),
|
||||
description: '',
|
||||
parent: 0,
|
||||
id: 'new'
|
||||
}
|
||||
this.termsList.push(newTerm);
|
||||
this.orderedTermsList.push(newTerm);
|
||||
this.openedTermId = '';
|
||||
this.editTerm(newTerm);
|
||||
},
|
||||
addNewChildTerm(parent, parentIndex) {
|
||||
let newTerm = {
|
||||
categoryId: this.categoryId,
|
||||
name: this.$i18n.get('label_term_without_name'),
|
||||
description: '',
|
||||
parent: parent.id,
|
||||
id: 'new'
|
||||
}
|
||||
this.orderedTermsList.splice(parentIndex + 1, 0, newTerm);
|
||||
this.openedTermId = '';
|
||||
this.editTerm(newTerm);
|
||||
},
|
||||
editTerm(term) {
|
||||
|
@ -156,16 +185,36 @@ export default {
|
|||
}
|
||||
}
|
||||
},
|
||||
tryToRemoveTerm(term) {
|
||||
|
||||
// Checks if user is deleting a term with unsaved info.
|
||||
if (term.id == 'new' || this.openedTermId == term.id || (this.editForms[term.id] != undefined && !this.editForms[term.id].saved)) {
|
||||
this.$dialog.confirm({
|
||||
message: this.$i18n.get('info_warning_terms_not_saved'),
|
||||
onCancel: () => { return },
|
||||
onConfirm: () => { this.removeTerm(term);},
|
||||
cancelText: this.$i18n.get('cancel'),
|
||||
confirmText: this.$i18n.get('continue'),
|
||||
type: 'is-secondary'
|
||||
});
|
||||
} else{
|
||||
this.removeTerm(term);
|
||||
}
|
||||
|
||||
},
|
||||
removeTerm(term) {
|
||||
|
||||
// If all checks passed, term can be deleted
|
||||
if (term.id == 'new') {
|
||||
let index = this.termsList.findIndex(deletedTerm => deletedTerm.id == 'new');
|
||||
let index = this.orderedTermsList.findIndex(deletedTerm => deletedTerm.id == 'new');
|
||||
if (index >= 0) {
|
||||
this.termsList.splice(index, 1);
|
||||
this.orderedTermsList.splice(index, 1);
|
||||
}
|
||||
if (this.openedTermId == 'new')
|
||||
this.openedTermId = '';
|
||||
delete this.editForms['new'];
|
||||
} else {
|
||||
|
||||
this.deleteTerm({categoryId: this.categoryId, termId: term.id})
|
||||
.then(() => {
|
||||
|
||||
|
@ -173,20 +222,38 @@ export default {
|
|||
.catch((error) => {
|
||||
this.$console.log(error);
|
||||
});
|
||||
}
|
||||
|
||||
// Updates parent IDs for orphans
|
||||
for (let orphanTerm of this.termsList) {
|
||||
if (orphanTerm.parent == term.id) {
|
||||
this.updateTerm({
|
||||
categoryId: this.categoryId,
|
||||
termId: orphanTerm.id,
|
||||
index: '',
|
||||
name: orphanTerm.name,
|
||||
description: orphanTerm.description,
|
||||
parent: term.parent
|
||||
})
|
||||
.catch((error) => {
|
||||
this.$console.log(error);
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
onTermEditionFinished() {
|
||||
let index = this.termsList.findIndex(deletedTerm => deletedTerm.id == 'new');
|
||||
let index = this.orderedTermsList.findIndex(deletedTerm => deletedTerm.id == 'new');
|
||||
if (index >= 0) {
|
||||
this.termsList.splice(index, 1);
|
||||
this.orderedTermsList.splice(index, 1);
|
||||
}
|
||||
this.formWithErrors = '';
|
||||
this.$delete(this.editForms, this.openedTermId);
|
||||
delete this.editForms[this.openedTermId];
|
||||
this.openedTermId = '';
|
||||
this.$console.log("EMITED");
|
||||
},
|
||||
onTermEditionCanceled() {
|
||||
this.formWithErrors = '';
|
||||
this.$delete(this.editForms, this.openedTermId);
|
||||
delete this.editForms[this.openedTermId];
|
||||
this.openedTermId = '';
|
||||
},
|
||||
buildOrderedTermsList(parentId, termDepth) {
|
||||
|
@ -291,6 +358,9 @@ export default {
|
|||
position: relative;
|
||||
i, i:before { font-size: 20px; }
|
||||
}
|
||||
.button {
|
||||
margin-right: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
&.not-sortable-item, &.not-sortable-item:hover {
|
||||
|
@ -313,19 +383,19 @@ export default {
|
|||
}
|
||||
|
||||
}
|
||||
.term-item:hover:not(.not-sortable-item) {
|
||||
background-color: $secondary;
|
||||
border-color: $secondary;
|
||||
color: white !important;
|
||||
// .term-item:hover:not(.not-sortable-item) {
|
||||
// background-color: $secondary;
|
||||
// border-color: $secondary;
|
||||
// color: white !important;
|
||||
|
||||
.label-details, .icon, .not-saved {
|
||||
color: white !important;
|
||||
}
|
||||
// .label-details, .icon, .not-saved {
|
||||
// color: white !important;
|
||||
// }
|
||||
|
||||
.grip-icon {
|
||||
fill: white;
|
||||
}
|
||||
}
|
||||
// .grip-icon {
|
||||
// fill: white;
|
||||
// }
|
||||
// }
|
||||
|
||||
</style>
|
||||
|
||||
|
|
|
@ -156,11 +156,17 @@ html {
|
|||
.button {
|
||||
border-radius: 6px !important;
|
||||
font-weight: normal;
|
||||
height: 30px !important;
|
||||
padding: 2px 15px !important;
|
||||
margin-top: 0px !important;
|
||||
margin-bottom: 0px !important;
|
||||
}
|
||||
.button.is-small {
|
||||
height: 26px !important;
|
||||
}
|
||||
.button:not(.is-small):not(.is-medium):not(.is-large) {
|
||||
height: 30px !important;
|
||||
}
|
||||
|
||||
.select {
|
||||
padding-top: 0px !important;
|
||||
select {
|
||||
|
|
|
@ -15,6 +15,8 @@ return [
|
|||
'filter' => __( 'Filter', 'tainacan' ),
|
||||
'category' => __( 'Category', 'tainacan' ),
|
||||
'event' => __( 'Event', 'tainacan' ),
|
||||
'term' => __( 'Term', 'tainacan' ),
|
||||
'terms' => __( 'Terms', 'tainacan' ),
|
||||
|
||||
// Actions
|
||||
'edit' => __( 'Edit', 'tainacan' ),
|
||||
|
@ -122,8 +124,10 @@ return [
|
|||
'label_collection_filters' => __( 'Collection Filters', 'tainacan' ),
|
||||
'label_parent_term' => __( 'Parent Term', 'tainacan' ),
|
||||
'label_new_term' => __( 'New Term', 'tainacan' ),
|
||||
'label_new_child' => __( 'New Child', 'tainacan' ),
|
||||
'label_category_terms' => __( 'Category Terms', 'tainacan' ),
|
||||
'label_no_parent_term' => __( 'No parent term', 'tainacan' ),
|
||||
'label_term_without_name' => __( 'Term without name', 'tainacan' ),
|
||||
|
||||
// Instructions. More complex sentences to guide user and placeholders
|
||||
'instruction_dragndrop_fields_collection' => __( 'Drag and drop Fields here to Collection.', 'tainacan' ),
|
||||
|
@ -167,6 +171,7 @@ return [
|
|||
'info_warning_filters_not_saved' => __('Are you sure? There are filters not saved, changes will be lost.', 'tainacan'),
|
||||
'info_no_description_provided' => __('No description provided.', 'tainacan'),
|
||||
'info_warning_terms_not_saved' => __('Are you sure? There are terms not saved, changes will be lost.', 'tainacan'),
|
||||
'info_warning_orphan_terms' => __('Are you sure? This term is parent of other terms. These will be converted to root terms.', 'tainacan'),
|
||||
|
||||
// Tainacan Field Types
|
||||
'tainacan-text' => __( 'Text', 'tainacan' ),
|
||||
|
|
|
@ -84,7 +84,7 @@ if (production === true) {
|
|||
new webpack.LoaderOptionsPlugin({
|
||||
minimize: true
|
||||
})
|
||||
]);
|
||||
])
|
||||
|
||||
module.exports.resolve = {
|
||||
alias: {
|
||||
|
|
Loading…
Reference in New Issue