@extends('layouts.project-form-base', ['title' => 'Team member', 'formTitle' => isset($form_title) ? $form_title : 'Add New Team Member', 'back' => 'javascript: history.go(-1)', 'custom_class' => 'add_extended_pro' ])

@section('content')
<div class="Add_Project new-member ">
    <div class="container pt-10">
        <div class="rb-heading">
            <h2 class="font-size-28">{{ isset($form_title) ? $form_title : 'Add New Team Member' }}</h2>
        </div>
        <h2 class="theme-heading mb-22">
            Basic Iinformation
        </h2>
        @if(isset($user))
        <form method="POST" action="{{ getRoute('team.update', $user->id) }}">
            @method('PUT')
            @else
            <form method="POST" action="{{ getRoute('team.store') }}">
                @endif
                @csrf
                <div class="row">
                    <div class="col-md-6">
                        <div class="form-group">
                            <label for="" class="popup-form-label">{{ __('First Name') }}</label>
                            <input id="first_name" name="first_name" type="text" class="form-control @error('first_name') is-invalid @enderror custm-form-control" placeholder="Enter First name" value="{{ old('first_name', $user->first_name ?? '' ) }}" required 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 for="" class="popup-form-label">{{ __('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 ?? '') }}" required autocomplete="last_name" autofocus>
                            @error('last_name')
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $message }}</strong>
                            </span>
                            @enderror
                        </div>
                    </div>


                    <div class="col-md-12">
                        <div class="form-group">
                            <label for="" class="popup-form-label">{{ __('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 ?? '') }}" required 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-12">
                        <div class="form-group">
                            <label for="" class="popup-form-label">{{ __('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 ?? '') }}" required autocomplete="phone_number">
                            @error('phone_number')
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $message }}</strong>
                            </span>
                            @enderror
                        </div>
                    </div>
                    <div class="clearfix"></div>
                    @if(!isset($user))

                    <div class="col-md-6">
                        <div class="form-group">
                            <label for="" class="popup-form-label">{{ __('Password') }}</label>
                            <div class="password-field">
                                <input id="password" type="Password" class="form-control custm-form-control @error('password') is-invalid @enderror" name="password" required autocomplete="new-password" placeholder="Enter password">

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

                    <div class="col-md-6">
                        <div class="form-group">
                            <label for="" class="popup-form-label">{{ __('Confirm Password') }}</label>
                            <div class="">
                                <input id="password-confirm" type="Password" class="form-control custm-form-control @error('password') is-invalid @enderror" name="password_confirmation" required placeholder="Re-enter password">
                            </div>
                        </div>
                    </div>
                    @endif
                </div>

                <div class="clearfix"></div>
                <div class="brand-selection">
                    <h2 class="theme-heading mt-4 d-flex justify-content-between">
                        <span>{{ __('Brands Selection') }}</span> <a class="font-size-18 add-new-brand-js" href="javascript:void(0)">Create Brand Profile</a>
                    </h2>
                    <div class="toggle-switch-btn py-3">
                        <label>Select All Brand</label>
                        <label class="switch">
                            <input type="checkbox" value="1" class="select_all_profile" @if(!isset($user)) checked @endif>
                            <span class="slider round"></span>
                        </label>
                    </div>
                    <div class="form-group brand-selection-data"></div>

                    <ul class="btn-listing btn-listing-checkbox items-ul-js">
                        @foreach($brand_profile as $brand)
                        <li>
                            <input type="checkbox" class="brand_profile_item" name="brand_profiles[]" value="{{ $brand->id ?? '' }}" @if( (isset($assigned_brand_profiles) && in_array($brand->id, $assigned_brand_profiles)) || !isset($user)) checked @endif>
                            <label class="mb-0">
                                <i class="material-icons tick-checked-js" style="display: inline;">@if( isset($assigned_brand_profiles) && in_array($brand->id, $assigned_brand_profiles) ) done @else add  @endif</i>
                                {{ $brand->title ?? '' }}</label>
                        </li>
                        @endforeach

                    </ul>
                </div>
              
                @if ( $selected_role && is_object($selected_role) )
                <input type='hidden' name="role" value='{{ $selected_role->id }}' />
                @else
                <div class="permission">
                    <h2 class="theme-heading color-secondry mt-4 d-flex justify-content-between">
                        <span>Role</span> <a class="font-size-18 add-new-role-js" href="javascript:void(0)">Create role</a>
                    </h2>
                    <div class="form-group">
                        <select class="form-control custm-form-control role-field-js @error('role') is-invalid @enderror" name="role">
                            <option value="">Select Role</option>
                            @foreach($roles as $role)
                            <option value="{{$role->id ?? ''}}"
                                @if (isset($user) && in_array($role->name, $user->getRoleNames()->toArray()))
                                selected
                                @endif
                                >{{$role->name ?? ''}}</option>
                            @endforeach
                        </select>
                        @error('role')
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $message }}</strong>
                            </span>
                        @enderror
                    </div>
                </div>
                @endif

                <div class="form-group text-center py-10">
                    <button onclick="history.go(-1)" class="gz-btn bg-color-default btn-lg">Cancel</button>
                    <button class="gz-btn bg-color-red btn-lg ml-15">Save</button>
                </div>
            </form>

    </div>
</div>


@include('customer.team.components.script')
<livewire:brand-profiles.brand-profile-modal layout='list-btn' />

<livewire:roles.role-form-modal guard='web' />    

@endsection