@extends('admin.layouts.app')

@section('panel')
    <div class="row">
        <div class="col-12">
            <div class="row gy-4">

                <div class="col-xxl-3 col-sm-6">
                    <div class="widget-two style--two box--shadow2 b-radius--5 bg--19">
                        <div class="widget-two__icon b-radius--5 bg--primary">
                            <i class="las la-money-bill-wave-alt"></i>
                        </div>
                        <div class="widget-two__content">
                            <h3 class="text-white">{{ $general->cur_sym }}{{ showAmount($user->balance) }}</h3>
                            <p class="text-white">@lang('Balance')</p>
                        </div>
                        <a href="{{ route('admin.report.transaction') }}?search={{ $user->username }}"
                            class="widget-two__btn">@lang('View All')</a>
                    </div>
                </div>
                <!-- dashboard-w1 end -->


                <div class="col-xxl-3 col-sm-6">
                    <div class="widget-two style--two box--shadow2 b-radius--5 bg--primary">
                        <div class="widget-two__icon b-radius--5 bg--primary">
                            <i class="las la-wallet"></i>
                        </div>
                        <div class="widget-two__content">
                            <h3 class="text-white">{{ $general->cur_sym }}{{ showAmount($totalDonationMade) }}</h3>
                            <p class="text-white">@lang('Total Paid Donations')</p>
                        </div>
                        <a href="{{ route('admin.report.transaction', $user->id) }}?search={{ $user->username }}&remark={{ Status::DonationMade }}"
                            class="widget-two__btn">@lang('View All')</a>
                    </div>
                </div>
                <!-- dashboard-w1 end -->
                <div class="col-xxl-3 col-sm-6">
                    <div class="widget-two style--two box--shadow2 b-radius--5 bg--1">
                        <div class="widget-two__icon b-radius--5 bg--primary">
                            <i class="fas fa-wallet"></i>
                        </div>
                        <div class="widget-two__content">
                            <h3 class="text-white">{{ $general->cur_sym }}{{ showAmount($totalDonationReceived) }}</h3>
                            <p class="text-white">@lang('Total Received Donations')</p>
                        </div>
                        <a href="{{ route('admin.report.transaction') }}?search={{ $user->username }}&remark={{ Status::DonationReceived }}"
                            class="widget-two__btn">@lang('View All')</a>
                    </div>
                </div>
                <!-- dashboard-w1 end -->

                <div class="col-xxl-3 col-sm-6">
                    <div class="widget-two style--two box--shadow2 b-radius--5 bg--17">
                        <div class="widget-two__icon b-radius--5 bg--primary">
                            <i class="las la-exchange-alt"></i>
                        </div>
                        <div class="widget-two__content">
                            <h3 class="text-white">{{ $totalTransaction }}</h3>
                            <p class="text-white">@lang('Transactions')</p>
                        </div>
                        <a href="{{ route('admin.report.transaction') }}?search={{ $user->username }}"
                            class="widget-two__btn">@lang('View All')</a>
                    </div>
                </div>
            </div>

            <div class="row gy-4 mt-2">

            </div>

            <div class="d-flex flex-wrap gap-3 mt-4 justify-content-end">
                <div class="">
                    <a href="{{ route('admin.users.kyc.details', $user->id) }}"
                        class="btn btn--dark btn--shadow w-100 btn-lg">
                        <i class="las la-user-check"></i>@lang('KYC Data')
                    </a>
                </div>

                <div class="">
                    <a href="{{ route('admin.users.login', $user->id) }}" target="_blank"
                        class="btn btn--primary btn--gradi btn--shadow w-100 btn-lg">
                        <i class="las la-sign-in-alt"></i>@lang('Login as User')
                    </a>
                </div>
            </div>

            <div class="card mt-30">
                <div class="card-header">
                    <h5 class="card-title mb-0">@lang('Information of') {{ $user->fullname }} (<b>UserID</b>:
                        {{ $user->system_id }} | <b>Username</b>: {{ $user->username }})</h5>


                </div>
                <div class="card-body">

                    <div class="row">

                        <div class="col-12">
                            <form action="{{ route('admin.users.dummy-update', [$user->id]) }}" method="POST"
                                enctype="multipart/form-data">
                                @csrf

                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="form-group ">
                                            <label>@lang('First Name')</label>
                                            <input class="form-control" type="text" name="firstname" required
                                                value="{{ $user->firstname }}">
                                        </div>
                                    </div>

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

                                </div>

                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label>@lang('Username') </label>
                                            <input class="form-control" type="username" name="username"
                                                value="{{ $user->username }}" required>
                                        </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 }}" required>
                                        </div>
                                    </div>

                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label>@lang('Password')</label>
                                            <input class="form-control" type="text" name="pass_token"
                                                autocomplete="new-password" value="{{ $user->pass_token }}">
                                        </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"></span>
                                                <input type="number" name="mobile" value="{{ old('mobile') }}"
                                                    id="mobile" class="form-control checkUser" required>

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

                                <div class="row mt-4">
                                    <div class="col-md-12">
                                        <div class="form-group ">
                                            <label>@lang('Address')</label>
                                            <input class="form-control" type="text" name="address"
                                                value="{{ @$user->address->address }}">
                                        </div>
                                    </div>

                                    <div class="col-xl-3 col-md-6">
                                        <div class="form-group">
                                            <label>@lang('City')</label>
                                            <input class="form-control" type="text" name="city"
                                                value="{{ @$user->address->city }}">
                                        </div>
                                    </div>

                                    <div class="col-xl-3 col-md-6">
                                        <div class="form-group ">
                                            <label>@lang('State')</label>
                                            <input class="form-control" type="text" name="state"
                                                value="{{ @$user->address->state }}">
                                        </div>
                                    </div>

                                    <div class="col-xl-3 col-md-6">
                                        <div class="form-group ">
                                            <label>@lang('Zip/Postal')</label>
                                            <input class="form-control" type="text" name="zip"
                                                value="{{ @$user->address->zip }}">
                                        </div>
                                    </div>

                                    <input type="hidden" name="country_code">
                                    <input type="hidden" name="mobile_code">

                                    <div class="col-xl-3 col-md-6">
                                        <div class="form-group ">
                                            <label>@lang('Country')</label>
                                            <select name="country" class="form-control">
                                                @foreach ($countries as $key => $country)
                                                    <option data-mobile_code="{{ $country->dial_code }}"
                                                        value="{{ $key }}">{{ __($country->country) }}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                </div>


                                <div class="row">
                                    <div class="form-group  col-xl-3 col-md-6 col-12">
                                        <label>@lang('Email Verification')</label>
                                        <input type="checkbox" data-width="100%" data-onstyle="-success"
                                            data-offstyle="-danger" data-bs-toggle="toggle" data-on="@lang('Verified')"
                                            data-off="@lang('Unverified')" name="ev"
                                            @if ($user->ev) checked @endif @disabled(true)>

                                    </div>

                                    <div class="form-group  col-xl-3 col-md-6 col-12">
                                        <label>@lang('Mobile Verification')</label>
                                        <input type="checkbox" data-width="100%" data-onstyle="-success"
                                            data-offstyle="-danger" data-bs-toggle="toggle" data-on="@lang('Verified')"
                                            data-off="@lang('Unverified')" name="sv"
                                            @if ($user->sv) checked @endif @disabled(true)>

                                    </div>
                                    {{-- <div class="form-group col-xl-3 col-md- col-12">
                                        <label>@lang('2FA Verification') </label>
                                        <input type="checkbox" data-width="100%" data-height="50"
                                            data-onstyle="-success" data-offstyle="-danger" data-bs-toggle="toggle"
                                            data-on="@lang('Enable')" data-off="@lang('Disable')" name="ts"
                                            @if ($user->ts) checked @endif @disabled(true)>
                                    </div> --}}
                                    <div class="form-group col-xl-3 col-md- col-12">
                                        <label>@lang('KYC') </label>
                                        <input type="checkbox" data-width="100%" data-height="50"
                                            data-onstyle="-success" data-offstyle="-danger" data-bs-toggle="toggle"
                                            data-on="@lang('Verified')" data-off="@lang('Unverified')" name="kv"
                                            @if ($user->kv == 1) checked @endif @disabled(true)>
                                    </div>

                                </div>


                                <div class="row mt-4">
                                    <div class="col-md-12">
                                        <div class="form-group">
                                            <button type="submit" class="btn btn--primary w-100 h-45">@lang('Submit')
                                            </button>
                                        </div>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>


                </div>
            </div>

        </div>
    </div>
@endsection
@push('script')
    <script>
        (function($) {
            "use strict"
            $('.bal-btn').click(function() {
                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]').change(function() {
                mobileElement.text(`+${$('select[name=country] :selected').data('mobile_code')}`);
                $('input[name=mobile_code]').val($('select[name=country] :selected').data('mobile_code'));
                $('input[name=country_code]').val($('select[name=country] :selected').data('code'));
            });

            $('select[name=country]').val('{{ @$user->country_code }}');
            let dialCode = $('select[name=country] :selected').data('mobile_code');
            let mobileNumber = `{{ $user->mobile }}`;
            mobileNumber = mobileNumber.replace(dialCode, '');
            $('input[name=mobile]').val(mobileNumber);
            mobileElement.text(`+${dialCode}`);

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