@php
$segment = request()->segment(3);
$segmentid = request()->segment(5); 
$isEdit = $segment === 'edit';
 @endphp
<div class="container-fluid-md">
    <ul class="nav nav-tabs">
        <li class="nav-item">
            <a class="nav-link {{ $segment === 'get-creation' ? 'active' : '' }} tab-link" data-bs-toggle="tab" 
            href="#tab1-1" data-url="get-creation/{{ $code }}" data-code="{{ request()->segment(2) }}">Basic Details</a>
        </li>
                    @php
                        $roles = getCreatorRolesByEntity($code);
                    @endphp
                     @if($roles['contentTabs'])
                    <li class="nav-item {{ in_array($segment, ['add-creation', 'edit']) ? 'active' : '' }}">
                        <a class="nav-link {{ in_array($segment, ['add-creation', 'edit']) ? 'active' : '' }} tab-link" data-bs-toggle="tab" 
                        href="#contenttab1-1" 
                        data-url="{{$segment == 'edit' ? 'edit/'. $code .'/'. $segmentid  : 'add-creation/'. $code }}" 
                        data-code="{{ request()->segment(2) }}">
                        {{ $isEdit ? 'Edit' : 'Add' }} Content
                        </a>
                    </li>
                    <li class="nav-item {{ $segment === 'draft-creation' ? 'active' : '' }}">
                        <a class="nav-link {{ $segment === 'draft-creation' ? 'active' : '' }} tab-link" data-bs-toggle="tab" 
                        href="#contenttab1-2" 
                        data-url="draft-creation/{{ $code }}" data-code="{{ request()->segment(2) }}">Draft Content</a>
                    </li>
                    <li class="nav-item {{ $segment === 'assign-creation' ? 'active' : '' }}"><a class="nav-link {{ $segment === 'assign-creation' ? 'active' : '' }} tab-link" data-bs-toggle="tab" href="#contenttab1-3" data-url="assign-creation/{{ $code }}" data-code="{{ request()->segment(2) }}">Assign Content</a></li>
                    <!-- <li class="nav-item"><a class="nav-link tab-link" data-bs-toggle="tab" href="#contenttab1-4" data-url="edit-creation/{{ $code }}" data-code="{{ request()->segment(2) }}">Edit Content</a></li> -->
                    <li class="nav-item {{ $segment === 'edit-approve-creation' ? 'active' : '' }}">
                        <a class="nav-link {{ $segment === 'edit-approve-creation' ? 'active' : '' }} tab-link" data-bs-toggle="tab" 
                        href="#contenttab1-4"" 
                        data-url="edit-approve-creation/{{ $code }}" data-code="{{ request()->segment(2) }}">Edit Content</a>
                    </li>
                    @endif 
                    @if($roles['videoTabs'])
                    <li class="nav-item {{ in_array($segment, ['add-video', 'edit-video']) ? 'active' : '' }}">
                        <a class="nav-link {{ in_array($segment, ['add-video', 'edit-video']) ? 'active' : '' }} tab-link" data-bs-toggle="tab" 
                        href="#videotab1-1"  
                        data-url="{{ $segment == 'edit-video' ? 'edit-video/' . $code . '/' . $segmentid : 'add-video/' . $code }}" 
                        data-code="{{ request()->segment(2) }}">
                        {{ $segment == "edit-video" ? 'Edit' : 'Add' }} Video
                        </a>
                    </li>
                    <li class="nav-item {{ $segment === 'draft-video' ? 'active' : '' }}">
                        <a class="nav-link {{ $segment === 'draft-video' ? 'active' : '' }} tab-link" data-bs-toggle="tab" 
                        href="#videotab1-2" 
                        data-url="draft-video/{{ $code }}" data-code="{{ request()->segment(2) }}">Draft Video</a>
                    </li>
                    <li class="nav-item {{ $segment === 'assign-video' ? 'active' : '' }}">
                        <a class="nav-link {{ $segment === 'assign-video' ? 'active' : '' }} tab-link" data-bs-toggle="tab" href="#videotab1-3" data-url="assign-video/{{ $code }}" data-code="{{ request()->segment(2) }}">Assign Video</a>
                    </li>
                    <!-- <li><a data-toggle="tab" href="#videotab1-3">Assign Video</a></li> -->
                    <li class="nav-item {{ $segment === 'edit-approve-video' ? 'active' : '' }}">
                        <a class="nav-link {{ $segment === 'edit-approve-video' ? 'active' : '' }} tab-link" data-bs-toggle="tab" 
                        href="#videotab1-4"" 
                        data-url="edit-approve-video/{{ $code }}" data-code="{{ request()->segment(2) }}">Edit Video</a>
                    </li>
                    @endif  @if($roles['articleTabs'])
                    <li class="nav-item {{ in_array($segment, ['add-article', 'edit-article']) ? 'active' : '' }}">
                        <a class="nav-link {{ in_array($segment, ['add-article', 'edit-article']) ? 'active' : '' }} tab-link" data-bs-toggle="tab" 
                        href="#articletab1-1" 
                        data-url="{{$segment == 'edit-article' ? 'edit-article/'. $code .'/'. $segmentid  : 'add-article/'. $code }}" 
                        data-code="{{ request()->segment(2) }}">
                        {{ $segment == "edit-article" ? 'Edit' : 'Add' }} Article
                        </a>
                    </li>
                    <li class="nav-item {{ $segment === 'draft-article' ? 'active' : '' }}">
                        <a class="nav-link {{ $segment === 'draft-article' ? 'active' : '' }} tab-link" data-bs-toggle="tab" 
                        href="#articletab1-2" 
                        data-url="draft-article/{{ $code }}" data-code="{{ request()->segment(2) }}">Draft Article</a>
                    </li>
                    <li class="nav-item {{ $segment === 'assign-article' ? 'active' : '' }}">
                        <a class="nav-link {{ $segment === 'assign-article' ? 'active' : '' }} tab-link" data-bs-toggle="tab" href="#articletab1-3" data-url="assign-article/{{ $code }}" data-code="{{ request()->segment(2) }}">Assign Article</a>
                    </li>
                    <li class="nav-item {{ $segment === 'edit-approve-article' ? 'active' : '' }}">
                        <a class="nav-link {{ $segment === 'edit-approve-article' ? 'active' : '' }} tab-link" data-bs-toggle="tab" 
                        href="#articletab1-4"" 
                        data-url="edit-approve-article/{{ $code }}" data-code="{{ request()->segment(2) }}">Edit Article</a>
                    </li>
                    @endif  @if($roles['seoTabs'])
                    <li><a data-toggle="tab" href="#seotab1-1">Edit Seo</a></li>
                    @endif  @if($roles['advertisementTabs'])
                    <li class="nav-item {{ $segment === 'create-ads' ? 'active' : '' }}"><a class="nav-link {{ $segment === 'create-ads' ? 'active' : '' }} tab-link" data-bs-toggle="tab" href="#ads1-1" data-url="create-ads/{{ $code }}" data-code="{{ request()->segment(2) }}">Create Ads</a></li>
                    <li class="nav-item {{ $segment === 'draft-ads' ? 'active' : '' }}"><a class="nav-link {{ $segment === 'draft-ads' ? 'active' : '' }} tab-link"   data-toggle="tab"   href="#ads1-2" data-url="draft-ads/{{ $code }}" data-code="{{ request()->segment(2) }}">Draft Ads</a></li>
                    <li class="nav-item {{ $segment === 'assign-ads' ? 'active' : '' }}"><a class="nav-link {{ $segment === 'assign-ads' ? 'active' : '' }} tab-link"   data-toggle="tab"   href="#ads1-3" data-url="assign-ads/{{ $code }}" data-code="{{ request()->segment(2) }}">Assign Ads Group</a></li></li>
                    <!-- <li><a data-toggle="tab" href="#ads1-4">Edit Ads</a></li> -->
                    <li class="nav-item {{ $segment === 'edit-approve-ads' ? 'active' : '' }}">
                        <a class="nav-link {{ $segment === 'edit-approve-ads' ? 'active' : '' }} tab-link" data-bs-toggle="tab" 
                        href="#ads1-4"" 
                        data-url="edit-approve-ads/{{ $code }}" data-code="{{ request()->segment(2) }}">Edit Ads</a>
                    </li>
                    @endif
                </ul>
                <div class="tab-content">

            <div class="tab-content mt-3">
                <div id="tab1-1" class="tab-pane {{ $segment === 'get-creation' ? 'show active' : '' }}">
                    @include('admin.common.content.get')
                </div>

                <div id="contenttab1-1" class="tab-pane {{ in_array($segment, ['add-creation', 'edit']) ? 'show active' : '' }}">
                    @include('admin.common.content.add')
                </div>
            
                <div id="contenttab1-2" class="tab-pane {{ $segment === 'draft-creation' ? 'show active' : '' }}">
                    @include('admin.common.content.draft')
                </div>
                <div id="contenttab1-3" class="tab-pane {{ $segment === 'assign-creation' ? 'show active' : '' }}">
                    @include('admin.common.content.assign')
                </div>
                <div id="contenttab1-4" class="tab-pane {{ $segment === 'edit-approve-creation' ? 'show active' : '' }}">
                    @include('admin.common.content.edit-approve-creation')
                </div>
                <!------Video -------------------------->
                <div id="videotab1-1" class="tab-pane {{ in_array($segment, ['add-video', 'edit-video']) ? 'show active' : '' }}">
                    @include('admin.common.video.add')
                </div>
                <div id="videotab1-2" class="tab-pane {{ $segment === 'draft-video' ? 'show active' : '' }}">
                    @include('admin.common.video.draft')
                </div>
                <div id="videotab1-3" class="tab-pane {{ $segment === 'assign-video' ? 'show active' : '' }}"">
                    @include('admin.common.video.assign')
                </div>
                <div id="videotab1-4" class="tab-pane {{ $segment === 'edit-approve-video' ? 'show active' : '' }}">
                    @include('admin.common.video.edit-approve-video')
                </div>
                <!---------Article ------------------->
                <div id="articletab1-1" class="tab-pane {{ in_array($segment, ['add-article', 'edit-article']) ? 'show active' : '' }}">
                    @include('admin.common.article.add')
                </div>
                <div id="articletab1-2" class="tab-pane {{ $segment === 'draft-article' ? 'show active' : '' }}">
                    @include('admin.common.article.draft')
                </div>
                <div id="articletab1-3" class="tab-pane {{ $segment === 'assign-article' ? 'show active' : '' }}">
                    @include('admin.common.article.assign')
                </div>
                <div id="articletab1-4" class="tab-pane {{ $segment === 'edit-approve-article' ? 'show active' : '' }}">
                    @include('admin.common.article.edit-approve-article')
                </div>
                <!----------Seo ------------------>
                <div id="seotab1-1" class="tab-pane">
                    <h1>Edit Seo</h1>
                </div>
                <!---------Adversting ------------------->
                <div id="ads1-1" class="tab-pane  {{ in_array($segment, ['create-ads', 'edit-ads']) ? 'show active' : '' }}">
                    @include('admin.common.ads.add')
                </div>

                <div id="ads1-2" class="tab-pane {{ $segment === 'draft-ads' ? 'show active' : '' }}">
                    @include('admin.common.ads.draft')
                </div>
                <div id="ads1-3" class="tab-pane  {{ $segment === 'assign-ads' ? 'show active' : '' }}">
                    @include('admin.common.ads.assign')
                </div>
                <div id="ads1-4" class="tab-pane {{ $segment === 'edit-approve-ads' ? 'show active' : '' }}">
                    @include('admin.common.ads.edit-approve-ads')
                </div>
            </div>
        </div>
        <script>
        document.addEventListener("DOMContentLoaded", function () {
            document.querySelectorAll('.tab-link').forEach(tab => {
                tab.addEventListener('click', function (e) {
                    e.preventDefault();
        
                    // Show tab using Bootstrap
                    const bsTab = new bootstrap.Tab(this);
                    bsTab.show();
        
                    // Update URL
                    const tabPath = this.getAttribute('data-url');
                    const place= this.getAttribute('data-code');
                    if (tabPath && place) {
                        const newUrl = `${window.location.origin}/admin/${place}/${tabPath}`;
                        window.location.href = newUrl; // redirect
                    }
                });
            });
        });
    </script>