@extends('layouts.admin')

@section('title', 'Create CA')

@section('content')
<div class="container mt-4">
    <h2 class="mb-4">Create Chartered Accountant</h2>
    <form method="POST" id="createCaForm" action="{{ route('ca.store') }}">
        @csrf

        {{-- Basic Info --}}
        <div class="row mb-3">
            <div class="col-md-4">
                <label class="form-label">Full Name</label>
                <input type="text" name="name" class="form-control" placeholder="Enter full name" required>
            </div>
            <div class="col-md-4">
                <label class="form-label">Email</label>
                <input type="email" name="email" class="form-control" placeholder="Enter email" required>
            </div>
            <div class="col-md-4">
                <label class="form-label">Password</label>
                <input type="password" name="password" id="password" class="form-control" placeholder="Enter password" required>
            </div>
            <div class="col-md-4 mt-3">
                <label class="form-label">Confirm Password</label>
                <input type="password" name="confirm_password" id="confirm_password" class="form-control" placeholder="Confirm password" required>
            </div>
        </div>

        <hr class="my-4">

        {{-- Access Section --}}
        <h4 class="mb-3">Select Access (Company → Year → Category → Months)</h4>
        <div class="accordion" id="companyAccordion">
            @foreach($structure as $comp)
            <div class="accordion-item mb-2 border rounded">
                <h2 class="accordion-header" id="headingComp{{ $loop->index }}">
                    <button class="accordion-button collapsed fw-semibold" type="button" data-bs-toggle="collapse" data-bs-target="#collapseComp{{ $loop->index }}">
                        📁 {{ $comp->company->name }}
                    </button>
                </h2>
                <div id="collapseComp{{ $loop->index }}" class="accordion-collapse collapse" data-bs-parent="#companyAccordion">
                    <div class="accordion-body">
                        @foreach($comp->years as $yr)
                        <div class="accordion mb-2 border rounded">
                            <div class="accordion-item">
                                <h2 class="accordion-header">
                                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseYear{{ $comp->company->id }}-{{ $yr->year->id }}">
                                        📅 {{ $yr->year->display_year ?? $yr->year->year }}
                                    </button>
                                </h2>
                                <div id="collapseYear{{ $comp->company->id }}-{{ $yr->year->id }}" class="accordion-collapse collapse">
                                    <div class="accordion-body">

                                        {{-- ✅ Expiry per year --}}
                                        <div class="mb-3">
                                            <label class="form-label">Expiry Date for {{ $yr->year->display_year ?? $yr->year->year }}</label>
                                            <input type="date" name="expiry_for_year_{{ $yr->year->id }}" class="form-control">
                                        </div>

                                        @foreach($yr->categories as $cat)
                                        <div class="mb-3 border-bottom pb-2">
                                            <strong>📂 {{ $cat->category->name }}</strong>

                                            @php
                                                $is_purchase = $cat->category->companySubFolders->isNotEmpty();
                                                $is_expenses = $cat->category->subcategories->isNotEmpty();
                                            @endphp

                                            @if($is_purchase)
                                                {{-- Purchase Months --}}
                                                <div class="row mt-2">
                                                    @foreach($cat->months as $m)
                                                    <div class="col-md-3">
                                                        <div class="form-check">
                                                            <input class="form-check-input purchase-month" type="checkbox" id="purchaseMonth{{ $m->id }}" data-month="{{ $m->id }}">
                                                            <label class="form-check-label" for="purchaseMonth{{ $m->id }}">
                                                                {{ $m->name }}
                                                            </label>
                                                        </div>
                                                    </div>
                                                    @endforeach
                                                </div>

                                                {{-- Parties grouped by month --}}
                                                @foreach($cat->months as $m)
                                                    @if(isset($cat->month_parties[$m->id]) && count($cat->month_parties[$m->id]) > 0)
                                                    <div class="ms-3 mt-2 purchase-parties" id="partiesForMonth{{ $m->id }}" style="display:none;">
                                                        <span class="fw-semibold">Parties for {{ $m->name }}:</span>
                                                        @foreach($cat->month_parties[$m->id] as $party)
                                                        <div class="form-check ms-3">
                                                            <input class="form-check-input purchase-party" type="checkbox"
                                                                   value="purchase_{{ $party->id }}"
                                                                   data-subfolder="{{ $party->id }}"
                                                                   data-monthid="{{ $m->id }}"
                                                                   id="party{{ $party->id }}Month{{ $m->id }}" disabled>
                                                            <label class="form-check-label" for="party{{ $party->id }}Month{{ $m->id }}">
                                                                {{ $party->name }}
                                                            </label>
                                                        </div>
                                                        @endforeach
                                                    </div>
                                                    @endif
                                                @endforeach

                                            @elseif($is_expenses)
                                                {{-- Expense Months --}}
                                                <div class="row mt-2">
                                                    @foreach($cat->months as $m)
                                                    <div class="col-md-3">
                                                        <div class="form-check">
                                                            <input class="form-check-input expense-month" type="checkbox" id="expenseMonth{{ $m->id }}" data-month="{{ $m->id }}">
                                                            <label class="form-check-label" for="expenseMonth{{ $m->id }}">
                                                                {{ $m->name }}
                                                            </label>
                                                        </div>
                                                    </div>
                                                    @endforeach
                                                </div>

                                                {{-- Expense Subcategories --}}
                                                @foreach($cat->months as $m)
                                                <div class="ms-3 mt-2 expense-subcats" id="subcatsForMonth{{ $m->id }}" style="display:none;">
                                                    <span class="fw-semibold">Subcategories for {{ $m->name }}:</span>
                                                    @foreach($cat->category->subcategories as $subcat)
                                                    <div class="form-check ms-3">
                                                        <input class="form-check-input subcat-checkbox" type="checkbox"
                                                            value="expenses_{{ $subcat->id }}"
                                                            data-subcat="{{ $subcat->id }}"
                                                            data-monthid="{{ $m->id }}"
                                                            id="subcat{{ $subcat->id }}Month{{ $m->id }}" disabled>
                                                        <label class="form-check-label" for="subcat{{ $subcat->id }}Month{{ $m->id }}">
                                                            {{ $subcat->name }}
                                                        </label>
                                                    </div>
                                                    @endforeach
                                                </div>
                                                @endforeach

                                            @else
                                                {{-- Default Category Months --}}
                                                <div class="row mt-2">
                                                    @foreach($cat->months as $m)
                                                    <div class="col-md-3">
                                                        <div class="form-check">
                                                            <input class="form-check-input" type="checkbox" name="access_ids[]" value="month_{{ $m->id }}" id="month{{ $m->id }}">
                                                            <label class="form-check-label" for="month{{ $m->id }}">
                                                                {{ $m->name }}
                                                            </label>
                                                        </div>
                                                    </div>
                                                    @endforeach
                                                </div>
                                            @endif
                                        </div>
                                        @endforeach
                                    </div>
                                </div>
                            </div>
                        </div>
                        @endforeach
                    </div>
                </div>
            </div>
            @endforeach
        </div>

        {{-- Submit --}}
        <div class="mt-4">
            <button type="submit" class="btn btn-primary px-4">
                <i class="bi bi-plus-circle"></i> Create Access
            </button>
        </div>
    </form>
</div>

{{-- SweetAlert2 --}}
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script>
document.getElementById("createCaForm").addEventListener("submit", function(e) {
    let password = document.getElementById("password").value.trim();
    let confirmPassword = document.getElementById("confirm_password").value.trim();

    if (password.length < 8) {
        e.preventDefault();
        Swal.fire({ icon: 'warning', title: 'Weak Password', text: 'Password must be at least 8 characters long.', confirmButtonColor: '#d33' });
        return;
    }
    if (password !== confirmPassword) {
        e.preventDefault();
        Swal.fire({ icon: 'error', title: 'Password Mismatch', text: 'Password and Confirm Password do not match.', confirmButtonColor: '#d33' });
        return;
    }

    // Expense hidden inputs
    document.querySelectorAll('.subcat-checkbox:checked').forEach(cb => {
        cb.name = "access_ids[]";
    });

    // Purchase hidden inputs  
    document.querySelectorAll('.purchase-party:checked').forEach(cb => {
        cb.name = "access_ids[]";
    });
});

// Toggle Expense Subcategories
document.querySelectorAll('.expense-month').forEach(function(monthCheckbox) {
    monthCheckbox.addEventListener('change', function() {
        let monthId = this.dataset.month;
        let subcatSection = document.getElementById('subcatsForMonth' + monthId);
        let subcatCheckboxes = subcatSection ? subcatSection.querySelectorAll('.subcat-checkbox') : [];
        if (this.checked) {
            if (subcatSection) subcatSection.style.display = 'block';
            subcatCheckboxes.forEach(cb => cb.disabled = false);
        } else {
            if (subcatSection) subcatSection.style.display = 'none';
            subcatCheckboxes.forEach(cb => { cb.checked = false; cb.disabled = true; });
        }
    });
});

// Toggle Purchase Parties
document.querySelectorAll('.purchase-month').forEach(function(monthCheckbox) {
    monthCheckbox.addEventListener('change', function() {
        let monthId = this.dataset.month;
        let partySection = document.getElementById('partiesForMonth' + monthId);
        let partyCheckboxes = partySection ? partySection.querySelectorAll('.purchase-party') : [];
        if (this.checked) {
            if (partySection) partySection.style.display = 'block';
            partyCheckboxes.forEach(cb => cb.disabled = false);
        } else {
            if (partySection) partySection.style.display = 'none';
            partyCheckboxes.forEach(cb => { cb.checked = false; cb.disabled = true; });
        }
    });
});
</script>
@endsection