File Manager
Viewing File: template-vue.php
<?php
/**
* Vue template.
*
* @package documentor
*/
if (!defined('ABSPATH')) exit;
$documentor_hubs = get_terms(['taxonomy' => 'docs_hub', 'hide_empty' => false]);
// Create Map: Doc ID -> Hub IDs
$documentor_doc_hub_map = [];
// Create Map: Doc ID -> List of Category IDs
$documentor_doc_cat_map = [];
$documentor_all_docs = get_posts(['post_type' => 'docs', 'numberposts' => -1, 'fields' => 'ids']);
if(!empty($documentor_all_docs)){
foreach($documentor_all_docs as $documentor_id){
$documentor_terms = get_the_terms($documentor_id, 'docs_hub');
if($documentor_terms && !is_wp_error($documentor_terms)){
// Extract just the Term IDs
$documentor_hub_ids = wp_list_pluck($documentor_terms, 'term_id');
$documentor_doc_hub_map[$documentor_id] = $documentor_hub_ids;
}
$documentor_cats = get_the_terms($documentor_id, 'docs_category');
if($documentor_cats && !(is_wp_error($documentor_cats))){
$documentor_doc_cat_map[$documentor_id] = wp_list_pluck($documentor_cats, 'term_id');
}
}
}
$documentor_hub_data = [
'catHubMap' => $documentor_cat_hub_map,
'docHubMap' => $documentor_doc_hub_map,
'docCatMap' => $documentor_doc_cat_map
];
wp_localize_script('documentor-admin-custom', 'doucumentorHubData', $documentor_hub_data);
?>
<div class="wrap" id="documentor-app">
<div style="display:flex; justify-content:space-between; align-items:center;">
<h1>
<?php
echo esc_html__( 'Documentations', 'documentor' );
?>
<a class="page-title-action" href="#" v-on:click.prevent="addDoc">
<?php echo esc_html__( 'Add Doc', 'documentor' ); ?>
</a>
</h1>
<div>
<a href="<?php echo admin_url('edit.php?post_type=docs');?>">
<?php echo esc_html__('List View', 'documentor'); ?>
</a>
</div>
</div>
<hr class="wp-header-end">
<!-- <pre>{{ $data | json }}</pre> -->
<!-- Generates the row of Hub filter buttons, embedding the 'data-hub-id' to track the active tab -->
<?php
if (!empty($documentor_hubs) && !is_wp_error($documentor_hubs)) : ?>
<ul class="nav nav-tabs documentor-hub-filters">
<li class="nav-item hub-filter-btn">
<a href="<?php echo admin_url('?page=documentor'); ?>" class=" nav-link active" aria-current="page" data-hub-id="default" data-hub-slug="default"><?php echo esc_html_e('Default', 'documentor'); ?></a>
</li>
<?php foreach ($documentor_hubs as $documentor_hub) : ?>
<li class="nav-item hub-filter-btn">
<a href="<?php echo admin_url('?page=documentor'); ?>" class=" nav-link" aria-current="page" data-hub-id="<?php echo esc_attr($documentor_hub->term_id); ?>" data-hub-slug="<?php echo esc_attr($documentor_hub->slug); ?>"><?php echo esc_html($documentor_hub->name); ?></a>
</li>
<?php endforeach; ?>
</ul>
<?php endif; ?>
<span class="spinner is-active" style="float: none;"></span>
<div class="documentor not-loaded">
<div class="documentor-cat" v-for="(cat, index) in filteredCategorized" :data-id="(cat.docs.length > 0) ? cat.docs[0].post.cat_id : ''">
<h3 v-if="cat.name">{{ cat.name }}</h3>
<ul v-sortable>
<li class="documentor-item" v-for="(doc, index) in cat.docs" :data-id="doc.post.id">
<h3>
<img v-if="doc.post.thumb" :src="doc.post.thumb" :alt="doc.post.title" width="20" height="20">
<a v-if="doc.post.caps.edit" target="_blank" :href="editurl + doc.post.id">{{ doc.post.title }}<span v-if="doc.post.status != 'publish'" class="doc-status">{{ doc.post.status }}</span></a>
<span v-else>{{ doc.post.title }}<span v-if="doc.post.status != 'publish'" class="doc-status">{{ doc.post.status }}</span></span>
<span class="documentor-row-actions">
<a target="_blank" :href="viewurl + doc.post.id" title="<?php esc_attr_e( 'Preview the doc', 'documentor' ); ?>"><span class="dashicons dashicons-external"></span></a>
<span v-if="doc.post.caps.delete" class="documentor-btn-remove" v-on:click="removeDoc(index, cat.docs)" title="<?php esc_attr_e( 'Delete this doc', 'documentor' ); ?>"><span class="dashicons dashicons-trash"></span></span>
</span>
</h3>
<div class="documentor-item-inner">
<ul class="sections" v-sortable>
<li v-for="(section, index) in doc.child" :data-id="section.post.id">
<span class="section-title" v-on:click="toggleCollapse">
<a v-if="section.post.caps.edit" target="_blank" :href="editurl + section.post.id">{{ section.post.title }}<span v-if="section.post.status != 'publish'" class="doc-status">{{ section.post.status }}</span> <span v-if="section.child.length > 0" class="count">{{ section.child.length }}</span></a>
<span v-else>{{ section.post.title }}<span v-if="section.post.status != 'publish'" class="doc-status">{{ section.post.status }}</span> <span v-if="section.child.length > 0" class="count">{{ section.child.length }}</span></span>
<span class="actions documentor-row-actions">
<a target="_blank" :href="viewurl + section.post.id" title="<?php esc_attr_e( 'Preview the section', 'documentor' ); ?>"><span class="dashicons dashicons-external"></span></a>
<span class="documentor-btn-remove" v-if="section.post.caps.delete" v-on:click="removeSection(index, doc.child)" title="<?php esc_attr_e( 'Delete this section', 'documentor' ); ?>"><span class="dashicons dashicons-trash"></span></span>
<span class="add-article" v-on:click="addArticle(section,$event)" title="<?php esc_attr_e( 'Add a new article', 'documentor' ); ?>"><span class="dashicons dashicons-plus-alt"></span></span>
</span>
</span>
<ul class="articles collapsed connectedSortable" v-if="section.child" v-sortable>
<li class="article" v-for="(article, index) in section.child" :data-id="article.post.id">
<a v-if="article.post.caps.edit" target="_blank" :href="editurl + article.post.id">{{ article.post.title }}<span v-if="article.post.status != 'publish'" class="doc-status">{{ article.post.status }}</span> <span v-if="article.child.length > 0" class="count">{{ article.child.length }}</span></a>
<span v-else>{{ article.post.title }}</span>
<span class="actions documentor-row-actions">
<a target="_blank" :href="viewurl + article.post.id" title="<?php esc_attr_e( 'Preview the article', 'documentor' ); ?>"><span class="dashicons dashicons-external"></span></a>
<span class="documentor-btn-remove" v-if="article.post.caps.delete" v-on:click="removeArticle(index, section.child)" title="<?php esc_attr_e( 'Delete this article', 'documentor' ); ?>"><span class="dashicons dashicons-trash"></span></span>
<span class="add-article" v-on:click="addArticle(article, $event)" title="<?php esc_attr_e( 'Add a new article', 'documentor' ); ?>"><span class="dashicons dashicons-plus-alt"></span></span>
</span>
<ul class="articles connectedSortable" v-if="article.child" v-sortable>
<li class="article" v-for="(article_child, index) in article.child" :data-id="article_child.post.id">
<a v-if="article_child.post.caps.edit" target="_blank" :href="editurl + article_child.post.id">{{ article_child.post.title }}<span v-if="article_child.post.status != 'publish'" class="doc-status">{{ article_child.post.status }}</span></a>
<span v-else>{{ article_child.post.title }}</span>
<span class="actions documentor-row-actions">
<a target="_blank" :href="viewurl + article_child.post.id" title="<?php esc_attr_e( 'Preview the article', 'documentor' ); ?>"><span class="dashicons dashicons-external"></span></a>
<span class="documentor-btn-remove" v-if="article_child.post.caps.delete" v-on:click="removeArticle(index, article.child)" title="<?php esc_attr_e( 'Delete this article', 'documentor' ); ?>"><span class="dashicons dashicons-trash"></span></span>
</span>
</li>
</ul>
</li>
</ul>
</li>
</ul>
<a class="documentor-add-section-btn" href="#" v-on:click.prevent="addSection(doc)"><span class="dashicons dashicons-plus"></span></a>
</div>
<div class="documentor-actions">
<a class="button" href="#" v-on:click.prevent="cloneDoc(doc)"><?php echo esc_html__( 'Clone', 'documentor' ); ?></a>
<a class="button" href="#" v-on:click.prevent="exportDoc(doc)"><?php echo esc_html__( 'Export as HTML', 'documentor' ); ?></a>
</div>
</li>
</ul>
<div class="no-documentor dashicons dashicons-portfolio not-loaded" v-show="!Object.values(filteredCategorized).some(item => item.docs && item.docs.length)">
<?php
// translators: %s - link.
printf( esc_html__( 'No documentations has been found. Perhaps %s?', 'documentor' ), '<a href="#" v-on:click.prevent="addDoc">' . esc_html__( 'create one', 'documentor' ) . '</a>' );
?>
</div>
</div>
</div>
</div>