Changes format to view_mode query. Puts dynamic loading component on ItemsPage. Separates ItemsList in a comonent for Admin and another for theme.
This commit is contained in:
parent
2b1acfcd3f
commit
79c006c119
|
@ -53,7 +53,6 @@
|
|||
}"
|
||||
v-html="event.user_name" />
|
||||
</td>
|
||||
<<<<<<< HEAD
|
||||
<!-- Event Date -->
|
||||
<td
|
||||
class="table-creation column-small-width"
|
||||
|
@ -68,8 +67,6 @@
|
|||
}"
|
||||
v-html="event.log_date" />
|
||||
</td>
|
||||
=======
|
||||
>>>>>>> Initiated items page in repository
|
||||
<!-- Status -->
|
||||
<!--<td-->
|
||||
<!--@click="goToEventPage(event.id)"-->
|
||||
|
@ -135,17 +132,10 @@
|
|||
events: Array
|
||||
},
|
||||
methods: {
|
||||
<<<<<<< HEAD
|
||||
// ...mapActions('event', [
|
||||
// 'approve',
|
||||
// 'notApprove'
|
||||
// ]),
|
||||
=======
|
||||
...mapActions('event', [
|
||||
'approve',
|
||||
'notApprove'
|
||||
]),
|
||||
>>>>>>> Initiated items page in repository
|
||||
// approveEvent(eventId){
|
||||
// this.approve(eventId);
|
||||
// },
|
||||
|
|
|
@ -29,6 +29,7 @@ import FilterCategorySelectbox from '../../classes/filter-types/category/Selectb
|
|||
import TaincanFormItem from '../../classes/field-types/tainacan-form-item.vue';
|
||||
import TaincanFiltersList from '../../classes/filter-types/tainacan-filter-item.vue';
|
||||
import ItemsPage from '../pages/lists/items-page.vue';
|
||||
import TableViewMode from '../../theme-helper/table-view-mode.vue';
|
||||
|
||||
// Remaining imports
|
||||
import HelpButton from '../components/other/help-button.vue';
|
||||
|
@ -76,6 +77,8 @@ Vue.component('help-button', HelpButton);
|
|||
Vue.component('draggable', draggable);
|
||||
Vue.component('items-page', ItemsPage);
|
||||
|
||||
Vue.component('table-view-mode', TableViewMode);
|
||||
|
||||
Vue.use(eventBusSearch, { store: store, router: routerTheme});
|
||||
|
||||
import ThemeItemsList from '../theme-items-list.vue';
|
||||
|
|
|
@ -255,23 +255,37 @@
|
|||
|
||||
<!-- Admin Table -->
|
||||
<items-list
|
||||
v-if="(viewMode == 'table' || viewMode == undefined || viewMode == '') && !isLoadingItems && totalItems > 0"
|
||||
v-if="!isOnTheme &&
|
||||
!isLoadingItems &&
|
||||
totalItems > 0"
|
||||
:collection-id="collectionId"
|
||||
:table-fields="tableFields"
|
||||
:items="items"
|
||||
:is-loading="isLoading"
|
||||
:is-on-theme="isOnTheme"/>
|
||||
|
||||
|
||||
:is-loading="isLoadingItems"
|
||||
:is-on-theme="isOnTheme"
|
||||
:is-on-trash="status == 'trash'"/>
|
||||
|
||||
<!-- Theme View Modes -->
|
||||
<div
|
||||
v-if="viewMode != 'table' && viewMode != undefined && viewMode != ''"
|
||||
v-if="isOnTheme &&
|
||||
!isLoadingItems &&
|
||||
registeredViewModes[viewMode] != undefined &&
|
||||
registeredViewModes[viewMode].type == 'template'"
|
||||
v-html="itemsListTemplate"/>
|
||||
<component
|
||||
v-if="isOnTheme &&
|
||||
!isLoadingItems &&
|
||||
registeredViewModes[viewMode] != undefined &&
|
||||
registeredViewModes[viewMode].type == 'component'"
|
||||
:collection-id="collectionId"
|
||||
:table-fields="tableFields"
|
||||
:items="items"
|
||||
:is-loading="isLoadingItems"
|
||||
:is="'table-view-mode'"/>
|
||||
|
||||
<!-- Empty Placeholder (only used in Admin) -->
|
||||
<section
|
||||
v-if="(viewMode == 'table' || viewMode == undefined || viewMode == '') && !isLoadingItems && totalItems <= 0"
|
||||
v-if="!isOnTheme && !isLoadingItems && totalItems <= 0"
|
||||
class="section">
|
||||
<div class="content has-text-grey has-text-centered">
|
||||
<p>
|
||||
|
@ -308,9 +322,6 @@
|
|||
import Pagination from '../../components/search/pagination.vue'
|
||||
import { mapActions, mapGetters } from 'vuex';
|
||||
|
||||
// import TainacanCardsList from '../../components/item-view-modes/tainacan-cards-list.vue';
|
||||
// import TainacanListList from '../../components/item-view-modes/tainacan-list-list.vue';
|
||||
|
||||
export default {
|
||||
name: 'ItemsPage',
|
||||
data() {
|
||||
|
@ -327,7 +338,8 @@
|
|||
isOnTheme: false,
|
||||
futureSearchQuery: '',
|
||||
isHeaderShrinked: false,
|
||||
localTableFields: []
|
||||
localTableFields: [],
|
||||
registeredViewModes: tainacan_plugin.registered_view_modes
|
||||
}
|
||||
},
|
||||
props: {
|
||||
|
|
|
@ -220,23 +220,30 @@ class REST_Items_Controller extends REST_Controller {
|
|||
|
||||
$response = [];
|
||||
|
||||
if ( isset($request['view_mode_template']) ) {
|
||||
$return_template = false;
|
||||
|
||||
if ( isset($request['view_mode']) ) {
|
||||
|
||||
// TODO: Check if requested view mode is really enabled for current collection
|
||||
$view_mode = \Tainacan\Theme_Helper::get_instance()->get_view_mode($request['view_mode_template']);
|
||||
|
||||
if ( $view_mode && isset($view_mode['template']) && file_exists($view_mode['template']) ) {
|
||||
|
||||
ob_start();
|
||||
|
||||
global $wp_query;
|
||||
$wp_query = $items;
|
||||
$displayed_metadata = array_map(function($el) { return (int) $el; }, $request['fetch_only']['meta']);
|
||||
include $view_mode['template'];
|
||||
|
||||
$response = ob_get_clean();
|
||||
}
|
||||
$view_mode = \Tainacan\Theme_Helper::get_instance()->get_view_mode($request['view_mode']);
|
||||
|
||||
if ($view_mode && $view_mode['type'] == 'template' && isset($view_mode['template']) && file_exists($view_mode['template'])) {
|
||||
$return_template = true;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
if ( $return_template ) {
|
||||
|
||||
ob_start();
|
||||
|
||||
global $wp_query;
|
||||
$wp_query = $items;
|
||||
$displayed_metadata = array_map(function($el) { return (int) $el; }, $request['fetch_only']['meta']);
|
||||
include $view_mode['template'];
|
||||
|
||||
$response = ob_get_clean();
|
||||
|
||||
} else {
|
||||
|
||||
if ($items->have_posts()) {
|
||||
|
|
|
@ -126,7 +126,10 @@ export default {
|
|||
this.$emit( 'hasToPrepareFieldsAndFilters', to);
|
||||
else {
|
||||
this.$emit( 'isLoadingItems', true);
|
||||
this.$store.dispatch('collection/fetchItems', { 'collectionId': this.collectionId, 'isOnTheme': (this.$route.name == null) })
|
||||
this.$store.dispatch('collection/fetchItems',
|
||||
{ 'collectionId': this.collectionId,
|
||||
'isOnTheme': (this.$route.name == null)
|
||||
})
|
||||
.then((res) => {
|
||||
this.$emit( 'isLoadingItems', false);
|
||||
this.$emit( 'hasFiltered', res.hasFiltered);
|
||||
|
|
|
@ -24,17 +24,18 @@ export const fetchItems = ({ rootGetters, dispatch, commit }, { collectionId, is
|
|||
|
||||
axios.tainacan.get(endpoint + qs.stringify(postQueries) )
|
||||
.then(res => {
|
||||
|
||||
let items = res.data;
|
||||
|
||||
if (postQueries['format'] != 'table' && postQueries['format'] != undefined && postQueries['format'] != '') {
|
||||
let viewModeObject = tainacan_plugin.registered_view_modes[postQueries.view_mode];
|
||||
|
||||
if (isOnTheme && viewModeObject != undefined && viewModeObject.type == 'template') {
|
||||
commit('setItemsListTemplate', items );
|
||||
dispatch('search/setTotalItems', res.headers['x-wp-total'], { root: true } );
|
||||
resolve({'itemsListTemplate': items, 'total': res.headers['x-wp-total'], hasFiltered: hasFiltered});
|
||||
} else {
|
||||
commit('setItems', items );
|
||||
dispatch('search/setTotalItems', res.headers['x-wp-total'], { root: true } );
|
||||
resolve({'items': items, 'total': res.headers['x-wp-total'], hasFiltered: hasFiltered});
|
||||
}
|
||||
dispatch('search/setTotalItems', res.headers['x-wp-total'], { root: true } );
|
||||
})
|
||||
.catch(error => reject(error));
|
||||
});
|
||||
|
|
|
@ -97,7 +97,7 @@ export const setSearchQuery = ({ commit }, searchQuery ) => {
|
|||
commit('setSearchQuery', searchQuery );
|
||||
};
|
||||
|
||||
// Set ViewMode (format)
|
||||
// Set ViewMode (view_mode)
|
||||
export const setViewMode = ({ commit }, viewMode ) => {
|
||||
commit('setViewMode', viewMode );
|
||||
};
|
|
@ -45,7 +45,7 @@ export const getStatus = state => {
|
|||
}
|
||||
|
||||
export const getViewMode = state => {
|
||||
return state.postquery.format;
|
||||
return state.postquery.view_mode;
|
||||
}
|
||||
|
||||
export const getFetchOnly = state => {
|
||||
|
|
|
@ -19,7 +19,7 @@ const state = {
|
|||
'1': 'creation_date',
|
||||
'2': 'author_name'
|
||||
},
|
||||
format: 'table'
|
||||
view_mode: 'table'
|
||||
},
|
||||
totalItems: 0
|
||||
};
|
||||
|
|
|
@ -115,5 +115,5 @@ export const setStatus = ( state, status ) => {
|
|||
};
|
||||
|
||||
export const setViewMode = ( state, viewMode ) => {
|
||||
state.postquery.format = viewMode;
|
||||
state.postquery.view_mode = viewMode;
|
||||
};
|
|
@ -48,6 +48,13 @@ class Theme_Helper {
|
|||
add_filter('get_the_archive_title', array($this, 'filter_archive_title'));
|
||||
|
||||
add_shortcode( 'tainacan-search', array($this, 'search_shortcode'));
|
||||
|
||||
$this->register_view_mode('table', [
|
||||
'label' => __('Table', 'tainacan'),
|
||||
'dynamic_metadata' => true,
|
||||
'icon' => '<span class="icon"><i class="mdi mdi-table mdi-24px"></i></span>',
|
||||
'type' => 'component',
|
||||
]);
|
||||
|
||||
}
|
||||
|
||||
|
|
|
@ -1,8 +1,7 @@
|
|||
<template>
|
||||
<div class="table-container">
|
||||
<div class="table-wrapper">
|
||||
<table
|
||||
class="tainacan-table">
|
||||
<table class="tainacan-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<!-- Displayed Fields -->
|
||||
|
@ -82,7 +81,6 @@
|
|||
</p>
|
||||
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
@ -91,14 +89,14 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
name: 'ItemsList',
|
||||
name: 'TableViewMode',
|
||||
props: {
|
||||
collectionId: Number,
|
||||
tableFields: Array,
|
||||
items: Array,
|
||||
isLoading: false,
|
||||
isOnTrash: false
|
||||
isLoading: false
|
||||
},
|
||||
methods: {
|
||||
goToItemPage(item) {
|
|
@ -188,5 +188,5 @@ function tainacan_get_term() {
|
|||
* @see \Tainacan\Theme_Helper->register_view_mode()
|
||||
*/
|
||||
function tainacan_register_view_mode($slug, $args = []) {
|
||||
\Tainacan\Theme_Helper::get_instance()->register_view_mode($slug, $args = []);
|
||||
\Tainacan\Theme_Helper::get_instance()->register_view_mode($slug, $args);
|
||||
}
|
Loading…
Reference in New Issue