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

Merge remote-tracking branch 'origin/develop' into exposers

This commit is contained in:
Jacson Passold 2018-03-26 18:19:33 -03:00
parent dd9e5c8ce0 6daccd8a31
commit e24b7639f0
76 changed files with 3092 additions and 992 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
.eslintrc.js Normal file
View File

@ -0,0 +1,16 @@
module.exports = {
extends: [
// add more generic rulesets here, such as:
'eslint:recommended',
'plugin:vue/strongly-recommended'
],
rules: {
// override/add rules settings here, such as:
'vue/no-unused-vars': 'error',
"no-console": "warn",
"no-unused-vars": "warn",
"no-undef": "warn",
"vue/html-indent": "off",
"vue/require-default-prop": "off", // https://github.com/vuejs/eslint-plugin-vue/blob/master/docs/rules/require-default-prop.md
}
}

5
cypress/fixtures/example.json Normal file
View File

@ -0,0 +1,5 @@
{
"name": "Using fixtures to represent data",
"email": "hello@cypress.io",
"body": "Fixtures are a great way to mock data for responses to routes"
}

1037
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

7
package.json
View File

@ -11,11 +11,15 @@
"axios": "^0.17.1", "axios": "^0.17.1",
"buefy": "^0.6.3", "buefy": "^0.6.3",
"bulma": "^0.6.2", "bulma": "^0.6.2",
"fs": "0.0.1-security",
"html-to-json": "^0.6.0",
"mdi": "^2.1.99", "mdi": "^2.1.99",
"moment": "^2.21.0", "moment": "^2.21.0",
"net": "^1.0.2",
"node-sass": "^4.7.2", "node-sass": "^4.7.2",
"qs": "^6.5.1", "qs": "^6.5.1",
"sass-loader": "^6.0.6", "sass-loader": "^6.0.6",
"tls": "0.0.1",
"vue": "^2.5.13", "vue": "^2.5.13",
"vuedraggable": "^2.16.0", "vuedraggable": "^2.16.0",
"vuex": "^3.0.1" "vuex": "^3.0.1"
@ -31,6 +35,9 @@
"css-loader": "^0.25.0", "css-loader": "^0.25.0",
"cypress": "^2.1.0", "cypress": "^2.1.0",
"element-theme-chalk": "^2.1.0", "element-theme-chalk": "^2.1.0",
"eslint": "^4.19.1",
"eslint-loader": "^2.0.0",
"eslint-plugin-vue": "^4.4.0",
"file-loader": "^0.9.0", "file-loader": "^0.9.0",
"postcss-loader": "^2.1.0", "postcss-loader": "^2.1.0",
"sass-resources-loader": "^1.3.2", "sass-resources-loader": "^1.3.2",

10
src/admin/admin.vue
View File

@ -1,9 +1,11 @@
<template> <template>
<div id="tainacan-admin-app" class="columns is-fullheight"> <div
<primary-menu></primary-menu> id="tainacan-admin-app"
<tainacan-header></tainacan-header> class="columns is-fullheight">
<primary-menu/>
<tainacan-header/>
<div class="column is-main-content"> <div class="column is-main-content">
<router-view></router-view> <router-view/>
</div> </div>
</div> </div>
</template> </template>

18
src/admin/class-tainacan-admin.php
View File

@ -143,14 +143,16 @@ class Admin {
} }
$settings = [ $settings = [
'root' => esc_url_raw( rest_url() ) . 'tainacan/v2', 'root' => esc_url_raw( rest_url() ) . 'tainacan/v2',
'root_wp_api' => esc_url_raw( rest_url() ) . 'wp/v2/', 'root_wp_api' => esc_url_raw( rest_url() ) . 'wp/v2/',
'nonce' => wp_create_nonce( 'wp_rest' ), 'wp_ajax_url' => admin_url( 'admin-ajax.php' ),
'components' => $components, 'nonce' => wp_create_nonce( 'wp_rest' ),
'i18n' => $tainacan_admin_i18n, 'sample_permalink_nonce' => wp_create_nonce( 'samplepermalink' ),
'user_caps' => $user_caps, 'components' => $components,
'user_prefs' => $prefs, 'i18n' => $tainacan_admin_i18n,
'base_url' => $TAINACAN_BASE_URL 'user_caps' => $user_caps,
'user_prefs' => $prefs,
'base_url' => $TAINACAN_BASE_URL
]; ];
$maps = [ $maps = [

395
src/admin/components/edition/category-edition-form.vue
View File

@ -1,8 +1,14 @@
<template> <template>
<div> <div>
<div class="page-container primary-page"> <div class="page-container primary-page">
<b-tag v-if="category != null && category != undefined" :type="'is-' + getStatusColor(category.status)" v-text="category.status"></b-tag> <b-tag
<form v-if="category != null && category != undefined" class="tainacan-form" label-width="120px"> 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">
<!-- Name -------------------------------- --> <!-- Name -------------------------------- -->
<b-field <b-field
@ -12,14 +18,12 @@
:message="editFormErrors['name'] != undefined ? editFormErrors['name'] : ''"> :message="editFormErrors['name'] != undefined ? editFormErrors['name'] : ''">
<help-button <help-button
:title="$i18n.getHelperTitle('categories', 'name')" :title="$i18n.getHelperTitle('categories', 'name')"
:message="$i18n.getHelperMessage('categories', 'name')"> :message="$i18n.getHelperMessage('categories', 'name')"/>
</help-button>
<b-input <b-input
id="tainacan-text-name" id="tainacan-text-name"
v-model="form.name" v-model="form.name"
@focus="clearErrors('name')" @focus="clearErrors('name')"
@blur="updateSlug()"> @blur="updateSlug()"/>
</b-input>
</b-field> </b-field>
<!-- Description -------------------------------- --> <!-- Description -------------------------------- -->
@ -30,14 +34,12 @@
:message="editFormErrors['description'] != undefined ? editFormErrors['description'] : ''"> :message="editFormErrors['description'] != undefined ? editFormErrors['description'] : ''">
<help-button <help-button
:title="$i18n.getHelperTitle('categories', 'description')" :title="$i18n.getHelperTitle('categories', 'description')"
:message="$i18n.getHelperMessage('categories', 'description')"> :message="$i18n.getHelperMessage('categories', 'description')"/>
</help-button>
<b-input <b-input
id="tainacan-text-description" id="tainacan-text-description"
type="textarea" type="textarea"
v-model="form.description" v-model="form.description"
@focus="clearErrors('description')"> @focus="clearErrors('description')"/>
</b-input>
</b-field> </b-field>
<!-- Status -------------------------------- --> <!-- Status -------------------------------- -->
@ -48,8 +50,7 @@
:message="editFormErrors['status'] != undefined ? editFormErrors['status'] : ''"> :message="editFormErrors['status'] != undefined ? editFormErrors['status'] : ''">
<help-button <help-button
:title="$i18n.getHelperTitle('categories', 'status')" :title="$i18n.getHelperTitle('categories', 'status')"
:message="$i18n.getHelperMessage('categories', 'status')"> :message="$i18n.getHelperMessage('categories', 'status')"/>
</help-button>
<b-select <b-select
id="tainacan-select-status" id="tainacan-select-status"
v-model="form.status" v-model="form.status"
@ -72,14 +73,14 @@
:message="editFormErrors['slug'] != undefined ? editFormErrors['slug'] : ''"> :message="editFormErrors['slug'] != undefined ? editFormErrors['slug'] : ''">
<help-button <help-button
:title="$i18n.getHelperTitle('categories', 'slug')" :title="$i18n.getHelperTitle('categories', 'slug')"
:message="$i18n.getHelperMessage('categories', 'slug')"> :message="$i18n.getHelperMessage('categories', 'slug')"/>
</help-button> <b-icon :class="{'is-loading': isUpdatingSlug}"/>
<b-input <b-input
@input="updateSlug()"
id="tainacan-text-slug" id="tainacan-text-slug"
v-model="form.slug" v-model="form.slug"
@focus="clearErrors('slug')" @focus="clearErrors('slug')"
:disabled="isUpdatingSlug"> :disabled="isUpdatingSlug"/>
</b-input>
</b-field> </b-field>
<!-- Allow Insert --> <!-- Allow Insert -->
@ -88,8 +89,7 @@
:label="$i18n.get('label_category_allow_new_terms')"> :label="$i18n.get('label_category_allow_new_terms')">
<help-button <help-button
:title="$i18n.getHelperTitle('categories', 'allow_insert')" :title="$i18n.getHelperTitle('categories', 'allow_insert')"
:message="$i18n.getHelperMessage('categories', 'allow_insert')"> :message="$i18n.getHelperMessage('categories', 'allow_insert')"/>
</help-button>
<div class="block" > <div class="block" >
<b-checkbox <b-checkbox
v-model="form.allowInsert" v-model="form.allowInsert"
@ -100,6 +100,73 @@
</div> </div>
</b-field> </b-field>
<!-- Terms List -->
<b-field
:addons="false"
:label="$i18n.get('label_category_terms')">
<button
class="button is-secondary is-small"
type="button"
@click="addNewTerm()">
{{ $i18n.get('label_new_term') }}
</button>
<!-- Term item -->
<div
class="term-item"
:class="{
'not-sortable-item': term.term_id == 'new' || term.term_id == undefined || openedTermId != '' ,
'not-focusable-item': openedTermId == term.term_id
}"
v-for="(term, index) in termsList"
:key="index">
<span
class="term-name"
:class="{'is-danger': formWithErrors == term.term_id }">
{{ term.name }}
</span>
<span
v-if="term.term_id != undefined"
class="label-details">
<span
class="not-saved"
v-if="(editForms[term.term_id] != undefined && editForms[term.term_id].saved != true) || term.term_id == 'new'">
{{ $i18n.get('info_not_saved') }}
</span>
</span>
<span
class="loading-spinner"
v-if="term.term_id == undefined"/>
<span
class="controls"
v-if="term.term_id !== undefined || term.term_id !== 'new'">
<a @click.prevent="editTerm(term)">
<b-icon
type="is-gray"
icon="pencil"/>
</a>
<a @click.prevent="removeTerm(term)">
<b-icon
type="is-gray"
icon="delete"/>
</a>
</span>
<div v-if="openedTermId == term.term_id">
<term-edition-form
:category-id="categoryId"
@onEditionFinished="onTermEditionFinished()"
@onEditionCanceled="onTermEditionCanceled()"
@onErrorFound="formWithErrors = term.term_id"
:index="index"
:original-term="term"
:edited-term="editForms[term.term_id]"/>
</div>
</div>
</b-field>
<!-- Submit -->
<div class="field is-grouped form-submit"> <div class="field is-grouped form-submit">
<div class="control"> <div class="control">
<button <button
@ -115,31 +182,37 @@
class="button is-success">{{ $i18n.get('save') }}</button> class="button is-success">{{ $i18n.get('save') }}</button>
</div> </div>
</div> </div>
<p class="help is-danger">{{formErrorMessage}}</p> <p class="help is-danger">{{ formErrorMessage }}</p>
</form> </form>
<b-loading :active.sync="isLoading" :canCancel="false"></b-loading> <b-loading
:active.sync="isLoading"
:can-cancel="false"/>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { mapActions, mapGetters } from 'vuex' import { wpAjax } from "../../js/mixins";
import { mapActions, mapGetters } from 'vuex';
import TermEditionForm from './term-edition-form.vue'
import htmlToJSON from 'html-to-json';
export default { export default {
name: 'CategoryEditionForm', name: 'CategoryEditionForm',
mixins: [ wpAjax ],
data(){ data(){
return { return {
categoryId: Number, categoryId: Number,
category: null, category: null,
isLoading: false, isLoadingCategory: false,
isUpdatingSlug: false, isUpdatingSlug: false,
form: { form: {
name: String, name: String,
status: String, status: String,
description: String, description: String,
slug: String, slug: String,
allowInsert: String, allowInsert: String
}, },
statusOptions: [{ statusOptions: [{
value: 'publish', value: 'publish',
@ -156,20 +229,41 @@
}], }],
editFormErrors: {}, editFormErrors: {},
formErrorMessage: '', formErrorMessage: '',
// Terms related
isLoadingTerms: false,
formWithErrors: '',
openedTermId: '',
editForms: [],
orderedTermsList: []
} }
}, },
computed: {
termsList() {
//this.orderedTermsList = new Array();
//this.buildOrderedTermsList(0, 0);
return this.getTerms();
}
},
components: {
TermEditionForm
},
methods: { methods: {
...mapActions('category', [ ...mapActions('category', [
'createCategory', 'createCategory',
'updateCategory', 'updateCategory',
'fetchCategory', 'fetchCategory',
'fetchOnlySlug', 'fetchOnlySlug',
'fetchTerms',
'updateTerm',
'deleteTerm'
]), ]),
...mapGetters('category',[ ...mapGetters('category',[
'getCategory' 'getCategory',
'getTerms'
]), ]),
onSubmit() { onSubmit() {
this.isLoading = true;
this.isLoadingCategory = true;
let data = { let data = {
categoryId: this.categoryId, categoryId: this.categoryId,
@ -192,7 +286,7 @@
this.form.status = this.category.status; this.form.status = this.category.status;
this.allowInsert = this.category.allow_insert; this.allowInsert = this.category.allow_insert;
this.isLoading = false; this.isLoadingCategory = false;
this.formErrorMessage = ''; this.formErrorMessage = '';
this.editFormErrors = {}; this.editFormErrors = {};
@ -206,7 +300,7 @@
} }
this.formErrorMessage = errors.error_message; this.formErrorMessage = errors.error_message;
this.isLoading = false; this.isLoadingCategory = false;
}); });
}, },
updateSlug(){ updateSlug(){
@ -216,43 +310,28 @@
this.isUpdatingSlug = true; this.isUpdatingSlug = true;
let data = { this.getSamplePermalink(this.categoryId, this.form.name, this.form.slug)
categoryId: this.categoryId, .then(samplePermalink => {
name: this.form.name,
description: this.form.description,
//slug: '',
status: 'private',
allowInsert: this.form.allowInsert
};
console.log(data); let promise = htmlToJSON.parse(samplePermalink, {
permalink($doc) {
return $doc.find('#editable-post-name-full').text();
}
});
this.updateCategory(data) promise.done((result) => {
.then(updatedCategory => { this.form.slug = result.permalink;
this.category = updatedCategory; this.$console.info(this.form.slug);
});
console.info(this.category);
// Fill this.form data with current data.
this.form.name = this.category.name;
this.form.slug = this.category.slug;
this.form.description = this.category.description;
this.form.status = this.category.status;
this.allowInsert = this.category.allow_insert;
this.isUpdatingSlug = false; this.isUpdatingSlug = false;
this.formErrorMessage = ''; this.formErrorMessage = '';
this.editFormErrors = {}; this.editFormErrors = {};
}) })
.catch(errors => { .catch(errors => {
for (let error of errors.errors) { this.$console.error(errors);
for (let attribute of Object.keys(error)) {
this.editFormErrors[attribute] = error[attribute];
}
}
this.formErrorMessage = errors.error_message;
this.isLoading = false; this.isUpdatingSlug = false;
}); });
}, },
@ -272,7 +351,7 @@
}, },
createNewCategory() { createNewCategory() {
// Puts loading on Draft Category creation // Puts loading on Draft Category creation
this.isLoading = true; this.isLoadingCategory = true;
// Creates draft Category // Creates draft Category
let data = { let data = {
@ -298,11 +377,11 @@
// Pre-fill status with publish to incentivate it // Pre-fill status with publish to incentivate it
this.form.status = 'publish'; this.form.status = 'publish';
this.isLoading = false; this.isLoadingCategory = false;
} }
) )
.catch(error => console.log(error)); .catch(error => this.$console.error(error));
}, },
clearErrors(attribute) { clearErrors(attribute) {
this.editFormErrors[attribute] = undefined; this.editFormErrors[attribute] = undefined;
@ -313,6 +392,72 @@
labelNewTerms(){ labelNewTerms(){
return ( this.form.allowInsert === 'yes' ) ? this.$i18n.get('label_yes') : this.$i18n.get('label_no'); return ( this.form.allowInsert === 'yes' ) ? this.$i18n.get('label_yes') : this.$i18n.get('label_no');
}, },
addNewTerm() {
let newTerm = {
categoryId: this.categoryId,
name: '',
description: '',
parent: 0,
term_id: 'new'
}
this.termsList.push(newTerm);
this.editTerm(newTerm);
},
editTerm(term) {
// Closing collapse
if (this.openedTermId == term.term_id) {
this.openedTermId = '';
// Opening collapse
} else {
this.openedTermId = term.term_id;
// First time opening
if (this.editForms[this.openedTermId] == undefined) {
this.editForms[this.openedTermId] = JSON.parse(JSON.stringify(term));
this.editForms[this.openedTermId].saved = true;
if (term.term_id == 'new')
this.editForms[this.openedTermId].saved = false;
}
}
},
removeTerm(term) {
this.$console.log(term);
this.deleteTerm({categoryId: this.categoryId, termId: term.term_id})
.then(() => {
})
.catch((error) => {
this.$console.log(error);
});
},
onTermEditionFinished() {
this.formWithErrors = '';
delete this.editForms[this.openedTermId];
this.openedTermId = '';
},
onTermEditionCanceled() {
this.formWithErrors = '';
delete this.editForms[this.openedTermId];
this.openedTermId = '';
},
buildOrderedTermsList(parentId, termDepth) {
for (let term of this.termsList) {
if (term['parent'] != parentId ) {
continue;
}
term.depth = termDepth;
this.orderedTermsList.push(term);
this.buildOrderedTermsList(term.term_id, termDepth + 1);
}
},
}, },
created(){ created(){
@ -320,7 +465,8 @@
this.createNewCategory(); this.createNewCategory();
} else if (this.$route.fullPath.split("/").pop() === "edit") { } else if (this.$route.fullPath.split("/").pop() === "edit") {
this.isLoading = true; this.isLoadingCategory = true;
this.isLoadingTerms = true;
// Obtains current category ID from URL // Obtains current category ID from URL
this.pathArray = this.$route.fullPath.split("/").reverse(); this.pathArray = this.$route.fullPath.split("/").reverse();
@ -336,16 +482,47 @@
this.form.status = this.category.status; this.form.status = this.category.status;
this.form.allowInsert = this.category.allow_insert; this.form.allowInsert = this.category.allow_insert;
this.isLoading = false; this.isLoadingCategory = false;
});
this.fetchTerms(this.categoryId)
.then(() => {
// Fill this.form data with current data.
this.isLoadingCategory = false;
})
.catch((error) => {
this.$console.log(error);
}); });
} }
},
beforeRouteLeave ( to, from, next ) {
let hasUnsavedForms = false;
for (let editForm in this.editForms) {
if (!this.editForms[editForm].saved)
hasUnsavedForms = true;
}
if ((this.openedTermId != '' && this.openedTermId != undefined) || 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()
}
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import "../../scss/_variables.scss";
.thumbnail-field { .thumbnail-field {
width: 128px; width: 128px;
height: 128px; height: 128px;
@ -376,6 +553,102 @@
} }
} }
.loading-spinner {
animation: spinAround 500ms infinite linear;
border: 2px solid #dbdbdb;
border-radius: 290486px;
border-right-color: transparent;
border-top-color: transparent;
content: "";
display: inline-block;
height: 1em;
width: 1em;
}
.term-item {
background-color: white;
padding: 0.7em 0.9em;
margin: 4px;
min-height: 40px;
display: block;
position: relative;
cursor: grab;
.handle {
padding-right: 6em;
}
.grip-icon {
fill: $gray;
top: 2px;
position: relative;
}
.term-name {
text-overflow: ellipsis;
overflow-x: hidden;
white-space: nowrap;
font-weight: bold;
margin-left: 0.4em;
margin-right: 0.4em;
&.is-danger {
color: $danger !important;
}
}
.label-details {
font-weight: normal;
color: $gray;
}
.not-saved {
font-style: italic;
font-weight: bold;
color: $danger;
}
.controls {
position: absolute;
right: 5px;
top: 10px;
.icon {
bottom: 1px;
position: relative;
i, i:before { font-size: 20px; }
}
}
&.not-sortable-item, &.not-sortable-item:hover {
cursor: default;
background-color: white !important;
.handle .label-details, .handle .icon {
color: $gray !important;
}
}
&.not-focusable-item, &.not-focusable-item:hover {
cursor: default;
.term-name {
color: $primary;
}
.handle .label-details, .handle .icon {
color: $gray !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;
}
.grip-icon {
fill: white;
}
}
</style> </style>

124
src/admin/components/edition/collection-edition-form.vue
View File

@ -1,7 +1,15 @@
<template> <template>
<div class="page-container" :class="{'primary-page' : isNewCollection }"> <div
<b-tag v-if="collection != null && collection != undefined" :type="'is-' + getStatusColor(collection.status)" v-text="collection.status"></b-tag> class="page-container"
<form v-if="collection != null && collection != undefined" class="tainacan-form" label-width="120px"> :class="{'primary-page' : isNewCollection }">
<b-tag
v-if="collection != null && collection != undefined"
:type="'is-' + getStatusColor(collection.status)"
v-text="collection.status"/>
<form
v-if="collection != null && collection != undefined"
class="tainacan-form"
label-width="120px">
<!-- Name -------------------------------- --> <!-- Name -------------------------------- -->
<b-field <b-field
@ -11,13 +19,11 @@
:message="editFormErrors['name'] != undefined ? editFormErrors['name'] : ''"> :message="editFormErrors['name'] != undefined ? editFormErrors['name'] : ''">
<help-button <help-button
:title="$i18n.getHelperTitle('collections', 'name')" :title="$i18n.getHelperTitle('collections', 'name')"
:message="$i18n.getHelperMessage('collections', 'name')"> :message="$i18n.getHelperMessage('collections', 'name')"/>
</help-button>
<b-input <b-input
id="tainacan-text-name" id="tainacan-text-name"
v-model="form.name" v-model="form.name"
@focus="clearErrors('name')"> @focus="clearErrors('name')"/>
</b-input>
</b-field> </b-field>
<!-- Thumbnail -------------------------------- --> <!-- Thumbnail -------------------------------- -->
@ -33,23 +39,29 @@
<div class="content has-text-centered"> <div class="content has-text-centered">
<p> <p>
<b-icon <b-icon
icon="upload"> icon="upload"/>
</b-icon>
</p> </p>
<p>{{ $i18n.get('instruction_image_upload_box') }}</p> <p>{{ $i18n.get('instruction_image_upload_box') }}</p>
</div> </div>
</b-upload> </b-upload>
<div v-else> <div v-else>
<figure class="image is-128x128"> <figure class="image is-128x128">
<img :alt="$i18n.get('label_thumbnail')" :src="collection.featured_image"/> <img
:alt="$i18n.get('label_thumbnail')"
:src="collection.featured_image">
</figure> </figure>
<div class="thumbnail-buttons-row"> <div class="thumbnail-buttons-row">
<b-upload <b-upload
model="thumbnail" model="thumbnail"
@input="uploadThumbnail($event)"> @input="uploadThumbnail($event)">
<a id="button-edit" :aria-label="$i18n.get('label_button_edit_thumb')"><b-icon icon="pencil"></b-icon></a> <a
id="button-edit"
:aria-label="$i18n.get('label_button_edit_thumb')"><b-icon icon="pencil"/></a>
</b-upload> </b-upload>
<a id="button-delete" :aria-label="$i18n.get('label_button_delete_thumb')" @click="deleteThumbnail()"><b-icon icon="delete"></b-icon></a> <a
id="button-delete"
:aria-label="$i18n.get('label_button_delete_thumb')"
@click="deleteThumbnail()"><b-icon icon="delete"/></a>
</div> </div>
</div> </div>
</div> </div>
@ -57,32 +69,29 @@
<!-- Description -------------------------------- --> <!-- Description -------------------------------- -->
<b-field <b-field
:addons="false" :addons="false"
:label="$i18n.get('label_description')" :label="$i18n.get('label_description')"
:type="editFormErrors['description'] != undefined ? 'is-danger' : ''" :type="editFormErrors['description'] != undefined ? 'is-danger' : ''"
:message="editFormErrors['description'] != undefined ? editFormErrors['description'] : ''"> :message="editFormErrors['description'] != undefined ? editFormErrors['description'] : ''">
<help-button <help-button
:title="$i18n.getHelperTitle('collections', 'description')" :title="$i18n.getHelperTitle('collections', 'description')"
:message="$i18n.getHelperMessage('collections', 'description')"> :message="$i18n.getHelperMessage('collections', 'description')"/>
</help-button>
<b-input <b-input
id="tainacan-text-description" id="tainacan-text-description"
type="textarea" type="textarea"
v-model="form.description" v-model="form.description"
@focus="clearErrors('description')"> @focus="clearErrors('description')"/>
</b-input>
</b-field> </b-field>
<!-- Status -------------------------------- --> <!-- Status -------------------------------- -->
<b-field <b-field
:addons="false" :addons="false"
:label="$i18n.get('label_status')" :label="$i18n.get('label_status')"
:type="editFormErrors['status'] != undefined ? 'is-danger' : ''" :type="editFormErrors['status'] != undefined ? 'is-danger' : ''"
:message="editFormErrors['status'] != undefined ? editFormErrors['status'] : ''"> :message="editFormErrors['status'] != undefined ? editFormErrors['status'] : ''">
<help-button <help-button
:title="$i18n.getHelperTitle('collections', 'status')" :title="$i18n.getHelperTitle('collections', 'status')"
:message="$i18n.getHelperMessage('collections', 'status')"> :message="$i18n.getHelperMessage('collections', 'status')"/>
</help-button>
<b-select <b-select
id="tainacan-select-status" id="tainacan-select-status"
v-model="form.status" v-model="form.status"
@ -99,44 +108,44 @@
<!-- Slug -------------------------------- --> <!-- Slug -------------------------------- -->
<b-field <b-field
:addons="false" :addons="false"
:label="$i18n.get('label_slug')" :label="$i18n.get('label_slug')"
:type="editFormErrors['slug'] != undefined ? 'is-danger' : ''" :type="editFormErrors['slug'] != undefined ? 'is-danger' : ''"
:message="editFormErrors['slug'] != undefined ? editFormErrors['slug'] : ''"> :message="editFormErrors['slug'] != undefined ? editFormErrors['slug'] : ''">
<help-button <help-button
:title="$i18n.getHelperTitle('collections', 'slug')" :title="$i18n.getHelperTitle('collections', 'slug')"
:message="$i18n.getHelperMessage('collections', 'slug')"> :message="$i18n.getHelperMessage('collections', 'slug')"/>
</help-button>
<b-input <b-input
id="tainacan-text-slug" id="tainacan-text-slug"
v-model="form.slug" v-model="form.slug"
@focus="clearErrors('slug')"> @focus="clearErrors('slug')"/>
</b-input>
</b-field> </b-field>
<div class="field is-grouped form-submit"> <div class="field is-grouped form-submit">
<div class="control"> <div class="control">
<button <button
id="button-cancel-collection-creation" id="button-cancel-collection-creation"
class="button is-outlined" class="button is-outlined"
type="button" type="button"
@click="cancelBack">{{ $i18n.get('cancel') }}</button> @click="cancelBack">{{ $i18n.get('cancel') }}</button>
</div> </div>
<div class="control"> <div class="control">
<button <button
id="button-submit-collection-creation" id="button-submit-collection-creation"
@click.prevent="onSubmit" @click.prevent="onSubmit"
class="button is-success">{{ $i18n.get('save') }}</button> class="button is-success">{{ $i18n.get('save') }}</button>
</div> </div>
</div> </div>
<p class="help is-danger">{{formErrorMessage}}</p> <p class="help is-danger">{{ formErrorMessage }}</p>
</form> </form>
<b-loading :active.sync="isLoading" :canCancel="false"></b-loading> <b-loading
:active.sync="isLoading"
:can-cancel="false"/>
</div> </div>
</template> </template>
<script> <script>
import { mapActions, mapGetters } from 'vuex' import { mapActions } from 'vuex'
export default { export default {
name: 'CollectionEditionForm', name: 'CollectionEditionForm',
@ -181,9 +190,6 @@ export default {
'sendAttachment', 'sendAttachment',
'updateThumbnail' 'updateThumbnail'
]), ]),
...mapGetters('collection',[
'getCollection'
]),
onSubmit() { onSubmit() {
// Puts loading on Draft Collection creation // Puts loading on Draft Collection creation
this.isLoading = true; this.isLoading = true;
@ -251,7 +257,7 @@ export default {
this.isLoading = false; this.isLoading = false;
}) })
.catch(error => console.log(error)); .catch(error => this.$console.error(error));
}, },
clearErrors(attribute) { clearErrors(attribute) {
this.editFormErrors[attribute] = undefined; this.editFormErrors[attribute] = undefined;
@ -269,22 +275,22 @@ export default {
this.collection.featured_image = res.featured_image; this.collection.featured_image = res.featured_image;
}) })
.catch((error) => { .catch((error) => {
console.log(error); this.$console.error(error);
}); });
}) })
.catch((error) => { .catch((error) => {
console.log(error); this.$console.error(error);
}); });
}, },
deleteThumbnail() { deleteThumbnail() {
this.updateThumbnail({collectionId: this.collectionId, thumbnailId: 0}) this.updateThumbnail({collectionId: this.collectionId, thumbnailId: 0})
.then((res) => { .then(() => {
this.collection.featured_image = false; this.collection.featured_image = false;
}) })
.catch((error) => { .catch((error) => {
console.log(error); this.$console.error(error);
}); });
} }
}, },

172
src/admin/components/edition/field-edition-form.vue
View File

@ -1,140 +1,152 @@
<template> <template>
<form id="fieldEditForm" class="tainacan-form" v-on:submit.prevent="saveEdition(editForm)"> <form
id="fieldEditForm"
class="tainacan-form"
@submit.prevent="saveEdition(editForm)">
<b-field <b-field
:addons="false" :addons="false"
:type="formErrors['name'] != undefined ? 'is-danger' : ''" :type="formErrors['name'] != undefined ? 'is-danger' : ''"
:message="formErrors['name'] != undefined ? formErrors['name'] : ''"> :message="formErrors['name'] != undefined ? formErrors['name'] : ''">
<label class="label"> <label class="label">
{{$i18n.get('label_name')}} {{ $i18n.get('label_name') }}
<span class="required-field-asterisk" :class="formErrors['name'] != undefined ? 'is-danger' : ''">*</span> <span
class="required-field-asterisk"
:class="formErrors['name'] != undefined ? 'is-danger' : ''">*</span>
<help-button <help-button
:title="$i18n.getHelperTitle('fields', 'name')" :title="$i18n.getHelperTitle('fields', 'name')"
:message="$i18n.getHelperMessage('fields', 'name')"> :message="$i18n.getHelperMessage('fields', 'name')"/>
</help-button>
</label> </label>
<b-input v-model="editForm.name" name="name" @focus="clearErrors('name')"></b-input> <b-input
v-model="editForm.name"
name="name"
@focus="clearErrors('name')"/>
</b-field> </b-field>
<b-field <b-field
:addons="false" :addons="false"
:type="formErrors['description'] != undefined ? 'is-danger' : ''" :type="formErrors['description'] != undefined ? 'is-danger' : ''"
:message="formErrors['description'] != undefined ? formErrors['description'] : ''"> :message="formErrors['description'] != undefined ? formErrors['description'] : ''">
<label class="label"> <label class="label">
{{$i18n.get('label_description')}} {{ $i18n.get('label_description') }}
<help-button <help-button
:title="$i18n.getHelperTitle('fields', 'description')" :title="$i18n.getHelperTitle('fields', 'description')"
:message="$i18n.getHelperMessage('fields', 'description')"> :message="$i18n.getHelperMessage('fields', 'description')"/>
</help-button>
</label> </label>
<b-input type="textarea" name="description" v-model="editForm.description" @focus="clearErrors('description')" ></b-input> <b-input
type="textarea"
name="description"
v-model="editForm.description"
@focus="clearErrors('description')" />
</b-field> </b-field>
<b-field <b-field
:addons="false" :addons="false"
:type="formErrors['status'] != undefined ? 'is-danger' : ''" :type="formErrors['status'] != undefined ? 'is-danger' : ''"
:message="formErrors['status'] != undefined ? formErrors['status'] : ''"> :message="formErrors['status'] != undefined ? formErrors['status'] : ''">
<label class="label"> <label class="label">
{{$i18n.get('label_status')}} {{ $i18n.get('label_status') }}
<help-button <help-button
:title="$i18n.getHelperTitle('fields', 'status')" :title="$i18n.getHelperTitle('fields', 'status')"
:message="$i18n.getHelperMessage('fields', 'status')"> :message="$i18n.getHelperMessage('fields', 'status')"/>
</help-button>
</label> </label>
<div class="inline-block"> <div class="inline-block">
<b-radio <b-radio
@focus="clearErrors('label_status')" @focus="clearErrors('label_status')"
id="tainacan-select-status-publish" id="tainacan-select-status-publish"
name="status" name="status"
v-model="editForm.status" v-model="editForm.status"
native-value="publish"> native-value="publish">
{{ $i18n.get('publish_visibility') }} {{ $i18n.get('publish_visibility') }}
</b-radio> </b-radio>
<br> <br>
<b-radio <b-radio
@focus="clearErrors('label_status')" @focus="clearErrors('label_status')"
id="tainacan-select-status-private" id="tainacan-select-status-private"
name="status" name="status"
v-model="editForm.status" v-model="editForm.status"
native-value="private"> native-value="private">
{{ $i18n.get('private_visibility') }} {{ $i18n.get('private_visibility') }}
</b-radio> </b-radio>
</div> </div>
</b-field> </b-field>
<br> <br>
<b-field <b-field
:addons="false" :addons="false"
:label="$i18n.get('label_options')"> :label="$i18n.get('label_options')">
<b-field <b-field
:type="formErrors['required'] != undefined ? 'is-danger' : ''" :type="formErrors['required'] != undefined ? 'is-danger' : ''"
:message="formErrors['required'] != undefined ? formErrors['required'] : ''"> :message="formErrors['required'] != undefined ? formErrors['required'] : ''">
<b-checkbox <b-checkbox
@input="clearErrors('required')" @input="clearErrors('required')"
v-model="editForm.required" v-model="editForm.required"
true-value="yes" true-value="yes"
false-value="no" false-value="no"
name="required"> name="required">
{{ $i18n.get('label_required') }} {{ $i18n.get('label_required') }}
</b-checkbox> </b-checkbox>
<help-button <help-button
:title="$i18n.getHelperTitle('fields', 'required')" :title="$i18n.getHelperTitle('fields', 'required')"
:message="$i18n.getHelperMessage('fields', 'required')"> :message="$i18n.getHelperMessage('fields', 'required')"/>
</help-button>
</b-field> </b-field>
<b-field <b-field
:type="formErrors['multiple'] != undefined ? 'is-danger' : ''" :type="formErrors['multiple'] != undefined ? 'is-danger' : ''"
:message="formErrors['multiple'] != undefined ? formErrors['multiple'] : ''"> :message="formErrors['multiple'] != undefined ? formErrors['multiple'] : ''">
<b-checkbox <b-checkbox
@input="clearErrors('multiple')" @input="clearErrors('multiple')"
v-model="editForm.multiple" v-model="editForm.multiple"
true-value="yes" true-value="yes"
false-value="no" false-value="no"
name="multiple"> name="multiple">
{{ $i18n.get('label_allow_multiple') }} {{ $i18n.get('label_allow_multiple') }}
</b-checkbox> </b-checkbox>
<help-button <help-button
:title="$i18n.getHelperTitle('fields', 'multiple')" :title="$i18n.getHelperTitle('fields', 'multiple')"
:message="$i18n.getHelperMessage('fields', 'multiple')"> :message="$i18n.getHelperMessage('fields', 'multiple')"/>
</help-button>
</b-field> </b-field>
<b-field <b-field
:type="formErrors['unique'] != undefined ? 'is-danger' : ''" :type="formErrors['unique'] != undefined ? 'is-danger' : ''"
:message="formErrors['unique'] != undefined ? formErrors['unique'] : ''"> :message="formErrors['unique'] != undefined ? formErrors['unique'] : ''">
<b-checkbox <b-checkbox
@input="clearErrors('unique')" @input="clearErrors('unique')"
v-model="editForm.unique" v-model="editForm.unique"
true-value="yes" true-value="yes"
false-value="no" false-value="no"
name="collecion_key"> name="collecion_key">
{{ $i18n.get('label_unique_value') }} {{ $i18n.get('label_unique_value') }}
</b-checkbox> </b-checkbox>
<help-button <help-button
:title="$i18n.getHelperTitle('fields', 'unique')" :title="$i18n.getHelperTitle('fields', 'unique')"
:message="$i18n.getHelperMessage('fields', 'unique')"> :message="$i18n.getHelperMessage('fields', 'unique')"/>
</help-button>
</b-field> </b-field>
</b-field> </b-field>
<component <component
:errors="formErrors['field_type_options']" :errors="formErrors['field_type_options']"
v-if="(editForm.field_type_object && editForm.field_type_object.form_component) || editForm.edit_form == ''" v-if="(editForm.field_type_object && editForm.field_type_object.form_component) || editForm.edit_form == ''"
:is="editForm.field_type_object.form_component" :is="editForm.field_type_object.form_component"
:field="editForm" :field="editForm"
v-model="editForm.field_type_options"> v-model="editForm.field_type_options"/>
</component> <div
<div v-html="editForm.edit_form" v-else></div> v-html="editForm.edit_form"
v-else/>
<div class="field is-grouped form-submit"> <div class="field is-grouped form-submit">
<div class="control"> <div class="control">
<button class="button is-outlined" @click.prevent="cancelEdition()" slot="trigger">{{ $i18n.get('cancel')}}</button> <button
class="button is-outlined"
@click.prevent="cancelEdition()"
slot="trigger">{{ $i18n.get('cancel') }}</button>
</div> </div>
<div class="control"> <div class="control">
<button class="button is-success" type="submit">{{ $i18n.get('save')}}</button> <button
class="button is-success"
type="submit">{{ $i18n.get('save') }}</button>
</div> </div>
</div> </div>
<p class="help is-danger">{{formErrorMessage}}</p> <p class="help is-danger">{{ formErrorMessage }}</p>
</form> </form>
</template> </template>
@ -154,8 +166,8 @@ export default {
}, },
props: { props: {
index: '', index: '',
editedField: {}, editedField: Object,
originalField: '', originalField: Object,
isRepositoryLevel: false, isRepositoryLevel: false,
collectionId: '' collectionId: ''
}, },
@ -188,7 +200,7 @@ export default {
if ((field.field_type_object && field.field_type_object.form_component) || field.edit_form == '') { if ((field.field_type_object && field.field_type_object.form_component) || field.edit_form == '') {
this.updateField({collectionId: this.collectionId, fieldId: field.id, isRepositoryLevel: this.isRepositoryLevel, index: this.index, options: this.editForm}) this.updateField({collectionId: this.collectionId, fieldId: field.id, isRepositoryLevel: this.isRepositoryLevel, index: this.index, options: this.editForm})
.then((field) => { .then(() => {
this.editForm = {}; this.editForm = {};
this.formErrors = {}; this.formErrors = {};
this.formErrorMessage = ''; this.formErrorMessage = '';
@ -215,7 +227,7 @@ export default {
formObj[key] = value; formObj[key] = value;
this.updateField({collectionId: this.collectionId, fieldId: field.id, isRepositoryLevel: this.isRepositoryLevel, index: this.index, options: formObj}) this.updateField({collectionId: this.collectionId, fieldId: field.id, isRepositoryLevel: this.isRepositoryLevel, index: this.index, options: formObj})
.then((field) => { .then(() => {
this.editForm = {}; this.editForm = {};
this.formErrors = {}; this.formErrors = {};
this.formErrorMessage = ''; this.formErrorMessage = '';

114
src/admin/components/edition/filter-edition-form.vue
View File

@ -1,85 +1,99 @@
<template> <template>
<form id="filterEditForm" class="tainacan-form" v-on:submit.prevent="saveEdition(editForm)"> <form
id="filterEditForm"
class="tainacan-form"
@submit.prevent="saveEdition(editForm)">
<b-field <b-field
:addons="false" :addons="false"
:type="formErrors['name'] != undefined ? 'is-danger' : ''" :type="formErrors['name'] != undefined ? 'is-danger' : ''"
:message="formErrors['name'] != undefined ? formErrors['name'] : ''"> :message="formErrors['name'] != undefined ? formErrors['name'] : ''">
<label class="label"> <label class="label">
{{$i18n.get('label_name')}} {{ $i18n.get('label_name') }}
<span class="required-field-asterisk" :class="formErrors['name'] != undefined ? 'is-danger' : ''">*</span> <span
class="required-field-asterisk"
:class="formErrors['name'] != undefined ? 'is-danger' : ''">*</span>
<help-button <help-button
:title="$i18n.getHelperTitle('filters', 'name')" :title="$i18n.getHelperTitle('filters', 'name')"
:message="$i18n.getHelperMessage('filters', 'name')"> :message="$i18n.getHelperMessage('filters', 'name')"/>
</help-button>
</label> </label>
<b-input v-model="editForm.name" name="name" @focus="clearErrors('name')"></b-input> <b-input
v-model="editForm.name"
name="name"
@focus="clearErrors('name')"/>
</b-field> </b-field>
<b-field <b-field
:addons="false" :addons="false"
:type="formErrors['description'] != undefined ? 'is-danger' : ''" :type="formErrors['description'] != undefined ? 'is-danger' : ''"
:message="formErrors['description'] != undefined ? formErrors['description'] : ''"> :message="formErrors['description'] != undefined ? formErrors['description'] : ''">
<label class="label"> <label class="label">
{{$i18n.get('label_description')}} {{ $i18n.get('label_description') }}
<help-button <help-button
:title="$i18n.getHelperTitle('filters', 'description')" :title="$i18n.getHelperTitle('filters', 'description')"
:message="$i18n.getHelperMessage('filters', 'description')"> :message="$i18n.getHelperMessage('filters', 'description')"/>
</help-button>
</label> </label>
<b-input type="textarea" name="description" v-model="editForm.description" @focus="clearErrors('description')" ></b-input> <b-input
type="textarea"
name="description"
v-model="editForm.description"
@focus="clearErrors('description')" />
</b-field> </b-field>
<b-field <b-field
:addons="false" :addons="false"
:type="formErrors['status'] != undefined ? 'is-danger' : ''" :type="formErrors['status'] != undefined ? 'is-danger' : ''"
:message="formErrors['status'] != undefined ? formErrors['status'] : ''"> :message="formErrors['status'] != undefined ? formErrors['status'] : ''">
<label class="label"> <label class="label">
{{$i18n.get('label_status')}} {{ $i18n.get('label_status') }}
<help-button <help-button
:title="$i18n.getHelperTitle('filters', 'status')" :title="$i18n.getHelperTitle('filters', 'status')"
:message="$i18n.getHelperMessage('filters', 'status')"> :message="$i18n.getHelperMessage('filters', 'status')"/>
</help-button>
</label> </label>
<div class="inline-block"> <div class="inline-block">
<b-radio <b-radio
@focus="clearErrors('label_status')" @focus="clearErrors('label_status')"
id="tainacan-select-status-publish" id="tainacan-select-status-publish"
name="status" name="status"
v-model="editForm.status" v-model="editForm.status"
native-value="publish"> native-value="publish">
{{ $i18n.get('publish_visibility') }} {{ $i18n.get('publish_visibility') }}
</b-radio> </b-radio>
<br> <br>
<b-radio <b-radio
@focus="clearErrors('label_status')" @focus="clearErrors('label_status')"
id="tainacan-select-status-private" id="tainacan-select-status-private"
name="status" name="status"
v-model="editForm.status" v-model="editForm.status"
native-value="private"> native-value="private">
{{ $i18n.get('private_visibility') }} {{ $i18n.get('private_visibility') }}
</b-radio> </b-radio>
</div> </div>
</b-field> </b-field>
<component <component
:errors="formErrors['filter_type_options']" :errors="formErrors['filter_type_options']"
v-if="(editForm.filter_type_object && editForm.filter_type_object.form_component) || editForm.edit_form == ''" v-if="(editForm.filter_type_object && editForm.filter_type_object.form_component) || editForm.edit_form == ''"
:is="editForm.filter_type_object.form_component" :is="editForm.filter_type_object.form_component"
:filter="editForm" :filter="editForm"
v-model="editForm.filter_type_options"> v-model="editForm.filter_type_options"/>
</component> <div
<div v-html="editForm.edit_form" v-else></div> v-html="editForm.edit_form"
v-else/>
<div class="field is-grouped form-submit"> <div class="field is-grouped form-submit">
<div class="control"> <div class="control">
<button class="button is-outlined" @click.prevent="cancelEdition()" slot="trigger">{{ $i18n.get('cancel')}}</button> <button
class="button is-outlined"
@click.prevent="cancelEdition()"
slot="trigger">{{ $i18n.get('cancel') }}</button>
</div> </div>
<div class="control"> <div class="control">
<button class="button is-success" type="submit">{{ $i18n.get('save')}}</button> <button
class="button is-success"
type="submit">{{ $i18n.get('save') }}</button>
</div> </div>
</div> </div>
<p class="help is-danger">{{formErrorMessage}}</p> <p class="help is-danger">{{ formErrorMessage }}</p>
</form> </form>
</template> </template>
@ -99,8 +113,8 @@ export default {
}, },
props: { props: {
index: '', index: '',
editedFilter: {}, editedFilter: Object,
originalFilter: {}, originalFilter: Object,
}, },
created() { created() {
@ -130,7 +144,7 @@ export default {
if ((filter.filter_type_object && filter.filter_type_object.form_component) || filter.edit_form == '') { if ((filter.filter_type_object && filter.filter_type_object.form_component) || filter.edit_form == '') {
this.updateFilter({ filterId: filter.id, index: this.index, options: this.editForm}) this.updateFilter({ filterId: filter.id, index: this.index, options: this.editForm})
.then((filter) => { .then(() => {
this.editForm = {}; this.editForm = {};
this.formErrors = {}; this.formErrors = {};
this.formErrorMessage = ''; this.formErrorMessage = '';
@ -157,7 +171,7 @@ export default {
formObj[key] = value; formObj[key] = value;
this.updateFilter({ filterId: filter.id, index: this.index, options: formObj}) this.updateFilter({ filterId: filter.id, index: this.index, options: formObj})
.then((filter) => { .then(() => {
this.editForm = {}; this.editForm = {};
this.formErrors = {}; this.formErrors = {};
this.formErrorMessage = ''; this.formErrorMessage = '';

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

@ -1,14 +1,19 @@
<template> <template>
<div class="page-container"> <div class="page-container">
<b-tag v-if="!isLoading" :type="'is-' + getStatusColor(item.status)" v-text="item.status"></b-tag> <b-tag
<form v-if="!isLoading" class="tainacan-form" label-width="120px"> v-if="!isLoading"
:type="'is-' + getStatusColor(item.status)"
v-text="item.status"/>
<form
v-if="!isLoading"
class="tainacan-form"
label-width="120px">
<b-field <b-field
:addons="false" :addons="false"
:label="$i18n.get('label_status')"> :label="$i18n.get('label_status')">
<help-button <help-button
:title="$i18n.getHelperTitle('items', 'status')" :title="$i18n.getHelperTitle('items', 'status')"
:message="$i18n.getHelperMessage('items', 'status')"> :message="$i18n.getHelperMessage('items', 'status')"/>
</help-button>
<b-select <b-select
id="status-select" id="status-select"
v-model="form.status" v-model="form.status"
@ -27,30 +32,36 @@
<b-field :label="$i18n.get('label_image')"> <b-field :label="$i18n.get('label_image')">
<div class="thumbnail-field"> <div class="thumbnail-field">
<b-upload <b-upload
v-if="item.featured_image == undefined || item.featured_image == false" v-if="item.featured_image == undefined || item.featured_image == false"
v-model="thumbnail" v-model="thumbnail"
drag-drop drag-drop
@input="uploadThumbnail($event)"> @input="uploadThumbnail($event)">
<div class="content has-text-centered"> <div class="content has-text-centered">
<p> <p>
<b-icon <b-icon
icon="upload"> icon="upload"/>
</b-icon>
</p> </p>
<p>{{ $i18n.get('instruction_image_upload_box') }}</p> <p>{{ $i18n.get('instruction_image_upload_box') }}</p>
</div> </div>
</b-upload> </b-upload>
<div v-else> <div v-else>
<figure class="image is-128x128"> <figure class="image is-128x128">
<img :alt="$i18n.get('label_thumbnail')" :src="item.featured_image"/> <img
:alt="$i18n.get('label_thumbnail')"
:src="item.featured_image">
</figure> </figure>
<div class="thumbnail-buttons-row"> <div class="thumbnail-buttons-row">
<b-upload <b-upload
model="thumbnail" model="thumbnail"
@input="uploadThumbnail($event)"> @input="uploadThumbnail($event)">
<a id="button-edit" :aria-label="$i18n.get('label_button_edit_thumb')"><b-icon icon="pencil"></a> <a
id="button-edit"
:aria-label="$i18n.get('label_button_edit_thumb')"><b-icon icon="pencil"/></a>
</b-upload> </b-upload>
<a id="button-delete" :aria-label="$i18n.get('label_button_delete_thumb')" @click="deleteThumbnail()"><b-icon icon="delete"></a> <a
id="button-delete"
:aria-label="$i18n.get('label_button_delete_thumb')"
@click="deleteThumbnail()"><b-icon icon="delete"/></a>
</div> </div>
</div> </div>
</div> </div>
@ -59,14 +70,15 @@
<!-- Fields from Collection-------------------------------- --> <!-- Fields from Collection-------------------------------- -->
<tainacan-form-item <tainacan-form-item
v-for="(field, index) in fieldList" v-for="(field, index) in fieldList"
v-bind:key="index" :key="index"
:field="field"></tainacan-form-item> :field="field"/>
<!-- Attachments ------------------------------------------ --> <!-- Attachments ------------------------------------------ -->
<div class="columns is-multiline"> <div class="columns is-multiline">
<div class="column is-4"> <div class="column is-4">
<b-field :label="$i18n.get('label_image')"> <b-field :label="$i18n.get('label_image')">
<b-upload v-model="form.files" <b-upload
v-model="form.files"
multiple multiple
drag-drop drag-drop
@input="uploadAttachment($event)"> @input="uploadAttachment($event)">
@ -75,8 +87,7 @@
<p> <p>
<b-icon <b-icon
icon="upload" icon="upload"
size="is-large"> size="is-large"/>
</b-icon>
</p> </p>
<p>{{ $i18n.get('instruction_image_upload_box') }}</p> <p>{{ $i18n.get('instruction_image_upload_box') }}</p>
</div> </div>
@ -84,48 +95,52 @@
</b-upload> </b-upload>
</b-field> </b-field>
<div class="uploaded-files"> <div class="uploaded-files">
<div v-for="(file, index) in form.files" <div
:key="index"> v-for="(file, index) in form.files"
:key="index">
<span class="tag is-primary"> <span class="tag is-primary">
{{ file.name }} {{ file.name }}
<button class="delete is-small" <button
class="delete is-small"
type="button" type="button"
@click="deleteFile(index)"> @click="deleteFile(index)"/>
</button>
</span> </span>
<!-- <progress class="progress is-secondary" value="15" max="100">30%</progress> --> <!-- <progress class="progress is-secondary" value="15" max="100">30%</progress> -->
</div> </div>
</div> </div>
</div> </div>
<div class="column is-narrow" <div
class="column is-narrow"
v-for="(attachment, index) of item.attachments" v-for="(attachment, index) of item.attachments"
:key="index"> :key="index">
<figure class="image is-128x128"> <figure class="image is-128x128">
<img <img
:alt="attachment.title" :alt="attachment.title"
:src="attachment.url"/> :src="attachment.url">
</figure> </figure>
</div> </div>
</div> </div>
<div class="field is-grouped form-submit"> <div class="field is-grouped form-submit">
<div class="control"> <div class="control">
<button <button
id="button-cancel-item-creation" id="button-cancel-item-creation"
class="button is-outlined" class="button is-outlined"
type="button" type="button"
@click="cancelBack">{{ $i18n.get('cancel') }}</button> @click="cancelBack">{{ $i18n.get('cancel') }}</button>
</div> </div>
<div class="control"> <div class="control">
<button <button
id="button-submit-item-creation" id="button-submit-item-creation"
@click.prevent="onSubmit" @click.prevent="onSubmit"
class="button is-success" :disabled="formHasErrors">{{ $i18n.get('save') }}</button> class="button is-success"
:disabled="formHasErrors">{{ $i18n.get('save') }}</button>
</div> </div>
</div> </div>
</form> </form>
<b-loading :active.sync="isLoading" :canCancel="false"> <b-loading
</div> :active.sync="isLoading"
:can-cancel="false"/></div>
</template> </template>
<script> <script>
@ -195,7 +210,7 @@ export default {
this.$router.push(this.$routerHelper.getItemPath(this.form.collectionId, this.itemId)); this.$router.push(this.$routerHelper.getItemPath(this.form.collectionId, this.itemId));
}).catch(error => { }).catch(error => {
this.$console.error(error);
this.isLoading = false; this.isLoading = false;
}); });
}, },
@ -230,11 +245,11 @@ export default {
this.loadMetadata(); this.loadMetadata();
}) })
.catch(error => console.log(error)); .catch(error => this.$console.error(error));
}, },
loadMetadata() { loadMetadata() {
// Obtains Item Field // Obtains Item Field
this.fetchFields(this.itemId).then(res => { this.fetchFields(this.itemId).then(() => {
this.isLoading = false; this.isLoading = false;
}); });
}, },
@ -245,11 +260,11 @@ export default {
for (let file of $event) { for (let file of $event) {
this.sendAttachment({ item_id: this.itemId, file: file }) this.sendAttachment({ item_id: this.itemId, file: file })
.then((res) => { .then(() => {
}) })
.catch((error) => { .catch((error) => {
console.log(error); this.$console.error(error);
}); });
} }
}, },
@ -263,25 +278,25 @@ export default {
this.item.featured_image = res.featured_image; this.item.featured_image = res.featured_image;
}) })
.catch((error) => { .catch((error) => {
console.log(error); this.$console.error(error);
}); });
}) })
.catch((error) => { .catch((error) => {
console.log(error); this.$console.error(error);
}); });
}, },
deleteThumbnail() { deleteThumbnail() {
this.updateThumbnail({itemId: this.itemId, thumbnailId: 0}) this.updateThumbnail({itemId: this.itemId, thumbnailId: 0})
.then((res) => { .then(() => {
this.item.featured_image = false; this.item.featured_image = false;
}) })
.catch((error) => { .catch((error) => {
console.log(error); this.$console.error(error);
}); });
}, },
deleteFile(index) { deleteFile(index) {
this.$console.log("Delete:" + index);
} }
}, },
computed: { computed: {

218
src/admin/components/edition/term-edition-form.vue Normal file
View File

@ -0,0 +1,218 @@
<template>
<form
id="termEditForm"
class="tainacan-form"
@submit.prevent="saveEdition(editForm)">
<b-field
:addons="false"
:type="formErrors['name'] != undefined ? 'is-danger' : ''"
:message="formErrors['name'] != undefined ? formErrors['name'] : ''">
<label class="label">
{{ $i18n.get('label_name') }}
<span
class="required-term-asterisk"
:class="formErrors['name'] != undefined ? 'is-danger' : ''">*</span>
<help-button
:title="$i18n.getHelperTitle('terms', 'name')"
:message="$i18n.getHelperMessage('terms', 'name')"/>
</label>
<b-input
v-model="editForm.name"
name="name"
@focus="clearErrors('name')"/>
</b-field>
<b-field
:addons="false"
:type="formErrors['description'] != undefined ? 'is-danger' : ''"
:message="formErrors['description'] != undefined ? formErrors['description'] : ''">
<label class="label">
{{ $i18n.get('label_description') }}
<help-button
:title="$i18n.getHelperTitle('terms', 'description')"
:message="$i18n.getHelperMessage('terms', 'description')"/>
</label>
<b-input
type="textarea"
name="description"
v-model="editForm.description"
@focus="clearErrors('description')" />
</b-field>
<b-field
:addons="false"
:type="formErrors['parent_term'] != undefined ? 'is-danger' : ''"
:message="formErrors['parent_term'] != undefined ? formErrors['parent_term'] : ''">
<label class="label">
{{ $i18n.get('label_parent_term') }}
<help-button
:title="$i18n.getHelperTitle('terms', 'parent_term')"
:message="$i18n.getHelperMessage('terms', 'parent_term')"/>
</label>
<b-select
id="parent_term_select"
v-model="editForm.parent"
:placeholder="$i18n.get('instruction_select_a_parent_term')">
<option
@focus="clearErrors('label_parent_term')"
id="tainacan-select-parent-term"
v-for="(parentTerm, index) in parentTermsList"
:key="index"
:value="editForm.parent.id">
{{ parentTerm.name }}
</option>
</b-select>
</b-field>
<div class="field is-grouped form-submit">
<div class="control">
<button
class="button is-outlined"
@click.prevent="cancelEdition()"
slot="trigger">
{{ $i18n.get('cancel') }}
</button>
</div>
<div class="control">
<button
class="button is-success"
type="submit">
{{ $i18n.get('save') }}
</button>
</div>
</div>
<p class="help is-danger">{{ formErrorMessage }}</p>
</form>
</template>
<script>
import { mapActions, mapGetters } from 'vuex';
export default {
name: 'TermEditionForm',
data(){
return {
editForm: {},
oldForm: {},
formErrors: {},
formErrorMessage: '',
closedByForm: false
}
},
props: {
index: '',
editedTerm: Object,
originalTerm: Object,
categoryId: ''
},
computed: {
parentTermsList() {
return this.getTerms();
}
},
created() {
this.editForm = this.editedTerm;
this.formErrors = this.editForm.formErrors != undefined ? this.editForm.formErrors : {};
this.formErrorMessage = this.editForm.formErrors != undefined ? this.editForm.formErrorMessage : '';
this.oldForm = JSON.parse(JSON.stringify(this.originalTerm));
},
beforeDestroy() {
if (this.closedByForm) {
this.editedTerm.saved = true;
} else {
this.oldForm.saved = this.editForm.saved;
if (JSON.stringify(this.editForm) != JSON.stringify(this.oldForm))
this.editedTerm.saved = false;
else
this.editedTerm.saved = true;
}
},
methods: {
...mapActions('category', [
'sendTerm',
'updateTerm'
]),
...mapGetters('category', [
'getTerms'
]),
saveEdition(term) {
if (term.term_id == 'new') {
this.sendTerm({
categoryId: this.categoryId,
index: this.index,
name: this.editForm.name,
description: this.editForm.description,
parent: this.editForm.parent
})
.then(() => {
this.editForm = {};
this.formErrors = {};
this.formErrorMessage = '';
this.closedByForm = true;
this.$emit('onEditionFinished');
})
.catch((error) => {
// for (let error of errors.errors) {
// for (let attribute of Object.keys(error))
// this.formErrors[attribute] = error[attribute];
// }
// this.formErrorMessage = errors.error_message;
this.$emit('onErrorFound');
this.$console.log(error);
// this.editForm.formErrors = this.formErrors;
// this.editForm.formErrorMessage = this.formErrorMessage;
});
} else {
this.updateTerm({categoryId: this.categoryId, termId: term.term_id, index: this.index, options: this.editForm})
.then(() => {
this.editForm = {};
this.formErrors = {};
this.formErrorMessage = '';
this.closedByForm = true;
this.$emit('onEditionFinished');
})
.catch((error) => {
// for (let error of errors.errors) {
// for (let attribute of Object.keys(error))
// this.formErrors[attribute] = error[attribute];
// }
// this.formErrorMessage = errors.error_message;
this.$emit('onErrorFound');
this.$console.log(error);
// this.editForm.formErrors = this.formErrors;
// this.editForm.formErrorMessage = this.formErrorMessage;
});
}
},
clearErrors(attribute) {
this.formErrors[attribute] = undefined;
},
cancelEdition() {
this.closedByForm = true;
this.$emit('onEditionCanceled');
},
}
}
</script>
<style lang="scss" scoped>
@import "../../scss/_variables.scss";
form {
padding: 1.0em 2.0em;
border-top: 1px solid $draggable-border-color;
border-bottom: 1px solid $draggable-border-color;
margin-top: 1.0em;
}
</style>

81
src/admin/components/lists/categories-list.vue
View File

@ -1,12 +1,14 @@
<template> <template>
<div> <div>
<b-field grouped group-multiline> <b-field
grouped
group-multiline>
<button <button
v-if="selectedCategories.length > 0" v-if="selectedCategories.length > 0"
class="button field is-danger" class="button field is-danger"
@click="deleteSelectedCategories()"> @click="deleteSelectedCategories()">
<span>{{ $i18n.get('instruction_delete_selected_categories') }} </span> <span>{{ $i18n.get('instruction_delete_selected_categories') }} </span>
<b-icon icon="delete"></b-icon> <b-icon icon="delete"/>
</button> </button>
</b-field> </b-field>
@ -14,7 +16,6 @@
v-if="totalCategories > 0" v-if="totalCategories > 0"
ref="categoryTable" ref="categoryTable"
:data="categories" :data="categories"
@selection-change="handleSelectionChange"
:checked-rows.sync="selectedCategories" :checked-rows.sync="selectedCategories"
checkable checkable
:loading="isLoading" :loading="isLoading"
@ -44,7 +45,10 @@
property="description" property="description"
show-overflow-tooltip show-overflow-tooltip
field="props.row.description"> field="props.row.description">
<router-link class="clickable-row" tag="span" :to="{path: $routerHelper.getCategoryPath(props.row.id)}"> <router-link
class="clickable-row"
tag="span"
:to="{path: $routerHelper.getCategoryPath(props.row.id)}">
{{ props.row.description }} {{ props.row.description }}
</router-link> </router-link>
</b-table-column> </b-table-column>
@ -59,13 +63,17 @@
id="button-edit" id="button-edit"
:aria-label="$i18n.getFrom('categories','edit_item')" :aria-label="$i18n.getFrom('categories','edit_item')"
@click.prevent.stop="goToCategoryEditPage(props.row.id)"> @click.prevent.stop="goToCategoryEditPage(props.row.id)">
<b-icon type="is-gray" icon="pencil" ></b-icon> <b-icon
type="is-gray"
icon="pencil" />
</a> </a>
<a <a
id="button-delete" id="button-delete"
:aria-label="$i18n.get('label_button_delete')" :aria-label="$i18n.get('label_button_delete')"
@click.prevent.stop="deleteOneCategory(props.row.id)"> @click.prevent.stop="deleteOneCategory(props.row.id)">
<b-icon type="is-gray" icon="delete" ></b-icon> <b-icon
type="is-gray"
icon="delete" />
</a> </a>
</b-table-column> </b-table-column>
</template> </template>
@ -78,12 +86,13 @@
<p> <p>
<b-icon <b-icon
icon="inbox" icon="inbox"
size="is-large"> size="is-large"/>
</b-icon>
</p> </p>
<p>{{ $i18n.get('info_no_category_created') }}</p> <p>{{ $i18n.get('info_no_category_created') }}</p>
<router-link tag="button" class="button is-secondary" <router-link
:to="{ path: $routerHelper.getNewCategoryPath() }"> tag="button"
class="button is-secondary"
:to="{ path: $routerHelper.getNewCategoryPath() }">
{{ $i18n.get('new') + ' ' + $i18n.get('category') }} {{ $i18n.get('new') + ' ' + $i18n.get('category') }}
</router-link> </router-link>
</div> </div>
@ -93,7 +102,6 @@
</template> </template>
<script> <script>
import { mapActions } from 'vuex' import { mapActions } from 'vuex'
export default { export default {
@ -103,7 +111,7 @@
totalCategories: 0, totalCategories: 0,
page: 1, page: 1,
categoriesPerPage: 12, categoriesPerPage: 12,
categories: [] categories: Array
}, },
data() { data() {
return { return {
@ -118,28 +126,29 @@
this.$dialog.confirm({ this.$dialog.confirm({
message: this.$i18n.get('info_warning_category_delete'), message: this.$i18n.get('info_warning_category_delete'),
onConfirm: () => { onConfirm: () => {
this.deleteCategory(categoryId).then(() => { this.deleteCategory(categoryId)
this.loadCategories(); .then(() => {
this.$toast.open({ this.$toast.open({
duration: 3000, duration: 3000,
message: this.$i18n.get('info_category_deleted'), message: this.$i18n.get('info_category_deleted'),
position: 'is-bottom', position: 'is-bottom',
type: 'is-secondary', type: 'is-secondary',
queue: true queue: true
}); });
for (let i = 0; i < this.selectedCategories.length; i++) { for (let i = 0; i < this.selectedCategories.length; i++) {
if (this.selectedCategories[i].id === this.categoryId) if (this.selectedCategories[i].id === this.categoryId)
this.selectedCategories.splice(i, 1); this.selectedCategories.splice(i, 1);
} }
}).catch(() =>
this.$toast.open({
duration: 3000,
message: this.$i18n.get('info_error_deleting_category'),
position: 'is-bottom',
type: 'is-danger',
queue: true
}) })
); .catch(() => {
this.$toast.open({
duration: 3000,
message: this.$i18n.get('info_error_deleting_category'),
position: 'is-bottom',
type: 'is-danger',
queue: true
});
});
} }
}); });
}, },
@ -150,7 +159,7 @@
for (let category of this.selectedCategories) { for (let category of this.selectedCategories) {
this.deleteCategory(category.id) this.deleteCategory(category.id)
.then((res) => { .then(() => {
this.loadCategories(); this.loadCategories();
this.$toast.open({ this.$toast.open({
duration: 3000, duration: 3000,
@ -159,7 +168,7 @@
type: 'is-secondary', type: 'is-secondary',
queue: false queue: false
}) })
}).catch((err) => { }).catch(() => {
this.$toast.open({ this.$toast.open({
duration: 3000, duration: 3000,
message: this.$i18n.get('info_error_deleting_category'), message: this.$i18n.get('info_error_deleting_category'),
@ -173,8 +182,6 @@
} }
}); });
}, },
handleSelectionChange(value) {
},
goToCategoryPage(categoryId) { goToCategoryPage(categoryId) {
this.$router.push(this.$routerHelper.getCategoryPath(categoryId)); this.$router.push(this.$routerHelper.getCategoryPath(categoryId));
}, },

109
src/admin/components/lists/collections-list.vue
View File

@ -1,12 +1,16 @@
<template> <template>
<div> <div>
<b-field grouped group-multiline> <b-field
<button v-if="selectedCollections.length > 0" class="button field is-danger" @click="deleteSelectedCollections()"><span>{{$i18n.get('instruction_delete_selected_collections')}} </span><b-icon icon="delete"></b-icon></button> grouped
group-multiline>
<button
v-if="selectedCollections.length > 0"
class="button field is-danger"
@click="deleteSelectedCollections()"><span>{{ $i18n.get('instruction_delete_selected_collections') }} </span><b-icon icon="delete"/></button>
</b-field> </b-field>
<b-table <b-table
ref="collectionTable" ref="collectionTable"
:data="collections" :data="collections"
@selection-change="handleSelectionChange"
:checked-rows.sync="selectedCollections" :checked-rows.sync="selectedCollections"
checkable checkable
:loading="isLoading" :loading="isLoading"
@ -16,33 +20,84 @@
backend-sorting> backend-sorting>
<template slot-scope="props"> <template slot-scope="props">
<b-table-column tabindex="0" :label="$i18n.get('label_thumbnail')" :aria-label="$i18n.get('label_thumbnail')" field="featured_image" width="55"> <b-table-column
<template v-if="props.row.featured_image" slot-scope="scope"> tabindex="0"
<router-link tag="img" :to="{path: $routerHelper.getCollectionPath(props.row.id)}" class="table-thumb clickable-row" :src="`${props.row.featured_image}`"></router-link> :label="$i18n.get('label_thumbnail')"
:aria-label="$i18n.get('label_thumbnail')"
field="featured_image"
width="55">
<template
v-if="props.row.featured_image"
slot-scope="scope">
<router-link
tag="img"
:to="{path: $routerHelper.getCollectionPath(props.row.id)}"
class="table-thumb clickable-row"
:src="`${props.row.featured_image}`"/>
</template> </template>
</b-table-column> </b-table-column>
<b-table-column tabindex="0" :label="$i18n.get('label_name')" :aria-label="$i18n.get('label_name')" field="props.row.name"> <b-table-column
<router-link class="clickable-row" tag="span" :to="{path: $routerHelper.getCollectionPath(props.row.id)}"> tabindex="0"
:label="$i18n.get('label_name')"
:aria-label="$i18n.get('label_name')"
field="props.row.name">
<router-link
class="clickable-row"
tag="span"
:to="{path: $routerHelper.getCollectionPath(props.row.id)}">
{{ props.row.name }} {{ props.row.name }}
</router-link> </router-link>
</b-table-column> </b-table-column>
<b-table-column tabindex="0" :aria-label="$i18n.get('label_description')" :label="$i18n.get('label_description')" property="description" show-overflow-tooltip field="props.row.description"> <b-table-column
<router-link class="clickable-row" tag="span" :to="{path: $routerHelper.getCollectionPath(props.row.id)}"> tabindex="0"
:aria-label="$i18n.get('label_description')"
:label="$i18n.get('label_description')"
property="description"
show-overflow-tooltip
field="props.row.description">
<router-link
class="clickable-row"
tag="span"
:to="{path: $routerHelper.getCollectionPath(props.row.id)}">
{{ props.row.description }} {{ props.row.description }}
</router-link> </router-link>
</b-table-column> </b-table-column>
<b-table-column class="row-creation" tabindex="0" :aria-label="$i18n.get('label_creation') + ': ' + props.row.creation" :label="$i18n.get('label_creation')" property="creation" show-overflow-tooltip field="props.row.creation"> <b-table-column
<router-link class="clickable-row" v-html="props.row.creation" tag="span" :to="{path: $routerHelper.getCollectionPath(props.row.id)}"> class="row-creation"
</router-link> tabindex="0"
:aria-label="$i18n.get('label_creation') + ': ' + props.row.creation"
:label="$i18n.get('label_creation')"
property="creation"
show-overflow-tooltip
field="props.row.creation">
<router-link
class="clickable-row"
v-html="props.row.creation"
tag="span"
:to="{path: $routerHelper.getCollectionPath(props.row.id)}"/>
</b-table-column> </b-table-column>
<b-table-column tabindex="0" :label="$i18n.get('label_actions')" width="78" :aria-label="$i18n.get('label_actions')"> <b-table-column
tabindex="0"
:label="$i18n.get('label_actions')"
width="78"
:aria-label="$i18n.get('label_actions')">
<!-- <a id="button-view" :aria-label="$i18n.get('label_button_view')" @click.prevent.stop="goToCollectionPage(props.row.id)"><b-icon icon="eye"></a> --> <!-- <a id="button-view" :aria-label="$i18n.get('label_button_view')" @click.prevent.stop="goToCollectionPage(props.row.id)"><b-icon icon="eye"></a> -->
<a id="button-edit" :aria-label="$i18n.getFrom('collections','edit_item')" @click.prevent.stop="goToCollectionEditPage(props.row.id)"><b-icon type="is-gray" icon="pencil"></a> <a
<a id="button-delete" :aria-label="$i18n.get('label_button_delete')" @click.prevent.stop="deleteOneCollection(props.row.id)"><b-icon type="is-gray" icon="delete"></a> id="button-edit"
:aria-label="$i18n.getFrom('collections','edit_item')"
@click.prevent.stop="goToCollectionEditPage(props.row.id)"><b-icon
type="is-gray"
icon="pencil"/></a>
<a
id="button-delete"
:aria-label="$i18n.get('label_button_delete')"
@click.prevent.stop="deleteOneCollection(props.row.id)"><b-icon
type="is-gray"
icon="delete"/></a>
</b-table-column> </b-table-column>
</template> </template>
@ -53,12 +108,13 @@
<p> <p>
<b-icon <b-icon
icon="inbox" icon="inbox"
size="is-large"> size="is-large"/>
</b-icon>
</p> </p>
<p>{{$i18n.get('info_no_collection_created')}}</p> <p>{{ $i18n.get('info_no_collection_created') }}</p>
<router-link tag="button" class="button is-primary" <router-link
:to="{ path: $routerHelper.getNewCollectionPath() }"> tag="button"
class="button is-primary"
:to="{ path: $routerHelper.getNewCollectionPath() }">
{{ $i18n.getFrom('collections', 'new_item') }} {{ $i18n.getFrom('collections', 'new_item') }}
</router-link> </router-link>
</div> </div>
@ -70,7 +126,7 @@
</template> </template>
<script> <script>
import { mapActions, mapGetters } from 'vuex' import { mapActions } from 'vuex'
export default { export default {
name: 'CollectionsList', name: 'CollectionsList',
@ -84,7 +140,7 @@ export default {
totalCollections: 0, totalCollections: 0,
page: 1, page: 1,
collectionsPerPage: 12, collectionsPerPage: 12,
collections: [] collections: Array
}, },
methods: { methods: {
...mapActions('collection', [ ...mapActions('collection', [
@ -95,7 +151,6 @@ export default {
message: this.$i18n.get('info_warning_collection_delete'), message: this.$i18n.get('info_warning_collection_delete'),
onConfirm: () => { onConfirm: () => {
this.deleteCollection(collectionId).then(() => { this.deleteCollection(collectionId).then(() => {
this.loadCollections();
this.$toast.open({ this.$toast.open({
duration: 3000, duration: 3000,
message: this.$i18n.get('info_collection_deleted'), message: this.$i18n.get('info_collection_deleted'),
@ -126,7 +181,7 @@ export default {
for (let collection of this.selectedCollections) { for (let collection of this.selectedCollections) {
this.deleteCollection(collection.id) this.deleteCollection(collection.id)
.then((res) => { .then(() => {
this.loadCollections(); this.loadCollections();
this.$toast.open({ this.$toast.open({
duration: 3000, duration: 3000,
@ -135,7 +190,7 @@ export default {
type: 'is-secondary', type: 'is-secondary',
queue: false queue: false
}) })
}).catch((err) => { }).catch(() => {
this.$toast.open({ this.$toast.open({
duration: 3000, duration: 3000,
message: this.$i18n.get('info_error_deleting_collection'), message: this.$i18n.get('info_error_deleting_collection'),
@ -149,8 +204,6 @@ export default {
} }
}); });
}, },
handleSelectionChange(value) {
},
goToCollectionPage(collectionId) { goToCollectionPage(collectionId) {
this.$router.push(this.$routerHelper.getCollectionPath(collectionId)); this.$router.push(this.$routerHelper.getCollectionPath(collectionId));
}, },

150
src/admin/components/lists/fields-list.vue
View File

@ -1,77 +1,94 @@
<template> <template>
<div> <div>
<b-loading :active.sync="isLoadingFieldTypes"></b-loading> <b-loading :active.sync="isLoadingFieldTypes"/>
<div class="page-title"> <div class="page-title">
<h2>{{ isRepositoryLevel ? $i18n.get('instruction_dragndrop_fields_repository') : $i18n.get('instruction_dragndrop_fields_collection')}}</h2> <h2>{{ isRepositoryLevel ? $i18n.get('instruction_dragndrop_fields_repository') : $i18n.get('instruction_dragndrop_fields_collection') }}</h2>
</div> </div>
<div class="columns"> <div class="columns">
<div class="column"> <div class="column">
<draggable <draggable
class="active-fields-area" class="active-fields-area"
@change="handleChange" @change="handleChange"
:class="{'fields-area-receive': isDraggingFromAvailable}" :class="{'fields-area-receive': isDraggingFromAvailable}"
:list="activeFieldList" :list="activeFieldList"
:options="{ :options="{
group: { name:'fields', pull: false, put: true }, group: { name:'fields', pull: false, put: true },
sort: openedFieldId == '' || openedFieldId == undefined, sort: openedFieldId == '' || openedFieldId == undefined,
disabled: openedFieldId != '' && openedFieldId != undefined, disabled: openedFieldId != '' && openedFieldId != undefined,
handle: '.handle', handle: '.handle',
ghostClass: 'sortable-ghost', ghostClass: 'sortable-ghost',
filter: 'not-sortable-item', filter: 'not-sortable-item',
animation: '250'}"> animation: '250'}">
<div <div
class="active-field-item" class="active-field-item"
:class="{ :class="{
'not-sortable-item': field.id == undefined || openedFieldId != '' , 'not-sortable-item': field.id == undefined || openedFieldId != '' ,
'not-focusable-item': openedFieldId == field.id, 'not-focusable-item': openedFieldId == field.id,
'disabled-field': field.enabled == false}" 'disabled-field': field.enabled == false
v-for="(field, index) in activeFieldList" :key="index"> }"
v-for="(field, index) in activeFieldList"
:key="index">
<div class="handle"> <div class="handle">
<grip-icon></grip-icon> <grip-icon/>
<span <span
class="field-name" class="field-name"
:class="{'is-danger': formWithErrors == field.id }"> :class="{'is-danger': formWithErrors == field.id }">
{{ field.name }} {{ field.name }}
</span> </span>
<span <span
v-if="field.id != undefined" v-if="field.id != undefined"
class="label-details"> class="label-details">
({{ $i18n.get(field.field_type_object.component) }}) ({{ $i18n.get(field.field_type_object.component) }})
<span class="not-saved" v-if="(editForms[field.id] != undefined && editForms[field.id].saved != true) || field.status == 'auto-draft'"> <span
class="not-saved"
v-if="(editForms[field.id] != undefined && editForms[field.id].saved != true) || field.status == 'auto-draft'">
{{ $i18n.get('info_not_saved') }} {{ $i18n.get('info_not_saved') }}
</span> </span>
</span> </span>
<span class="loading-spinner" v-if="field.id == undefined"></span> <span
<span class="controls" v-if="field.id !== undefined"> class="loading-spinner"
<b-switch size="is-small" v-model="field.enabled" @input="onChangeEnable($event, index)"></b-switch> v-if="field.id == undefined"/>
<a :style="{ visibility: <span
class="controls"
v-if="field.id !== undefined">
<b-switch
size="is-small"
v-model="field.enabled"
@input="onChangeEnable($event, index)"/>
<a
:style="{ visibility:
field.collection_id != collectionId field.collection_id != collectionId
? 'hidden' : 'visible' ? 'hidden' : 'visible'
}" }"
@click.prevent="editField(field)"> @click.prevent="editField(field)">
<b-icon type="is-gray" icon="pencil"></b-icon> <b-icon
type="is-gray"
icon="pencil"/>
</a> </a>
<a :style="{ visibility: <a
:style="{ visibility:
field.collection_id != collectionId || field.collection_id != collectionId ||
field.field_type == 'Tainacan\\Field_Types\\Core_Title' || field.field_type == 'Tainacan\\Field_Types\\Core_Title' ||
field.field_type == 'Tainacan\\Field_Types\\Core_Description' field.field_type == 'Tainacan\\Field_Types\\Core_Description'
? 'hidden' : 'visible' ? 'hidden' : 'visible'
}" }"
@click.prevent="removeField(field)"> @click.prevent="removeField(field)">
<b-icon type="is-gray" icon="delete"></b-icon> <b-icon
type="is-gray"
icon="delete"/>
</a> </a>
</span> </span>
</div> </div>
<div v-if="openedFieldId == field.id"> <div v-if="openedFieldId == field.id">
<field-edition-form <field-edition-form
:collectionId="collectionId" :collection-id="collectionId"
:isRepositoryLevel="isRepositoryLevel" :is-repository-level="isRepositoryLevel"
@onEditionFinished="onEditionFinished()" @onEditionFinished="onEditionFinished()"
@onEditionCanceled="onEditionCanceled()" @onEditionCanceled="onEditionCanceled()"
@onErrorFound="formWithErrors = field.id" @onErrorFound="formWithErrors = field.id"
:index="index" :index="index"
:originalField="field" :original-field="field"
:editedField="editForms[field.id]"></field-edition-form> :edited-field="editForms[field.id]"/>
</div> </div>
</div> </div>
</draggable> </draggable>
@ -79,23 +96,25 @@
<div class="column available-fields-area" > <div class="column available-fields-area" >
<div class="field"> <div class="field">
<h3 class="label">{{ $i18n.get('label_available_field_types')}}</h3> <h3 class="label">{{ $i18n.get('label_available_field_types') }}</h3>
<draggable <draggable
:list="availableFieldList" :list="availableFieldList"
:options="{ :options="{
sort: false, sort: false,
group: { name:'fields', pull: 'clone', put: false, revertClone: true }, group: { name:'fields', pull: 'clone', put: false, revertClone: true },
dragClass: 'sortable-drag' dragClass: 'sortable-drag'
}"> }">
<div <div
@click.prevent="addFieldViaButton(field)" @click.prevent="addFieldViaButton(field)"
class="available-field-item" class="available-field-item"
:class="{ 'hightlighted-field' : hightlightedField == field.name }" :class="{ 'hightlighted-field' : hightlightedField == field.name }"
v-for="(field, index) in availableFieldList" v-for="(field, index) in availableFieldList"
:key="index"> :key="index">
<grip-icon></grip-icon> <grip-icon/>
<span class="field-name">{{ field.name }}</span> <span class="field-name">{{ field.name }}</span>
<span class="loading-spinner" v-if="hightlightedField == field.name"></span> <span
class="loading-spinner"
v-if="hightlightedField == field.name"/>
</div> </div>
</draggable> </draggable>
</div> </div>
@ -207,7 +226,7 @@ export default {
this.hightlightedField = ''; this.hightlightedField = '';
}) })
.catch((error) => { .catch((error) => {
console.log(error); this.$console.error(error);
}); });
}, },
removeField(removedField) { removeField(removedField) {
@ -220,7 +239,7 @@ export default {
if (!this.isRepositoryLevel) if (!this.isRepositoryLevel)
this.updateFieldsOrder(); this.updateFieldsOrder();
}) })
.catch((error) => { .catch(() => {
}); });
}, },
editField(field) { editField(field) {
@ -255,7 +274,6 @@ export default {
delete this.editForms[this.openedFieldId]; delete this.editForms[this.openedFieldId];
this.openedFieldId = ''; this.openedFieldId = '';
} }
}, },
computed: { computed: {
availableFieldList() { availableFieldList() {
@ -270,10 +288,10 @@ export default {
this.isLoadingFields = true; this.isLoadingFields = true;
this.fetchFieldTypes() this.fetchFieldTypes()
.then((res) => { .then(() => {
this.isLoadingFieldTypes = false; this.isLoadingFieldTypes = false;
}) })
.catch((error) => { .catch(() => {
this.isLoadingFieldTypes = false; this.isLoadingFieldTypes = false;
}); });
@ -285,10 +303,10 @@ export default {
this.fetchFields({collectionId: this.collectionId, isRepositoryLevel: this.isRepositoryLevel}) this.fetchFields({collectionId: this.collectionId, isRepositoryLevel: this.isRepositoryLevel})
.then((res) => { .then(() => {
this.isLoadingFields = false; this.isLoadingFields = false;
}) })
.catch((error) => { .catch(() => {
this.isLoadingFields = false; this.isLoadingFields = false;
}); });
} }

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

@ -3,13 +3,12 @@
<tainacan-filters-list <tainacan-filters-list
:query="getPostQuery()" :query="getPostQuery()"
v-for="(filter, index) in filters" v-for="(filter, index) in filters"
v-bind:key="index" :key="index"
:filter="filter"></tainacan-filters-list> :filter="filter"/>
</div> </div>
</template> </template>
<script> <script>
import { mapActions, mapGetters } from 'vuex'; import { mapActions, mapGetters } from 'vuex';
import { eventFilterBus } from '../../../js/event-bus-filters'
export default { export default {
data(){ data(){

200
src/admin/components/lists/filters-list.vue
View File

@ -1,120 +1,136 @@
<template> <template>
<div> <div>
<b-loading :active.sync="isLoadingFieldTypes"></b-loading> <b-loading :active.sync="isLoadingFieldTypes"/>
<div class="page-title"> <div class="page-title">
<h2>{{ isRepositoryLevel ? $i18n.get('instruction_dragndrop_filters_collection') : $i18n.get('instruction_dragndrop_filters_collection') }}</h2> <h2>{{ isRepositoryLevel ? $i18n.get('instruction_dragndrop_filters_collection') : $i18n.get('instruction_dragndrop_filters_collection') }}</h2>
</div> </div>
<div class="columns"> <div class="columns">
<div class="column"> <div class="column">
<draggable <draggable
class="active-filters-area" class="active-filters-area"
@change="handleChange" @change="handleChange"
:class="{'filters-area-receive': isDraggingFromAvailable}" :class="{'filters-area-receive': isDraggingFromAvailable}"
:list="activeFilterList" :list="activeFilterList"
:options="{ :options="{
group: { name:'filters', pull: false, put: true }, group: { name:'filters', pull: false, put: true },
sort: openedFilterId == '' || openedFilterId == undefined, sort: openedFilterId == '' || openedFilterId == undefined,
disabled: openedFilterId != '' && openedFilterId != undefined, disabled: openedFilterId != '' && openedFilterId != undefined,
handle: '.handle', handle: '.handle',
ghostClass: 'sortable-ghost', ghostClass: 'sortable-ghost',
filter: 'not-sortable-item', filter: 'not-sortable-item',
animation: '250'}"> animation: '250'}">
<div <div
class="active-filter-item" class="active-filter-item"
:class="{ :class="{
'not-sortable-item': filter.id == undefined || openedFilterId != '' || choosenField.name == filter.name, 'not-sortable-item': filter.id == undefined || openedFilterId != '' || choosenField.name == filter.name,
'not-focusable-item': openedFilterId == filter.id, 'not-focusable-item': openedFilterId == filter.id,
'disabled-filter': filter.enabled == false 'disabled-filter': filter.enabled == false
}" }"
v-for="(filter, index) in activeFilterList" :key="index"> v-for="(filter, index) in activeFilterList"
<div class="handle"> :key="index">
<grip-icon></grip-icon> <div class="handle">
<span <grip-icon/>
<span
class="filter-name" class="filter-name"
:class="{'is-danger': formWithErrors == filter.id }"> :class="{'is-danger': formWithErrors == filter.id }">
{{ filter.name }} {{ filter.name }}
</span> </span>
<span <span
v-if="filter.filter_type_object != undefined" v-if="filter.filter_type_object != undefined"
class="label-details"> class="label-details">
({{ $i18n.get(filter.filter_type_object.component) }}) ({{ $i18n.get(filter.filter_type_object.component) }})
<span class="not-saved" v-if="(editForms[filter.id] != undefined && editForms[filter.id].saved != true) ||filter.status == 'auto-draft'"> <span
class="not-saved"
v-if="(editForms[filter.id] != undefined && editForms[filter.id].saved != true) ||filter.status == 'auto-draft'">
{{ $i18n.get('info_not_saved') }} {{ $i18n.get('info_not_saved') }}
</span> </span>
</span> </span>
<span class="loading-spinner" v-if="filter.id == undefined"></span> <span
<span class="controls" v-if="filter.filter_type != undefined"> class="loading-spinner"
<b-switch size="is-small" v-model="filter.enabled" @input="onChangeEnable($event, index)"></b-switch> v-if="filter.id == undefined"/>
<a :style="{ visibility: filter.collection_id != collectionId ? 'hidden' : 'visible' }" <span
class="controls"
v-if="filter.filter_type != undefined">
<b-switch
size="is-small"
v-model="filter.enabled"
@input="onChangeEnable($event, index)"/>
<a
:style="{ visibility: filter.collection_id != collectionId ? 'hidden' : 'visible' }"
@click.prevent="editFilter(filter)"> @click.prevent="editFilter(filter)">
<b-icon type="is-gray" icon="pencil"></b-icon> <b-icon
</a> type="is-gray"
<a :style="{ visibility: filter.collection_id != collectionId ? 'hidden' : 'visible' }" icon="pencil"/>
</a>
<a
:style="{ visibility: filter.collection_id != collectionId ? 'hidden' : 'visible' }"
@click.prevent="removeFilter(filter)"> @click.prevent="removeFilter(filter)">
<b-icon type="is-gray" icon="delete"></b-icon> <b-icon
</a> type="is-gray"
</span> icon="delete"/>
</div> </a>
<div v-if="choosenField.name == filter.name && openedFilterId == ''"> </span>
<form class="tainacan-form"> </div>
<b-field :label="$i18n.get('label_filter_type')"> <div v-if="choosenField.name == filter.name && openedFilterId == ''">
<b-select <form class="tainacan-form">
v-model="selectedFilterType" <b-field :label="$i18n.get('label_filter_type')">
:placeholder="$i18n.get('instruction_select_a_filter_type')"> <b-select
<option v-model="selectedFilterType"
:placeholder="$i18n.get('instruction_select_a_filter_type')">
<option
v-for="(filterType, index) in allowedFilterTypes" v-for="(filterType, index) in allowedFilterTypes"
:key="index" :key="index"
:selected="index == 0" :selected="index == 0"
:value="filterType"> :value="filterType">
{{ filterType.name }}</option> {{ filterType.name }}</option>
</b-select> </b-select>
</b-field> </b-field>
<div class="field is-grouped form-submit"> <div class="field is-grouped form-submit">
<div class="control"> <div class="control">
<button <button
class="button is-outlined" class="button is-outlined"
@click.prevent="cancelFilterTypeSelection()" @click.prevent="cancelFilterTypeSelection()"
slot="trigger">{{ $i18n.get('cancel')}}</button> slot="trigger">{{ $i18n.get('cancel') }}</button>
</div> </div>
<div class="control"> <div class="control">
<button <button
class="button is-success" class="button is-success"
type="submit" type="submit"
:disabled="Object.keys(selectedFilterType).length == 0" :disabled="Object.keys(selectedFilterType).length == 0"
@click.prevent="confirmSelectedFilterType()">{{ $i18n.get('next')}}</button> @click.prevent="confirmSelectedFilterType()">{{ $i18n.get('next') }}</button>
</div>
</div> </div>
</form>
</div> </div>
<b-field v-if="openedFilterId == filter.id"> </form>
<filter-edition-form </div>
<b-field v-if="openedFilterId == filter.id">
<filter-edition-form
@onEditionFinished="onEditionFinished()" @onEditionFinished="onEditionFinished()"
@onEditionCanceled="onEditionCanceled()" @onEditionCanceled="onEditionCanceled()"
@onErrorFound="formWithErrors = filter.id" @onErrorFound="formWithErrors = filter.id"
:index="index" :index="index"
:originalFilter="filter" :original-filter="filter"
:editedFilter="editForms[openedFilterId]"></filter-edition-form> :edited-filter="editForms[openedFilterId]"/>
</b-field> </b-field>
</div> </div>
</draggable> </draggable>
</div> </div>
<div class="column available-fields-area"> <div class="column available-fields-area">
<div class="field"> <div class="field">
<h3 class="label"> {{ $i18n.get('label_available_field_types') }}</h3> <h3 class="label"> {{ $i18n.get('label_available_field_types') }}</h3>
<draggable <draggable
:list="availableFieldList" :list="availableFieldList"
:options="{ :options="{
sort: false, sort: false,
group: { name:'filters', pull: true, put: false, revertClone: true }, group: { name:'filters', pull: true, put: false, revertClone: true },
dragClass: 'sortable-drag' dragClass: 'sortable-drag'
}"> }">
<div <div
class="available-field-item" class="available-field-item"
v-for="(field, index) in availableFieldList" v-for="(field, index) in availableFieldList"
:key="index" :key="index"
@click.prevent="addFieldViaButton(field, index)"> @click.prevent="addFieldViaButton(field, index)">
<grip-icon></grip-icon> <grip-icon/>
<span class="field-name">{{ field.name }}</span> <span class="field-name">{{ field.name }}</span>
</div> </div>
</draggable> </draggable>
@ -226,7 +242,7 @@ export default {
this.addNewFilter(fieldType, lastIndex); this.addNewFilter(fieldType, lastIndex);
}, },
addNewFilter(choosenField, newIndex) { addNewFilter(choosenField, newIndex) {
console.log(choosenField); this.$console.log(choosenField);
this.choosenField = choosenField; this.choosenField = choosenField;
this.newIndex = newIndex; this.newIndex = newIndex;
this.openedFilterId = ''; this.openedFilterId = '';
@ -264,7 +280,7 @@ export default {
this.editFilter(filter); this.editFilter(filter);
}) })
.catch((error) => { .catch((error) => {
console.log(error); this.$console.error(error);
this.newIndex = 0; this.newIndex = 0;
this.choosenField = {}; this.choosenField = {};
this.selectedFilterType = {} this.selectedFilterType = {}
@ -280,17 +296,15 @@ export default {
this.activeFilterList.splice(index, 1); this.activeFilterList.splice(index, 1);
this.isLoadingFieldTypes = true; this.isLoadingFieldTypes = true;
this.fetchFields({collectionId: this.collectionId, isRepositoryLevel: this.isRepositoryLevel}) this.fetchFields({collectionId: this.collectionId, isRepositoryLevel: this.isRepositoryLevel})
.then((res) => { .then(() => {
this.isLoadingFieldTypes = false; this.isLoadingFieldTypes = false;
}) })
.catch((error) => { .catch(() => {
this.isLoadingFieldTypes = false; this.isLoadingFieldTypes = false;
}); });
if (!this.isRepositoryLevel) if (!this.isRepositoryLevel)
this.updateFiltersOrder(); this.updateFiltersOrder();
})
.catch((error) => {
}); });
}, },
confirmSelectedFilterType() { confirmSelectedFilterType() {
@ -311,7 +325,7 @@ export default {
// Opening collapse // Opening collapse
} else { } else {
console.log(this.choosenField); this.$console.log(this.choosenField);
if (this.openedFilterId == '' && this.choosenField.id != undefined) { if (this.openedFilterId == '' && this.choosenField.id != undefined) {
this.availableFieldList.push(this.choosenField); this.availableFieldList.push(this.choosenField);
this.choosenField = {}; this.choosenField = {};
@ -379,26 +393,26 @@ export default {
this.isLoadingFilterTypes = true; this.isLoadingFilterTypes = true;
this.fetchFilterTypes() this.fetchFilterTypes()
.then((res) => { .then(() => {
this.isLoadingFilterTypes = false; this.isLoadingFilterTypes = false;
}) })
.catch((error) => { .catch(() => {
this.isLoadingFilterTypes = false; this.isLoadingFilterTypes = false;
}); });
this.fetchFilters({collectionId: this.collectionId, isRepositoryLevel: this.isRepositoryLevel}) this.fetchFilters({collectionId: this.collectionId, isRepositoryLevel: this.isRepositoryLevel})
.then((res) => { .then(() => {
this.isLoadingFilters = false; this.isLoadingFilters = false;
// Needs to be done after activeFilterList exists to compare and remove chosen fields. // Needs to be done after activeFilterList exists to compare and remove chosen fields.
this.fetchFields({collectionId: this.collectionId, isRepositoryLevel: this.isRepositoryLevel}) this.fetchFields({collectionId: this.collectionId, isRepositoryLevel: this.isRepositoryLevel})
.then((res) => { .then(() => {
this.isLoadingFieldTypes = false; this.isLoadingFieldTypes = false;
}) })
.catch((error) => { .catch(() => {
this.isLoadingFieldTypes = false; this.isLoadingFieldTypes = false;
}); });
}) })
.catch((error) => { .catch(() => {
this.isLoadingFilters = false; this.isLoadingFilters = false;
}); });
} }

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

@ -1,7 +1,14 @@
<template> <template>
<div> <div>
<b-field grouped group-multiline> <b-field
<button v-if="selectedItems.length > 0" class="button field is-danger" @click="deleteSelectedItems()"><span>{{$i18n.get('instruction_delete_selected_items')}} </span><b-icon icon="delete"></b-icon></button> grouped
group-multiline>
<button
v-if="selectedItems.length > 0"
class="button field is-danger"
@click="deleteSelectedItems()">
<span>{{ $i18n.get('instruction_delete_selected_items') }} </span><b-icon icon="delete"/>
</button>
</b-field> </b-field>
<b-table <b-table
ref="itemsTable" ref="itemsTable"
@ -15,27 +22,44 @@
selectable selectable
backend-sorting> backend-sorting>
<template slot-scope="props"> <template slot-scope="props">
<b-table-column
<b-table-column v-for="(column, index) in tableFields" v-for="(column, index) in tableFields"
:key="index" :key="index"
:label="column.label" :label="column.label"
:visible="column.visible" :visible="column.visible"
:width="column.field == 'row_actions' ? 78 : column.field == 'featured_image' ? 55 : undefined "> :width="column.field == 'row_actions' ? 78 : column.field == 'featured_image' ? 55 : undefined ">
<router-link tag="span" class="clickable-row" :to="{path: $routerHelper.getItemPath(collectionId, props.row.id)}"> <router-link
tag="span"
class="clickable-row"
:to="{path: $routerHelper.getItemPath(collectionId, props.row.id)}">
<template v-if="column.field != 'featured_image' && column.field != 'row_actions'"> <template v-if="column.field != 'featured_image' && column.field != 'row_actions'">
{{ showValue( props.row.metadata[column.slug] ) }} {{ showValue( props.row.metadata[column.slug] ) }}
</template> </template>
</router-link> </router-link>
<template v-if="column.field == 'featured_image'"> <template v-if="column.field == 'featured_image'">
<router-link tag="img" class="table-thumb clickable-row" :to="{path: $routerHelper.getItemPath(collectionId, props.row.id)}" :src="props.row[column.slug]"></router-link> <router-link
tag="img"
class="table-thumb clickable-row"
:to="{path: $routerHelper.getItemPath(collectionId, props.row.id)}"
:src="props.row[column.slug]"/>
</template> </template>
<template v-if="column.field == 'row_actions'"> <template v-if="column.field == 'row_actions'">
<!-- <a id="button-view" @click.prevent.stop="goToItemPage(props.row.id)"><b-icon icon="eye"></a> --> <!-- <a id="button-view" @click.prevent.stop="goToItemPage(props.row.id)"><b-icon icon="eye"></a> -->
<a id="button-edit" :aria-label="$i18n.getFrom('items','edit_item')" @click="goToItemEditPage(props.row.id)"><b-icon type="is-gray" icon="pencil"></a> <a
<a id="button-delete" :aria-label="$i18n.get('label_button_delete')" @click="deleteOneItem(props.row.id)"><b-icon type="is-gray" icon="delete"></a> id="button-edit"
:aria-label="$i18n.getFrom('items','edit_item')"
@click="goToItemEditPage(props.row.id)"><b-icon
type="is-gray"
icon="pencil"/></a>
<a
id="button-delete"
:aria-label="$i18n.get('label_button_delete')"
@click="deleteOneItem(props.row.id)"><b-icon
type="is-gray"
icon="delete"/></a>
</template> </template>
</b-table-column> </b-table-column>
@ -46,15 +70,15 @@
<div class="content has-text-grey has-text-centered"> <div class="content has-text-grey has-text-centered">
<p> <p>
<b-icon <b-icon
icon="inbox" icon="inbox"
size="is-large"> size="is-large"/>
</b-icon>
</p> </p>
<p>{{$i18n.get('info_no_item_created')}}</p> <p>{{ $i18n.get('info_no_item_created') }}</p>
<router-link <router-link
id="button-create" id="button-create"
tag="button" class="button is-primary" tag="button"
:to="{ path: $routerHelper.getNewItemPath(collectionId) }"> class="button is-primary"
:to="{ path: $routerHelper.getNewItemPath(collectionId) }">
{{ $i18n.getFrom('items', 'new_item') }} {{ $i18n.getFrom('items', 'new_item') }}
</router-link> </router-link>
</div> </div>
@ -65,7 +89,7 @@
</template> </template>
<script> <script>
import { mapActions, mapGetters } from 'vuex'; import { mapActions } from 'vuex';
export default { export default {
name: 'ItemsList', name: 'ItemsList',
@ -76,12 +100,12 @@ export default {
}, },
props: { props: {
collectionId: Number, collectionId: Number,
tableFields: [], tableFields: Array,
prefTableFields: [], prefTableFields: Array,
totalItems: 0, totalItems: 0,
page: 1, page: 1,
itemsPerPage: 12, itemsPerPage: 12,
items: [], items: Array,
isLoading: false isLoading: false
}, },
methods: { methods: {
@ -92,7 +116,7 @@ export default {
this.$dialog.confirm({ this.$dialog.confirm({
message: this.$i18n.get('info_warning_item_delete'), message: this.$i18n.get('info_warning_item_delete'),
onConfirm: () => { onConfirm: () => {
this.deleteItem(itemId).then((res) => { this.deleteItem(itemId).then(() => {
this.loadItems(); this.loadItems();
this.$toast.open({ this.$toast.open({
duration: 3000, duration: 3000,
@ -105,7 +129,7 @@ export default {
if (this.selectedItems[i].id == this.itemId) if (this.selectedItems[i].id == this.itemId)
this.selectedItems.splice(i, 1); this.selectedItems.splice(i, 1);
} }
}).catch(( error ) => { }).catch(() => {
this.$toast.open({ this.$toast.open({
duration: 3000, duration: 3000,
@ -125,7 +149,7 @@ export default {
for (let item of this.selectedItems) { for (let item of this.selectedItems) {
this.deleteItem(item.id) this.deleteItem(item.id)
.then((res) => { .then(() => {
this.loadItems(); this.loadItems();
this.$toast.open({ this.$toast.open({
duration: 3000, duration: 3000,
@ -135,7 +159,7 @@ export default {
queue: false queue: false
}); });
}).catch((err) => { }).catch(() => {
this.$toast.open({ this.$toast.open({
duration: 3000, duration: 3000,
message: this.$i18n.get('info_error_deleting_item'), message: this.$i18n.get('info_error_deleting_item'),

95
src/admin/components/navigation/primary-menu.vue
View File

@ -1,11 +1,25 @@
<template> <template>
<nav id="primary-menu" :class="isCompressed ? 'is-compressed' : ''" role="navigation" :aria-label="$i18n.get('label_main_menu')" class="column is-sidebar-menu"> <nav
id="primary-menu"
:class="isCompressed ? 'is-compressed' : ''"
role="navigation"
:aria-label="$i18n.get('label_main_menu')"
class="column is-sidebar-menu">
<aside class="menu"> <aside class="menu">
<div class="menu-header"> <div class="menu-header">
<ul class="menu-list"><li><router-link tag="a" to="/"> <ul class="menu-list"><li>
<b-icon size="is-medium" icon="chevron-left"></b-icon> <router-link
<img class="tainacan-logo" alt="Tainacan Logo" :src="logoHeader"/> tag="a"
</router-link></li></ul> to="/">
<b-icon
size="is-medium"
icon="chevron-left"/>
<img
class="tainacan-logo"
alt="Tainacan Logo"
:src="logoHeader">
</router-link>
</li></ul>
</div> </div>
<ul class="menu-list"> <ul class="menu-list">
@ -15,32 +29,65 @@
:placeholder="$i18n.get('search')" :placeholder="$i18n.get('search')"
type="search" type="search"
size="is-small" size="is-small"
icon="magnify"> icon="magnify"/>
</b-input>
</b-field> </b-field>
<router-link tag="a" to=""> <router-link
<b-icon size="is-small" icon="magnify"></b-icon> <span class="menu-text">{{ $i18n.get('advanced_search')}}</span> tag="a"
to="">
<b-icon
size="is-small"
icon="magnify"/> <span class="menu-text">{{ $i18n.get('advanced_search') }}</span>
</router-link> </router-link>
</li> </li>
<li class="separator"></li> <li class="separator"/>
<li><router-link tag="a" to="/collections" :class="activeRoute == 'CollectionsPage' || isCompressed ? 'is-active':''"> <li><router-link
<b-icon size="is-small" icon="folder-multiple"></b-icon> <span class="menu-text">{{ $i18n.getFrom('collections', 'name') }}</span> tag="a"
to="/collections"
:class="activeRoute == 'CollectionsPage' || isCompressed ? 'is-active':''">
<b-icon
size="is-small"
icon="folder-multiple"/> <span class="menu-text">{{ $i18n.getFrom('collections', 'name') }}</span>
</router-link></li> </router-link></li>
<li><router-link tag="a" to="/items" :class="activeRoute == 'ItemsPage' ? 'is-active':''"> <li><router-link
<b-icon size="is-small" icon="file-multiple"></b-icon> <span class="menu-text">{{ $i18n.getFrom('items', 'name') }}</span> tag="a"
to="/items"
:class="activeRoute == 'ItemsPage' ? 'is-active':''">
<b-icon
size="is-small"
icon="file-multiple"/> <span class="menu-text">{{ $i18n.getFrom('items', 'name') }}</span>
</router-link></li> </router-link></li>
<li class="separator"></li> <li class="separator"/>
<li><router-link tag="a" to="/fields" :class="activeRoute == 'FieldsPage' ? 'is-active':''"> <li><router-link
<b-icon size="is-small" icon="format-list-checks"></b-icon> <span class="menu-text">{{ $i18n.getFrom('fields', 'name') }}</span> tag="a"
to="/fields"
:class="activeRoute == 'FieldsPage' ? 'is-active':''">
<b-icon
size="is-small"
icon="format-list-checks"/> <span class="menu-text">{{ $i18n.getFrom('fields', 'name') }}</span>
</router-link></li> </router-link></li>
<li><router-link tag="a" to="/filters" :class="activeRoute == 'FiltersPage' ? 'is-active':''"> <li><router-link
<b-icon size="is-small" icon="filter"></b-icon> <span class="menu-text">{{ $i18n.getFrom('filters', 'name') }}</span> tag="a"
to="/filters"
:class="activeRoute == 'FiltersPage' ? 'is-active':''">
<b-icon
size="is-small"
icon="filter"/> <span class="menu-text">{{ $i18n.getFrom('filters', 'name') }}</span>
</router-link></li> </router-link></li>
<li><router-link tag="a" to="/categories" :class="activeRoute == 'CategoriesPage' ? 'is-active':''"> <li><router-link
<b-icon size="is-small" icon="shape"></b-icon> <span class="menu-text">{{ $i18n.getFrom('categories', 'name') }}</span> tag="a"
to="/categories"
:class="activeRoute == 'CategoriesPage' ? 'is-active':''">
<b-icon
size="is-small"
icon="shape"/> <span class="menu-text">{{ $i18n.getFrom('categories', 'name') }}</span>
</router-link></li> </router-link></li>
<li><router-link tag="a" to="/events" :class="activeRoute == 'EventsPage' ? 'is-active':''"> <li><router-link
<b-icon size="is-small" icon="bell"></b-icon> <span class="menu-text">{{ $i18n.get('events') }}</span> tag="a"
to="/events"
:class="activeRoute == 'EventsPage' ? 'is-active':''">
<b-icon
size="is-small"
icon="bell"/> <span class="menu-text">{{ $i18n.get('events') }}</span>
</router-link></li> </router-link></li>
</ul> </ul>
</aside> </aside>
@ -58,7 +105,7 @@ export default {
} }
}, },
watch: { watch: {
'$route' (to, from) { '$route' (to) {
this.isCompressed = (to.params.collectionId != undefined); this.isCompressed = (to.params.collectionId != undefined);
this.activeRoute = to.name; this.activeRoute = to.name;
} }

55
src/admin/components/navigation/secondary-menu.vue
View File

@ -1,11 +1,25 @@
<template> <template>
<nav id="secondary-menu" role="navigation" :aria-label="$i18n.get('label_collection_menu')" class="column is-sidebar-menu"> <nav
id="secondary-menu"
role="navigation"
:aria-label="$i18n.get('label_collection_menu')"
class="column is-sidebar-menu">
<aside class="menu"> <aside class="menu">
<div class="menu-header"> <div class="menu-header">
<ul class="menu-list"><li><router-link tag="a" to="/" target='_blank'> <ul class="menu-list"><li>
<b-icon size="is-medium" icon="chevron-left"></b-icon> <router-link
<img class="tainacan-logo" alt="Tainacan Logo" :src="logoHeader"/> tag="a"
</router-link></li></ul> to="/"
target='_blank'>
<b-icon
size="is-medium"
icon="chevron-left"/>
<img
class="tainacan-logo"
alt="Tainacan Logo"
:src="logoHeader">
</router-link>
</li></ul>
</div> </div>
<ul class="menu-list"> <ul class="menu-list">
@ -15,41 +29,52 @@
:placeholder="$i18n.getFrom('items', 'search_items')" :placeholder="$i18n.getFrom('items', 'search_items')"
type="search" type="search"
size="is-small" size="is-small"
icon="magnify"> icon="magnify"/>
</b-input>
</b-field> </b-field>
<router-link tag="a" to=""> <router-link
<b-icon size="is-small" icon="magnify"></b-icon> <span class="menu-text">{{ $i18n.get('advanced_search')}}</span> tag="a"
to="">
<b-icon
size="is-small"
icon="magnify"/> <span class="menu-text">{{ $i18n.get('advanced_search') }}</span>
</router-link> </router-link>
</li> </li>
<li class="separator"></li> <li class="separator"/>
<li><router-link <li><router-link
tag="a" tag="a"
:to="{ path: $routerHelper.getCollectionItemsPath(id, '') }" :to="{ path: $routerHelper.getCollectionItemsPath(id, '') }"
:class="activeRoute == 'ItemPage' || activeRoute == 'CollectionItemsPage' || activeRoute == 'ItemEditionForm' || activeRoute == 'ItemCreatePage' ? 'is-active':''" :class="activeRoute == 'ItemPage' || activeRoute == 'CollectionItemsPage' || activeRoute == 'ItemEditionForm' || activeRoute == 'ItemCreatePage' ? 'is-active':''"
:aria-label="$i18n.get('label_collection_fields')"> :aria-label="$i18n.get('label_collection_fields')">
<b-icon size="is-small" icon="file-multiple"></b-icon> <span class="menu-text">{{ $i18n.getFrom('items', 'name') }}</span> <b-icon
size="is-small"
icon="file-multiple"/> <span class="menu-text">{{ $i18n.getFrom('items', 'name') }}</span>
</router-link></li> </router-link></li>
<li><router-link <li><router-link
tag="a" tag="a"
:to="{ path: $routerHelper.getCollectionEditPath(id) }" :to="{ path: $routerHelper.getCollectionEditPath(id) }"
:class="activeRoute == 'CollectionEditionForm' ? 'is-active':''" :class="activeRoute == 'CollectionEditionForm' ? 'is-active':''"
:aria-label="$i18n.getFrom('collections','edit_item')"> :aria-label="$i18n.getFrom('collections','edit_item')">
<b-icon size="is-small" icon="pencil"></b-icon> <span class="menu-text">{{ $i18n.get('edit') }}</span> <b-icon
size="is-small"
icon="pencil"/> <span class="menu-text">{{ $i18n.get('edit') }}</span>
</router-link></li> </router-link></li>
<li><router-link <li><router-link
tag="a" tag="a"
:to="{ path: $routerHelper.getCollectionFieldsPath(id) }" :to="{ path: $routerHelper.getCollectionFieldsPath(id) }"
:class="activeRoute == 'FieldsList' ? 'is-active':''" :class="activeRoute == 'FieldsList' ? 'is-active':''"
:aria-label="$i18n.get('label_collection_fields')"> :aria-label="$i18n.get('label_collection_fields')">
<b-icon size="is-small" icon="format-list-checks"></b-icon> <span class="menu-text">{{ $i18n.getFrom('fields', 'name') }}</span> <b-icon
size="is-small"
icon="format-list-checks"/> <span class="menu-text">{{ $i18n.getFrom('fields', 'name') }}</span>
</router-link></li> </router-link></li>
<li><router-link <li><router-link
tag="a" tag="a"
:to="{ path: $routerHelper.getCollectionFiltersPath(id) }" :to="{ path: $routerHelper.getCollectionFiltersPath(id) }"
:class="activeRoute == 'FiltersList' ? 'is-active':''" :class="activeRoute == 'FiltersList' ? 'is-active':''"
:aria-label="$i18n.get('label_collection_filters')"> :aria-label="$i18n.get('label_collection_filters')">
<b-icon size="is-small" icon="filter"></b-icon> <span class="menu-text">{{ $i18n.getFrom('filters', 'name') }}</span> <b-icon
size="is-small"
icon="filter"/> <span class="menu-text">{{ $i18n.getFrom('filters', 'name') }}</span>
</router-link></li> </router-link></li>
</ul> </ul>
</aside> </aside>
@ -69,7 +94,7 @@ export default {
id: Number id: Number
}, },
watch: { watch: {
'$route' (to, from) { '$route' (to) {
this.activeRoute = to.name; this.activeRoute = to.name;
} }
}, },

37
src/admin/components/navigation/tainacan-header.vue
View File

@ -1,15 +1,24 @@
<template> <template>
<div id="tainacan-header" class="level" :class="{'secondary-page': onSecondaryPage}"> <div
id="tainacan-header"
class="level"
:class="{'secondary-page': onSecondaryPage}">
<div class="level-left"> <div class="level-left">
<div class="level-item"> <div class="level-item">
<h1 class="has-text-weight-bold is-uppercase has-text-primary"><b-icon size="is-small" :icon="currentIcon"></b-icon>{{pageTitle}}</h1> <h1 class="has-text-weight-bold is-uppercase has-text-primary"><b-icon
size="is-small"
:icon="currentIcon"/>{{ pageTitle }}</h1>
<nav class="breadcrumbs"> <nav class="breadcrumbs">
<router-link tag="a" :to="$routerHelper.getCollectionsPath()">{{ $i18n.get('repository') }}</router-link> > <router-link
<span v-for="(pathItem, index) in arrayRealPath" :key="index">
<router-link
tag="a" tag="a"
:to="'/' + arrayRealPath.slice(0, index + 1).join('/')"> :to="$routerHelper.getCollectionsPath()">{{ $i18n.get('repository') }}</router-link> >
{{ arrayViewPath[index] }} <span
v-for="(pathItem, index) in arrayRealPath"
:key="index">
<router-link
tag="a"
:to="'/' + arrayRealPath.slice(0, index + 1).join('/')">
{{ arrayViewPath[index] }}
</router-link> </router-link>
<span v-if="index != arrayRealPath.length - 1"> > </span> <span v-if="index != arrayRealPath.length - 1"> > </span>
</span> </span>
@ -17,8 +26,10 @@
</div> </div>
</div> </div>
<div class="level-right"> <div class="level-right">
<a class="level-item" :href="wordpressAdmin"> <a
<b-icon icon="close"></b-icon> class="level-item"
:href="wordpressAdmin">
<b-icon icon="close"/>
</a> </a>
</div> </div>
</div> </div>
@ -71,17 +82,17 @@ export default {
case 'collections': case 'collections':
this.fetchCollectionName(this.arrayRealPath[i]) this.fetchCollectionName(this.arrayRealPath[i])
.then(collectionName => this.arrayViewPath.splice(i, 1, collectionName)) .then(collectionName => this.arrayViewPath.splice(i, 1, collectionName))
.catch((error) => console.log(error)); .catch((error) => this.$console.error(error));
break; break;
case 'items': case 'items':
this.fetchItemTitle(this.arrayRealPath[i]) this.fetchItemTitle(this.arrayRealPath[i])
.then(itemTitle => this.arrayViewPath.splice(i, 1, itemTitle)) .then(itemTitle => this.arrayViewPath.splice(i, 1, itemTitle))
.catch((error) => console.log(error)); .catch((error) => this.$console.error(error));
break; break;
case 'categories': case 'categories':
this.fetchCategoryName(this.arrayRealPath[i]) this.fetchCategoryName(this.arrayRealPath[i])
.then(categoryName => this.arrayViewPath.splice(i, 1, categoryName)) .then(categoryName => this.arrayViewPath.splice(i, 1, categoryName))
.catch((error) => console.log(error)); .catch((error) => this.$console.error(error));
break; break;
} }
@ -93,7 +104,7 @@ export default {
} }
}, },
watch: { watch: {
'$route' (to, from) { '$route' (to) {
this.onSecondaryPage = (to.params.collectionId != undefined); this.onSecondaryPage = (to.params.collectionId != undefined);
this.pageTitle = this.$route.meta.title; this.pageTitle = this.$route.meta.title;
this.currentIcon = this.$route.meta.icon; this.currentIcon = this.$route.meta.icon;

43
src/admin/components/other/grip-icon.vue
View File

@ -1,5 +1,46 @@
<template> <template>
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 12.8 12.8" class="grip-icon"><circle cx="1.5" cy="1.5" r="1.5" class="undefined"/><circle cx="6.4" cy="1.5" r="1.5" class="undefined"/><circle cx="11.3" cy="1.5" r="1.5" class="undefined"/><circle cx="1.5" cy="6.4" r="1.5" class="undefined"/><circle cx="6.4" cy="6.4" r="1.5" class="undefined"/><circle cx="11.3" cy="6.4" r="1.5" class="undefined"/><circle cx="1.5" cy="11.3" r="1.5" class="undefined"/><circle cx="6.4" cy="11.3" r="1.5" class="undefined"/><circle cx="11.3" cy="11.3" r="1.5" class="undefined"/></svg> <svg
xmlns="http://www.w3.org/2000/svg"
width="13"
height="13"
viewBox="0 0 12.8 12.8"
class="grip-icon"><circle
cx="1.5"
cy="1.5"
r="1.5"
class="undefined"/><circle
cx="6.4"
cy="1.5"
r="1.5"
class="undefined"/><circle
cx="11.3"
cy="1.5"
r="1.5"
class="undefined"/><circle
cx="1.5"
cy="6.4"
r="1.5"
class="undefined"/><circle
cx="6.4"
cy="6.4"
r="1.5"
class="undefined"/><circle
cx="11.3"
cy="6.4"
r="1.5"
class="undefined"/><circle
cx="1.5"
cy="11.3"
r="1.5"
class="undefined"/><circle
cx="6.4"
cy="11.3"
r="1.5"
class="undefined"/><circle
cx="11.3"
cy="11.3"
r="1.5"
class="undefined"/></svg>
</template> </template>
<script> <script>

14
src/admin/components/other/help-button.vue
View File

@ -1,9 +1,15 @@
<template> <template>
<span class="help-wrapper"> <span class="help-wrapper">
<a class="help-button" @click="isOpened = !isOpened"><b-icon size="is-small" icon="help-circle-outline"></b-icon></a> <a
<div class="help-tooltip" :class="{ 'opened': isOpened }"> class="help-button"
@click="isOpened = !isOpened"><b-icon
size="is-small"
icon="help-circle-outline"/></a>
<div
class="help-tooltip"
:class="{ 'opened': isOpened }">
<div class="help-tooltip-header"> <div class="help-tooltip-header">
<h5>{{ title }}</h5><a @click="isOpened = false"><b-icon icon="close"></b-icon></a> <h5>{{ title }}</h5><a @click="isOpened = false"><b-icon icon="close"/></a>
</div> </div>
<div class="help-tooltip-body"> <div class="help-tooltip-body">
<p>{{ (message != '' && message != undefined) ? message : $i18n.get('info_no_description_provided') }}</p> <p>{{ (message != '' && message != undefined) ? message : $i18n.get('info_no_description_provided') }}</p>
@ -56,7 +62,7 @@ export default {
border-radius: 10px; border-radius: 10px;
margin: 0px 0px 0px -37px; margin: 0px 0px 0px -37px;
position: absolute; position: absolute;
z-index: 99999999999999; z-index: 999999999999999;
bottom: 100%; bottom: 100%;
left: 0%; left: 0%;
min-width: 250px; min-width: 250px;

14
src/admin/js/main.js
View File

@ -30,19 +30,21 @@ import HelpButton from '../components/other/help-button.vue';
import draggable from 'vuedraggable' import draggable from 'vuedraggable'
import store from '../../js/store/store' import store from '../../js/store/store'
import router from './router' import router from './router'
import { I18NPlugin, UserPrefsPlugin, RouterHelperPlugin } from './utilities'; import { I18NPlugin, UserPrefsPlugin, RouterHelperPlugin, ConsolePlugin } from './utilities';
// Configure and Register Plugins // Configure and Register Plugins
router.beforeEach((to, from, next) => { router.beforeEach((to, from, next) => {
document.title = to.meta.title document.title = to.meta.title
next() next()
}); });
Vue.use(Buefy);
Vue.use(I18NPlugin); Vue.use(I18NPlugin);
Vue.use(UserPrefsPlugin); Vue.use(UserPrefsPlugin);
Vue.use(RouterHelperPlugin); Vue.use(RouterHelperPlugin);
Vue.use(Buefy); Vue.use(ConsolePlugin, {visual: false});
// Register Components // Register Components
/* Fields */
Vue.component('tainacan-text', Text); Vue.component('tainacan-text', Text);
Vue.component('tainacan-textarea', Textarea); Vue.component('tainacan-textarea', Textarea);
Vue.component('tainacan-selectbox', Selectbox); Vue.component('tainacan-selectbox', Selectbox);
@ -54,20 +56,18 @@ Vue.component('tainacan-category', Category);
Vue.component('tainacan-form-relationship', FormRelationship); Vue.component('tainacan-form-relationship', FormRelationship);
Vue.component('tainacan-form-category', FormCategory); Vue.component('tainacan-form-category', FormCategory);
Vue.component('tainacan-form-selectbox', FormSelectbox); Vue.component('tainacan-form-selectbox', FormSelectbox);
Vue.component('tainacan-form-item', TaincanFormItem); Vue.component('tainacan-form-item', TaincanFormItem);
Vue.component('tainacan-filters-list', TaincanFiltersList); Vue.component('tainacan-filters-list', TaincanFiltersList);
Vue.component('help-button', HelpButton);
Vue.component('draggable', draggable);
/* Filters */ /* Filters */
Vue.component('tainacan-filter-custom-interval', FilterCustomInterval); Vue.component('tainacan-filter-custom-interval', FilterCustomInterval);
Vue.component('tainacan-filter-selectbox', FilterSelectbox); Vue.component('tainacan-filter-selectbox', FilterSelectbox);
Vue.component('tainacan-filter-autocomplete', FilterAutocomplete); Vue.component('tainacan-filter-autocomplete', FilterAutocomplete);
Vue.component('tainacan-filter-checkbox', FilterCheckbox); Vue.component('tainacan-filter-checkbox', FilterCheckbox);
Vue.component('tainacan-filter-taginput', FilterTaginput); Vue.component('tainacan-filter-taginput', FilterTaginput);
/* Others */
Vue.component('help-button', HelpButton);
Vue.component('draggable', draggable);
new Vue({ new Vue({
el: '#tainacan-admin-app', el: '#tainacan-admin-app',

34
src/admin/js/mixins.js Normal file
View File

@ -0,0 +1,34 @@
import axios from 'axios';
import qs from 'qs';
export const wpAjax = {
data(){
return {
axiosWPAjax: {},
}
},
created(){
this.axiosWPAjax = axios.create({
baseURL: tainacan_plugin.wp_ajax_url,
});
},
methods: {
getSamplePermalink(id, newTitle, newSlug){
return new Promise((resolve, reject) => {
this.axiosWPAjax.post('', qs.stringify({
action: 'sample-permalink',
post_id: id,
new_title: newTitle,
new_slug: newSlug,
samplepermalinknonce: tainacan_plugin.sample_permalink_nonce,
}))
.then(res => {
resolve(res.data);
})
.catch(error => {
reject(error)
})
});
}
}
};

47
src/admin/js/utilities.js
View File

@ -7,6 +7,53 @@ const wpApi = axios.create({
wpApi.defaults.headers.common['X-WP-Nonce'] = tainacan_plugin.nonce; wpApi.defaults.headers.common['X-WP-Nonce'] = tainacan_plugin.nonce;
// CONSOLE PLUGIN - Allows custom use of console functions and avoids eslint warnings.
export const ConsolePlugin = {};
ConsolePlugin.install = function (Vue, options = { visual: false }) {
Vue.prototype.$console = {
log(something) {
if (options.visual) {
Vue.prototype.$snackbar.open({
message: something,
type: 'is-secondary',
position: 'is-bottom-right',
indefinite: true,
queue: false
});
} else {
console.log(something);
}
},
info(someInfo) {
if (options.visual) {
Vue.prototype.$snackbar.open({
message: someInfo,
type: 'is-primary',
position: 'is-bottom-right',
duration: 5000,
queue: false
});
} else {
console.info(someInfo);
}
},
error(someError) {
if (options.visual) {
Vue.prototype.$snackbar.open({
message: someError,
type: 'is-danger',
position: 'is-bottom-right',
indefinite: true,
queue: false
});
} else {
console.error(someError);
}
}
}
}
// I18N PLUGIN - Allows access to Wordpress translation file. // I18N PLUGIN - Allows access to Wordpress translation file.
export const I18NPlugin = {}; export const I18NPlugin = {};
I18NPlugin.install = function (Vue, options = {}) { I18NPlugin.install = function (Vue, options = {}) {

34
src/admin/pages/lists/categories-page.vue
View File

@ -1,10 +1,14 @@
<template> <template>
<div> <div>
<div class="primary-page page-container-small"> <div class="primary-page page-container-small">
<div class="sub-header" v-if="totalCategories > 0"> <div
class="sub-header"
v-if="totalCategories > 0">
<div class="header-item"> <div class="header-item">
<router-link tag="button" class="button is-secondary" <router-link
:to="{ path: $routerHelper.getNewCategoryPath() }"> tag="button"
class="button is-secondary"
:to="{ path: $routerHelper.getNewCategoryPath() }">
{{ $i18n.get('new') + ' ' + $i18n.get('category') }} {{ $i18n.get('new') + ' ' + $i18n.get('category') }}
</router-link> </router-link>
</div> </div>
@ -13,14 +17,15 @@
<div class="columns above-subheader"> <div class="columns above-subheader">
<div class="column table-container"> <div class="column table-container">
<categories-list <categories-list
:isLoading="isLoading" :is-loading="isLoading"
:totalCategories="totalCategories" :total-categories="totalCategories"
:page="page" :page="page"
:categoriesPerPage="categoriesPerPage" :categories-per-page="categoriesPerPage"
:categories="categories"> :categories="categories"/>
</categories-list>
<!-- Footer --> <!-- Footer -->
<div class="table-footer" v-if="totalCategories > 0"> <div
class="table-footer"
v-if="totalCategories > 0">
<div class="shown-items"> <div class="shown-items">
{{ {{
$i18n.get('info_showing_categories') + $i18n.get('info_showing_categories') +
@ -31,7 +36,9 @@
}} }}
</div> </div>
<div class="items-per-page"> <div class="items-per-page">
<b-field horizontal :label="$i18n.get('label_categories_per_page')"> <b-field
horizontal
:label="$i18n.get('label_categories_per_page')">
<b-select <b-select
:value="categoriesPerPage" :value="categoriesPerPage"
@input="onChangeCategoriesPerPage" @input="onChangeCategoriesPerPage"
@ -50,8 +57,7 @@
:current.sync="page" :current.sync="page"
order="is-centered" order="is-centered"
size="is-small" size="is-small"
:per-page="categoriesPerPage"> :per-page="categoriesPerPage"/>
</b-pagination>
</div> </div>
</div> </div>
</div> </div>
@ -103,7 +109,7 @@
this.isLoading = false; this.isLoading = false;
this.totalCategories = res.total; this.totalCategories = res.total;
}) })
.catch((error) => { .catch(() => {
this.isLoading = false; this.isLoading = false;
}); });
}, },
@ -126,7 +132,7 @@
.then((value) => { .then((value) => {
this.categoriesPerPage = value; this.categoriesPerPage = value;
}) })
.catch((error) => { .catch(() => {
this.$userPrefs.set('categories_per_page', 12, null); this.$userPrefs.set('categories_per_page', 12, null);
}); });
}, },

38
src/admin/pages/lists/collections-page.vue
View File

@ -2,8 +2,10 @@
<div class="primary-page page-container-small"> <div class="primary-page page-container-small">
<div class="sub-header"> <div class="sub-header">
<div class="header-item"> <div class="header-item">
<router-link tag="button" class="button is-secondary" <router-link
:to="{ path: $routerHelper.getNewCollectionPath() }"> tag="button"
class="button is-secondary"
:to="{ path: $routerHelper.getNewCollectionPath() }">
{{ $i18n.getFrom('collections', 'new_item') }} {{ $i18n.getFrom('collections', 'new_item') }}
</router-link> </router-link>
</div> </div>
@ -14,12 +16,11 @@
</aside> </aside>
<div class="column table-container"> <div class="column table-container">
<collections-list <collections-list
:isLoading="isLoading" :is-loading="isLoading"
:totalCollections="totalCollections" :total-collections="totalCollections"
:page="page" :page="page"
:collectionsPerPage="collectionsPerPage" :collections-per-page="collectionsPerPage"
:collections="collections"> :collections="collections"/>
</collections-list>
<!-- Footer --> <!-- Footer -->
<div class="table-footer"> <div class="table-footer">
<div class="shown-items"> <div class="shown-items">
@ -32,7 +33,9 @@
}} }}
</div> </div>
<div class="items-per-page"> <div class="items-per-page">
<b-field horizontal :label="$i18n.get('label_collections_per_page')"> <b-field
horizontal
:label="$i18n.get('label_collections_per_page')">
<b-select <b-select
:value="collectionsPerPage" :value="collectionsPerPage"
@input="onChangeCollectionsPerPage" @input="onChangeCollectionsPerPage"
@ -46,13 +49,12 @@
</div> </div>
<div class="pagination"> <div class="pagination">
<b-pagination <b-pagination
@change="onPageChange" @change="onPageChange"
:total="totalCollections" :total="totalCollections"
:current.sync="page" :current.sync="page"
order="is-centered" order="is-centered"
size="is-small" size="is-small"
:per-page="collectionsPerPage"> :per-page="collectionsPerPage"/>
</b-pagination>
</div> </div>
</div> </div>
</div> </div>
@ -103,7 +105,7 @@ export default {
this.isLoading = false; this.isLoading = false;
this.totalCollections = res.total; this.totalCollections = res.total;
}) })
.catch((error) => { .catch(() => {
this.isLoading = false; this.isLoading = false;
}); });
}, },
@ -126,7 +128,7 @@ export default {
.then((value) => { .then((value) => {
this.collectionsPerPage = value; this.collectionsPerPage = value;
}) })
.catch((error) => { .catch(() => {
this.$userPrefs.set('collections_per_page', 12, null); this.$userPrefs.set('collections_per_page', 12, null);
}); });
}, },

2
src/admin/pages/lists/fields-page.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<div class="primary-page page-container"> <div class="primary-page page-container">
<fields-list></fields-list> <fields-list/>
</div> </div>
</template> </template>

2
src/admin/pages/lists/filters-page.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<div class="primary-page page-container"> <div class="primary-page page-container">
<filters-list></filters-list> <filters-list/>
</div> </div>
</template> </template>

85
src/admin/pages/lists/items-page.vue
View File

@ -1,25 +1,34 @@
<template> <template>
<div class="page-container-small" :class="{'primary-page': isRepositoryLevel}"> <div
class="page-container-small"
:class="{'primary-page': isRepositoryLevel}">
<div class="sub-header"> <div class="sub-header">
<div class="header-item"> <div class="header-item">
<router-link tag="button" class="button is-secondary" <router-link
tag="button"
class="button is-secondary"
:to="{ path: $routerHelper.getNewItemPath(collectionId) }"> :to="{ path: $routerHelper.getNewItemPath(collectionId) }">
{{ $i18n.getFrom('items', 'new_item') }} {{ $i18n.getFrom('items', 'new_item') }}
</router-link> </router-link>
</div> </div>
<div class="header-item"> <div class="header-item">
<b-dropdown> <b-dropdown>
<button class="button" slot="trigger" :disabled="items.length <= 0"> <button
<span>{{$i18n.get('label_table_fields')}}</span> class="button"
<b-icon icon="menu-down"></b-icon> slot="trigger"
:disabled="items.length <= 0">
<span>{{ $i18n.get('label_table_fields') }}</span>
<b-icon icon="menu-down"/>
</button> </button>
<b-dropdown-item v-for="(column, index) in tableFields" <b-dropdown-item
:key="index" v-for="(column, index) in tableFields"
class="control" custom> :key="index"
class="control"
custom>
<b-checkbox <b-checkbox
@input="onChangeTableFields(column)" @input="onChangeTableFields(column)"
v-model="column.visible" v-model="column.visible"
:native-value="column.field"> :native-value="column.field">
{{ column.label }} {{ column.label }}
</b-checkbox> </b-checkbox>
</b-dropdown-item> </b-dropdown-item>
@ -29,19 +38,18 @@
<div class="columns above-subheader"> <div class="columns above-subheader">
<aside class="column filters-menu"> <aside class="column filters-menu">
<h3>{{ $i18n.get('filters') }}</h3> <h3>{{ $i18n.get('filters') }}</h3>
<filters-items-list></filters-items-list> <filters-items-list/>
</aside> </aside>
<div class="column table-container"> <div class="column table-container">
<items-list <items-list
:collection-id="collectionId" :collection-id="collectionId"
:tableFields="tableFields" :table-fields="tableFields"
:prefTableFields="prefTableFields" :pref-table-fields="prefTableFields"
:totalItems="totalItems" :total-items="totalItems"
:page="page" :page="page"
:items="items" :items="items"
:isLoading="isLoading" :is-loading="isLoading"
:itemsPerPage="itemsPerPage"> :items-per-page="itemsPerPage"/>
</items-list>
<!-- Footer --> <!-- Footer -->
<div class="table-footer"> <div class="table-footer">
<div class="shown-items"> <div class="shown-items">
@ -54,7 +62,9 @@
}} }}
</div> </div>
<div class="items-per-page"> <div class="items-per-page">
<b-field horizontal :label="$i18n.get('label_items_per_page')"> <b-field
horizontal
:label="$i18n.get('label_items_per_page')">
<b-select <b-select
:value="itemsPerPage" :value="itemsPerPage"
@input="onChangeItemsPerPage" @input="onChangeItemsPerPage"
@ -68,13 +78,12 @@
</div> </div>
<div class="pagination"> <div class="pagination">
<b-pagination <b-pagination
@change="onPageChange" @change="onPageChange"
:total="totalItems" :total="totalItems"
:current.sync="page" :current.sync="page"
order="is-centered" order="is-centered"
size="is-small" size="is-small"
:per-page="itemsPerPage"> :per-page="itemsPerPage"/>
</b-pagination>
</div> </div>
</div> </div>
</div> </div>
@ -135,7 +144,7 @@ export default {
'search_by_collection' 'search_by_collection'
]), ]),
onChangeTableFields(field) { onChangeTableFields(field) {
let prevValue = this.prefTableFields; // let prevValue = this.prefTableFields;
let index = this.prefTableFields.findIndex(alteredField => alteredField.slug === field.slug); let index = this.prefTableFields.findIndex(alteredField => alteredField.slug === field.slug);
if (index >= 0) { if (index >= 0) {
//prevValue[index].visible = this.prefTableFields[index].visible ? false : true; //prevValue[index].visible = this.prefTableFields[index].visible ? false : true;
@ -143,12 +152,12 @@ export default {
// for (let currentField of this.prefTableFields) // for (let currentField of this.prefTableFields)
// console.log(currentField.slug, currentField.visible); // this.$console.log(currentField.slug, currentField.visible);
// for (let oldField of prevValue) // for (let oldField of prevValue)
// console.log(oldField.slug, oldField.visible); // this.$console.log(oldField.slug, oldField.visible);
//this.$userPrefs.set('table_columns_' + this.collectionId, this.prefTableFields, prevValue); //this.$userPrefs.set('table_columns_' + this.collectionId, this.prefTableFields, prevValue);
}, },
@ -187,11 +196,10 @@ export default {
this.alterQueryString(); this.alterQueryString();
} }
promisse.then(() => {
promisse.then((res) => {
this.isLoading = false; this.isLoading = false;
}) })
.catch((error) => { .catch(() => {
this.isLoading = false; this.isLoading = false;
}); });
}, },
@ -233,7 +241,7 @@ export default {
.then((value) => { .then((value) => {
this.itemsPerPage = value; this.itemsPerPage = value;
}) })
.catch((error) => { .catch(() => {
this.$userPrefs.set('items_per_page', 12, null); this.$userPrefs.set('items_per_page', 12, null);
}); });
}, },
@ -307,11 +315,12 @@ export default {
background-color: $primary-lighter; background-color: $primary-lighter;
margin-left: -$page-small-side-padding; margin-left: -$page-small-side-padding;
padding: $page-small-side-padding; padding: $page-small-side-padding;
.label { .label {
font-size: 12px;
font-weight: normal; font-weight: normal;
font-size: 0.85em;
} }
} }
.table-container { .table-container {

3
src/admin/pages/singles/category-page.vue
View File

@ -16,6 +16,9 @@
:to="{ path: $routerHelper.getCategoryEditPath(categoryId)}"> :to="{ path: $routerHelper.getCategoryEditPath(categoryId)}">
{{ $i18n.get('edit') + ' ' + $i18n.get('category') }} {{ $i18n.get('edit') + ' ' + $i18n.get('category') }}
</router-link> </router-link>
<a class="card-footer-item">
Edit terms
</a>
</footer> </footer>
</div> </div>
</div> </div>

4
src/admin/pages/singles/collection-page.vue
View File

@ -1,8 +1,8 @@
<template> <template>
<div class="columns is-fullheight"> <div class="columns is-fullheight">
<secondary-menu :id="collectionId"></secondary-menu> <secondary-menu :id="collectionId"/>
<section class="column is-secondary-content"> <section class="column is-secondary-content">
<router-view class="page-container"></router-view> <router-view class="page-container"/>
</section> </section>
</div> </div>
</template> </template>

25
src/admin/pages/singles/item-page.vue
View File

@ -1,12 +1,17 @@
<template> <template>
<div> <div>
<b-loading :active.sync="isLoading" :canCancel="false"> <b-loading
:active.sync="isLoading"
</b-loading> :can-cancel="false"/>
<div class="card"> <div class="card">
<div class="card-image" v-if="item.featured_image"> <div
class="card-image"
v-if="item.featured_image">
<figure class="image is-4by3"> <figure class="image is-4by3">
<img :src="item.featured_image" class="image" :alt="item.title"> <img
:src="item.featured_image"
class="image"
:alt="item.title">
</figure> </figure>
</div> </div>
<div class="card-content"> <div class="card-content">
@ -18,16 +23,18 @@
</div> </div>
<div class="content"> <div class="content">
{{item.description}} {{ item.description }}
</div> </div>
</div> </div>
<footer class="card-footer"> <footer class="card-footer">
<router-link <router-link
class="card-footer-item" :to="{ path: $routerHelper.getCollectionPath(collectionId)}"> class="card-footer-item"
:to="{ path: $routerHelper.getCollectionPath(collectionId)}">
{{ $i18n.get('see') + ' ' + $i18n.get('collection') }} {{ $i18n.get('see') + ' ' + $i18n.get('collection') }}
</router-link> </router-link>
<router-link <router-link
class="card-footer-item" :to="{ path: $routerHelper.getItemEditPath(collectionId, itemId)}"> class="card-footer-item"
:to="{ path: $routerHelper.getItemEditPath(collectionId, itemId)}">
{{ $i18n.get('edit') + ' ' + $i18n.get('item') }} {{ $i18n.get('edit') + ' ' + $i18n.get('item') }}
</router-link> </router-link>
</footer> </footer>
@ -70,7 +77,7 @@ export default {
let loadingInstance = this; let loadingInstance = this;
// Obtains Item // Obtains Item
this.fetchItem(this.itemId).then(res => { this.fetchItem(this.itemId).then(() => {
loadingInstance.isLoading = false; loadingInstance.isLoading = false;
}); });
} }

4
src/admin/scss/tainacan-admin.scss
View File

@ -70,9 +70,9 @@ html {
} }
} }
// Buefy notices (toast) // Buefy notices (toast, snackbar...)
.notices { .notices {
z-index: 99999999 !important; z-index: 99999999999999 !important;
} }
// Input components used in forms are gray in Tainacan // Input components used in forms are gray in Tainacan

12
src/admin/tainacan-admin-i18n.php
View File

@ -67,6 +67,10 @@ return [
'title_collection_fields_edition' => __( 'Collection Fields Edition Page', 'tainacan' ), 'title_collection_fields_edition' => __( 'Collection Fields Edition Page', 'tainacan' ),
// Labels (used mainly on Aria Labels and Inputs) // Labels (used mainly on Aria Labels and Inputs)
'label_clean' => __( 'Clear', 'tainacan' ),
'label_selected' => __( 'Selected', 'tainacan' ),
'label_relationship_new_search' => __( 'New Search', 'tainacan' ),
'label_relationship_items_found' => __( 'Items found', 'tainacan' ),
'label_menu' => __( 'Menu', 'tainacan' ), 'label_menu' => __( 'Menu', 'tainacan' ),
'label_main_menu' => __( 'Main Menu', 'tainacan' ), 'label_main_menu' => __( 'Main Menu', 'tainacan' ),
'label_collection_menu' => __( 'Collection Menu', 'tainacan' ), 'label_collection_menu' => __( 'Collection Menu', 'tainacan' ),
@ -117,7 +121,8 @@ return [
'label_collection_fields' => __( 'Collection Fields', 'tainacan' ), 'label_collection_fields' => __( 'Collection Fields', 'tainacan' ),
'label_collection_filters' => __( 'Collection Filters', 'tainacan' ), 'label_collection_filters' => __( 'Collection Filters', 'tainacan' ),
'label_parent_term' => __( 'Parent Term', 'tainacan' ), 'label_parent_term' => __( 'Parent Term', 'tainacan' ),
'label_add_new_term' => __( 'Add New Term', 'tainacan' ), 'label_new_term' => __( 'New Term', 'tainacan' ),
'label_category_terms' => __( 'Category Terms', 'tainacan' ),
// Instructions. More complex sentences to guide user and placeholders // Instructions. More complex sentences to guide user and placeholders
'instruction_dragndrop_fields_collection' => __( 'Drag and drop Fields here to Collection.', 'tainacan' ), 'instruction_dragndrop_fields_collection' => __( 'Drag and drop Fields here to Collection.', 'tainacan' ),
@ -130,6 +135,7 @@ return [
'instruction_image_upload_box' => __( 'Drop an image here or click to upload.', 'tainacan' ), 'instruction_image_upload_box' => __( 'Drop an image here or click to upload.', 'tainacan' ),
'instruction_select_a_status' => __( 'Select a status:', 'tainacan' ), 'instruction_select_a_status' => __( 'Select a status:', 'tainacan' ),
'instruction_select_a_filter_type' => __( 'Select a filter type:', 'tainacan' ), 'instruction_select_a_filter_type' => __( 'Select a filter type:', 'tainacan' ),
'instruction_select_a_parent_term' => __( 'Select a parent term:', 'tainacan' ),
// Info. Other feedback to user. // Info. Other feedback to user.
'info_name_is_required' => __( 'Name is required.', 'tainacan' ), 'info_name_is_required' => __( 'Name is required.', 'tainacan' ),
@ -137,10 +143,13 @@ return [
'info_no_category_created' => __( 'No category was created in this repository.', 'tainacan' ), 'info_no_category_created' => __( 'No category was created in this repository.', 'tainacan' ),
'info_no_item_created' => __( 'No item was created in this collection.', 'tainacan' ), 'info_no_item_created' => __( 'No item was created in this collection.', 'tainacan' ),
'info_error_deleting_collection' => __( 'Error on deleting collection.', 'tainacan' ), 'info_error_deleting_collection' => __( 'Error on deleting collection.', 'tainacan' ),
'info_error_deleting_category' => __( 'Error on deleting category', 'tainacan' ),
'info_collection_deleted' => __( 'Collection deleted.', 'tainacan' ), 'info_collection_deleted' => __( 'Collection deleted.', 'tainacan' ),
'info_item_deleted' => __( 'Item deleted.', 'tainacan' ), 'info_item_deleted' => __( 'Item deleted.', 'tainacan' ),
'info_category_deleted' => __( 'Category deleted', 'tainacan' ),
'info_warning_collection_delete' => __( 'Do you really want to delete this collection?', 'tainacan' ), 'info_warning_collection_delete' => __( 'Do you really want to delete this collection?', 'tainacan' ),
'info_warning_item_delete' => __( 'Do you really want to delete this item?', 'tainacan' ), 'info_warning_item_delete' => __( 'Do you really want to delete this item?', 'tainacan' ),
'info_warning_category_delete' => __( 'Do you really want to delete this category?', 'tainacan' ),
'info_warning_selected_collections_delete' => __( 'Do you really want to delete the selected collections?', 'tainacan' ), 'info_warning_selected_collections_delete' => __( 'Do you really want to delete the selected collections?', 'tainacan' ),
'info_warning_selected_items_delete' => __( 'Do you really want to delete the selected items?', 'tainacan' ), 'info_warning_selected_items_delete' => __( 'Do you really want to delete the selected items?', 'tainacan' ),
'info_warning_collection_related' => __( 'The field Collection related is required', 'tainacan' ), 'info_warning_collection_related' => __( 'The field Collection related is required', 'tainacan' ),
@ -156,6 +165,7 @@ return [
'info_warning_fields_not_saved' => __('Are you sure? There are fields not saved, changes will be lost.', 'tainacan'), 'info_warning_fields_not_saved' => __('Are you sure? There are fields not saved, changes will be lost.', 'tainacan'),
'info_warning_filters_not_saved' => __('Are you sure? There are filters not saved, changes will be lost.', 'tainacan'), '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_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'),
// Tainacan Field Types // Tainacan Field Types
'tainacan-text' => __( 'Text', 'tainacan' ), 'tainacan-text' => __( 'Text', 'tainacan' ),

3
src/api/class-tainacan-rest-controller.php
View File

@ -95,7 +95,8 @@ class TAINACAN_REST_Controller extends WP_REST_Controller {
'hideempty' => 'hide_empty', 'hideempty' => 'hide_empty',
'perpage' => 'posts_per_page', 'perpage' => 'posts_per_page',
'paged' => 'paged', 'paged' => 'paged',
'postin' => 'post__in' 'postin' => 'post__in',
'relation' => 'relation'
]; ];
$meta_query = [ $meta_query = [

8
src/api/endpoints/class-tainacan-rest-collections-controller.php
View File

@ -68,8 +68,8 @@ class TAINACAN_REST_Collections_Controller extends TAINACAN_REST_Controller {
'callback' => array($this, 'delete_item'), 'callback' => array($this, 'delete_item'),
'permission_callback' => array($this, 'delete_item_permissions_check'), 'permission_callback' => array($this, 'delete_item_permissions_check'),
'args' => array( 'args' => array(
'body_args' => array( 'permanently' => array(
'description' => __('To delete permanently, in body you can pass \'is_permanently\' as true. By default this will only trash collection'), 'description' => __('To delete permanently, you can pass \'permanently\' as true. By default this will only trash collection'),
'default' => 'false' 'default' => 'false'
), ),
) )
@ -275,9 +275,9 @@ class TAINACAN_REST_Collections_Controller extends TAINACAN_REST_Controller {
*/ */
public function delete_item( $request ) { public function delete_item( $request ) {
$collection_id = $request['collection_id']; $collection_id = $request['collection_id'];
$is_permanently = json_decode($request->get_body(), true); $permanently = $request['permanently'];
$args = [$collection_id, $is_permanently]; $args = [$collection_id, $permanently];
$collection = $this->collections_repository->delete($args); $collection = $this->collections_repository->delete($args);

20
src/api/endpoints/class-tainacan-rest-filters-controller.php
View File

@ -78,8 +78,8 @@ class TAINACAN_REST_Filters_Controller extends TAINACAN_REST_Controller {
'callback' => array($this, 'delete_item'), 'callback' => array($this, 'delete_item'),
'permission_callback' => array($this, 'delete_item_permissions_check'), 'permission_callback' => array($this, 'delete_item_permissions_check'),
'args' => array( 'args' => array(
'body_args' => array( 'permanently' => array(
'description' => __('To delete permanently, in body you can pass \'is_permanently\' as true. By default this will only trash collection'), 'description' => __('To delete permanently, you can pass \'permanently\' as true. By default this will only trash collection'),
'default' => 'false' 'default' => 'false'
), ),
) )
@ -218,21 +218,13 @@ class TAINACAN_REST_Filters_Controller extends TAINACAN_REST_Controller {
*/ */
public function delete_item( $request ) { public function delete_item( $request ) {
$filter_id = $request['filter_id']; $filter_id = $request['filter_id'];
$permanently = $request['permanently'];
$is_permanently = json_decode($request->get_body(), true); $args = [$filter_id, $permanently];
if(!empty($is_permanently)){ $filter = $this->filter_repository->delete($args);
$args = [$filter_id, $is_permanently];
$filter = $this->filter_repository->delete($args); return new WP_REST_Response($this->prepare_item_for_response($filter, $request), 200);
return new WP_REST_Response($this->prepare_item_for_response($filter, $request), 200);
}
return new WP_REST_Response([
'error_message' => __('The body could not be empty', 'tainacan'),
'body' => $request->get_body()
], 400);
} }
/** /**

10
src/api/endpoints/class-tainacan-rest-items-controller.php
View File

@ -77,8 +77,8 @@ class TAINACAN_REST_Items_Controller extends TAINACAN_REST_Controller {
'callback' => array($this, 'delete_item'), 'callback' => array($this, 'delete_item'),
'permission_callback' => array($this, 'delete_item_permissions_check'), 'permission_callback' => array($this, 'delete_item_permissions_check'),
'args' => array( 'args' => array(
'body_args' => array( 'permanently' => array(
'description' => __('To delete permanently, in body you can pass \'is_permanently\' as true. By default this will only trash collection'), 'description' => __('To delete permanently, you can pass \'permanently\' as true. By default this will only trash collection'),
'default' => 'false' 'default' => 'false'
), ),
) )
@ -306,10 +306,10 @@ class TAINACAN_REST_Items_Controller extends TAINACAN_REST_Controller {
* @return WP_Error|WP_REST_Response * @return WP_Error|WP_REST_Response
*/ */
public function delete_item( $request ) { public function delete_item( $request ) {
$item_id = $request['item_id']; $item_id = $request['item_id'];
$is_permanently = json_decode($request->get_body(), true); $permanently = $request['permanently'];
$args = [$item_id, $is_permanently]; $args = [$item_id, $permanently];
$item = $this->items_repository->delete($args); $item = $this->items_repository->delete($args);

18
src/api/endpoints/class-tainacan-rest-taxonomies-controller.php
View File

@ -58,9 +58,9 @@ class TAINACAN_REST_Taxonomies_Controller extends TAINACAN_REST_Controller {
'callback' => array($this, 'delete_item'), 'callback' => array($this, 'delete_item'),
'permission_callback' => array($this, 'delete_item_permissions_check'), 'permission_callback' => array($this, 'delete_item_permissions_check'),
'args' => array( 'args' => array(
'body_args' => array( 'permanently' => array(
'description' => __('To delete permanently, in body you can pass \'is_permanently\' as true. By default this will only trash collection'), 'description' => __('To delete permanently, you can pass \'permanently\' as true. By default this will only trash collection'),
'default' => 'false' 'default' => 'false',
), ),
) )
), ),
@ -164,22 +164,14 @@ class TAINACAN_REST_Taxonomies_Controller extends TAINACAN_REST_Controller {
*/ */
public function delete_item( $request ) { public function delete_item( $request ) {
$taxonomy_id = $request['taxonomy_id']; $taxonomy_id = $request['taxonomy_id'];
$permanently = $request['permanently'];
if(empty($request->get_body())){
return new WP_REST_Response([
'error_message' => __('Body can not be empty.', 'tainacan'),
'body' => $request->get_body()
], 400);
}
$is_permanently = json_decode($request->get_body(), true);
$taxonomy = $this->taxonomy_repository->fetch($taxonomy_id); $taxonomy = $this->taxonomy_repository->fetch($taxonomy_id);
if(!empty($taxonomy)) { if(!empty($taxonomy)) {
$taxonomy_name = $taxonomy->get_db_identifier(); $taxonomy_name = $taxonomy->get_db_identifier();
$args = [ $taxonomy_id, $taxonomy_name, $is_permanently ]; $args = [ $taxonomy_id, $taxonomy_name, $permanently ];
$deleted = $this->taxonomy_repository->delete( $args ); $deleted = $this->taxonomy_repository->delete( $args );

24
src/classes/field-types/category/AddNewTerm.vue
View File

@ -2,8 +2,10 @@
<div> <div>
<span> <span>
<a <a
class="button" class="button"
@click="showForm = !showForm"><b-icon size="is-small" icon="plus"></b-icon>&nbsp;{{ $i18n.get('label_add_new_term') }}</a> @click="showForm = !showForm"><b-icon
size="is-small"
icon="plus"/>&nbsp;{{ $i18n.get('label_add_new_term') }}</a>
</span> </span>
<div class="columns"> <div class="columns">
<transition name="fade"> <transition name="fade">
@ -14,24 +16,26 @@
style="padding-left: 0px;"> style="padding-left: 0px;">
<b-field :label="$i18n.get('label_name')"> <b-field :label="$i18n.get('label_name')">
<b-input v-model="name"></b-input> <b-input v-model="name"/>
</b-field> </b-field>
<b-field :label="$i18n.get('label_parent_term')"> <b-field :label="$i18n.get('label_parent_term')">
<b-select <b-select
v-model="parent"> v-model="parent">
<option :value="0" selected> ---{{ $i18n.get('label_parent_term') }}--- </option> <option
:value="0"
selected> ---{{ $i18n.get('label_parent_term') }}--- </option>
<option <option
v-for="option,index in options" v-for="(option,index) in options"
:key="index" :key="index"
:value="option.term_id" :value="option.term_id"
v-html="setSpaces( option.level ) + option.name"></option> v-html="setSpaces( option.level ) + option.name"/>
</b-select> </b-select>
</b-field> </b-field>
<a <a
class="button is-primary" class="button is-primary"
@click="save">{{ $i18n.get('save') }}</a> @click="save">{{ $i18n.get('save') }}</a>
</section> </section>
</transition> </transition>
@ -97,7 +101,7 @@
if( !Array.isArray( val ) && this.field.field.multiple === 'no' ){ if( !Array.isArray( val ) && this.field.field.multiple === 'no' ){
axios.patch(`/item/${this.item_id}/metadata/${this.field_id}`, { axios.patch(`/item/${this.item_id}/metadata/${this.field_id}`, {
values: term_id, values: term_id,
}).then( res => { }).then(() => {
instance.$emit('newTerm', term_id); instance.$emit('newTerm', term_id);
}) })
} else { } else {
@ -105,7 +109,7 @@
val.push( term_id ); val.push( term_id );
axios.patch(`/item/${this.item_id}/metadata/${this.field_id}`, { axios.patch(`/item/${this.item_id}/metadata/${this.field_id}`, {
values: val, values: val,
}).then( res => { }).then( () => {
instance.$emit('newTerm', val); instance.$emit('newTerm', val);
}) })
} }

8
src/classes/field-types/category/Category.vue
View File

@ -3,9 +3,9 @@
<component <component
:is="getComponent()" :is="getComponent()"
v-model="valueComponent" v-model="valueComponent"
:allowNew="allowNew" :allow-new="allowNew"
:terms="terms" :terms="terms"
:options="getOptions(0)"></component> :options="getOptions(0)"/>
<add-new-term <add-new-term
class="add-new-term" class="add-new-term"
v-if="getComponent() !== 'tainacan-category-tag-input' && allowNew" v-if="getComponent() !== 'tainacan-category-tag-input' && allowNew"
@ -14,7 +14,7 @@
:item_id="field.item.id" :item_id="field.item.id"
:value="valueComponent" :value="valueComponent"
:options="getOptions(0)" :options="getOptions(0)"
@newTerm="reload"></add-new-term> @newTerm="reload"/>
</div> </div>
</template> </template>
<script> <script>
@ -88,7 +88,7 @@
} }
}) })
.catch(error => { .catch(error => {
console.log(error); this.$console.log(error);
}); });
}, },
getOptions( parent, level = 0 ){ // retrieve only ids getOptions( parent, level = 0 ){ // retrieve only ids

8
src/classes/field-types/category/CategoryCheckbox.vue
View File

@ -1,9 +1,11 @@
<template> <template>
<div> <div>
<div v-for="option,index in options"> <div
v-for="(option, index) in options"
:key="index">
<b-checkbox <b-checkbox
:id="id" :id="id"
:style="{ paddingLeft: (option.level * 30) + 'px' }" :style="{ paddingLeft: (option.level * 30) + 'px' }"
:key="index" :key="index"
v-model="checked" v-model="checked"
@input="onChecked(option)" @input="onChecked(option)"
@ -40,7 +42,7 @@
value: [ Number, String, Array ] value: [ Number, String, Array ]
}, },
methods: { methods: {
onChecked(option) { onChecked() {
this.$emit('blur'); this.$emit('blur');
this.onInput(this.checked) this.onInput(this.checked)
}, },

8
src/classes/field-types/category/CategoryRadio.vue
View File

@ -1,9 +1,11 @@
<template> <template>
<div> <div>
<div v-for="option,index in options"> <div
v-for="(option, index) in options"
:key="index">
<b-radio <b-radio
:id="id" :id="id"
:style="{ paddingLeft: (option.level * 30) + 'px' }" :style="{ paddingLeft: (option.level * 30) + 'px' }"
:key="index" :key="index"
v-model="checked" v-model="checked"
@input="onChecked(option)" @input="onChecked(option)"
@ -36,7 +38,7 @@
value: [ Number, String, Array ] value: [ Number, String, Array ]
}, },
methods: { methods: {
onChecked(option) { onChecked() {
this.$emit('blur'); this.$emit('blur');
this.onInput(this.checked) this.onInput(this.checked)
}, },

7
src/classes/field-types/category/CategorySelectbox.vue
View File

@ -5,12 +5,13 @@
:id="id" :id="id"
v-model="selected" v-model="selected"
@input="emitChange()" @input="emitChange()"
:placeholder="$i18n.get('label_select_category')" expanded> :placeholder="$i18n.get('label_select_category')"
expanded>
<option <option
v-for="option,index in options" v-for="(option, index) in options"
:key="index" :key="index"
:value="option.term_id" :value="option.term_id"
v-html="setSpaces( option.level ) + option.name"></option> v-html="setSpaces( option.level ) + option.name"/>
</b-select> </b-select>
</div> </div>
</div> </div>

7
src/classes/field-types/category/CategoryTaginput.vue
View File

@ -4,14 +4,13 @@
size="is-small" size="is-small"
rounded rounded
icon="magnify" icon="magnify"
:allowNew="allowNew" :allow-new="allowNew"
@input="emitChange" @input="emitChange"
v-model="selected" v-model="selected"
:data="labels" :data="labels"
field="label" field="label"
autocomplete autocomplete
@typing="search"> @typing="search"/>
</b-taginput>
</div> </div>
</template> </template>
<script> <script>
@ -23,7 +22,7 @@
} }
}, },
watch: { watch: {
terms( val ){ terms(){
this.selectedValues(); this.selectedValues();
} }
}, },

53
src/classes/field-types/category/FormCategory.vue
View File

@ -2,16 +2,15 @@
<section <section
v-if="isReady" v-if="isReady"
:listen="setError"> :listen="setError">
<b-field :addons="false" <b-field
:type="taxonomyType" :addons="false"
:message="taxonomyMessage" :type="taxonomyType"
> :message="taxonomyMessage">
<label class="label"> <label class="label">
{{ $i18n.get('label_select_category') }}<span :class="taxonomyType" >&nbsp;*&nbsp;</span> {{ $i18n.get('label_select_category') }}<span :class="taxonomyType" >&nbsp;*&nbsp;</span>
<help-button <help-button
:title="$i18n.getHelperTitle('tainacan-category', 'taxonomy_id')" :title="$i18n.getHelperTitle('tainacan-category', 'taxonomy_id')"
:message="$i18n.getHelperMessage('tainacan-category', 'taxonomy_id')"> :message="$i18n.getHelperMessage('tainacan-category', 'taxonomy_id')"/>
</help-button>
</label> </label>
<b-select <b-select
name="field_type_options[taxonomy_id]" name="field_type_options[taxonomy_id]"
@ -35,8 +34,7 @@
{{ $i18n.get('label_select_category_input_type') }} {{ $i18n.get('label_select_category_input_type') }}
<help-button <help-button
:title="$i18n.getHelperTitle('tainacan-category', 'input_type')" :title="$i18n.getHelperTitle('tainacan-category', 'input_type')"
:message="$i18n.getHelperMessage('tainacan-category', 'input_type')"> :message="$i18n.getHelperMessage('tainacan-category', 'input_type')"/>
</help-button>
</label> </label>
<b-select <b-select
v-if="listInputType" v-if="listInputType"
@ -45,7 +43,7 @@
@input="emitValues()" @input="emitValues()"
v-model="input_type"> v-model="input_type">
<option <option
v-for="option,index in single_types" v-for="(option, index) in single_types"
:value="index" :value="index"
:key="index"> :key="index">
{{ option }} {{ option }}
@ -60,7 +58,7 @@
v-else> v-else>
<option <option
v-for="option,index in multiple_types" v-for="(option, index) in multiple_types"
:value="index" :value="index"
:key="index"> :key="index">
{{ option }} {{ option }}
@ -74,14 +72,14 @@
{{ $i18n.get('label_category_allow_new_terms') }} {{ $i18n.get('label_category_allow_new_terms') }}
<help-button <help-button
:title="$i18n.getHelperTitle('tainacan-category', 'allow_new_terms')" :title="$i18n.getHelperTitle('tainacan-category', 'allow_new_terms')"
:message="$i18n.getHelperMessage('tainacan-category', 'allow_new_terms')"> :message="$i18n.getHelperMessage('tainacan-category', 'allow_new_terms')"/>
</help-button>
</label> </label>
<div class="block"> <div class="block">
<b-checkbox v-model="allow_new_terms" <b-checkbox
@input="emitValues()" v-model="allow_new_terms"
true-value="yes" @input="emitValues()"
false-value="no"> true-value="yes"
false-value="no">
{{ labelNewTerms() }} {{ labelNewTerms() }}
</b-checkbox> </b-checkbox>
</div> </div>
@ -102,7 +100,7 @@
errors: [ String, Object, Array ] errors: [ String, Object, Array ]
}, },
created(){ created(){
this.fetchTaxonomies().then( res => { this.fetchTaxonomies().then(() => {
if ( this.value ) { if ( this.value ) {
this.taxonomy_id = this.value.taxonomy_id; this.taxonomy_id = this.value.taxonomy_id;
} }
@ -124,23 +122,22 @@
if( this.field && this.field.multiple === 'no' ){ if( this.field && this.field.multiple === 'no' ){
let types = Object.keys( this.single_types ); let types = Object.keys( this.single_types );
let hasValue = this.value && this.value.input_type && types.indexOf( this.value.input_type ) >= 0; let hasValue = this.value && this.value.input_type && types.indexOf( this.value.input_type ) >= 0;
this.input_type = ( hasValue ) ? this.value.input_type : 'tainacan-category-radio'; this.setInputType( ( hasValue ) ? this.value.input_type : 'tainacan-category-radio' );
return true; return true;
} else { } else {
let types = Object.keys( this.multiple_types ); let types = Object.keys( this.multiple_types );
let hasValue = this.value && this.value.input_type && types.indexOf( this.value.input_type ) >= 0; let hasValue = this.value && this.value.input_type && types.indexOf( this.value.input_type ) >= 0;
this.input_type = ( hasValue ) ? this.value.input_type : 'tainacan-category-checkbox'; this.setInputType( ( hasValue ) ? this.value.input_type : 'tainacan-category-checkbox' );
return false; return false;
} }
}, },
setError(){ setError(){
if( this.errors && this.errors.taxonomy_id !== '' ){ if( this.errors && this.errors.taxonomy_id !== '' ){
this.taxonomyType = 'is-danger'; this.setErrorsAttributes( 'is-danger', this.errors.taxonomy_id );
this.taxonomyMessage = this.errors.taxonomy_id;
} else { } else {
this.taxonomyType = ''; this.setErrorsAttributes( '', '' );
this.taxonomyMessage = '';
} }
return true;
} }
}, },
data(){ data(){
@ -158,6 +155,13 @@
} }
}, },
methods: { methods: {
setInputType( input ){
this.input_type = input;
},
setErrorsAttributes( type, message ){
this.taxonomyType = type;
this.taxonomyMessage = message;
},
fetchTaxonomies(){ fetchTaxonomies(){
return axios.get('/taxonomies') return axios.get('/taxonomies')
.then(res => { .then(res => {
@ -171,8 +175,7 @@
} }
}) })
.catch(error => { .catch(error => {
console.log(error); this.$console.log(error);
reject(error);
}); });
}, },
labelNewTerms(){ labelNewTerms(){

2
src/classes/field-types/date/Date.vue
View File

@ -2,7 +2,7 @@
<b-datepicker <b-datepicker
:id="id" :id="id"
v-model="dateValue" v-model="dateValue"
@input="onInput($event)"></b-datepicker> @input="onInput($event)"/>
</template> </template>
<script> <script>

2
src/classes/field-types/numeric/Numeric.vue
View File

@ -6,7 +6,7 @@
step="0.01" step="0.01"
@blur="onBlur" @blur="onBlur"
@change="onBlur" @change="onBlur"
@input="onInput($event)"></b-input> @input="onInput($event)"/>
</template> </template>
<script> <script>

44
src/classes/field-types/relationship/FormRelationship.vue
View File

@ -9,8 +9,7 @@
{{ $i18n.get('label_collection_related') }}<span :class="collectionType" >&nbsp;*&nbsp;</span> {{ $i18n.get('label_collection_related') }}<span :class="collectionType" >&nbsp;*&nbsp;</span>
<help-button <help-button
:title="$i18n.getHelperTitle('tainacan-relationship', 'collection_id')" :title="$i18n.getHelperTitle('tainacan-relationship', 'collection_id')"
:message="$i18n.getHelperMessage('tainacan-relationship', 'collection_id')"> :message="$i18n.getHelperMessage('tainacan-relationship', 'collection_id')"/>
</help-button>
</label> </label>
<b-select <b-select
name="field_type_relationship[collection_id]" name="field_type_relationship[collection_id]"
@ -32,7 +31,7 @@
<transition name="fade"> <transition name="fade">
<div <div
v-if="loadingFields" v-if="loadingFields"
class="loading-spinner"></div> class="loading-spinner"/>
<b-field <b-field
v-if="hasFields" v-if="hasFields"
:addons="false"> :addons="false">
@ -40,12 +39,12 @@
{{ $i18n.get('label_fields_for_search') }} {{ $i18n.get('label_fields_for_search') }}
<help-button <help-button
:title="$i18n.getHelperTitle('tainacan-relationship', 'search')" :title="$i18n.getHelperTitle('tainacan-relationship', 'search')"
:message="$i18n.getHelperMessage('tainacan-relationship', 'search')"> :message="$i18n.getHelperMessage('tainacan-relationship', 'search')"/>
</help-button>
</label> </label>
<div class="block"> <div class="block">
<div <div
v-for="option in fields" v-for="(option, index) in fields"
:key="index"
class="field"> class="field">
<b-checkbox <b-checkbox
name="field_type_relationship[search][]" name="field_type_relationship[search][]"
@ -65,15 +64,15 @@
{{ $i18n.get('label_allow_repeated_items') }} {{ $i18n.get('label_allow_repeated_items') }}
<help-button <help-button
:title="$i18n.getHelperTitle('tainacan-relationship', 'repeated')" :title="$i18n.getHelperTitle('tainacan-relationship', 'repeated')"
:message="$i18n.getHelperMessage('tainacan-relationship', 'repeated')"> :message="$i18n.getHelperMessage('tainacan-relationship', 'repeated')"/>
</help-button>
</label> </label>
<div class="block"> <div class="block">
<b-checkbox v-model="modelRepeated" <b-checkbox
@input="emitValues()" v-model="modelRepeated"
true-value="yes" @input="emitValues()"
false-value="no"> true-value="yes"
{{ labelRepeated() }} false-value="no">
{{ labelRepeated() }}
</b-checkbox> </b-checkbox>
</div> </div>
</b-field> </b-field>
@ -82,7 +81,6 @@
<script> <script>
import { tainacan as axios } from '../../../js/axios/axios'; import { tainacan as axios } from '../../../js/axios/axios';
import Vue from 'vue';
export default { export default {
props: { props: {
@ -125,7 +123,7 @@
} }
}, },
created(){ created(){
this.fetchCollections().then( data => { this.fetchCollections().then(() => {
if( this.collection_id && this.collection_id !== '' ){ if( this.collection_id && this.collection_id !== '' ){
this.collection = this.collection_id; this.collection = this.collection_id;
} else if ( this.value ) { } else if ( this.value ) {
@ -142,15 +140,18 @@
computed: { computed: {
setError(){ setError(){
if( this.errors && this.errors.collection_id !== '' ){ if( this.errors && this.errors.collection_id !== '' ){
this.collectionType = 'is-danger'; this.setErrorsAttributes( 'is-danger', this.errors.collection_id );
this.collectionMessage = this.errors.collection_id;
} else { } else {
this.collectionType = ''; this.setErrorsAttributes( '', '' );
this.collectionMessage = '';
} }
return true;
}, },
}, },
methods:{ methods:{
setErrorsAttributes( type, message ){
this.collectionType = type;
this.collectionType = message;
},
fetchCollections(){ fetchCollections(){
return axios.get('/collections') return axios.get('/collections')
.then(res => { .then(res => {
@ -164,8 +165,7 @@
} }
}) })
.catch(error => { .catch(error => {
console.log(error); this.$console.log(error);
reject(error);
}); });
}, },
fetchFieldsFromCollection( value ){ fetchFieldsFromCollection( value ){
@ -198,7 +198,7 @@
}) })
} }
}) })
.catch((error) => { .catch(() => {
this.hasFields = false; this.hasFields = false;
}); });

57
src/classes/field-types/relationship/Relationship.vue
View File

@ -7,8 +7,8 @@
autocomplete autocomplete
:loading="loading" :loading="loading"
field="label" field="label"
@typing="search"> @typing="search"/>
</b-taginput>
</div> </div>
</template> </template>
@ -18,8 +18,8 @@
export default { export default {
created(){ created(){
let collectionId = ( this.field && this.field.field.field_type_options.collection_id ) ? this.field.field.field_type_options.collection_id : this.collection_id;
if( this.field.value ){ if( this.field.value ){
let collectionId = ( this.field && this.field.field.field_type_options.collection_id ) ? this.field.field.field_type_options.collection_id : this.collection_id;
let query = qs.stringify({ postin: ( Array.isArray( this.field.value ) ) ? this.field.value : [ this.field.value ] }); let query = qs.stringify({ postin: ( Array.isArray( this.field.value ) ) ? this.field.value : [ this.field.value ] });
axios.get('/collection/'+collectionId+'/items?' + query) axios.get('/collection/'+collectionId+'/items?' + query)
@ -29,7 +29,21 @@
} }
}) })
.catch(error => { .catch(error => {
console.log(error); this.$console.log(error);
});
}
if( this.field.field.field_type_options
&& this.field.field.field_type_options.search.length > 0){
axios.get('/collection/'+ collectionId +'/fields?context=edit')
.then( res => {
for (let item of res.data) {
if( this.field.field.field_type_options.search.indexOf( item.id ) >= 0 )
this.searchFields.push( item );
}
})
.catch(error => {
this.$console.log(error);
}); });
} }
}, },
@ -40,7 +54,10 @@
options: [], options: [],
loading: false, loading: false,
collectionId: 0, collectionId: 0,
inputValue: null inputValue: null,
searchFields: [],
queryObject: {},
itemsFound: []
} }
}, },
props: { props: {
@ -80,28 +97,42 @@
} }
if (query !== '') { if (query !== '') {
let metaquery = this.mountQuery( query );
this.loading = true; this.loading = true;
this.options = []; this.options = [];
let collectionId = ( this.field && this.field.field.field_type_options.collection_id ) ? this.field.field.field_type_options.collection_id : this.collection_id; let collectionId = ( this.field && this.field.field.field_type_options.collection_id ) ? this.field.field.field_type_options.collection_id : this.collection_id;
axios.get('/collection/'+collectionId+'/items') axios.get('/collection/'+collectionId+'/items?' + qs.stringify( metaquery ))
.then( res => { .then( res => {
let result = [];
this.loading = false; this.loading = false;
result = res.data.filter(item => { let result = res.data;
return item.title.toLowerCase()
.indexOf(query.toLowerCase()) > -1;
});
for (let item of result) { for (let item of result) {
this.options.push({ label: item.title, value: item.id }) this.options.push({ label: item.title, value: item.id })
} }
}) })
.catch(error => { .catch(error => {
console.log(error); this.$console.log(error);
}); });
} else { } else {
this.options = []; this.options = [];
} }
},
mountQuery( search ){
let query = []
query['search'] = search;
if( this.searchFields.length > 0){
query['metaquery'] = [];
const metaquery = query['metaquery'];
metaquery['relation'] = 'OR'
for( let index in this.searchFields ){
metaquery[index] = {
key: this.searchFields[index].id,
value: search
}
}
query['metaquery'] = metaquery;
}
return query;
} }
} }
} }

25
src/classes/field-types/selectbox/FormSelectbox.vue
View File

@ -1,24 +1,22 @@
<template> <template>
<section <section
:listen="setError"> :listen="setError">
<b-field :addons="false" <b-field
:type="optionType" :addons="false"
:message="optionMessage" :type="optionType"
> :message="optionMessage">
<label class="label"> <label class="label">
{{ $i18n.getHelperTitle('tainacan-selectbox', 'options') }}<span :class="optionType" >&nbsp;*&nbsp;</span> {{ $i18n.getHelperTitle('tainacan-selectbox', 'options') }}<span :class="optionType" >&nbsp;*&nbsp;</span>
<help-button <help-button
:title="$i18n.getHelperTitle('tainacan-selectbox', 'options')" :title="$i18n.getHelperTitle('tainacan-selectbox', 'options')"
:message="$i18n.getHelperMessage('tainacan-selectbox', 'options')"> :message="$i18n.getHelperMessage('tainacan-selectbox', 'options')"/>
</help-button>
</label> </label>
<b-taginput <b-taginput
v-model="options" v-model="options"
@input="emitValues()" @input="emitValues()"
@focus="clear()" @focus="clear()"
icon="label" icon="label"
:placeholder="$i18n.get('new')"> :placeholder="$i18n.get('new')"/>
</b-taginput>
</b-field> </b-field>
</section> </section>
</template> </template>
@ -45,12 +43,11 @@
computed: { computed: {
setError(){ setError(){
if( this.errors && this.errors.options !== '' ){ if( this.errors && this.errors.options !== '' ){
this.optionType = 'is-danger'; this.setErrorsAttributes( 'is-danger', this.errors.options )
this.optionMessage = this.errors.options;
} else { } else {
this.optionType = ''; this.setErrorsAttributes( '', '' )
this.optionMessage = '';
} }
return true;
} }
}, },
methods: { methods: {
@ -62,6 +59,10 @@
this.$emit('input',{ this.$emit('input',{
options: ( this.options.length > 0 ) ? this.options.join('\n') : '' options: ( this.options.length > 0 ) ? this.options.join('\n') : ''
}) })
},
setErrorsAttributes( type, message ){
this.optionType = type;
this.optionMessage = message;
} }
} }
} }

2
src/classes/field-types/selectbox/Selectbox.vue
View File

@ -5,7 +5,7 @@
v-model="selected" v-model="selected"
@input="onChecked()"> @input="onChecked()">
<option <option
v-for="option,index in getOptions" v-for="(option, index) in getOptions"
:key="index" :key="index"
:label="option" :label="option"
:value="option" :value="option"

67
src/classes/field-types/tainacan-form-item.vue
View File

@ -1,29 +1,49 @@
<template> <template>
<b-field <b-field
:addons="false" :addons="false"
:label="field.field.name" :label="field.field.name"
:message="getErrorMessage" :message="getErrorMessage"
:type="fieldTypeMessage"> :type="fieldTypeMessage">
<help-button <help-button
:title="field.field.name" :title="field.field.name"
:message="field.field.description"> :message="field.field.description"/>
</help-button> <div v-if="isTextInputComponent( field.field.field_type_object.component )">
<div v-if="isTextInputComponent( field.field.field_type_object.component )"> <component
<component :id="field.field.field_type_object.component + '-' + field.field.slug" :is="field.field.field_type_object.component" v-model="inputs[0]" :field="field" @blur="changeValue()"></component> :id="field.field.field_type_object.component + '-' + field.field.slug"
<div v-if="field.field.multiple == 'yes'"> :is="field.field.field_type_object.component"
<div v-if="index > 0" v-for="(input, index) in inputsList " v-bind:key="index" class="multiple-inputs"> v-model="inputs[0]"
<component :id="field.field.field_type_object.component + '-' + field.field.slug" :is="field.field.field_type_object.component" v-model="inputs[index]" :field="field" @blur="changeValue()"></component><a class="button" v-if="index > 0" @click="removeInput(index)">-</a> :field="field"
</div> @blur="changeValue()"/>
<a class="button" @click="addInput">+</a> <div v-if="field.field.multiple == 'yes'">
<div
v-if="index > 0"
v-for="(input, index) in inputsList "
:key="index"
class="multiple-inputs">
<component
:id="field.field.field_type_object.component + '-' + field.field.slug"
:is="field.field.field_type_object.component"
v-model="inputs[index]"
:field="field"
@blur="changeValue()"/><a
class="button"
v-if="index > 0"
@click="removeInput(index)">-</a>
</div> </div>
<a
class="button"
@click="addInput">+</a>
</div> </div>
<div v-else> </div>
<component <div v-else>
:id="field.field.field_type_object.component + '-' + field.field.slug" <component
:is="field.field.field_type_object.component" v-model="inputs" :id="field.field.field_type_object.component + '-' + field.field.slug"
:field="field" @blur="changeValue()"></component> :is="field.field.field_type_object.component"
</div> v-model="inputs"
</b-field> :field="field"
@blur="changeValue()"/>
</div>
</b-field>
</template> </template>
<script> <script>
@ -32,7 +52,7 @@
export default { export default {
name: 'TainacanFormItem', name: 'TainacanFormItem',
props: { props: {
field: {} field: Object
}, },
data(){ data(){
return { return {
@ -48,12 +68,12 @@
let msg = ''; let msg = '';
let errors = eventBus.getErrors(this.field.field.id); let errors = eventBus.getErrors(this.field.field.id);
if ( errors) { if ( errors) {
this.fieldTypeMessage = 'is-danger'; this.setFieldTypeMessage('is-danger');
for (let index in errors) { for (let index in errors) {
msg += errors[index] + '\n'; msg += errors[index] + '\n';
} }
} else { } else {
this.fieldTypeMessage = ''; this.setFieldTypeMessage('');
} }
return msg; return msg;
} }
@ -85,6 +105,9 @@
isTextInputComponent( component ){ isTextInputComponent( component ){
let array = ['tainacan-relationship','tainacan-category']; let array = ['tainacan-relationship','tainacan-category'];
return !( array.indexOf( component ) >= 0 ); return !( array.indexOf( component ) >= 0 );
},
setFieldTypeMessage( message ){
this.fieldTypeMessage = message;
} }
} }
} }

11
src/classes/field-types/text/Text.vue
View File

@ -1,9 +1,9 @@
<template> <template>
<b-input <b-input
:id="id" :id="id"
:value="inputValue" :value="inputValue"
@blur="onBlur" @blur="onBlur"
@input="onInput($event)"></b-input> @input="onInput($event)"/>
</template> </template>
<script> <script>
@ -33,9 +33,6 @@
this.inputValue = $event; this.inputValue = $event;
this.$emit('input', this.inputValue); this.$emit('input', this.inputValue);
} }
},
created(){
this.inputValue = this.value;
} }
} }
</script> </script>

5
src/classes/field-types/textarea/Textarea.vue
View File

@ -4,7 +4,7 @@
type="textarea" type="textarea"
:value="inputValue" :value="inputValue"
@blur="onBlur" @blur="onBlur"
@input="onInput($event)"></b-input> @input="onInput($event)"/>
</template> </template>
<script> <script>
@ -34,9 +34,6 @@
this.inputValue = $event; this.inputValue = $event;
this.$emit('input', this.inputValue); this.$emit('input', this.inputValue);
} }
},
created(){
this.inputValue = this.value;
} }
} }
</script> </script>

30
src/classes/filter-types/autocomplete/Autocomplete.vue
View File

@ -12,8 +12,12 @@
@select="option => setResults(option) "> @select="option => setResults(option) ">
<template slot-scope="props"> <template slot-scope="props">
<div class="media"> <div class="media">
<div class="media-left" v-if="props.option.img"> <div
<img width="32" :src="`${props.option.img}`"> class="media-left"
v-if="props.option.img">
<img
width="32"
:src="`${props.option.img}`">
</div> </div>
<div class="media-content"> <div class="media-content">
{{ props.option.label }} {{ props.option.label }}
@ -23,11 +27,12 @@
</b-autocomplete> </b-autocomplete>
<br> <br>
<div class="field has-text-centered"> <div class="field has-text-centered">
<b-tag v-if="results !== ''" <b-tag
type="is-primary" v-if="results !== ''"
size="is-small" type="is-primary"
closable size="is-small"
@close="clearSearch()"> closable
@close="clearSearch()">
{{ results }} {{ results }}
</b-tag> </b-tag>
</div> </div>
@ -37,6 +42,7 @@
<script> <script>
import { tainacan as axios } from '../../../js/axios/axios' import { tainacan as axios } from '../../../js/axios/axios'
import { filter_type_mixin } from '../filter-types-mixin' import { filter_type_mixin } from '../filter-types-mixin'
import qs from 'qs';
export default { export default {
created(){ created(){
@ -53,7 +59,7 @@
} }
}) })
.catch(error => { .catch(error => {
console.log(error); this.$console.log(error);
}); });
}, },
data(){ data(){
@ -95,10 +101,10 @@
promise = this.getValuesPlainText( this.field, query ); promise = this.getValuesPlainText( this.field, query );
} }
promise.then( data => { promise.then( () => {
this.isLoading = false; this.isLoading = false;
}).catch( error => { }).catch( error => {
console.log('error select', error ); this.$console.log('error select', error );
this.isLoading = false; this.isLoading = false;
}); });
}, },
@ -121,12 +127,12 @@
.then( res => { .then( res => {
for (let item of res.data) { for (let item of res.data) {
// instance.selected.push({ label: item.title, value: item.id, img: '' }); // instance.selected.push({ label: item.title, value: item.id, img: '' });
console.log(item.title); this.$console.log(item.title);
instance.results = item.title; instance.results = item.title;
} }
}) })
.catch(error => { .catch(error => {
console.log(error); this.$console.log(error);
}); });
} else { } else {
instance.results = metadata.value; instance.results = metadata.value;

10
src/classes/filter-types/checkbox/Checkbox.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div class="block"> <div class="block">
<div <div
v-for="option,index in options" v-for="(option, index) in options"
:key="index" :key="index"
class="field"> class="field">
<b-checkbox <b-checkbox
@ -31,7 +31,7 @@
} }
}) })
.catch(error => { .catch(error => {
console.log(error); this.$console.log(error);
}); });
}, },
data(){ data(){
@ -57,7 +57,7 @@
let promise = null; let promise = null;
this.isLoading = true; this.isLoading = true;
if ( this.type === 'Tainacan\Field_types\Relationship' ) { if ( this.type === 'Tainacan\\Field_types\\Relationship' ) {
let collectionTarget = ( this.filter && this.filter.field.field_type_options.collection_id ) ? let collectionTarget = ( this.filter && this.filter.field.field_type_options.collection_id ) ?
this.filter.field.field_type_options.collection_id : this.collection_id; this.filter.field.field_type_options.collection_id : this.collection_id;
@ -67,12 +67,12 @@
promise = this.getValuesPlainText( this.field ); promise = this.getValuesPlainText( this.field );
} }
promise.then( data => { promise.then(() => {
this.isLoading = false; this.isLoading = false;
this.selectedValues() this.selectedValues()
}) })
.catch( error => { .catch( error => {
console.log('error select', error ); this.$console.log('error select', error );
this.isLoading = false; this.isLoading = false;
}); });
}, },

23
src/classes/filter-types/custom-interval/CustomInterval.vue
View File

@ -5,37 +5,36 @@
size="is-small" size="is-small"
v-model="date_init" v-model="date_init"
@input="validate_values()" @input="validate_values()"
icon="calendar-today"> icon="calendar-today"/>
</b-datepicker>
<br> <br>
<b-datepicker <b-datepicker
size="is-small" size="is-small"
v-model="date_end" v-model="date_end"
@input="validate_values()" @input="validate_values()"
@focus="isTouched = true" @focus="isTouched = true"
icon="calendar-today"> icon="calendar-today"/>
</b-datepicker>
<br> <br>
</div> </div>
<div class="columns" v-else> <div
class="columns"
v-else>
<b-input <b-input
size="is-small" size="is-small"
type="number" type="number"
@input="validate_values()" @input="validate_values()"
class="column" class="column"
v-model="value_init"> v-model="value_init"/>
</b-input>
<b-input <b-input
size="is-small" size="is-small"
type="number" type="number"
@input="validate_values()" @input="validate_values()"
@focus="isTouched = true" @focus="isTouched = true"
class="column" class="column"
v-model="value_end"> v-model="value_end"/>
</b-input>
</div> </div>
<div class="field has-text-centered"> <div class="field has-text-centered">
<b-tag v-if="isValid && !clear" <b-tag
v-if="isValid && !clear"
type="is-primary" type="is-primary"
size="is-small" size="is-small"
closable closable
@ -66,7 +65,7 @@
} }
}) })
.catch(error => { .catch(error => {
console.log(error); this.$console.log(error);
}); });
}, },
data(){ data(){
@ -91,7 +90,7 @@
field_id: [Number], // not required, but overrides the filter field id if is set field_id: [Number], // not required, but overrides the filter field id if is set
collection_id: [Number], // not required, but overrides the filter field id if is set collection_id: [Number], // not required, but overrides the filter field id if is set
id: '', id: '',
query: {} query: Object
}, },
methods: { methods: {
// only validate if the first value is higher than first // only validate if the first value is higher than first

8
src/classes/filter-types/selectbox/Selectbox.vue
View File

@ -8,7 +8,7 @@
expanded> expanded>
<option value="">{{ $i18n.get('label_selectbox_init') }}...</option> <option value="">{{ $i18n.get('label_selectbox_init') }}...</option>
<option <option
v-for="option,index in options" v-for="(option, index) in options"
:key="index" :key="index"
:label="option.label" :label="option.label"
:value="option.value" :value="option.value"
@ -36,7 +36,7 @@
} }
}) })
.catch(error => { .catch(error => {
console.log(error); this.$console.log(error);
}); });
}, },
data(){ data(){
@ -66,12 +66,12 @@
promise = this.getValuesPlainText( this.field ); promise = this.getValuesPlainText( this.field );
} }
promise.then( data => { promise.then(() => {
this.isLoading = false; this.isLoading = false;
instance.selectedValues(); instance.selectedValues();
}) })
.catch( error => { .catch( error => {
console.log('error select', error ); this.$console.log('error select', error );
this.isLoading = false; this.isLoading = false;
}); });
}, },

11
src/classes/filter-types/taginput/Taginput.vue
View File

@ -9,8 +9,7 @@
autocomplete autocomplete
:loading="loading" :loading="loading"
field="label" field="label"
@typing="search"> @typing="search"/>
</b-taginput>
</div> </div>
</template> </template>
@ -34,7 +33,7 @@
} }
}) })
.catch(error => { .catch(error => {
console.log(error); this.$console.log(error);
}); });
}, },
data(){ data(){
@ -81,10 +80,10 @@
promise = this.getValuesPlainText( this.field, query ); promise = this.getValuesPlainText( this.field, query );
} }
promise.then( data => { promise.then(() => {
this.isLoading = false; this.isLoading = false;
}).catch( error => { }).catch( error => {
console.log('error select', error ); this.$console.log('error select', error );
this.isLoading = false; this.isLoading = false;
}); });
}, },
@ -110,7 +109,7 @@
} }
}) })
.catch(error => { .catch(error => {
console.log(error); this.$console.log(error);
}); });
} else { } else {
for (let item of metadata.value) { for (let item of metadata.value) {

21
src/classes/filter-types/tainacan-filters-list.vue
View File

@ -1,29 +1,29 @@
<template> <template>
<b-field :label="filter.name" <b-field
:message="getErrorMessage" :label="filter.name"
:type="filterTypeMessage"> :message="getErrorMessage"
:type="filterTypeMessage">
<div> <div>
<component <component
:id="filter.filter_type_object.component + '-' + filter.slug" :id="filter.filter_type_object.component + '-' + filter.slug"
:is="filter.filter_type_object.component" :is="filter.filter_type_object.component"
:filter="getFilter" :filter="getFilter"
:query="query" :query="query"
@input="listen( $event )"></component> @input="listen( $event )"/>
</div> </div>
</b-field> </b-field>
</template> </template>
<script> <script>
import { eventFilterBus } from '../../js/event-bus-filters' import { eventFilterBus } from '../../js/event-bus-filters'
import qs from 'qs';
import { mapActions, mapGetters } from 'vuex'; import { mapActions, mapGetters } from 'vuex';
import router from '../../admin/js/router' import router from '../../admin/js/router'
export default { export default {
name: 'TainacanFiltersList', name: 'TainacanFiltersList',
props: { props: {
filter: {}, filter: Object,
query: {} query: Object
}, },
data(){ data(){
return { return {
@ -36,12 +36,12 @@
let msg = ''; let msg = '';
let errors = eventFilterBus.getErrors( this.filter.id ); let errors = eventFilterBus.getErrors( this.filter.id );
if ( errors) { if ( errors) {
this.filterTypeMessage = 'is-danger'; this.setFilterTypeMessage('is-danger');
for (let index in errors) { for (let index in errors) {
msg += errors[index] + '\n'; msg += errors[index] + '\n';
} }
} else { } else {
this.filterTypeMessage = ''; this.setFilterTypeMessage('');
} }
return msg; return msg;
}, },
@ -62,6 +62,9 @@
eventFilterBus.$emit( 'input', ( event.field_id ) ? event : event.detail[0] ); eventFilterBus.$emit( 'input', ( event.field_id ) ? event : event.detail[0] );
router.push({ query: {} }); router.push({ query: {} });
router.push({ query: this.getPostQuery() }); router.push({ query: this.getPostQuery() });
},
setFilterTypeMessage( message ){
this.filterTypeMessage = message;
} }
} }
} }

4
src/classes/repositories/class-tainacan-collections.php
View File

@ -243,8 +243,8 @@ class Collections extends Repository {
* @return mixed|Collection * @return mixed|Collection
*/ */
public function delete( $args ) { public function delete( $args ) {
if ( ! empty( $args[1] ) && $args[1]['is_permanently'] === true ) { if ( ! empty( $args[1] ) && $args[1] === true ) {
return new Entities\Collection( wp_delete_post( $args[0], $args[1]['is_permanently'] ) ); return new Entities\Collection( wp_delete_post( $args[0], $args[1] ) );
} }
return new Entities\Collection( wp_trash_post( $args[0] ) ); return new Entities\Collection( wp_trash_post( $args[0] ) );

4
src/classes/repositories/class-tainacan-filters.php
View File

@ -188,8 +188,8 @@ class Filters extends Repository {
* *
*/ */
public function delete($args){ public function delete($args){
if(!empty($args[1]) && $args[1]['is_permanently'] === true){ if(!empty($args[1]) && $args[1] === true){
return new Entities\Filter(wp_delete_post($args[0], $args[1]['is_permanently'])); return new Entities\Filter(wp_delete_post($args[0], $args[1]));
} }
return new Entities\Filter(wp_trash_post($args[0])); return new Entities\Filter(wp_trash_post($args[0]));

4
src/classes/repositories/class-tainacan-items.php
View File

@ -304,8 +304,8 @@ class Items extends Repository {
* @return mixed|Entities\Item * @return mixed|Entities\Item
*/ */
public function delete( $args ) { public function delete( $args ) {
if ( ! empty( $args[1] ) && $args[1]['is_permanently'] === true ) { if ( ! empty( $args[1] ) && $args[1] === true ) {
return new Entities\Item( wp_delete_post( $args[0], $args[1]['is_permanently'] ) ); return new Entities\Item( wp_delete_post( $args[0], $args[1] ) );
} }
return new Entities\Item( wp_trash_post( $args[0] ) ); return new Entities\Item( wp_trash_post( $args[0] ) );

4
src/classes/repositories/class-tainacan-taxonomies.php
View File

@ -209,9 +209,9 @@ class Taxonomies extends Repository {
public function delete($args){ public function delete($args){
$taxonomy_id = $args[0]; $taxonomy_id = $args[0];
$taxonomy_name = $args[1]; $taxonomy_name = $args[1];
$is_permanently = $args[2]['is_permanently']; $permanently = $args[2];
if($is_permanently === true){ if($permanently === true){
$unregistered = unregister_taxonomy($taxonomy_name); $unregistered = unregister_taxonomy($taxonomy_name);
if($unregistered instanceof \WP_Error){ if($unregistered instanceof \WP_Error){

79
src/js/store/modules/category/actions.js
View File

@ -1,5 +1,6 @@
import axios from '../../../axios/axios' import axios from '../../../axios/axios'
// CATEGORIES
export const createCategory = ({commit}, category) => { export const createCategory = ({commit}, category) => {
return new Promise(( resolve, reject ) => { return new Promise(( resolve, reject ) => {
axios.tainacan.post('/taxonomies', { axios.tainacan.post('/taxonomies', {
@ -25,14 +26,17 @@ export const createCategory = ({commit}, category) => {
export const deleteCategory = ({ commit }, categoryId) => { export const deleteCategory = ({ commit }, categoryId) => {
return new Promise(( resolve, reject ) => { return new Promise(( resolve, reject ) => {
axios.tainacan.delete(`/taxonomies/${categoryId}`, { axios.tainacan.delete(`/taxonomies/${categoryId}?permanently=${true}`)
'is_permanently': true
})
.then(res => { .then(res => {
console.info(res);
resolve( res.data ); commit('deleteCategory', res.data);
resolve( res );
}) })
.catch(error => { .catch(error => {
console.error(error);
reject( error ) reject( error )
}); });
}); });
@ -111,4 +115,69 @@ export const fetchCategoryName = ({ commit }, categoryId) => {
reject(error) reject(error)
}) })
}); });
}; };
// CATEGORY TERMS
export const sendTerm = ({commit}, { categoryId, index, name, description, parent }) => {
return new Promise(( resolve, reject ) => {
axios.tainacan.post('/taxonomy/' + categoryId + '/terms/', {
name: name,
description: description,
parent: parent
})
.then( res => {
let term = res.data;
commit('setSingleTerm', term);
resolve( term );
})
.catch(error => {
console.log(error);
reject( error );
});
});
};
export const deleteTerm = ({ commit }, { categoryId, termId }) => {
return new Promise(( resolve, reject ) => {
axios.tainacan.delete(`/taxonomy/${categoryId}/terms/${termId}?permanently=${true}`)
.then(res => {
let term = res.data;
commit('deleteTerm', term);
resolve( term );
})
.catch(error => {
reject( error )
});
});
};
export const updateTerm = ({ commit }, { categoryId, termId, index, options }) => {
return new Promise(( resolve, reject ) => {
axios.tainacan.patch('/taxonomy/' + categoryId + '/terms/' + termId, options)
.then( res => {
let term = res.data;
console.log(term);
commit('setSingleTerm', term);
resolve( term );
})
.catch(error => {
console.log(error);
reject(error)
//reject({ error_message: error['response']['data'].error_message, errors: error['response']['data'].errors });
});
});
};
export const fetchTerms = ({ commit }, categoryId ) => {
return new Promise((resolve, reject) => {
axios.tainacan.get(`/taxonomy/${categoryId}/terms/`)
.then(res => {
let terms = res.data;
commit('setTerms', terms);
resolve( terms );
})
.catch(error => {
reject( error );
});
});
};

4
src/js/store/modules/category/getters.js
View File

@ -8,4 +8,8 @@ export const getCategories = state => {
export const getCategoryName = state => { export const getCategoryName = state => {
return state.categoryName; return state.categoryName;
};
export const getTerms = state => {
return state.terms;
}; };

1
src/js/store/modules/category/index.js
View File

@ -6,6 +6,7 @@ const state = {
categories: [], categories: [],
category: {}, category: {},
categoryName: String, categoryName: String,
terms: []
}; };
export default { export default {

32
src/js/store/modules/category/mutations.js
View File

@ -1,3 +1,4 @@
// CATEGORIES
export const setCategory = (state, category) => { export const setCategory = (state, category) => {
state.category = category; state.category = category;
}; };
@ -8,4 +9,35 @@ export const setCategories = (state, categories) => {
export const setCategoryName = (state, name) => { export const setCategoryName = (state, name) => {
state.categoryName = name; state.categoryName = name;
};
export const deleteCategory = ( state, category ) => {
let index = state.categories.findIndex(deletedCategory => deletedCategory.id === category.id);
if (index >= 0) {
state.categories.splice(index, 1);
}
};
// CATEGORY TERMS
export const setSingleTerm = (state, term) => {
let index = state.terms.findIndex(updatedTerm => updatedTerm.id === term.id);
if ( index >= 0){
Vue.set( state.terms, index, term );
} else {
state.terms.push( term );
}
};
export const setTerms = (state, terms) => {
state.terms = terms;
};
export const deleteTerm = ( state, term ) => {
let index = state.terms.findIndex(deletedTerm => deletedTerm.id === term.id);
if (index >= 0) {
state.terms.splice(index, 1);
}
}; };

8
tests/test-api-collections.php
View File

@ -97,13 +97,13 @@ class TAINACAN_REST_Collections_Controller extends TAINACAN_UnitApiTestCase {
$collection1 = $this->tainacan_entity_factory->create_entity('collection', '', true); $collection1 = $this->tainacan_entity_factory->create_entity('collection', '', true);
// Delete permanently // Delete permanently
$delete_permanently = json_encode(['is_permanently' => true]); $delete_permanently = ['permanently' => true];
$request = new \WP_REST_Request( $request = new \WP_REST_Request(
'DELETE', 'DELETE',
$this->namespace . '/collections/' . $collection1->get_id() $this->namespace . '/collections/' . $collection1->get_id()
); );
$request->set_body($delete_permanently); $request->set_query_params($delete_permanently);
$response = $this->server->dispatch($request); $response = $this->server->dispatch($request);
@ -122,13 +122,13 @@ class TAINACAN_REST_Collections_Controller extends TAINACAN_UnitApiTestCase {
$collection2 = $this->tainacan_entity_factory->create_entity('collection', '', true); $collection2 = $this->tainacan_entity_factory->create_entity('collection', '', true);
// Move to trash // Move to trash
$delete_permanently = json_encode(['is_permanently' => false]); $delete_permanently = ['permanently' => false];
$request = new \WP_REST_Request( $request = new \WP_REST_Request(
'DELETE', 'DELETE',
$this->namespace . '/collections/' . $collection2->get_id() $this->namespace . '/collections/' . $collection2->get_id()
); );
$request->set_body($delete_permanently); $request->set_query_params($delete_permanently);
$response = $this->server->dispatch($request); $response = $this->server->dispatch($request);

12
tests/test-api-filters.php
View File

@ -84,14 +84,12 @@ class TAINACAN_REST_Terms_Controller extends TAINACAN_UnitApiTestCase {
true true
); );
$is_permanently = json_encode([ $permanently = [ 'permanently' => false ];
'is_permanently' => false
]);
$request = new \WP_REST_Request( $request = new \WP_REST_Request(
'DELETE', $this->namespace . '/filters/' . $filter->get_id()); 'DELETE', $this->namespace . '/filters/' . $filter->get_id());
$request->set_body($is_permanently); $request->set_query_params($permanently);
$response = $this->server->dispatch($request); $response = $this->server->dispatch($request);
@ -105,14 +103,12 @@ class TAINACAN_REST_Terms_Controller extends TAINACAN_UnitApiTestCase {
##### DELETE ##### ##### DELETE #####
$is_permanently = json_encode([ $permanently = [ 'permanently' => true ];
'is_permanently' => true
]);
$request = new \WP_REST_Request( $request = new \WP_REST_Request(
'DELETE', $this->namespace . '/filters/' . $filter->get_id()); 'DELETE', $this->namespace . '/filters/' . $filter->get_id());
$request->set_body($is_permanently); $request->set_query_params($permanently);
$response = $this->server->dispatch($request); $response = $this->server->dispatch($request);

8
tests/test-api-items.php
View File

@ -93,13 +93,13 @@ class TAINACAN_REST_Items_Controller extends TAINACAN_UnitApiTestCase {
); );
// Move to trash // Move to trash
$delete_permanently = json_encode(['is_permanently' => false]); $delete_permanently = ['permanently' => false];
$request = new \WP_REST_Request( $request = new \WP_REST_Request(
'DELETE', 'DELETE',
$this->namespace . '/items/' . $item1->get_id() $this->namespace . '/items/' . $item1->get_id()
); );
$request->set_body($delete_permanently); $request->set_query_params($delete_permanently);
$response = $this->server->dispatch($request); $response = $this->server->dispatch($request);
@ -126,13 +126,13 @@ class TAINACAN_REST_Items_Controller extends TAINACAN_UnitApiTestCase {
); );
// Delete permanently // Delete permanently
$delete_permanently = json_encode(['is_permanently' => true]); $delete_permanently = ['permanently' => true];
$request = new \WP_REST_Request( $request = new \WP_REST_Request(
'DELETE', 'DELETE',
$this->namespace . '/items/' . $item2->get_id() $this->namespace . '/items/' . $item2->get_id()
); );
$request->set_body($delete_permanently); $request->set_query_params($delete_permanently);
$response = $this->server->dispatch($request); $response = $this->server->dispatch($request);

14
tests/test-api-taxonomies.php
View File

@ -19,13 +19,13 @@ class TAINACAN_REST_Taxonomies_Controller extends TAINACAN_UnitApiTestCase {
true true
); );
$is_permanently = json_encode(['is_permanently' => false]); $permanently = [ 'permanently' => false ];
$request_trash = new \WP_REST_Request( $request_trash = new \WP_REST_Request(
'DELETE', $this->namespace . '/taxonomies/' . $taxonomy->get_id() 'DELETE', $this->namespace . '/taxonomies/' . $taxonomy->get_id()
); );
$request_trash->set_body($is_permanently); $request_trash->set_query_params($permanently);
$this->server->dispatch($request_trash); $this->server->dispatch($request_trash);
@ -36,13 +36,13 @@ class TAINACAN_REST_Taxonomies_Controller extends TAINACAN_UnitApiTestCase {
################ DELETE ### ################ DELETE ###
$is_permanently = json_encode(['is_permanently' => true]); $permanently = [ 'permanently' => true ];
$request_delete = new \WP_REST_Request( $request_delete = new \WP_REST_Request(
'DELETE', $this->namespace . '/taxonomies/' . $taxonomy->get_id() 'DELETE', $this->namespace . '/taxonomies/' . $taxonomy->get_id()
); );
$request_delete->set_body($is_permanently); $request_delete->set_query_params($permanently);
$this->server->dispatch($request_delete); $this->server->dispatch($request_delete);
@ -122,8 +122,10 @@ class TAINACAN_REST_Taxonomies_Controller extends TAINACAN_UnitApiTestCase {
$data = $response->get_data(); $data = $response->get_data();
$this->assertEquals($taxonomy1->get_name(), $data[1]['name']); $names = [ $data[1]['name'], $data[0]['name']];
$this->assertEquals($taxonomy2->get_name(), $data[0]['name']);
$this->assertContains($taxonomy1->get_name(), $names);
$this->assertContains($taxonomy2->get_name(), $names);
} }
public function test_update_taxonomy(){ public function test_update_taxonomy(){

12
webpack.config.js
View File

@ -14,6 +14,15 @@ module.exports = {
devtool: 'eval-source-map', devtool: 'eval-source-map',
module: { module: {
rules: [ rules: [
{
enforce: "pre",
test: /\.vue$/,
exclude: /node_modules/,
loader: "eslint-loader",
options: {
fix: false,
},
},
{ {
test: /\.vue$/, test: /\.vue$/,
loader: 'vue-loader', loader: 'vue-loader',
@ -53,6 +62,9 @@ module.exports = {
historyApiFallback: true, historyApiFallback: true,
noInfo: true noInfo: true
}, },
node: {
fs: 'empty'
},
} }
if (process.env.NODE_ENV === 'production') { if (process.env.NODE_ENV === 'production') {