@extends('layouts.app')
@section('title', 'Project Concept Note')

@push('stylesheets')
@include('partials.filter-card-styles')
@include('partials.index-datatable-styles')
<link rel="stylesheet" href="{{ asset('assets/plugins/select2/css/select2.min.css') }}">
<link rel="stylesheet" href="{{ asset('assets/plugins/select2-bootstrap4-theme/select2-bootstrap4.min.css') }}">
@include('project-concept-notes.partials.show-modal-styles')
<style>
    .pcn-status-badge { font-size: 0.75rem; }
    /* Schemes column: truncated name + chevron toggle (same as PC Forms listing). */
    #pcnTableCard .details-modal-trigger.pcn-listing-scheme-trigger {
        text-decoration: none;
        cursor: pointer;
        color: inherit;
        display: block;
        width: 100%;
    }
    #pcnTableCard .details-modal-trigger.pcn-listing-scheme-trigger .pms-scheme-name-label.scheme-name-display {
        font-weight: 700 !important;
        color: #212529 !important;
    }
    body.dark-mode #pcnTableCard .details-modal-trigger.pcn-listing-scheme-trigger .pms-scheme-name-label.scheme-name-display {
        color: #f8f9fa !important;
    }
    #pcnTableCard .table-responsive {
        overflow-x: visible;
        overflow-y: visible;
    }
    /* Working paper action: same compact pill as the PC Forms listing. */
    #pcnIndexTable td.pcn-wp-listing-cell {
        text-align: center !important;
        vertical-align: middle !important;
    }
    #pcnIndexTable .pcn-wp-listing-empty {
        display: block;
        width: 100%;
        text-align: center;
    }
    #pcnIndexTable .pcn-wp-listing-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.35rem;
        min-width: 6.75rem;
        max-width: 100%;
        padding: 0.22rem 0.7rem;
        font-size: 0.75rem;
        font-weight: 600;
        line-height: 1.2;
        letter-spacing: 0.01em;
        border-radius: 999px;
        border: 1px solid #0f8a86;
        background: #fff;
        color: #0f766e;
        text-decoration: none !important;
        white-space: nowrap;
        vertical-align: middle;
        box-shadow: none;
    }
    #pcnIndexTable .pcn-wp-listing-btn i {
        font-size: 0.72rem;
        line-height: 1;
    }
    #pcnIndexTable .pcn-wp-listing-btn:visited,
    #pcnIndexTable .pcn-wp-listing-btn:active {
        color: #0f766e;
        background: #fff;
        border-color: #0f8a86;
    }
    #pcnIndexTable .pcn-wp-listing-btn:hover,
    #pcnIndexTable .pcn-wp-listing-btn:focus {
        color: #0b5f5b;
        background: #f0fdfa;
        border-color: #0b5f5b;
        text-decoration: none !important;
        outline: none;
        box-shadow: 0 0 0 2px rgba(15, 118, 110, 0.16);
    }
    #pcnIndexTable .pcn-wp-listing-btn--ready {
        background: #f0fdfa;
        border-color: #14b8a6;
        color: #0f766e;
    }
    #pcnIndexTable .pcn-wp-listing-btn--ready:visited,
    #pcnIndexTable .pcn-wp-listing-btn--ready:active {
        background: #f0fdfa;
        color: #0f766e;
        border-color: #14b8a6;
    }
    #pcnIndexTable .pcn-wp-listing-btn--ready:hover,
    #pcnIndexTable .pcn-wp-listing-btn--ready:focus {
        background: #ccfbf1;
        color: #0b5f5b;
        border-color: #0f766e;
    }
    body.dark-mode #pcnIndexTable .pcn-wp-listing-btn {
        background: transparent;
        color: #5eead4;
        border-color: #2dd4bf;
    }
    body.dark-mode #pcnIndexTable .pcn-wp-listing-btn:visited,
    body.dark-mode #pcnIndexTable .pcn-wp-listing-btn:active {
        background: transparent;
        color: #5eead4;
        border-color: #2dd4bf;
    }
    body.dark-mode #pcnIndexTable .pcn-wp-listing-btn:hover,
    body.dark-mode #pcnIndexTable .pcn-wp-listing-btn:focus {
        background: rgba(45, 212, 191, 0.12);
        color: #99f6e4;
        border-color: #5eead4;
        box-shadow: 0 0 0 2px rgba(45, 212, 191, 0.2);
    }
    body.dark-mode #pcnIndexTable .pcn-wp-listing-btn--ready {
        background: rgba(45, 212, 191, 0.12);
        color: #99f6e4;
        border-color: #2dd4bf;
    }
    body.dark-mode #pcnIndexTable .pcn-wp-listing-btn--ready:visited,
    body.dark-mode #pcnIndexTable .pcn-wp-listing-btn--ready:active {
        background: rgba(45, 212, 191, 0.12);
        color: #99f6e4;
        border-color: #2dd4bf;
    }
    body.dark-mode #pcnIndexTable .pcn-wp-listing-btn--ready:hover,
    body.dark-mode #pcnIndexTable .pcn-wp-listing-btn--ready:focus {
        background: rgba(45, 212, 191, 0.2);
        color: #ccfbf1;
        border-color: #5eead4;
    }
</style>
@endpush

@section('contents')
@php
    $pcnShowReceivedDate = \App\Support\PcnWorkflowAction::currentUserHasAnyWorkflowPermission();
    $pcnShowWorkingPaperColumn = can('working-papers', 'index') || can('working-papers', 'add');
    $pcnWpPerms = $pcnWorkingPaperPermissions ?? ['show' => false, 'generate' => [], 'view' => []];
    $pcnWpGeneratePerms = $pcnWpPerms['generate'] ?? [];
    $pcnWpViewPerms = $pcnWpPerms['view'] ?? [];
    $pcnCanGenerateAnyWorkingPaper = in_array(true, array_values($pcnWpGeneratePerms), true);
    
    $pcnIndexHeaders = [];
    $pcnSortColumns = [];

    $pcnIndexHeaders[] = 'ADP#'; $pcnSortColumns[] = null;
    $pcnIndexHeaders[] = 'Code'; $pcnSortColumns[] = null;
    $pcnIndexHeaders[] = 'Project'; $pcnSortColumns[] = null;
    if ($pcnShowWorkingPaperColumn) {
        $pcnIndexHeaders[] = 'Working Paper'; $pcnSortColumns[] = null;
    }
    $pcnIndexHeaders[] = 'Status'; $pcnSortColumns[] = 'project_concept_notes.workflow_stage';
    if ($pcnShowReceivedDate ?? false) {
        $pcnIndexHeaders[] = 'Received Date'; $pcnSortColumns[] = 'project_concept_notes.created_at';
    }
    $pcnIndexHeaders[] = 'Submission Date'; $pcnSortColumns[] = 'project_concept_notes.submitted_at';
@endphp
<section class="content">
    <div class="container-fluid">
        @include('project-concept-notes.partials.index-filter-form')

        <x-active-filter-chips :chips="$activeChips ?? []" />

        <div class="row">
            <div class="col-12" id="pcnTableCard">
                <x-layouts.index-card
                    :createRoute="can('project-concept-notes', 'add') ? route('project-concept-notes.create') : null"
                    tableHeading="Project Concept Notes"
                    createLabel="Create PCN"
                    tableId="pcnIndexTable"
                    :headers="$pcnIndexHeaders"
                    :sortColumns="$pcnSortColumns"
                    :perPageSlot="view('components.per-page-selector', ['current' => $perPage ?? 25, 'baseUrl' => request()->url()])"
                    :pagination="$notes->links('vendor.pagination.bootstrap-4')">
                    @forelse ($notes as $row)
                        @php
                            $isDraft = (string) ($row->state ?? '') === \App\Models\PC\Pcn\ProjectConceptNote::STATE_DRAFT;
                            $editId = $row->id;
                            $project = $row->project;
                            $projectDisplayName = trim((string) ($project?->name ?? '')) !== ''
                                ? (string) $project->name
                                : (trim((string) ($row->project_name ?? '')) !== '' ? (string) $row->project_name : '—');
                            $state = $isDraft ? 'draft' : ($row->workflow_stage ?? $row->state ?? 'requested');
                            if ($isDraft) {
                                $stateLabel = 'Draft';
                            } else {
                                $stateLabel = app(\App\Services\PC\Pcn\PcnWorkflowService::class)->workflowStageDisplayLabel($row);
                            }
                            $badgeClass = match ($state) {
                                'cleared_cdwp', 'approved' => 'badge-success',
                                'declined', 'rejected' => 'badge-danger',
                                'draft' => 'badge-secondary',
                                default => 'badge-info',
                            };
                            $showPcnModifiedLabel = ! $isDraft
                                && (bool) ($row->is_modified ?? false)
                                && (bool) ($row->status ?? true);
                        @endphp
                        <tr>
                            <td>{{ $project?->adp_number ?? '—' }}</td>
                            <td>{{ $project?->code ?? '—' }}</td>
                            <td class="text-left">
                                <a href="#"
                                   class="pcn-open-modal pcn-listing-scheme-trigger details-modal-trigger"
                                   data-pcn-id="{{ $editId }}"
                                   data-entity-name="{{ display_attr($projectDisplayName) }}">
                                    <x-scheme-name-table-display :fullName="$projectDisplayName" />
                                    @if ($showPcnModifiedLabel)
                                        <div class="small text-muted mt-1"><span class="badge badge-warning">Modified</span></div>
                                    @endif
                                </a>
                            </td>
                            @if ($pcnShowWorkingPaperColumn)
                                <td class="text-center align-middle pcn-wp-listing-cell">
                                    @php
                                        $pcnWpList = ! $isDraft
                                            ? ($row->submitted_working_papers ?? collect())
                                            : collect();
                                        $pcnWpViewUrls = [];
                                        foreach ($pcnWpList as $pcnWp) {
                                            $pcnWpType = (string) ($pcnWp['type'] ?? '');
                                            if ($pcnWpType !== '' && ! empty($pcnWp['id'] ?? null) && ! empty($pcnWpViewPerms[$pcnWpType])) {
                                                $pcnWpViewUrls[$pcnWpType] = route('working-papers.edit', ['type' => $pcnWpType, 'id' => $pcnWp['id']]);
                                            }
                                        }
                                        $pcnHasViewableWp = $pcnWpViewUrls !== [];
                                        $pcnWpAllowsNewByType = is_array($row->working_paper_allows_new_by_type ?? null)
                                            ? $row->working_paper_allows_new_by_type
                                            : [];
                                        $pcnCanGenerateWpForRow = $pcnCanGenerateAnyWorkingPaper
                                            && ! $isDraft
                                            && ! empty($row->working_paper_generate_eligible);
                                        $pcnCanCreateNewWpForRow = $pcnCanGenerateWpForRow
                                            && ! empty($row->working_paper_allows_new);
                                    @endphp
                                    @if ($pcnHasViewableWp || ($pcnCanGenerateWpForRow && $pcnCanCreateNewWpForRow))
                                        <a
                                            class="pcn-wp-listing-btn {{ $pcnHasViewableWp ? 'pcn-wp-listing-btn--ready' : 'pcn-wp-listing-btn--generate' }}"
                                            target="_blank"
                                            rel="noopener"
                                            href="{{ route('working-papers.create', ['type' => 'pdwp']) }}?project_concept_note_id={{ $row->id }}"
                                            data-pcn-working-paper-picker="1"
                                            data-pcn-id="{{ $row->id }}"
                                            data-has-submitted-wp="{{ $pcnHasViewableWp ? '1' : '0' }}"
                                            data-can-generate-wp="{{ $pcnCanGenerateWpForRow ? '1' : '0' }}"
                                            data-can-create-new-wp="{{ $pcnCanCreateNewWpForRow ? '1' : '0' }}"
                                            data-wp-allows-new-types='@json($pcnWpAllowsNewByType)'
                                            data-wp-view-urls='@json($pcnWpViewUrls)'
                                            title="{{ $pcnHasViewableWp ? 'View working paper' : 'Generate working paper' }}"
                                            aria-label="{{ $pcnHasViewableWp ? 'View working paper' : 'Generate working paper' }}"
                                        >
                                            <i class="fas {{ $pcnHasViewableWp ? 'fa-file-alt' : 'fa-plus' }}" aria-hidden="true"></i>
                                            {{ $pcnHasViewableWp ? 'View' : 'Generate' }}
                                        </a>
                                    @else
                                        <span class="text-muted pcn-wp-listing-empty">—</span>
                                    @endif
                                </td>
                            @endif
                            <td><span class="badge {{ $badgeClass }} pcn-status-badge">{{ $stateLabel }}</span></td>
                            @if ($pcnShowReceivedDate ?? false)
                                <td>{{ $row->updated_at?->format('d M Y') ?? '—' }}</td>
                            @endif
                            <td>{{ $row->submitted_at?->format('d M Y') ?? ($isDraft ? '—' : ($row->created_at?->format('d M Y') ?? '—')) }}</td>
                        </tr>
                    @empty
                        <tr><td colspan="{{ count($pcnIndexHeaders) }}" class="text-center text-muted py-4">No Project Concept Notes found.</td></tr>
                    @endforelse
                </x-layouts.index-card>
            </div>
        </div>
    </div>
</section>

@include('project-concept-notes.partials.details-modal')
    @include('project-concept-notes.partials.forward-decline-modals')
    @include('project-concept-notes.partials.send-for-comments-modals')
@endsection

@push('scripts')
@include('partials.collapsible-filter-scripts')
@if (($pcnWorkingPaperPermissions['show'] ?? false))
<script>
    (function () {
        var createBase = {
            'pre-pdwp': @json(route('working-papers.create', ['type' => 'pre-pdwp'])),
            'pdwp': @json(route('working-papers.create', ['type' => 'pdwp']))
        };
        var canGenerateWpTypes = @json($pcnWorkingPaperPermissions['generate'] ?? []);
        var canViewWpTypes = @json($pcnWorkingPaperPermissions['view'] ?? []);
        var wpTypeOrder = ['pre-pdwp', 'pdwp'];
        var wpTypeLabels = { 'pre-pdwp': 'Pre-PDWP', 'pdwp': 'PDWP' };

        function wpTypeLabel(type) {
            return wpTypeLabels[type] || String(type || '');
        }

        function formatWpTypeList(types) {
            var labels = (types || []).map(wpTypeLabel).filter(Boolean);
            if (labels.length === 0) return '';
            if (labels.length === 1) return labels[0];
            return labels.slice(0, -1).join(', ') + ' or ' + labels[labels.length - 1];
        }

        function buildUrl(type, pcnId, forceNew) {
            var base = createBase[type];
            if (!base) return '';
            var url = base + '?project_concept_note_id=' + encodeURIComponent(String(pcnId || ''));
            if (forceNew) {
                url += '&new=1';
            }
            return url;
        }

        function parseJsonAttr(anchor, name) {
            try {
                var parsed = JSON.parse(anchor.getAttribute(name) || '{}');
                return parsed && typeof parsed === 'object' ? parsed : {};
            } catch (err) {
                return {};
            }
        }

        function notify(title, text) {
            if (typeof Swal !== 'undefined' && Swal && typeof Swal.fire === 'function') {
                Swal.fire({ title: title, text: text, icon: 'info' });
            } else {
                window.alert(text);
            }
        }

        function pickType(title, text, types, onPick) {
            if (types.length === 1) {
                onPick(types[0]);
                return;
            }
            var inputOptions = {};
            types.forEach(function (type) {
                inputOptions[type] = wpTypeLabel(type);
            });
            if (typeof Swal !== 'undefined' && Swal && typeof Swal.fire === 'function') {
                Swal.fire({
                    title: title,
                    text: text,
                    input: 'radio',
                    inputOptions: inputOptions,
                    inputValidator: function (value) {
                        if (!value) return 'Please select an option';
                        return undefined;
                    },
                    showCancelButton: true,
                    confirmButtonText: 'Open'
                }).then(function (res) {
                    if (res.isConfirmed && res.value) {
                        onPick(res.value);
                    }
                });
            } else {
                var val = window.prompt('Type one: ' + types.join(' / '), types[0]);
                if (!val) return;
                val = String(val).trim();
                if (types.indexOf(val) === -1) return;
                onPick(val);
            }
        }

        function openGeneratePicker(pcnId, forceNew, allowsNewTypes) {
            var generateTypes = wpTypeOrder.filter(function (type) {
                if (!canGenerateWpTypes[type]) return false;
                if (!forceNew) return true;
                return !!allowsNewTypes[type];
            });
            if (generateTypes.length === 0) {
                notify(
                    'Select Working Paper Type',
                    forceNew
                        ? 'A working paper already exists. A new paper is allowed only after a revision, or when Hold is enabled for that meeting type.'
                        : 'You do not have permission to generate a working paper.'
                );
                return;
            }
            pickType(
                'Select Working Paper Type',
                'Choose which working paper to generate (' + formatWpTypeList(generateTypes) + ').',
                generateTypes,
                function (type) {
                    // No noopener: the working paper tab uses window.opener to reload this list after save.
                    window.open(buildUrl(type, pcnId, forceNew), '_blank');
                }
            );
        }

        function openViewPicker(viewUrls) {
            var existingTypes = wpTypeOrder.filter(function (type) {
                return !!viewUrls[type];
            });
            var visibleTypes = existingTypes.filter(function (type) {
                return !!canViewWpTypes[type];
            });
            if (visibleTypes.length === 0) {
                notify('View Working Paper', 'You do not have access to view this working paper.');
                return;
            }
            pickType(
                'View Working Paper',
                visibleTypes.length === 1
                    ? 'Open the ' + formatWpTypeList(visibleTypes) + ' working paper.'
                    : 'Choose which working paper to open (' + formatWpTypeList(visibleTypes) + ').',
                visibleTypes,
                function (type) {
                    window.open(viewUrls[type], '_blank');
                }
            );
        }

        function openPicker(anchor) {
            var pcnId = anchor.getAttribute('data-pcn-id') || '';
            if (!pcnId) return;
            var hasSubmitted = anchor.getAttribute('data-has-submitted-wp') === '1';
            var canGenerate = anchor.getAttribute('data-can-generate-wp') === '1';
            var canCreateNew = anchor.getAttribute('data-can-create-new-wp') === '1';
            var viewUrls = parseJsonAttr(anchor, 'data-wp-view-urls');
            var allowsNewTypes = parseJsonAttr(anchor, 'data-wp-allows-new-types');

            if (!hasSubmitted) {
                if (canGenerate && canCreateNew) {
                    openGeneratePicker(pcnId, false, allowsNewTypes);
                }
                return;
            }

            if (!canGenerate || !canCreateNew) {
                openViewPicker(viewUrls);
                return;
            }

            if (typeof Swal !== 'undefined' && Swal && typeof Swal.fire === 'function') {
                Swal.fire({
                    title: 'Working paper',
                    text: 'Open a saved working paper or start a new one when the meeting type permits it. Older versions stay on record.',
                    icon: 'question',
                    showCancelButton: true,
                    confirmButtonText: 'View working paper',
                    cancelButtonText: 'Create new working paper'
                }).then(function (res) {
                    if (res.isConfirmed) {
                        openViewPicker(viewUrls);
                        return;
                    }
                    var cancelDismiss = (typeof Swal.DismissReason !== 'undefined' && Swal.DismissReason.cancel)
                        ? Swal.DismissReason.cancel
                        : 'cancel';
                    if (res.dismiss === cancelDismiss) {
                        openGeneratePicker(pcnId, true, allowsNewTypes);
                    }
                });
            } else if (window.confirm('View latest working paper? OK = View, Cancel = Create new')) {
                openViewPicker(viewUrls);
            } else {
                openGeneratePicker(pcnId, true, allowsNewTypes);
            }
        }

        document.addEventListener('click', function (e) {
            var anchor = e.target && e.target.closest
                ? e.target.closest('a[data-pcn-working-paper-picker="1"]')
                : null;
            if (!anchor) return;
            e.preventDefault();
            openPicker(anchor);
        });
    })();
</script>
@endif
@include('partials.index-datatable-scripts')
@include('project-concept-notes.partials.show-modal-scripts')
@include('project-concept-notes.partials.pcn-reviewer-signature-scripts')
<script>
$(function () {
    function pcnRefreshSchemeNameCells() {
        if (typeof window.pmsRefreshSchemeNameCells === 'function') {
            window.pmsRefreshSchemeNameCells(document.getElementById('pcnTableCard'));
        }
    }

    if ($('#pcnIndexTable').length && typeof window.PmsIndexDataTable !== 'undefined') {
        PmsIndexDataTable.initLaravelPaginated('#pcnIndexTable', {
            order: [],
            initComplete: function () {
                pcnRefreshSchemeNameCells();
            },
            drawCallback: function () {
                pcnRefreshSchemeNameCells();
            },
        });
        PmsIndexDataTable.attachServerSort('#pcnIndexTable', {
            sortColParam: 'sort_column',
            sortDirParam: 'sort_direction',
            currentSortCol: '{{ request("sort_column", "") }}',
            currentSortDir: '{{ request("sort_direction", "desc") }}',
            currentQuery: @json(request()->except(['page', 'sort_column', 'sort_direction']))
        });
    }

    pcnRefreshSchemeNameCells();
    setTimeout(pcnRefreshSchemeNameCells, 0);

    @if (request('open_pcn'))
    (function pcnOpenFromQuery() {
        var openId = @json((string) request('open_pcn'));
        var submitComment = @json(request('submit_comment') === '1' || request('submit_comment') === 1);
        if (submitComment) {
            $('#pcnDetailsModal').data('open-submit-comment-on-load', true);
        }
        setTimeout(function () {
            var $trigger = $('.pcn-open-modal[data-pcn-id="' + String(openId).replace(/\\/g, '\\\\').replace(/"/g, '\\"') + '"]').first();
            if ($trigger.length) {
                $trigger.trigger('click');
                return;
            }
            $.get(@json(url('project-concept-notes')) + '/' + encodeURIComponent(openId) + '/show')
                .done(function (res) {
                    if (!res || res.status !== 200) return;
                    if (typeof window.pcnResetModalActions === 'function') {
                        window.pcnResetModalActions();
                    }
                    $('#pcnDetailsModalLabel').text(res.title || 'Project Concept Note Details');
                    $('#pcnDetailsModalBody').html(res.html || '');
                    $('#pcnDetailsModal').data('pcn-id', openId);
                    $('#pcnDetailsModal').data('pcn-state', res.state || '');
                    $('#pcnDetailsModal').data('pcn-kind', res.kind || '');
                    if (res.preview_url) {
                        $('#pcnModalPreviewBtn').attr('href', res.preview_url).show();
                    }
                    var maySubmitComment = !!res.may_submit_comment;
                    if (res.may_forward && !maySubmitComment) {
                        $('#pcnModalForwardBtn').show();
                    }
                    if (res.may_send_for_comments) {
                        $('#pcnModalSendForCommentsBtn').show();
                    }
                    if (maySubmitComment) {
                        $('#pcnModalSubmitCommentBtn').show();
                    }
                    if (res.may_reject && !maySubmitComment) {
                        $('#pcnModalDeclineBtn').show();
                    }
                    if (typeof window.pcnRenderTimeline === 'function') {
                        window.pcnRenderTimeline(res.timeline || []);
                    }
                    $('#pcnDetailsModal').modal('show');
                    if ($('#pcnDetailsModal').data('open-submit-comment-on-load')) {
                        $('#pcnDetailsModal').removeData('open-submit-comment-on-load');
                        if (maySubmitComment && typeof window.pcnOpenSubmitCommentModal === 'function') {
                            setTimeout(function () { window.pcnOpenSubmitCommentModal(); }, 400);
                        }
                    }
                });
        }, 300);
    })();
    @endif
});
</script>
@include('meeting-workspace.partials.mws-schedule-meeting-type-picker-script')
@endpush