@extends('../backend/layout/' . $layout)

@section('subhead')
<title>Profile - EccomerceLaravel</title>
@endsection

@section('subcontent')
<div class="grid grid-cols-12 gap-6">
    <!-- BEGIN: Profile Menu -->
    @include('backend.users.sidebars', $user)
    <!-- END: Profile Menu -->
    <div class="col-span-12 lg:col-span-8 2xl:col-span-9">
        <!-- BEGIN: Display Information -->
        <div class="intro-y box lg:mt-5">
            <div class="flex items-center p-5 border-b border-slate-200/60 dark:border-darkmode-400">
                <h2 class="font-medium text-base mr-auto">Display Information</h2>
            </div>
            <div class="p-5" id="form-validation">
                <form class="validate-form" id="user_update" enctype="multipart/form-data">
                    @method('PUT')
                    <div class="flex flex-col-reverse xl:flex-row flex-col">
                        <div class="flex-1 mt-6 xl:mt-0">
                            <div class="grid grid-cols-12 gap-x-5">
                                <div class="col-span-12 2xl:col-span-6">
                                    <div>
                                        <label for="first_name" class="form-label">First Name</label>
                                        <div class="input-form">
                                            <input id="first_name" type="text" class="form-control"
                                                placeholder="Input text" name="first_name"
                                                value="{{ $user->first_name }}">
                                        </div>
                                    </div>
                                    <div class="mt-3">
                                        <label for="email" class="form-label">E-mail</label>
                                        <div class="input-form">
                                            <input id="email" name="email" type="text" class="form-control"
                                                placeholder="Input text" value="{{ $user->email }}">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-span-12 2xl:col-span-6">
                                    <div class="mt-3 2xl:mt-0">
                                        <label for="last_name" class="form-label">Last Name</label>
                                        <div class="input-form">
                                            <input id="last_name" name="last_name" type="text" class="form-control"
                                                placeholder="Input text" value="{{ $user->last_name }}">
                                        </div>
                                    </div>
                                    <div class="mt-3">
                                        <label for="update-profile-form-4" class="form-label">Phone Number</label>
                                        <div class="input-form">
                                            <input id="phone" name="phone" type="number" class="form-control"
                                                placeholder="+91-9999999999" value="{{ $user->phone }}">
                                        </div>
                                    </div>
                                </div>
                                <input type="hidden" name="status" id="status" value="{{$user->status}}">
                            </div>
                            <button type="submit" id="btn-submit" class="btn btn-primary w-20 mt-3">Update</button>
                        </div>
                        <div class="w-52 mx-auto xl:mr-0 xl:ml-6">
                            <div class="border-2 border-dashed shadow-sm border-slate-200/60 dark:border-darkmode-400 rounded-md p-5">
                                <div class="h-40 relative image-fit cursor-pointer zoom-in mx-auto" id="image_preview">
                                    @if(!empty($user->photo))
                                        <img class="rounded-md" src="{{ $user->photo }}">
                                        <div title="Remove this profile photo?" class="tooltip w-5 h-5 flex items-center justify-center absolute rounded-full text-white bg-danger right-0 top-0 -mr-2 -mt-2">
                                            <i data-lucide="x" class="w-4 h-4" onclick='deleteImage("lfm")'></i>
                                        </div>
                                    @else
                                        <img class="rounded-md" src="{{ config('constant.default_image') }}">
                                    @endif
                                </div>
                                <div class="mx-auto cursor-pointer relative mt-5">
                                    <button type="button" class="btn btn-primary w-full" id="lfm" data-input="photo" data-preview="image_preview" data-thumb="profile">Upload Photo</button>
                                </div>
                                <input type="hidden" name="photo" id="photo" value="{{ $user->photo }}">
                            </div>
                        </div>
                </form>
            </div>
        </div>
        <!-- END: Display Information -->
        <!-- BEGIN: Personal Information -->
        <!-- END: Personal Information -->
    </div>
</div>
@endsection
@section('script')
<script src="{{ asset(mix('js/backend/pages/file-manager/others-file-manager.js'))}}"></script>
<script>
    const update_user_route = '{{ route('users.update', $user->id) }}'
    const path = '{{asset(config('constant.upload_paths.user_photo'))}}'
    others_lfm('lfm', 'image')
</script>
<script src="{{asset(mix("js/backend/pages/users/edit.js"))}}"></script>

@endsection