256 lines
6.5 KiB
PHP
256 lines
6.5 KiB
PHP
<?php
|
|
session_start();
|
|
if (!isset($_SESSION['AccAdminID'])) {
|
|
header('Location: login.html');
|
|
exit();
|
|
}
|
|
|
|
include("connection.php");
|
|
$AccID = $_SESSION['AccAdminID'];
|
|
|
|
// Fetching the user's name
|
|
$sql = "SELECT Admin_Name FROM admin WHERE Admin_ID = '$AccID'";
|
|
$result = mysqli_query($conn, $sql);
|
|
$user = mysqli_fetch_assoc($result);
|
|
$userName = $user['Admin_Name'];
|
|
|
|
if ($conn->connect_error) {
|
|
die("Connection failed: " . $conn->connect_error);
|
|
}
|
|
|
|
// Fetch data for Bar Chart (order table)
|
|
$sql1 = "SELECT Category_Type, COUNT(Category_Type) as Quantity FROM orders GROUP BY Category_Type";
|
|
|
|
$result1 = $conn->query($sql1);
|
|
|
|
$labels1 = [];
|
|
$data1 = [];
|
|
|
|
if ($result1->num_rows > 0) {
|
|
while($row = $result1->fetch_assoc()) {
|
|
$labels1[] = $row["Category_Type"];
|
|
$data1[] = $row["Quantity"];
|
|
}
|
|
}
|
|
|
|
// Fetch data for Pie Chart (report table)
|
|
$sql2 = "SELECT Department, COUNT(Department) as Quantity FROM report GROUP BY Department";
|
|
$result2 = $conn->query($sql2);
|
|
|
|
$labels2 = [];
|
|
$data2 = [];
|
|
|
|
if ($result2->num_rows > 0) {
|
|
while($row = $result2->fetch_assoc()) {
|
|
$labels2[] = $row["Department"];
|
|
$data2[] = $row["Quantity"];
|
|
}
|
|
}
|
|
|
|
// Close MySQL connection
|
|
$conn->close();
|
|
?>
|
|
|
|
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Report | UITM BAZAAR</title>
|
|
<link rel="stylesheet" href="style.css">
|
|
<link rel="stylesheet" href="style2.css">
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/4.4.1/chart.umd.js"></script>
|
|
<style>
|
|
body {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
height: 100vh;
|
|
}
|
|
.chart-container {
|
|
margin-top: 300px;
|
|
margin-bottom: 100px;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
flex-wrap: wrap;
|
|
width: 100%;
|
|
}
|
|
.chart-box {
|
|
flex: 1 1 calc(33.333% - 20px);
|
|
margin: 10px;
|
|
max-width: calc(33.333% - 20px);
|
|
}
|
|
.chart-box #chart1{
|
|
margin-bottom: 100px;
|
|
}
|
|
canvas {
|
|
width: 100% !important;
|
|
height: auto !important;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<aside class="sidebar">
|
|
<div class="logo">
|
|
<img src="pic/profiles.png" alt="logo">
|
|
<h2><?php echo $userName; ?>'s</h2>
|
|
</div>
|
|
<ul class="links">
|
|
<h4>Main Menu</h4>
|
|
<li>
|
|
<span class="material-symbols-outlined"><img src="pic/home.png"></span>
|
|
<a href="adminmenu.php">Main Menu</a>
|
|
</li>
|
|
<hr>
|
|
<h4>Advanced</h4>
|
|
<li>
|
|
<span class="material-symbols-outlined"><img src="pic/admin.png"></span>
|
|
<a href="newAdmin.php">New Admin Acc</a>
|
|
</li>
|
|
<hr>
|
|
<h4>Account</h4>
|
|
<li>
|
|
<span class="material-symbols-outlined"><img src="pic/profile2.png"></span>
|
|
<a href="adminProfile.php">Profile</a>
|
|
</li>
|
|
<hr>
|
|
<h4>Sign Out</h4>
|
|
<li class="logout-link">
|
|
<span class="material-symbols-outlined"><i class="fa-solid fa-right-from-bracket"></i></span>
|
|
<a href="logoutAdmin.php">Logout</a>
|
|
</li>
|
|
</ul>
|
|
</aside>
|
|
<header class = "header">
|
|
<a href= "adminmenu.php" class = "logo">
|
|
<span><?php echo $userName; ?>'s</span></a>
|
|
|
|
<i class="fa-solid fa-bars" id="menu-icon"></i>
|
|
|
|
<nav class="navbar">
|
|
<a href="report.php">Report</a>
|
|
<a href="renterList.php">Renter List</a>
|
|
<a href="viewFeedback.php">Feedback</a>
|
|
<a href="approval.php">Order</a>
|
|
<a href="postEvents.php">Events</a>
|
|
</nav>
|
|
</header>
|
|
|
|
<div class="chart-container">
|
|
<div class="chart-box" >
|
|
<canvas id="chart1"></canvas>
|
|
</div>
|
|
<div class="chart-box">
|
|
<canvas id="chart2"></canvas>
|
|
</div>
|
|
</div>
|
|
|
|
<footer class="footer" id="footer">
|
|
<p class="copyright">
|
|
NextGen Techne © | All Rights Reserved
|
|
</p>
|
|
</footer>
|
|
|
|
<script>
|
|
// Retrieve the labels and data for the bar chart from PHP variables
|
|
var barLabels = <?php echo json_encode($labels1); ?>;
|
|
var barData = <?php echo json_encode($data1); ?>;
|
|
// Define the colors to be used for the bar chart
|
|
var barColors = ["blue", "green", "red", "orange", "brown"];
|
|
|
|
// Retrieve the labels and data for the pie chart from PHP variables
|
|
var pieLabels = <?php echo json_encode($labels2); ?>;
|
|
var pieData = <?php echo json_encode($data2); ?>;
|
|
// Define the colors to be used for the pie chart
|
|
var pieColors = ["blue", "green", "red", "orange", "brown", "purple"];
|
|
|
|
// Debugging: insert the values to the console to verify data
|
|
console.log("Bar Chart Labels:", barLabels);
|
|
console.log("Bar Chart Data:", barData);
|
|
console.log("Pie Chart Labels:", pieLabels);
|
|
console.log("Pie Chart Data:", pieData);
|
|
|
|
// Bar Chart
|
|
new Chart(document.getElementById('chart1'), {
|
|
type: 'bar', //set chart type
|
|
data:
|
|
{
|
|
labels: barLabels, //set label for x-axis
|
|
datasets:
|
|
[{
|
|
backgroundColor: barColors, //set color for each bar
|
|
data: barData, // set the data for the bar
|
|
}]
|
|
},
|
|
options:
|
|
{
|
|
plugins:
|
|
{
|
|
legend: { display: false }, //hide the legend
|
|
title:
|
|
{
|
|
display: true,
|
|
text: 'TYPE OF RENTER CATEGORY', //display chart title
|
|
color: 'white',
|
|
font: {
|
|
size: 24 // Change the title font size here
|
|
}
|
|
}
|
|
},
|
|
scales: {
|
|
x: {
|
|
title: {
|
|
display: true,
|
|
text: 'Renter Category',
|
|
color: 'white',
|
|
font: {
|
|
size: 18 // Change the x-axis title font size here
|
|
}
|
|
}
|
|
},
|
|
y:
|
|
{
|
|
title:
|
|
{
|
|
display: true,
|
|
text: 'Quantity',
|
|
color: 'white',
|
|
font: {
|
|
size: 18 // Change the y-axis title font size here
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
});
|
|
|
|
// Pie Chart
|
|
new Chart(document.getElementById('chart2'), {
|
|
type: 'pie',
|
|
data: {
|
|
labels: pieLabels,
|
|
datasets: [{
|
|
backgroundColor: pieColors,
|
|
data: pieData,
|
|
}]
|
|
},
|
|
options: {
|
|
plugins: {
|
|
title: {
|
|
display: true,
|
|
text: 'Report from Department',
|
|
color: 'white',
|
|
font: {
|
|
size: 24 // Change the title font size here
|
|
}
|
|
}
|
|
}
|
|
}
|
|
});
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|