@extends('layouts.performance')

@php
    use App\Enums\TaskType;

    $isEdit = $isEdit ?? false;
    $editTask = $editTask ?? null;
    $selectedAssignees = $selectedAssignees ?? [];
    $lockedAssignees = $lockedAssignees ?? [];

    $assigneeDefaults = old('assignees');
    if ($assigneeDefaults === null) {
        $assigneeDefaults = $isEdit && $editTask ? array_keys($selectedAssignees) : [];
    }
    $assigneeDefaults = is_array($assigneeDefaults) ? $assigneeDefaults : [];
    $assigneeLookup = [];
    foreach ($assigneeDefaults as $value) {
        $value = (int) $value;
        if ($value > 0) {
            $assigneeLookup[$value] = true;
        }
    }

    $formDepartment = old('department', $isEdit && $editTask ? ($editTask->department_name ?? '') : '');
    $formPosition = old('position', $isEdit && $editTask ? ($editTask->position_name ?? '') : '');
    $formTitle = old('title_name', $isEdit && $editTask ? ($editTask->title_name ?? '') : '');
    $formCenter = old('center_id', $isEdit && $editTask ? (string) ($editTask->responsibility_center_id ?? '') : '');
    $formTitleText = old('task_title', $isEdit && $editTask ? ($editTask->title ?? '') : '');
    $formDescription = old('description', $isEdit && $editTask ? ($editTask->description ?? '') : '');
    $priorityValue = old('priority', $isEdit && $editTask ? ($editTask->priority ?? 'normal') : 'normal');
    $taskTypeValue = (int) old('task_type', $isEdit && $editTask ? ($editTask->task_type ?? TaskType::OPERATIONAL->value) : TaskType::OPERATIONAL->value);
    $taskTypeOptions = TaskType::labels();
    $startDateValue = old('start_date', $isEdit && $editTask ? ($editTask->start_date ?? '') : '');
    $dueDateValue = old('due_date', $isEdit && $editTask ? ($editTask->due_date ?? '') : '');
    $formTemplateValue = old('form_template_id', $isEdit && $editTask ? (string) ($editTask->form_template_id ?? '') : '');

    $requiredDefaults = old('required_attachment_types');
    if ($requiredDefaults === null) {
        $requiredDefaults = $isEdit && $editTask ? ($editTask->required_attachment_types ?? '') : [];
    }
    if (!is_array($requiredDefaults)) {
        $requiredDefaults = array_filter(array_map('trim', explode(',', (string) $requiredDefaults)));
    }
    $requiredDefaults = array_map('strtolower', $requiredDefaults);
    $pdfSelected = in_array('pdf', $requiredDefaults, true);
    $excelSelected = in_array('excel', $requiredDefaults, true)
        || in_array('xls', $requiredDefaults, true)
        || in_array('xlsx', $requiredDefaults, true);
    $wordSelected = in_array('word', $requiredDefaults, true)
        || in_array('doc', $requiredDefaults, true)
        || in_array('docx', $requiredDefaults, true);
    $photoSelected = in_array('photo', $requiredDefaults, true)
        || in_array('jpg', $requiredDefaults, true)
        || in_array('jpeg', $requiredDefaults, true)
        || in_array('png', $requiredDefaults, true);
@endphp

@section('title', $isEdit ? 'Görev Düzenle' : 'Görev Atama')

@section('perf-content')
<div class="d-flex flex-wrap align-items-center justify-content-between gap-3 mb-4">
    <div>
        <h1 class="h4 mb-1">
            {{ $isEdit ? 'Görev Düzenle' : 'Görev Süreç Formu' }}
        </h1>
        <p class="text-muted mb-0">
            {{ $isEdit ? 'Görev bilgilerini ve atanan kişileri güncelleyin.' : 'Departman, pozisyon, ünvan ve sorumluluk merkezine göre görev atayın.' }}
        </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 (!($employeesReady ?? false))
    <div class="alert alert-warning">Personel tablosu bulunamadı.</div>
@elseif (request()->query('saved'))
    @if ($isEdit)
        <div class="alert alert-soft">Görev güncellendi.</div>
    @else
        <div class="alert alert-soft">
            Görev atama tamamlandı. Eklenen: {{ (int) request()->query('created', 0) }},
            Atlanan: {{ (int) request()->query('skipped', 0) }}.
        </div>
    @endif
@elseif (request()->query('error'))
    <div class="alert alert-danger">{{ session('task_error', 'İşlem sırasında hata oluştu.') }}</div>
@endif

@if ($errors->any())
    <div class="alert alert-danger">{{ $errors->first() }}</div>
@endif

<form method="post" action="{{ $isEdit && $editTask ? route('admin.tasks.update', ['id' => $editTask->assignment_id]) : route('admin.tasks.store') }}" enctype="multipart/form-data">
    @csrf
    <div class="row g-4">
        <div class="col-12 col-xl-7">
            <div class="card h-100">
                <div class="card-header">
                    <h5 class="card-title mb-0">Atama Bilgileri</h5>
                </div>
                <div class="card-body">
                    <div class="row g-3">
                        <div class="col-12 col-md-6">
                            <div class="task-form-row">
                                <label class="form-label">Departman</label>
                                <select name="department" class="form-select">
                                    <option value="">Tüm departmanlar</option>
                                    @foreach ($departments as $department)
                                        <option value="{{ $department->name }}" {{ $formDepartment === $department->name ? 'selected' : '' }}>
                                            {{ $department->name }}
                                        </option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-12 col-md-6">
                            <div class="task-form-row">
                                <label class="form-label">Pozisyon</label>
                                <select name="position" class="form-select">
                                    <option value="">Tüm pozisyonlar</option>
                                    @foreach ($positions as $position)
                                        <option value="{{ $position->name }}" {{ $formPosition === $position->name ? 'selected' : '' }}>
                                            {{ $position->name }}
                                        </option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-12 col-md-6">
                            <div class="task-form-row">
                                <label class="form-label">Ünvan</label>
                                <select name="title_name" class="form-select">
                                    <option value="">Tüm ünvanlar</option>
                                    @foreach ($titles as $title)
                                        <option value="{{ $title->name }}" {{ $formTitle === $title->name ? 'selected' : '' }}>
                                            {{ $title->name }}
                                        </option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-12 col-md-6">
                            <div class="task-form-row">
                                <label class="form-label">Sorumluluk Merkezi</label>
                                <select name="center_id" class="form-select">
                                    <option value="">Tüm merkezler</option>
                                    @foreach ($centers as $center)
                                        @php
                                            $centerLabel = trim((string) $center->center_no);
                                            $centerLabel = $centerLabel !== '' ? $centerLabel . ' - ' . (string) $center->name : (string) $center->name;
                                        @endphp
                                        <option value="{{ $center->id }}" {{ $formCenter === (string) $center->id ? 'selected' : '' }}>
                                            {{ $centerLabel }}
                                        </option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-12">
                            <div class="task-form-row align-top">
                                <label class="form-label">Kişi Seçimi</label>
                                <div class="border rounded p-3 w-100">
                                    <div class="d-flex flex-wrap align-items-center gap-2 mb-2">
                                        <input type="text" class="form-control form-control-sm task-person-search" id="task_person_search" placeholder="Ara: kişi adı">
                                        <button type="button" class="btn btn-sm btn-outline-secondary" id="task_person_select_all">Tümünü Seç</button>
                                        <button type="button" class="btn btn-sm btn-outline-danger" id="task_person_clear">Temizle</button>
                                    </div>
                                <div class="task-person-list" id="task_person_list">
                                    @forelse ($employees as $employee)
                                        @php
                                            $employeeId = (int) $employee->id;
                                            $isChecked = isset($assigneeLookup[$employeeId]);
                                            $isLocked = $isEdit && isset($lockedAssignees[$employeeId]);
                                        @endphp
                                        <label class="form-check task-person-item"
                                               data-name="{{ strtolower((string) $employee->name) }}"
                                               data-dept="{{ strtolower((string) ($employee->dept_name ?? '')) }}"
                                               data-position="{{ strtolower((string) ($employee->position ?? '')) }}"
                                               data-title="{{ strtolower((string) ($employee->title_name ?? '')) }}"
                                               data-center="{{ (int) ($employee->responsibility_center_id ?? 0) }}">
                                            <input class="form-check-input task-person-checkbox"
                                                   type="checkbox"
                                                   name="assignees[]"
                                                   value="{{ $employeeId }}"
                                                   {{ $isChecked ? 'checked' : '' }}
                                                   {{ $isLocked ? 'disabled' : '' }}>
                                            @if ($isLocked)
                                                <input type="hidden" name="assignees[]" value="{{ $employeeId }}">
                                            @endif
                                            <span class="form-check-label">
                                                {{ $employee->name }}
                                                <span class="text-muted small">
                                                    ({{ $employee->dept_name ?? '-' }})
                                                </span>
                                            </span>
                                        </label>
                                    @empty
                                        <div class="text-muted small">Kayıtlı personel bulunmuyor.</div>
                                    @endforelse
                                </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-12">
                            <div class="task-form-row align-top">
                                <label class="form-label">Görev Başlığı</label>
                                <input type="text" name="task_title" class="form-control" placeholder="Görev Başlığı girin" value="{{ $formTitleText }}">
                            </div>
                        </div>
                        <div class="col-12">
                            <div class="task-form-row align-top">
                                <label class="form-label">Görev Açıklaması</label>
                                <textarea name="description" rows="4" class="form-control" placeholder="Görev detayları ve beklentiler">{{ $formDescription }}</textarea>
                            </div>
                        </div>
                        <div class="col-12 col-md-4">
                            <div class="task-form-row">
                                <label class="form-label">Öncelik</label>
                                <select name="priority" class="form-select">
                                    <option value="low" {{ $priorityValue === 'low' ? 'selected' : '' }}>Düşük</option>
                                    <option value="normal" {{ $priorityValue === 'normal' ? 'selected' : '' }}>Orta</option>
                                    <option value="high" {{ $priorityValue === 'high' ? 'selected' : '' }}>Yüksek</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-12 col-md-4">
                            <div class="task-form-row">
                                <label class="form-label">Görev Türü</label>
                                <select name="task_type" class="form-select">
                                    @foreach ($taskTypeOptions as $value => $label)
                                        <option value="{{ $value }}" {{ (int) $taskTypeValue === (int) $value ? 'selected' : '' }}>
                                            {{ $label }}
                                        </option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-12 col-md-4">
                            <div class="task-form-row compact">
                                <label class="form-label">Başlangıç Tarihi</label>
                                <input type="date" name="start_date" class="form-control" value="{{ $startDateValue }}">
                            </div>
                        </div>
                        <div class="col-12 col-md-4">
                            <div class="task-form-row compact">
                                <label class="form-label">Bitiş Tarihi</label>
                                <input type="date" name="due_date" class="form-control" value="{{ $dueDateValue }}">
                            </div>
                        </div>
                        <div class="col-12 col-md-6">
                            <div class="task-form-row">
                                <label class="form-label">Form Şablonu</label>
                                <select name="form_template_id" class="form-select">
                                    <option value="">Form seçilmedi</option>
                                    @foreach ($formTemplates ?? [] as $template)
                                        <option value="{{ $template->id }}"
                                            {{ (string) $formTemplateValue === (string) $template->id ? 'selected' : '' }}>
                                            {{ $template->name }}
                                        </option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-12 col-md-6">
                            <div class="task-form-row">
                                <label class="form-label">Dosya</label>
                                <input type="file" name="attachment" class="form-control">
                            </div>
                        </div>
                        <div class="col-12">
                            <div class="task-form-row align-top task-required-row">
                                <label class="form-label">Zorunlu Dosya Tipi</label>
                                <div class="d-flex flex-wrap gap-3 task-required-types">
                                    <label class="form-check form-switch m-0">
                                        <input class="form-check-input" type="checkbox" name="required_attachment_types[]" value="pdf"
                                               {{ $pdfSelected ? 'checked' : '' }}>
                                        <span class="form-check-label">PDF</span>
                                    </label>
                                    <label class="form-check form-switch m-0">
                                        <input class="form-check-input" type="checkbox" name="required_attachment_types[]" value="excel"
                                               {{ $excelSelected ? 'checked' : '' }}>
                                        <span class="form-check-label">EXCEL</span>
                                    </label>
                                    <label class="form-check form-switch m-0">
                                        <input class="form-check-input" type="checkbox" name="required_attachment_types[]" value="word"
                                               {{ $wordSelected ? 'checked' : '' }}>
                                        <span class="form-check-label">WORD</span>
                                    </label>
                                    <label class="form-check form-switch m-0">
                                        <input class="form-check-input" type="checkbox" name="required_attachment_types[]" value="photo"
                                               {{ $photoSelected ? 'checked' : '' }}>
                                        <span class="form-check-label">FOTOĞRAF</span>
                                    </label>
                                    <div class="text-muted small w-100">
                                        Seçilen türlerde dosya eklenmeden görev yanıtlanamaz.
                                    </div>
                                </div>
                            </div>
                        </div>
                        @if (!$isEdit)
                            <div class="col-12 col-md-6 d-flex align-items-end">
                                <div class="task-form-row">
                                    <label class="form-label" for="notify_assignees">Bildirim gönder</label>
                                    <div class="form-check form-switch m-0">
                                        <input class="form-check-input" type="checkbox" id="notify_assignees" name="notify" checked>
                                    </div>
                                </div>
                            </div>
                        @endif
                    </div>
                    <div class="d-flex flex-wrap justify-content-end gap-2 mt-4">
                        @if ($isEdit)
                            <a href="{{ route('admin.tasks.track', ['status' => 'active']) }}" class="btn btn-outline-secondary">Vazgeç</a>
                            <button type="submit" class="btn btn-primary">Güncelle</button>
                        @else
                            <button type="reset" class="btn btn-outline-secondary">Temizle</button>
                            <button type="submit" class="btn btn-primary">Görev Ata</button>
                        @endif
                    </div>
                </div>
            </div>
        </div>
        <div class="col-12 col-xl-5">
            <div class="card mb-4">
                <div class="card-header">
                    <h5 class="card-title mb-0">Atama Özeti</h5>
                </div>
                <div class="card-body d-grid gap-3">
                    <div class="d-flex align-items-center justify-content-between">
                        <span class="text-muted">Seçilen Kişi</span>
                        <span class="fw-semibold" id="task_selected_count">0</span>
                    </div>
                    <div>
                        <div class="text-muted small mb-1">Seçilen Kişiler</div>
                        <div class="d-flex flex-wrap gap-1" id="task_selected_list"></div>
                    </div>
                    <div>
                        <div class="text-muted small mb-1">Görev Başlığı</div>
                        <div class="fw-semibold" id="task_preview_title">-</div>
                    </div>
                    <div>
                        <div class="text-muted small mb-1">Öncelik</div>
                        <div class="fw-semibold" id="task_preview_priority">Orta</div>
                    </div>
                    <div>
                        <div class="text-muted small mb-1">Bitiş Tarihi</div>
                        <div class="fw-semibold" id="task_preview_due">-</div>
                    </div>
                    <div>
                        <div class="text-muted small mb-1">Bildirim</div>
                        <div class="fw-semibold" id="task_preview_notify">Açık</div>
                    </div>
                </div>
            </div>

        </div>
    </div>
</form>

<script>
  (() => {
    const personSearch = document.getElementById('task_person_search');
    const personList = document.getElementById('task_person_list');
    const personItems = personList ? Array.from(personList.querySelectorAll('.task-person-item')) : [];
    const selectedCount = document.getElementById('task_selected_count');
    const selectedList = document.getElementById('task_selected_list');
    const selectAllBtn = document.getElementById('task_person_select_all');
    const clearAllBtn = document.getElementById('task_person_clear');
    const titleInput = document.querySelector('input[name="task_title"]');
    const prioritySelect = document.querySelector('select[name="priority"]');
    const dueDateInput = document.querySelector('input[name="due_date"]');
    const notifyInput = document.getElementById('notify_assignees');
    const deptSelect = document.querySelector('select[name="department"]');
    const positionSelect = document.querySelector('select[name="position"]');
    const titleSelect = document.querySelector('select[name="title_name"]');
    const centerSelect = document.querySelector('select[name="center_id"]');

    const previewTitle = document.getElementById('task_preview_title');
    const previewPriority = document.getElementById('task_preview_priority');
    const previewDue = document.getElementById('task_preview_due');
    const previewNotify = document.getElementById('task_preview_notify');

    const updateSelectedCount = () => {
      const currentSelectedCount = document.getElementById('task_selected_count');
      const currentPersonList = document.getElementById('task_person_list');
      if (!currentSelectedCount) return;
      const total = currentPersonList ? currentPersonList.querySelectorAll('.task-person-checkbox:checked').length : 0;
      currentSelectedCount.textContent = total;
    };

    const updateSelectedList = () => {
      const currentSelectedList = document.getElementById('task_selected_list');
      const currentPersonList = document.getElementById('task_person_list');
      if (!currentSelectedList || !currentPersonList) return;
      const items = Array.from(currentPersonList.querySelectorAll('.task-person-checkbox:checked'))
        .map((input) => {
          const label = input.closest('label');
          const text = label ? (label.querySelector('.form-check-label')?.innerText || '') : '';
          return text.replace(/\s+/g, ' ').trim();
        })
        .filter((text) => text.length > 0);
      if (!items.length) {
        currentSelectedList.innerHTML = '<span class="text-muted small">Seçim yok.</span>';
        return;
      }
      currentSelectedList.innerHTML = items
        .map((text) => `<span class="badge bg-light text-dark border">${text}</span>`)
        .join('');
    };

    const updatePreview = () => {
      const currentTitleInput = document.querySelector('input[name="task_title"]');
      const currentPrioritySelect = document.querySelector('select[name="priority"]');
      const currentDueDateInput = document.querySelector('input[name="due_date"]');
      const currentNotifyInput = document.getElementById('notify_assignees');
      
      const currentPreviewTitle = document.getElementById('task_preview_title');
      const currentPreviewPriority = document.getElementById('task_preview_priority');
      const currentPreviewDue = document.getElementById('task_preview_due');
      const currentPreviewNotify = document.getElementById('task_preview_notify');
      
      if (currentPreviewTitle && currentTitleInput) currentPreviewTitle.textContent = currentTitleInput.value.trim() || '-';
      if (currentPreviewPriority && currentPrioritySelect) {
        let label = 'Orta';
        if (currentPrioritySelect.value === 'high') label = 'Yüksek';
        else if (currentPrioritySelect.value === 'low') label = 'Düşük';
        currentPreviewPriority.textContent = label;
      }
      if (currentPreviewDue && currentDueDateInput) currentPreviewDue.textContent = currentDueDateInput.value || '-';
      if (currentPreviewNotify && currentNotifyInput) currentPreviewNotify.textContent = currentNotifyInput.checked ? 'Açık' : 'Kapalı';
    };

    const normalizeText = (value) => value ? value.trim().toLowerCase() : '';

    const filterPeople = () => {
      const currentPersonSearch = document.getElementById('task_person_search');
      const currentDeptSelect = document.querySelector('select[name="department"]');
      const currentPositionSelect = document.querySelector('select[name="position"]');
      const currentTitleSelect = document.querySelector('select[name="title_name"]');
      const currentCenterSelect = document.querySelector('select[name="center_id"]');
      const currentPersonList = document.getElementById('task_person_list');
      const currentPersonItems = currentPersonList ? Array.from(currentPersonList.querySelectorAll('.task-person-item')) : [];
      
      if (!currentPersonSearch) return;
      const needle = normalizeText(currentPersonSearch.value);
      const dept = normalizeText(currentDeptSelect?.value);
      const position = normalizeText(currentPositionSelect?.value);
      const title = normalizeText(currentTitleSelect?.value);
      const center = String(currentCenterSelect?.value || '');

      currentPersonItems.forEach((item) => {
        const name = item.dataset.name || '';
        const deptValue = item.dataset.dept || '';
        const positionValue = item.dataset.position || '';
        const titleValue = item.dataset.title || '';
        const centerValue = item.dataset.center || '';

        const matchesName = needle === '' || name.includes(needle);
        const matchesDept = dept === '' || deptValue === dept;
        const matchesPosition = position === '' || positionValue === position;
        const matchesTitle = title === '' || titleValue === title;
        const matchesCenter = center === '' || centerValue === center;

        item.hidden = !(matchesName && matchesDept && matchesPosition && matchesTitle && matchesCenter);
      });
    };

    if (!document._isTasksAssignEventsBound) {
        document._isTasksAssignEventsBound = true;
        
        document.addEventListener('input', (e) => {
            const target = e.target;
            if (!target) return;
            
            if (target.id === 'task_person_search') {
                filterPeople();
            } else if (
                target.name === 'task_title' || 
                target.name === 'due_date' || 
                target.id === 'notify_assignees'
            ) {
                updatePreview();
            }
        });

        document.addEventListener('change', (e) => {
            const target = e.target;
            if (!target) return;
            
            if (
                target.name === 'department' || 
                target.name === 'position' || 
                target.name === 'title_name' || 
                target.name === 'center_id'
            ) {
                filterPeople();
            } else if (target.classList.contains('task-person-checkbox')) {
                updateSelectedCount();
                updateSelectedList();
            } else if (
                target.name === 'priority' || 
                target.name === 'due_date' || 
                target.id === 'notify_assignees' || 
                target.name === 'task_title'
            ) {
                updatePreview();
            }
        });

        document.addEventListener('click', (e) => {
            const selectAllBtn = e.target.closest('#task_person_select_all');
            const clearAllBtn = e.target.closest('#task_person_clear');
            
            if (selectAllBtn) {
                toggleVisible(true);
            } else if (clearAllBtn) {
                toggleVisible(false);
            }
        });
    }

    updateSelectedCount();
    updateSelectedList();
    updatePreview();
  })();
</script>
@endsection