Skip to content

A
addcpm-json
Commit d27cae25 authored by Александр Чаплыгин's avatar Александр Чаплыгин
Browse files
Options

Данные для суммарной статистики по кампании, отрисовка графика

parent 279c5501
Show whitespace changes
Inline Side-by-side
Showing with 331 additions and 29 deletions
src/public/css/styles-amsystem.css
View file @ d27cae25
......@@ -234,7 +234,9 @@ table.campaign-banners tbody tr td {
text-align: center;
}
textarea#campaign-stat
textarea#campaign-stat,
textarea#campaign-stat-total,
textarea#campaign-stat-cats
{
display: none;
}
......@@ -252,3 +254,63 @@ textarea#campaign-stat
{
height: 370px;
}
/*
#table-stat
*/
.b-table_wrapp.report
{
display: none;
margin-top: 30px;
}
.table.table-striped
{
font-family: monospace;
}
.table.table-striped thead.sortable tr b
{
cursor: pointer;
}
.table.table-striped thead.sortable tr b.not-sorted
{
cursor: default;
}
.table.table-striped thead.sortable tr b.selected
{
color: #2CA02C;
}
.table.table-striped thead.sortable tr span
{
display: inline-block;
border-bottom: 2px solid red;
}
.table.table-striped thead tr b .arrow
{
display: none;
}
.table.table-striped thead.sortable tr b.selected .arrow.asc,
.table.table-striped thead.sortable tr b.selected.desc .arrow.desc
{
display: inline;
}
.table.table-striped thead.sortable tr b.selected .arrow.desc,
.table.table-striped thead.sortable tr b.selected.desc .arrow.asc
{
display: none;
}
.table.table-striped tbody tr.total
{
font-weight: bold;
}
\ No newline at end of file
src/public/js/adm/amsystem-campaign.js
View file @ d27cae25
......@@ -68,14 +68,28 @@ $(document).ready(function () {
(function(){
var
dataStat,
dataStat, dataStatTotal,
$statWrap = $('.campaign-stat'),
$statInfo = $('.chart-graph-stat-info', $statWrap),
$statError = $('.chart-graph-stat-error', $statWrap),
$statChart = $('.chart-graph-stat-error', $statWrap),
$statTable = $('.chart-graph-stat-error', $statWrap),
selectorStatChart = '#chart-graph-stat',
$statChart = $(selectorStatChart, $statWrap),
$statTable = $('.b-table_wrapp.report', $statWrap),
$tableCampaignStat = $('#table-line', $statTable),
targetActionValue = $('input[name=target_action]:checked').val(),
activeLine;
chart,
activeLine,
activeLines,
currencyFields = ['money'];
// Добавление впереди 0 у однозначных значений
function pad(number) {
var r = String(number);
if ( r.length === 1 ) {
r = '0' + r;
}
return r;
}
// Форматирование даты
function formatDate(date)
......@@ -83,37 +97,177 @@ $(document).ready(function () {
return date.getFullYear() +'-'+ pad(date.getMonth()+1) +'-'+ pad(date.getDate());
}
function valueFormat(value, ratio, id)
{
var
dataLine = activeLines[parseInt(id.replace('data', '')) - 1],
isCurrencyValue = currencyFields.indexOf(dataLine) > -1,
format = (isCurrencyValue) ? d3.format(',.2f') : d3.format(',.0f');
if (dataLine == 'OrderSum') {
format = d3.format(',.0f');
}
if (parseFloat(format(value)) == 0 && value != 0) {
var accuracy = Math.abs(Math.floor(Math.log10(value)));
return value.toFixed(accuracy);
}
if (isCurrencyValue) {
return format(value) + ' грн.';
} else {
return format(value);
}
}
function valueFormatTick(value)
{
var
isCurrencyValue = currencyFields.indexOf(activeLine) > -1,
format = (isCurrencyValue) ? d3.format(',.2f') : d3.format(',.0f');
return format(value);
}
// Получение данных для отрисовки графика Stat при старте:
if ($('#campaign-stat').val()) {
if ($('#campaign-stat').val() && $('#campaign-stat-total').val()) {
dataStat = JSON.parse($('#campaign-stat').val());
console.log('AAA dataStat = ', dataStat);
dataStatTotal = JSON.parse($('#campaign-stat-total').val());
} else {
ShowError();
}
console.log('AAA dataStat = ', dataStat);
console.log('AAA dataStatTotal = ', dataStatTotal);
function ShowInfo()
{
$statInfo.show();
$statError.hide();
$statChart.hide();
$statTable.hide();
}
function ShowError()
{
$statError.show();
$statInfo.hide();
$statChart.hide();
$statTable.hide();
}
switch(targetActionValue) {
case 'load':
activeLine = 'views';
break;
case 'view':
activeLine = 'views';
break;
case 'click':
activeLine = 'clicks';
break;
function getCheckedCategories() {
var listCats = [];
$('thead th input[type="checkbox"]', $tableCampaignStat).each(function(){
if ($(this).is(":checked")) {
listCats.push($(this).data('field'));
}
});
return listCats;
}
function renderChart() {
console.log('AAA renderChart');
var
dataPeriod = dataStat['period'],
dataValue = dataStat[activeLine],
titleFormat = formatDate,
formatTimeX = '%m-%d';
rotateX = null,
formatTimeX = '%m-%d',
selectedCategoriesId;
var
dataColumnsTemp = [['x'].concat(dataPeriod)],
names = {},
types = {},
axes = {},
colors = {};
// Определяем выбранные категории для графика:
selectedCategoriesId = getCheckedCategories();
console.log('AAA renderChart selectedCategoriesId', selectedCategoriesId);
// Скрываем график, если в таблице не выбраны категории:
if (selectedCategoriesId.length == 0) {
$statChart.hide();
return false;
} else {
$statChart.show();
}
console.log('AAA activeLines = ', activeLines);
var i = 0;
Object.keys(activeLines).forEach(function(activeLineItem){
if (selectedCategoriesId.indexOf(activeLineItem) > -1) {
i++;
dataColumnsTemp.push(['data'+i].concat(dataStat[activeLineItem]));
names['data'+i] = activeLines[activeLineItem]['title'];
types['data'+i] = 'area-spline';
axes['data'+i] = 'y';
colors['data'+i] = activeLines[activeLineItem]['color'];
}
});
console.log('AAA dataColumnsTemp ', dataColumnsTemp);
chart = c3.generate({
bindto: selectorStatChart,
data: {
x: 'x',
columns: dataColumnsTemp,
names: names,
types: types,
axes: axes,
colors: colors,
},
axis: {
x: {
type: 'timeseries',
categories: dataPeriod,
padding: {left: 0},
tick: {
culling: {max: 25},
format: formatTimeX,
rotate: rotateX
}
},
y: {
min: 0,
padding: {top: 50, bottom: 0},
tick: {
format: valueFormatTick
}
}
},
grid: {
x: {show: true},
y: {show: true},
},
tooltip: {
format: {
title: formatDate,
value: valueFormat
}
},
legend: {
show: true,
item: {
onclick: function (id) {
//toggleData(chart, id);
}
}
},
});
// Подсвечиваем Определяем индексы воскресенья:
dataPeriod.forEach(function(date, ind) {
if ((new Date(date)).getUTCDay() == 0) {
$('.c3-axis.c3-axis-x .tick').eq(ind).attr('class', 'tick sunday');
}
});
//chart.toggle(toggelDates);
};
......@@ -121,14 +275,40 @@ $(document).ready(function () {
console.log('AAA renderTable');
};
switch(targetActionValue) {
case 'load':
activeLine = 'views';
break;
case 'view':
activeLine = 'views';
break;
case 'click':
activeLine = 'clicks';
break;
}
activeLines = JSON.parse($('#campaign-stat-cats').val());
if (dataStat) {
// Отрисовка графика и таблицы по стартовым данным:
if (dataStat.status == 'Error') {
ShowError();
} else {
renderChart();
renderTable();
}
} else {
ShowInfo();
$statChart.hide();
$statTable.hide();
}
// Клик на checkbox в названии поля таблицы:
var $tableHeadColsChecks = $('thead th input[type="checkbox"]', $tableCampaignStat);
$tableHeadColsChecks.on('change', function(){
renderChart();
});
})();
});
......
src/src/App/Action/User/CabinetAmSystem.php
View file @ d27cae25
......@@ -44,6 +44,16 @@ class CabinetAmSystem extends Common
const ACTION_LIST = 'list';
const ACTION_ITEM = 'item';
const CAMPAIGN_STAT_CATS = [
'views' => ['title' => 'Показы', 'color' => '#2CA02C'],
'clicks' => ['title' => 'Клики', 'color' => '#D62728'],
'money' => ['title' => 'Расход, грн.', 'color' => '#1F77B4'],
'reach' => ['title' => 'Охват', 'color' => '#FF7F0E'],
'ctr' => ['title' => 'CTR', 'color' => '#9467BD'],
'cpm' => ['title' => 'eCPM', 'color' => '#33C7B6'],
'cpc' => ['title' => 'eCPC', 'color' => '#7CADE2']
];
/**
* @param ServerRequestInterface $request
* @param ResponseInterface $response
......@@ -144,6 +154,7 @@ class CabinetAmSystem extends Common
$date_end = $campaign->getDateEnd() ? : date("Y-m-d");
$dates = [$date_begin, $date_end];
$campaign_stat = $stats->getCampaignsStat([(int)$campaign_id], $campaign->getTargetAction(), $dates);
$campaign_stat_total = $stats->getCampaignsStat([(int)$campaign_id], $campaign->getTargetAction(), null);
$active_line = 'views';
......@@ -188,6 +199,8 @@ class CabinetAmSystem extends Common
$data['banners'] = $banners;
$data['banners_stats'] = $banners_stats;
$data['campaign_stat'] = $campaign_stat;
$data['campaign_stat_total'] = $campaign_stat_total;
$data['campaign_stat_cats'] = self::CAMPAIGN_STAT_CATS;
$data['active_line'] = $active_line;
} else {
......
src/src/App/Model/Statistics.php
View file @ d27cae25
......@@ -372,7 +372,7 @@ class Statistics
if ($stats) {
// Добавляем спец. поля
function AddSpecialFields(&$stats)
$AddSpecialFields = function(&$stats)
{
if ($taget_action == 'load') {
$stats['views'] = $stats['loads'];
......@@ -393,17 +393,17 @@ class Statistics
$stats['cpc'] = ($clicks != 0) ? round(($money/$clicks)*100, 1) : 0;
$stats['money'] = round($stats['money'], 2);
}
};
if (!$dates)
{
AddSpecialFields($stats);
$AddSpecialFields($stats);
$dataStats = $stats;
}
else
{
foreach ($stats as $day => $stat) {
AddSpecialFields($stats[$day]);
$AddSpecialFields($stats[$day]);
}
// Формируем данные для временного промежутка
......@@ -462,6 +462,7 @@ class Statistics
return $dataStats;
}
// Данные по статистике для баннеров
public function getBannersStat($banners_id_list, $dates)
{
......
src/templates/app/user/campaign_item.phtml
View file @ d27cae25
......@@ -27,11 +27,17 @@
/** @var $this \Zend\View\Renderer\PhpRenderer */
$this->headScript()
->appendFile('/js/c3.min.js')
->appendFile('/js/d3.min.js')
//->appendFile('/js/script-feeds-stat-charts.js')
//->appendFile('/js/script-feeds-stat-table.js')
//->appendFile('/js/script-feeds-stat.js')
->appendFile('/js/adm/amsystem-campaign.js')
;
$this->headLink()
->appendStylesheet('/css/c3.css')
->appendStylesheet('/css/styles-amsystem.css')
;
......@@ -63,7 +69,10 @@ if (!$error) {
$campaign_geo = json_decode($campaign->getTargeting(), true)['geo'];
$banners = $this->banners;
$banners_stats = $this->banners_stats;
$campaign_stat = $this->campaign_stat;
$campaign_stat_total = $this->campaign_stat_total;
$campaign_stat_cats = $this->campaign_stat_cats;
$target_class = ($campaign_target_action == 'load') ? 'load-target' : '';
......@@ -85,7 +94,7 @@ if (!$error) {
<section class="b-content__work inner">
<form id="campaign-create-form" method="post" action="">
<fieldset disabled="disabled">
<div class="panel panel-info">
<!-- Header -->
......@@ -97,6 +106,8 @@ if (!$error) {
<div class="panel-body">
<fieldset disabled="disabled">
<!-- Активность и Название -->
<div class="form-group title">
<input type="checkbox" id="campaign-active" name="campaign-active" <?php if ($campaign_active): ?>checked<?php endif; ?>>
......@@ -332,10 +343,14 @@ if (!$error) {
</div>
</fieldset>
<div class="b-clear"></div>
<div class="campaign-stat">
<textarea id="campaign-stat"><?= ($campaign_stat ? json_encode($campaign_stat) : '')?></textarea>
<textarea id="campaign-stat-total"><?= ($campaign_stat_total ? json_encode($campaign_stat_total) : '')?></textarea>
<textarea id="campaign-stat-cats"><?= ($campaign_stat_cats ? json_encode($campaign_stat_cats) : '')?></textarea>
<div class="chart-graph-stat-info">
<h2>По заданным параметрам статистика отсутствует</h2>
......@@ -345,9 +360,39 @@ if (!$error) {
<div class="message"></div>
</div>
<div id="chart-graph-stat"></div>
<!-- График -->
<div id="chart-graph-stat" data-colors=<?= ($colors_active_lines ? json_encode($colors_active_lines) : '')?>></div>
<!-- Таблица -->
<?php ?>
<div id="table-stat" class="b-table_wrapp report">
<div class="b-content__loading"></div>
<table id="table-line" class="table table-striped">
<thead class="sortable">
<tr>
<th class="period" data-id="period">
<b class="main-cat selected" data-cat="date">Дата</b>
</th>
<?php foreach($campaign_stat_cats as $name => $cat): ?>
<th class="<?= $name ?>" data-id="<?= $name ?>">
<span style="border-color: <?= $cat['color'] ?>;">
<input type="checkbox" data-field="<?= $name ?>" checked />
</span>
<b class="cat" id="<?= $name ?>"><?= $cat['title'] ?></b>
</th>
<?php endforeach; ?>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<?php ?>
<div id="table-stat"></div>
</div>
......@@ -357,7 +402,7 @@ if (!$error) {
</div>
</fieldset>
</form>
</section>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment