@extends('admin.layouts.app')
@section('panel')

    <div class="row">
        <div class="col-12">
            <div class="row gy-4">
                <div class="col-xxl-6 col-sm-6">
                    <x-widget
                    style="2"
                    link="javascript:void(0)"
                    title="Total Payment"
                    icon="las la-wallet"
                    value="{{ showAmount($user->tickets()->booked()->sum('sub_total')) }}"
                    outline="true"
                    />
                </div>
                <div class="col-xxl-6 col-sm-6">
                    <x-widget
                        style="2"
                        link="{{ route('admin.booking.booked') }}?search={{ $user->mobile }}"
                        title="Total Ticket"
                        icon="las la-money-bill-wave-alt"
                        value="{{ $user->tickets()->booked()->sum('ticket_count') }}"
                        outline="true"
                    />
                </div>
                <div class="col-xxl-4 col-sm-6">
                    <x-widget
                        style="6"
                        link="{{ route('admin.booking.pending') }}?search={{ $user->mobile }}"
                        title="Pending Ticket"
                        icon="las la-spinner"
                        value="{{ $user->tickets()->pending()->sum('ticket_count') }}"
                        bg="info"
                        outline="true"
                    />
                </div>

                <div class="col-xxl-4 col-sm-6">
                    <x-widget
                        style="6"
                        link="{{ route('admin.booking.canceled') }}?search={{ $user->mobile }}"
                        title="Canceled Ticket"
                        icon="fas fa-close"
                        value="{{ $user->tickets()->canceled()->sum('ticket_count') }}"
                        bg="warning"
                        outline="true"
                    />
                </div>

                <div class="col-xxl-4 col-sm-6">
                    <x-widget
                        style="6"
                        link="{{ route('admin.booking.failed') }}?search={{ $user->mobile }}"
                        title="Failed Ticket"
                        icon="fas fa-exclamation-triangle"
                        value="{{ $user->tickets()->failed()->sum('ticket_count') }}"
                        bg="danger"
                        outline="true"
                    />
                </div>
            </div>


            <div class="card mt-30">
                <div class="card-header">
                    <h5 class="card-title mb-0">@lang('Information of') {{$user->name}}</h5>
                </div>
                <div class="card-body">
                    <form action="{{route('admin.walking.users.update', $user->id)}}" method="POST">
                        @csrf
                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label>@lang('Name')</label>
                                    <input class="form-control" type="text" name="name" required value="{{ $user->name }}">
                                </div>
                            </div>

                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="form-control-label">@lang('Gender')</label>
                                    <select name="gender" class="form-control select2" data-minimum-results-for-search="-1" required >
                                        <option value="">@lang('Select One')</option>
                                        <option value="{{ Status::MALE }}" @selected(Status::MALE == $user->gender)>@lang('Male')</option>
                                        <option value="{{ Status::FEMALE }}" @selected(Status::FEMALE == $user->gender)>@lang('Female')</option>
                                        <option value="{{ Status::OTHERS }}" @selected(Status::OTHERS == $user->gender)>@lang('Others')</option>
                                    </select>
                                </div>
                            </div>

                            <div class="col-md-6">
                                <div class="form-group">
                                    <label>@lang('Email') </label>
                                    <input class="form-control" type="email" name="email" value="{{$user->email}}">
                                </div>
                            </div>

                            <div class="col-md-6">
                                <div class="form-group">
                                    <label>@lang('Mobile Number') </label>
                                    <div class="input-group ">
                                        <span class="input-group-text mobile-code">+{{ $user->dial_code }}</span>
                                        <input type="number" name="mobile" value="{{ $user->mobile }}" id="mobile" class="form-control checkUser" required>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-12">
                                <button type="submit" class="btn btn--primary w-100 h-45">@lang('Submit')
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

@endsection

@push('script')
<script>
    (function($){
    "use strict"


        $('.bal-btn').on('click',function(){

            $('.balanceAddSub')[0].reset();

            var act = $(this).data('act');
            $('#addSubModal').find('input[name=act]').val(act);
            if (act == 'add') {
                $('.type').text('Add');
            }else{
                $('.type').text('Subtract');
            }
        });

        let mobileElement = $('.mobile-code');
        $('select[name=country]').on('change',function(){
            mobileElement.text(`+${$('select[name=country] :selected').data('mobile_code')}`);
        });

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