Mini-Task-Collaboration-App/dashboard.php at main · ANS1087/Mini-Task-Collaboration-App · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
<?php
require_once 'includes/config.php';
redirectIfNotLoggedIn();

$userId = getCurrentUserId();
$tasks = getUserTasks($pdo, $userId);
?>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Dashboard | Task Collaboration App</title>
    <link rel="stylesheet" href="<?php echo BASE_URL; ?>/assets/css/style.css">
</head>
<body>
    <div class="container">
        <header>
            <h1>Welcome, <?php echo $_SESSION['user_name']; ?></h1>
            <nav>
                <a href="<?php echo BASE_URL; ?>/dashboard.php">Dashboard</a>
                <?php if (isAdmin()): ?>
                    <a href="<?php echo BASE_URL; ?>/admin/dashboard.php">Admin Panel</a>
                <?php endif; ?>
                <a href="<?php echo BASE_URL; ?>/auth/logout.php">Logout</a>
            </nav>
        </header>

        <main>
            <section class="task-form">
                <h2>Add New Task</h2>
                <form id="addTaskForm">
                    <div class="form-group">
                        <label for="title">Title</label>
                        <input type="text" name="title" id="title" required>
                    </div>

                    <div class="form-group">
                        <label for="description">Description</label>
                        <textarea name="description" id="description"></textarea>
                    </div>

                    <div class="form-group">
                        <label for="deadline">Deadline</label>
                        <input type="datetime-local" name="deadline" id="deadline" required>
                    </div>

                    <div class="form-group">
                        <label for="priority">Priority</label>
                        <select name="priority" id="priority" required>
                            <option value="high">High</option>
                            <option value="medium" selected>Medium</option>
                            <option value="low">Low</option>
                        </select>
                    </div>

                    <button type="submit" class="btn">Add Task</button>
                </form>
            </section>

            <section class="task-list">
                <h2>Your Tasks</h2>
                <div id="tasksContainer">
                    <?php foreach ($tasks as $task): ?>
                        <div class="task-card" data-id="<?php echo $task['id']; ?>">
                            <h3><?php echo htmlspecialchars($task['title']); ?></h3>
                            <p><?php echo htmlspecialchars($task['description']); ?></p>
                            <div class="task-meta">
                                <span class="priority <?php echo $task['priority']; ?>"><?php echo ucfirst($task['priority']); ?></span>
                                <span class="status"><?php echo ucfirst(str_replace('_', ' ', $task['status'])); ?></span>
                                <span class="deadline">Due: <?php echo date('M j, Y H:i', strtotime($task['deadline'])); ?></span>
                            </div>
                            <div class="task-actions">
                                <button class="btn edit-btn" data-id="<?php echo $task['id']; ?>">Edit</button>
                                <button class="btn delete-btn" data-id="<?php echo $task['id']; ?>">Delete</button>
                            </div>
                        </div>
                    <?php endforeach; ?>
                </div>
            </section>
        </main>
    </div>

    <!-- Edit Task Modal -->
    <div id="editTaskModal" class="modal">
        <div class="modal-content">
            <span class="close-modal">&times;</span>
            <h2>Edit Task</h2>
            <form id="editTaskForm">
                <input type="hidden" name="task_id" id="edit-task-id">

                <div class="form-group">
                    <label for="edit-title">Title</label>
                    <input type="text" name="title" id="edit-title" required>
                </div>

                <div class="form-group">
                    <label for="edit-description">Description</label>
                    <textarea name="description" id="edit-description"></textarea>
                </div>

                <div class="form-group">
                    <label for="edit-deadline">Deadline</label>
                    <input type="datetime-local" name="deadline" id="edit-deadline" required>
                </div>

                <div class="form-group">
                    <label for="edit-priority">Priority</label>
                    <select name="priority" id="edit-priority" required>
                        <option value="high">High</option>
                        <option value="medium">Medium</option>
                        <option value="low">Low</option>
                    </select>
                </div>

                <div class="form-group">
                    <label for="edit-status">Status</label>
                    <select name="status" id="edit-status" required>
                        <option value="pending">Pending</option>
                        <option value="in_progress">In Progress</option>
                        <option value="completed">Completed</option>
                    </select>
                </div>

                <button type="submit" class="btn">Update Task</button>
            </form>
        </div>
    </div>

    <script src="<?php echo BASE_URL; ?>/assets/js/script.js"></script>
</body>
</html>