@extends('layouts.app')
@push('title')
    {{ __($pageTitle) }}
@endpush
@section('content')
    <main>
        <div class="container-fluid">
            <div class="row">
                <div class="col-md-12">
                    <div class="bda-list-bot-area">
                        <div class="accordion" id="accordionExample">
                            
                            <!-- accordion item start -->
                            <div class="accordion-item bda-bot-accordion-item">
                                <div class="accordion-header bda-accordion-header" id="headingOne2">
                                    <div class="accordion-button bda-bot-accordion" data-bs-toggle="collapse"
                                         data-bs-target="#" aria-expanded="true" aria-controls="collapseOne">
                                        <div
                                                class="d-flex gap-3 w-100 justify-content-between align-items-center flex-wrap">
                                            <div class="d-flex gap-3">
                                                <img src="{{asset('assets/images/icon/message.svg')}}" alt="">
                                                <h6 class="bda-fs-24 title-light">{{__("Call Center")}}</h6>
                                            </div>
                                            <!-- search -->
                                            <div class="bda-search-bot-box py-2">
                                                <img src="{{asset("assets/images/icon/Search-2.svg")}}" alt="">
                                                <input type="text" class="bda-search-bot" id="callCenterSearch"
                                                       placeholder="{{__("Search here")}}">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div id="collapseOne" class="accordion-collapse collapse show"
                                     aria-labelledby="headingOne2" data-bs-parent="#accordionExample2">
                                    <div class="accordion-body bda-accordion-bot-body overflow-auto" id="callCenterList">
                                        <div class="d-flex flex-wrap bda-gab-16 align-items-center px-4">
                                            @foreach($callcenterList as $singleCallcenter)
                                                <a href="{{route('user.callcenter.create', encrypt($singleCallcenter->id))}}">
                                                    <div class="bda-single-bot-box upper-bg">
                                                        <img class="bda-bot-img"
                                                             src="{{asset("assets/images/icon/message.svg")}}"
                                                             alt="{{__("Chatbot Icon")}}">
                                                        <p>{{$singleCallcenter->callcenter_name}}</p>
                                                    </div>
                                                </a>
                                            @endforeach
                                            <a href="{{route('user.callcenter.create')}}">
                                                <div class="bda-single-bot-box bda-border-dashed tiles-dark-bg">
                                                    <img class="bda-bot-img"
                                                         src="{{asset("assets/images/icon/plus.svg")}}"
                                                         alt="{{__("Call Center Create Icon")}}">
                                                    <p>{{__("Create New")}}</p>
                                                </div>
                                            </a>
                                        </div>
                                        <!-- not active chat bot -->
                                        @if(count($callcenterList) == 0)
                                            <div class="bda-bot-not-active">
                                                <img src="{{asset("assets/images/user-bot-blank.png")}}" alt="">
                                                <p class="text-center placeholder-color">{{__("No Data Found")}}</p>
                                            </div>
                                        @endif
                                    </div>
                                </div>
                            </div>
                            <!-- accordion item end -->
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </main>
    <input type="hidden" value="{{route('user.chatbot.search')}}" id="chatbotSearchRoute">
    <input type="hidden" value="{{route('user.callcenter.search')}}" id="callcenterSearchRoute">
@endsection
@push('script')
    <script src="{{ asset('assets/js/custom/user/dashboard.js') }}"></script>
@endpush