[hidden lang default:get] [hidden temp_password-hidden] [hidden delta-hidden] [hidden max_diff-hidden "10"] [hidden num_contrat] [hidden apporteur default:get]
<div class="declenche-devis">
    <div class="row">
        <div class="col-12 error"></div>
        <div class="col-12 ml-2 mr-4">
            <h2>Assurance Voyage Business</h2>
            <div class="row">
                <div class="col">
                    <fieldset>
                        <label class="text-uppercase" for="duration_date">Période de Voyage</label>
                        <div class="input-group daterange">
                            <label id="daterange-start-label">Début</label>[text date-depart id:duration_date class:form-control class:daterange-start readonly default:get]
                            <label id="daterange-end-label">Fin</label>[text date-fin class:form-control class:daterange-end readonly default:get]<span class="input-group-append" role="right-icon"><button class="btn-transparent" type="button"><i class="fa fa-calendar"></i></button></span></div>
                        <h6 class="text-uppercase"> Pour une assurance annuelle (multitrip) cochez la case suivante </h6>
                        <div class="row align-items-center justify-content-center">
                            <div class="col-12 col-sm-3">
                                [checkbox multitrip class:annuel "Multitrip"]
                            </div>
                            <div class="col-12 col-sm-4 text-date pb-1">
                                [group text]
                                <p style="font-size: 1rem">Date début du contrat :</p>
                                [/group]
                            </div>
                            <div class="col-12 col-sm-3 pr-2">
                                [group annuel] [date date-multi] [/group]
                            </div>
                        </div>
                    </fieldset>
                </div>
                [diffdate resultatDuree date1:date-depart date2:date-fin get:d]
            </div>
            <div class="row">
                <div class="col pl-2"><small class="date-difference" style="opacity: 0.73;"></small></div>
            </div>
            <div class="row">
                <div class="row">
                    <div class="col-6">
                        <fieldset>
                            <label class="text-uppercase">Provenance</label>
                            <div class="input-group mt-1">[select_pays* provenance_pays class:combobox class:w-100 class:swisscare-style default:get]</div>
                        </fieldset>

                    </div>
                    <div class="col-6">
                        <fieldset>
                            <label>DESTINATION</label>
                            <div class="input-group mt-1">[select_pays* destination_pays class:combobox class:w-100 class:swisscare-style default:get]</div>
                        </fieldset>
                    </div>
                </div>

                [hidden number-pers default:get] [hidden devis-st]
                <div class="col-12 mt-3">
                    <div class="pl-2 pr-2" style="background-color: darkorange">
                        <p class="mustache text-white">Estimation de votre Assurance Voyage : <span class="devis-st">[devis-st] €</span> TTC (hors options)</p>
                    </div>
                    
                    <h2>Liste des assurés</h2>

                    <div class="row mt-1 mr-4" id="assure">
                        <div class="col-12">

                            <div class="row mt-2" v-for="(person, index) in people" :data-loop-index="index">
                                [hidden personne--num_client]
                                <div class="col-xl-12 pl-2">
                                    <h3 class="title">Assuré n° {{index+1}}<strong class="mustache devis-pp"> - Tarif: [[personne--devis-pp]] €</strong></h3>
                                </div>
                                <div class="row">
                                    <div class="col-12 col-sm-4 pl-2 pr-2">
                                        <fieldset>
                                            <label>NOM</label>[text* personne--nom id:personne--nom]</fieldset>
                                    </div>
                                    <div class="col-12 col-sm-4 pl-2 pr-2">
                                        <fieldset>
                                            <label>PRENOM</label>[text* personne--prenom id:personne--prenom]</fieldset>
                                    </div>
                                    <div class="col-12 col-sm-4 pl-2 pr-2">
                                        <fieldset>
                                            <label class="text-uppercase">Date de Naissance</label>[date personne--date-naiss id:personne--date-naiss class:w-100]</fieldset>[diffdate personne--age id:personne--age date1:personne--date-naiss date2:now get:y]
                                    </div>

                                    <div class="col-12 col sm-4 pl-2 pr-2">
                                        [group sans-multitrip]
                                        <fieldset>
                                            <label>Pratiquez vous un métier à risque ? <small>(pompiers ,agents de sécurité , cascadeurs , personnel dans le BTP, personnel des mines ou extraction de matières premières (y compris les conducteurs d’engins), personnel des entreprises de la filière bois (scierie, bûcheronnage, élagage, opérateurs de scies à chaîne et d'engins de débardage)</small> :</label>
                                            <div class="card-wrapper">
                                                [option_card personne--mr id:personne--mr class:launch-tarif col-opt1:SILVER line-opt1:0 col-opt2:MR_SILVER line-opt2:0 "Non" "Oui"]
                                         <p class="price_text_translater" style="display:none">Prix:</p></div>
                                        </fieldset>
                                        [/group] 

                                        [group avec-multitrip]
                                        <fieldset>
                                            <label>Pratiquez vous un métier à risque ? <small>(pompiers ,agents de sécurité , cascadeurs , personnel dans le BTP, personnel des mines ou extraction de matières premières (y compris les conducteurs d’engins), personnel des entreprises de la filière bois (scierie, bûcheronnage, élagage, opérateurs de scies à chaîne et d'engins de débardage)</small> :</label>
                                            <div class="card-wrapper">
                                                [option_card personne--mr id:personne--mr col-opt1:SILVER line-opt1:1 col-opt2:MR_SILVER line-opt2:1 "Non" "Oui"]
                                            <p class="price_text_translater" style="display:none">Prix:</p></div>
                                        </fieldset>
                                        [/group]
                                    </div>
                                    <div class="col-12 col sm-4 pl-2 pr-2">
                                        [group capital] 
                                        [group capital-non]
                                        <fieldset>
                                            <label>Capital souhaité en cas de Décès ou Invalidité Permanente Totale ou Partielle :</label>
                                            <div class="card-wrapper">
                                                [option_card personne--optfm id:personne--optkdc col-opt1:SILVER line-opt1:1 col-opt2:SILVER line-opt2:2 "50000€|50000" "150000€|150000"]
                                            </div>
                                        </fieldset>
                                        [/group] 

                                        [group capital-oui]
                                        <fieldset>
                                            <label>Capital souhaité en cas de Décès ou Invalidité Permanente Totale ou Partielle :</label>
                                            <div class="card-wrapper">
                                                [option_card personne--optfm id:personne--optkdc col-opt1:MR_SILVER line-opt1:1 col-opt2:MR_SILVER line-opt2:2 "50000€|50000" "150000€|150000"]
                                            </div>
                                        </fieldset>
                                        [/group] [/group]
                                    </div>

                                    <div class="col-12 col sm-4 pl-2 pr-2">
                                        [group trajet]
                                        [group trajet-50000-non]
                                        <fieldset>
                                            <label>Choisissez la formule adaptée à vos besoins</label>
                                            <div class="card-wrapper">
                                                [option_card personne--trajets id:personne--trajets class:launch-tarif col-opt1:SILVER line-opt1:1 col-opt2:PLATINIUM line-opt2:1 col-opt3:PLATINIUM_FAMILLE line-opt3:1 "Silver|Silver" "Platinium|Platinium" "Platinium Famille|Platinium_famille"]
                                                <p id="p-Silver" style="display:none">Trajets Professionnels uniquement</p>
                                                <p id="p-Platinium" style="display:none">Trajets Professionnels ET Personnels</p>
                                                <p id="p-Platinium_famille" style="display:none">Trajets Pro. ET Perso. incluant la famille proche</p>
                                            </div>
                                        </fieldset>
                                        [/group]
                                        [group trajet-150000-non]
                                        <fieldset>
                                            <label>Choisissez la formule adaptée à vos besoins</label>
                                            <div class="card-wrapper">
                                                [option_card personne--trajets id:personne--trajets class:launch-tarif col-opt1:SILVER line-opt1:2 col-opt2:PLATINIUM line-opt2:2 col-opt3:PLATINIUM_FAMILLE line-opt3:2 "Silver|Silver" "Platinium|Platinium" "Platinium Famille|Platinium_famille"]
                                                <p id="p-Silver" style="display:none">Trajets Professionnels uniquement</p>
                                                <p id="p-Platinium" style="display:none">Trajets Professionnels ET Personnels</p>
                                                <p id="p-Platinium_famille" style="display:none">Trajets Pro. ET Perso. incluant la famille proche</p>
                                            </div>
                                        </fieldset>
                                        [/group]
                                        [group trajet-50000-oui]
                                        <fieldset>
                                            <label>Choisissez la formule adaptée à vos besoins</label>
                                            <div class="card-wrapper">
                                                [option_card personne--trajets id:personne--trajets class:launch-tarif col-opt1:MR_SILVER line-opt1:1 col-opt2:MR_PLATINIUM line-opt2:1 col-opt3:MR_PLATINIUM_FAM line-opt3:1 "Silver|Silver" "Platinium|Platinium" "Platinium Famille|Platinium_famille"]
                                                <p id="p-Silver" style="display:none">Trajets Professionnels uniquement</p>
                                                <p id="p-Platinium" style="display:none">Trajets Professionnels ET Personnels</p>
                                                <p id="p-Platinium_famille" style="display:none">Trajets Pro. ET Perso. incluant la famille proche</p>
                                            </div>
                                        </fieldset>
                                        [/group]
                                        [group trajet-150000-oui]
                                        <fieldset>
                                            <label>Choisissez la formule adaptée à vos besoins</label>
                                            <div class="card-wrapper">
                                                [option_card personne--trajets id:personne--trajets class:launch-tarif col-opt1:MR_SILVER line-opt1:2 col-opt2:MR_PLATINIUM line-opt2:2 col-opt3:MR_PLATINIUM_FAM line-opt3:2 "Silver|Silver" "Platinium|Platinium" "Platinium Famille|Platinium_famille"]
                                                <p id="p-Silver" style="display:none">Trajets Professionnels uniquement</p>
                                                <p id="p-Platinium" style="display:none">Trajets Professionnels ET Personnels</p>
                                                <p id="p-Platinium_famille" style="display:none">Trajets Pro. ET Perso. incluant la famille proche</p>
                                            </div>
                                        </fieldset>
                                        [/group]
                                        [/group]
                                    </div>

                                    <div class="close-col">
                                        <div class="delete" v-on:click="deletePerson(index)"><i class="fa fa-trash-o" style="font-size: 25px;color: rgb(247,1,1);"></i></div>
                                    </div>

                                </div>
                            </div>
                            <div class="col-12 mt-3">
                                <div class="btn-plus" v-on:click="add()">
                                    <i class="fa fa-plus-circle" style="font-size: 35px;color: rgba(33,37,41,0.51);"></i>
                                </div>
                            </div>
                        </div>
                        <div class="col-12">
                            <div class="row mt-4">
                                <div class="col-12 mt-2">
                                    <label class="checkbox-group">[acceptance terms] <small>Les informations recueillies sur cette page font l’objet d’un traitement informatique destiné à recevoir des informations sur nos services, ainsi que d’assurer le suivi et l’instruction de votre demande. Vos informations à caractère personnel sont exclusivement destinées aux personnes habilitées à traiter ces demandes. En cliquant sur « Suivant », je reconnais avoir pris connaissance de la <strong><a href="http://193.70.73.91/wp-content/uploads/2020/01/PGPD-AGIS-2020.pdf" target="_blank">politique de protection des données de AGIS</a></strong> ayant désigné un Délégué à la Protection des Données auprès de la CNIL, en justifiant de votre identité, vous pouvez exercer vos droits d’accès, de rectification ou de suppression des informations vous concernant. Vous pouvez également pour des motifs légitimes, vous opposer au traitement de vos données. Merci de nous adresser en ce cas un mail à dpo@agis-group.com. </small>[/acceptance]</label>
                                </div>
                            </div>
                        </div>
                        <div class="col col-12 d-flex justify-content-end">
                            <input type="button" id="prevBtn" style="margin-rigth: 15px;" class="wpcf7-form-control wpcf7-submit button prevBtn btn-radius button-secondary" value="Previous" />[submit id:nextBtn class:nextBtn class:btn-radius "Suivant"]
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
window.labels = {
      "conjoint": {
        "titre": "Conjoint",
        "conjoint-nom": "Nom",
        "conjoint-prenom": "Prénom",
        "conjoint-datenais": "Date de naissance"
      },
      "enfants": {
        "titre": "Enfants (moins de 21 ans)",
        "enfant-num": "n°*num*",
        "enfant-nom": "Nom",
        "enfant-prenom": "Prénom",
        "enfant-datenaiss": "Date de naissance",
        "enfant-action": "Action"
      },
      "buttons": {
        "ajout": "Ajouter",
        "suppression": "Supprimer"
      },
      'accordion': {
        "activeText": "Masquer les membres de la famille",
        "inactiveText": "Gérer les membres de la famille"
      }
    };
</script>