@if($queues->count())
    @foreach ($queues as $queue)
        {{-- [bg-success, bg-warning, bg-danger, bg-info, bg-secondary] --}}
        @php
            /** @var TYPE_NAME $queue */
            /** @var TYPE_NAME $waitingTime */
            /** @var TYPE_NAME $time */
                $waiting_time = ($waitingTime + strtotime($queue->called_at)) - time();

                if ($queue->called_at && $queue->status == 'done'){
                    $queue->color = 'bg-success';
                } elseif($queue->called_at && $queue->status == 'active' && $waiting_time >= 0) {
                    $queue->color = 'bg-warning';
                } elseif($queue->called_at && $queue->status == 'active' && $waiting_time < 0){
                    $queue->color = 'bg-danger';
                    $queue->check_in_action = true;
                } elseif(!$queue->called_at && $queue->status == 'active') {
                    $queue->color = 'bg-info';
                    $queue->check_in_cancel_action = true;
                } elseif($queue->status == 'cancelled') {
                    $queue->color = 'bg-secondary';
                }
        @endphp
        <div class="rounded-list">
            <span class="cir {{$queue->color}} color_{{$queue->id}}"></span>
            <p><i class="fas {{$queue->user_id?'fa-mobile online':'fa-laptop'}}"></i>{{$queue->customer_name}}</p>
            <small>{{'QN:'.$queue->serial}}</small>
            <small>{{$queue->person_count . ' '. __('merchants.persons')}}</small>
            <small>{{date('h:i', strtotime($queue->created_at))}}</small>
            {{-- {!! \QrCode::size(300)->phoneNumber($queue->customer_phone) !!} --}}
            {{--                                <img src="data:image/png;base64, {!! base64_encode(QrCode::size(300)->format('png')->phoneNumber($queue->customer_phone)) !!}">--}}
            <a href="{{asset($queue->user->qr_code ?? $queue->qr_code ?? 'assets/web/images/qr-code.png')}}" data-fancyBox class="qr-icon">
                <img src="{{asset('assets/web/images/qr-code.png')}}" alt="">
            </a>
            <a href="tel:{{$queue->customer_phone}}" class="icon">
                <i class="fas fa-phone"></i>
            </a>

            @if($queue->check_in_action)
                <div class="deleted_section">
                    <div class="edit-box rounded-box">
                        <a data-color-target=".color_{{$queue->id}}" data-color="bg-success" data-waiting-time-finish="true" data-checkin="true" data-cancel="false" data-name="{{$queue->customer_name}}" data-phone="{{$queue->customer_phone}}" href="{{route('merchant.checkInOrCancelFromHistoryList', $queue->user_id)}}" class="bg-success rounded text-light checkInOrCancelFromHistoryList">{{$waiting_time < 0 ? __('merchants.check_in') : __('merchants.call')}}</a>
                    </div>
                    <span class="edit"><i class="far fa-edit"></i></span>
                </div>
            @endif
            @if($queue->check_in_cancel_action)
            <!-- ------------ new ------------- -->
                <div class="deleted_section">
                    <div class="edit-box rounded-box">
                        <a href="#" class="bg-secondary rounded text-light">{{__('merchants.cancel')}}</a>
                        <a data-color-target=".color_{{$queue->id}}" data-color="bg-warning" data-waiting-time-finish="false" data-checkin="true" data-cancel="false" data-name="{{$queue->customer_name}}" data-phone="{{$queue->customer_phone}}" href="{{route('merchant.checkInOrCancelFromHistoryList', $queue->user_id)}}" class="bg-warning rounded text-light checkInOrCancelFromHistoryList">{{__('merchants.call')}}</a>
                        <div class="form w-100">
                            <div class="form-group">
                                <label>{{__('merchants.cancel_reason')}}</label>
                                <select name="reason_message" class="form-control message_{{$queue->id}}">
                                    <option value="">{{__('merchants.select')}}</option>
                                    @foreach($cancelReason as $reason)
                                        <option value="{{$reason->id}}">{!! $reason->message !!}</option>
                                    @endforeach
                                </select>
                                <div class="text-center">
                                    <a data-color-target=".color_{{$queue->id}}" data-color="bg-secondary" data-message=".message_{{$queue->id}}" data-waiting-time-finish="false" data-checkin="false" data-cancel="true" data-name="{{$queue->customer_name}}" data-phone="{{$queue->customer_phone}}" href="{{route('merchant.checkInOrCancelFromHistoryList', $queue->user_id)}}" class="butn color small checkInOrCancelFromHistoryList btn-lg"><span>{{__('merchants.send')}}</span></a>
                                    <div class="alert alert-danger mt-3 d-none text-center ajaxError"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <span class="edit"><i class="far fa-edit"></i></span>
                </div>
            @endif
        </div>
    @endforeach

@else
    <div class="rounded-list d-flex justify-content-center align-items-center text-danger">
        <h6>{{__('merchants.no_history_list')}}</h6>
    </div>
@endif