personnal/ecole/views/tarifformrc.ejs

1255 lines
58 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<form id="projetForm">
<div class="row">
<div class="row" id="historiqueDiv">
<div class="col s12">
<div class="col s5">
<select id="idSelect">
<option value="" selected disabled>Choix d'une ancienne version du projet</option>
</select>
</div>
<div class="col s3">
<button class="btn" type="button" id="loadHistoriqueBtn" style="margin-top: 10px;">Charger la version sélectionnée</button>
</div>
</div>
</div>
<div class="row">
<div class="header">
<div class="chapter">
<i class="material-icons">assignment</i><span style="margin-left: 10px;">Eléments d'appréciation sur l'entreprise :</span>
</div>
<div class="row">
<h6 class="red-text text-darken-4">Veuillez renseigner les éléments d'appréciation sur l'entreprise ci-dessous :</h6>
</div>
</div>
<div class="row">
<div class="col s6 offset-s3" style="display: flex;justify-content: space-evenly;align-items: center;">
<label>
<input name="cotisation" id="revisable" type="radio" value="revisable" checked />
<span>Cotisation révisable</span>
</label>
<label>
<input name="cotisation" id="forfaitaire" type="radio" value="forfaitaire" />
<span>Cotisation forfaitaire</span>
</label>
</div>
</div>
<div class="row">
<div class="col s4 offset-s4">
<label for="chiffreAffaire" class="left">Chiffre d'affaires (€) :</label>
<input type="text" id="chiffreAffaire" placeholder="Ex: 1234567">
<span id="chiffreAffaire-error" class="helper-text red-text"></span>
</div>
<div class="col s3 offset-s1">
<div class="chip-info" id="modCA" style="display: none;">Modulation CA :<br>x 1.00</div>
</div>
<div class="col s4 offset-s4" id="rowNbrVehicule" style="display: none;">
<label for="nbrVehicule" class="rc-field-label">Nombre de véhicule(s) :<span style="color: red"><b>*</b></span></label>
<input placeholder="Ex: 1 ou 2" type="number" id="nbrVehicule" min="1" max="2">
<span id="nbrVehicule-error" class="helper-text red-text"></span>
</div>
</div>
</div>
<div class="row">
<div class="header">
<div class="chapter">
<i class="material-icons">check_box</i><span style="margin-left: 10px;">Choix des garanties :</span>
</div>
<div class="row">
<h6 class="red-text text-darken-4">Veuillez renseigner les garanties du contrat :</h6>
</div>
</div>
<div class="row">
<div class="col s6 offset-s3" style="display: flex;justify-content: space-evenly;align-items: center;">
<label>
<input type="checkbox" class="filled-in" id="checkRCC" checked disabled />
<span>RC Contractuelle</span>
</label>
<label>
<input type="checkbox" class="filled-in" id="checkRCE"/>
<span>Autres RC</span>
</label>
</div>
</div>
</div>
<div class="row">
<div class="header">
<div class="chapter" style="display: flex;justify-content: space-between;align-items: center;">
<div style="display: flex;">
<i class="material-icons">check_box</i><span style="margin-left: 10px;">Activités principales :</span>
</div>
<div style="display: flex;align-items: center;gap: 15px;">
<div id="pourcentageTotal" style="background: white;color: darkblue;padding: 8px 15px;border-radius: 5px;font-weight: bold;font-size: 1.1em;">
Total : 0%
</div>
<button class="rectangle" type="button" id="resetPourcent" style="border: 2.5px solid white !important;">Reset</button>
</div>
</div>
<div class="row">
<h6 class="red-text text-darken-4">Veuillez renseigner les activités du contrat :</h6>
</div>
</div>
<div class="row" style="display: flex;flex-direction: column;align-items: flex-start;width: 30%;">
<label id="labelVoiturier">
<input type="checkbox" class="filled-in" id="checkVoiturier" checked/>
<span>Voiturier / Loueur</span>
</label>
<label id="labelCommissionnaire">
<input type="checkbox" class="filled-in" id="checkCommissionnaire"/>
<span>Commissionnaire de Transport</span>
</label>
<label id="labelDemenageur">
<input type="checkbox" class="filled-in" id="checkDemenageur"/>
<span>Déménageur</span>
</label>
<label id="labelLogistique">
<input type="checkbox" class="filled-in" id="checkLogistique"/>
<span>Logistique</span>
</label>
<label id="labelAutocariste" style="display: none;">
<input type="checkbox" class="filled-in" id="checkAutocariste"/>
<span>Autocariste</span>
</label>
<label id="labelAutres">
<input type="checkbox" class="filled-in" id="checkAutres"/>
<span>Autres activites</span>
</label>
</div>
<div class="row card-list rc-three-col-grid">
<div class='col s4' name="actVoiturier/Loueur">
<div class='card'>
<div class='card-content'>
<span><strong style="color: darkblue;">Voiturier / Loueur</strong></span>
<hr>
<div class="row">
<label class="rc-field-label" for="capitalActVoiturierLoueur">Capital à assurer</label>
<input type="text" id="capitalActVoiturierLoueur" name="selectActVoiturier/Loueur" placeholder="Ex: 5000, 10000, 25000" style="text-align: center; font-weight: bold;">
</div>
<div class="row" style="display: flex;align-items: center; justify-content: space-around;">
<input id="pourcentVoiturier/Loueur" class="input-pourcent" type="text" placeholder="Ex: 50" title="Appuyez sur Entrée pour valider" style="width: 80px; text-align: center; font-weight: bold; border: 2px solid #3f51b5; border-radius: 4px; padding: 8px;" />
<span><strong style="color: darkblue;">% du chiffre d'affaires</strong></span>
<input id="isSetVoiturier/Loueur" value="false" type="hidden">
</div>
<hr>
<span><strong style="color: darkblue;">Taux de base :</strong></span>
<div style="display: flex; justify-content: space-around;margin-top: 10px;">
<div name="RCC" class="chip-info" id="tauxBaseRCCactVoiturier/Loueur">
<span>RCC : 0.000 %</span>
</div>
<div name="RCE" class="chip-info" id="tauxBaseRCEactVoiturier/Loueur" style="display: none;">
<span>RCE : 0.000 %</span>
</div>
</div>
</div>
</div>
</div>
<div class='col s4' name="actCommissionnaire de Transport" style="display: none;">
<div class='card'>
<div class='card-content'>
<span><strong style="color: darkblue;">Commissionnaire de Transport</strong></span>
<hr>
<div class="row">
<label class="rc-field-label" for="capitalActCommissionnaire">Capital à assurer</label>
<input type="text" id="capitalActCommissionnaire" name="selectActCommissionnaire de Transport" placeholder="Ex: 100000, 150000, 200000" style="text-align: center; font-weight: bold;">
</div>
<div class="row" style="display: flex;align-items: center; justify-content: space-around;">
<input id="pourcentCommissionnaire de Transport" class="input-pourcent" type="text" placeholder="Ex: 50" title="Appuyez sur Entrée pour valider" style="width: 80px; text-align: center; font-weight: bold; border: 2px solid #3f51b5; border-radius: 4px; padding: 8px;" />
<span><strong style="color: darkblue;">% du chiffre d'affaires</strong></span>
<input id="isSetCommissionnaire de Transport" value="false" type="hidden">
</div>
<hr>
<span><strong style="color: darkblue;">Taux de base :</strong></span>
<div style="display: flex; justify-content: space-around;margin-top: 10px;">
<div name="RCC" class="chip-info" id="tauxBaseRCCactCommissionnaire de Transport">
<span>RCC : 0.000 %</span>
</div>
<div name="RCE" class="chip-info" id="tauxBaseRCEactCommissionnaire de Transport" style="display: none;">
<span>RCE : 0.000 %</span>
</div>
</div>
</div>
</div>
</div>
<div class='col s4' name="actDéménageur" style="display: none;">
<div class='card'>
<div class='card-content'>
<span><strong style="color: darkblue;">Déménageur</strong></span>
<hr>
<div class="row">
<label class="rc-field-label" for="capitalActDemenageur">Capital à assurer</label>
<input type="text" id="capitalActDemenageur" name="selectActDéménageur" placeholder="Ex: 5000, 10000, 25000" style="text-align: center; font-weight: bold;">
</div>
<div class="row" style="display: flex;align-items: center; justify-content: space-around;">
<input id="pourcentDéménageur" class="input-pourcent" type="text" placeholder="Ex: 50" title="Appuyez sur Entrée pour valider" style="width: 80px; text-align: center; font-weight: bold; border: 2px solid #3f51b5; border-radius: 4px; padding: 8px;" />
<span><strong style="color: darkblue;">% du chiffre d'affaires</strong></span>
<input id="isSetDéménageur" value="false" type="hidden">
</div>
<hr>
<span><strong style="color: darkblue;">Taux de base :</strong></span>
<div style="display: flex; justify-content: space-around;margin-top: 10px;">
<div name="RCC" class="chip-info" id="tauxBaseRCCactDéménageur">
<span>RCC : 0.000 %</span>
</div>
<div name="RCE" class="chip-info" id="tauxBaseRCEactDéménageur" style="display: none;">
<span>RCE : 0.000 %</span>
</div>
</div>
</div>
</div>
</div>
<div class='col s4' name="actLogistique" style="display: none;">
<div class='card'>
<div class='card-content'>
<span><strong style="color: darkblue;">Logistique</strong></span>
<hr>
<div class="row">
<label class="rc-field-label" for="capitalActLogistique">Capital à assurer</label>
<input type="text" id="capitalActLogistique" name="selectActLogistique" placeholder="Ex: 5000, 10000, 25000" style="text-align: center; font-weight: bold;">
</div>
<div class="row" style="display: flex;align-items: center; justify-content: space-around;">
<input id="pourcentLogistique" class="input-pourcent" type="text" placeholder="Ex: 50" title="Appuyez sur Entrée pour valider" style="width: 80px; text-align: center; font-weight: bold; border: 2px solid #3f51b5; border-radius: 4px; padding: 8px;" />
<span><strong style="color: darkblue;">% du chiffre d'affaires</strong></span>
<input id="isSetLogistique" value="false" type="hidden">
</div>
<hr>
<span><strong style="color: darkblue;">Taux de base :</strong></span>
<div style="display: flex; justify-content: space-around;margin-top: 10px;">
<div name="RCC" class="chip-info" id="tauxBaseRCCactLogistique">
<span>RCC : 0.000 %</span>
</div>
<div name="RCE" class="chip-info" id="tauxBaseRCEactLogistique" style="display: none;">
<span>RCE : 0.000 %</span>
</div>
</div>
</div>
</div>
</div>
<div class='col s4' name="actAutocariste" style="display: none;">
<div class='card'>
<div class='card-content'>
<span><strong style="color: darkblue;">Autocariste</strong></span>
<hr>
<div class="row">
<label class="rc-field-label" for="capitalActAutocariste">Capital à assurer</label>
<input type="text" id="capitalActAutocariste" name="selectActAutocariste" placeholder="Ex: 25000, 50000, 75000" style="text-align: center; font-weight: bold;">
</div>
<div class="row" style="display: flex;align-items: center; justify-content: space-around;">
<input id="pourcentAutocariste" class="input-pourcent" type="text" placeholder="Ex: 50" title="Appuyez sur Entrée pour valider" style="width: 80px; text-align: center; font-weight: bold; border: 2px solid #3f51b5; border-radius: 4px; padding: 8px;" />
<span><strong style="color: darkblue;">% du chiffre d'affaires</strong></span>
<input id="isSetAutocariste" value="false" type="hidden">
</div>
<hr>
<span><strong style="color: darkblue;">Taux de base :</strong></span>
<div style="display: flex; justify-content: space-around;margin-top: 10px;">
<div name="RCC" class="chip-info">
<span>RCC : 0.000 %</span>
</div>
<div name="RCE" class="chip-info" style="display: none;">
<span>RCE : 0.000 %</span>
</div>
</div>
</div>
</div>
</div>
<div class='col s4' name="actAutres activites" style="display: none;">
<div class='card'>
<div class='card-content'>
<span><strong style="color: darkblue;">Autres activites</strong></span>
<hr>
<div class="row">
<label class="rc-field-label" for="capitalActAutres">Capital à assurer</label>
<input type="text" id="capitalActAutres" name="selectActAutres activites" placeholder="Ex: 5000, 10000, 25000" style="text-align: center; font-weight: bold;">
</div>
<div class="row" style="display: flex;align-items: center; justify-content: space-around;">
<input id="pourcentAutres activites" class="input-pourcent" type="text" placeholder="Ex: 50" title="Appuyez sur Entrée pour valider" style="width: 80px; text-align: center; font-weight: bold; border: 2px solid #3f51b5; border-radius: 4px; padding: 8px;" />
<span><strong style="color: darkblue;">% du chiffre d'affaires</strong></span>
<input id="isSetAutres activites" value="false" type="hidden">
</div>
<hr>
<span><strong style="color: darkblue;">Taux de base :</strong></span>
<div style="display: flex; justify-content: space-around;margin-top: 10px;">
<div name="RCC" class="chip-info" id="tauxBaseRCCactAutres activites">
<span>RCC : 0.000 %</span>
</div>
<div name="RCE" class="chip-info" id="tauxBaseRCEactAutres activites" style="display: none;">
<span>RCE : 0.000 %</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div style="display: flex;justify-content: space-evenly;">
<div name="RCC" id="primeChapActRCC" class="chip modulo">
<span>Prime de base RCC : 000 000.00 €</span>
<br>
<span>X mod. CA : 000 000.00 €</span>
</div>
<div name="RCE" id="primeChapActRCE" class="chip modulo" style="display: none;">
<span>Prime de base RCE : 000 000.00 €</span>
<br>
<span>X mod. CA : 000 000.00 €</span>
</div>
</div>
</div>
<div class="row">
<div class="header">
<div class="chapter">
<i class="material-icons">check_box</i><span style="margin-left: 10px;">Activités complémentaires :</span>
</div>
<div class="row">
<h6 class="red-text text-darken-4">Veuillez renseigner les activités complémentaires du contrat :</h6>
</div>
</div>
<div class="row card-list rc-three-col-grid">
<div class='col s4 mrgl0' name="actComplVoiturier/Loueur">
<div class='card'>
<div class='card-content'>
<span>Complément d'activité de : <strong style="color: darkblue;">Voiturier / Loueur</strong></span>
<hr>
<div style="display: flex; flex-direction: column; align-items: flex-start; text-align: left; gap: 12px;">
<label>
<input type="checkbox" class="filled-in" checked />
<span>Voiturier y compris sous-traitance temporaire</span>
</label>
<label>
<input type="checkbox" class="filled-in" checked />
<span>Loueur de véhicule industriel avec conducteur</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Coursier en 2 ou 3 roues</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Montage de meuble, électroménager, branchement</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Manutentionnaire - levageur / Loueur de matériel de levage avec opérateur</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Accompagnement de transport exceptionnel</span>
</label>
</div>
</div>
</div>
</div>
<div class='col s4 mrgl0' name="actComplCommissionnaire de Transport" style="display: none;">
<div class='card'>
<div class='card-content'>
<span>Complément d'activité de : <strong style="color: darkblue;">Commissionnaire de Transport</strong></span>
<hr>
<div style="display: flex; flex-direction: column; align-items: flex-start; text-align: left; gap: 12px;">
<label>
<input type="checkbox" class="filled-in" />
<span>Commissionnaire de transport multimodal - zone UE</span>
</label>
<label>
<input type="checkbox" class="filled-in" checked />
<span>Commissionnaire de transport multimodal</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Transitaire</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Représentant en Douane Enregistré</span>
</label>
</div>
</div>
</div>
</div>
<div class='col s4 mrgl0' name="actComplDéménageur" style="display: none;">
<div class='card'>
<div class='card-content'>
<span>Complément d'activité de : <strong style="color: darkblue;">Déménageur</strong></span>
<hr>
<div style="display: flex; flex-direction: column; align-items: flex-start; text-align: left; gap: 12px;">
<label>
<input type="checkbox" class="filled-in" checked />
<span>Déménageur de particuliers par voie terrestre</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Déménageur de particuliers par voie terrestre - garantie dommage</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Déménageur d'entreprises</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Déménageur interne</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Garde-meubles</span>
</label>
</div>
</div>
</div>
</div>
<div class='col s4 mrgl0' name="actComplLogistique" style="display: none;">
<div class='card'>
<div class='card-content'>
<span>Complément d'activité de : <strong style="color: darkblue;">Logistique</strong></span>
<hr>
<div style="display: flex; flex-direction: column; align-items: flex-start; text-align: left; gap: 12px;">
<label>
<input type="checkbox" class="filled-in" />
<span>Entrepositaire - dépositaire</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Gestion de stocks - préparation de commande</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Empoteur</span>
</label>
</div>
</div>
</div>
</div>
</div>
<div style="display: flex;justify-content: space-evenly;">
<div name="RCC" id="primeChapActComplRCC" class="chip modulo">
<span>Prime RCC : 000 000.00 €</span>
</div>
<div name="RCE" id="primeChapActComplRCE" class="chip modulo" style="display: none;">
<span>Prime RCE : 000 000.00 €</span>
</div>
</div>
</div>
<div class="row">
<div class="header">
<div class="chapter">
<i class="material-icons">local_shipping</i><span style="margin-left: 10px;">Marchandises :</span>
</div>
<div class="row">
<h6 class="red-text text-darken-4">Veuillez renseigner les marchandises du contrat par activités :</h6>
</div>
</div>
<div class="row card-list rc-three-col-grid">
<div class='col s4 mrgl0' name="marVoiturier/Loueur">
<div class='card'>
<div class='card-content'>
<span>Marchandises pour : <strong style="color: darkblue;">Voiturier / Loueur</strong></span>
<hr>
<div style="display: flex; flex-direction: column; align-items: flex-start; text-align: left; gap: 12px;">
<label>
<input type="checkbox" class="filled-in" checked/>
<span>Marchandises ordinaires et assimilées, les marchandises dangereuses dans le respect de la réglementation</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Véhicules roulants</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Engins de chantier et engins agricoles</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Véhicules roulants dans le cadre d'une activité de déménagement</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Mobiliers usagés Objets et effets personnels en déménagement</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Marchandises périssables sous température dirigée</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Animaux vivants</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Marchandises en citerne</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Transport de béton</span>
</label>
</div>
</div>
</div>
</div>
<div class='col s4 mrgl0' name="marCommissionnaire de Transport" style="display: none;">
<div class='card'>
<div class='card-content'>
<span>Marchandises pour : <strong style="color: darkblue;">Commissionnaire de Transport</strong></span>
<hr>
<div style="display: flex; flex-direction: column; align-items: flex-start; text-align: left; gap: 12px;">
<label>
<input type="checkbox" class="filled-in" checked/>
<span>Marchandises ordinaires et assimilées, les marchandises dangereuses dans le respect de la réglementation</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Véhicules roulants</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Engins de chantier et engins agricoles</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Véhicules roulants dans le cadre d'une activité de déménagement</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Mobiliers usagés Objets et effets personnels en déménagemen</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Marchandises périssables sous température dirigée</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Animaux vivants</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Marchandises en citerne</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Transport de béton</span>
</label>
</div>
</div>
</div>
</div>
<div class='col s4 mrgl0' name="marDéménageur" style="display: none;">
<div class='card'>
<div class='card-content'>
<span>Marchandises pour : <strong style="color: darkblue;">Déménageur</strong></span>
<hr>
<div style="display: flex; flex-direction: column; align-items: flex-start; text-align: left; gap: 12px;">
<label>
<input type="checkbox" class="filled-in" />
<span>Mobiliers en déménagement</span>
</label>
</div>
</div>
</div>
</div>
<div class='col s4 mrgl0' name="marLogistique" style="display: none;">
<div class='card'>
<div class='card-content'>
<span>Marchandise pour : <strong style="color: darkblue;">Logistique</strong></span>
<hr>
<div style="display: flex; flex-direction: column; align-items: flex-start; text-align: left; gap: 12px;">
<label>
<input type="checkbox" class="filled-in" checked/>
<span>Marchandises ordinaires et assimilées, les marchandises dangereuses dans le respect de la réglementation</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Véhicules roulants</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Engins de chantier et engins agricoles</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Véhicules roulants dans le cadre d'une activité de déménagement</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Mobiliers usagés Objets et effets personnels en déménagemen</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Marchandises périssables sous température dirigée</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Animaux vivants</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Marchandises en citerne</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Transport de béton</span>
</label>
</div>
</div>
</div>
</div>
<div class='col s4 mrgl0' name="marAutocariste" style="display: none;">
<div class='card'>
<div class='card-content'>
<span>Marchandise pour : <strong style="color: darkblue;">Autocariste</strong></span>
<hr>
<div style="display: flex; flex-direction: column; align-items: flex-start; text-align: left; gap: 12px;">
<label>
<input type="checkbox" class="filled-in" checked/>
<span>Marchandises ordinaires et assimilées, les marchandises dangereuses dans le respect de la réglementation</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Véhicules roulants</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Engins de chantier et engins agricoles</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Véhicules roulants dans le cadre d'une activité de déménagement</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Mobiliers usagés Objets et effets personnels en déménagemen</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Marchandises périssables sous température dirigée</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Animaux vivants</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Marchandises en citerne</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Transport de béton</span>
</label>
</div>
</div>
</div>
</div>
<div class='col s4 mrgl0' name="marAutres activites" style="display: none;">
<div class='card'>
<div class='card-content'>
<span>Marchandise pour : <strong style="color: darkblue;">Autres Activités</strong></span>
<hr>
<div style="display: flex; flex-direction: column; align-items: flex-start; text-align: left; gap: 12px;">
<label>
<input type="checkbox" class="filled-in" checked />
<span>Marchandises ordinaires et assimilées, les marchandises dangereuses dans le respect de la réglementation</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Véhicules roulants</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Engins de chantier et engins agricoles</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Véhicules roulants dans le cadre d'une activité de déménagement</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Mobiliers usagés Objets et effets personnels en déménagemen</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Marchandises périssables sous température dirigée</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Animaux vivants</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Marchandises en citerne</span>
</label>
<label>
<input type="checkbox" class="filled-in" />
<span>Transport de béton</span>
</label>
</div>
</div>
</div>
</div>
</div>
<div style="display: flex;justify-content: space-evenly;">
<div name="RCC" id="primeChapMarchRCC" class="chip modulo">
<span>Prime RCC : 000 000.00 €</span>
</div>
<div name="RCE" id="primeChapMarchRCE" class="chip modulo" style="display: none;">
<span>Prime RCE : 000 000.00 €</span>
</div>
</div>
</div>
<div class="row">
<div class="header">
<div class="chapter">
<i class="material-icons">public</i><span style="margin-left: 10px;">Informations sur les zones géographiques :</span>
</div>
<div class="row">
<h6 class="red-text text-darken-4">Veuillez renseigner la territorialité du contrat :</h6>
</div>
<div class="row">
<div class="col s12">
<div class="col s8 offset-s2">
<div class="row" style="display: flex; justify-content: space-around; align-items: flex-end;">
<label>Zones géographiques :</label>
<div>
<button class="rectangle" type="button" id="btnMondeEntier">Monde entier</button>
<button class="rectangle" type="button" id="btnReset">Reset</button>
</div>
</div>
<hr>
<div class="row" style="margin-top: 20px;">
<div style="display: flex;align-items: center;justify-content: space-between;">
<label>
<input type="checkbox" id="zone1" name="zone1" class="filled-in" checked/>
<span id="zone1-text">Zone 1 - France Métropolitaine et pays limitrophes</span>
</label>
<button class="circle" type="button" id="btnZone1">?</button>
</div>
<div style="display: flex;align-items: center;justify-content: space-between;">
<label>
<input type="checkbox" id="zone2" name="zone2" class="filled-in" />
<span id="zone2-text">Zone 2 - Union Européenne</span>
</label>
<button class="circle" type="button" id="btnZone2">?</button>
</div>
<div style="display: flex;align-items: center;justify-content: space-between;">
<label>
<input type="checkbox" id="zone3" name="zone3" class="filled-in" />
<span id="zone3-text">Zone 3 - Autres pays européens sauf Russie et Ukraine</span>
</label>
<button class="circle" type="button" id="btnZone3">?</button>
</div>
<div style="display: flex;align-items: center;justify-content: space-between;">
<label>
<input type="checkbox" id="zone4" name="zone4" class="filled-in" />
<span id="zone4-text">Zone 4 - Pays du Maghreb et Amérique du Nord (USA/Canada/Mexique)</span>
</label>
<button class="circle" type="button" id="btnZone4">?</button>
</div>
<div style="display: flex;align-items: center;justify-content: space-between;">
<label>
<input type="checkbox" id="zone5" name="zone5" class="filled-in" />
<span id="zone5-text">Zone 5 - Amérique Centrale et Sud / Caraïbes, Asie et Océanie</span>
</label>
<button class="circle" type="button" id="btnZone5">?</button>
</div>
<div style="display: flex;align-items: center;justify-content: space-between;">
<label>
<input type="checkbox" id="zone6" name="zone6" class="filled-in" />
<span id="zone6-text">Zone 6 - Afrique hors Maghreb / Proche Orient / Moyen Orient</span>
</label>
<button class="circle" type="button" id="btnZone6">?</button>
</div>
<div style="display: flex;align-items: center;justify-content: space-between;">
<label>
<input type="checkbox" id="zone7" name="zone7" class="filled-in" disabled />
<span id="zone7-text">Pays exclus</span>
</label>
<button class="circle" type="button" id="btnZone7">?</button>
</div>
</div>
</div>
</div>
</div>
</div>
<div style="display: flex;justify-content: space-evenly;">
<div name="RCC" id="primeChapZonesRCC" class="chip modulo">
<span>Prime RCC : 000 000.00 €</span>
</div>
<div name="RCE" id="primeChapZonesRCE" class="chip modulo" style="display: none;">
<span>Prime RCE : 000 000.00 €</span>
</div>
</div>
</div>
<div class="row">
<div class="header">
<div class="chapter">
<i class="material-icons">check_box</i><span style="margin-left: 10px;">Engagements complémentaires :</span>
</div>
<div class="row">
<h6 class="red-text text-darken-4">Veuillez renseigner les engagements complémentaires du contrat :</h6>
</div>
</div>
<div class="row">
<div class='col s4'>
<div class='card'>
<div class='card-content'>
<div class="row mrg-b-off">
<span style="float: right; color: lightgray; font-weight: bold;">RCC</span>
<label><input id="checkDomImmat" type='checkbox' class='filled-in' /><span>Dommages immatériels</span></label>
</div>
<div id="selectDomImmat" style="display: none; margin-top: 20px;">
<label class="rc-field-label" for="inputDomImmat">Capital à assurer</label>
<input type="text" id="inputDomImmat" placeholder="Ex: 15000, 50000, 100000" style="font-weight: bold;">
</div>
</div>
</div>
</div>
<div class='col s4'>
<div class='card'>
<div class='card-content'>
<div class="row mrg-b-off">
<span style="float: right; color: lightgray; font-weight: bold;">RCC</span>
<label><input id="checkContConf" type='checkbox' class='filled-in' /><span>Contenants confiés</span></label>
</div>
<div id="selectContConf" style="display: none; margin-top: 20px;">
<label class="rc-field-label" for="inputContConf">Capital à assurer</label>
<input type="text" id="inputContConf" placeholder="Ex: 25000, 50000, 100000" style="font-weight: bold;">
</div>
</div>
</div>
</div>
<div class='col s4'>
<div class='card'>
<div class='card-content'>
<div class="row mrg-b-off">
<span style="float: right; color: lightgray; font-weight: bold;">RCC</span>
<label><input id="checkDiffInv" type='checkbox' class='filled-in' /><span>Différence inventaire</span></label>
</div>
<div id="selectDiffInv" style="display: none; margin-top: 20px;">
<label class="rc-field-label" for="inputDiffInv">Capital à assurer</label>
<input type="text" id="inputDiffInv" placeholder="Ex: 15000, 30000, 50000" style="font-weight: bold;">
</div>
</div>
</div>
</div>
</div>
<div style="display: flex;justify-content: space-evenly;">
<div name="RCC" id="primeChapEngRCC" class="chip modulo">
<span id="primeEngValue">Prime RCC : 000 000.00 €</span>
<div id="primeEngInfos"></div>
</div>
</div>
</div>
<div class="row">
<div class="header">
<div class="chapter">
<i class="material-icons">check_box</i><span style="margin-left: 10px;">Garanties additionnelles :</span>
</div>
<div class="row">
<h6 class="red-text text-darken-4">Veuillez renseigner les garanties additionnelles du contrat :</h6>
</div>
</div>
<div class="row mrg-b-off rc-equal-card-row">
<div class='col s4'>
<div class='card'>
<div class='card-content'>
<div id="rowTPPC" class="row mrg-b-off">
<span style="float: right; color: lightgray; font-weight: bold;">RCC</span>
<label><input id="checkTPPC" type='checkbox' class='filled-in' /><span>TPPC</span></label>
</div>
<div id="selectTPPC" style="display: none; margin-top: 20px;">
<label class="rc-field-label" for="selTPPCcapital">Capital à assurer</label>
<input type="text" id="selTPPCcapital" placeholder="Ex: 5000, 10000, 15000" style="font-weight: bold; margin-bottom: 10px;">
<label class="rc-field-label" for="selTPPCveh">Nombre de véhicules</label>
<input type="number" id="selTPPCveh" placeholder="Ex: 1 ou 2" min="1" max="10" style="font-weight: bold;">
</div>
</div>
</div>
</div>
<div class='col s4'>
<div class='card'>
<div class='card-content'>
<span style="float: right; color: lightgray; font-weight: bold;">RCC</span>
<label><input id="checkPJ" type='checkbox' class='filled-in' /><span>Protection juridique</span></label>
</div>
</div>
</div>
</div>
<div class="row" name="RCE" style="display: none;">
<div class='col s4'>
<div class='card'>
<div class='card-content'>
<span style="float: right; color: lightgray; font-weight: bold;">RCE</span>
<label><input id="checkStationLavage" type='checkbox' class='filled-in' /><span>Station de lavage</span></label>
</div>
</div>
</div>
<div class='col s4'>
<div class='card'>
<div class='card-content'>
<span style="float: right; color: lightgray; font-weight: bold;">RCE</span>
<label><input id="checkGarageInterne" type='checkbox' class='filled-in' /><span>Garage interne</span></label>
</div>
</div>
</div>
<div class='col s4'>
<div class='card'>
<div class='card-content'>
<span style="float: right; color: lightgray; font-weight: bold;">RCE</span>
<label><input id="checkCSE" type='checkbox' class='filled-in' /><span>Comité Social et Economique</span></label>
</div>
</div>
</div>
</div>
<div style="display: flex;justify-content: space-evenly;">
<div name="RCC" id="primeChapGarAddRCC" class="chip modulo">
<span>Prime RCC : 000 000.00 €</span>
</div>
<div name="RCE" id="primeChapGarAddRCE" class="chip modulo" style="display: none;">
<span>Prime RCE : 000 000.00 €</span>
</div>
</div>
</div>
<div class="row">
<div class="header">
<div class="chapter">
<i class="material-icons">add_alert</i><span style="margin-left: 10px;">Modulation antécédent sinistre
:</span>
</div>
<div class="row">
<h6 class="red-text text-darken-4">Veuillez renseigner l'historique de sinistre du contrat :</h6>
</div>
</div>
<div class="col s4 offset-s4">
<label for="sinistre" class="left">Montant de sinistres annuel :</label>
<input type="text" id="sinistre" placeholder="Ex: 1234567" />
<span id="sinistre-error" class="helper-text red-text"></span>
</div>
<div class="col s3 offset-s1">
<div class="chip-info" id="modSinistre" style="display: none;">Modulation sinistre :<br>x 1.00</div>
</div>
</div>
<div class="row">
<div class="header">
<div class="chapter">
<i class="material-icons">credit_card</i><span style="margin-left: 10px;">Propositions tarifaires :</span>
</div>
<div class="row">
<h6 class="red-text text-darken-4">Veuillez sélectionner un tarif adapté :</h6>
</div>
</div>
<div id="rcTarifBlockingSummary" class="rc-blocking-summary"></div>
<div id="tarifettesContainer" class="col s12" style="display: flex;">
<div class="col s4">
<div class="franchise-card card border">
<div class="card-tarif-head" style="background-color:#b71c1c">
<div class="card-tarif-head-content">
<span>Franchise 250 €</span><br>
<span class="price" id="priceFr250">0.00 €</span>
</div>
</div>
<div class="card-content no-padding txt-color">
<p>Prime RCC : <span id="rccFr250">0.00 €</span></p>
<p>Taux RCC : <span id="tauxRccFr250">0.000 %</span></p>
<p>Prime RCE : <span id="rceFr250">0.00 €</span></p>
<p>Taux RCE : <span id="tauxRceFr250">0.000 %</span></p>
<p>Prime PJ : <span id="pjFr250">0.00 €</span></p>
<p>Taux global : <span id="tauxGlobalFr250">0.000 %</span></p>
</div>
<div class="card-action">
<button class="btn" name="250">Choisir</button>
</div>
</div>
</div>
<div class="col s4">
<div class="franchise-card card border">
<div class="yellow darken-3 white-text card-tarif-head">
<div class="card-tarif-head-content">
<span>Franchise 400 €</span><br>
<span class="price" id="priceFr400">0.00 €</span>
</div>
</div>
<div class="card-content no-padding txt-color">
<p>Prime RCC : <span id="rccFr400">0.00 €</span></p>
<p>Taux RCC : <span id="tauxRccFr400">0.000 %</span></p>
<p>Prime RCE : <span id="rceFr400">0.00 €</span></p>
<p>Taux RCE : <span id="tauxRceFr400">0.000 %</span></p>
<p>Prime PJ : <span id="pjFr400">0.00 €</span></p>
<p>Taux global : <span id="tauxGlobalFr400">0.000 %</span></p>
</div>
<div class="card-action">
<button class="btn" name="400">Choisir</button>
</div>
</div>
</div>
<div class="col s4">
<div class="franchise-card card border">
<div class="card-tarif-head" style="background-color:#2e7d32">
<div class="card-tarif-head-content">
<span>Franchise 10% avec min 300 € et max 2000 €</span><br>
<span class="price" id="priceFr2000">0.00 €</span>
</div>
</div>
<div class="card-content no-padding txt-color">
<p>Prime RCC : <span id="rccFr2000">0.00 €</span></p>
<p>Taux RCC : <span id="tauxRccFr2000">0.000 %</span></p>
<p>Prime RCE : <span id="rceFr2000">0.00 €</span></p>
<p>Taux RCE : <span id="tauxRceFr2000">0.000 %</span></p>
<p>Prime PJ : <span id="pjFr2000">0.00 €</span></p>
<p>Taux global : <span id="tauxGlobalFr2000">0.000 %</span></p>
</div>
<div class="card-action">
<button class="btn" name="mini300">Choisir</button>
</div>
</div>
</div>
</div>
</div>
</div>
</form>
<!-- MODALS -->
<!-- Modal pour pays zone 1 -->
<div id="modalZone1" class="modal">
<div class="modal-content center-align">
<div class="row">
<h5>Zone 1 - France Métropolitaine et pays limitrophes</h5>
<hr>
</div>
<div class="row">
<img src="/images/zone1.png" alt="Liste zone 1" id="imgZone1" style="width:80%;">
</div>
</div>
<div class="modal-footer">
<a class="modal-close waves-effect waves-green btn-flat">Fermer</a>
</div>
</div>
<!-- Modal pour pays zone 2 -->
<div id="modalZone2" class="modal">
<div class="modal-content center-align">
<div class="row">
<h5>Zone 2 - Union Européenne</h5>
<hr>
</div>
<div class="row">
<img src="/images/zone2.png" alt="Liste zone 2" id="imgZone2" style="width:80%;">
</div>
</div>
<div class="modal-footer">
<a class="modal-close waves-effect waves-green btn-flat">Fermer</a>
</div>
</div>
<!-- Modal pour pays zone 3 -->
<div id="modalZone3" class="modal">
<div class="modal-content center-align">
<div class="row">
<h5>Zone 3 - Autres pays Européens sauf Russie et Ukraine</h5>
<hr>
</div>
<div class="row">
<img src="/images/zone3.png" alt="Liste zone 3" id="imgZone3" style="width:80%;">
</div>
</div>
<div class="modal-footer">
<a class="modal-close waves-effect waves-green btn-flat">Fermer</a>
</div>
</div>
<!-- Modal pour pays zone 4 -->
<div id="modalZone4" class="modal">
<div class="modal-content center-align">
<div class="row">
<h5>Zone 4 - Pays du Maghreb et Amérique du Nord ( USA / Canada / Mexique )</h5>
<hr>
</div>
<div class="row">
<img src="/images/zone4.png" alt="Liste zone 4" id="imgZone4" style="width:80%;">
</div>
</div>
<div class="modal-footer">
<a class="modal-close waves-effect waves-green btn-flat">Fermer</a>
</div>
</div>
<!-- Modal pour pays zone 5 -->
<div id="modalZone5" class="modal">
<div class="modal-content center-align">
<div class="row">
<h5>Zone 5 - Amérique Centrale et Sud / Caraïbes, Asie et Océanie</h5>
<hr>
</div>
<div class="row">
<img src="/images/zone5.png" alt="Liste zone 5" id="imgZone5" style="width:80%;">
</div>
</div>
<div class="modal-footer">
<a class="modal-close waves-effect waves-green btn-flat">Fermer</a>
</div>
</div>
<!-- Modal pour pays zone 6 -->
<div id="modalZone6" class="modal">
<div class="modal-content center-align">
<div class="row">
<h5>Zone 6 - Afrique hors Maghreb / Proche Orient / Moyen Orient</h5>
<hr>
</div>
<div class="row">
<img src="/images/zone6.png" alt="Liste zone 6" id="imgZone6" style="width:80%;">
</div>
</div>
<div class="modal-footer">
<a class="modal-close waves-effect waves-green btn-flat">Fermer</a>
</div>
</div>
<!-- Modal pour pays zone pays Exclus -->
<div id="modalZoneExclus" class="modal">
<div class="modal-content center-align">
<div class="row">
<h5>Liste des pays exclus</h5>
<hr>
</div>
<div class="row">
<img src="/images/zone7.png" alt="Liste zone 7" id="imgZone7" style="width:80%;">
</div>
</div>
<div class="modal-footer">
<a class="modal-close waves-effect waves-green btn-flat">Fermer</a>
</div>
</div>
<!-- Modal Animaux Vivants -->
<div id="modalAnimauxVivants" class="modal">
<div class="modal-content center-align">
<div class="row">
<h5 style="color: darkblue;">! Alerte importante !</h5>
<hr>
</div>
<div class="row">
<h6>Vous devez faire une <strong>demande de dépassement de pouvoirs</strong> pour pouvoir garantir <strong>les animaux vivants</strong> pour des capitaux supérieurs à <strong>200 000 €</strong>.</h6>
</div>
<div class="row">
<h6 class="red-text text-darken-4">Veuillez cliquer sur <strong>« Demande PASS »</strong> pour faire la demande sur l'outil <strong>« PASS »</strong></h6>
<br>
<button id="depassementAnimaux" class="btn" style="background-color: darkblue;"
onclick="window.open('https://ajir.axa-fr.intraxa/secure/RapidBoard.jspa?rapidView=24786&projectKey=ASIARD&quickFilter=47050', '_blank');">
Demande PASS
</button>
</div>
</div>
<div class="modal-footer">
<a class="modal-close waves-effect waves-green btn-flat">Fermer</a>
</div>
</div>
<!-- Modal Transport de Béton -->
<div id="modalTransportBeton" class="modal">
<div class="modal-content center-align">
<div class="row">
<h5 style="color: darkblue;">! Alerte importante !</h5>
<hr>
</div>
<div class="row">
<h6>Les marchandises <strong>"Transport de béton"</strong> sont exclues des garanties <strong>RCE</strong></h6>
</div>
</div>
<div class="modal-footer">
<a class="modal-close waves-effect waves-green btn-flat">Fermer</a>
</div>
</div>
<!-- Modal Autocariste RCE -->
<div id="modalAutocaristeRCE" class="modal">
<div class="modal-content center-align">
<div class="row">
<h5 style="color: darkblue;">! Alerte importante !</h5>
<hr>
</div>
<div class="row">
<h6>Pas d'<strong>Autres RC</strong> pour les activités d'<strong>Autocariste</strong></h6>
</div>
</div>
<div class="modal-footer">
<a class="modal-close waves-effect waves-green btn-flat">Fermer</a>
</div>
</div>
<!-- Modal Tarif Commercial -->
<div id="modalTarifCom" class="modal">
<div class="modal-content">
<div class="mrg row" style="margin-top: 2rem;">
<p id="tarifRefText" style="font-size: 2rem; color: darkblue; text-align: center;">Tarif de Référence : 0.00€</p>
<div id="qualiteDiv" style="display: none; text-align: center;">
<span class="material-icons" id="modalTarifCom-icon" style="font-size: 4rem;">
mood_bad
</span>
<p id="qualitePrime" style="font-size: 1.5rem; font-weight: bold;"></p>
</div>
<h6 class="red-text text-darken-4" style="text-align: center;">Veuillez renseigner un tarif commercial</h6>
<div style="display: flex; justify-content: center; margin-top: 2rem;">
<div>
<label for="tarifCom" class="left">Tarif Commercial (€)</label>
<div class="input-field" style="width: 20rem;">
<input id="tarifCom" type="number" step="0.01" placeholder="Ex: 1500">
<span id="tarifCom-error" class="helper-text red-text" style="display: none;">
Merci d'ajouter un commentaire explicatif pour justifier cette différence ou modifier le tarif commercial
</span>
</div>
</div>
</div>
</div>
<div id="col-commentaire" style="display: none; justify-content: center;">
<div style="width: 40rem;">
<label for="commentaire">Commentaire explicatif</label>
<input id="commentaire" name="commentaire" placeholder="Commentaires" value="">
<span id="commentaire-error" class="helper-text red-text"></span>
</div>
</div>
</div>
<div class="modal-footer">
<button id="comm-OK" class="waves-effect waves-light btn indigo darken-4">Valider</button>
<button id="comm-cancel" class="modal-close waves-effect waves-light btn red darken-1">Annuler</button>
</div>
</div>