@extends('Dashboard.layouts.master')
@section('title', 'Profile | Edit')
@section('style')
    <style>
        .card_element {
            padding: 10px;
            border: 1px solid #ccc;
        }
    </style>
@endsection
@section('content')
    <div class="app-main flex-column flex-row-fluid" id="kt_app_main">
        <div class="d-flex flex-column flex-column-fluid">
            <livewire:bread-crumb heading="{{__('translations.profile')}}"
                                  url_1="{{route('dashboard') }}"
                                  name_1="Home" name_2="{{__('translations.profile')}}"
                                  name_3="{{__('forms.edit')}}"/>

            <div id="kt_app_content" class="app-content flex-column-fluid">
                <!--begin::Content container-->
                <div id="kt_app_content_container" class="app-container container-xxl">
                    <div class="card">
                        <div class="card-body">
                            <div class="col-12 py-3">
                                <div class="container">
                                    <div class=" d-flex row m-0">
                                        <div class="col-12 col-lg-6 my-2">
                                            <form method="POST"
                                                  action="{{route('profile.update')}}"
                                                  enctype="multipart/form-data">
                                                @csrf
                                                @method('PUT')
                                                <div class="col-12 p-0 main-box shadow">
                                                    <div class="col-12 px-0">
                                                        <div class="col-12 px-3 py-3">
                                                            <span
                                                                class="fas fa-info-circle"></span> {{__('forms.main_information')}}
                                                        </div>
                                                        <div class="col-12 divider" style="min-height: 2px;"></div>
                                                    </div>
                                                    <div class="col-12 p-3">

                                                        <div class="col-12 p-2">
                                                            <div class="col-12">
                                                                {{__('forms.name')}}
                                                            </div>
                                                            <div class="col-12 pt-3">
                                                                <input type="text" name="name" required min="3"
                                                                       max="190" class="form-control"
                                                                       value="{{ Helper::get_user_authenticated()->name }}"/>
                                                            </div>
                                                        </div>

                                                        <div class="col-12 p-2">
                                                            <div class="col-12">
                                                                {{__('forms.choose_language')}}
                                                            </div>
                                                            <div class="col-12 pt-3">
                                                                <select name="language" class="form-control">
                                                                    <option
                                                                        value="en" {{Helper::get_user_authenticated()->language == 'en' ? 'selected' : ''}}>
                                                                        English
                                                                    </option>
                                                                    <option
                                                                        value="fr" {{Helper::get_user_authenticated()->language == 'fr' ? 'selected' : ''}}>
                                                                        French
                                                                    </option>
                                                                </select>
                                                            </div>
                                                        </div>

                                                        <div class="col-12 p-2">
                                                            <div class="col-12">   {{__('forms.choose_timezone')}}</div>
                                                            <div class="col-12 pt-3">
                                                                {{Helper::get_all_time_zone(Helper::get_user_authenticated()->timezone)}}
                                                            </div>
                                                        </div>

                                                        <div class="col-12 p-2">
                                                            <div class="col-12 pt-3">
                                                                <button
                                                                    class="btn btn-primary">{{__('forms.save')}}</button>
                                                            </div>
                                                        </div>

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

                                        <div class="col-12 col-lg-6 my-2">
                                            <form method="POST"
                                                  action="{{route('profile.update.email') }}">
                                                @csrf
                                                @method('PUT')
                                                <div class="col-12 p-0 main-box shadow">
                                                    <div class="col-12 px-0">
                                                        <div class="col-12 px-3 py-3">
                                                            <span
                                                                class="fas fa-envelope"></span> {{__('forms.change_email')}}
                                                        </div>
                                                        <div class="col-12 divider" style="min-height: 2px;"></div>
                                                    </div>
                                                    <div class="col-12 p-3">
                                                        <div class="col-12 p-2">
                                                            <div class="col-12">
                                                                {{__('forms.current_email')}}
                                                            </div>
                                                            <div class="col-12 pt-3">
                                                                <input type="email" name="old_email"
                                                                       class="form-control"
                                                                       required
                                                                       value="{{ Helper::get_user_authenticated()->email }}">
                                                            </div>
                                                        </div>

                                                        <div class="col-12 p-2">
                                                            <div class="col-12">
                                                                {{__('forms.new_email')}}
                                                            </div>
                                                            <div class="col-12 pt-3">
                                                                <input type="email" name="email" class="form-control"
                                                                       value="{{ old('email') }}" required>
                                                            </div>
                                                        </div>
                                                        <div class="col-12 p-2">
                                                            <div class="col-12">
                                                                {{__('forms.repeat_email')}}
                                                            </div>
                                                            <div class="col-12 pt-3">
                                                                <input type="email" name="email_confirmation"
                                                                       value="{{ old('email_confirmation') }}"
                                                                       class="form-control" required>
                                                            </div>
                                                        </div>

                                                        <div class="col-12 p-2">
                                                            <div class="col-12 pt-3">
                                                                <button
                                                                    class="btn btn-primary">   {{__('forms.save')}}</button>

                                                            </div>
                                                        </div>

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

                                        <div class="col-12 col-lg-6 my-2">
                                            <form method="POST"
                                                  action="{{route('profile.update.password') }}">
                                                @csrf
                                                @method('PUT')
                                                <div class="col-12 p-0 main-box shadow">
                                                    <div class="col-12 px-0">
                                                        <div class="col-12 px-3 py-3">
                                                            <span
                                                                class="fas fa-key"></span> {{__('forms.change_password')}}
                                                        </div>
                                                        <div class="col-12 divider" style="min-height: 2px;"></div>
                                                    </div>
                                                    <div class="col-12 p-3">
                                                        <div class="col-12 p-2">
                                                            <div class="col-12">
                                                                {{__('forms.current_password')}}
                                                            </div>
                                                            <div class="col-12 pt-3">
                                                                <input type="password" name="old_password"
                                                                       class="form-control" required minlength="8"
                                                                       maxlength="190">
                                                            </div>
                                                        </div>

                                                        <div class="col-12 p-2">
                                                            <div class="col-12">
                                                                {{__('forms.new_password')}}
                                                            </div>
                                                            <div class="col-12 pt-3">
                                                                <input type="password" name="password"
                                                                       class="form-control"
                                                                       required minlength="8" maxlength="190">
                                                            </div>
                                                        </div>
                                                        <div class="col-12 p-2">
                                                            <div class="col-12">
                                                                {{__('forms.repeat_new_password')}}
                                                            </div>
                                                            <div class="col-12 pt-3">
                                                                <input type="password" name="password_confirmation"
                                                                       class="form-control" required minlength="8"
                                                                       maxlength="190">
                                                            </div>
                                                        </div>

                                                        <div class="col-12 p-2">
                                                            <div class="col-12 pt-3">
                                                                <button
                                                                    class="btn btn-primary">{{__('forms.save')}}</button>

                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </form>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection