|
|
@@ -0,0 +1,109 @@
|
|
|
+"use strict";
|
|
|
+
|
|
|
+let last_clicked = "";
|
|
|
+let click_counter = 0;
|
|
|
+
|
|
|
+// Function to format time as HH:MM
|
|
|
+function formatTime(date) {
|
|
|
+ const hours = date.getUTCHours().toString().padStart(2, '0');
|
|
|
+ const minutes = date.getUTCMinutes().toString().padStart(2, '0');
|
|
|
+ return `${hours}:${minutes}`;
|
|
|
+}
|
|
|
+
|
|
|
+// Function to get the time span (e.g., 09:00 to 10:00)
|
|
|
+function getTimeSpan(start, end) {
|
|
|
+ return `${formatTime(new Date(start))} to ${formatTime(new Date(end))}`;
|
|
|
+}
|
|
|
+
|
|
|
+// Render the appointments into the table
|
|
|
+function renderAppointments(data) {
|
|
|
+ const tableBody = document.getElementById('appointment-table-body');
|
|
|
+ tableBody.innerHTML = '';
|
|
|
+ data.forEach(appointment => {
|
|
|
+ const row = document.createElement('tr');
|
|
|
+ const titleCell = document.createElement('td');
|
|
|
+ const descriptionCell = document.createElement('td');
|
|
|
+ const placeCell = document.createElement('td');
|
|
|
+ const dueDateCell = document.createElement('td');
|
|
|
+ const timeSpanCell = document.createElement('td');
|
|
|
+ const participantCell = document.createElement('td');
|
|
|
+ const editCell = document.createElement('td');
|
|
|
+ const deleteCell = document.createElement('td');
|
|
|
+ const participantATag = document.createElement('a');
|
|
|
+ const editATag = document.createElement('a');
|
|
|
+ const deleteButton = document.createElement('button');
|
|
|
+ participantATag.href = `/html/bookings.html?appointment=${appointment._id}`;
|
|
|
+ participantATag.innerText = 'participants';
|
|
|
+ editATag.href = `/html/appointscreator.html?appointment=${appointment._id}`;
|
|
|
+ editATag.innerText = 'edit';
|
|
|
+ deleteButton.onclick = async () => {
|
|
|
+ if (last_clicked !== appointment._id) {
|
|
|
+ click_counter += 1;
|
|
|
+ last_clicked = appointment._id;
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ await deleteAppointment(appointment._id);
|
|
|
+ }
|
|
|
+ deleteButton.innerText = 'delete';
|
|
|
+ participantCell.appendChild(participantATag);
|
|
|
+ editCell.appendChild(editATag);
|
|
|
+ deleteCell.appendChild(deleteButton);
|
|
|
+
|
|
|
+ titleCell.textContent = appointment.title;
|
|
|
+ descriptionCell.textContent = appointment.description;
|
|
|
+ dueDateCell.textContent = new Date(appointment.dueDate).toLocaleDateString();
|
|
|
+ placeCell.textContent = appointment.place;
|
|
|
+
|
|
|
+ timeSpanCell.textContent = getTimeSpan(appointment.startDate, appointment.endDate);
|
|
|
+ timeSpanCell.classList.add('time-span');
|
|
|
+
|
|
|
+ // Append cells to the row
|
|
|
+ row.appendChild(titleCell);
|
|
|
+ row.appendChild(descriptionCell);
|
|
|
+ row.appendChild(dueDateCell);
|
|
|
+ row.appendChild(placeCell);
|
|
|
+ row.appendChild(timeSpanCell);
|
|
|
+ row.appendChild(participantCell);
|
|
|
+ row.appendChild(editCell);
|
|
|
+ row.appendChild(deleteCell);
|
|
|
+
|
|
|
+ // Append the row to the table body
|
|
|
+ tableBody.appendChild(row);
|
|
|
+ tableBody.appendChild(row);
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
+async function fetchWithToken(url, options) {
|
|
|
+ const authToken = localStorage.getItem('token');
|
|
|
+ return await fetch(url, {...options, headers: {
|
|
|
+ 'Authorization': `Bearer ${authToken}`,
|
|
|
+ 'Content-Type': 'application/json',
|
|
|
+ }});
|
|
|
+}
|
|
|
+
|
|
|
+async function deleteAppointment(appointmentId) {
|
|
|
+ const response = await fetchWithToken(`/api/users/delete`, {
|
|
|
+ method: 'DELETE',
|
|
|
+ body: JSON.stringify({appointmentId: appointmentId})
|
|
|
+ });
|
|
|
+ if (response.ok) {
|
|
|
+ await fetchAppointments();
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+async function fetchAppointments() {
|
|
|
+ const response = await fetchWithToken("/api/users/appointments");
|
|
|
+ const js = await response.json();
|
|
|
+ if (!response.ok) {
|
|
|
+ window.location.replace("/html/404.html");
|
|
|
+ }
|
|
|
+ renderAppointments(js);
|
|
|
+}
|
|
|
+
|
|
|
+// Call the function to render data
|
|
|
+window.onload = async function () {
|
|
|
+ await fetchAppointments();
|
|
|
+}
|
|
|
+
|
|
|
+
|
Liontix