Re-did everything, Now is modulaar and better bro.
This commit is contained in:
84
views/CreateTicketView.php
Normal file
84
views/CreateTicketView.php
Normal file
@ -0,0 +1,84 @@
|
||||
<?php
|
||||
// This file contains the HTML template for creating a new ticket
|
||||
?>
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Create New Ticket</title>
|
||||
<link rel="icon" type="image/png" href="<?php echo $GLOBALS['config']['ASSETS_URL']; ?>/images/favicon.png">
|
||||
<link rel="stylesheet" href="<?php echo $GLOBALS['config']['ASSETS_URL']; ?>/css/dashboard.css">
|
||||
<link rel="stylesheet" href="<?php echo $GLOBALS['config']['ASSETS_URL']; ?>/css/ticket.css">
|
||||
<script src="<?php echo $GLOBALS['config']['ASSETS_URL']; ?>/js/dashboard.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="ticket-container">
|
||||
<div class="ticket-header">
|
||||
<h2>Create New Ticket</h2>
|
||||
</div>
|
||||
|
||||
<?php if (isset($error)): ?>
|
||||
<div class="error-message"><?php echo $error; ?></div>
|
||||
<?php endif; ?>
|
||||
|
||||
<form method="POST" action="<?php echo $GLOBALS['config']['BASE_URL']; ?>/ticket/create" class="ticket-form">
|
||||
<div class="ticket-details">
|
||||
<div class="detail-group">
|
||||
<label for="title">Title</label>
|
||||
<input type="text" id="title" name="title" class="editable" required>
|
||||
</div>
|
||||
|
||||
<div class="detail-group status-priority-row">
|
||||
<div class="detail-quarter">
|
||||
<label for="status">Status</label>
|
||||
<select id="status" name="status" class="editable">
|
||||
<option value="Open" selected>Open</option>
|
||||
<option value="Closed">Closed</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="detail-quarter">
|
||||
<label for="priority">Priority</label>
|
||||
<select id="priority" name="priority" class="editable">
|
||||
<option value="1">P1 - Critical Impact</option>
|
||||
<option value="2">P2 - High Impact</option>
|
||||
<option value="3">P3 - Medium Impact</option>
|
||||
<option value="4" selected>P4 - Low Impact</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="detail-quarter">
|
||||
<label for="category">Category</label>
|
||||
<select id="category" name="category" class="editable">
|
||||
<option value="Hardware">Hardware</option>
|
||||
<option value="Software">Software</option>
|
||||
<option value="Network">Network</option>
|
||||
<option value="Security">Security</option>
|
||||
<option value="General" selected>General</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="detail-quarter">
|
||||
<label for="type">Type</label>
|
||||
<select id="type" name="type" class="editable">
|
||||
<option value="Maintenance">Maintenance</option>
|
||||
<option value="Install">Install</option>
|
||||
<option value="Task">Task</option>
|
||||
<option value="Upgrade">Upgrade</option>
|
||||
<option value="Issue" selected>Issue</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="detail-group full-width">
|
||||
<label for="description">Description</label>
|
||||
<textarea id="description" name="description" class="editable" rows="15" required></textarea>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="ticket-footer">
|
||||
<button type="submit" class="btn primary">Create Ticket</button>
|
||||
<button type="button" onclick="window.location.href='<?php echo $GLOBALS['config']['BASE_URL']; ?>'" class="btn back-btn">Cancel</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
99
views/DashboardView.php
Normal file
99
views/DashboardView.php
Normal file
@ -0,0 +1,99 @@
|
||||
<?php
|
||||
// This file contains the HTML template for the dashboard
|
||||
// It receives $tickets, $totalTickets, $totalPages, $page, and $status variables from the controller
|
||||
?>
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Ticket Dashboard</title>
|
||||
<link rel="icon" type="image/png" href="<?php echo $GLOBALS['config']['ASSETS_URL']; ?>/images/favicon.png">
|
||||
<link rel="stylesheet" href="<?php echo $GLOBALS['config']['ASSETS_URL']; ?>/css/dashboard.css">
|
||||
<script src="<?php echo $GLOBALS['config']['ASSETS_URL']; ?>/js/dashboard.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="dashboard-header">
|
||||
<h1>Tinker Tickets</h1>
|
||||
<button onclick="window.location.href='<?php echo $GLOBALS['config']['BASE_URL']; ?>/ticket/create'" class="btn create-ticket">New Ticket</button>
|
||||
</div>
|
||||
|
||||
<div class="table-controls">
|
||||
<div class="ticket-count">
|
||||
Total Tickets: <?php echo $totalTickets; ?>
|
||||
</div>
|
||||
<div class="table-actions">
|
||||
<div class="pagination">
|
||||
<?php
|
||||
// Previous page button
|
||||
if ($page > 1) {
|
||||
echo "<button onclick='window.location.href=\"?page=" . ($page - 1) . "&status=$status\"'>«</button>";
|
||||
}
|
||||
|
||||
// Page number buttons
|
||||
for ($i = 1; $i <= $totalPages; $i++) {
|
||||
$activeClass = ($i === $page) ? 'active' : '';
|
||||
echo "<button class='$activeClass' onclick='window.location.href=\"?page=$i&status=$status\"'>$i</button>";
|
||||
}
|
||||
|
||||
// Next page button
|
||||
if ($page < $totalPages) {
|
||||
echo "<button onclick='window.location.href=\"?page=" . ($page + 1) . "&status=$status\"'>»</button>";
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
<div class="settings-icon">
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<circle cx="12" cy="12" r="3"></circle>
|
||||
<path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"></path>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Ticket ID</th>
|
||||
<th>Priority</th>
|
||||
<th>Title</th>
|
||||
<th>Category</th>
|
||||
<th>Type</th>
|
||||
<th>Status</th>
|
||||
<th>Created</th>
|
||||
<th>Updated</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php
|
||||
if (count($tickets) > 0) {
|
||||
foreach($tickets as $row) {
|
||||
echo "<tr class='priority-{$row['priority']}'>";
|
||||
echo "<td><a href='" . $GLOBALS['config']['BASE_URL'] . "/ticket/{$row['ticket_id']}' class='ticket-link'>{$row['ticket_id']}</a></td>";
|
||||
echo "<td><span>{$row['priority']}</span></td>";
|
||||
echo "<td>" . htmlspecialchars($row['title']) . "</td>";
|
||||
echo "<td>{$row['category']}</td>";
|
||||
echo "<td>{$row['type']}</td>";
|
||||
echo "<td class='status-{$row['status']}'>{$row['status']}</td>";
|
||||
echo "<td>" . date('Y-m-d H:i', strtotime($row['created_at'])) . "</td>";
|
||||
echo "<td>" . date('Y-m-d H:i', strtotime($row['updated_at'])) . "</td>";
|
||||
echo "</tr>";
|
||||
}
|
||||
} else {
|
||||
echo "<tr><td colspan='8'>No tickets found</td></tr>";
|
||||
}
|
||||
?>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<!--<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
// Initialize the dashboard
|
||||
if (document.querySelector('table')) {
|
||||
initSearch();
|
||||
initStatusFilter();
|
||||
}
|
||||
});
|
||||
</script>-->
|
||||
</body>
|
||||
</html>
|
||||
120
views/TicketView.php
Normal file
120
views/TicketView.php
Normal file
@ -0,0 +1,120 @@
|
||||
<?php
|
||||
// This file contains the HTML template for a ticket
|
||||
// It receives $ticket and $comments variables from the controller
|
||||
?>
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Ticket #<?php echo $ticket['ticket_id']; ?></title>
|
||||
<link rel="icon" type="image/png" href="<?php echo $GLOBALS['config']['ASSETS_URL']; ?>/images/favicon.png">
|
||||
<link rel="stylesheet" href="<?php echo $GLOBALS['config']['ASSETS_URL']; ?>/css/dashboard.css">
|
||||
<link rel="stylesheet" href="<?php echo $GLOBALS['config']['ASSETS_URL']; ?>/css/ticket.css">
|
||||
<script src="<?php echo $GLOBALS['config']['ASSETS_URL']; ?>/js/dashboard.js"></script>
|
||||
<script src="<?php echo $GLOBALS['config']['ASSETS_URL']; ?>/js/ticket.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
|
||||
<script>
|
||||
// Store ticket data in a global variable
|
||||
window.ticketData = {
|
||||
ticket_id: "<?php echo $ticket['ticket_id']; ?>",
|
||||
title: "<?php echo htmlspecialchars($ticket['title']); ?>",
|
||||
status: "<?php echo $ticket['status']; ?>",
|
||||
priority: "<?php echo $ticket['priority']; ?>",
|
||||
category: "<?php echo $ticket['category']; ?>",
|
||||
type: "<?php echo $ticket['type']; ?>"
|
||||
};
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="ticket-container" data-priority="<?php echo $ticket["priority"]; ?>">
|
||||
<div class="ticket-header">
|
||||
<h2><input type="text" class="editable title-input" value="<?php echo htmlspecialchars($ticket["title"]); ?>" data-field="title" disabled></h2>
|
||||
<div class="ticket-subheader">
|
||||
<div class="ticket-id">UUID <?php echo $ticket['ticket_id']; ?></div>
|
||||
<div class="header-controls">
|
||||
<div class="status-priority-group">
|
||||
<span id="statusDisplay" class="status-<?php echo $ticket["status"]; ?>"><?php echo $ticket["status"]; ?></span>
|
||||
<span class="priority-indicator priority-<?php echo $ticket["priority"]; ?>">P<?php echo $ticket["priority"]; ?></span>
|
||||
</div>
|
||||
<button id="editButton" class="btn" onclick="toggleEditMode()">Edit Ticket</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ticket-details">
|
||||
<div class="ticket-tabs">
|
||||
<button class="tab-btn active" onclick="showTab('description')">Description</button>
|
||||
<button class="tab-btn" onclick="showTab('comments')">Comments</button>
|
||||
</div>
|
||||
|
||||
<div id="description-tab" class="tab-content active">
|
||||
<div class="detail-group full-width">
|
||||
<label>Description</label>
|
||||
<textarea class="editable" data-field="description" disabled><?php echo $ticket["description"]; ?></textarea>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="comments-tab" class="tab-content">
|
||||
<div class="comments-section">
|
||||
<h2>Comments</h2>
|
||||
<div class="comment-form">
|
||||
<textarea id="newComment" placeholder="Add a comment..."></textarea>
|
||||
<div class="comment-controls">
|
||||
<div class="markdown-toggles">
|
||||
<div class="preview-toggle">
|
||||
<label class="switch">
|
||||
<input type="checkbox" id="markdownMaster" onchange="toggleMarkdownMode()">
|
||||
<span class="slider round"></span>
|
||||
</label>
|
||||
<span class="toggle-label">Enable Markdown</span>
|
||||
</div>
|
||||
<div class="preview-toggle">
|
||||
<label class="switch">
|
||||
<input type="checkbox" id="markdownToggle" onchange="togglePreview()" disabled>
|
||||
<span class="slider round"></span>
|
||||
</label>
|
||||
<span class="toggle-label">Preview Markdown</span>
|
||||
</div>
|
||||
</div>
|
||||
<button onclick="addComment()" class="btn">Add Comment</button>
|
||||
</div>
|
||||
<div id="markdownPreview" class="markdown-preview" style="display: none;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="comments-list">
|
||||
<?php
|
||||
foreach ($comments as $comment) {
|
||||
echo "<div class='comment'>";
|
||||
echo "<div class='comment-header'>";
|
||||
echo "<span class='comment-user'>{$comment['user_name']}</span>";
|
||||
echo "<span class='comment-date'>" . date('M d, Y H:i', strtotime($comment['created_at'])) . "</span>";
|
||||
echo "</div>";
|
||||
echo "<div class='comment-text'>";
|
||||
if ($comment['markdown_enabled']) {
|
||||
echo "<script>document.write(marked.parse(" . json_encode($comment['comment_text']) . "))</script>";
|
||||
} else {
|
||||
echo htmlspecialchars($comment['comment_text']);
|
||||
}
|
||||
echo "</div>";
|
||||
echo "</div>";
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ticket-footer">
|
||||
<button onclick="window.location.href='<?php echo $GLOBALS['config']['BASE_URL']; ?>'" class="btn back-btn">Back to Dashboard</button>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
// Initialize the ticket view
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
if (typeof showTab === 'function') {
|
||||
showTab('description');
|
||||
} else {
|
||||
console.error('showTab function not defined');
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user