|
|
<!DOCTYPE html> |
|
|
<html lang="en"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>View Ticket</title> |
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet"> |
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css"> |
|
|
<style> |
|
|
.sidebar { |
|
|
min-height: 100vh; |
|
|
background-color: |
|
|
color: white; |
|
|
} |
|
|
.sidebar-link { |
|
|
color: rgba(255, 255, 255, 0.75); |
|
|
text-decoration: none; |
|
|
display: block; |
|
|
padding: 10px 15px; |
|
|
border-radius: 5px; |
|
|
margin-bottom: 5px; |
|
|
} |
|
|
.sidebar-link:hover, .sidebar-link.active { |
|
|
color: white; |
|
|
background-color: |
|
|
} |
|
|
.ticket-header { |
|
|
border-bottom: 1px solid |
|
|
padding-bottom: 15px; |
|
|
margin-bottom: 20px; |
|
|
} |
|
|
.response-card { |
|
|
border-left: 4px solid |
|
|
margin-bottom: 20px; |
|
|
} |
|
|
.staff-response { |
|
|
border-left-color: |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body> |
|
|
<div class="container-fluid"> |
|
|
<div class="row"> |
|
|
<!-- Sidebar --> |
|
|
<div class="col-md-3 col-lg-2 d-md-block sidebar collapse bg-dark"> |
|
|
<div class="position-sticky pt-3"> |
|
|
<div class="text-center mb-4"> |
|
|
<h4>SupportHub Admin</h4> |
|
|
<p class="text-muted">Welcome, <?php echo htmlspecialchars($_SESSION['username']); ?></p> |
|
|
</div> |
|
|
|
|
|
<ul class="nav flex-column"> |
|
|
<li> |
|
|
<a href="dashboard.php" class="sidebar-link"> |
|
|
<i class="bi bi-speedometer2 me-2"></i> Dashboard |
|
|
</a> |
|
|
</li> |
|
|
<li> |
|
|
<a href="tickets.php" class="sidebar-link active"> |
|
|
<i class="bi bi-ticket-detailed me-2"></i> Tickets |
|
|
</a> |
|
|
</li> |
|
|
<li> |
|
|
<a href="staff.php" class="sidebar-link"> |
|
|
<i class="bi bi-people me-2"></i> Staff |
|
|
</a> |
|
|
</li> |
|
|
<li> |
|
|
<a href="reports.php" class="sidebar-link"> |
|
|
<i class="bi bi-graph-up me-2"></i> Reports |
|
|
</a> |
|
|
</li> |
|
|
<li> |
|
|
<a href="settings.php" class="sidebar-link"> |
|
|
<i class="bi bi-gear me-2"></i> Settings |
|
|
</a> |
|
|
</li> |
|
|
<li class="mt-4"> |
|
|
<a href="../logout.php" class="sidebar-link text-danger"> |
|
|
<i class="bi bi-box-arrow-right me-2"></i> Logout |
|
|
</a> |
|
|
</li> |
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<!-- Main Content --> |
|
|
<main class="col-md-9 ms-sm-auto col-lg-10 px-md-4 py-4"> |
|
|
<div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom"> |
|
|
<h1 class="h2">View Ticket</h1> |
|
|
<div class="btn-toolbar mb-2 mb-md-0"> |
|
|
<a href="tickets.php" class="btn btn-sm btn-outline-secondary"> |
|
|
<i class="bi bi-arrow-left"></i> Back to Tickets |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<!-- Ticket Details --> |
|
|
<div class="card mb-4"> |
|
|
<div class="card-body"> |
|
|
<div class="ticket-header"> |
|
|
<div class="d-flex justify-content-between align-items-center mb-3"> |
|
|
<h3 class="mb-0">Ticket #<?php echo htmlspecialchars($ticket['ticket_id']); ?></h3> |
|
|
<span class="badge |
|
|
<?php |
|
|
switch ($ticket['status']) { |
|
|
case 'Open': echo 'bg-danger'; break; |
|
|
case 'In Progress': echo 'bg-warning text-dark'; break; |
|
|
case 'Resolved': echo 'bg-success'; break; |
|
|
case 'Closed': echo 'bg-secondary'; break; |
|
|
} |
|
|
?>"> |
|
|
<?php echo htmlspecialchars($ticket['status']); ?> |
|
|
</span> |
|
|
</div> |
|
|
|
|
|
<div class="row"> |
|
|
<div class="col-md-6"> |
|
|
<p class="mb-1"><strong>Subject:</strong> <?php echo htmlspecialchars($ticket['subject']); ?></p> |
|
|
<p class="mb-1"><strong>Priority:</strong> <?php echo htmlspecialchars($ticket['priority']); ?></p> |
|
|
</div> |
|
|
<div class="col-md-6"> |
|
|
<p class="mb-1"><strong>Created:</strong> <?php echo date('M d, Y H:i', strtotime($ticket['created_at'])); ?></p> |
|
|
<?php if ($ticket['updated_at']): ?> |
|
|
<p class="mb-1"><strong>Last updated:</strong> <?php echo date('M d, Y H:i', strtotime($ticket['updated_at'])); ?></p> |
|
|
<?php endif; ?> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="mb-4"> |
|
|
<h5>Description</h5> |
|
|
<div class="bg-light p-3 rounded"> |
|
|
<?php echo nl2br(htmlspecialchars($ticket['description'])); ?> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="row"> |
|
|
<div class="col-md-6"> |
|
|
<h5>Customer Details</h5> |
|
|
<ul class="list-unstyled"> |
|
|
<li><strong>Name:</strong> <?php echo htmlspecialchars($ticket['name']); ?></li> |
|
|
<li><strong>Email:</strong> <?php echo htmlspecialchars($ticket['email']); ?></li> |
|
|
</ul> |
|
|
</div> |
|
|
<div class="col-md-6"> |
|
|
<h5>Ticket Actions</h5> |
|
|
<div class="btn-group"> |
|
|
<button class="btn btn-primary" data-bs-toggle="modal" data-bs-target=" |
|
|
<i class="bi bi-reply"></i> Add Response |
|
|
</button> |
|
|
<a href="edit-ticket.php?id=<?php echo $ticket['id']; ?>" class="btn btn-secondary"> |
|
|
<i class="bi bi-pencil"></i> Edit |
|
|
</a> |
|
|
<a href="delete-ticket.php?id=<?php echo $ticket['id']; ?>" class="btn btn-danger"> |
|
|
<i class="bi bi-trash"></i> Delete |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<!-- Responses Section --> |
|
|
<h4 class="mb-3">Responses</h4> |
|
|
|
|
|
<?php if (mysqli_num_rows($responses) > 0): ?> |
|
|
<?php while ($response = mysqli_fetch_assoc($responses)): ?> |
|
|
<div class="card response-card <?php echo ($response['is_staff'] == 1) ? 'staff-response' : ''; ?>"> |
|
|
<div class="card-body"> |
|
|
<div class="d-flex justify-content-between mb-2"> |
|
|
<strong> |
|
|
<?php echo ($response['is_staff'] == 1) ? 'Staff Response' : 'Customer Response'; ?> |
|
|
</strong> |
|
|
<small class="text-muted"> |
|
|
<?php echo date('M d, Y H:i', strtotime($response['created_at'])); ?> |
|
|
</small> |
|
|
</div> |
|
|
<p><?php echo nl2br(htmlspecialchars($response['message'])); ?></p> |
|
|
</div> |
|
|
</div> |
|
|
<?php endwhile; ?> |
|
|
<?php else: ?> |
|
|
<div class="alert alert-info"> |
|
|
No responses yet. Be the first to respond to this ticket. |
|
|
</div> |
|
|
<?php endif; ?> |
|
|
</main> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<!-- Response Modal --> |
|
|
<div class="modal fade" id="responseModal" tabindex="-1" aria-labelledby="responseModalLabel" aria-hidden="true"> |
|
|
<div class="modal-dialog"> |
|
|
<div class="modal-content"> |
|
|
<div class="modal-header"> |
|
|
<h5 class="modal-title" id="responseModalLabel">Add Response</h5> |
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> |
|
|
</div> |
|
|
<form method="POST" action="add-response.php"> |
|
|
<div class="modal-body"> |
|
|
<input type="hidden" name="ticket_id" value="<?php echo $ticket['id']; ?>"> |
|
|
<div class="mb-3"> |
|
|
<label for="responseMessage" class="form-label">Message</label> |
|
|
<textarea class="form-control" id="responseMessage" name="message" rows="5" required></textarea> |
|
|
</div> |
|
|
<div class="mb-3"> |
|
|
<label for="responseStatus" class="form-label">Update Status</label> |
|
|
<select class="form-select" id="responseStatus" name="status"> |
|
|
<option value="">Keep current status</option> |
|
|
<option value="Open">Open</option> |
|
|
<option value="In Progress">In Progress</option> |
|
|
<option value="Resolved">Resolved</option> |
|
|
<option value="Closed">Closed</option> |
|
|
</select> |
|
|
</div> |
|
|
</div> |
|
|
<div class="modal-footer"> |
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button> |
|
|
<button type="submit" class="btn btn-primary">Submit Response</button> |
|
|
</div> |
|
|
</form> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script> |
|
|
</body> |
|
|
</html> |
|
|
|
