@extends('Template::layouts.master')

@section('content')
    <!-- Dashboard -->
    <section class="dashboard-section pt-80">
        <div class="container">

            <div class="pb-80">
                <div class="profile-wrapper bg--shadow">
                    <div class="profile-user mb-lg-0 text-center">
                        <div class="thumb">
                            <img src="{{ getImage(getFilePath('userProfile') . '/' . $user->image, getFileSize('userProfile')) }}" alt="Image" class="profile-image">
                        </div>
                        <div class="content mb-20">
                            <h6 class="title">@lang('Name'): {{ __(@$user->fullname) }}</h6>
                            <span class="subtitle">@lang('Username'):
                                <span class="fw-bold">{{ __(@$user->username) }}</span>
                            </span>
                        </div>

                        <div class="card-body">

                            <ul class="list-group">
                                <li class="list-group-item d-flex justify-content-between align-items-center">
                                    @lang('Balance')<span class="fw-bold">{{ getAmount($user->balance) }} {{ __(gs()->cur_text) }}</span>
                                </li>
                                <li class="list-group-item d-flex justify-content-between align-items-center">
                                    @lang('Credit')<span class="fw-bold">{{ getAmount($user->credit) }} @lang('credit')</span>
                                </li>
                                <li class="list-group-item d-flex justify-content-between align-items-center">
                                    @lang('Plan')<span class="fw-bold">{{ __(@$user->userPlan->name) }}</span>
                                </li>

                            </ul>
                        </div>

                    </div>
                    <div class="profile-form-area">

                        <form class="profile-edit-form row mb--25 register" method="post" enctype="multipart/form-data">
                            @csrf

                            <div class="row">
                                <div class="form-group form--group col-sm-6">
                                    <label class="form-label custom--label text--title">@lang('First Name')</label>
                                    <input type="text" class="form-control form--control" name="firstname" value="{{ $user->firstname }}" required>
                                </div>
                                <div class="form-group form--group col-sm-6">
                                    <label class="form-label custom--label text--title">@lang('Last Name')</label>
                                    <input type="text" class="form-control form--control" name="lastname" value="{{ $user->lastname }}" required>
                                </div>
                            </div>
                            <div class="row">
                                <div class="form-group form--group col-sm-6">
                                    <label class="form-label custom--label text--title">@lang('E-mail Address')</label>
                                    <input class="form-control form--control" value="{{ $user->email }}" disabled>
                                </div>
                                <div class="form-group form--group col-sm-6">
                                    <label class="form-label custom--label text--title">@lang('Mobile Number')</label>
                                    <input class="form-control form--control" value="{{ $user->mobile }}" disabled>
                                </div>
                            </div>
                            <div class="row">
                                <div class="form-group form--group col-sm-4">
                                    <label class="form-label custom--label text--title">@lang('Address')</label>
                                    <input type="text" class="form-control form--control" name="address" value="{{ @$user->address }}">
                                </div>
                                <div class="form-group form--group col-sm-4">
                                    <label class="form-label custom--label text--title">@lang('State')</label>
                                    <input type="text" class="form-control form--control" name="state" value="{{ @$user->state }}">
                                </div>
                                <div class="form-group form--group col-sm-4">
                                    <label class="form-label custom--label text--title" for="profile-image">@lang('Profile Picture')</label>
                                    <input type="file" class="form-control form--control" name="image" id="profile-image">
                                </div>
                            </div>

                            <div class="row">
                                <div class="form-group form--group col-sm-4">
                                    <label class="form-label custom--label text--title">@lang('Zip Code')</label>
                                    <input type="text" class="form-control form--control" name="zip" value="{{ @$user->zip }}">
                                </div>

                                <div class="form-group form--group col-sm-4">
                                    <label class="form-label custom--label text--title">@lang('City')</label>
                                    <input type="text" class="form-control form--control" name="city" value="{{ @$user->city }}">
                                </div>

                                <div class="form-group form--group col-sm-4">
                                    <label class="form-label custom--label text--title">@lang('Country')</label>
                                    <input class="form-control form--control" value="{{ @$user->country_name }}" disabled>
                                </div>

                            </div>

                            <div class="form-group form--group">
                                <button type="submit" class="cmn--btn w-100 justify-content-center">@lang('Submit')</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>

        </div>
    </section>
    <!-- Dashboard -->
@endsection

@push('script')
    <script>
        "use script";

        $('#profile-image').on('change', function() {
            var reader = new FileReader();
            reader.onload = function(e) {
                $('.profile-image').attr('src', e.target.result);
            }
            reader.readAsDataURL(this.files[0]);
        });
    </script>
@endpush