@extends('layouts.performance')

@section('title', 'Görevlerim')

@section('perf-content')
@php
    $activeCount = $activeTasks->count();
    $replyCount = $replyTasks->count();
    $completedCount = $completedTasks->count();
    $currentTasks = $tab === 'reply' ? $replyTasks : ($tab === 'completed' ? $completedTasks : $activeTasks);
@endphp

<div class="d-flex flex-wrap align-items-center justify-content-between gap-3 mb-4">
    <div>
        <h1 class="h4 mb-1">Görevlerim</h1>
        <p class="text-muted mb-0">Aktif görevlerinizi, cevap bekleyenleri ve kapananları izleyin.</p>
    </div>
</div>

@if (!$tasksReady)
    <div class="alert alert-warning">Görev tabloları hazır değil. Migration çalıştırılmalıdır.</div>
@elseif (request()->query('responded'))
    <div class="alert alert-soft">Görev yanıtı kaydedildi.</div>
@elseif (request()->query('error'))
    <div class="alert alert-danger">{{ session('task_error', "\u{0130}\u{015f}lem s\u{0131}ras\u{0131}nda hata olu\u{015f}tu.") }}</div>
@endif

<ul class="nav nav-pills assignment-tabs mb-3" role="tablist">
    <li class="nav-item">
        <a class="nav-link {{ $tab === 'active' ? 'active' : '' }}"
           href="{{ route('admin.tasks.index', ['tab' => 'active']) }}">
            Aktif Görevler ({{ $activeCount }})
        </a>
    </li>
    <li class="nav-item">
        <a class="nav-link {{ $tab === 'reply' ? 'active' : '' }}"
           href="{{ route('admin.tasks.index', ['tab' => 'reply']) }}">
            Cevap Bekleyenler ({{ $replyCount }})
        </a>
    </li>
    <li class="nav-item">
        <a class="nav-link {{ $tab === 'completed' ? 'active' : '' }}"
           href="{{ route('admin.tasks.index', ['tab' => 'completed']) }}">
            Kapanan Görevler ({{ $completedCount }})
        </a>
    </li>
</ul>

<div class="row g-4">
    <div class="col-12 col-xl-8">
        <div class="card h-100">
            <div class="card-header">
                <div class="d-flex flex-wrap align-items-center justify-content-between gap-2">
                    <h5 class="card-title mb-0">
                        @if ($tab === 'reply')
                            Cevap Bekleyen Görevler
                        @elseif ($tab === 'completed')
                            Kapanan Görevler
                        @else
                            Aktif Görevler
                        @endif
                    </h5>
            <span class="text-muted small">Toplam {{ $currentTasks->count() }} kayıt</span>
                </div>
            </div>
            <div class="card-body p-0">
                <div class="table-responsive">
                    <table class="table align-middle table-hover mb-0">
                        <thead class="table-light">
                        <tr>
                            <th>Görev</th>
                            <th>Atayan</th>
                            <th>Öncelik</th>
                            <th>Son Tarih</th>
                            <th>Durum</th>
                            <th class="text-end">İşlem</th>
                        </tr>
                        </thead>
                        <tbody>
                        @forelse ($currentTasks as $task)
                            @php
                                $priority = (string) data_get($task, 'priority', 'normal');
                                $priorityLabel = $priority === 'high'
                                    ? "Y\u{00fc}ksek"
                                    : ($priority === 'low' ? "D\u{00fc}\u{015f}\u{00fc}k" : 'Orta');
                                $priorityClass = $priority === 'high' ? 'bg-danger' : ($priority === 'low' ? 'bg-info' : 'bg-warning');
                                $assignmentStatus = (string) data_get($task, 'assignment_status', 'assigned');
                                $statusLabel = $assignmentStatus === 'completed'
                                    ? "Tamamland\u{0131}"
                                    : ($assignmentStatus === 'in_progress' ? "\u{0130}\u{015f}lemde" : "A\u{00e7}\u{0131}k");
                                $requiredTypesRaw = (string) data_get($task, 'required_attachment_types', '');
                                $requiredTypes = array_values(array_filter(array_map('trim', explode(',', $requiredTypesRaw))));
                                $requiredAccept = $requiredTypes ? '.' . implode(',.', $requiredTypes) : '';
                                $requiredLabel = '';
                                $requiredGroupCount = 0;
                                if ($requiredTypes) {
                                    $labels = [];
                                    if (in_array('pdf', $requiredTypes, true)) {
                                        $labels[] = 'PDF';
                                    }
                                    if (array_intersect($requiredTypes, ['xls', 'xlsx'])) {
                                        $labels[] = 'EXCEL';
                                    }
                                    if (array_intersect($requiredTypes, ['doc', 'docx'])) {
                                        $labels[] = 'WORD';
                                    }
                                    $photoExts = [];
                                    if (in_array('jpg', $requiredTypes, true)) {
                                        $photoExts[] = 'JPG';
                                    }
                                    if (in_array('jpeg', $requiredTypes, true)) {
                                        $photoExts[] = 'JPEG';
                                    }
                                    if (in_array('png', $requiredTypes, true)) {
                                        $photoExts[] = 'PNG';
                                    }
                                    if ($photoExts) {
                                        $labels[] = "FOTO\u{011f}RAF (" . implode(', ', $photoExts) . ')';
                                    }
                                    $requiredLabel = implode(', ', $labels);
                                    $requiredGroupCount = count($labels);
                                }
                            @endphp
                            <tr>
                                <td>
                                    <div class="fw-semibold">{{ data_get($task, 'title', '-') }}</div>
                                    <div class="text-muted small task-desc" title="{{ data_get($task, 'description', '') }}">
                                        {{ data_get($task, 'description', '-') }}
                                    </div>
                                    @if (!empty($task->attachment_path))
                                        <div class="mt-1">
                                            <a class="small" href="{{ asset($task->attachment_path) }}" target="_blank" rel="noopener">
                                                Dosya
                                            </a>
                                            <span class="text-muted small">{{ $task->attachment_name ?? '' }}</span>
                                        </div>
                                    @endif
                                </td>
                                <td>{{ data_get($task, 'assigned_by', '-') }}</td>
                                <td><span class="badge {{ $priorityClass }}">{{ $priorityLabel }}</span></td>
                                <td>{{ data_get($task, 'due_date', '-') }}</td>
                                <td>{{ $statusLabel }}</td>
                                <td class="text-end">
                                    @if ($tab === 'reply')
                                        @if ($responsesReady)
                                            <button type="button"
                                                    class="btn btn-sm btn-outline-primary task-reply-btn"
                                                    data-bs-toggle="modal"
                                                    data-bs-target="#taskReplyModal"
                                                    data-action="{{ route('admin.tasks.respond', ['id' => $task->assignment_id]) }}"
                                                    data-assignment-id="{{ (int) $task->assignment_id }}"
                                                    data-title="{{ e(data_get($task, 'title', '-')) }}"
                                                    data-description="{{ e(data_get($task, 'description', '')) }}"
                                                    data-assigned="{{ e(data_get($task, 'assigned_by', '-')) }}"
                                                    data-due="{{ e(data_get($task, 'due_date', '-')) }}"
                                                    data-priority="{{ $priorityLabel }}"
                                                    data-priority-class="{{ $priorityClass }}"
                                                    data-required-label="{{ e($requiredLabel) }}"
                                                    data-required-group-count="{{ $requiredGroupCount }}"
                                                    data-required-accept="{{ $requiredAccept }}">
                                                Yanıtla
                                            </button>
                                            @if (!empty($task->form_template_id))
                                                <a class="btn btn-sm btn-outline-secondary ms-2"
                                                   href="{{ route('admin.tasks.form', ['id' => $task->assignment_id]) }}">
                                                    Formu Doldur
                                                </a>
                                            @endif
                                        @else
                                            <span class="text-muted small">Yanıt kapalı</span>
                                        @endif
                                    @else
                                        <span class="text-muted small">-</span>
                                    @endif
                                </td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="6" class="text-center text-muted py-4">
                                    {{ $tab === 'reply'
                                        ? "Cevap bekleyen g\u{00f6}rev bulunmuyor."
                                        : ($tab === 'completed' ? "Kapanan g\u{00f6}rev bulunmuyor." : "Aktif g\u{00f6}rev bulunmuyor.") }}
                                </td>
                            </tr>
                        @endforelse
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
    <div class="col-12 col-xl-4">
        <div class="card mb-4">
            <div class="card-header">
                <h6 class="mb-0">Görev Özeti</h6>
            </div>
            <div class="card-body d-grid gap-2">
                <div class="d-flex align-items-center justify-content-between">
                    <span class="text-muted">Aktif</span>
                    <span class="fw-semibold">{{ $activeCount }}</span>
                </div>
                <div class="d-flex align-items-center justify-content-between">
                    <span class="text-muted">Cevap Bekleyen</span>
                    <span class="fw-semibold">{{ $replyCount }}</span>
                </div>
                <div class="d-flex align-items-center justify-content-between">
                    <span class="text-muted">Tamamlanan</span>
                    <span class="fw-semibold">{{ $completedCount }}</span>
                </div>
            </div>
        </div>

        <div class="card">
            <div class="card-header">
                <h6 class="mb-0">Bildirimler</h6>
            </div>
            <div class="card-body">
                @forelse ($notifications as $note)
                    <div class="border rounded p-2 mb-2">
                        <div class="fw-semibold">{{ data_get($note, 'title', '-') }}</div>
                        <div class="text-muted small">{{ data_get($note, 'time', '-') }}</div>
                    </div>
                @empty
                    <div class="text-muted small">Bildiriminiz yok.</div>
                @endforelse
            </div>
        </div>
    </div>
</div>

@if ($tab === 'reply' && $responsesReady)
    <div class="modal fade" id="taskReplyModal" tabindex="-1" aria-hidden="true">
        <div class="modal-dialog modal-dialog-scrollable modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">Görev Yanıtlama</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Kapat"></button>
                </div>
                <form method="post" action="" id="taskReplyForm" enctype="multipart/form-data">
                    @csrf
                    <div class="modal-body">
                        <div class="alert alert-danger d-none" data-task-error></div>
                        <div class="border rounded p-3 bg-light">
                            <div class="row g-2">
                                <div class="col-12">
                                    <div class="text-muted small">Görev</div>
                                    <div class="fw-semibold" data-task-title>-</div>
                                    <div class="text-muted small" data-task-description>-</div>
                                </div>
                                <div class="col-6 col-md-4">
                                    <div class="text-muted small">Atayan</div>
                                    <div class="fw-semibold" data-task-assigned>-</div>
                                </div>
                                <div class="col-6 col-md-4">
                                    <div class="text-muted small">Son Tarih</div>
                                    <div class="fw-semibold" data-task-due>-</div>
                                </div>
                                <div class="col-12 col-md-4">
                                    <div class="text-muted small">Öncelik</div>
                                    <span class="badge" data-task-priority>Orta</span>
                                </div>
                            </div>
                        </div>
                        <div class="mt-3">
                            <label class="form-label" for="task_reply_message">Yanıt</label>
                            <textarea id="task_reply_message" name="message" class="form-control" rows="4" placeholder="Yanıt yazın" required></textarea>
                        </div>
                        <div class="mt-3">
                            <div class="d-grid gap-2 task-reply-files">
                                @php
                                    $uploadSlots = max(1, (int) ($maxFileCount ?? 1));
                                @endphp
                                @for ($slot = 1; $slot <= $uploadSlots; $slot++)
                                    <input type="file" name="response_attachments[]" class="form-control form-control-sm">
                                @endfor
                            </div>
                            <div class="text-muted small mt-2 d-none" data-task-required></div>
                            <div class="text-muted small d-none" data-task-required-hint></div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Vazgeç</button>
                        <button type="submit" class="btn btn-primary">Gönder</button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    @push('scripts')
        <script>
            (() => {
                const modalEl = document.getElementById('taskReplyModal');
                if (!modalEl) {
                    return;
                }
                const form = modalEl.querySelector('#taskReplyForm');
                const titleEl = modalEl.querySelector('[data-task-title]');
                const descEl = modalEl.querySelector('[data-task-description]');
                const assignedEl = modalEl.querySelector('[data-task-assigned]');
                const dueEl = modalEl.querySelector('[data-task-due]');
                const priorityEl = modalEl.querySelector('[data-task-priority]');
                const requiredEl = modalEl.querySelector('[data-task-required]');
                const requiredHintEl = modalEl.querySelector('[data-task-required-hint]');
                const messageEl = modalEl.querySelector('textarea[name="message"]');
                const fileInputs = Array.from(modalEl.querySelectorAll('input[type="file"][name="response_attachments[]"]'));
                const errorEl = modalEl.querySelector('[data-task-error]');

                const applyRequired = (accept, label, groupCount) => {
                    fileInputs.forEach((input, index) => {
                        if (accept) {
                            input.setAttribute('accept', accept);
                        } else {
                            input.removeAttribute('accept');
                        }
                        if (label && index === 0) {
                            input.setAttribute('required', 'required');
                        } else {
                            input.removeAttribute('required');
                        }
                        input.value = '';
                    });

                    if (label) {
                        requiredEl.textContent = 'Zorunlu dosya tipi: ' + label;
                        requiredEl.classList.remove('d-none');
                        if (groupCount > 1) {
                            requiredHintEl.textContent = '(Her t\u{00fc}rden 1 dosya)';
                            requiredHintEl.classList.remove('d-none');
                        } else {
                            requiredHintEl.textContent = '';
                            requiredHintEl.classList.add('d-none');
                        }
                    } else {
                        requiredEl.textContent = '';
                        requiredEl.classList.add('d-none');
                        requiredHintEl.textContent = '';
                        requiredHintEl.classList.add('d-none');
                    }
                };

                const fillModal = (button, presetMessage = '') => {
                    if (!button) {
                        return;
                    }
                    form.setAttribute('action', button.dataset.action || '');
                    titleEl.textContent = button.dataset.title || '-';
                    descEl.textContent = button.dataset.description || '-';
                    assignedEl.textContent = button.dataset.assigned || '-';
                    dueEl.textContent = button.dataset.due || '-';
                    const priorityLabel = button.dataset.priority || '-';
                    const priorityClass = button.dataset.priorityClass || '';
                    priorityEl.textContent = priorityLabel;
                    priorityEl.className = 'badge ' + priorityClass;
                    const requiredLabel = button.dataset.requiredLabel || '';
                    const requiredGroupCount = parseInt(button.dataset.requiredGroupCount || '0', 10);
                    const requiredAccept = button.dataset.requiredAccept || '';
                    applyRequired(requiredAccept, requiredLabel, requiredGroupCount);
                    messageEl.value = presetMessage || '';
                    if (errorEl) {
                        errorEl.textContent = '';
                        errorEl.classList.add('d-none');
                    }
                };

                form.addEventListener('submit', async (event) => {
                    event.preventDefault();
                    if (errorEl) {
                        errorEl.textContent = '';
                        errorEl.classList.add('d-none');
                    }

                    const action = form.getAttribute('action');
                    if (!action) {
                        return;
                    }

                    try {
                        const response = await fetch(action, {
                            method: 'POST',
                            headers: {
                                'X-Requested-With': 'XMLHttpRequest',
                                'Accept': 'application/json',
                            },
                            body: new FormData(form),
                        });

                        if (response.ok) {
                            const successUrl = '{{ route('admin.tasks.index', ['tab' => 'reply', 'responded' => 1]) }}';
                            if (!window.AdminApp?.navigate?.(successUrl)) {
                                window.location.href = successUrl;
                            }
                            return;
                        }

                        const data = await response.json().catch(() => null);
                        const message = data && data.error ? data.error : '\u{0130}\u{015f}lem s\u{0131}ras\u{0131}nda hata olu\u{015f}tu.';
                        if (errorEl) {
                            errorEl.textContent = message;
                            errorEl.classList.remove('d-none');
                        }
                    } catch (err) {
                        if (errorEl) {
                            errorEl.textContent = '\u{0130}\u{015f}lem s\u{0131}ras\u{0131}nda hata olu\u{015f}tu.';
                            errorEl.classList.remove('d-none');
                        }
                    }
                });

                modalEl.addEventListener('show.bs.modal', (event) => {
                    fillModal(event.relatedTarget);
                });
                modalEl.addEventListener('hide.bs.modal', () => {
                    if (document.activeElement && typeof document.activeElement.blur === 'function') {
                        document.activeElement.blur();
                    }
                });

                const restoreId = {{ (int) session('task_error_assignment_id', 0) }};
                if (restoreId > 0) {
                    const btn = document.querySelector('.task-reply-btn[data-assignment-id="' + restoreId + '"]');
                    if (btn) {
                        fillModal(btn, @json(old('message', '')));
                        const modal = bootstrap.Modal.getOrCreateInstance(modalEl);
                        modal.show();
                    }
                }
            })();
        </script>
    @endpush
@endif
@endsection