588 lines
37 KiB
PHP
588 lines
37 KiB
PHP
<?php
|
|
require_once('/var/www/html/.hta_config/crm_config.php');
|
|
require_once('/var/www/html/.htac_header.php');
|
|
require_once('/var/www/html/.htac_nav.php');
|
|
// echo $_GET['id'];
|
|
// Below two fetch for edit data
|
|
|
|
// this is count notifications
|
|
$stmt = $conn->prepare("SELECT COUNT(*) FROM comments WHERE leadid = :leadid");
|
|
$stmt->bindParam(':leadid', $_GET['id']);
|
|
$stmt->execute();
|
|
$totalRecords = $stmt->fetchColumn();
|
|
// echo $totalRecords;
|
|
if($_SERVER['REQUEST_METHOD']=="POST" && $_POST['update_data']){
|
|
try {
|
|
$conn = new PDO("mysql:host=$mariaServer;dbname=$mariaDb", $mariaUser, $mariaPass);
|
|
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
|
|
$stmt = $conn->prepare("UPDATE cleads SET name = :name, email = :email, phone = :phone, date = :date, status = :status, user = :user, country = :country, state= :state, city = :city, address = :address, profession = :profession, coupon_code = :coupon_code, gender = :gender, warm_status = :warm_status WHERE id = :id");
|
|
$stmt->bindParam(':name', $_POST['name']);
|
|
$stmt->bindParam(':email', $_POST['email']);
|
|
$stmt->bindParam(':phone', $_POST['phone']);
|
|
$stmt->bindParam(':date', $_POST['date']);
|
|
$stmt->bindParam(':status', $_POST['status']);
|
|
$stmt->bindParam(':user', $_POST['user']);
|
|
$stmt->bindParam(':country', $_POST['country']);
|
|
$stmt->bindParam(':state', $_POST['state']);
|
|
$stmt->bindParam(':city', $_POST['city']);
|
|
$stmt->bindParam(':address', $_POST['address']);
|
|
$stmt->bindParam(':profession', $_POST['profession']);
|
|
$stmt->bindParam(':coupon_code', $_POST['coupon_code']);
|
|
$stmt->bindParam(':gender', $_POST['gender']);
|
|
$stmt->bindParam(':warm_status', $_POST['warm_status']);
|
|
$stmt->bindParam(':id', $_GET['id']);
|
|
$stmt->execute();
|
|
|
|
echo "Record Updated successfully";
|
|
} catch(PDOException $e) {
|
|
echo "Error: " . $e->getMessage();
|
|
}
|
|
};
|
|
try {
|
|
$password = md5($_POST['pass']);
|
|
$email = $_POST['email'];
|
|
$conn = new PDO("mysql:host=$mariaServer;dbname=$mariaDb", $mariaUser, $mariaPass);
|
|
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
|
|
$stmt = $conn->prepare("SELECT * FROM cleads WHERE id = :id");
|
|
$stmt->bindParam(':id', $_GET['id']);
|
|
$stmt->execute();
|
|
$rows = $stmt->fetchAll(PDO::FETCH_ASSOC);
|
|
// var_dump($rows);
|
|
foreach($rows as $row){
|
|
$nameParts = explode(" ", $row['name']);
|
|
$firstInitial = substr($nameParts[0], 0, 1);
|
|
$lastInitial = substr($nameParts[count($nameParts) - 1], 0, 1);
|
|
$name_letter = $firstInitial.$lastInitial;
|
|
if($row['status'] == 'New'){$conditional_background_color = 'background-color: #FFD9D9; border: 1px solid #FB5555; border-radius: 5px; color: #FB5555;';}
|
|
elseif($row['status'] == 'Contacted'){$conditional_background_color = 'background-color: #D4FFFF; border: 1px solid #2C9C9C; border-radius: 5px; color: #2C9C9C;';}
|
|
elseif($row['status'] == 'Disqualified'){$conditional_background_color = 'background-color: #CECECE; border: 1px solid #3F4254; border-radius: 5px; color: #3F4254;';}
|
|
elseif($row['status'] == 'Converted'){$conditional_background_color = 'background-color: #D4FDE7; border: 1px solid #40916C; border-radius: 5px; color: #40916C;';}
|
|
elseif($row['status'] == 'Warm'){$conditional_background_color = 'background-color: #FFD9D9; border: 1px solid #FB5555; border-radius: 5px; color: #FB5555;';}
|
|
?>
|
|
<div class="responsive-flex p-6 space-x-4">
|
|
<form method="post">
|
|
<div class="flex flex-col">
|
|
<div class="flex flex-col bg-[#F6F6F6] rounded-xl">
|
|
<div class="grid grid-cols-3 p-3 border-b-2 border-[#D9D9D9] space-x-6" style="text-align: left;">
|
|
<div class="flex flex-row justify-center place-items-center">
|
|
<p class="h-fit p-[10px] rounded-l-full" style="background: linear-gradient(180deg, #E4C1F9 0%, rgba(129, 126, 242, 0.91) 100%); font-size: 20px; color: #fff; font-weight: bold;"><?php echo $name_letter; ?></p>
|
|
<div class="flex flex-row justify-center place-items-center items-center rounded-r-[5px]" style="border: 1px solid #D9D9D9; padding: 6px;">
|
|
<input class="w-full rounded-r-[6px]" type="text" name="name" id="name" value="<?php echo $row['name']; ?>" style="background-color: #f6f6f6; border: none;" />
|
|
<button class="copy-btn fa fa-copy" data-input-id="name"></button>
|
|
</div>
|
|
</div>
|
|
<div class="flex flex-row justify-center place-items-center items-center" style="border: 1px solid #D9D9D9; border-radius: 5px; padding: 6px;">
|
|
<input class="w-full" type="text" name="email" id="email" value="<?php echo $row['email']; ?>" style="background-color: #f6f6f6; border: none;" />
|
|
<button class="copy-btn fa fa-copy" data-input-id="email"></button>
|
|
</div>
|
|
<div class="flex flex-row justify-center place-items-center items-center" style="border: 1px solid #D9D9D9; border-radius: 5px; padding: 6px;">
|
|
<input class="w-full" type="text" name="phone" id="phone" value="<?php echo $row['phone']; ?>" style="background-color: #f6f6f6; border: none;" />
|
|
<button class="copy-btn fa fa-copy" data-input-id="phone"></button>
|
|
</div>
|
|
</div>
|
|
<div class="grid grid-cols-2 p-3 border-b-2 border-[#D9D9D9] space-x-6" style="text-align: left;">
|
|
<div>
|
|
<p><b>Client ID</b></p>
|
|
<p style="border: 1px solid #D9D9D9; border-radius: 5px; padding: 6px;"><?php echo $row['id']; ?></p>
|
|
</div>
|
|
<div>
|
|
<p><b>Form Name</b></p>
|
|
<p style="border: 1px solid #D9D9D9; border-radius: 5px; padding: 6px;"><?php echo $row['formname']; ?></p>
|
|
</div>
|
|
</div>
|
|
<div class="grid grid-cols-3 p-3 border-b-2 border-[#D9D9D9] space-x-6" style="text-align: left;">
|
|
<div>
|
|
<p><b>Country</b></p>
|
|
<select class="w-full" name="country" id="country" onchange="fetchStates()" style="border: 1px solid #D9D9D9; border-radius: 5px; padding: 6px;">
|
|
<option selected value="<?php echo $row['country']; ?>"><?php echo $row['country']; ?></option>
|
|
</select>
|
|
</div>
|
|
<div>
|
|
<p><b>State</b></p>
|
|
<select class="w-full" name="state" id="state" onchange="fetchCities()" style="border: 1px solid #D9D9D9; border-radius: 5px; padding: 6px;">
|
|
<option selected value="<?php echo $row['state']; ?>"><?php echo $row['state']; ?></option>
|
|
</select>
|
|
</div>
|
|
<div>
|
|
<p><b>City</b></p>
|
|
<select class="w-full" name="city" id="city" style="border: 1px solid #D9D9D9; border-radius: 5px; padding: 6px;">
|
|
<option selected value="<?php echo $row['city']; ?>"><?php echo $row['city']; ?></option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="grid grid-cols-2 p-3 border-b-2 border-[#D9D9D9] space-x-6" style="text-align: left;">
|
|
<div>
|
|
<p><b>Address</b></p>
|
|
<input class="w-full" type="text" name="address" id="address" value="<?php echo $row['address']; ?>" style="border: 1px solid #D9D9D9; border-radius: 5px; padding: 6px;" />
|
|
</div>
|
|
<div>
|
|
<p><b>Profession</b></p>
|
|
<input class="w-full" type="text" name="profession" id="profession" value="<?php echo $row['profession']; ?>" style="border: 1px solid #D9D9D9; border-radius: 5px; padding: 6px;" />
|
|
</div>
|
|
</div>
|
|
<div class="grid grid-cols-2 p-3 border-b-2 border-[#D9D9D9] space-x-6" style="text-align: left;">
|
|
<div>
|
|
<p><b>Origin</b></p>
|
|
<p style="border: 1px solid #D9D9D9; border-radius: 5px; padding: 6px;"><?php echo $row['origin']; ?></p>
|
|
</div>
|
|
<div>
|
|
<p><b>Lead Status</b></p>
|
|
<div class="flex flex-row">
|
|
<select class="w-full" name="status" id="status" style="border: 1px solid #D9D9D9; border-radius: 5px; padding: 6px; <?php echo $conditional_background_color; ?>">
|
|
<?php
|
|
$statusOptions = ['New', 'Contacted', 'Warm', 'Converted', 'Inactive', 'Disqualified'];
|
|
foreach ($statusOptions as $option) {
|
|
$selected = ($row['status'] === $option) ? 'selected' : '';
|
|
echo '<option value="' . $option . '" ' . $selected . '>' . ucfirst($option) . '</option>';
|
|
}
|
|
?>
|
|
</select>
|
|
<?php
|
|
if ($row['status'] == 'Warm') {
|
|
echo '<select class="w-full" name="warm_status" id="warm_status" style="border: 1px solid #D9D9D9; border-radius: 5px; padding: 6px;">';
|
|
$options = array("Proposal Sent", "Meeting Conducted", "Interested");
|
|
foreach ($options as $option) {
|
|
$selected = ($option == $row['warm_status']) ? 'selected' : '';
|
|
echo '<option value="' . $option . '" ' . $selected . '>' . $option . '</option>';
|
|
}
|
|
echo '</select>';
|
|
}
|
|
?>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="grid grid-cols-2 p-3 border-b-2 border-[#D9D9D9] space-x-6" style="text-align: left;">
|
|
<div>
|
|
<p><b>Coupon Code</b></p>
|
|
<input class="w-full" type="text" name="coupon_code" id="coupon_code" value="<?php echo $row['coupon_code']; ?>" style="border: 1px solid #D9D9D9; border-radius: 5px; padding: 6px;" />
|
|
</div>
|
|
<div>
|
|
<p><b>Time</b></p>
|
|
<p style="border: 1px solid #D9D9D9; border-radius: 5px; padding: 6px;"><?php echo $row['time']; ?></p>
|
|
</div>
|
|
</div>
|
|
<div class="grid grid-cols-2 p-3 border-b-2 border-[#D9D9D9] space-x-6" style="text-align: left;">
|
|
<div>
|
|
<p><b>Follow Update</b></p>
|
|
<input class="w-full" type="date" name="date" id="date" value="<?php echo $row['date']; ?>" style="border: 1px solid #D9D9D9; border-radius: 5px; padding: 6px;" />
|
|
</div>
|
|
</div>
|
|
<div style="padding: 10px; ">
|
|
<input type="submit" id="update_data" name="update_data" value="Update" style="background: linear-gradient(90deg, rgba(111, 107, 255, 0.91) 0%, rgba(68, 55, 128, 0.91) 100%); color: #fff; border-radius: 6px; padding: 10px 30px 10px 30px; float: right; cursor: pointer;" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
<div class="flex flex-col div-custom-margin">
|
|
<div class="bg-[#F6F6F6] rounded-xl p-3">
|
|
<div class="flex flex-row place-content-between" style="border-bottom: 2px solid #7E8299; border-style: dashed; padding-bottom: 3px;">
|
|
<p style="font-size: 25px; font-weight: bold;">Comments: <span><?php echo$totalRecords; ?></span></p>
|
|
<button id="toggleButton" style="background: linear-gradient(90deg, rgba(111, 107, 255, 0.91) 0%, rgba(68, 55, 128, 0.91) 100%); color: #fff; border-radius: 6px; padding: 6px 20px 6px 20px;">Add Comment</button>
|
|
</div>
|
|
<div>
|
|
<?php
|
|
if($_SERVER['REQUEST_METHOD'] == "POST" && $_POST['save_comment'] && $_POST['comments'] ){
|
|
try {
|
|
$local_lang = 'en';
|
|
$conn = new PDO("mysql:host=$mariaServer;dbname=$mariaDb", $mariaUser, $mariaPass);
|
|
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
|
|
$stmt = $conn->prepare("INSERT INTO comments (comments, user, locale, leadid) VALUES (:comments, :user, :locale, :leadid)");
|
|
$stmt->bindParam(':comments', $_POST['comments']);
|
|
$stmt->bindParam(':user', $_SESSION['email']);
|
|
$stmt->bindParam(':locale', $local_lang);
|
|
$stmt->bindParam(':leadid', $_GET['id']);
|
|
$stmt->execute();
|
|
echo "New Comment save successfully";
|
|
} catch(PDOException $e) {
|
|
echo "Error: " . $e->getMessage();
|
|
}
|
|
};
|
|
?>
|
|
<form class="" method="post" id="content" style="display: none;">
|
|
<div class="flex flex-row" style="margin-top: 10px; border-bottom: 2px solid #7E8299; padding-bottom: 10px;">
|
|
<input class="rounded-l-xl focus:outline-none w-1/2" type="text" name="comments" id="comments" style="border: 2px solid #363650; padding: 6px;" />
|
|
<input class="rounded-r-xl focus:outline-none" type="submit" value="Save" name="save_comment" id="save_comment" style="background: linear-gradient(90deg, rgba(111, 107, 255, 0.91) 0%, rgba(68, 55, 128, 0.91) 100%); color: #fff; padding: 8px 20px 8px 20px;" />
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div style="max-height: 265px; overflow-y: auto;">
|
|
<?php
|
|
try {
|
|
$conn = new PDO("mysql:host=$mariaServer;dbname=$mariaDb", $mariaUser, $mariaPass);
|
|
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
|
|
$stmt = $conn->prepare("SELECT * FROM comments WHERE leadid = :leadid ORDER BY created_at DESC");
|
|
$stmt->bindParam(':leadid', $_GET['id']);
|
|
$stmt->execute();
|
|
$rows = $stmt->fetchAll(PDO::FETCH_ASSOC);
|
|
foreach($rows as $row){
|
|
$commenter_name_parts = explode("@", $row['user']);
|
|
$commenter_first_name_letter = substr($commenter_name_parts[0], 0, 1);
|
|
$commenter_last_name_letter = substr($commenter_name_parts[count($commenter_name_parts) - 1], 0, 1);
|
|
?>
|
|
<div style="">
|
|
<div class="flex flex-row place-items-center" style="margin-top: 3px;">
|
|
<p class=" p-2" style="background: linear-gradient(180deg, #E4C1F9 0%, rgba(129, 126, 242, 0.91) 100%); border-radius: 50%; font-size: 20px; color: #fff; font-weight: bold; text-transform: uppercase;"><?php echo $commenter_first_name_letter.$commenter_last_name_letter; ?></p>
|
|
<p ><b style="font-size: 16px;"> <?php echo $row['user'] ?></b><br><?php echo date("Y-m-d", strtotime($row['created_at'])) ?></p>
|
|
<p style=""></p>
|
|
</div>
|
|
<p style="margin-top: 10px;"><?php echo $row['comments']; ?></p>
|
|
</div>
|
|
<?php
|
|
}
|
|
} catch (PDOException $e) {
|
|
echo "<p class='text-danger'>Error: " . $e->getMessage() . "</p>";
|
|
};
|
|
|
|
if($_SERVER['REQUEST_METHOD'] == "POST" && $_POST['appt_comment'] && $_POST['appt_date'] ){
|
|
try {
|
|
$conn = new PDO("mysql:host=$mariaServer;dbname=$mariaDb", $mariaUser, $mariaPass);
|
|
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
|
|
$stmt = $conn->prepare("INSERT INTO appointment (appt_date, email, name, leadid, comment) VALUES (:appt_date, :email, :name, :leadid, :comment)");
|
|
$stmt->bindParam(':appt_date', $_POST['appt_date']);
|
|
$stmt->bindParam(':email', $_SESSION['email']);
|
|
$stmt->bindParam(':name', $_SESSION['name']);
|
|
$stmt->bindParam(':leadid', $_GET['id']);
|
|
$stmt->bindParam(':comment', $_POST['comment']);
|
|
$stmt->execute();
|
|
$saved_message = "New Appointment save successfully";
|
|
} catch(PDOException $e) {
|
|
echo "Error: " . $e->getMessage();
|
|
}
|
|
};
|
|
if($_SERVER['REQUEST_METHOD'] == "POST" && $_POST['appt_comment_update'] && $_POST['appt_date'] ){
|
|
try {
|
|
$conn = new PDO("mysql:host=$mariaServer;dbname=$mariaDb", $mariaUser, $mariaPass);
|
|
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
|
|
$stmt = $conn->prepare("UPDATE appointment SET appt_date = :appt_date, comment = :comment WHERE id = :appointment_id AND leadid = :leadid");
|
|
$stmt->bindParam(':appt_date', $_POST['appt_date']);
|
|
$stmt->bindParam(':comment', $_POST['comment']);
|
|
$stmt->bindParam(':leadid', $_GET['id']);
|
|
$stmt->bindParam(':appointment_id', $_POST['appointment_id']);
|
|
|
|
$stmt->execute();
|
|
|
|
$saved_message = "Appointment updated successfully";
|
|
} catch(PDOException $e) {
|
|
echo "Error: " . $e->getMessage();
|
|
}
|
|
};
|
|
?>
|
|
</div>
|
|
</div>
|
|
<div class="flex flex-col mt-3 bg-[#F6F6F6] rounded-xl">
|
|
<div class="flex flex-row place-content-between p-3" style="border-bottom: 2px solid #7E8299; border-style: dashed;">
|
|
<div class="flex flex-col">
|
|
<p style="font-size: 20px; font-weight: bold;">Add Appointment</p>
|
|
<p><?php echo $saved_message; ?></p>
|
|
</div>
|
|
<button onclick="apptModal()" style="background: linear-gradient(180deg, #7875F4 0%, #46448E 100%); color: #fff; font-size: 20px; border-radius: 50%; padding: 0px 8px 0px 8px; height: fit-content;">+</button>
|
|
</div>
|
|
<div style="max-height: 265px; overflow-y: auto;">
|
|
<?php
|
|
try {
|
|
$conn = new PDO("mysql:host=$mariaServer;dbname=$mariaDb", $mariaUser, $mariaPass);
|
|
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
|
|
$stmt = $conn->prepare("SELECT * FROM appointment WHERE leadid = :leadid");
|
|
$stmt->bindParam(':leadid', $_GET['id']);
|
|
$stmt->execute();
|
|
$appt_data = $stmt->fetchAll(PDO::FETCH_ASSOC);
|
|
|
|
// Custom function to compare appointment dates
|
|
function compareAppointmentDates($a, $b) {
|
|
$dateA = new DateTime($a['appt_date']);
|
|
$dateB = new DateTime($b['appt_date']);
|
|
$currentDateTime = new DateTime();
|
|
|
|
// Compare appointment dates
|
|
if ($dateA == $dateB) {
|
|
return 0;
|
|
}
|
|
|
|
// Check if appointments are in the future or past
|
|
if ($dateA > $currentDateTime && $dateB > $currentDateTime) {
|
|
return ($dateA < $dateB) ? -1 : 1; // Sort by ascending date
|
|
} elseif ($dateA < $currentDateTime && $dateB < $currentDateTime) {
|
|
return ($dateA < $dateB) ? 1 : -1; // Sort by descending date
|
|
} else {
|
|
// One appointment is in the future and one is in the past
|
|
return ($dateA > $dateB) ? -1 : 1; // Sort the future appointment first
|
|
}
|
|
}
|
|
|
|
// Sort appointments based on appointment date
|
|
usort($appt_data, 'compareAppointmentDates');
|
|
foreach($appt_data as $appt){
|
|
$apptID = $appt['id'];
|
|
// echo $appt['name'];
|
|
$apptDate = explode(" ", $appt['appt_date']);
|
|
$currentDateTime = new DateTime();
|
|
$appointmentDateTime = new DateTime($appt['appt_date']);
|
|
|
|
if ($appointmentDateTime > $currentDateTime) {
|
|
$app_status = 'Next Appointment';
|
|
} elseif ($appointmentDateTime < $currentDateTime) {
|
|
$app_status = 'Expired Appointment';
|
|
} else {
|
|
$app_status = 'Today\'s Appointment';
|
|
}
|
|
?>
|
|
<div class="flex flex-col px-6" style="border-bottom: 2px solid #D9D9D9; ">
|
|
<div class="flex flex-row place-content-between align-items-center">
|
|
<p style="font-size: 15px; font-weight: bold;"><?php echo $app_status; ?></p>
|
|
<button style="color:#6F6BFF; font-weight: bold;" onclick="apptEditModal(<?php echo $apptID; ?>)">Edit</button>
|
|
</div>
|
|
<div class="grid grid-cols-3">
|
|
<p><?php echo $appt['comment']; ?></p>
|
|
<div class="flex flex-col" style="border-left: 3px solid #7875F4;">
|
|
<p style="font-weight: bold; padding-left: 6px;"><?php echo $apptDate[0]; ?></p>
|
|
<p style="padding-left: 6px;"><?php echo $apptDate[1]; ?></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="appt-edit-modal<?php echo $apptID; ?>" class="add-appt-edit-modal">
|
|
<div class="p-4">
|
|
<p onclick="apptEditModal(<?php echo $apptID; ?>)" style="font-size: 16px; color: #464E5F; border: 2px solid #464E5F; border-radius: 50%; float: right; padding: 2px 6px 2px 6px; cursor: pointer;">✘</p>
|
|
</div>
|
|
<form method="post" enctype="multipart/form-data" class="p-6 space-y-4">
|
|
<div class="flex flex-col">
|
|
<label for="appt_date">Appointment Date</label>
|
|
<input type="datetime-local" name="appt_date" id="appt_date" value="<?php echo $appt['appt_date'] ?>" style="border: 1px solid #D9D9D9; border-radius: 5px; padding: 6px;" />
|
|
</div>
|
|
<input type="text" name="appointment_id" id="appointment_id" value="<?php echo $appt['id']; ?>">
|
|
<div class="flex flex-col">
|
|
<label for="appt-comment">Description (if needed)</label>
|
|
<input type="text" name="comment" id="appt-comment" value="<?php echo $appt['comment'] ?>" style="border: 1px solid #D9D9D9; border-radius: 5px; padding: 6px;" />
|
|
</div>
|
|
<div class="flex flex-col">
|
|
<input class="rounded-xl focus:outline-none" type="submit" value="Update" name="appt_comment_update" id="appt_comment_update" style="background: linear-gradient(90deg, rgba(111, 107, 255, 0.91) 0%, rgba(68, 55, 128, 0.91) 100%); color: #fff; padding: 8px 20px 8px 20px; cursor: pointer;" />
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<?php
|
|
}
|
|
} catch (PDOException $e) {
|
|
echo "<p class='text-danger'>Error: " . $e->getMessage() . "</p>";
|
|
};
|
|
?>
|
|
</div>
|
|
</div>
|
|
<!-- This IS Right Side DIV -->
|
|
</div>
|
|
</div>
|
|
<?php
|
|
}
|
|
|
|
} catch (PDOException $e) {
|
|
echo "<p class='text-danger'>Error: " . $e->getMessage() . "</p>";
|
|
};
|
|
|
|
?>
|
|
<div id="appt-modal" class="add-appt-modal">
|
|
<p onclick="apptModal();" style="font-size: 16px; color: #464E5F; border: 2px solid #464E5F; border-radius: 50%; float: right; padding: 2px 6px 2px 6px; cursor: pointer;">✘</p>
|
|
<form method="post" enctype="multipart/form-data" class="p-6 space-y-4">
|
|
<div class="flex flex-col">
|
|
<label for="appt_date">Appointment Date</label>
|
|
<input type="datetime-local" name="appt_date" id="appt_date" style="border: 1px solid #D9D9D9; border-radius: 5px; padding: 6px;" />
|
|
</div>
|
|
<div class="flex flex-col">
|
|
<label for="appt-comment">Description (if needed)</label>
|
|
<input type="text" name="comment" id="appt-comment" style="border: 1px solid #D9D9D9; border-radius: 5px; padding: 6px;" />
|
|
</div>
|
|
<div class="flex flex-col">
|
|
<input class="rounded-xl focus:outline-none" type="submit" value="Add" name="appt_comment" id="appt_comment" style="background: linear-gradient(90deg, rgba(111, 107, 255, 0.91) 0%, rgba(68, 55, 128, 0.91) 100%); color: #fff; padding: 8px 20px 8px 20px; cursor: pointer;" />
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<script>
|
|
// Get all copy buttons
|
|
const copyButtons = document.querySelectorAll('.copy-btn');
|
|
|
|
// Attach click event listeners to each copy button
|
|
copyButtons.forEach(button => {
|
|
button.addEventListener('click', event => {
|
|
event.preventDefault(); // Prevent default button behavior
|
|
|
|
// Get the input ID associated with this button
|
|
const inputId = button.getAttribute('data-input-id');
|
|
// Get the input element by ID
|
|
const inputElement = document.getElementById(inputId);
|
|
|
|
// Check if the input element exists and has a value
|
|
if (inputElement && inputElement.value) {
|
|
// Copy the input value to the clipboard using Clipboard API
|
|
navigator.clipboard.writeText(inputElement.value)
|
|
.then(() => {
|
|
// Provide visual feedback to the user
|
|
button.classList.add('copied');
|
|
setTimeout(() => {
|
|
button.classList.remove('copied');
|
|
}, 1000); // Remove the 'copied' class after 2000ms
|
|
})
|
|
.catch(err => {
|
|
console.error('Unable to copy:', err);
|
|
});
|
|
}
|
|
});
|
|
});
|
|
|
|
|
|
|
|
// Function to fetch countries and populate the country dropdown
|
|
function fetchCountries() {
|
|
fetch('https://api.siliconpin.com/v3/list/country/')
|
|
.then(res => res.json())
|
|
.then(data => {
|
|
const countryDropdown = document.getElementById('country');
|
|
countryDropdown.innerHTML = '<option value="">Select Country</option>';
|
|
data.forEach(country => {
|
|
const option = document.createElement('option');
|
|
option.value = country.iso2;
|
|
option.text = country.name;
|
|
countryDropdown.appendChild(option);
|
|
});
|
|
});
|
|
}
|
|
|
|
function fetchStates() {
|
|
const selectedCountry = document.getElementById('country').value;
|
|
fetch(`https://api.siliconpin.com/v3/list/country/state/?country=${selectedCountry}`)
|
|
.then(res => res.json())
|
|
.then(data => {
|
|
const stateDropdown = document.getElementById('state');
|
|
stateDropdown.innerHTML = '<option value="">Select State</option>';
|
|
data.forEach(state => {
|
|
const option = document.createElement('option');
|
|
option.value = state.iso2;
|
|
option.text = state.name;
|
|
stateDropdown.appendChild(option);
|
|
});
|
|
});
|
|
}
|
|
|
|
function fetchCities() {
|
|
const selectedCountry = document.getElementById('country').value;
|
|
const selectedState = document.getElementById('state').value;
|
|
fetch(`https://api.siliconpin.com/v3/list/country/city/?country=${selectedCountry}&state=${selectedState}`)
|
|
.then(res => res.json())
|
|
.then(data => {
|
|
const cityDropdown = document.getElementById('city');
|
|
cityDropdown.innerHTML = '<option value="">Select City</option>';
|
|
data.forEach(city => {
|
|
const option = document.createElement('option');
|
|
option.value = city.name;
|
|
option.text = city.name;
|
|
cityDropdown.appendChild(option);
|
|
});
|
|
});
|
|
}
|
|
// fetchCountries();
|
|
let nameID = document.getElementById('name');
|
|
let addressID = document.getElementById('address');
|
|
let countryID = document.getElementById('country');
|
|
let stateID = document.getElementById('state');
|
|
let cityID = document.getElementById('city');
|
|
let phoneID = document.getElementById('phone');
|
|
let emailID = document.getElementById('email');
|
|
let professionID = document.getElementById('profession');
|
|
let statusID = document.getElementById('status');
|
|
let coupon_codeID = document.getElementById('coupon_code');
|
|
let dateID = document.getElementById('date');
|
|
// document.getElementById('editButton').addEventListener('click', function() {
|
|
// fetchCountries();
|
|
// nameID.disabled = false;
|
|
// addressID.disabled = false;
|
|
// countryID.disabled = false;
|
|
// stateID.disabled = false;
|
|
// cityID.disabled = false;
|
|
// phoneID.disabled = false;
|
|
// emailID.disabled = false;
|
|
// professionID.disabled = false;
|
|
// statusID.disabled = false;
|
|
// coupon_codeID.disabled = false;
|
|
// dateID.disabled = false;
|
|
// });
|
|
|
|
const toggleButton = document.getElementById('toggleButton');
|
|
const content = document.getElementById('content');
|
|
|
|
toggleButton.addEventListener('click', function() {
|
|
if (content.style.display === 'none') {
|
|
content.style.display = 'block';
|
|
toggleButton.textContent = 'Cancel';
|
|
} else {
|
|
content.style.display = 'none';
|
|
toggleButton.textContent = 'Add Comment';
|
|
}
|
|
});
|
|
function apptModal(){
|
|
let apptForm = document.getElementById('appt-modal');
|
|
if(apptForm.style.display === 'block'){
|
|
apptForm.style.display = 'none'
|
|
}else{
|
|
apptForm.style.display = 'block'
|
|
}
|
|
}
|
|
function apptEditModal(id){
|
|
let apptEditForm = document.getElementById('appt-edit-modal' + id);
|
|
if(apptEditForm.style.display === 'block'){
|
|
apptEditForm.style.display = 'none'
|
|
}else{
|
|
apptEditForm.style.display = 'block'
|
|
}
|
|
}
|
|
document.addEventListener('keydown', function(event){
|
|
if(event.keyCode === 27){
|
|
var apptModal = document.getElementById('appt-modal');
|
|
if(apptModal.style.display === 'block'){
|
|
apptModal.style.display = 'none';
|
|
};
|
|
var apptEditModal = document.getElementById('appt-edit-modal<?php echo $apptID; ?>');
|
|
if(apptEditModal.style.display === 'block'){
|
|
apptEditModal.style.display = 'none';
|
|
}
|
|
}
|
|
})
|
|
document.addEventListener('keydown', function(event) {
|
|
if (event.key === 'Escape') {
|
|
let editModals = document.querySelectorAll('.add-appt-edit-modal');
|
|
editModals.forEach(function(modal) {
|
|
modal.style.display = 'none';
|
|
});
|
|
}
|
|
});
|
|
</script>
|
|
<style>
|
|
.add-appt-modal, .add-appt-edit-modal{
|
|
background-color: #F8F8F8;
|
|
display: none;
|
|
position: fixed;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
width: 100%;
|
|
max-width: 600px;
|
|
box-shadow: 0px 0px 20px 0px #443780;
|
|
border-radius: 10px;
|
|
}
|
|
.copied {
|
|
background: linear-gradient(180deg, #E4C1F9 0%, rgba(129, 126, 242, 0.91) 100%);
|
|
border-radius: 5px;
|
|
color: #fff;
|
|
}
|
|
.responsive-flex {
|
|
display: flex;
|
|
flex-direction: row; /* Default value for screens wider than 1150px */
|
|
}
|
|
|
|
/* Media query for screens narrower than 1150px */
|
|
@media (max-width: 1150px) {
|
|
.responsive-flex {
|
|
flex-direction: column;
|
|
}
|
|
.div-custom-margin{
|
|
margin-top: 1rem;
|
|
width: 100%;
|
|
}
|
|
}
|
|
</style>
|