Adds parent collection selection to Collection Edition Form.

This commit is contained in:
mateuswetah 2018-04-25 18:17:26 -03:00
parent 0cf5f40893
commit b5ac74a003
3 changed files with 90 additions and 12 deletions

View File

@ -17,7 +17,7 @@
<!-- Thumbnail -------------------------------- --> <!-- Thumbnail -------------------------------- -->
<b-field <b-field
:addons="false" :addons="false"
:label="$i18n.get('label_image')"> :label="$i18n.get('label_thumbnail')">
<div class="thumbnail-field"> <div class="thumbnail-field">
<a <a
class="button is-rounred is-secondary" class="button is-rounred is-secondary"
@ -205,7 +205,6 @@
id="tainacan-text-moderators-input" id="tainacan-text-moderators-input"
:placeholder="$i18n.get('instruction_moderators')" :placeholder="$i18n.get('instruction_moderators')"
:data="users" :data="users"
v-model="newModerator"
@select="onAddModerator($event)" @select="onAddModerator($event)"
:loading="isFetchingModerators" :loading="isFetchingModerators"
@input="fecthModerators($event)" @input="fecthModerators($event)"
@ -230,7 +229,7 @@
</li> </li>
</ul> </ul>
<div <div
class="moderators-list" class="moderators-empty-list"
v-else> v-else>
{{ $i18n.get('info_no_moderator_on_collection') }} {{ $i18n.get('info_no_moderator_on_collection') }}
</div> </div>
@ -250,6 +249,31 @@
v-model="form.slug" v-model="form.slug"
@focus="clearErrors('slug')"/> @focus="clearErrors('slug')"/>
</b-field> </b-field>
<!-- Parent Collection -------------------------------- -->
<b-field
:addons="false"
:label="$i18n.get('label_parent_collection')"
:type="editFormErrors['parent'] != undefined ? 'is-danger' : ''"
:message="editFormErrors['parent'] != undefined ? editFormErrors['parent'] : ''">
<help-button
:title="$i18n.getHelperTitle('collections', 'parent')"
:message="$i18n.getHelperMessage('collections', 'parent')"/>
<b-select
id="tainacan-select-parent"
v-model="form.parent"
@focus="clearErrors('parent')"
:loading="isFetchingCollections"
:placeholder="$i18n.get('instruction_select_a_parent_collection')">
<option value="0">{{ $i18n.get('label_no_parent_collection') }}</option>
<option
v-for="collection of collections"
:key="collection.id"
:value="collection.id">{{ collection.name }}
</option>
</b-select>
</b-field>
</div> </div>
</div> </div>
@ -329,8 +353,9 @@ export default {
headerPlaceholderPath: tainacan_plugin.base_url + '/admin/images/placeholder_rectangle.png', headerPlaceholderPath: tainacan_plugin.base_url + '/admin/images/placeholder_rectangle.png',
isFetchingModerators: false, isFetchingModerators: false,
users: [], users: [],
moderators: Array, moderators: [],
newModerator: '' collections: [],
isFetchingCollections: true
} }
}, },
methods: { methods: {
@ -343,7 +368,8 @@ export default {
'updateHeaderImage', 'updateHeaderImage',
'fetchPages', 'fetchPages',
'fetchPage', 'fetchPage',
'fetchUsers' 'fetchUsers',
'fetchCollectionsForParent'
]), ]),
...mapActions('fields', [ ...mapActions('fields', [
'fetchFields' 'fetchFields'
@ -363,7 +389,8 @@ export default {
cover_page_id: this.form.cover_page_id, cover_page_id: this.form.cover_page_id,
slug: this.form.slug, slug: this.form.slug,
status: this.form.status, status: this.form.status,
moderators_ids: this.form.moderators_ids moderators_ids: this.form.moderators_ids,
parent: this.form.parent
}; };
this.updateCollection(data).then(updatedCollection => { this.updateCollection(data).then(updatedCollection => {
@ -424,11 +451,24 @@ export default {
this.form.enable_cover_page = this.collection.enable_cover_page; this.form.enable_cover_page = this.collection.enable_cover_page;
this.form.cover_page_id = this.collection.cover_page_id; this.form.cover_page_id = this.collection.cover_page_id;
this.form.slug = this.collection.slug; this.form.slug = this.collection.slug;
this.form.parent = this.collection.parent;
this.moderators = []; this.moderators = [];
// Pre-fill status with publish to incentivate it // Pre-fill status with publish to incentivate it
this.form.status = 'publish'; this.form.status = 'publish';
// Generates options for parent collection
this.isFetchingCollections = true;
this.fetchCollectionsForParent()
.then((collections) => {
this.collections = collections;
this.isFetchingCollections = false;
})
.catch((error) => {
this.$console.error(error);
this.isFetchingCollections = false;
});
this.isLoading = false; this.isLoading = false;
}) })
@ -587,6 +627,8 @@ export default {
this.form.status = this.collection.status; this.form.status = this.collection.status;
this.form.enable_cover_page = this.collection.enable_cover_page; this.form.enable_cover_page = this.collection.enable_cover_page;
this.form.cover_page_id = this.collection.cover_page_id; this.form.cover_page_id = this.collection.cover_page_id;
this.form.parent = this.collection.parent;
this.moderators = JSON.parse(JSON.stringify(this.collection.moderators)); this.moderators = JSON.parse(JSON.stringify(this.collection.moderators));
// Generates CoverPage from current cover_page_id info // Generates CoverPage from current cover_page_id info
@ -607,6 +649,18 @@ export default {
}); });
} }
// Generates options for parent collection
this.isFetchingCollections = true;
this.fetchCollectionsForParent()
.then((collections) => {
this.collections = collections;
this.isFetchingCollections = false;
})
.catch((error) => {
this.$console.error(error);
this.isFetchingCollections = false;
});
this.isLoading = false; this.isLoading = false;
}); });
} }
@ -621,7 +675,8 @@ export default {
.thumbnail-field { .thumbnail-field {
max-height: 128px; max-height: 128px;
margin-bottom: 40px; margin-bottom: 96px;
margin-top: -20px;
.content { .content {
padding: 10px; padding: 10px;
@ -692,6 +747,10 @@ export default {
margin-right: 5px; margin-right: 5px;
} }
} }
.moderators-empty-list {
color: gray;
font-size: 0.85rem;
}
</style> </style>

View File

@ -91,6 +91,8 @@ return [
'label_thumbnail' => __( 'Thumbnail', 'tainacan' ), 'label_thumbnail' => __( 'Thumbnail', 'tainacan' ),
'label_empty_thumbnail' => __( 'Empty Thumbnail', 'tainacan' ), 'label_empty_thumbnail' => __( 'Empty Thumbnail', 'tainacan' ),
'label_moderators' => __( 'Moderators', 'tainacan' ), 'label_moderators' => __( 'Moderators', 'tainacan' ),
'label_parent_collection' => __( 'Parent collection', 'tainacan' ),
'label_no_parent_collection' => __( 'No parent collection', 'tainacan' ),
'label_button_view' => __( 'Button View', 'tainacan' ), 'label_button_view' => __( 'Button View', 'tainacan' ),
'label_button_edit' => __( 'Button Edit', 'tainacan' ), 'label_button_edit' => __( 'Button Edit', 'tainacan' ),
'label_button_delete' => __( 'Button Delete', 'tainacan' ), 'label_button_delete' => __( 'Button Delete', 'tainacan' ),
@ -165,6 +167,7 @@ return [
'instruction_select_a_parent_term' => __( 'Select a parent term:', 'tainacan' ), 'instruction_select_a_parent_term' => __( 'Select a parent term:', 'tainacan' ),
'instruction_cover_page' => __( 'Type to search a Page to choose.', 'tainacan'), 'instruction_cover_page' => __( 'Type to search a Page to choose.', 'tainacan'),
'instruction_moderators' => __( 'Type to search a User to add.', 'tainacan'), 'instruction_moderators' => __( 'Type to search a User to add.', 'tainacan'),
'instruction_select_a_parent_collection' => __( 'Select a parent colection.', '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' ),

View File

@ -103,7 +103,7 @@ export const deleteCollection = ({ commit }, id) => {
}); });
} }
export const updateCollection = ({ commit }, { collection_id, name, description, slug, status, enable_cover_page, cover_page_id, moderators_ids }) => { export const updateCollection = ({ commit }, { collection_id, name, description, slug, status, enable_cover_page, cover_page_id, moderators_ids, parent }) => {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
axios.tainacan.patch('/collections/' + collection_id, { axios.tainacan.patch('/collections/' + collection_id, {
name: name, name: name,
@ -112,7 +112,8 @@ export const updateCollection = ({ commit }, { collection_id, name, description,
slug: slug, slug: slug,
cover_page_id: "" + cover_page_id, cover_page_id: "" + cover_page_id,
enable_cover_page: enable_cover_page, enable_cover_page: enable_cover_page,
moderators_ids: moderators_ids moderators_ids: moderators_ids,
parent: parent
}).then( res => { }).then( res => {
commit('setCollection', { commit('setCollection', {
id: collection_id, id: collection_id,
@ -122,7 +123,8 @@ export const updateCollection = ({ commit }, { collection_id, name, description,
status: status, status: status,
enable_cover_page: enable_cover_page, enable_cover_page: enable_cover_page,
cover_page_id: cover_page_id, cover_page_id: cover_page_id,
moderators_ids: moderators_ids moderators_ids: moderators_ids.name,
parent: parent
}); });
resolve( res.data ); resolve( res.data );
}).catch( error => { }).catch( error => {
@ -265,3 +267,17 @@ export const fetchUsers = ({ commit }, { search, exceptions }) => {
}); });
}); });
}; };
// Fetch Collections for choosing Parent Collection
export const fetchCollectionsForParent = ({ commit }) => {
return new Promise((resolve, reject) =>{
axios.tainacan.get('/collections/')
.then(res => {
let collections = res.data;
resolve( collections );
})
.catch(error => {
reject(error);
})
});
}