reorganising dashoard and stats area

This commit is contained in:
Antoine M 2024-02-14 14:00:09 +01:00
parent 87a66a3936
commit 1c7d50570e
6 changed files with 353 additions and 125 deletions

View File

@ -0,0 +1,156 @@
<?php
// ###### HOME DASHBOARD WIDGET
function register_admin_dashboard_widget()
{
wp_add_dashboard_widget('admin_dashboard_widget', 'Consulter les statistiques', 'render_admin_dashboard_widget_content');
}
add_action('wp_dashboard_setup', 'register_admin_dashboard_widget');
function render_admin_dashboard_widget_content()
{
get_template_part('template-parts/statistics/dashboard-widget');
}
// ###### STATISTICS OPTION PAGE
function register_statistics_option_page()
{
add_menu_page(
'Statistiques des jeux',
'Statistiques des jeux',
'manage_options',
'session-datas-options',
'render_statistics_option_page',
'dashicons-chart-area'
);
}
add_action('admin_menu', 'register_statistics_option_page');
function render_statistics_option_page()
{
get_template_part('template-parts/statistics/dashboard');
}
// ###### EXPORT PDF
function render_game_statistics_print_page()
{
get_template_part('template-parts/statistics/game-print-stats');
}
add_action('admin_post_download_pdf', 'handle_download_pdf_request');
add_action('admin_post_nopriv_download_pdf', 'handle_download_pdf_request');
function handle_download_pdf_request()
{
// Vérifier les autorisations ou les conditions nécessaires
if (!current_user_can('manage_options')) {
wp_die('Access Denied');
}
// Générer le contenu HTML à partir de votre page d'options
ob_start();
render_game_statistics_print_page();
$html_content = ob_get_clean();
// Générer et télécharger le PDF
generate_pdf_from_html($html_content);
}
function generate_pdf_from_html($html_content, $filename = 'export.pdf')
{
// Inclure la bibliothèque TCPDF
require_once(get_template_directory() . '/vendor/autoload.php');
// Créer une instance de TCPDF
$pdf = new TCPDF(PDF_PAGE_ORIENTATION, PDF_UNIT, PDF_PAGE_FORMAT, true, 'UTF-8', false);
// Définir les informations du document
$pdf->SetCreator(PDF_CREATOR);
$pdf->SetAuthor('Your Name');
$pdf->SetTitle('Title');
$pdf->SetSubject('Subject');
$pdf->SetKeywords('Keywords');
// Définir l'en-tête et le pied de page
$pdf->setHeaderData('', PDF_HEADER_LOGO_WIDTH, 'Title', 'Header text');
$pdf->setFooterData(array(0, 64, 0), array(0, 64, 128));
// Définir la police
$pdf->SetFont('helvetica', '', 12);
// Ajouter une page
$pdf->AddPage();
// Écrire le contenu HTML dans le PDF
$pdf->writeHTML($html_content, true, false, true, false, '');
// Sortie PDF
$pdf->Output($filename, 'I');
// $pdf->Output('report.pdf', 'F',);
}
// ###### EXPORT IN CSV
add_action('admin_post_export_csv', 'handle_export_csv_request');
add_action('admin_post_nopriv_export_csv', 'handle_export_csv_request');
function handle_export_csv_request()
{
// Vérifier les autorisations ou les conditions nécessaires
if (!current_user_can('manage_options')) {
wp_die('Access Denied');
}
// Appeler la fonction pour exporter les données vers CSV
export_data_to_csv();
}
function export_data_to_csv()
{
global $wpdb;
$table_name = "wp_app_users_statistics";
// Récupérer les données de la base de données
$data = $wpdb->get_results("SELECT * FROM $table_name", ARRAY_A);
// Vérifier s'il y a des données à exporter
if ($data) {
// Nom du fichier CSV
$filename = 'export.csv';
// Entête du fichier CSV
$header_row = array_keys($data[0]);
// Ouvrir le fichier en écriture
$file = fopen($filename, 'w');
// Écrire l'entête dans le fichier CSV
fputcsv($file, $header_row);
// Écrire les données dans le fichier CSV
foreach ($data as $row) {
fputcsv($file, $row);
}
// Fermer le fichier
fclose($file);
// Télécharger le fichier CSV
header("Content-Disposition: attachment; filename=\"$filename\"");
header("Content-Type: application/csv");
readfile($filename);
// Supprimer le fichier après téléchargement
unlink($filename);
exit();
} else {
// Aucune donnée à exporter
echo 'Aucune donnée à exporter.';
}
}

View File

@ -1,5 +1,3 @@
@import '../components/circle.css';
.dashboard-widget { .dashboard-widget {
@apply pb-12; @apply pb-12;
&__title { &__title {
@ -28,9 +26,35 @@
.page-sessions-datas { .page-sessions-datas {
.game_stats { .game_stats {
@apply bg-white my-12 !px-16 !py-6; @apply bg-white my-12 !px-16 !py-6;
box-sizing: border-box; box-sizing: border-box;
.stats-container {
@apply grid grid-cols-2 gap-16 overflow-hidden; .page-title {
@apply text-5xl font-semibold text-neutral-800 pb-16;
}
&__stats-container {
@apply grid md:grid-cols-2 gap-16 overflow-hidden;
}
&__game-title {
@apply text-3xl font-semibold text-neutral-800 mt-0;
}
&__statistics-section {
p,
li {
@apply text-lg text-slate-600;
}
h3 {
@apply text-blue-600 uppercase font-bold text-base my-0 tracking-widest mb-4;
}
h4 {
@apply font-normal text-lg font-medium text-slate-400 my-0;
}
}
&__scores-distribution {
ul {
@apply flex gap-x-8;
}
} }
.donut-average { .donut-average {
@ -74,34 +98,6 @@
} }
} }
&__game-title {
@apply text-3xl font-semibold text-neutral-800 mt-0;
}
&__statistics-section {
p,
li {
@apply text-lg text-slate-600;
}
h3 {
@apply text-blue-600 uppercase font-bold text-base my-0 tracking-widest mb-4;
}
h4 {
@apply font-normal text-lg font-medium text-slate-400 my-0;
}
}
&__scores-distribution {
ul {
@apply flex gap-x-8;
}
}
.block-data-score {
@apply mb-16;
}
.page-title {
@apply text-5xl font-semibold text-neutral-800 pb-16;
}
@apply py-12 text-base max-w-screen-xl mx-auto px-4; @apply py-12 text-base max-w-screen-xl mx-auto px-4;
/* .geopraphy-statistics, /* .geopraphy-statistics,
@ -128,6 +124,19 @@
@apply capitalize; @apply capitalize;
} }
} }
.download-btns {
@apply flex flex-col md:flex-row gap-x-12 gap-y-4 justify-center my-12;
.dowload-stats {
@apply bg-blue-600 text-white font-medium uppercase tracking-widest block py-4 px-6 rounded-full w-fit;
transition: all 0.3s;
}
.dowload-stats:hover {
transform: scale(1.05);
}
}
.block-data-score {
@apply mb-16;
}
} }
#graphic-score-repartition { #graphic-score-repartition {

View File

@ -15,8 +15,8 @@ function buildDataChart(level) {
}); });
} }
console.log('score', scoreDistribution); // console.log('score', scoreDistribution);
console.log(scoreDistributionDataset); // console.log(scoreDistributionDataset);
const colorPalettes = [ const colorPalettes = [
['#1d4ed8', '#3b82f6', '#60a5fa', '#93c5fd', '#c3dafe'], ['#1d4ed8', '#3b82f6', '#60a5fa', '#93c5fd', '#c3dafe'],
@ -134,7 +134,7 @@ function buildDataChart2(level) {
['#1137a3', '#3267d6', '#5fa3ff', '#8fc1ff', '#b5e0ff'], ['#1137a3', '#3267d6', '#5fa3ff', '#8fc1ff', '#b5e0ff'],
]; ];
console.log('score', scoreDistributionDataset); // console.log('score', scoreDistributionDataset);
new Chart( new Chart(
document.getElementById('graphic-score-repartition'), document.getElementById('graphic-score-repartition'),
{ {
@ -194,20 +194,20 @@ window.addEventListener('DOMContentLoaded', (event) => {
const levels = document.querySelectorAll('.game_stats'); const levels = document.querySelectorAll('.game_stats');
levels.forEach((level) => { levels.forEach((level) => {
buildDataChart2(level); buildDataChart2(level);
function updatePercentage(percentage) { // function updatePercentage(percentage) {
const overlay = document.querySelector( // const overlay = document.querySelector(
'.donut-chart__overlay' // '.donut-chart__overlay'
); // );
const text = document.querySelector( // const text = document.querySelector(
'.donut-chart__percentage' // '.donut-chart__percentage'
); // );
overlay.style.transform = `rotate(${ // overlay.style.transform = `rotate(${
(percentage / 100) * 360 // (percentage / 100) * 360
}deg)`; // }deg)`;
text.textContent = `${percentage}%`; // text.textContent = `${percentage}%`;
} // }
// Exemple : mettre à jour le pourcentage à 75% // // Exemple : mettre à jour le pourcentage à 75%
updatePercentage(75); // updatePercentage(75);
}); });
}); });

View File

@ -0,0 +1,9 @@
<?php
$url = menu_page_url('session-datas-options', false);
?>
<div class="dashboard-widget">
<img class="dashboard-widget__preview-picture" src="<?php echo get_template_directory_uri() . '/resources/img/dashboard/data_visual.png' ?>" alt="">
<h3 class="dashboard-widget__title">Statistiques</h3>
<p>Pour consulter les statistiques des jeux sur la page de session datas</p>
<a class="dashboard-widget__cta" href="<?php echo $url ?>">Consulter</a>
</div>

View File

@ -1,68 +1,10 @@
<?php <?php
function register_admin_dashboard_widget()
{
wp_add_dashboard_widget('admin_dashboard_widget', 'Consulter les statistiques', 'admin_dashboard_widget_callback');
}
add_action('wp_dashboard_setup', 'register_admin_dashboard_widget');
if (!current_user_can('manage_options')) return;
function myprefix_register_options_page()
{
add_menu_page(
'Session Datas',
'Session Datas',
'manage_options',
'session-datas-options',
'my_options_page_html',
'dashicons-chart-area'
);
}
add_action('admin_menu', 'myprefix_register_options_page');
function admin_dashboard_widget_callback()
{
$url = menu_page_url('session-datas-options', false);
?>
<div class="dashboard-widget">
<img class="dashboard-widget__preview-picture" src="<?php echo get_template_directory_uri() . '/resources/img/dashboard/data_visual.png' ?>" alt="">
<h3 class="dashboard-widget__title">Statistiques</h3>
<p>Pour consulter les statistiques des jeux sur la page de session datas</p>
<a class="dashboard-widget__cta" href="<?php echo $url ?>">Consulter</a>
</div>
<?php
}
/**
* The "My Options" page html.
*/
function my_options_page_html()
{
if (!current_user_can('manage_options')) {
return;
}
if (isset($_GET['settings-updated'])) {
add_settings_error(
'my_options_mesages',
'my_options_message',
esc_html__('Settings Saved', 'text_domain'),
'updated'
);
}
settings_errors('my_options_mesages');
?>
<?php
global $wpdb; global $wpdb;
$table_name = "wp_app_users_statistics"; $table_name = "wp_app_users_statistics";
$level_post_ids = $wpdb->get_col(" $level_post_ids = $wpdb->get_col("
SELECT DISTINCT level_post_id SELECT DISTINCT level_post_id
FROM $table_name FROM $table_name
@ -108,15 +50,10 @@ function my_options_page_html()
FROM $table_name FROM $table_name
WHERE level_post_id = $level_post_id WHERE level_post_id = $level_post_id
"); ");
?> ?>
<h2 class="game_stats__game-title"><?php echo $levelPost->post_title ?></h2> <h2 class="game_stats__game-title"><?php echo $levelPost->post_title ?></h2>
<div class="stats-container"> <div class="game_stats__stats-container">
<div class="game_stats__statistics-section game-statistics"> <div class="game_stats__statistics-section game-statistics">
<div class="game_stats__average-score block-data-score"> <div class="game_stats__average-score block-data-score">
<h3>Score moyen</h3> <h3>Score moyen</h3>
@ -124,9 +61,7 @@ function my_options_page_html()
<?php if ($average_level_score) : ?> <?php if ($average_level_score) : ?>
<div class="average-score"> <div class="average-score">
<svg viewBox="0 -1 40 40" class="circular-chart"> <svg viewBox="0 -1 40 40" class="circular-chart">
<path class="circle" stroke-dasharray="70, 800" d="M18 2.0845 <path class="circle" stroke-dasharray="70, 800" d="M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831" />
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831" />
</svg> </svg>
<p class="text"><?php echo round($average_level_score, 1) ?></p> <p class="text"><?php echo round($average_level_score, 1) ?></p>
<!-- <div class="donut-average"></div> --> <!-- <div class="donut-average"></div> -->
@ -170,15 +105,14 @@ function my_options_page_html()
</div> </div>
</div> </div>
</div> </div>
</section> <div class="download-btns">
<a href="<?php echo admin_url('admin-post.php?action=download_pdf'); ?>" class="button dowload-stats">Télécharger PDF</a>
<a href="<?php echo admin_url('admin-post.php?action=export_csv'); ?>" class="button dowload-stats">Exporter vers CSV</a>
</div>
</section> </section>
<?php endforeach; ?> <?php endforeach; ?>
</div> </div>
<?php <?php
}

View File

@ -0,0 +1,120 @@
<?php
if (!current_user_can('manage_options')) return;
global $wpdb;
$table_name = "wp_app_users_statistics";
$level_post_ids = $wpdb->get_col("
SELECT DISTINCT level_post_id
FROM $table_name
");
?>
<div class="page-sessions-datas">
<h1 class="page-title"><?php echo esc_html(get_admin_page_title()); ?></h1>
<?php foreach ($level_post_ids as $level_post_id) : ?>
<?php $levelPost = get_post($level_post_id); ?>
<section class="game_stats">
<?php
$users_locales = $wpdb->get_results("
SELECT user_locale, COUNT(user_locale) as count
FROM $table_name
WHERE level_post_id = $level_post_id
GROUP BY user_locale
");
$users_countries = $wpdb->get_results("
SELECT user_country, COUNT(user_country) as count
FROM $table_name
WHERE level_post_id = $level_post_id
GROUP BY user_country
");
$notes_repartition = $wpdb->get_results("
SELECT level_score, COUNT(level_score) as count
FROM $table_name
WHERE level_post_id = $level_post_id
GROUP BY level_score
");
$average_level_score = $wpdb->get_var("
SELECT AVG(level_score) as average
FROM $table_name
WHERE level_post_id = $level_post_id
");
$completeLevelsScores = $wpdb->get_results("
SELECT level_score
FROM $table_name
WHERE level_post_id = $level_post_id
");
?>
<h2 class="game_stats__game-title"><?php echo $levelPost->post_title ?></h2>
<div class="stats-container">
<div class="game_stats__statistics-section game-statistics">
<div class="game_stats__average-score block-data-score">
<h3>Score moyen</h3>
<?php if ($average_level_score) : ?>
<div class="average-score">
<svg viewBox="0 -1 40 40" class="circular-chart">
<path class="circle" stroke-dasharray="70, 800" d="M18 2.0845
a 15.9155 15.9155 0 0 1 0 31.831
a 15.9155 15.9155 0 0 1 0 -31.831" />
</svg>
<p class="text"><?php echo round($average_level_score, 1) ?></p>
<!-- <div class="donut-average"></div> -->
</div>
<?php endif; ?>
</div>
<div class="game_stats__scores-distribution ">
<h3>Répartition des scores</h3>
<canvas id="graphic-score-repartition"></canvas>
<ul>
<?php foreach ($notes_repartition as $note) : ?>
<li class="score-data" score="<?php echo $note->level_score ?>" count="<?php echo $note->count ?>"><span class="data-label"><?php echo $note->level_score ?></span> : <span class="data-value"><?php echo $note->count ?></span> <span class="joueurs">joueurs</span></li>
<?php endforeach; ?>
</ul>
</div>
</div>
<div class="game_stats__statistics-section geopraphy-statistics">
<h3 class=" section-title">Langue et Géographie</h3>
<div class="data-grid">
<div class="lang">
<h4>Répartition des langues</h4>
<ul>
<?php foreach ($users_locales as $users_locale) : ?>
<li><span class="data-label"><?php echo $users_locale->user_locale ?></span> : <?php echo $users_locale->count ?></li>
<?php endforeach; ?>
</ul>
</div>
<div class="countries">
<h4>Répartition des pays</h4>
<ul>
<?php foreach ($users_countries as $user_country) : ?>
<li><span class="data-label"><?php echo $user_country->user_country ?></span> : <?php echo $user_country->count ?> joueurs</li>
<?php endforeach; ?>
</ul>
</div>
</div>
</div>
</div>
</section>
</section>
<?php endforeach; ?>
</div>
<style>
</style>
<?php