2026-04-13 19:04:12 +05:30

253 lines
13 KiB
PHP

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Add Doctor</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet">
<link rel="stylesheet" href="<?= base_url('css/app.css') ?>">
<link rel="stylesheet" href="<?= base_url('css/dashboard.css') ?>">
<link rel="stylesheet" href="<?= base_url('css/add_doctor.css') ?>">
</head>
<body class="app-body overview-layout">
<?php $validationErrors = validation_errors(); ?>
<?php $specializationOptions = $specializationOptions ?? [];
$isEdit = $isEdit ?? false;
$doctor = $doctor ?? null;
$user = $user ?? null;
$oldSpecializations = old('specialization', $selectedSpecializations ?? []);
if (! is_array($oldSpecializations)) {
$oldSpecializations = $oldSpecializations ? [(string) $oldSpecializations] : [];
}
?>
<aside class="ov-sidebar" id="sidebar">
<div class="ov-brand"><h1><i class="bi bi-hospital me-1"></i> DoctGuide</h1><span>Control Panel</span></div>
<nav class="ov-nav">
<div class="ov-nav__section">Main</div>
<a href="<?= base_url('admin/dashboard') ?>" class="ov-nav__link"><i class="bi bi-speedometer2"></i> Dashboard</a>
<div class="ov-nav__section">Manage</div>
<a href="<?= base_url('admin/doctors') ?>" class="ov-nav__link"><i class="bi bi-person-badge"></i> Doctors</a>
<div class="ov-nav__dropdown">
<a href="#" class="ov-nav__link d-flex justify-content-between align-items-center" onclick="toggleNavDropdown(event, this)">
<span><i class="bi bi-people"></i> Patients</span>
<i class="bi bi-chevron-down dropdown-icon"></i>
</a>
<div class="ov-dropdown-menu">
<a href="<?= base_url('admin/patients') ?>" class="ov-nav__sublink">Patient List</a>
<a href="<?= base_url('admin/patients/add') ?>" class="ov-nav__sublink">Add Patient</a>
</div>
</div>
<a href="<?= base_url('admin/appointments') ?>" class="ov-nav__link"><i class="bi bi-calendar2-check"></i> Appointments</a>
<a href="<?= base_url('admin/doctors/add') ?>" class="ov-nav__link active"><i class="bi bi-person-plus"></i> Add Doctor</a>
</nav>
<div class="ov-sidebar__footer"><a href="<?= base_url('logout') ?>"><i class="bi bi-box-arrow-left"></i> Logout</a></div>
</aside>
<div class="ov-main" id="mainContent">
<header class="ov-topbar">
<div class="d-flex align-items-center">
<button class="ov-toggle-btn" onclick="toggleSidebar()" title="Toggle Sidebar"><i class="bi bi-list" id="toggleIcon"></i></button>
<p class="ov-topbar__title mb-0"> Doctor Profile</p>
</div>
</header>
<main class="ov-content">
<?php if (session()->getFlashdata('error')): ?>
<div class="alert alert-danger app-alert"><?= esc(session()->getFlashdata('error')) ?></div>
<?php endif; ?>
<div class="ov-panel" style="max-width: 1080px;">
<div class="ov-panel__header">
<h2 class="ov-panel__title"><?= $isEdit ? 'Edit Doctor Account' : 'Create Doctor Account' ?></h2>
<a href="<?= base_url('admin/doctors') ?>" class="btn btn-sm btn-outline-secondary px-3">Back to doctors</a>
</div>
<div class="ov-panel__body">
<span class="badge bg-light text-dark border mb-3 p-2">Fields marked with <span class="text-danger">*</span> are required.</span>
<form method="post" action="<?= $isEdit ? base_url('admin/doctors/edit/' . encrypt_id($user['id'])) : base_url('admin/doctors/add') ?>" class="app-form" novalidate>
<?= csrf_field() ?>
<div class="row g-3">
<div class="col-md-6">
<?php
echo view('components/name_field', [
'fieldName' => 'first_name',
'fieldLabel' => 'First name',
'fieldId' => 'first_name',
'fieldValue' => old('first_name', $first_name ?? ''),
'required' => true,
'validationErrors' => $validationErrors,
'placeholder' => 'Enter first name'
]);
?>
</div>
<div class="col-md-6">
<?php
echo view('components/name_field', [
'fieldName' => 'last_name',
'fieldLabel' => 'Last name',
'fieldId' => 'last_name',
'fieldValue' => old('last_name', $last_name ?? ''),
'required' => true,
'validationErrors' => $validationErrors,
'placeholder' => 'Enter last name'
]);
?>
</div>
<div class="col-md-6">
<label class="form-label" for="email">Email <span class="text-danger">*</span></label>
<input type="email" name="email" id="email" onblur="checkEmail()" value="<?= esc(old('email', $user['email'] ?? '')) ?>" class="form-control <?= isset($validationErrors['email']) ? 'is-invalid' : '' ?>" autocomplete="off" placeholder="example@gmail.com" required>
<small id="emailError" class="text-danger"></small>
<?= validation_show_error('email') ?>
</div>
<div class="col-md-6">
<label class="form-label" for="specialization">Specialization <span class="text-danger">*</span></label>
<div class="multi-select-arrow-wrap">
<select name="specialization[]" id="specialization" class="form-select <?= isset($validationErrors['specialization']) ? 'is-invalid' : '' ?>" multiple required>
<?php foreach ($specializationOptions as $option): ?>
<option value="<?= esc($option) ?>" <?= in_array($option, $oldSpecializations, true) ? 'selected' : '' ?>>
<?= esc($option) ?>
</option>
<?php endforeach; ?>
<?php foreach ($oldSpecializations as $selected): ?>
<?php if (! in_array($selected, $specializationOptions, true)): ?>
<option value="<?= esc($selected) ?>" selected><?= esc($selected) ?></option>
<?php endif; ?>
<?php endforeach; ?>
</select>
<i class="bi bi-chevron-down select2-arrow-hint" aria-hidden="true"></i>
</div>
<?= validation_show_error('specialization') ?>
</div>
<div class="col-md-6">
<label class="form-label" for="experience_years">Experience <span class="text-danger">*</span></label>
<div class="row g-0 experience-group">
<div class="col-6 ">
<div class="input-group">
<input type="number" name="experience_years" id="experience_years" value="<?= esc(old('experience_years', $experience_years ?? '')) ?>" class="form-control <?= isset($validationErrors['experience_years']) ? 'is-invalid' : '' ?>" min="0" max="60" placeholder="0" required>
<span class="input-group-text experience-unit">Years</span>
</div>
<?= validation_show_error('experience_years') ?>
</div>
<div class="col-6">
<div class="input-group">
<input type="number" name="experience_months" id="experience_months" value="<?= esc(old('experience_months', $experience_months ?? '')) ?>" class="form-control <?= isset($validationErrors['experience_months']) ? 'is-invalid' : '' ?>" min="0" max="11" placeholder="0" required>
<span class="input-group-text experience-unit">Months</span>
</div>
<?= validation_show_error('experience_months') ?>
</div>
</div>
</div>
<div class="col-md-6">
<label class="form-label" for="fees">Consultation fee</label>
<input type="number" name="fees" id="fees" value="<?= esc(old('fees', $doctor['fees'] ?? '')) ?>" class="form-control <?= isset($validationErrors['fees']) ? 'is-invalid' : '' ?>" placeholder="e.g. 500.00" step="0.01" min="0">
<?= validation_show_error('fees') ?>
</div>
</div>
<div class="d-flex flex-wrap gap-4 justify-content-between mt-4">
<a href="<?= base_url('admin/dashboard') ?>" class="btn btn-outline-secondary rounded-pill px-3">Cancel</a>
<button type="submit" class="btn btn-app-primary px-4 py-2"><?= $isEdit ? 'Update doctor' : 'Add doctor' ?></button>
</div>
</form>
</div>
</div>
</main>
</div>
<script>
function toggleSidebar() {
const sidebar = document.getElementById('sidebar');
const main = document.getElementById('mainContent');
const icon = document.getElementById('toggleIcon');
sidebar.classList.toggle('collapsed');
main.classList.toggle('expanded');
icon.className = sidebar.classList.contains('collapsed') ? 'bi bi-layout-sidebar' : 'bi bi-list';
}
function toggleNavDropdown(event, element) {
event.preventDefault();
element.parentElement.classList.toggle('active');
}
</script>
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
<script>
$(function () {
const $specialization = $('#specialization');
const $specializationArrow = $('.select2-arrow-hint');
let isSpecializationOpen = false;
$specialization.select2({
placeholder: 'Select or type specializations',
tags: true,
width: '100%',
tokenSeparators: [',']
});
$specialization.on('select2:open', function () {
isSpecializationOpen = true;
$specializationArrow.removeClass('bi-chevron-down').addClass('bi-chevron-up');
});
$specialization.on('select2:close', function () {
isSpecializationOpen = false;
$specializationArrow.removeClass('bi-chevron-up').addClass('bi-chevron-down');
});
$specializationArrow.on('mousedown', function (event) {
event.preventDefault();
event.stopPropagation();
if (isSpecializationOpen) {
$specialization.select2('close');
return;
}
$specialization.select2('open');
});
});
function checkEmail() {
let email = document.getElementById("email").value;
let errorField = document.getElementById("emailError");
const excludeId = <?= $isEdit ? (int) ($user['id'] ?? 0) : 0 ?>;
if (email === "") {
errorField.innerText = "";
document.getElementById("email").classList.remove("is-invalid");
return;
}
fetch("<?= base_url('check-email') ?>", {
method: "POST",
headers: {
"Content-Type": "application/x-www-form-urlencoded",
},
body: "email=" + encodeURIComponent(email)
+ "&exclude_id=" + encodeURIComponent(excludeId)
+ "&<?= csrf_token() ?>=<?= csrf_hash() ?>",
})
.then(response => response.json())
.then(data => {
if (data.exists) {
errorField.innerText = "Email already exists!";
document.getElementById("email").classList.add("is-invalid");
} else {
errorField.innerText = "";
document.getElementById("email").classList.remove("is-invalid");
}
})
.catch(error => console.log(error));
}
</script>
</body>
</html>