openvk/Web/Presenters/templates/Group/Statistics.xml

57 lines
1.9 KiB
XML

{extends "../@layout.xml"}
{block title}{$club->getName()} » {_statistics}{/block}
{block header}
<a href="{$club->getURL()}">{$club->getName()}</a> » {_statistics}
{/block}
{block content}
<div class="tabs">
<div class="tab">
<a href="/club{$club->getId()}/edit">
{_main}
</a>
</div>
<div class="tab">
<a href="/club{$club->getId()}/followers">
{_followers}
</a>
</div>
<div id="activetabs" class="tab">
<a id="act_tab_a" href="javascript:void(0)">
{_statistics}
</a>
</div>
</div>
<div class="container_gray">
<h4>Охват</h4>
<p>Этот график отображает охват за последние 7 дней.</p>
<div id="reachChart" style="width: 100%; height: 280px;"></div>
<h4>Просмотры</h4>
<p>Этот график отображает просмотры постов сообщества за последние 7 дней.</p>
<div id="viewsChart" style="width: 100%; height: 280px;"></div>
<style>
.modebar-container {
display: none !important;
}
</style>
{script "js/node_modules/plotly.js-dist/plotly.js"}
<script>
function makePlot(selector, datum) {
Plotly.newPlot(document.querySelector(selector), [datum.total, datum.subs, datum.viral], {
margin: { t: 0 },
layout: { showlegend: true, legend: { xanchor: 'center', x: 0.5, orientation: 'h' } }
});
}
let reach = {$reach};
let views = {$views};
makePlot("#reachChart", reach);
makePlot("#viewsChart", views);
</script>
</div>
{/block}