{% include 'partials/header.html.twig' %}

      <div class="body-wrapper">
        <div class="container-fluid">

          <div class="card card-body py-3">
              <div class="row align-items-center">
                  <div class="col-12">
                      <div class="d-sm-flex align-items-center justify-space-between">
                          <h4 class="mb-4 mb-sm-0 card-title">Nouveau client</h4>
                      </div>
                  </div>
              </div>
          </div>

          <div class="card">
            <div class="card-body wizard-content">
              <form id="addClient" class="form-horizontal r-separator needs-validation" novalidate="">
              <div class="card-body">
                <h5>Informations générales</h5>
              </div>
              <div class="form-group p-3 mb-3">
                <div class="row">
                  <label for="type" class="col-sm-3 text-end  col-form-label">Type de client</label>
                  <div class="col-md-8">
                    <div class="form-check form-check-inline">
                      <input class="form-check-input success check-outline outline-success" type="radio" id="type" name="type" data-field="type" value="entreprise" required>
                      <label class="form-check-label" for="success-outline-radio">Entreprise</label>
                    </div>
                    <div class="form-check form-check-inline">
                      <input class="form-check-input success check-outline outline-success" type="radio" id="type" name="type" data-field="type" value="personne" required>
                      <label class="form-check-label" for="success2-outline-radio">Personne</label>
                    </div>
                  </div>
                </div>
              </div>
              <div class="form-group mb-3 p-3 pt-0">
                <div class="row">
                  <label for="nom" class="col-sm-3 text-end  col-form-label">Nom</label>
                  <div class="col-sm-9">
                    <input type="text" class="form-control" id="nom" name="nom" data-field="nom" required>
                  </div>
                </div>
              </div>
              <div class="form-group mb-3 p-3 pt-0">
                <div class="row">
                  <label for="email" class="col-sm-3 text-end  col-form-label">Email</label>
                  <div class="col-sm-9">
                    <input type="email" class="form-control" id="email" name="email" data-field="email" required>
                  </div>
                </div>
              </div>
              <div class="form-group p-3 pt-0">
                <div class="row">
                  <label for="telephone" class="col-sm-3 text-end  col-form-label">Téléphone</label>
                  <div class="col-sm-9">
                    <input type="number" class="form-control" id="telephone" name="telephone" data-field="telephone">
                  </div>
                </div>
              </div>

              <div class="card-body text-bg-light">
                <h4 class="card-title mt-2 pb-3">Adresse</h4>
              </div>
              <div class="form-group p-3 text-bg-light">
                <div class="row">
                  <label for="adresse" class="col-sm-3 text-end  col-form-label">Adresse</label>
                  <div class="col-sm-9">
                    <input type="text" class="form-control" id="adresse" name="adresse" data-field="adresse">
                  </div>
                </div>
              </div>
              <div class="form-group p-3 text-bg-light">
                <div class="row">
                  <label for="codepostal" class="col-sm-3 text-end  col-form-label">Code postal</label>
                  <div class="col-sm-9">
                    <input type="number" class="form-control" id="codepostal" name="codepostal" data-field="codepostal">
                  </div>
                </div>
              </div>
              <div class="form-group p-3 text-bg-light">
                <div class="row">
                  <label for="ville" class="col-sm-3 text-end  col-form-label">Ville</label>
                  <div class="col-sm-9">
                    <input type="text" class="form-control" id="ville" name="ville" data-field="ville">
                  </div>
                </div>
              </div>
              <div class="form-group p-3 text-bg-light">
                <div class="row">
                  <label for="pays" class="col-sm-3 text-end  col-form-label">Pays</label>
                  <div class="col-sm-9">
                    <select class="form-select" id="pays" name="pays" data-field="pays">
                      <option value="">Sélectionnez un pays</option>
                      <option value="France">France</option>
                      <option value="Suisse">Suisse</option>
                      <option value="Allemagne">Allemagne</option>
                    </select>
                  </div>
                </div>
              </div>

              <div class="card-body">
                <h5>Complément</h5>
              </div>
              <div class="form-group p-3 pt-0 mt-3">
                <div class="row">
                  <label for="ville" class="col-sm-3 text-end  col-form-label">Site internet</label>
                  <div class="col-sm-9">
                    <input type="url" class="form-control" id="siteweb" name="siteweb" data-field="siteweb">
                  </div>
                </div>
              </div>

              <div class="form-group p-3">
                <div class="row">
                  <label for="ville" class="col-sm-3 text-end  col-form-label">Logo</label>
                  <div class="col-sm-9">
                    <input type="file" class="form-control" id="logo" name="logo" data-field="logo">
                  </div>
                </div>
              </div>

              <div class="p-3">
                <div class="form-group text-end">
                  <button class="btn btn-primary" data-form="addClient" data-btn="enregistrer" data-route="{{ path('client_add') }}" data-modal="null">
                    Enregistrer
                  </button>
                  <a href="{{ path('user_index')}}"class="btn bg-danger-subtle text-danger ms-6" id="btnAnnuler">
                    Annuler
                  </a>
                </div>
              </div>
            </form>
            </div>
          </div>

        </div>
      </div>

  
</div>
<script>
    function handleColorTheme(e) {
      document.documentElement.setAttribute("data-color-theme", e);
    }
    const profilRoute = "{{ path('client_profil', { 'id': 'ID_PLACEHOLDER' }) }}";
    const clientAdd = "{{ path('client_add') }}";

</script>

<script src="{{ asset('assets/libs/jquery/dist/jquery.min.js') }}"></script>

{% include 'partials/footer.html.twig' %}