@php(
    $headerOption = \App\Http\Controllers\Controller::getHeaderOptions(
        $title ?? '',
        $subTitle ?? '',
        isset($filters) ? $filters : [],
        isset($advancedFilters) ? $advancedFilters : []
    )
)
@php($headingOptions = [
    $permission['create'] ? '<a href="' . route($routePrefix . '.create') . '" class="'. \Config::get('view.buttons.primary') .' show-modal"><i class="'. \Config::get('settings.icon_add') .'"></i> Add New Lead Tab</a>' : ''
])
@extends('admin.layouts.layout', $headerOption)
@section('content')
    <div class="col-12">
        <div class="back-section mb-2">
            <button type="button" class="btn back-btn waves-effect" onclick="window.history.back()">
                <i class="{{ \Config::get('settings.icon_back') }}"></i> Back to Administration
            </button>
        </div>
        <div class="project-box">
            <x-heading-sec :module="$module" :options="$headingOptions" />
            <div class="normal-text">
                <span><b>Instructions:</b> Use this page to manage your data fields. Lead tabs and lead fields are the basis of organizing and tracking information about your prospects and customers.<br>To reorder the items below, click-and-drag the item to the desired location.</span>
                <span><b>Open API:</b> <a href="#" target="_blank" rel="noopener">View Open API Documentation</a></span>
            </div>
            <div class="heading-btn-sec mt-4">
                <h3>Current Lead Tabs</h3>
            </div>
            <div class="project-box h-100">
                <div class="table-responsive project-table no-border">
                    <table class="draggable-table {{ \Config::get('view.table.table_class') }}">
                        @if(isset($data) && count($data) > 0)
                            @foreach($data as $tab)
                                <thead class="table-group-header" data-id="{{ $tab->id }}">
                                    <tr>
                                        <th class="w-5"><img src="{{ asset('img/drag-dot.svg') }}" class="drag-handle"></th>
                                        <th class="w-50">{{ $tab->title }}</th>
                                        <th></th>
                                    </tr>
                                </thead>
                                <tbody class="table-group-body" data-id="{{ $tab->id }}">
                                    <tr>
                                        <td class="w-5"></td>
                                        <td>
                                            <b>Type:</b> {{ $fieldTabTypes[$tab->type]['name'] ?? '' }} &nbsp;&nbsp; | &nbsp;&nbsp; 
                                            <b>Position:</b> {{ $positions[$tab->position]['name'] ?? '' }} &nbsp;&nbsp; | &nbsp;&nbsp; 
                                            <b>Fields:</b> {{ is_countable($tab->leadFields) ? count($tab->leadFields) : 0 }}
                                        </td>
                                        <td class="d-flex gap-2 justify-content-end">
                                            @if($permission['destroy'] && !$tab->is_system_defined)
                                                @if(\App\Models\Masters\MasterLeadFieldTab::getDeleteIconPermission($tab->id))
                                                    <a href="javascript:void(0);" class="action-btn" data-toggle="tooltip" title="Delete"
                                                       data-confirm="Are You Sure?|This action can not be undone. Do you want to continue?"
                                                       data-confirm-yes="event.preventDefault();
                                                       document.getElementById('delete-form-{{ $tab->id }}').submit();">
                                                        <i class="{{ \Config::get('settings.icon_delete') }}"></i>
                                                    </a>
                                                    {!! html()->form('DELETE', route($routePrefix . '.destroy', $tab->id))
                                                        ->attributes(['style' => 'display:none', 'id' => 'delete-form-' . $tab->id])
                                                        ->open() !!}
                                                    {!! html()->form()->close() !!}
                                                @endif
                                            @endif

                                            @if($permission['edit'])
                                                <a href="{{ route($routePrefix . '.edit', $tab->id) }}"
                                                   class="action-btn show-modal"
                                                   data-url="{{ route($routePrefix . '.edit', $tab->id) }}"
                                                   data-toggle="tooltip" title="Edit Tab">
                                                    <i class="{{ \Config::get('settings.icon_edit') }}"></i>
                                                </a>
                                            @endif

                                            @if($permission['manageRole'])
                                                <a href="{{ route($routePrefix . '.permissions', $tab->id) }}"
                                                   class="action-btn show-modal"
                                                   data-url="{{ route($routePrefix . '.permissions', $tab->id) }}"
                                                   data-toggle="tooltip" title="Manage Permissions">
                                                    <i class="{{ \Config::get('settings.icon_settings') }}"></i>
                                                </a>
                                            @endif

                                            @if($permission['create'])
                                                <a href="{{ route('manages.lead-fields.index', ['lead_field_tab_id' => $tab->id]) }}"
                                                   type="button" class="btn add-btn">
                                                    Add/Remove Fields
                                                </a>
                                            @endif
                                        </td>
                                    </tr>
                                </tbody>
                            @endforeach
                        @else
                            <tr>
                                <td class="w-5">No Lead Tabs Available</td>
                            </tr>
                        @endif
                    </table>
                </div>
            </div>
            @include('admin.components.pagination')
        </div>
    </div>
@endsection
@push('page_script')
    <script src="{{ asset('assets/js/drag-drop-table-group.js') }}"></script>
    @if(isset($data) && count($data) > 0)
        <script>
            $(document).ready(function() {
                $('.draggable-table').each(function() {
                    initTableDragDrop({
                        tableSelector: this,
                        parentReorderUrl: '{{ route('manages.lead-field-tabs.update-order') }}',
                        csrfToken: '{{ csrf_token() }}'
                    });
                });
            });
        </script>
    @endif
@endpush