Current File : /home/digitaw/Ycof/.history/sante_20230608160852.php
<?php
include 'menu.php';
?>

<link rel="stylesheet" href="css/voyag.css">

<body>
    <!-- Page Header End -->
    <div class="container-fluid page-header5 mb-5 wow fadeIn" data-wow-delay="0.1s">
        <div class="container">

        </div>
    </div> 
    <!--Service Start -->
    <div class="container-xxl service py-5" id="distance">
        <div class="container">
            <div class="text-center mx-auto wow fadeInUp" data-wow-delay="0.1s" style="max-width: 600px;">
                <h1 class="display-5 mb-2">Description</h1>

                <p class="mb-5">L’assurance Maladie est un dispositif permettant aux assurés de se prémunir contre les risques Maladie, Accidents et Maternité.</p>
            </div>


            <div class="wrapper shadow p-4">
                <div class="header">
                    <ul>
                        <li class="active form_1_progessbar">
                            <div>
                                <p>1</p>
                            </div>
                        </li>
                        <li class="form_2_progessbar">
                            <div>
                                <p>2</p>
                            </div>
                        </li>
                        <li class="form_3_progessbar">
                            <div>
                                <p>3</p>
                            </div>
                        </li>

                    </ul> 
                </div>
                <form  id="sante">
                    <div class="form_wrap">
                        <div class="form_1 data_info">
                            <h3>Bénéficiaires</h3>
                            <select class="form-select" name="beneficiaire" aria-label="Default select example" id="benificiaire" onchange="validateBenificiaire()">
                                <option selected></option>
                                <option value="solo">Solo</option>
                                <option value="Famille">Famille</option>
                                <option value="Entreprise">Enteprise</option>
                            </select>
                            <p id="benificiaire-error"></p>
                            <div class="input_wrap">
                                <label for="company">Nom : </label>
                                <input type="text" name="nom" id="nom" class="form-control" oninput="validateNom()">
                                <p id="nom-error"></p>
                            </div>
                            <div class="input_wrap">
                                <label for="experience">Prénom : </label>
                                <input type="text" name="prenom" id="prenom" class="form-control" oninput="validatePrenom()">
                                <p   id="prenom-error"></p>   
                            </div>
                            <div class="input_wrap">
                                <label for="designation">Email : </label>
                                <input type="email" name="mail" id="email" class="form-control" oninput="validateEmail()">
                                <p id="email-error"></p>
                            </div>
                            <div class="input_wrap">
                                <label for="dat_retour">Telephone : </label>
                                <input type="tel" name="phone" id="telephone" class="form-control" oninput="validatePhone()">
                                <p id="telephone-error"></p>
                            </div>
                        </div>
                        <div class="form_2 data_info" style="display: none;">
                            <h3>Détail de l'assurance santé</h3>
                            <p>Veuillez remplir ce formulaire</p>
                            <div class="form_container">
                                <div class="input_wrap">
                                    <label for="dest">Taux de couverture:</label>
                                    <div class="form-check">
                                        <input class="form-check-input" value="70%" type="radio" name="taux" id="flexRadioDefault1">
                                        <label class="form-check-label" for="flexRadioDefault1">
                                            Taux 70%
                                        </label>
                                    </div>
                                    <div class="form-check">
                                        <input class="form-check-input" value="80%" type="radio" name="taux" id="flexRadioDefault2" checked>
                                        <label class="form-check-label" for="flexRadioDefault2">
                                            Taux 80%
                                        </label>
                                    </div>
                                    <div class="form-check">
                                        <input class="form-check-input" value="90%" type="radio" name="taux" id="flexRadioDefault3" checked>
                                        <label class="form-check-label" for="flexRadioDefault2">
                                            Taux 90%
                                        </label>
                                    </div>
                                </div>
                                <div class="input_wrap">
                                    <label for="nub_pass">Téritorialité:</label>
                                </div>
                                <div>
                                    <select class="form-select" name="localite" aria-label="Default select example" id="localite" onchange="validateLocalite()">
                                        <option >Choisir votre localité</option>
                                        <option value="Senegal">Sénégal</option>
                                        <option value="Afrique entière">Afrique entière</option>
                                        <option value="Sénégal + Union Européenne">Sénégal + Union Européenne</option>
                                        <option value="Monde entière">Monde entière </option>
                                    </select>
                                    <p id="localite-error"></p>
                                </div>
                            </div>
                        </div>
                        <div class="form_3 data_info" style="display: none;">
                            <h3>Récapitulatif Devis</h3>
                            <div class="form_container">
                                <div class="input_wrap">
                                    <label for="company">Bénéficiaire : <b id="beneficiaire-recap"></b></label> 
                                </div>
                                <div class="input_wrap">
                                    <label for="experience">Taux : <b id="taux-recap""></b></label> 
                                </div>
                                <div class=" input_wrap">
                                        <label for="designation">Localité : <b id="localite-recap"></b></label> 
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="btns_wrap">
                        <div class="common_btns form_1_btns">
                            <button type="button" class="btn_next">Next <span class="icon"><ion-icon name="arrow-forward-sharp"></ion-icon></span></button>
                        </div>
                        <div class="common_btns form_2_btns" style="display: none;">
                            <button type="button" class="btn_back"><span class="icon"><ion-icon name="arrow-back-sharp"></ion-icon></span>Back</button>
                            <button type="button" class="btn_next" onclick="loadData()">Next <span class="icon"><ion-icon name="arrow-forward-sharp"></ion-icon></span></button>
                        </div>
                        <div class="common_btns form_3_btns" style="display: none;">
                            <button type="button" class="btn_back"><span class="icon"><ion-icon name="arrow-back-sharp"></ion-icon></span>Back</button>
                            <button type="submit"  class="btn_done">Envoyer</button>
                        </div>
                    </div>
                </form>
            </div>

        </div>
    </div>

    </div>
    </div>



    <!-- Footer Start -->
    <?php
    include 'footer.php';
    ?>

    <script src="js/sante.js"></script>

</body>

</html>