Merge branch 'develop' of https://github.com/tainacan/tainacan into develop
This commit is contained in:
weryques
commit
4c5491dc5f
|
|
@ -25,12 +25,12 @@
|
|||
</a>
|
||||
<figure class="image is-128x128">
|
||||
<span
|
||||
v-if="collection.thumbnail == undefined || collection.thumbnail == false"
|
||||
v-if="collection.thumbnail.thumb == undefined || collection.thumbnail.thumb == false"
|
||||
class="image-placeholder">{{ $i18n.get('label_empty_thumbnail') }}</span>
|
||||
<img
|
||||
id="thumbail-image"
|
||||
:alt="$i18n.get('label_thumbnail')"
|
||||
:src="(collection.thumbnail == undefined || collection.thumbnail == false) ? thumbPlaceholderPath : collection.thumbnail.thumb">
|
||||
:src="(collection.thumbnail.thumb == undefined || collection.thumbnail.thumb == false) ? thumbPlaceholderPath : collection.thumbnail.thumb">
|
||||
</figure>
|
||||
<div class="thumbnail-buttons-row">
|
||||
<a
|
||||
|
|
|
|||
|
|
@ -235,7 +235,7 @@
|
|||
<b-icon icon="pencil" />
|
||||
</a>
|
||||
<file-item
|
||||
v-if="item.thumbnail != undefined && item.thumbnail != false"
|
||||
v-if="item.thumbnail.thumb != undefined && item.thumbnail.thumb != false"
|
||||
:show-name="false"
|
||||
:file="{
|
||||
media_type: 'image',
|
||||
|
|
@ -243,7 +243,7 @@
|
|||
title: { rendered: $i18n.get('label_thumbnail')},
|
||||
description: { rendered: `<img alt='Thumbnail' src='` + item.thumbnail.full + `'/>` }}"/>
|
||||
<figure
|
||||
v-if="item.thumbnail == undefined || item.thumbnail == false"
|
||||
v-if="item.thumbnail.thumb == undefined || item.thumbnail.thumb == false"
|
||||
class="image">
|
||||
<span class="image-placeholder">{{ $i18n.get('label_empty_thumbnail') }}</span>
|
||||
<img
|
||||
|
|
|
|||
|
|
@ -1,5 +1,7 @@
|
|||
<template>
|
||||
<div class="table-container">
|
||||
<div
|
||||
v-if="totalCollections > 0 && !isLoading"
|
||||
class="table-container">
|
||||
<div class="selection-control">
|
||||
<div class="field select-all is-pulled-left">
|
||||
<span>
|
||||
|
|
@ -11,7 +13,7 @@
|
|||
<div class="field is-pulled-right">
|
||||
<b-dropdown
|
||||
position="is-bottom-left"
|
||||
v-if="collections.length > 0 && collections[0].current_user_can_edit"
|
||||
v-if="collections[0].current_user_can_edit"
|
||||
:disabled="!isSelectingCollections"
|
||||
id="bulk-actions-dropdown">
|
||||
<button
|
||||
|
|
@ -139,28 +141,6 @@
|
|||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- Empty state image -->
|
||||
<div v-if="!totalCollections || totalCollections <= 0">
|
||||
<section class="section">
|
||||
<div class="content has-text-grey has-text-centered">
|
||||
<p>
|
||||
<b-icon
|
||||
icon="inbox"
|
||||
size="is-large"/>
|
||||
</p>
|
||||
<p>{{ $i18n.get('info_no_collection_created') }}</p>
|
||||
<router-link
|
||||
id="button-create-collection"
|
||||
tag="button"
|
||||
class="button is-primary"
|
||||
:to="{ path: $routerHelper.getNewCollectionPath() }">
|
||||
{{ $i18n.getFrom('collections', 'new_item') }}
|
||||
</router-link>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
@ -320,7 +300,6 @@ export default {
|
|||
// thElm = undefined;
|
||||
// });
|
||||
// })();
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -331,7 +310,7 @@ export default {
|
|||
|
||||
.selection-control {
|
||||
|
||||
padding: 6px 0px 0px 18px;
|
||||
padding: 6px 0px 0px 13px;
|
||||
background: white;
|
||||
height: 40px;
|
||||
|
||||
|
|
@ -371,7 +350,6 @@ export default {
|
|||
position: -webkit-sticky !important;
|
||||
left: 0;
|
||||
top: auto;
|
||||
visibility: hidden;
|
||||
display: table-cell;
|
||||
|
||||
&::before {
|
||||
|
|
@ -382,6 +360,7 @@ export default {
|
|||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
label.checkbox {
|
||||
|
|
@ -392,13 +371,14 @@ export default {
|
|||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
visibility: hidden;
|
||||
}
|
||||
label.control-label {
|
||||
label span.control-label {
|
||||
display: none;
|
||||
}
|
||||
&.is-selecting {
|
||||
visibility: visible;
|
||||
.checkbox { visibility: visible; }
|
||||
&::before { visibility: visible !important; }
|
||||
}
|
||||
}
|
||||
// Only to be used in case we can implement Column resizing
|
||||
|
|
@ -485,8 +465,11 @@ export default {
|
|||
cursor: pointer;
|
||||
|
||||
.checkbox-cell {
|
||||
&::before { visibility: visible; }
|
||||
.checkbox {
|
||||
visibility: visible;
|
||||
.checkbox { background-color: $tainacan-input-background !important; }
|
||||
background-color: $tainacan-input-background !important;
|
||||
}
|
||||
}
|
||||
.actions-cell {
|
||||
.actions-container {
|
||||
|
|
|
|||
|
|
@ -294,7 +294,7 @@ export default {
|
|||
|
||||
.selection-control {
|
||||
|
||||
padding: 6px 0px 0px 18px;
|
||||
padding: 6px 0px 0px 13px;
|
||||
background: white;
|
||||
height: 40px;
|
||||
|
||||
|
|
@ -334,7 +334,6 @@ export default {
|
|||
position: -webkit-sticky !important;
|
||||
left: 0;
|
||||
top: auto;
|
||||
visibility: hidden;
|
||||
display: table-cell;
|
||||
|
||||
&::before {
|
||||
|
|
@ -345,6 +344,7 @@ export default {
|
|||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
label.checkbox {
|
||||
|
|
@ -355,13 +355,14 @@ export default {
|
|||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
visibility: hidden;
|
||||
}
|
||||
label.control-label {
|
||||
display: none;
|
||||
}
|
||||
&.is-selecting {
|
||||
visibility: visible;
|
||||
.checkbox { visibility: visible; }
|
||||
&::before { visibility: visible !important; }
|
||||
}
|
||||
}
|
||||
// Only to be used in case we can implement Column resizing
|
||||
|
|
@ -448,8 +449,11 @@ export default {
|
|||
cursor: pointer;
|
||||
|
||||
.checkbox-cell {
|
||||
&::before { visibility: visible; }
|
||||
.checkbox {
|
||||
visibility: visible;
|
||||
.checkbox { background-color: $tainacan-input-background !important; }
|
||||
background-color: $tainacan-input-background !important;
|
||||
}
|
||||
}
|
||||
.actions-cell {
|
||||
.actions-container {
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<tainacan-title />
|
||||
<div
|
||||
class="sub-header"
|
||||
v-if="totalCollections > 0">
|
||||
v-if="checkIfUserCanEdit()">
|
||||
<div class="header-item">
|
||||
<b-dropdown id="collection-creation-options-dropdown">
|
||||
<button
|
||||
|
|
@ -30,6 +30,19 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="above-subheader">
|
||||
<div class="tabs">
|
||||
<ul>
|
||||
<li
|
||||
@click="onChangeTab('')"
|
||||
:class="{ 'is-active': status == undefined || status == ''}"><a>{{ $i18n.get('label_all_items') }}</a></li>
|
||||
<li
|
||||
@click="onChangeTab('draft')"
|
||||
:class="{ 'is-active': status == 'draft'}"><a>{{ $i18n.get('label_draft_items') }}</a></li>
|
||||
<li
|
||||
@click="onChangeTab('trash')"
|
||||
:class="{ 'is-active': status == 'trash'}"><a>{{ $i18n.get('label_trash_items') }}</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<collections-list
|
||||
:is-loading="isLoading"
|
||||
|
|
@ -37,6 +50,30 @@
|
|||
:page="page"
|
||||
:collections-per-page="collectionsPerPage"
|
||||
:collections="collections"/>
|
||||
|
||||
<!-- Empty state image -->
|
||||
<div v-if="totalCollections <= 0 && !isLoading">
|
||||
<section class="section">
|
||||
<div class="content has-text-grey has-text-centered">
|
||||
<p>
|
||||
<b-icon
|
||||
icon="inbox"
|
||||
size="is-large"/>
|
||||
</p>
|
||||
<p v-if="status == undefined || status == ''">{{ $i18n.get('info_no_collection_created') }}</p>
|
||||
<p v-if="status == 'draft'">{{ $i18n.get('info_no_collection_draft') }}</p>
|
||||
<p v-if="status == 'trash'">{{ $i18n.get('info_no_collection_trash') }}</p>
|
||||
<router-link
|
||||
v-if="status == undefined || status == ''"
|
||||
id="button-create-collection"
|
||||
tag="button"
|
||||
class="button is-primary"
|
||||
:to="{ path: $routerHelper.getNewCollectionPath() }">
|
||||
{{ $i18n.getFrom('collections', 'new_item') }}
|
||||
</router-link>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
<!-- Footer -->
|
||||
<div
|
||||
class="pagination-area"
|
||||
|
|
@ -91,7 +128,8 @@ export default {
|
|||
isLoading: false,
|
||||
totalCollections: 0,
|
||||
page: 1,
|
||||
collectionsPerPage: 12
|
||||
collectionsPerPage: 12,
|
||||
status: ''
|
||||
}
|
||||
},
|
||||
components: {
|
||||
|
|
@ -104,6 +142,17 @@ export default {
|
|||
...mapGetters('collection', [
|
||||
'getCollections'
|
||||
]),
|
||||
onChangeTab(status) {
|
||||
this.status = status;
|
||||
this.loadCollections();
|
||||
},
|
||||
checkIfUserCanEdit() {
|
||||
for (let capability of tainacan_plugin.user_caps) {
|
||||
if (capability == 'edit_tainacan-collections')
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
},
|
||||
onChangeCollectionsPerPage(value) {
|
||||
let prevValue = this.collectionsPerPage;
|
||||
this.collectionsPerPage = value;
|
||||
|
|
@ -116,8 +165,7 @@ export default {
|
|||
},
|
||||
loadCollections() {
|
||||
this.isLoading = true;
|
||||
|
||||
this.fetchCollections({ 'page': this.page, 'collectionsPerPage': this.collectionsPerPage })
|
||||
this.fetchCollections({ 'page': this.page, 'collectionsPerPage': this.collectionsPerPage, 'status': this.status })
|
||||
.then((res) => {
|
||||
this.isLoading = false;
|
||||
this.totalCollections = res.total;
|
||||
|
|
@ -137,6 +185,7 @@ export default {
|
|||
let collectionsList = this.getCollections();
|
||||
for (let collection of collectionsList)
|
||||
collection['creation'] = this.$i18n.get('info_created_by') + collection['author_name'] + '<br>' + this.$i18n.get('info_date') + collection['creation_date'];
|
||||
|
||||
return collectionsList;
|
||||
}
|
||||
},
|
||||
|
|
@ -185,7 +234,12 @@ export default {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tabs {
|
||||
padding-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
padding-left: $page-side-padding;
|
||||
padding-right: $page-side-padding;
|
||||
}
|
||||
.above-subheader {
|
||||
margin-bottom: 0;
|
||||
margin-top: 0;
|
||||
|
|
|
|||
|
|
@ -549,7 +549,12 @@ a:hover {
|
|||
overflow: auto;
|
||||
.table {
|
||||
tbody {
|
||||
td { border-bottom: 0px solid $gray-light !important; }
|
||||
td {
|
||||
border-bottom: 0px solid $gray-light !important;
|
||||
}
|
||||
.b-checkbox.checkbox .control-label {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.th-wrap {
|
||||
font-size: 12px !important;
|
||||
|
|
|
|||
|
|
@ -212,6 +212,8 @@ return [
|
|||
// Info. Other feedback to user.
|
||||
'info_name_is_required' => __( 'Name is required.', 'tainacan' ),
|
||||
'info_no_collection_created' => __( 'No collection was created in this repository.', 'tainacan' ),
|
||||
'info_no_collection_draft' => __( 'No draft collection found.', 'tainacan' ),
|
||||
'info_no_collection_trash' => __( 'No collection on trash.', 'tainacan' ),
|
||||
'info_no_category_created' => __( 'No taxonomy was created in this repository.', 'tainacan' ),
|
||||
'info_no_item_created' => __( 'No item was created in this collection.', 'tainacan' ),
|
||||
'info_no_page_found' => __( 'No page was found with this name.', 'tainacan' ),
|
||||
|
|
|
|||
|
|
@ -43,10 +43,15 @@ export const deleteItem = ({ commit }, item_id ) => {
|
|||
});
|
||||
};
|
||||
|
||||
export const fetchCollections = ({commit} , { page, collectionsPerPage }) => {
|
||||
export const fetchCollections = ({commit} , { page, collectionsPerPage, status }) => {
|
||||
commit('cleanCollections');
|
||||
return new Promise((resolve, reject) => {
|
||||
axios.tainacan.get('/collections?paged='+page+'&perpage='+collectionsPerPage+'&context=edit')
|
||||
let endpoint = '/collections?paged='+page+'&perpage='+collectionsPerPage+'&context=edit';
|
||||
|
||||
if (status != '' && status != undefined)
|
||||
endpoint = endpoint + '&status=' + status;
|
||||
|
||||
axios.tainacan.get(endpoint)
|
||||
.then(res => {
|
||||
let collections = res.data;
|
||||
commit('setCollections', collections);
|
||||
|
|
|
|||
Loading…
Reference in New Issue