Tableau des Stats Responsive

Deux fichiers à modifier afin de consulter vos statistiques sur votre mobile dans un format adapté

 

1/ Modifier le php du module Statsforecast à la ligne 151 – Ajout d’id CSS et de data-title sur les td

<table id= »responsivetable » class= »table table-responsive »>
<thead>
<tr>
<th></th>
<th class= »text-center »><span class= »title_box active »>’.$this->l(‘Visits’).'</span></th>
<th class= »text-center »><span class= »title_box active »>’.$this->l(‘Registrations’).'</span></th>
<th class= »text-center »><span class= »title_box active »>’.$this->l(‘Placed orders’).'</span></th>
<th class= »text-center »><span class= »title_box active »>’.$this->l(‘Bought items’).'</span></th>
<th class= »text-center »><span class= »title_box active »>’.$this->l(‘Percentage of registrations’).'</span></th>
<th class= »text-center »><span class= »title_box active »>’.$this->l(‘Percentage of orders’).'</span></th>
<th class= »text-center »><span class= »title_box active »>’.$this->l(‘Revenue’).'</span></th>
</tr>
</thead>’;

$visit_array = array();
$sql = ‘SELECT ‘.$date_from_gadd.’ as fix_date, COUNT(*) as visits
FROM ‘._DB_PREFIX_.’connections c
WHERE c.date_add BETWEEN ‘.ModuleGraph::getDateBetween().’
‘.Shop::addSqlRestriction(false, ‘c’).’
GROUP BY ‘.$date_from_gadd;
$visits = Db::getInstance()->query($sql);
while ($row = $db->nextRow($visits))
$visit_array[$row[‘fix_date’]] = $row[‘visits’];

foreach ($data_table as $row)
{
$visits_today = (int)(isset($visit_array[$row[‘fix_date’]]) ? $visit_array[$row[‘fix_date’]] : 0);

$date_from_greg = ($this->context->cookie->stats_granularity != 42
? ‘LIKE \ ».$row[‘fix_date’].’%\ »
: ‘BETWEEN \ ».Tools::substr($row[‘fix_date’], 0, 10).’ 00:00:00\’ AND DATE_ADD(\ ».Tools::substr($row[‘fix_date’], 0, 8).Tools::substr($row[‘fix_date’], 8, 2).’ 23:59:59\’, INTERVAL 7 DAY)’);
$row[‘registrations’] = Db::getInstance()->getValue(‘
SELECT COUNT(*) FROM ‘._DB_PREFIX_.’customer
WHERE date_add BETWEEN ‘.ModuleGraph::getDateBetween().’
AND date_add ‘.$date_from_greg
.Shop::addSqlRestriction(Shop::SHARE_CUSTOMER));

$this->html .= ‘
<tr>
<td data-title= »Date »>’.$row[‘fix_date’].'</td>
<td data-title= »‘.$this->l(‘Visits’).' » class= »text-center »>’.$visits_today.'</td>
<td data-title= »‘.$this->l(‘Registrations’).' » class= »text-center »>’.(int)$row[‘registrations’].'</td>
<td data-title= »‘.$this->l(‘Placed orders’).' » class= »text-center »>’.(int)$row[‘countOrders’].'</td>
<td data-title= »‘.$this->l(‘Bought items’).' » class= »text-center »>’.(int)$row[‘countProducts’].'</td>
<td data-title= »‘.$this->l(‘Percentage of registrations’).' » class= »text-center »>’.($visits_today ? round(100 * (int)$row[‘registrations’] / $visits_today, 2).’ %’ : ‘-‘).'</td>
<td data-title= »‘.$this->l(‘Percentage of orders’).' » class= »text-center »>’.($visits_today ? round(100 * (int)$row[‘countOrders’] / $visits_today, 2).’ %’ : ‘-‘).'</td>
<td data-title= »‘.$this->l(‘Revenue’).' » class= »text-right »>’.Tools::displayPrice($row[‘totalSales’], $currency).'</td>
</tr>’;

$this->t1 += $visits_today;
$this->t2 += (int)$row[‘registrations’];
$this->t3 += (int)$row[‘countOrders’];
$this->t4 += (int)$row[‘countProducts’];
$this->t8 += $row[‘totalSales’];
}

$this->html .= ‘
<thead style= »border-top: 20px solid; »>
<tr>
<th></th>
<th class= »text-center »><span class= »title_box active »>’.$this->l(‘Visits’).'</span></th>
<th class= »text-center »><span class= »title_box active »>’.$this->l(‘Registrations’).'</span></th>
<th class= »text-center »><span class= »title_box active »>’.$this->l(‘Placed orders’).'</span></th>
<th class= »text-center »><span class= »title_box active »>’.$this->l(‘Bought items’).'</span></th>
<th class= »text-center »><span class= »title_box active »>’.$this->l(‘Percentage of registrations’).'</span></th>
<th class= »text-center »><span class= »title_box active »>’.$this->l(‘Percentage of orders’).'</span></th>
<th class= »text-center »><span class= »title_box active »>’.$this->l(‘Revenue’).'</span></th>
</tr>
</thead>
<tr>
<td data-title= »‘.$this->l(‘Total’).' »>’.$this->l(‘Total’).'</td>
<td data-title= »‘.$this->l(‘Visits’).' » class= »text-center »>’.(int)$this->t1.'</td>
<td data-title= »‘.$this->l(‘Registrations’).' » class= »text-center »>’.(int)$this->t2.'</td>
<td data-title= »‘.$this->l(‘Placed orders’).' » class= »text-center »>’.(int)$this->t3.'</td>
<td data-title= »‘.$this->l(‘Bought items’).' » class= »text-center »>’.(int)$this->t4.'</td>
<td data-title= »‘.$this->l(‘Percentage of registrations’).' » class= »text-center »>–</td>
<td data-title= »‘.$this->l(‘Percentage of orders’).' » class= »text-center »>–</td>
<td data-title= »‘.$this->l(‘Revenue’).' » class= »text-right »>’.Tools::displayPrice($this->t8, $currency).'</td>
</tr>
<tr>
<td data-title= »‘.$this->l(‘Average’).' »>’.$this->l(‘Average’).'</td>
<td data-title= »‘.$this->l(‘Visits’).' » class= »text-center »>’.(int)($this->t1 / $interval_avg).'</td>
<td data-title= »‘.$this->l(‘Registrations’).' » class= »text-center »>’.(int)($this->t2 / $interval_avg).'</td>
<td data-title= »‘.$this->l(‘Placed orders’).' » class= »text-center »>’.(int)($this->t3 / $interval_avg).'</td>
<td data-title= »‘.$this->l(‘Bought items’).' » class= »text-center »>’.(int)($this->t4 / $interval_avg).'</td>
<td data-title= »‘.$this->l(‘Percentage of registrations’).' » class= »text-center »>’.($this->t1 ? round(100 * $this->t2 / $this->t1, 2).’ %’ : ‘-‘).'</td>
<td data-title= »‘.$this->l(‘Percentage of orders’).' » class= »text-center »>’.($this->t1 ? round(100 * $this->t3 / $this->t1, 2).’ %’ : ‘-‘).'</td>
<td data-title= »‘.$this->l(‘Revenue’).' » class= »text-right »>’.Tools::displayPrice($this->t8 / $interval_avg, $currency).'</td>
</tr>
<tr>
<td data-title= »‘.$this->l(‘Forecast’).' »>’.$this->l(‘Forecast’).'</td>
<td data-title= »‘.$this->l(‘Visits’).' » class= »text-center »>’.(int)($this->t1 * $prop30).'</td>
<td data-title= »‘.$this->l(‘Registrations’).' » class= »text-center »>’.(int)($this->t2 * $prop30).'</td>
<td data-title= »‘.$this->l(‘Placed orders’).' » class= »text-center »>’.(int)($this->t3 * $prop30).'</td>
<td data-title= »‘.$this->l(‘Bought items’).' » class= »text-center »>’.(int)($this->t4 * $prop30).'</td>
<td data-title= »‘.$this->l(‘Percentage of registrations’).' » class= »text-center »>–</td>
<td data-title= »‘.$this->l(‘Percentage of orders’).' » class= »text-center »>–</td>
<td data-title= »‘.$this->l(‘Revenue’).' » class= »text-right »>’.Tools::displayPrice($this->t8 * $prop30, $currency).'</td>
</tr>
</table>
</div>’;

2/ Ajouter au admin theme css

@media (max-width: 900px) {
/* Force table to not be like tables anymore */
#responsivetable table,
#responsivetable thead,
#responsivetable tbody,
#responsivetable th,
#responsivetable td,
#responsivetable tr{display: block;}

/* Hide table headers (but not display: none;, for accessibility) */
#responsivetable thead tr {
position: absolute;
top: -9999px;
left: -9999px;
}

#responsivetable tr {border: 1px solid #ccc;}

#responsivetable td {
/* Behave like a « row » */
border: none;
border-bottom: 1px solid #eee;
position: relative;
padding-left: 50%;
white-space: normal;
text-align:left;
}

#responsivetable td:before {
/* Now like a table header */
position: absolute;
/* Top/left values mimic padding */
top: 6px;
left: 6px;
width: 45%;
padding-right: 10px;
white-space: nowrap;
text-align:left;
font-weight: bold;
}

/*
Label the data
*/
#responsivetable td:before {content: attr(data-title);}
}