Files

558 lines
27 KiB
PHP
Raw Permalink Normal View History

2025-02-04 23:06:08 +01:00
<div class="container mt-5">
<h2 class="text-center">Edit Availability</h2>
<?php if (isset($error) && $error) : ?>
<div class="alert alert-danger" role="alert">
Please fill in all required fields!
</div>
<?php endif; ?>
<form action="" method="POST" class="mt-4">
<div class="form-group">
<label for="project_name">Project Name</label>
<input type="text" name="project_name" id="project_name" class="form-control" value="<?php echo isset($data['model']) ? $data['model']->project_name : '' ?>" required>
</div>
<!-- <div class="form-group">
<label for="calendar_id">Calendar ID</label>
<input type="text" name="calendar_id" id="calendar_id" class="form-control" value="wewe" required>
</div> -->
<div class="form-group">
<label for="webhook">Webhook</label>
<input type="text" name="webhook" id="webhook" class="form-control" value="<?php echo isset($data['model']) ? $data['model']->webhook : '' ?>" required>
</div>
<div class="form-group">
<label for="webhook_payload">Webhook Payload</label>
<textarea name="webhook_payload" id="webhook_payload" class="form-control" placeholder="{'key':'value'}" required><?php echo isset($data['model']) ? $data['model']->payload : '' ?></textarea>
</div>
<div class="form-group">
<label for="calendar_id">Calendar ID</label>
<input type="text" name="calendar_id" id="calendar_id" class="form-control" value="<?php echo isset($data['model']) ? $data['model']->calendar : '' ?>" required>
</div>
<div class="form-group">
<label for="location">Location API Key</label>
<input type="text" name="location" id="location" class="form-control" value="<?php echo isset($data['model']) ? $data['model']->location : '' ?>" required>
</div>
<div class="form-group">
<label for="score_threshold">Score Threshold</label>
<input type="number" name="score_threshold" id="score_threshold" class="form-control" value="<?php echo isset($data['model']) ? $data['model']->score_threshold : '' ?>" required>
</div>
<!-- <div class="form-group">
<label for="actual_score">Actual Score</label>
<input type="number" name="actual_score" id="actual_score" class="form-control" value="wewe" required>
</div> -->
<!-- <div class="form-group">
<label for="alert">Alert</label>
<input type="text" name="alert" id="alert" class="form-control" value="wewe" required>
</div> -->
<?php
// echo json_encode($data['model']);
if (isset($data['model'])) {
$slots = json_decode($data['model']->slot);
// echo json_encode($slots);
} ?>
<div class="form-group">
<label for="actual_score">Slots</label>
<div class="form-check">
<input class="form-check-input" type="checkbox" id="sundayCheckbox" value="sun" onclick="showTimeInput('sundayTime')" <?php echo isset($slots->sunday) ? 'checked' : '' ?>>
<label class="form-check-label" for="sundayCheckbox">Sunday</label>
<div class="form-row time-container" id="sundayTime" <?php echo isset($slots->sunday) ? 'style="display:flex"' : '' ?>>
<?php if (isset($slots->sunday)) {
foreach ($slots->sunday as $sun) {
?>
<div class="time-set form-row ml-3">
<div class="form-group col-md-4">
<label for="sundayFromInput">From</label>
<input type="time" name="from" id="sundayFromInput" class="form-control mb-2 time-input" value="<?php echo $sun->from ?>" required>
</div>
<div class="form-group col-md-4">
<label for="sundayToInput">To</label>
<input type="time" name="to" id="sundayToInput" class="form-control mb-2 time-input" value="<?php echo $sun->to ?>" required>
</div>
<div class="form-group col-md-4">
<label for="sundayPoint">Point</label>
<input type="number" name="point" id="sundayPoint" class="form-control mb-2 point" value="<?php echo $sun->point ?>" required>
</div>
</div>
<?php }
} ?>
<div class="form-group col-md-12">
<a type="button" class="btn btn-link" onclick="addTime('sundayTime')">Add Time</a>
</div>
</div>
</div>
<!-- Monday -->
<div class="form-check">
<input class="form-check-input" type="checkbox" id="mondayCheckbox" value="mon" onclick="showTimeInput('mondayTime')" <?php echo isset($slots->monday) ? 'checked' : '' ?>>
<label class="form-check-label" for="mondayCheckbox">Monday</label>
<div class="form-row time-container" id="mondayTime" <?php echo isset($slots->monday) ? 'style="display:flex"' : '' ?>>
<?php if (isset($slots->monday)) {
foreach ($slots->monday as $mon) {
?>
<div class="time-set form-row ml-3">
<div class="form-group col-md-4">
<label for="mondayFromInput">From</label>
<input type="time" name="from" id="mondayFromInput" class="form-control mb-2 time-input" value="<?php echo $mon->from ?>" required>
</div>
<div class="form-group col-md-4">
<label for="mondayToInput">To</label>
<input type="time" name="to" id="mondayToInput" class="form-control mb-2 time-input" value="<?php echo $mon->to ?>" required>
</div>
<div class="form-group col-md-4">
<label for="mondayPoint">Point</label>
<input type="number" name="point" id="mondayPoint" class="form-control mb-2 point" value="<?php echo $mon->point ?>" required>
</div>
</div>
<?php }
} ?>
<div class="form-group col-md-12">
<a type="button" class="btn btn-link" onclick="addTime('mondayTime')">Add Time</a>
</div>
</div>
</div>
<!-- Tuesday -->
<div class="form-check">
<input class="form-check-input" type="checkbox" id="tuesdayCheckbox" value="tue" onclick="showTimeInput('tuesdayTime')" <?php echo isset($slots->tuesday) ? 'checked' : '' ?>>
<label class="form-check-label" for="tuesdayCheckbox">Tuesday</label>
<div class="form-row time-container" id="tuesdayTime" <?php echo isset($slots->tuesday) ? 'style="display:flex"' : '' ?>>
<?php if (isset($slots->tuesday)) {
foreach ($slots->tuesday as $tue) {
?>
<div class="time-set form-row ml-3">
<div class="form-group col-md-4">
<label for="tuesdayFromInput">From</label>
<input type="time" name="from" id="tuesdayFromInput" class="form-control mb-2 time-input" value="<?php echo $tue->from ?>" required>
</div>
<div class="form-group col-md-4">
<label for="tuesdayToInput">To</label>
<input type="time" name="to" id="tuesdayToInput" class="form-control mb-2 time-input" value="<?php echo $tue->to ?>" required>
</div>
<div class="form-group col-md-4">
<label for="tuesdayPoint">Point</label>
<input type="number" name="point" id="tuesdayPoint" class="form-control mb-2 point" value="<?php echo $tue->point ?>" required>
</div>
</div>
<?php }
} ?>
<div class="form-group col-md-12">
<a type="button" class="btn btn-link" onclick="addTime('tuesdayTime')">Add Time</a>
</div>
</div>
</div>
<!-- Wednesday -->
<div class="form-check">
<input class="form-check-input" type="checkbox" id="wednesdayCheckbox" value="wed" onclick="showTimeInput('wednesdayTime')" <?php echo isset($slots->wednesday) ? 'checked' : '' ?>>
<label class="form-check-label" for="wednesdayCheckbox">Wednesday</label>
<div class="form-row time-container" id="wednesdayTime" <?php echo isset($slots->wednesday) ? 'style="display:flex"' : '' ?>>
<?php if (isset($slots->wednesday)) {
foreach ($slots->wednesday as $wed) {
?>
<div class="time-set form-row ml-3">
<div class="form-group col-md-4">
<label for="wednesdayFromInput">From</label>
<input type="time" name="from" id="wednesdayFromInput" class="form-control mb-2 time-input" value="<?php echo $wed->from ?>" required>
</div>
<div class="form-group col-md-4">
<label for="wednesdayToInput">To</label>
<input type="time" name="to" id="wednesdayToInput" class="form-control mb-2 time-input" value="<?php echo $wed->to ?>" required>
</div>
<div class="form-group col-md-4">
<label for="wednesdayPoint">Point</label>
<input type="number" name="point" id="wednesdayPoint" class="form-control mb-2 point" value="<?php echo $wed->point ?>" required>
</div>
</div>
<?php }
} ?>
<div class="form-group col-md-12">
<a type="button" class="btn btn-link" onclick="addTime('wednesdayTime')">Add Time</a>
</div>
</div>
</div>
<!-- Thursday -->
<div class="form-check">
<input class="form-check-input" type="checkbox" id="thursdayCheckbox" value="thurs" onclick="showTimeInput('thursdayTime')" <?php echo isset($slots->thursday) ? 'checked' : '' ?>>
<label class="form-check-label" for="thursdayCheckbox">Thursday</label>
<div class="form-row time-container" id="thursdayTime" <?php echo isset($slots->thursday) ? 'style="display:flex"' : '' ?>>
<?php if (isset($slots->thursday)) {
foreach ($slots->thursday as $thurs) {
?>
<div class="time-set form-row ml-3">
<div class="form-group col-md-4">
<label for="thursdayFromInput">From</label>
<input type="time" name="from" id="thursdayFromInput" class="form-control mb-2 time-input" value="<?php echo $thurs->from ?>" required>
</div>
<div class="form-group col-md-4">
<label for="thursdayToInput">To</label>
<input type="time" name="to" id="thursdayToInput" class="form-control mb-2 time-input" value="<?php echo $thurs->to ?>" required>
</div>
<div class="form-group col-md-4">
<label for="thursdayPoint">Point</label>
<input type="number" name="point" id="thursdayPoint" class="form-control mb-2 point" value="<?php echo $thurs->point ?>" required>
</div>
</div>
<?php }
} ?>
<div class="form-group col-md-12">
<a type="button" class="btn btn-link" onclick="addTime('thursdayTime')">Add Time</a>
</div>
</div>
</div>
<!-- Friday -->
<div class="form-check">
<input class="form-check-input" type="checkbox" id="fridayCheckbox" value="fri" onclick="showTimeInput('fridayTime')" <?php echo isset($slots->friday) ? 'checked' : '' ?>>
<label class="form-check-label" for="fridayCheckbox">Friday</label>
<div class="form-row time-container" id="fridayTime" <?php echo isset($slots->friday) ? 'style="display:flex"' : '' ?>>
<?php if (isset($slots->friday)) {
foreach ($slots->friday as $fri) {
?>
<div class="time-set form-row ml-3">
<div class="form-group col-md-4">
<label for="fridayFromInput">From</label>
<input type="time" name="from" id="fridayFromInput" class="form-control mb-2 time-input" value="<?php echo $fri->from ?>" required>
</div>
<div class="form-group col-md-4">
<label for="fridayToInput">To</label>
<input type="time" name="to" id="fridayToInput" class="form-control mb-2 time-input" value="<?php echo $fri->to ?>" required>
</div>
<div class="form-group col-md-4">
<label for="fridayPoint">Point</label>
<input type="number" name="point" id="fridayPoint" class="form-control mb-2 point" value="<?php echo $fri->point ?>" required>
</div>
</div>
<?php }
} ?>
<div class="form-group col-md-12">
<a type="button" class="btn btn-link" onclick="addTime('fridayTime')">Add Time</a>
</div>
</div>
</div>
<!-- Saturday -->
<div class="form-check">
<input class="form-check-input" type="checkbox" id="saturdayCheckbox" value="sat" onclick="showTimeInput('saturdayTime')" <?php echo isset($slots->saturday) ? 'checked' : '' ?>>
<label class="form-check-label" for="saturdayCheckbox">Saturday</label>
<div class="form-row time-container" id="saturdayTime" <?php echo isset($slots->saturday) ? 'style="display:flex"' : '' ?>>
<?php if (isset($slots->saturday)) {
foreach ($slots->saturday as $sat) {
?>
<div class="time-set form-row ml-3">
<div class="form-group col-md-4">
<label for="saturdayFromInput">From</label>
<input type="time" name="from" id="saturdayFromInput" class="form-control mb-2 time-input" value="<?php echo $sat->from ?>" required>
</div>
<div class="form-group col-md-4">
<label for="saturdayToInput">To</label>
<input type="time" name="to" id="saturdayToInput" class="form-control mb-2 time-input" value="<?php echo $sat->to ?>" required>
</div>
<div class="form-group col-md-4">
<label for="saturdayPoint">Point</label>
<input type="number" name="point" id="saturdayPoint" class="form-control mb-2 point" value="<?php echo $sat->point ?>" required>
</div>
</div>
<?php }
} ?>
<div class="form-group col-md-12">
<a type="button" class="btn btn-link" onclick="addTime('saturdayTime')">Add Time</a>
</div>
</div>
</div>
</div>
<?php
// }
?>
<div class="form-group">
<label for="days">Days</label>
<input type="number" name="days" id="days" class="form-control" value="<?php echo isset($data['model']) ? $data['model']->days : '' ?>" required>
</div>
<button type="submit" class="btn btn-primary" onclick="submitForm(event)">Submit</button>
</form>
</div>
<script type="text/javascript">
var formData = {};
function showTimeInput(containerId) {
var checkbox = document.getElementById(containerId.replace("Time", "Checkbox"));
var timeContainer = document.getElementById(containerId);
if (checkbox.checked) {
timeContainer.style.display = "flex";
} else {
timeContainer.style.display = "none";
}
}
function addTime(containerId) {
var timeContainer = document.getElementById(containerId);
var br = document.createElement("br");
timeContainer.insertBefore(br, timeContainer.lastElementChild);
var newTimeSet = document.createElement("div");
newTimeSet.className = "time-set form-row ml-3";
var newFormGroup1 = document.createElement("div");
newFormGroup1.className = "form-group col-md-3";
var newLabelFrom = document.createElement("label");
newLabelFrom.textContent = "From:";
var newInputFrom = document.createElement("input");
newInputFrom.type = "time";
newInputFrom.name = "from";
newInputFrom.className = "form-control mb-2 time-input";
newFormGroup1.appendChild(newLabelFrom);
newFormGroup1.appendChild(newInputFrom);
var newFormGroup2 = document.createElement("div");
newFormGroup2.className = "form-group col-md-3";
var newLabelTo = document.createElement("label");
newLabelTo.textContent = "To:";
var newInputTo = document.createElement("input");
newInputTo.type = "time";
newInputTo.name = "to";
newInputTo.className = "form-control mb-2 time-input";
newFormGroup2.appendChild(newLabelTo);
newFormGroup2.appendChild(newInputTo);
var newFormGroup3 = document.createElement("div");
newFormGroup3.className = "form-group col-md-3";
var newLabelPoint = document.createElement("label");
newLabelPoint.textContent = "Point:";
var newInputPoint = document.createElement("input");
newInputPoint.type = "number";
newInputPoint.name = "point";
newInputPoint.className = "form-control mb-2 point";
newFormGroup3.appendChild(newLabelPoint);
newFormGroup3.appendChild(newInputPoint);
var deleteButtonContainer = document.createElement("div");
deleteButtonContainer.className = "form-group col-md-3 mt-auto";
var deleteButton = document.createElement("a");
deleteButton.type = "button";
deleteButton.className = "btn btn-link";
deleteButton.textContent = "Delete Time";
deleteButton.onclick = function() {
deleteTime(newTimeSet);
};
deleteButtonContainer.appendChild(deleteButton);
newTimeSet.appendChild(newFormGroup1);
newTimeSet.appendChild(newFormGroup2);
newTimeSet.appendChild(newFormGroup3);
newTimeSet.appendChild(deleteButtonContainer);
// Insert the new time set before the "Add Time" button
// timeContainer.insertBefore(newTimeSet, timeContainer.lastElementChild);
timeContainer.insertBefore(newTimeSet, br.nextSibling);
updateFormData(); // Call function to update formData when time is added
}
function deleteTime(timeSet) {
var timeContainer = timeSet.parentNode;
timeContainer.removeChild(timeSet);
updateFormData(); // Call function to update formData when time is deleted
}
function calculateTotalPoint() {
var totalPoint = 0;
// Loop through each day in formData
for (var day in formData) {
if (formData.hasOwnProperty(day)) {
// Get the data for the day
var dayData = formData[day];
// Sum up the points for each time set
dayData.forEach(function(timeSet) {
totalPoint += parseFloat(timeSet.point) || 0; // Convert to float and handle NaN
});
}
}
console.log("Total Point: " + totalPoint);
return totalPoint;
}
function calculateTotalPoints(daysToCheck) {
var currentDate = new Date();
var currentDayIndex = currentDate.getDay(); // 0 for Sunday, 1 for Monday, ..., 6 for Saturday
// Get the next two days to check
var daysToCheckIndices = [];
for (var i = 0; i < daysToCheck; i++) {
var nextDayIndex = (currentDayIndex + i + 1) % 7;
daysToCheckIndices.push(nextDayIndex);
}
var totalPoints = 0;
// Loop through the selected days and calculate total points
daysToCheckIndices.forEach(function(dayIndex) {
var dayName = ['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday'][dayIndex];
if (formData[dayName]) {
formData[dayName].forEach(function(timeSlot) {
totalPoints += parseFloat(timeSlot.point) || 0;
});
}
});
return totalPoints;
}
function updateFormData() {
// Reset formData
formData = {};
// Loop through each day
['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday'].forEach(function(day) {
var checkbox = document.getElementById(day + 'Checkbox');
var timeContainer = document.getElementById(day + 'Time');
// var pointContainer = document.getElementById(day + 'Point');
var timeSets = timeContainer.querySelectorAll('.time-set');
// console.log(checkbox)
// console.log(timeContainer)
// console.log(timeSets)
if (checkbox.checked) {
var dayData = [];
// Iterate over each time set
timeSets.forEach(function(timeSet) {
// console.log(timeSet)
var fromInput = timeSet.querySelector('input[name="from"]');
var toInput = timeSet.querySelector('input[name="to"]');
var point = timeSet.querySelector('input[name="point"]');
// Check if both "From" and "To" inputs have values
if (fromInput.value.trim() !== '' && toInput.value.trim() !== '' && point.value.trim() !== '') {
// Store the data in dayData array
dayData.push({
from: fromInput.value,
to: toInput.value,
point: point.value
});
}
});
// console.log(dayData)
// If there is data for the day, store it in formData
if (dayData.length > 0) {
formData[day] = dayData;
// console.log(formData); // Log formData for debugging
}
}
});
console.log(formData); // Log formData for debugging
}
function submitForm(event) {
event.preventDefault();
updateFormData(); // Ensure formData is updated before submission
// Get form values using DOM
var project_name = document.getElementById("project_name").value;
var days = document.getElementById("days").value;
var webhook = document.getElementById("webhook").value;
var score_threshold = document.getElementById("score_threshold").value;
var webhook_payload = document.getElementById("webhook_payload").value;
var calendar_id = document.getElementById("calendar_id").value;
var location = document.getElementById("location").value;
function isJSON(str) {
try {
JSON.parse(str);
return true;
} catch (e) {
return false;
}
}
// var isJsonData = isJSON(webhook_payload);
// if (isJsonData) {
// var json_payload = JSON.parse(webhook_payload);
// } else {
// console.log("The variable does not contain valid JSON data.");
// }
// var actual_score = document.getElementById("actual_score").value;
// var alert = document.getElementById("alert").value;
console.log(formData)
// Get checkbox values (example for Sunday)
// var sundayCheckbox = document.getElementById("sundayCheckbox");
// var isSundayChecked = sundayCheckbox.checked;
// var actual_score = calculateTotalPoint()
var actual_score = calculateTotalPoints(parseInt(days))
// Include other form elements as needed...
formData = JSON.stringify(formData)
// Create an object with the form data
var ids = '<?php if (isset($data['ids'])) {
echo $data['ids'];
} ?>';
var Data = {
project_name: project_name,
days: days,
webhook: webhook,
score_threshold: score_threshold,
actual_score: actual_score,
webhook_payload: webhook_payload,
slot: formData,
calendar_id: calendar_id,
location: location,
ids: ids,
multiedit: true
};
$.ajax({
url: '/<?php echo $_SESSION['role'] ?>/project/list/multiselect',
method: 'POST',
data: Data,
success: function(response) {
// console.log(response.slots_available);
console.log(response);
// alert(JSON.stringify(response));
window.location.href = '/<?php echo $_SESSION['role'] ?>/project'
},
error: function(xhr, status, error) {
console.log(error)
// console.log("error oooo")
}
});
// Display the collected data (you can replace this with your own logic)
// alert(JSON.stringify(formData));
}
</script>