@extends('backend.layouts.app')

@section('content')
    <div class="content-wrapper">
        {{ \Diglactic\Breadcrumbs\Breadcrumbs::render('backend.users.edit', $user) }}
        <section class="content">
            <div class="row mb30">
                <div class="col-12">
                    <form action="{{ route('backend.users.update', $user->id) }}" method="POST">
                        @csrf
                        @method('PUT')
                        <div class="card">
                            <div class="card-body">
                                @include('backend.layouts.partials.alerts.flash-messages')
                                <div class="row">
                                    <div class="col-lg-6">
                                        <div class="form-group">
                                            <label for="first-name">First name</label>
                                            <input type="text" name="first_name" class="form-control" id="first-name"
                                                   placeholder="First name..." autocomplete="given-name"
                                                   value="{{ old('first_name', $user->first_name) }}" required>
                                            @include('backend.layouts.partials.alerts.input-error', ['name' => 'first_name'])
                                        </div>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="form-group">
                                            <label for="last-name">Last name</label>
                                            <input type="text" name="last_name" class="form-control" id="last-name"
                                                   placeholder="Last name..." autocomplete="family-name"
                                                   value="{{ old('last_name', $user->last_name) }}">
                                            @include('backend.layouts.partials.alerts.input-error', ['name' => 'last_name'])
                                        </div>
                                    </div>
                                    <div class="col-lg-4">
                                        <div class="form-group">
                                            <label for="phone">Phone</label>
                                            <input type="text" name="phone" class="form-control phone-number__mask" id="phone"
                                                   placeholder="Phone..."
                                                   value="{{ old('phone', $user->phone) }}" autocomplete="phone"
                                                   required>
                                            @include('backend.layouts.partials.alerts.input-error', ['name' => 'phone'])
                                        </div>
                                    </div>
                                    <div class="col-lg-4">
                                        <div class="form-group">
                                            <label for="email">Email</label>
                                            <input type="email" name="email" class="form-control" id="email"
                                                   placeholder="Email..."
                                                   value="{{ old('email', $user->email ?? '') }}" autocomplete="email"
                                                   required>
                                            @include('backend.layouts.partials.alerts.input-error', ['name' => 'email'])
                                        </div>
                                    </div>
                                    <div class="col-lg-4">
                                        <div class="form-group">
                                            <label for="password">Password</label>
                                            <input type="password" name="password" class="form-control" id="password"
                                                   placeholder="Password...">
                                            @include('backend.layouts.partials.alerts.input-error', ['name' => 'password'])
                                        </div>
                                    </div>
                                    <div class="col-lg-12">
                                        <div class="form-group">
                                            <label for="role">Account Type</label>
                                            <select name="role" id="role" class="form-control" required>
                                                <option value="" selected disabled>Role</option>
                                                @foreach(\App\Models\User::ROLES as $role)
                                                    <option
                                                        value="{{ $role }}" {{ old('role', $user->role) === $role ? 'selected' : '' }}>
                                                        {{ ucfirst($role) }}
                                                    </option>
                                                @endforeach
                                            </select>
                                            @include('backend.layouts.partials.alerts.input-error', ['name' => 'role'])
                                        </div>
                                    </div>
                                    <div class="col-lg-12 mt-4" id="profile-block"
                                         style="{{ $user->role === 'admin' ? 'display: none;' : '' }}">
                                        <h3>Account information</h3>
                                        <div class="row">
                                            <div class="col-lg-6">
                                                <div class="form-group">
                                                    <div class="form-group">
                                                        <label for="address">Address</label>
                                                        <input type="text" id="address"
                                                               name="address"
                                                               class="form-control"
                                                               placeholder="Address..."
                                                               value="{{ old('address', $user->address ?? '') }}"
                                                               autocomplete="address"
                                                        >
                                                        @include('backend.layouts.partials.alerts.input-error', ['name' => 'address'])
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-lg-6">
                                                <div class="form-group">
                                                    <div class="form-group">
                                                        <label for="address2">Address2</label>
                                                        <input type="text" id="address2"
                                                               name="address_optional"
                                                               class="form-control"
                                                               placeholder="Address optional..."
                                                               value="{{ old('address_optional', $user->address_optional ?? '') }}"
                                                               autocomplete="address_optional"
                                                        >
                                                        @include('backend.layouts.partials.alerts.input-error', ['name' => 'address_optional'])
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-lg-6">
                                                <div class="form-group">
                                                    <div class="form-group">
                                                        <label for="city">Town / City</label>
                                                        <input type="text" id="city" name="city"
                                                               class="form-control"
                                                               placeholder="Town / City..."
                                                               autocomplete="city"
                                                               value="{{ old('city', $user->city ?? '') }}"
                                                        >
                                                        @include('backend.layouts.partials.alerts.input-error', ['name' => 'city'])
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-lg-6">
                                                <div class="form-group">
                                                    <label
                                                        id="state">State</label>
                                                    <input type="text" id="state" name="state"
                                                           class="form-control"
                                                           placeholder="State..."
                                                           autocomplete="state"
                                                           value="{{ old('state', $user->state ?? '') }}"
                                                    >
                                                    @include('backend.layouts.partials.alerts.input-error', ['name' => 'state'])
                                                </div>
                                            </div>
                                            <div class="col-lg-6">
                                                <div class="form-group">
                                                    <div class="form-group">
                                                        <label for="zip">ZIP</label>
                                                        <input type="text" id="zip" name="zip"
                                                               class="form-control zip__mask"
                                                               placeholder="ZIP..."
                                                               autocomplete="zip"
                                                               value="{{ old('zip', $user->zip ?? '') }}"
                                                        >
                                                        @include('backend.layouts.partials.alerts.input-error', ['name' => 'zip'])
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="card-footer">
                                <button type="submit" class="btn btn-primary">Update</button>
                                <a href="{{ route('backend.users.index') }}" class="btn btn-danger">Back</a>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </section>
    </div>
@endsection

@push('js')
    <script src="{{ asset('assets/backend/js/users.js') }}"></script>
@endpush