<?php
// teacher/availability-content.php - محتوای ثبت اطلاعات و زمان‌های تدریس
?>

<!-- ============================================================
     پیام‌ها
     ============================================================ -->
<?php if (!empty($message)): ?>
<div class="alert alert-<?= $messageType ?>">
    <i class="fas <?= $messageType == 'danger' ? 'fa-exclamation-circle' : 'fa-check-circle' ?>"></i>
    <?= $message ?>
</div>
<?php endif; ?>

<!-- ============================================================
     اعلان مدیریت
     ============================================================ -->
<?php if ($announcement): ?>
<div style="margin-bottom:20px;padding:16px 20px;background:linear-gradient(135deg, #fef3c7, #fde68a);border-radius:12px;border:1px solid #f59e0b;">
    <div style="display:flex;align-items:flex-start;gap:12px;">
        <i class="fas fa-bullhorn" style="color:#d97706;font-size:24px;margin-top:4px;"></i>
        <div>
            <h4 style="font-size:16px;font-weight:700;color:#92400e;margin:0;">📢 <?= htmlspecialchars($announcement['title'] ?? 'اعلان مهم') ?></h4>
            <p style="font-size:14px;color:#78350f;margin-top:4px;"><?= nl2br(htmlspecialchars($announcement['content'])) ?></p>
            <span style="font-size:11px;color:#92400e;">تاریخ انتشار: <?= jalaliDate($announcement['created_at']) ?></span>
        </div>
    </div>
</div>
<?php endif; ?>

<!-- ============================================================
     وضعیت ثبت زمان‌ها
     ============================================================ -->
<?php if ($submissionStatus): ?>
<div style="margin-bottom:16px;padding:12px 16px;border-radius:8px;border:1px solid <?= 
    $submissionStatus == 'approved' ? '#86efac' : 
    ($submissionStatus == 'pending' ? '#fcd34d' : 
    ($submissionStatus == 'needs_revision' ? '#fcd34d' : '#fca5a5')) ?>;background:<?= 
    $submissionStatus == 'approved' ? '#d1fae5' : 
    ($submissionStatus == 'pending' ? '#fef3c7' : 
    ($submissionStatus == 'needs_revision' ? '#fef3c7' : '#fecaca')) ?>;">
    
    <div style="display:flex;align-items:center;gap:10px;">
        <i class="fas <?= 
            $submissionStatus == 'approved' ? 'fa-check-circle' : 
            ($submissionStatus == 'pending' ? 'fa-clock' : 
            ($submissionStatus == 'needs_revision' ? 'fa-edit' : 'fa-times-circle')) ?>" 
           style="font-size:20px;color:<?= 
            $submissionStatus == 'approved' ? '#059669' : 
            ($submissionStatus == 'pending' ? '#d97706' : 
            ($submissionStatus == 'needs_revision' ? '#d97706' : '#dc2626')) ?>;">
        </i>
        <div>
            <strong style="color:<?= 
                $submissionStatus == 'approved' ? '#065f46' : 
                ($submissionStatus == 'pending' ? '#92400e' : 
                ($submissionStatus == 'needs_revision' ? '#92400e' : '#991b1b')) ?>;">
                <?php if ($submissionStatus == 'approved'): ?>
                    ✅ زمان‌های شما تأیید شده است
                <?php elseif ($submissionStatus == 'pending'): ?>
                    ⏳ زمان‌های شما در انتظار تأیید مدیر است
                <?php elseif ($submissionStatus == 'needs_revision'): ?>
                    ✏️ مدیر درخواست اصلاح زمان‌ها را داده است. لطفاً اصلاح کنید.
                <?php elseif ($submissionStatus == 'rejected'): ?>
                    ❌ زمان‌های شما رد شده است. لطفاً دوباره ثبت کنید.
                <?php endif; ?>
            </strong>
            <?php if ($submissionStatus == 'approved'): ?>
                <div style="font-size:13px;color:#065f46;margin-top:4px;">
                    <i class="fas fa-lock"></i> زمان‌ها قفل شده و قابل ویرایش نیستند.
                </div>
            <?php endif; ?>
        </div>
    </div>
</div>
<?php endif; ?>

<!-- ============================================================
     فرم یکپارچه
     ============================================================ -->
<div class="card">
    <form method="POST" action="">
        <input type="hidden" name="action" value="save_all">
        
        <!-- ===== بخش ۱: اطلاعات تحصیلی ===== -->
        <div style="margin-bottom:24px;padding-bottom:16px;border-bottom:2px solid #e5e7eb;">
            <h4 style="font-size:17px;font-weight:700;color:#1f2937;margin-bottom:16px;display:flex;align-items:center;gap:8px;">
                <i class="fas fa-user-graduate" style="color:#1a237e;"></i>
                اطلاعات تحصیلی
                <span style="font-size:12px;color:#dc2626;font-weight:400;">(اجباری)</span>
            </h4>
            
            <div style="display:grid;grid-template-columns:1fr 1fr;gap:16px;">
                <div class="form-group">
                    <label style="display:block;font-weight:600;color:#374151;margin-bottom:5px;font-size:14px;">
                        رشته تحصیلی <span style="color:#dc2626;">*</span>
                    </label>
                    <input type="text" name="field_of_study" class="form-control" 
                           value="<?= htmlspecialchars($teacherInfo['field_of_study'] ?? '') ?>" 
                           placeholder="مثال: مهندسی نرم‌افزار" 
                           style="width:100%;padding:10px 14px;border:2px solid #e5e7eb;border-radius:8px;font-size:14px;" 
                           <?= ($submissionStatus == 'approved') ? 'readonly disabled' : '' ?> required>
                </div>
                <div class="form-group">
                    <label style="display:block;font-weight:600;color:#374151;margin-bottom:5px;font-size:14px;">
                        مدرک تحصیلی <span style="color:#dc2626;">*</span>
                    </label>
                    <select name="degree" class="form-control" style="width:100%;padding:10px 14px;border:2px solid #e5e7eb;border-radius:8px;font-size:14px;background:white;" 
                            <?= ($submissionStatus == 'approved') ? 'disabled' : '' ?> required>
                        <option value="">انتخاب مدرک...</option>
                        <option value="کارشناسی" <?= ($teacherInfo['degree'] ?? '') == 'کارشناسی' ? 'selected' : '' ?>>کارشناسی</option>
                        <option value="کارشناسی ارشد" <?= ($teacherInfo['degree'] ?? '') == 'کارشناسی ارشد' ? 'selected' : '' ?>>کارشناسی ارشد</option>
                        <option value="دکتری" <?= ($teacherInfo['degree'] ?? '') == 'دکتری' ? 'selected' : '' ?>>دکتری</option>
                    </select>
                </div>
            </div>
            
            <div class="form-group" style="margin-top:12px;">
                <label style="display:block;font-weight:600;color:#374151;margin-bottom:5px;font-size:14px;">
                    دروس مورد علاقه برای تدریس <span style="color:#dc2626;">*</span>
                </label>
                <textarea name="preferred_courses" class="form-control" rows="2" 
                          placeholder="مثال: ریاضی ۱، فیزیک، برنامه‌نویسی وب..." 
                          style="width:100%;padding:10px 14px;border:2px solid #e5e7eb;border-radius:8px;font-size:14px;resize:vertical;"
                          <?= ($submissionStatus == 'approved') ? 'readonly disabled' : '' ?> required><?= htmlspecialchars($teacherInfo['preferred_courses'] ?? '') ?></textarea>
                <small style="color:#9ca3af;font-size:12px;display:block;margin-top:4px;">
                    دروس مورد علاقه خود را با کاما جدا کنید.
                </small>
            </div>
        </div>
        
        <!-- ===== بخش ۲: زمان‌های تدریس ===== -->
        <div>
            <h4 style="font-size:17px;font-weight:700;color:#1f2937;margin-bottom:16px;display:flex;align-items:center;gap:8px;">
                <i class="fas fa-clock" style="color:#1a237e;"></i>
                زمان‌های قابل تدریس
                <?php if ($activeTerm): ?>
                    <span style="font-size:13px;color:#9ca3af;font-weight:400;">(<?= htmlspecialchars($activeTerm['name']) ?>)</span>
                <?php endif; ?>
                <span style="font-size:12px;color:#dc2626;font-weight:400;">(اجباری)</span>
            </h4>
            
            <?php if (!$activeTerm): ?>
                <div style="text-align:center;padding:30px;color:#dc2626;background:#fecaca;border-radius:8px;">
                    <i class="fas fa-exclamation-triangle" style="font-size:24px;display:block;margin-bottom:8px;"></i>
                    هیچ ترم فعالی وجود ندارد. لطفاً با مدیر سامانه تماس بگیرید.
                </div>
            <?php else: ?>
            
            <div style="margin-bottom:16px;padding:12px 16px;background:#f8fafc;border-radius:8px;border:1px solid #e5e7eb;">
                <div style="display:flex;flex-wrap:wrap;gap:8px;justify-content:center;">
                    <span style="font-size:12px;color:#6b7280;">⏰ سانس‌ها:</span>
                    <span style="font-size:12px;color:#1f2937;background:#e5e7eb;padding:2px 10px;border-radius:12px;">۸-۱۰</span>
                    <span style="font-size:12px;color:#1f2937;background:#e5e7eb;padding:2px 10px;border-radius:12px;">۱۰-۱۲</span>
                    <span style="font-size:12px;color:#1f2937;background:#e5e7eb;padding:2px 10px;border-radius:12px;">۱۲-۱۴</span>
                    <span style="font-size:12px;color:#1f2937;background:#e5e7eb;padding:2px 10px;border-radius:12px;">۱۴-۱۶</span>
                    <span style="font-size:12px;color:#1f2937;background:#e5e7eb;padding:2px 10px;border-radius:12px;">۱۶-۱۸</span>
                    <span style="font-size:12px;color:#1f2937;background:#e5e7eb;padding:2px 10px;border-radius:12px;">۱۸-۲۰</span>
                </div>
            </div>
            
            <div class="table-responsive">
                <table style="width:100%;border-collapse:collapse;font-size:14px;">
                    <thead>
                        <tr style="background:#f8fafc;border-bottom:2px solid #e5e7eb;">
                            <th style="padding:10px 12px;text-align:right;color:#6b7280;font-weight:600;min-width:100px;">روز هفته</th>
                            <?php 
                            $slots = ['08-10', '10-12', '12-14', '14-16', '16-18', '18-20'];
                            $slotLabels = ['۸-۱۰', '۱۰-۱۲', '۱۲-۱۴', '۱۴-۱۶', '۱۶-۱۸', '۱۸-۲۰'];
                            foreach ($slotLabels as $label):
                            ?>
                            <th style="padding:10px 12px;text-align:center;color:#6b7280;font-weight:600;font-size:12px;"><?= $label ?></th>
                            <?php endforeach; ?>
                        </tr>
                    </thead>
                    <tbody>
                        <?php 
                        $days = [
                            'saturday' => 'شنبه',
                            'sunday' => 'یک‌شنبه',
                            'monday' => 'دوشنبه',
                            'tuesday' => 'سه‌شنبه',
                            'wednesday' => 'چهارشنبه',
                            'thursday' => 'پنج‌شنبه'
                        ];
                        
                        $savedMap = [];
                        foreach ($savedSlots as $s) {
                            $savedMap[$s['day_of_week']][$s['time_slot']] = true;
                        }
                        
                        foreach ($days as $dayKey => $dayLabel):
                            $dayHasSlot = isset($savedMap[$dayKey]) && count($savedMap[$dayKey]) > 0;
                        ?>
                        <tr style="border-bottom:1px solid #f3f4f6;">
                            <td style="padding:10px 12px;font-weight:600;color:#1f2937;">
                                <?= $dayLabel ?>
                                <?php if ($dayHasSlot && $submissionStatus != 'approved'): ?>
                                    <span style="font-size:11px;color:#059669;background:#d1fae5;padding:1px 10px;border-radius:12px;margin-right:6px;">✅ انتخاب شده</span>
                                <?php endif; ?>
                            </td>
                            <?php foreach ($slots as $slot): 
                                $isChecked = isset($savedMap[$dayKey][$slot]);
                            ?>
                            <td style="padding:8px 12px;text-align:center;">
                                <label style="display:inline-block;cursor:pointer;">
                                    <input type="checkbox" name="days[]" value="<?= $dayKey ?>" 
                                           style="display:none;" 
                                           class="day-checkbox" 
                                           data-day="<?= $dayKey ?>"
                                           <?= $dayHasSlot ? 'checked' : '' ?>>
                                    <input type="checkbox" name="slots[]" value="<?= $slot ?>" 
                                           <?= $isChecked ? 'checked' : '' ?>
                                           class="slot-checkbox" 
                                           data-day="<?= $dayKey ?>"
                                           data-slot="<?= $slot ?>"
                                           style="width:18px;height:18px;cursor:pointer;accent-color:#1a237e;"
                                           <?= ($submissionStatus == 'approved') ? 'disabled' : '' ?>>
                                </label>
                            </td>
                            <?php endforeach; ?>
                        </tr>
                        <?php endforeach; ?>
                    </tbody>
                </table>
            </div>
            
            <div style="display:flex;flex-wrap:wrap;gap:8px;margin:12px 0;" <?= ($submissionStatus == 'approved') ? 'style="opacity:0.5;pointer-events:none;"' : '' ?>>
                <button type="button" class="btn btn-outline" onclick="selectAllDays()" style="padding:4px 14px;font-size:12px;border:1px solid #e5e7eb;border-radius:6px;cursor:pointer;background:transparent;color:#6b7280;">
                    <i class="fas fa-check-double"></i> انتخاب همه روزها
                </button>
                <button type="button" class="btn btn-outline" onclick="deselectAllDays()" style="padding:4px 14px;font-size:12px;border:1px solid #e5e7eb;border-radius:6px;cursor:pointer;background:transparent;color:#6b7280;">
                    <i class="fas fa-times"></i> لغو همه
                </button>
                <button type="button" class="btn btn-outline" onclick="selectAllSlots()" style="padding:4px 14px;font-size:12px;border:1px solid #e5e7eb;border-radius:6px;cursor:pointer;background:transparent;color:#6b7280;">
                    <i class="fas fa-clock"></i> انتخاب همه سانس‌ها
                </button>
            </div>
            
            <?php endif; ?>
        </div>
        
        <!-- ===== دکمه ارسال ===== -->
        <?php if ($submissionStatus != 'approved'): ?>
        <div style="margin-top:20px;padding-top:16px;border-top:2px solid #e5e7eb;display:flex;gap:12px;flex-wrap:wrap;">
            <button type="submit" class="btn btn-success" style="padding:12px 32px;border:none;border-radius:8px;font-size:16px;font-weight:700;cursor:pointer;background:#10b981;color:white;transition:all 0.3s;display:inline-flex;align-items:center;gap:10px;box-shadow:0 4px 12px rgba(16,185,129,0.3);">
                <i class="fas fa-paper-plane"></i> ثبت اطلاعات و ارسال برای تأیید
            </button>
            <a href="availability.php" class="btn btn-outline" style="padding:12px 24px;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;text-decoration:none;background:transparent;color:#6b7280;border:2px solid #e5e7eb;transition:all 0.3s;display:inline-flex;align-items:center;gap:6px;">
                <i class="fas fa-redo"></i> بازنشانی
            </a>
        </div>
        <?php else: ?>
        <div style="margin-top:20px;padding:12px 20px;background:#d1fae5;border-radius:8px;border:1px solid #86efac;text-align:center;">
            <i class="fas fa-check-circle" style="color:#059669;font-size:20px;"></i>
            <span style="font-weight:600;color:#065f46;font-size:15px;">اطلاعات شما تأیید شده است و قابل ویرایش نیست.</span>
        </div>
        <?php endif; ?>
        
    </form>
</div>

<script>
function selectAllDays() {
    document.querySelectorAll('.day-checkbox').forEach(cb => {
        cb.checked = true;
        var day = cb.getAttribute('data-day');
        document.querySelectorAll('.slot-checkbox[data-day="' + day + '"]').forEach(slot => {
            slot.checked = true;
        });
    });
    updateDayLabels();
}

function deselectAllDays() {
    document.querySelectorAll('.day-checkbox').forEach(cb => {
        cb.checked = false;
        var day = cb.getAttribute('data-day');
        document.querySelectorAll('.slot-checkbox[data-day="' + day + '"]').forEach(slot => {
            slot.checked = false;
        });
    });
    updateDayLabels();
}

function selectAllSlots() {
    document.querySelectorAll('.slot-checkbox').forEach(cb => cb.checked = true);
    updateDayLabels();
}

function updateDayLabels() {
    document.querySelectorAll('.day-checkbox').forEach(function(dayCheckbox) {
        var day = dayCheckbox.getAttribute('data-day');
        var anySlotChecked = false;
        document.querySelectorAll('.slot-checkbox[data-day="' + day + '"]').forEach(function(slot) {
            if (slot.checked) {
                anySlotChecked = true;
            }
        });
        dayCheckbox.checked = anySlotChecked;
        
        var dayCell = dayCheckbox.closest('tr').querySelector('td:first-child');
        if (dayCell) {
            var labelSpan = dayCell.querySelector('.day-label-status');
            if (!labelSpan) {
                labelSpan = document.createElement('span');
                labelSpan.className = 'day-label-status';
                labelSpan.style.cssText = 'font-size:11px;color:#059669;background:#d1fae5;padding:1px 10px;border-radius:12px;margin-right:6px;';
                dayCell.appendChild(labelSpan);
            }
            if (anySlotChecked) {
                labelSpan.textContent = '✅ انتخاب شده';
                labelSpan.style.display = 'inline';
            } else {
                labelSpan.style.display = 'none';
            }
        }
    });
}

document.addEventListener('DOMContentLoaded', function() {
    document.querySelectorAll('.slot-checkbox').forEach(function(slotCheckbox) {
        slotCheckbox.addEventListener('change', function() {
            var day = this.getAttribute('data-day');
            var anySlotChecked = false;
            document.querySelectorAll('.slot-checkbox[data-day="' + day + '"]').forEach(function(slot) {
                if (slot.checked) {
                    anySlotChecked = true;
                }
            });
            var dayCheckbox = document.querySelector('.day-checkbox[data-day="' + day + '"]');
            if (dayCheckbox) {
                dayCheckbox.checked = anySlotChecked;
            }
            updateDayLabels();
        });
    });
    
    updateDayLabels();
});
</script>

<style>
.alert {
    padding:12px 16px;
    border-radius:8px;
    margin-bottom:16px;
}
.alert-danger {
    background:#fecaca;
    color:#991b1b;
    border:1px solid #fca5a5;
}
.alert-success {
    background:#d1fae5;
    color:#065f46;
    border:1px solid #a7f3d0;
}
.alert-warning {
    background:#fef3c7;
    color:#92400e;
    border:1px solid #fcd34d;
}
.form-control:focus {
    border-color: #1a237e !important;
    box-shadow: 0 0 0 3px rgba(26,35,126,0.1) !important;
    outline: none;
}
.btn-outline:hover {
    background:#f8fafc;
    border-color:#1a237e;
    color:#1a237e;
}
.btn-success:hover {
    background:#059669 !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(16,185,129,0.4) !important;
}
</style>