@extends('crm.master')

@section('content')
<div class="container-xxl flex-grow-1 container-p-y">
  <!-- Page Header -->
  <div class="row mb-6">
    <div class="col-12">
      <div class="d-flex align-items-center justify-content-between">
        <div>
          <h4 class="mb-1">{{ isset($user) ? 'Edit User' : 'Add New User' }}</h4>
          <p class="text-muted mb-0">{{ isset($user) ? 'Update user information' : 'Create a new user account' }}</p>
        </div>
      </div>
    </div>
  </div>

  <div class="row">
    <div class="col-md-8">
      <div class="card mb-6">
        <div class="card-body">
          @include('crm.components.alerts')

          <form action="{{ isset($user) ? route('crm.user-accounts.update', $user->id) : route('crm.user-accounts.store') }}" id="crud-form" method="POST">
            @csrf
            @if(isset($user))
              @method('PUT')
            @endif

            <div class="row">
              <!-- First Name -->
              <div class="col-md-6 mb-4">
                <label for="first_name" class="form-label">First Name <span class="text-danger">*</span></label>
                <input
                  type="text"
                  class="form-control @error('first_name') is-invalid @enderror"
                  id="first_name"
                  name="first_name"
                  placeholder="Enter first name"
                  value="{{ old('first_name', $user->first_name ?? '') }}"
                  required />
                @error('first_name')
                  <span class="invalid-feedback">{{ $message }}</span>
                @enderror
              </div>

              <!-- Last Name -->
              <div class="col-md-6 mb-4">
                <label for="last_name" class="form-label">Last Name <span class="text-danger">*</span></label>
                <input
                  type="text"
                  class="form-control @error('last_name') is-invalid @enderror"
                  id="last_name"
                  name="last_name"
                  placeholder="Enter last name"
                  value="{{ old('last_name', $user->last_name ?? '') }}"
                  required />
                @error('last_name')
                  <span class="invalid-feedback">{{ $message }}</span>
                @enderror
              </div>

              <!-- Email -->
              <div class="col-12 mb-4">
                <label for="email" class="form-label">Email Address <span class="text-danger">*</span></label>
                <input
                  type="email"
                  class="form-control @error('email') is-invalid @enderror"
                  id="email"
                  name="email"
                  placeholder="Enter email address"
                  value="{{ old('email', $user->email ?? '') }}"
                  required />
                @error('email')
                  <span class="invalid-feedback">{{ $message }}</span>
                @enderror
              </div>

              <!-- Role -->
              <div class="col-12 mb-4">
                <label for="role" class="form-label">Role <span class="text-danger">*</span></label>
                <select
                  class="form-select @error('role') is-invalid @enderror"
                  id="role"
                  name="role"
                  required>
                  <option value="">Select Role</option>
                  @foreach($roles as $key => $label)
                    <option value="{{ $key }}" {{ old('role', $user->role ?? '') === $key ? 'selected' : '' }}>
                      {{ $label }}
                    </option>
                  @endforeach
                </select>
                @error('role')
                  <span class="invalid-feedback d-block">{{ $message }}</span>
                @enderror
              </div>

              <!-- Password (Only for new users) -->
              @if(!isset($user))
                <div class="col-md-6 mb-4">
                  <label for="password" class="form-label">Password <span class="text-danger">*</span></label>
                  <input
                    type="password"
                    class="form-control @error('password') is-invalid @enderror"
                    id="password"
                    name="password"
                    placeholder="Enter password (min 8 characters)"
                    required />
                  @error('password')
                    <span class="invalid-feedback">{{ $message }}</span>
                  @enderror
                </div>

                <div class="col-md-6 mb-4">
                  <label for="password_confirmation" class="form-label">Confirm Password <span class="text-danger">*</span></label>
                  <input
                    type="password"
                    class="form-control"
                    id="password_confirmation"
                    name="password_confirmation"
                    placeholder="Confirm password"
                    required />
                </div>
              @endif
            </div>

            <!-- Submit Button -->
            <div class="mt-4">
              <button type="button" id="add-edit-page-sbt-btn" class="btn btn-primary">
                <i class="icon-base ti tabler-check me-2 icon-14px"></i>
                {{ isset($user) ? 'Update' : 'Add' }} User
              </button>
              <a href="{{ route('crm.user-accounts.index') }}" class="btn btn-label-secondary ms-2">
                <i class="icon-base ti tabler-x me-2 icon-14px"></i>
                Cancel
              </a>
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>
</div>
@endsection

@section('page-script')

<script>
        $(document).ready(function(){

                $('#add-edit-page-sbt-btn').click(function(){

                var validator = $('#crud-form').validate();

                if(validator.form() != false){

                    // Check if new package is requested

                    $('#crud-form')[0].submit();

                } // if(validator.form() == true)

            }); // click => #step1_form_sbt

        }); // document.ready

</script>

@endsection