personnal/ecole/views/tarifformtppc.ejs

700 lines
31 KiB
Plaintext

<form id="tarifFormTPPC">
<h5>
Formulaire de tarification TPPC
</h5>
<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 tarif</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>
<div class="header">
<div class="chapter">
<i class="material-icons">group</i><span style="margin-left: 10px;">Informations sur le client
:</span>
</div>
<div class="row">
<h6 class="red-text text-darken-4">Veuillez renseigner les informations sur l'entreprise
ci-dessous :</h6>
</div>
</div>
<div class="row" id="row-typeContrat">
<div class="subdiv">
<label>Type de contrat :</label>
</div>
<label>
<input name="typeContrat" id="cotisationDetaillee" type="radio" value="detaillee" checked />
<span>Cotisation détaillée par type de véhicule</span>
</label>
<label>
<input name="typeContrat" id="cotisationEnsemble" type="radio" value="ensemble" />
<span>Cotisation forfaitaire pour l'ensemble des véhicules</span>
</label>
</div>
<div class="mrg padding-bottom grille-flex">
<div id="col-activite">
<label for="activite" class="left">Activité de l'assuré</label>
<div class="input-field" style="margin : 0">
<input id="activite" class="autocomplete" type="text" placeholder="Ex: Fabricant">
</div>
<span id="activite-error" class="helper-text red-text"></span>
<div class="chip modulo " id="chip-modulo-activite" style="display: none;">
Mod. activité : x2
</div>
</div>
<div id="col-flotte">
<label for="flotte" class="left">Nombre de véhicules assurés</label>
<div class="input-field" style="margin : 0">
<input id="flotte" type="number" placeholder="Ex: 3">
</div>
<span id="flotte-error" class="helper-text red-text"></span>
<div class="chip modulo" id="chip-modulo-flotte" style="display: none;">
Mod. flotte : x2
</div>
</div>
<div id="col-capitalVehicule">
<label for="capitalVehicule" class="left">Capital à garantir par véhicule</label>
<input id="capitalVehicule" type="number" placeholder="Ex: 100">
<span id="capitalVehicule-error" class="helper-text red-text"></span>
</div>
<div id="col-marAssuree">
<div class="left-align">
<label>Marchandise assurée</label>
</div>
<div class="input-field">
<div id="selected-mar">
<div class="chip select-chip" id="marOrdinaires-chip">Ordinaires</div>
<div class="chip select-chip" id="marBennes-chip">Bennes</div>
<div class="chip select-chip" id="marDenreesHorsTemp-chip">Denrées périssables hors température
dirigée</div>
<div class="chip select-chip" id="marAuto-chip">Véhicules automobiles</div>
<div class="chip select-chip" id="marRisques-chip">Risques exclus et réservés</div>
<div class="chip select-chip" id="marEngins-chip">Engins</div>
<div class="chip select-chip" id="marCiternes-chip">Citernes</div>
<div class="chip select-chip" id="marAnimaux-chip">Animaux Vivants</div>
<div class="chip select-chip" id="marDenreesSousTemp-chip">Denrées périssables sous température
dirigée</div>
<div class="chip select-chip" id="marEnExpo-chip">Marchandises en Exposition</div>
</div>
<select multiple id="marAssuree" name="marAssuree">
<option value="" disabled selected>Marchandise assurée:</option>
</select>
</div>
<div class="chip modulo " id="chip-modulo-marAssuree" style="display: none;">
Mod. marchandise : x2
</div>
</div>
<div id="col-garSouhaitees">
<div class="subdiv">
<div style="display: flex;justify-content: space-between; align-items: flex-end;">
<label>Garanties souhaitées</label>
<a class="waves-effect waves-light btn grille-garanties" id="bouton-grille">
<i class="material-icons">grid_on</i>
</a>
</div>
<hr />
</div>
<div style="display: flex; justify-content: space-between;">
<label>
<input type="checkbox" id="garSouhaitees-IAC" name="garSouhaitees" class="filled-in" value="IAC"
checked disabled />
<span id="garSouhaitees-IAC-text">Garantie IAC</span>
</label>
<label>
<input type="checkbox" id="garSouhaitees-HIAC" name="garSouhaitees" class="filled-in"
value="HIAC" />
<span id="garSouhaitees-HIAC-text">Garantie HIAC</span>
</label>
<label>
<input type="checkbox" id="garSouhaitees-vol" name="garSouhaitees" class="filled-in"
value="Vol" />
<span id="garSouhaitees-IAC-vol">Garantie Vol</span>
</label>
</div>
<span id="garSouhaitees-error" class="helper-text"></span>
</div>
</div>
<div class="row" id="row-tarification-vehicules">
<div>
<div class="row">
<h6 class="red-text text-darken-4">Veuillez lister les types de véhicules :</h6>
<span class="red-text" id="message-BenneTousRisques" style="display: none;">
Vous ne pouvez pas choisir la garantie tous risques avec le type de véhicule Benne <u>OU</u> type de marchandise Bennes
</span>
</div>
<div class="card">
<table id="empTableTarifVehicules">
<tr id="header">
<th>Type de véhicule</th>
<th>Capital par véhicule</th>
<th>Garanties souscrites</th>
<th>Type de Marchandise</th>
<th>Nombre de véhicules</th>
<th>Prime par véhicule (€)</th>
<th>Prime totale (€)</th>
<th></th>
<th></th>
</tr>
<tr id="inputRow" name="tarifRow">
<td id="td-typeVehTarif">
<input name="typeVehTarif" id="typeVehTarif" placeholder="Ex: Voiture" />
</td>
<td><input type="number" name="capitalTarif" id="capitalTarif" min="0" placeholder="Ex: 5000" />
</td>
<td> <select id="garTarif" name="garTarif">
<option value="" disabled selected>Garanties souscrites:
</option>
<option value="IAC">IAC</option>
<option value="IAC+HIAC">IAC + Hors IAC</option>
<option value="IAC+Vol">IAC + Vol</option>
<option value="IAC+HIAC+Vol">IAC + hors IAC + Vol</option>
</select>
</td>
<td id="td-typeMarTarif">
<select id="typeMarTarif" name="typeMarTarif">
<option value="" disabled selected>Type de marchandise:
</option>
</select>
</td>
<td>
<input type="number" name="nbVehiculesTarif" id="nbVehiculesTarif"
placeholder="Ex: 2" min="0" value="0" />
</td>
<td>
<input type="number" name="primeVehTarif" id="primeVehTarif" min="0" placeholder="Ex: 300" />
</td>
<td>
<input type="number" name="primeHTTarif" id="primeHTTarif" min="0" placeholder="Ex: 600" />
</td>
<td>
<div class="chip modulo" name="moduloTarif" id="modulo-mar-tarif-0"
style="display : none">
Mod. Marchandise : x2
</div>
<input type="number" name="modulo" id="modulo" disabled style="display : none" />
</td>
<td><button class="btn" type="button" id="btnAddTypeVehicule">
<i class="material-icons">add</i></button></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div id="col-sinistre">
<div class="chapter">
<i class="material-icons">time_to_leave</i>
<span style="margin-left: 10px;">Montant de sinistres annuels</span>
</div>
<h6 class="red-text text-darken-4">Veuillez renseigner le montant de sinistres annuels : </h6>
<div class="subdiv">
<label>Montant de sinistres annuels</label>
</div>
<div class="mrg grille-flex">
<div>
<label for="sinistre" class="left"></label>
<input id="sinistre" type="number" placeholder="Ex: 100">
<span id="sinistre-error" class="helper-text red-text"></span>
<div class="chip modulo " id="chip-modulo-sinistre" style="display : none">
Mod. sinistre : x2
</div>
</div>
</div>
</div>
<div class="row">
<div class="col s12 m4" id="card-tarif-par-vehicule">
<div class="card indigo darken-4 tarif-card">
<div class="card-content white-text">
<p>Tarif de base par véhicule (hors modulations) :</p>
<p class="tarif-module" id="tarif-par-vehicule">
0 €
</p>
</div>
</div>
</div>
<div class="col s12 m4" id="card-tarif-total-vehicule">
<div class="card indigo darken-4 tarif-card">
<div class="card-content white-text">
<p>Tarif de base pour l'ensemble des véhicules (hors modulations) :</p>
<p class="tarif-module" id="tarif-total-vehicule">
0 €
</p>
</div>
</div>
</div>
<div class="col s12 m4" id="card-nbr-vehicule">
<div class="card indigo darken-4 tarif-card">
<div class="card-content white-text">
<p>Tarif modulé en fonction du nombre de véhicule avant application franchise :</p>
<p class="tarif-module" id="tarif-nbr-vehicule">
0 €
</p>
</div>
</div>
</div>
<div class="col s12 m4" id="card-tarif-mod-mar">
<div class="card indigo darken-4 tarif-card">
<div class="card-content white-text">
<p>Tarif incluant la modulation marchandises :</p>
<p class="tarif-module" id="tarif-mod-mar">
0 €
</p>
</div>
</div>
</div>
<div class="col s12 m4" id="card-tarif-mod">
<div class="card indigo darken-4 tarif-card">
<div class="card-content white-text">
<p>Tarif modulé avant application franchise :</p>
<p class="tarif-module" id="tarif-mod">
0 €
</p>
</div>
</div>
</div>
</div>
<div class="row">
<div class="chapter">
<i class="material-icons">check_box</i>
<span style="margin-left: 10px;">Garanties additionnelles</span>
</div>
<h6 class="red-text text-darken-4">Veuillez renseigner les garanties additionnelles du contrat :
</h6>
<div class="col s12 m4 garAdd">
<div class="card">
<div class="card-title">
<label>
<input type="checkbox" id="marEnExpo" />
<span>Marchandises en Exposition</span>
</label>
</div>
<div class="card-content" id="marEnExpo-div" style="display: none">
<hr />
<div class="subdiv left-align">
<label class="left">Nombre d'expositions</label>
</div>
<input id="nombreExposition" name="nombreExposition" type="number" value="" placeholder="Ex : 3">
<span class="helper-text"></span>
<div class="subdiv left-align">
<label class="left">Capital à assurer</label>
</div>
<input id="capitalExposition" name="capitalExposition" type="number" value=""
placeholder="Ex: 100">
<span class="helper-text"></span>
<div class="subdiv left-align" style="width: 100%;">
<label>Type de Marchandises</label>
<hr />
</div>
<select id="typeMarEnExp" name="typeMar">
<option value="" disabled selected>Type de Marchandise:</option>
</select>
</div>
</div>
</div>
</div>
<div class="row" id="row-propositions">
<div class="header">
<div class="chapter">
<i class="material-icons">credit_card</i>
<span style="margin-left: 10px;">Propositions tarifaires (Hors taxes)</span>
</div>
<h6 class="red-text text-darken-4">Veuillez sélectionner la proposition tarifaire adaptée :
</h6>
<div class="row" id="propositions" style="display : none">
<div class="col s12 m3">
<div class="franchise-card card border" id="150">
<div class="red darken-3 white-text card-tarif-head">
<div class="card-tarif-head-content">
<span>Franchise 150€</span> <br/>
<span class="price" id="proposition-150">0.00€</span>
</div>
</div>
<div class="card-content no-padding txt-color">
<p id="mod-activite-150">Modulation Activité : +0%</p>
<p id="mod-marchandise-150">Modulation Marchandise : 0%</p>
<p id="mod-ca-150">Modulation Flotte : 0%</p>
<p id="mod-franchise-150">Modulation Franchise : 0%</p>
<p id="prime-vehicule-150">Prime par véhicule : 0€</p>
</div>
<div class="card-action">
<button class="btn" type="submit" name="150">Choisir</button>
</div>
</div>
</div>
<div class="col s12 m3">
<div class="franchise-card card border" id="300">
<div class="card-tarif-head card-tarif-head-content orange darken-4 white-text">
<div class="card-tarif-head-content">
<span>Franchise 300€</span> <br/>
<span class="price" id="proposition-300">0.00€</span>
</div>
</div>
<div class="card-content no-padding txt-color">
<p id="mod-activite-300">Modulation Activité : +0%</p>
<p id="mod-marchandise-300">Modulation Marchandise : 0%</p>
<p id="mod-ca-300">Modulation Flotte : 0%</p>
<p id="mod-franchise-300">Modulation Franchise : 0%</p>
<p id="prime-vehicule-300">Prime par véhicule : 0€</p>
</div>
<div class="card-action">
<button class="btn" type="submit" name="300">Choisir</button>
</div>
</div>
</div>
<div class="col s12 m3">
<div class="franchise-card card border" id="mini150">
<div class="yellow darken-3 white-text card-tarif-head">
<div class="card-tarif-head-content">
<span>5% avec mini 150 € et maxi 1000 €</span> <br/>
<span class="price" id="proposition-mini150">0.00€</span>
</div>
</div>
<div class="card-content no-padding txt-color">
<p id="mod-activite-mini150">Modulation Activité : 0%</p>
<p id="mod-marchandise-mini150">Modulation Marchandise : 0%</p>
<p id="mod-ca-mini150">Modulation Flotte : 0%</p>
<p id="mod-franchise-mini150">Modulation Franchise : 0%</p>
<p id="prime-vehicule-mini150">Prime par véhicule : 0€</p>
</div>
<div class="card-action">
<button class="btn" type="submit" name="mini150">Choisir</button>
</div>
</div>
</div>
<div class="col s12 m3">
<div class="franchise-card card border" id="mini300">
<div class="green darken-3 white-text card-tarif-head">
<div class="card-tarif-head-content">
<span>10% avec mini 300 € et maxi 2000 €</span> <br/>
<span class="price" id="proposition-mini300">0.00€</span>
</div>
</div>
<div class="card-content no-padding txt-color">
<p id="mod-activite-mini300">Modulation Activité : 0%</p>
<p id="mod-marchandise-mini300">Modulation Marchandise : 0%</p>
<p id="mod-ca-mini300">Modulation Flotte : 0%</p>
<p id="mod-franchise-mini300">Modulation Franchise : 0%</p>
<p id="prime-vehicule-mini300">Prime par véhicule : 0€</p>
</div>
<div class="card-action">
<button class="btn" type="submit" name="mini300">Choisir</b>
</div>
</div>
</div>
</div>
</div>
<div id="row-champsManquants">
<p class="red-text">
Veuillez renseigner les champs manquants :
</p>
<div>
<div class="chip" id="chip-act">Activité</div>
<div class="chip" id="chip-sinistre">Montant de Sinistres Annuels</div>
<div class="chip" id="chip-marAssuree">Marchandise assurée</div>
</div>
</div>
</div>
</form>
<!-- MODAL Commentaires -->
<div id="modalTarifCom" class="modal">
<div class="modal-content">
<div class="mrg row" style="margin-top: 2rem;">
<p id="tarifRefText" style="font-size: 2rem">Tarif de Référence : 00.00€</p>
<div id="qualiteDiv" style="display: none;">
<span class="material-icons" id="modalTarifCom-icon">
mood_bad
</span>
<p id="qualitePrime">99.99%</p>
</div>
<h6 class="red-text text-darken-4"> 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" 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">
<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>
<!-- Modal Animaux Vivants -->
<div id="modalAnimauxVivants" class="modal">
<div class="modal-content center-align">
<div class="row">
<h5>Demande PASS animaux vivants :</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></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 »</h6>
<br>
<button id="depassement" class="btn"
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>
<div id="modalGrille" class="modal">
<div class="modal-content">
<h4>Grille tarifaire TPPC</h4>
<div style="overflow:auto;">
<table class="striped centred responsive-table">
<thead>
<tr>
<th>Montant Garanti</th>
<th>IAC</th>
<th>HIAC</th>
<th>IAC + HIAC</th>
<th>VOL</th>
<th>IAC + VOL</th>
<th>TOUS RISQUES</th>
</tr>
</thead>
<tbody id="bodyGrilleCotisation">
<tr>
<td>3000 €</td>
<td>48 €</td>
<td>24 €</td>
<td>72 €</td>
<td>48 €</td>
<td>96 €</td>
<td>120 €</td>
</tr>
<tr>
<td>5000 €</td>
<td>60 €</td>
<td>30 €</td>
<td>90 €</td>
<td>60 €</td>
<td>120 €</td>
<td>150 €</td>
</tr>
<tr>
<td>10000 €</td>
<td>84 €</td>
<td>42 €</td>
<td>126 €</td>
<td>84 €</td>
<td>168 €</td>
<td>210 €</td>
</tr>
<tr>
<td>15000 €</td>
<td>100 €</td>
<td>50 €</td>
<td>150 €</td>
<td>100 €</td>
<td>200 €</td>
<td>250 €</td>
</tr>
<tr>
<td>20000 €</td>
<td>124 €</td>
<td>62 €</td>
<td>186 €</td>
<td>124 €</td>
<td>248 €</td>
<td>310 €</td>
</tr>
<tr>
<td>25000 €</td>
<td>152 €</td>
<td>76 €</td>
<td>228 €</td>
<td>152 €</td>
<td>304 €</td>
<td>380 €</td>
</tr>
<tr>
<td>30000 €</td>
<td>166 €</td>
<td>83 €</td>
<td>249 €</td>
<td>166 €</td>
<td>332 €</td>
<td>415 €</td>
</tr>
<tr>
<td>35000 €</td>
<td>200 €</td>
<td>100 €</td>
<td>300 €</td>
<td>200 €</td>
<td>400 €</td>
<td>500 €</td>
</tr>
<tr>
<td>40000 €</td>
<td>220 €</td>
<td>110 €</td>
<td>330 €</td>
<td>220 €</td>
<td>440 €</td>
<td>550 €</td>
</tr>
<tr>
<td>45000 €</td>
<td>240 €</td>
<td>120 €</td>
<td>360 €</td>
<td>240 €</td>
<td>480 €</td>
<td>600 €</td>
</tr>
<tr>
<td>50000 €</td>
<td>252 €</td>
<td>126 €</td>
<td>378 €</td>
<td>252 €</td>
<td>504 €</td>
<td>630 €</td>
</tr>
<tr>
<td>60000 €</td>
<td>300 €</td>
<td>150 €</td>
<td>450 €</td>
<td>300 €</td>
<td>600 €</td>
<td>750 €</td>
</tr>
<tr>
<td>70000 €</td>
<td>332 €</td>
<td>166 €</td>
<td>498 €</td>
<td>332 €</td>
<td>664 €</td>
<td>830 €</td>
</tr>
<tr>
<td>80000 €</td>
<td>356 €</td>
<td>178 €</td>
<td>534 €</td>
<td>356 €</td>
<td>712 €</td>
<td>890 €</td>
</tr>
<tr>
<td>90000 €</td>
<td>376 €</td>
<td>188 €</td>
<td>564 €</td>
<td>376 €</td>
<td>752 €</td>
<td>940 €</td>
</tr>
<tr>
<td>100000 €</td>
<td>400 €</td>
<td>200 €</td>
<td>600 €</td>
<td>400 €</td>
<td>800 €</td>
<td>1000 €</td>
</tr>
<tr>
<td>150000 €</td>
<td>420 €</td>
<td>210 €</td>
<td>630 €</td>
<td>420 €</td>
<td>840 €</td>
<td>1050 €</td>
</tr>
<tr>
<td>200000 €</td>
<td>432 €</td>
<td>216 €</td>
<td>648 €</td>
<td>432 €</td>
<td>864 €</td>
<td>1080 €</td>
</tr>
<tr>
<td>250000 €</td>
<td>444 €</td>
<td>222 €</td>
<td>666 €</td>
<td>444 €</td>
<td>888 €</td>
<td>1110 €</td>
</tr>
<tr>
<td>300000 €</td>
<td>456 €</td>
<td>228 €</td>
<td>684 €</td>
<td>456 €</td>
<td>912 €</td>
<td>1140 €</td>
</tr>
<tr></tr>
</tbody>
</table>
</div>
</div>
</div>