@extends('layouts.project-form-base', ['title' => 'Client', 'formTitle' => 'Add new client', 'back' => getRoute("client.index"), 'custom_class' => 'add_extended_pro'])
@section('content')
@section('css')
<style>
    #wrapper {
        padding: 0px;
    }

    .material-icons {
        cursor: pointer !important;
    }

    .custom-color .output-color span {
        background: #fff;
    }
</style>
@endsection
@include('inc.flashMessages')

<div class="new-member pt-10 mt-5">
    <div class="custom-container py-4">
        <h2 class="theme-heading mb-22">
            Basic Iinformation
        </h2>
        @if(isset($user))
        <form class="popup-form" method="POST" action="{{ getRoute('client.update', $user->id) }}">
            @method('PUT')
            @else
            <form class="popup-form" method="POST" action="{{ getRoute('client.store') }}">
                @endif
                @csrf
                <input type="hidden" id="payment_method" name="payment_method">
                <div class="row">
                    <div class="col-md-6">
                        <div class="form-group">
                            <label class="popup-formlbl" for="">{{ __('First Name') }}</label>
                            <input type="text" class="form-control @error('first_name') is-invalid @enderror custm-form-control" name="first_name" placeholder="Enter First Name" value="{{ old('first_name', $user->first_name ?? '' ) }}" autocomplete="first_name" autofocus>

                            @error('first_name')
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $message }}</strong>
                            </span>
                            @enderror
                        </div>
                    </div>

                    <div class="col-md-6">
                        <div class="form-group">
                            <label class="popup-formlbl" for="">{{ __('Last Name') }}</label>
                            <input id="last_name" name="last_name" type="text" class="form-control @error('last_name') is-invalid @enderror custm-form-control" placeholder="Enter Last name" value="{{ old('last_name', $user->last_name ?? '') }}" autocomplete="last_name" autofocus>

                            @error('last_name')
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $message }}</strong>
                            </span>
                            @enderror
                        </div>
                    </div>

                    <div class="col-md-6 pr-md-0">
                        <div class="form-group">
                            <label class="popup-formlbl" for="">{{ __('Email') }}</label>
                            <input type="email" id="email" class="form-control custm-form-control @error('email') is-invalid @enderror" name="email" value="{{ old('email', $user->email ?? '') }}" autocomplete="email" placeholder="Enter email address">
                            @error('email')
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $message }}</strong>
                            </span>
                            @enderror
                        </div>
                    </div>

                    <div class="col-md-6">
                        <div class="form-group">
                            <label class="popup-formlbl" for="">{{ __('Phone Number') }}</label>
                            <input name="phone_number" type="tel" pattern="[0-9 +]{1,}" oninvalid="this.setCustomValidity('Please enter valid phone number ex: 802256674')" oninput="this.setCustomValidity('')" maxlength="14" minlength="10" class="form-control custm-form-control @error('phone_number') is-invalid @enderror" placeholder="Enter Phone Number" value="{{ old('phone_number', $user->phone_number ?? '') }}" autocomplete="phone_number">
                            @error('phone_number')
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $message }}</strong>
                            </span>
                            @enderror
                        </div>
                    </div>
                    @if(!isset($user))
                    <div class="col-md-12">
                        <div class="form-group">
                            <label class="popup-formlbl" for="">{{ __('Password') }}</label>
                            <div class="password-field @error('password') is-invalid @enderror">
                                <input id="password" type="Password" class="form-control custm-form-control" name="password" value="{{ old('password') }}" autocomplete="new-password" placeholder="Enter password">
                                <span id="generatepwd" class="field-status text-uppercase" style="cursor: pointer;">Generate Password</span>
                            </div>

                            @error('password')
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $message }}</strong>
                            </span>
                            @enderror
                        </div>
                    </div>
                    @endif
                </div>


                @include("admin.client_management.inc.plans-list")

                <div class="form-group text-center py-10">
                    <a href="javascript: history.go(-1);" class="gz-btn bg-color-default btn-lg" type="button">Cancel</a>
                    <button class="gz-btn bg-color-red btn-lg ml-15">Continue</button>
                </div>
            </form>
    </div>
</div>
@include('customer.client_management.components.script')
@endsection