Merge branch 'develop' of https://github.com/tainacan/tainacan into develop

This commit is contained in:
weryques 2018-03-29 15:03:10 -03:00
commit fa7a5eb2c7
6 changed files with 249 additions and 164 deletions

View File

@ -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,

View File

@ -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

View File

@ -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>

View File

@ -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 {

View File

@ -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' ),

View File

@ -84,7 +84,7 @@ if (production === true) {
new webpack.LoaderOptionsPlugin({
minimize: true
})
]);
])
module.exports.resolve = {
alias: {