Skip to content

Instantly share code, notes, and snippets.

@hissy hissy/view.php
Created Jun 10, 2019

Embed
What would you like to do?
#concrete5 An example of the custom template that rendered by Vue.js
<?php
// application/blocks/topic_list/templates/your_template_name.php
use Concrete\Core\Tree\Node\Node;
use Concrete\Core\Tree\Node\Type\Category;
use Concrete\Core\Tree\Type\Topic;
defined('C5_EXECUTE') or die("Access Denied.");
$json = [];
if (!isset($selectedTopicID)) {
$selectedTopicID = null;
}
/** @var Topic $tree */
if ($mode == 'S' && is_object($tree)) {
/** @var Node $node */
$node = $tree->getRootTreeNodeObject();
$node->populateChildren();
if (is_object($node)) {
$topics = $node->getChildNodes();
}
}
if (isset($topics) && is_array($topics) && count($topics) > 0) {
foreach ($topics as $topic) {
if (!$topic instanceof Category) {
$data = new stdClass();
$data->name = $topic->getTreeNodeDisplayName();
$data->link = (string) $view->controller->getTopicLink($topic);
if ($selectedTopicID == $topic->getTreeNodeID()) {
$data->selected = true;
} else {
$data->selected = false;
}
$json[] = $data;
}
}
}
?>
<div class="ccm-block-topic-list-wrapper">
<div class="ccm-block-topic-list-header">
<h5><?php echo h($title); ?></h5>
</div>
<div id="<?= $controller->getIdentifier(); ?>">
<ul>
<li v-for="node in nodes">
<a :href="node.link">{{ node.name }}</a>
</li>
</ul>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.10/dist/vue.js"></script>
<script>
new Vue({
el: '#<?= $controller->getIdentifier(); ?>',
data: {
nodes: <?= json_encode($json); ?>
}
})
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.