273 lines
13 KiB
PHP
273 lines
13 KiB
PHP
<?php
|
|
session_start();
|
|
require_once 'db/config.php';
|
|
|
|
if (!isset($_SESSION['user_id'])) {
|
|
header("Location: /login.php");
|
|
exit;
|
|
}
|
|
|
|
$userId = $_SESSION['user_id'];
|
|
$db = db();
|
|
|
|
// Handle Add/Edit/Delete Actions
|
|
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
|
|
// Add Subscription
|
|
if (isset($_POST['add_subscription'])) {
|
|
$name = $_POST['name'];
|
|
$cost = $_POST['cost'];
|
|
$renewal_date = $_POST['renewal_date'];
|
|
$category = $_POST['category'];
|
|
$frequency = $_POST['frequency'];
|
|
|
|
$stmt = $db->prepare("INSERT INTO subscriptions (user_id, name, cost, renewal_date, category, frequency) VALUES (?, ?, ?, ?, ?, ?)");
|
|
$stmt->execute([$userId, $name, $cost, $renewal_date, $category, $frequency]);
|
|
}
|
|
// Edit Subscription
|
|
elseif (isset($_POST['edit_subscription'])) {
|
|
$subscription_id = $_POST['subscription_id'];
|
|
$name = $_POST['name'];
|
|
$cost = $_POST['cost'];
|
|
$renewal_date = $_POST['renewal_date'];
|
|
$category = $_POST['category'];
|
|
$frequency = $_POST['frequency'];
|
|
|
|
$stmt = $db->prepare("UPDATE subscriptions SET name = ?, cost = ?, renewal_date = ?, category = ?, frequency = ? WHERE id = ? AND user_id = ?");
|
|
$stmt->execute([$name, $cost, $renewal_date, $category, $frequency, $subscription_id, $userId]);
|
|
}
|
|
// Delete Subscription
|
|
elseif (isset($_POST['delete_subscription'])) {
|
|
$subscription_id = $_POST['subscription_id'];
|
|
$stmt = $db->prepare("DELETE FROM subscriptions WHERE id = ? AND user_id = ?");
|
|
$stmt->execute([$subscription_id, $userId]);
|
|
}
|
|
header("Location: dashboard.php"); // Redirect to avoid form resubmission
|
|
exit;
|
|
}
|
|
|
|
|
|
// Fetch Subscriptions and Calculate Total Spend
|
|
$stmt = $db->prepare("SELECT * FROM subscriptions WHERE user_id = ? ORDER BY renewal_date ASC");
|
|
$stmt->execute([$userId]);
|
|
$subscriptions = $stmt->fetchAll(PDO::FETCH_ASSOC);
|
|
|
|
$totalMonthlySpend = 0;
|
|
foreach ($subscriptions as $sub) {
|
|
$totalMonthlySpend += (float)$sub['cost'];
|
|
}
|
|
|
|
?>
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Dashboard - Subscription Manager</title>
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
<link rel="stylesheet" href="assets/css/custom.css">
|
|
</head>
|
|
<body>
|
|
|
|
<nav class="navbar navbar-expand-lg navbar-light bg-white shadow-sm">
|
|
<div class="container-fluid">
|
|
<a class="navbar-brand" href="#">Subscription Manager</a>
|
|
<ul class="navbar-nav ms-auto">
|
|
<li class="nav-item">
|
|
<span class="navbar-text me-3">Welcome, <?php echo htmlspecialchars($_SESSION['user_name']); ?>!</span>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a href="logout.php" class="btn btn-outline-primary">Logout</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</nav>
|
|
|
|
<div class="container mt-5">
|
|
<!-- Total Spend Card -->
|
|
<div class="row mb-4">
|
|
<div class="col-md-4">
|
|
<div class="card text-white" style="background: linear-gradient(45deg, #0D6EFD, #0DCAF0);">
|
|
<div class="card-body">
|
|
<h5 class="card-title">Total Monthly Spend</h5>
|
|
<p class="card-text fs-2 fw-bold">$<?php echo number_format($totalMonthlySpend, 2); ?></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Subscriptions Table -->
|
|
<div class="card shadow-sm">
|
|
<div class="card-header d-flex justify-content-between align-items-center">
|
|
<h4 class="mb-0">Your Subscriptions</h4>
|
|
<button class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#addSubscriptionModal">Add Subscription</button>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="table-responsive">
|
|
<table class="table table-hover">
|
|
<thead>
|
|
<tr>
|
|
<th>Name</th>
|
|
<th>Cost</th>
|
|
<th>Renewal Date</th>
|
|
<th>Category</th>
|
|
<th>Frequency</th>
|
|
<th>Actions</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<?php if (empty($subscriptions)): ?>
|
|
<tr>
|
|
<td colspan="6" class="text-center">No subscriptions yet. Add one to get started!</td>
|
|
</tr>
|
|
<?php else: ?>
|
|
<?php foreach ($subscriptions as $sub): ?>
|
|
<tr>
|
|
<td><?php echo htmlspecialchars($sub['name']); ?></td>
|
|
<td>$<?php echo number_format($sub['cost'], 2); ?></td>
|
|
<td><?php echo htmlspecialchars($sub['renewal_date']); ?></td>
|
|
<td><?php echo htmlspecialchars($sub['category']); ?></td>
|
|
<td><?php echo htmlspecialchars($sub['frequency']); ?></td>
|
|
<td>
|
|
<button class="btn btn-sm btn-outline-secondary edit-btn"
|
|
data-id="<?php echo $sub['id']; ?>"
|
|
data-name="<?php echo htmlspecialchars($sub['name']); ?>"
|
|
data-cost="<?php echo $sub['cost']; ?>"
|
|
data-renewal_date="<?php echo $sub['renewal_date']; ?>"
|
|
data-category="<?php echo htmlspecialchars($sub['category']); ?>"
|
|
data-frequency="<?php echo htmlspecialchars($sub['frequency']); ?>"
|
|
data-bs-toggle="modal" data-bs-target="#editSubscriptionModal">Edit</button>
|
|
<form method="POST" style="display: inline-block;" onsubmit="return confirm('Are you sure you want to delete this subscription?');">
|
|
<input type="hidden" name="subscription_id" value="<?php echo $sub['id']; ?>">
|
|
<button type="submit" name="delete_subscription" class="btn btn-sm btn-outline-danger">Delete</button>
|
|
</form>
|
|
</td>
|
|
</tr>
|
|
<?php endforeach; ?>
|
|
<?php endif; ?>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Add Subscription Modal -->
|
|
<div class="modal fade" id="addSubscriptionModal" tabindex="-1" aria-labelledby="addSubscriptionModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" id="addSubscriptionModalLabel">Add New Subscription</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<form method="POST">
|
|
<div class="modal-body">
|
|
<div class="mb-3">
|
|
<label for="name" class="form-label">Subscription Name</label>
|
|
<input type="text" class="form-control" id="name" name="name" required>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="cost" class="form-label">Monthly Cost (USD)</label>
|
|
<input type="number" step="0.01" class="form-control" id="cost" name="cost" required>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="renewal_date" class="form-label">Next Renewal Date</label>
|
|
<input type="date" class="form-control" id="renewal_date" name="renewal_date" required>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="category" class="form-label">Category</label>
|
|
<input type="text" class="form-control" id="category" name="category" placeholder="e.g., Streaming, Software">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="frequency" class="form-label">Frequency</label>
|
|
<select class="form-select" id="frequency" name="frequency">
|
|
<option>Monthly</option>
|
|
<option>Yearly</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
|
|
<button type="submit" name="add_subscription" class="btn btn-primary">Save Subscription</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Edit Subscription Modal -->
|
|
<div class="modal fade" id="editSubscriptionModal" tabindex="-1" aria-labelledby="editSubscriptionModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" id="editSubscriptionModalLabel">Edit Subscription</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<form method="POST">
|
|
<div class="modal-body">
|
|
<input type="hidden" id="edit_subscription_id" name="subscription_id">
|
|
<div class="mb-3">
|
|
<label for="edit_name" class="form-label">Subscription Name</label>
|
|
<input type="text" class="form-control" id="edit_name" name="name" required>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="edit_cost" class="form-label">Monthly Cost (USD)</label>
|
|
<input type="number" step="0.01" class="form-control" id="edit_cost" name="cost" required>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="edit_renewal_date" class="form-label">Next Renewal Date</label>
|
|
<input type="date" class="form-control" id="edit_renewal_date" name="renewal_date" required>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="edit_category" class="form-label">Category</label>
|
|
<input type="text" class="form-control" id="edit_category" name="category" placeholder="e.g., Streaming, Software">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="edit_frequency" class="form-label">Frequency</label>
|
|
<select class="form-select" id="edit_frequency" name="frequency">
|
|
<option>Monthly</option>
|
|
<option>Yearly</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
|
|
<button type="submit" name="edit_subscription" class="btn btn-primary">Save Changes</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
var editSubscriptionModal = document.getElementById('editSubscriptionModal');
|
|
editSubscriptionModal.addEventListener('show.bs.modal', function (event) {
|
|
var button = event.relatedTarget;
|
|
var id = button.getAttribute('data-id');
|
|
var name = button.getAttribute('data-name');
|
|
var cost = button.getAttribute('data-cost');
|
|
var renewal_date = button.getAttribute('data-renewal_date');
|
|
var category = button.getAttribute('data-category');
|
|
var frequency = button.getAttribute('data-frequency');
|
|
|
|
var modalTitle = editSubscriptionModal.querySelector('.modal-title');
|
|
var modalBodyInputId = editSubscriptionModal.querySelector('#edit_subscription_id');
|
|
var modalBodyInputName = editSubscriptionModal.querySelector('#edit_name');
|
|
var modalBodyInputCost = editSubscriptionModal.querySelector('#edit_cost');
|
|
var modalBodyInputRenewalDate = editSubscriptionModal.querySelector('#edit_renewal_date');
|
|
var modalBodyInputCategory = editSubscriptionModal.querySelector('#edit_category');
|
|
var modalBodyInputFrequency = editSubscriptionModal.querySelector('#edit_frequency');
|
|
|
|
modalTitle.textContent = 'Edit ' + name;
|
|
modalBodyInputId.value = id;
|
|
modalBodyInputName.value = name;
|
|
modalBodyInputCost.value = cost;
|
|
modalBodyInputRenewalDate.value = renewal_date;
|
|
modalBodyInputCategory.value = category;
|
|
modalBodyInputFrequency.value = frequency;
|
|
});
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|