@php($headerOption = \App\Http\Controllers\Controller::getHeaderOptions($title ?? '', $subTitle ?? '', isset($filters) ? $filters : [], isset($advancedFilters) ? $advancedFilters : []))
@php($headingOptions = [$permission['create'] ? '<a href="' . route('manages.sms-templates.create') . '" class="' . \Config::get('view.buttons.primary') . ' show-modal"><i class="' . \Config::get('settings.icon_add') . '"></i> Add New Template</a>' : ''])
@extends('admin.layouts.layout', $headerOption)
@section('content')
    <div class="col-12">
        <div class="project-box">
            <x-heading-sec :module="$module" :options="$headingOptions" />
            <div class="normal-text">
                <span>Customize SMS Templates.</span>
                <span>Instructions:</span>
            </div>
            <div class="inner-boxes">
                <ul>
                    <li><button type="button" class="yellow-btn" disabled aria-disabled="true">To&nbsp;Add&nbsp;a new template, simply click on "Add New Template"</button></li>
                    <li><button type="button" class="yellow-btn" disabled aria-disabled="true">To&nbsp;Edit&nbsp;the template, click on "Edit Template"</button></li>
                    <li><button type="button" class="yellow-btn" disabled aria-disabled="true">To&nbsp;Delete&nbsp;a template, click on "Delete"</button></li>
                    <li><button type="button" class="yellow-btn" disabled aria-disabled="true">To reorganize the order of the templates, simply drag a template container up or down</button></li>
                </ul>
            </div>
            <div class="inner-tab mt-4">
                <ul class="nav nav-tabs project-tab mb-30" id="myTab" role="tablist">

                    @foreach ($masterGroups as $group)
                        <!-- Check if group id is greater than 1 -->
                        <li class="nav-item" role="presentation">
                            <a href="{{ route($routePrefix . '.index', ['gr' => $group['id']]) }}"
                                class="nav-link waves-effect {{ $selectedGroup == $group['id'] ? 'active' : '' }}"
                                style="{{ $selectedGroup == $group['id'] ? 'background-color: #16C4C0; color: white;' : '' }}">
                                {{ $group['name'] }}
                                {{-- @if ($group['id'] == '1')
                                    ({{ $data->where('template_category', 1)->count() }})
                                @elseif ($group['id'] == '2')
                                    ({{ $data->where('template_category', 2)->count() }})
                                @elseif ($group['id'] == '3')
                                    ({{ $data->where('template_category', 3)->count() }})
                                @elseif ($group['id'] == '4')
                                    ({{ $data->where('template_category', 4)->count() }})
                                @endif --}}
                            </a>
                        </li>
                    @endforeach
                    {{-- <li class="nav-item" role="presentation">
                        <button class="nav-link active waves-effect" id="home-tab" data-bs-toggle="tab"
                            data-bs-target="#home-tab-pane" type="button" role="tab" aria-controls="home-tab-pane"
                            aria-selected="true">Quick (Lead) SMS
                            ({{ $data->where('template_category', 1)->count() }})</button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="nav-link waves-effect" id="profile-tab" data-bs-toggle="tab"
                            data-bs-target="#profile-tab-pane" type="button" role="tab"
                            aria-controls="profile-tab-pane" aria-selected="false">System SMS
                            ({{ $data->where('template_category', 2)->count() }})</button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="nav-link waves-effect" id="closing-tab" data-bs-toggle="tab"
                            data-bs-target="#closing-tab-pane" type="button" role="tab"
                            aria-controls="closing-tab-pane" aria-selected="false">Dispute Responder SMS
                            ({{ $data->where('template_category', 3)->count() }})</button>
                    </li> --}}
                </ul>
                <div class="tab-content" id="myTabContent">
                    <div class="tab-pane fade show active" id="home-tab-pane" role="tabpanel" aria-labelledby="home-tab"
                        tabindex="0">
                        <div class="row">
                            <div class="col-12 ">
                                <div class="project-box h-100">
                                    <div class="table-responsive project-table no-border">

                                        <table class="draggable-table {{ \Config::get('view.table.table_class') }}"
                                            data-count="count($data)">
                                            
                                            @if (isset($data) && count($data) > 0)
                                                @foreach ($data as $dd)
                                                    {{-- @if ($dd->template_category == 1) --}}
                                                
                                                    <thead style="background-color: #E8E8E8;" class="table-group-header"
                                                        data-id="{{ $dd->id }}">
                                                        <tr>
                                                            <th class="w-5"><img src="{{ asset('img/drag-dot.svg') }}"
                                                                    class="drag-handle"></th>
                                                            <th>{{ $dd->template_title }}</th>
                                                            <th></th>
                                                        </tr>
                                                    </thead>
                                                    <tbody class="table-group-body" data-id="{{ $dd->id }}">
                                                        <tr>
                                                            <td class="w-5"></td>
                                                            <td></td>
                                                            @if ($permission['edit'] || $permission['destroy'] || $permission['manageRole'])
                                                                <td>
                                                                    <div class="d-flex gap-2 justify-content-end">

                                                                        @if (isset($permission['destroy']) && $permission['destroy'])
                                                                            <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-{{ $dd->id }}').submit();"><i
                                                                                    class="{{ \Config::get('settings.icon_delete') }}"></i></a>
                                                                            {!! html()->form('DELETE', route($routePrefix . '.destroy', $dd->id))->attributes([
                                                                                    'style' => 'display:inline',
                                                                                    'id' => 'delete-form-' . $dd->id,
                                                                                ])->open() !!}
                                                                            {!! html()->form()->close() !!}
                                                                        @endif
                                                                        @if (isset($permission['manageRole']) && $permission['manageRole'])
                                                                            <a href="{{ route($routePrefix . '.permission-form', $dd->id) }}"
                                                                                class="action-btn show-modal"
                                                                                data-url="{{ route($routePrefix . '.permission-form', $dd->id) }}"
                                                                                title="Permission">
                                                                                <i
                                                                                    class="{{ \Config::get('settings.icon_settings') }}"></i></a>
                                                                        @endif


                                                                        {{-- <a href="{{ route($routePrefix . '.create', ['type' => 'copy', 'copy_from' => $dd->id]) }}"
                                                                                class="action-btn show-modal"
                                                                                data-url="{{ route($routePrefix . '.create', ['type' => 'copy', 'copy_from' => $dd->id]) }}"
                                                                                title="Copy Content">
                                                                                <i class="mdi mdi-content-copy"></i>
                                                                            </a> --}}
                                                                        <a href="{{ route($routePrefix . '.edit', ['sms_template' => $dd->id, 'type' => 'show']) }}"
                                                                            class="action-btn show-modal-lg"
                                                                            data-url="{{ route($routePrefix . '.edit', ['sms_template' => $dd->id, 'type' => 'show']) }}"
                                                                            title="Preview Content">
                                                                            <i class="bx bx-search"></i></a>
                                                                        @if (isset($permission['edit']) && $permission['edit'])
                                                                            <a href="{{ route($routePrefix . '.edit', $dd->id) }}"
                                                                                class="action-btn show-modal"
                                                                                data-url="{{ route($routePrefix . '.edit', $dd->id) }}"
                                                                                title="Edit">
                                                                                <i
                                                                                    class="{{ \Config::get('settings.icon_edit') }}"></i>
                                                                            </a>
                                                                        @endif

                                                                    </div>
                                                                </td>
                                                            @endif
                                                        </tr>
                                                    </tbody>
                                                    {{-- @endif --}}
                                                @endforeach
                                            @else
                                            <thead style="background-color: #E8E8E8;" class="table-group-header"
                                                        >
                                                          <tr>
                                                    <td class="w-5">No Templates</td>
                                                </tr>
                                            </thead>
                                             
                                            @endif
                                        </table>

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




                </div>
            </div>
            @include('admin.components.pagination')
        </div>
    </div>
@endsection
@push('page_script')
    <script src="{{ asset('assets/js/drag-drop-table-group.js') }}"></script>
    <script>
        $(document).ready(function() {
            $('.draggable-table').each(function() {
                const $rows = $(this).find('tbody tr');
                if ($rows.length > 0) {
                    initTableDragDrop({
                        tableSelector: this,
                        parentReorderUrl: '{{ route('manages.sms-templates.update-order') }}',
                        csrfToken: '{{ csrf_token() }}'
                    });
                }

            });
        });
    </script>
@endpush