backoffice/application/views/tuto.php

520 lines
71 KiB
PHP
Raw Permalink Normal View History

2022-04-18 11:39:19 +00:00
<?php defined('BASEPATH') OR exit('No direct script access allowed'); ?>
<!doctype html>
<!--[if lt IE 7 ]> <html lang="en" class="ie6"> <![endif]-->
<!--[if IE 7 ]> <html lang="en" class="ie7"> <![endif]-->
<!--[if IE 8 ]> <html lang="en" class="ie8"> <![endif]-->
<!--[if IE 9 ]> <html lang="en" class="ie9"> <![endif]-->
<!--[if !IE]><!--> <html lang="en"> <!--<![endif]-->
<head>
<meta name="viewport" content="width = 1050, user-scalable = no" />
<script type="text/javascript" src="<?= base_url('bower_components/jquery/dist/jquery.min.js') ?>"></script>
<script type="text/javascript" src="<?= base_url('dist/js/modernizr.2.5.3.min.js') ?>"></script>
</head>
<body>
<div class="flipbook-viewport">
<div class="container">
<?php
if($profil==1){
?>
<div class="flipbook" >
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="<?= base_url('turnjs/super/background1.jpg')?>" width=595 height=841>
</div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">1</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:197.81px;top:556.31px" class="cls_004"><span class="cls_004">iLink World Corporation</span></div>
<div style="position:absolute;left:166.10px;top:594.98px" class="cls_005"><span class="cls_005">Mode demploi pour lutilisation du backoffice</span></div>
<div style="position:absolute;left:188.21px;top:624.62px" class="cls_006"><span class="cls_006">Liens : </span>https://ilink-app.com/backofficebeta/</span></div>
</div>
</div>
<div class="hard"></div>
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="<?= base_url('turnjs/super/background2.jpg')?>" width=595 height=841>
</div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">2</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:129.02px;top:380.51px" class="cls_008"><span class="cls_008">SUPERVISEUR</span></div>
</div>
</div>
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:20px;right:20px;top:100px">
<img src="<?= base_url('turnjs/super/login-ilink.PNG')?>" width=500 height=290></div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">3</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:268.37px;top:75.78px" class="cls_006"><span class="cls_006">I-Connexion</span></div>
<div style="position:absolute;left:251.69px;top:394.53px" class="cls_014"><span class="cls_014">Figure 1 : Interface Login</span></div>
<div style="position:absolute;left:70.82px;top:445.91px" class="cls_002"><span class="cls_002">Première interface du backoffice, le Superviseur est appelé à saisir :</span></div>
<div style="position:absolute;left:88.82px;top:471.83px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Son code parrain</span></div>
<div style="position:absolute;left:88.82px;top:487.91px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Son mot de passe</span></div>
<div style="position:absolute;left:88.82px;top:503.87px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Sassurer que le dernier champ soit à « </span><span class="cls_003">Agent</span><span class="cls_002"> ».</span></div>
<div style="position:absolute;left:70.82px;top:529.31px" class="cls_002"><span class="cls_002">Au coin supérieur gauche, les différents drapeaux désignent les langues disponibles pour le</span></div>
<div style="position:absolute;left:70.82px;top:544.79px" class="cls_002"><span class="cls_002">backoffice. Pour changer de langue, il suffit de cliquer sur le drapeau correspondant (notons que par</span></div>
<div style="position:absolute;left:70.82px;top:560.27px" class="cls_002"><span class="cls_002">défaut, le backoffice saffiche dans la langue utilisée par le navigateur)͘</span></div>
<div style="position:absolute;left:70.82px;top:636.62px" class="cls_002"><span class="cls_002">Le lien </span><span class="cls_003">mot de passe oublié</span><span class="cls_002"> est uniquement réservé aux administrateurs.</span></div>
</div>
</div>
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:20px;right:20px;top:150px">
<img src="<?= base_url('turnjs/super/super_dash.PNG')?>" width=500 height=290>
</div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">4</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:245.57px;top:75.78px" class="cls_005"><span class="cls_005">II-Tableau de bord</span></div>
<div style="position:absolute;left:70.82px;top:120.74px" class="cls_002"><span class="cls_002">Après connexion, le Superviseur est redirigé vers son tableau de bord.</span></div>
<div style="position:absolute;left:225.89px;top:444.35px" class="cls_009"><span class="cls_009">Figure 2 : Tableau de bord Superviseur</span></div>
<div style="position:absolute;left:70.82px;top:465.23px" class="cls_002"><span class="cls_002">Le tableau de bord Superviseur présente :</span></div>
<div style="position:absolute;left:88.82px;top:491.15px" class="cls_011"><span class="cls_011">-></span><span class="cls_012"> </span><span class="cls_002"> Le nombre dutilisateurs géolocalisés</span></div>
<div style="position:absolute;left:88.82px;top:507.11px" class="cls_011"><span class="cls_011">-></span><span class="cls_012"> </span><span class="cls_002"> Le nombre de demandes de crédits</span></div>
<div style="position:absolute;left:88.82px;top:523.19px" class="cls_011"><span class="cls_011">-></span><span class="cls_012"> </span><span class="cls_002"> Le nombre de demandes de crédits traitées et celui des demandes non traités.</span></div>
<div style="position:absolute;left:88.82px;top:539.27px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Le diagramme </span><span class="cls_003">Adhésion</span><span class="cls_002"> montre le nombre dadhésion (adhésions en orange et demandes</span></div>
<div style="position:absolute;left:106.82px;top:554.63px" class="cls_002"><span class="cls_002">de crédits en bleu) des 12 derniers mois.</span></div>
<div style="position:absolute;left:88.82px;top:570.71px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Le diagramme </span><span class="cls_003">Adhésion par mois sur une année</span><span class="cls_002"> fait le découpage des adhésions par mois</span></div>
<div style="position:absolute;left:106.82px;top:586.10px" class="cls_002"><span class="cls_002">sur lannée en cours͘</span></div>
<div style="position:absolute;left:88.82px;top:602.18px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Le diagramme </span><span class="cls_003">Demande de crédits par utilisateurs</span><span class="cls_002"> montre le nombre de demande de crédit</span></div>
<div style="position:absolute;left:106.82px;top:617.78px" class="cls_002"><span class="cls_002">par utilisateur simple.</span></div>
<div style="position:absolute;left:70.82px;top:643.22px" class="cls_002"><span class="cls_002">Le menu de gauche se compose de 3 onglets:</span></div>
<div style="position:absolute;left:88.82px;top:669.14px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Tableau de bord</span><span class="cls_002"> : pour le tableau de bord</span></div>
<div style="position:absolute;left:88.82px;top:685.10px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Utilisateurs géolocalisés</span><span class="cls_002"> : pour consulter les informations sur les utilisateurs géolocalisés</span></div>
<div style="position:absolute;left:88.82px;top:701.18px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Demandes de crédits</span><span class="cls_002"> : pour consulter les informations sur les demandes de crédits.</span></div>
</div>
</div>
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:20px;right:20px;top:95px">
<img src="<?= base_url('turnjs/super/geolocated_super.PNG')?>" width=500 height=290></div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">5</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:238.13px;top:75.78px" class="cls_002"><span class="cls_002">III-Utilisateurs géolocalisés</span></div>
<div style="position:absolute;left:234.41px;top:398.97px" class="cls_009"><span class="cls_009">Figure 3 : Utilisateurs géolocalisés</span></div>
<div style="position:absolute;left:70.82px;top:445.19px" class="cls_002"><span class="cls_002">Le Superviseur dispose dune carte sur laquelle sont marquées les positions de ses points géolocalisés</span></div>
<div style="position:absolute;left:70.82px;top:460.67px" class="cls_002"><span class="cls_002">et dun tableau avec les informations suivantes :</span></div>
<div style="position:absolute;left:88.82px;top:486.59px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Catégorie</span><span class="cls_002"> : pour la catégorie de lutilisateur (qui sera toujours </span><span class="cls_003">geolocated</span><span class="cls_002"> pour des</span></div>
<div style="position:absolute;left:106.82px;top:502.07px" class="cls_002"><span class="cls_002">utilisateurs géolocalisés).</span></div>
<div style="position:absolute;left:88.82px;top:518.03px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Parrain</span><span class="cls_002"> : en cliquant sur le parrain une fenêtre dinformation présente les informations</span></div>
<div style="position:absolute;left:106.82px;top:533.51px" class="cls_002"><span class="cls_002">supplémentaires.</span></div>
<div style="position:absolute;left:88.82px;top:549.59px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Nom</span><span class="cls_002"> : le nom ou lenseigne du point géolocalisé͘</span></div>
<div style="position:absolute;left:88.82px;top:565.55px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Adresse</span><span class="cls_002"> : ladresse physique du point géolocalisé͘</span></div>
<div style="position:absolute;left:88.82px;top:581.66px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Réseau</span><span class="cls_002"> : le réseau courant.</span></div>
<div style="position:absolute;left:88.82px;top:597.62px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Code</span><span class="cls_002"> </span><span class="cls_003">membre</span><span class="cls_002"> : le code membre point géolocalisé.</span></div>
<div style="position:absolute;left:88.82px;top:613.70px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Email</span><span class="cls_002"> : lemail de la structure͘</span></div>
<div style="position:absolute;left:88.82px;top:629.78px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Contact</span><span class="cls_002"> : le numéro de téléphone dappel du point géolocalisé͘</span></div>
<div style="position:absolute;left:88.82px;top:645.74px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Active</span><span class="cls_002"> : Oui si le compte est activé, Non sinon.</span></div>
</div>
</div>
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:20px;right:20px;top:95px">
<img src="<?= base_url('turnjs/super/demande_super.PNG')?>" width=500 height=290>
</div>
<div style="position:absolute;left:20px;right:20px;top:570px">
<img src="<?= base_url('turnjs/super/deconnexion.PNG')?>" width=300 height=100>
</div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">6</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:250.61px;top:75.78px" class="cls_002"><span class="cls_002">Demandes de crédits</span></div>
<div style="position:absolute;left:240.29px;top:386.97px" class="cls_009"><span class="cls_009">Figure 4 : Demandes de crédits</span></div>
<div style="position:absolute;left:70.82px;top:407.85px" class="cls_002"><span class="cls_002">Le superviseur dispose des informations suivantes :</span></div>
<div style="position:absolute;left:88.82px;top:433.79px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Le </span><span class="cls_003">temps moyen de traitement</span><span class="cls_002"> des demandes quil reçoit͘</span></div>
<div style="position:absolute;left:88.82px;top:449.87px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Le</span><span class="cls_003"> temps moyen de traitement</span><span class="cls_002"> des demandes quil effectue͘</span></div>
<div style="position:absolute;left:88.82px;top:465.83px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Deux tableaux listant chacun un type de demande.</span></div>
<div style="position:absolute;left:88.82px;top:481.91px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Des tableaux montrant les 5 demandes entrantes/sortantes les plus rapidement/tardivement</span></div>
<div style="position:absolute;left:106.82px;top:497.39px" class="cls_002"><span class="cls_002">traités.</span></div>
<div style="position:absolute;left:268.37px;top:524.39px" class="cls_002"><span class="cls_002">Déconnexion</span></div>
<div style="position:absolute;left:255.41px;top:702.98px" class="cls_009"><span class="cls_009">Figure 5 : déconnexion</span></div>
<div style="position:absolute;left:70.82px;top:723.74px" class="cls_002"><span class="cls_002">Pour se déconnecter, le Superviseur clique sur son nom dutilisateur dans le coin supérieur droit pour</span></div>
<div style="position:absolute;left:70.82px;top:739.10px" class="cls_002"><span class="cls_002">faire apparaitre le menu de déconnexion lui présentant : Le réseau courant, son code parrain, son</span></div>
<div style="position:absolute;left:70.82px;top:754.72px" class="cls_002"><span class="cls_002">adresse email, son pays, son numéro de téléphone et </span><span class="cls_003">le bouton de déconnexion</span><span class="cls_002">.</span></div>
</div>
</div>
<div></div>
<div class="hard"></div>
</div>
<?php }elseif ($profil==2){ ?>
<div class="flipbook" style="position:relative">
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="<?= base_url('turnjs/Hyper/background1.jpg')?>" width=595 height=841></div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">1</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:197.81px;top:556.31px" class="cls_004"><span class="cls_004">iLink World Corporation</span></div>
<div style="position:absolute;left:166.10px;top:594.98px" class="cls_005"><span class="cls_005">Mode demploi pour lutilisation du backoffice</span></div>
<div style="position:absolute;left:188.21px;top:624.62px" class="cls_006"><span class="cls_006">Liens : </span><A HREF="https://ilink-app.com/backofficebeta/">https://ilink-app.com/backofficebeta/</A> </span></div>
</div>
</div>
<div class="hard"></div>
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="<?= base_url('turnjs/Hyper/background2.jpg')?>" width=595 height=841>
</div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">2</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:125px;top:380.51px" class="cls_008"><span class="cls_008">HYPERVISEUR</span></div>
</div>
</div>
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:20px;right:20px;top:100px">
<img src="<?= base_url('turnjs/super/login-ilink.PNG')?>" width=500 height=290></div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">3</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:268.37px;top:75.78px" class="cls_006"><span class="cls_006">I-Connexion</span></div>
<div style="position:absolute;left:251.69px;top:394.53px" class="cls_017"><span class="cls_017">Figure 1 : Interface Login</span></div>
<div style="position:absolute;left:70.82px;top:445.91px" class="cls_002"><span class="cls_002">Première interface du backoffice, lHyperviseur est appelé à saisir :</span></div>
<div style="position:absolute;left:88.82px;top:471.83px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Son code parrain</span></div>
<div style="position:absolute;left:88.82px;top:487.91px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Son mot de passe</span></div>
<div style="position:absolute;left:88.82px;top:503.87px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Sassurer que le dernier champ soit à « </span><span class="cls_003">Agent</span><span class="cls_002"> ».</span></div>
<div style="position:absolute;left:70.82px;top:529.31px" class="cls_002"><span class="cls_002">Au coin supérieur gauche, les différents drapeaux désignent les langues disponibles pour le</span></div>
<div style="position:absolute;left:70.82px;top:544.79px" class="cls_002"><span class="cls_002">backoffice. Pour changer de langue, il suffit de cliquer sur le drapeau correspondant (notons que par</span></div>
<div style="position:absolute;left:70.82px;top:560.27px" class="cls_002"><span class="cls_002">défaut, le backoffice saffiche dans la langue utilisée par le navigateur)͘</span></div>
<div style="position:absolute;left:70.82px;top:636.62px" class="cls_002"><span class="cls_002">*Le lien </span><span class="cls_003">mot de passe oublié</span><span class="cls_002"> est uniquement réservé aux administrateurs.</span></div>
</div>
</div>
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:20px;right:20px;top:118px">
<img src="<?= base_url('turnjs/Hyper/dashbord_hyper.PNG')?>" width=500 height=290></div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">4</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:245.57px;top:75.78px" class="cls_005"><span class="cls_005">II-Tableau de bord</span></div>
<div style="position:absolute;left:70.82px;top:98.74px" class="cls_002"><span class="cls_002">Après connexion, lHyperviseur est redirigé vers son tableau de bord.</span></div>
<div style="position:absolute;left:225.41px;top:415.79px" class="cls_009"><span class="cls_009">Figure 2 : Tableau de bord Hyperviseur</span></div>
<div style="position:absolute;left:70.82px;top:436.67px" class="cls_002"><span class="cls_002">Le tableau de bord Hyperviseur présente :</span></div>
<div style="position:absolute;left:88.82px;top:462.59px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Le nombre dutilisateurs géolocalisés.</span></div>
<div style="position:absolute;left:88.82px;top:478.67px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Le nombre de superviseurs.</span></div>
<div style="position:absolute;left:88.82px;top:494.63px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Le nombre de demandes de crédits.</span></div>
<div style="position:absolute;left:88.82px;top:510.71px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Le nombre de demandes de crédits traitées et celui des demandes non traités.</span></div>
<div style="position:absolute;left:88.82px;top:526.79px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Le diagramme </span><span class="cls_003">Adhésion</span><span class="cls_002"> montre le nombre dadhésion (utilisateurs géolocalisés en orange et</span></div>
<div style="position:absolute;left:106.82px;top:542.15px" class="cls_002"><span class="cls_002">superviseurs en bleu) des 12 derniers mois.</span></div>
<div style="position:absolute;left:88.82px;top:558.23px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Le diagramme </span><span class="cls_003">Utilisateurs géolocalisés par ville</span><span class="cls_002"> fait la répartition des points géolocalisés par</span></div>
<div style="position:absolute;left:106.82px;top:573.59px" class="cls_002"><span class="cls_002">ville.</span></div>
<div style="position:absolute;left:88.82px;top:589.70px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Le diagramme </span><span class="cls_003">Demande de crédits par superviseurs</span><span class="cls_002"> montre le nombre de demande de</span></div>
<div style="position:absolute;left:106.82px;top:605.30px" class="cls_002"><span class="cls_002">crédit effectué par superviseur.</span></div>
<div style="position:absolute;left:70.82px;top:630.74px" class="cls_002"><span class="cls_002">Le menu de gauche se compose de 3 onglets :</span></div>
<div style="position:absolute;left:88.82px;top:656.66px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Tableau de bord</span><span class="cls_002"> : pour le tableau de bord</span></div>
<div style="position:absolute;left:88.82px;top:672.62px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Utilisateurs géolocalisés</span><span class="cls_002"> : pour consulter les informations sur les utilisateurs géolocalisés.</span></div>
<div style="position:absolute;left:88.82px;top:688.70px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Superviseurs </span><span class="cls_002">: pour consulter les informations sur les superviseurs.</span></div>
<div style="position:absolute;left:88.82px;top:704.66px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Demandes de crédits</span><span class="cls_002"> : pour consulter les informations sur les demandes de crédits.</span></div>
<div style="position:absolute;left:88.82px;top:720.74px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Demandes dadhésion </span><span class="cls_002">: pour consulter les informations sur les demandes dadhésion͘</span></div>
</div>
</div>
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:20px;right:20px;top:140px">
<img src="<?= base_url('turnjs/Hyper/geolocated_hyper.PNG')?>" width=500 height=280></div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">5</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:238.13px;top:75.78px" class="cls_002"><span class="cls_002">III-Utilisateurs géolocalisés</span></div>
<div style="position:absolute;left:70.82px;top:102.54px" class="cls_002"><span class="cls_002">En cliquant sur </span><span class="cls_003">Utilisateurs géolocaliés</span><span class="cls_002"> dans le menu de gauche, lhyperviseur est emmené à choisir</span></div>
<div style="position:absolute;left:70.82px;top:118.02px" class="cls_003"><span class="cls_003">la ville</span><span class="cls_002"> pour laquelle il désire consulter les informations des points géolocalisés.</span></div>
<div style="position:absolute;left:234.41px;top:427.61px" class="cls_009"><span class="cls_009">Figure 3 : Utilisateurs géolocalisés</span></div>
<div style="position:absolute;left:70.82px;top:453.83px" class="cls_002"><span class="cls_002">LHyperviseur dispose dune carte sur laquelle sont marquées les positions de points géolocalisés de</span></div>
<div style="position:absolute;left:70.82px;top:469.43px" class="cls_002"><span class="cls_002">son réseau et dun tableau avec les informations suivantes :</span></div>
<div style="position:absolute;left:88.82px;top:495.35px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Catégorie</span><span class="cls_002"> : pour la catégorie de lutilisateur (qui sera toujours </span><span class="cls_003">geolocated</span><span class="cls_002"> pour des</span></div>
<div style="position:absolute;left:106.82px;top:510.71px" class="cls_002"><span class="cls_002">utilisateurs géolocalisés).</span></div>
<div style="position:absolute;left:88.82px;top:526.79px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Parrain</span><span class="cls_002"> : code parrain du superviseur du point géolocalisé (en cliquant sur le parrain une</span></div>
<div style="position:absolute;left:106.82px;top:542.15px" class="cls_002"><span class="cls_002">fenêtre dinformation présente des informations supplémentaires sur le superviseur.)</span></div>
<div style="position:absolute;left:88.82px;top:558.23px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Nom</span><span class="cls_002"> : le nom ou lenseigne du point géolocalisé͘</span></div>
<div style="position:absolute;left:88.82px;top:574.31px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Adresse</span><span class="cls_002"> : ladresse physique du point géolocalisé͘</span></div>
<div style="position:absolute;left:88.82px;top:590.30px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Réseau</span><span class="cls_002"> : le réseau courant.</span></div>
<div style="position:absolute;left:88.82px;top:606.38px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Code</span><span class="cls_002"> </span><span class="cls_003">membre</span><span class="cls_002"> : le code membre point géolocalisé.</span></div>
<div style="position:absolute;left:88.82px;top:622.34px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Email</span><span class="cls_002"> : lemail de la structure͘</span></div>
<div style="position:absolute;left:88.82px;top:638.42px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Contact</span><span class="cls_002"> : le numéro de téléphone dappel du point géolocalisés.</span></div>
<div style="position:absolute;left:88.82px;top:654.38px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Active</span><span class="cls_002"> : Oui si le compte est activé, Non sinon.</span></div>
</div>
</div>
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:20px;right:20px;top:135px">
<img src="<?= base_url('turnjs/Hyper/Superviseur_hyper.PNG')?>" width=500 height=280></div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">6</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:263.21px;top:101.22px" class="cls_002"><span class="cls_002">III-Superviseurs</span></div>
<div style="position:absolute;left:255.53px;top:430.41px" class="cls_009"><span class="cls_009">Figure 4 : Superviseurs</span></div>
<div style="position:absolute;left:70.82px;top:470.63px" class="cls_002"><span class="cls_002">LHyperviseur dispose dune carte sur laquelle sont marquées les positions des superviseurs de son</span></div>
<div style="position:absolute;left:70.82px;top:480.23px" class="cls_002"><span class="cls_002">réseau et dun tableau avec les mêmes informations que celui des utilisateurs géolocalisés͘</span></div>
<div style="position:absolute;left:70.82px;top:510.67px" class="cls_002"><span class="cls_002">Notons que dans ce cas la catégorie est à Super.</span></div>
</div>
</div>
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:20px;right:20px;top:155px">
<img src="<?= base_url('turnjs/Hyper/demande_hyper.PNG')?>" width=500 height=280></div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">7</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:250.61px;top:75.78px" class="cls_002"><span class="cls_002">Demandes de crédits</span></div>
<div style="position:absolute;left:70.82px;top:107.98px" class="cls_002"><span class="cls_002">En cliquant sur </span><span class="cls_003">Demandes de crédits</span><span class="cls_002"> dans le menu de gauche, lhyperviseur est emmené ă</span></div>
<div style="position:absolute;left:70.82px;top:117.46px" class="cls_002"><span class="cls_002">sélectionner </span><span class="cls_003">le superviseur</span><span class="cls_002"> pour lequel il désire consulter les demandes de crédit.</span></div>
<div style="position:absolute;left:240.29px;top:440.07px" class="cls_009"><span class="cls_009">Figure 4 : Demandes de crédits</span></div>
<div style="position:absolute;left:70.82px;top:467.39px" class="cls_002"><span class="cls_002">LHyperviseur dispose des informations suivantes :</span></div>
<div style="position:absolute;left:88.82px;top:493.31px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Le</span><span class="cls_002"> </span><span class="cls_003">temps moyen de traitement</span><span class="cls_002"> des demandes quil reçoit͘</span></div>
<div style="position:absolute;left:88.82px;top:509.39px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Un tableau listant les </span><span class="cls_003">demandes quil reçoit</span><span class="cls_002"> avec leur </span><span class="cls_003">statut</span><span class="cls_002">, </span><span class="cls_015">la date et le délai de traitement</span><span class="cls_002">.</span></div>
<div style="position:absolute;left:88.82px;top:525.35px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Des tableaux montrant les </span><span class="cls_003">5 demandes</span><span class="cls_002"> les plus rapidement/tardivement traités.</span></div>
</div>
</div>
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:20px;right:20px;top:135px">
<img src="<?= base_url('turnjs/Hyper/adhesion_hyper.PNG')?>" width=500 height=280></div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">8</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:247.97px;top:75.78px" class="cls_002"><span class="cls_002">Demandes dadhésion</span></div>
<div style="position:absolute;left:70.82px;top:102.66px" class="cls_013"><span class="cls_013">Les demandes dadhésion sont celles des nouveaux superviseurs vers lhyperviseur.</span></div>
<div style="position:absolute;left:237.89px;top:405.13px" class="cls_009"><span class="cls_009">Figure 5 : Demandes dadhésion</span></div>
<div style="position:absolute;left:70.82px;top:444.47px" class="cls_002"><span class="cls_002">LHyperviseur dispose des informations suivantes :</span></div>
<div style="position:absolute;left:88.82px;top:470.39px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Le</span><span class="cls_002"> </span><span class="cls_003">temps moyen de traitement</span><span class="cls_002"> des demandes quil reçoit͘</span></div>
<div style="position:absolute;left:88.82px;top:486.47px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Un tableau listant les </span><span class="cls_003">demandes quil reçoit</span><span class="cls_002"> avec leur </span><span class="cls_003">statut</span><span class="cls_002">, </span><span class="cls_015">la date et le délai de traitement</span><span class="cls_002">.</span></div>
<div style="position:absolute;left:88.82px;top:502.43px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Des tableaux montrant les </span><span class="cls_003">5 demandes</span><span class="cls_002"> les plus rapidement/tardivement traités.</span></div>
</div>
</div>
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:20px;right:20px;top:110px">
<img src="<?= base_url('turnjs/Hyper/deconnexion_hyper.PNG')?>" width=300 height=200></div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">9</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:268.37px;top:75.78px" class="cls_002"><span class="cls_002">Déconnexion</span></div>
<div style="position:absolute;left:255.41px;top:321.81px" class="cls_009"><span class="cls_009">Figure 6 : déconnexion</span></div>
<div style="position:absolute;left:70.82px;top:368.01px" class="cls_002"><span class="cls_002">Pour se déconnecter, lHyperviseur clique sur son nom dutilisateur dans le coin supérieur droit pour</span></div>
<div style="position:absolute;left:70.82px;top:383.37px" class="cls_002"><span class="cls_002">faire apparaitre le menu de déconnexion lui présentant : Le réseau courant, son code parrain, son</span></div>
<div style="position:absolute;left:70.82px;top:398.97px" class="cls_002"><span class="cls_002">adresse email, son pays, son numéro de téléphone et </span><span class="cls_003">le bouton de déconnexion</span><span class="cls_002">.</span></div>
</div>
</div>
<div></div>
<div class="hard"></div>
</div>
<?php }elseif ($profil==3){ ?>
<div class="flipbook" style="position:relative">
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="<?= base_url('turnjs/Admin/background01.jpg')?>" width=595 height=841></div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">1</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:197.81px;top:556.31px" class="cls_004"><span class="cls_004">iLink World Corporation</span></div>
<div style="position:absolute;left:166.10px;top:594.98px" class="cls_005"><span class="cls_005">Mode demploi pour lutilisation du backoffice</span></div>
<div style="position:absolute;left:188.21px;top:624.62px" class="cls_006"><span class="cls_006">Liens : </span><A HREF="https://ilink-app.com/backofficebeta/">https://ilink-app.com/backofficebeta/</A> </span></div>
</div>
</div>
<div class="hard"></div>
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="<?= base_url('turnjs/Admin/background02.jpg')?>" width=595 height=841></div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">2</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:113.18px;top:391.31px;" class="cls_008"><span class="cls_008" style="font-size: 39.0px">ADMINISTRATEUR</span></div>
</div>
</div>
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="<?= base_url('turnjs/Admin/background03.jpg')?>" width=595 height=841></div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">3</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:268.37px;top:75.78px" class="cls_006"><span class="cls_006">I-Connexion</span></div>
<div style="position:absolute;left:251.69px;top:394.53px" class="cls_017"><span class="cls_017">Figure 1 : Interface Login</span></div>
<div style="position:absolute;left:70.82px;top:445.91px" class="cls_002"><span class="cls_002">Première interface du backoffice, ladministrateur est appelé à saisir :</span></div>
<div style="position:absolute;left:88.82px;top:471.83px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Son adresse email</span></div>
<div style="position:absolute;left:88.82px;top:487.91px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Son mot de passe</span></div>
<div style="position:absolute;left:88.82px;top:503.87px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Sassurer que le dernier champ soit à « </span><span class="cls_003">Administrateur</span><span class="cls_002"> ».</span></div>
<div style="position:absolute;left:70.82px;top:529.31px" class="cls_002"><span class="cls_002">Au coin supérieur gauche, les différents drapeaux désignent les langues disponibles pour le</span></div>
<div style="position:absolute;left:70.82px;top:544.79px" class="cls_002"><span class="cls_002">backoffice. Pour changer de langue, il suffit de cliquer sur le drapeau correspondant (notons que par</span></div>
<div style="position:absolute;left:70.82px;top:560.27px" class="cls_002"><span class="cls_002">défaut, le backoffice saffiche dans la langue utilisée par le navigateur)͘</span></div>
</div>
</div>
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="<?= base_url('turnjs/Hyper/background4.jpg')?>" width=595 height=841></div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">4</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:245.57px;top:75.78px" class="cls_005"><span class="cls_005">II-Tableau de bord</span></div>
<div style="position:absolute;left:70.82px;top:157.74px" class="cls_002"><span class="cls_002">Après connexion, lHyperviseur est redirigé vers son tableau de bord.</span></div>
<div style="position:absolute;left:225.41px;top:415.79px" class="cls_009"><span class="cls_009">Figure 2 : Tableau de bord Hyperviseur</span></div>
<div style="position:absolute;left:70.82px;top:436.67px" class="cls_002"><span class="cls_002">Le tableau de bord Hyperviseur présente :</span></div>
<div style="position:absolute;left:88.82px;top:462.59px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Le nombre dutilisateurs géolocalisés.</span></div>
<div style="position:absolute;left:88.82px;top:478.67px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Le nombre de superviseurs.</span></div>
<div style="position:absolute;left:88.82px;top:494.63px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Le nombre de demandes de crédits.</span></div>
<div style="position:absolute;left:88.82px;top:510.71px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Le nombre de demandes de crédits traitées et celui des demandes non traités.</span></div>
<div style="position:absolute;left:88.82px;top:526.79px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Le diagramme </span><span class="cls_003">Adhésion</span><span class="cls_002"> montre le nombre dadhésion (utilisateurs géolocalisés en orange et</span></div>
<div style="position:absolute;left:106.82px;top:542.15px" class="cls_002"><span class="cls_002">superviseurs en bleu) des 12 derniers mois.</span></div>
<div style="position:absolute;left:88.82px;top:558.23px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Le diagramme </span><span class="cls_003">Utilisateurs géolocalisés par ville</span><span class="cls_002"> fait la répartition des points géolocalisés par</span></div>
<div style="position:absolute;left:106.82px;top:573.59px" class="cls_002"><span class="cls_002">ville.</span></div>
<div style="position:absolute;left:88.82px;top:589.70px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Le diagramme </span><span class="cls_003">Demande de crédits par superviseurs</span><span class="cls_002"> montre le nombre de demande de</span></div>
<div style="position:absolute;left:106.82px;top:605.30px" class="cls_002"><span class="cls_002">crédit effectué par superviseur.</span></div>
<div style="position:absolute;left:70.82px;top:630.74px" class="cls_002"><span class="cls_002">Le menu de gauche se compose de 3 onglets :</span></div>
<div style="position:absolute;left:88.82px;top:656.66px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Tableau de bord</span><span class="cls_002"> : pour le tableau de bord</span></div>
<div style="position:absolute;left:88.82px;top:672.62px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Utilisateurs géolocalisés</span><span class="cls_002"> : pour consulter les informations sur les utilisateurs géolocalisés.</span></div>
<div style="position:absolute;left:88.82px;top:688.70px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Superviseurs </span><span class="cls_002">: pour consulter les informations sur les superviseurs.</span></div>
<div style="position:absolute;left:88.82px;top:704.66px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Demandes de crédits</span><span class="cls_002"> : pour consulter les informations sur les demandes de crédits.</span></div>
<div style="position:absolute;left:88.82px;top:720.74px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Demandes dadhésion </span><span class="cls_002">: pour consulter les informations sur les demandes dadhésion͘</span></div>
</div>
</div>
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="<?= base_url('turnjs/Hyper/background5.jpg')?>" width=595 height=841></div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">5</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:238.13px;top:75.78px" class="cls_002"><span class="cls_002">III-Utilisateurs géolocalisés</span></div>
<div style="position:absolute;left:70.82px;top:102.54px" class="cls_002"><span class="cls_002">En cliquant sur </span><span class="cls_003">Utilisateurs géolocaliés</span><span class="cls_002"> dans le menu de gauche, lhyperviseur est emmené à choisir</span></div>
<div style="position:absolute;left:70.82px;top:118.02px" class="cls_003"><span class="cls_003">la ville</span><span class="cls_002"> pour laquelle il désire consulter les informations des points géolocalisés.</span></div>
<div style="position:absolute;left:234.41px;top:407.61px" class="cls_009"><span class="cls_009">Figure 3 : Utilisateurs géolocalisés</span></div>
<div style="position:absolute;left:70.82px;top:453.83px" class="cls_002"><span class="cls_002">LHyperviseur dispose dune carte sur laquelle sont marquées les positions de points géolocalisés de</span></div>
<div style="position:absolute;left:70.82px;top:469.43px" class="cls_002"><span class="cls_002">son réseau et dun tableau avec les informations suivantes :</span></div>
<div style="position:absolute;left:88.82px;top:495.35px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Catégorie</span><span class="cls_002"> : pour la catégorie de lutilisateur (qui sera toujours </span><span class="cls_003">geolocated</span><span class="cls_002"> pour des</span></div>
<div style="position:absolute;left:106.82px;top:510.71px" class="cls_002"><span class="cls_002">utilisateurs géolocalisés).</span></div>
<div style="position:absolute;left:88.82px;top:526.79px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Parrain</span><span class="cls_002"> : code parrain du superviseur du point géolocalisé (en cliquant sur le parrain une</span></div>
<div style="position:absolute;left:106.82px;top:542.15px" class="cls_002"><span class="cls_002">fenêtre dinformation présente des informations supplémentaires sur le superviseur.)</span></div>
<div style="position:absolute;left:88.82px;top:558.23px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Nom</span><span class="cls_002"> : le nom ou lenseigne du point géolocalisé͘</span></div>
<div style="position:absolute;left:88.82px;top:574.31px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Adresse</span><span class="cls_002"> : ladresse physique du point géolocalisé͘</span></div>
<div style="position:absolute;left:88.82px;top:590.30px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Réseau</span><span class="cls_002"> : le réseau courant.</span></div>
<div style="position:absolute;left:88.82px;top:606.38px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Code</span><span class="cls_002"> </span><span class="cls_003">membre</span><span class="cls_002"> : le code membre point géolocalisé.</span></div>
<div style="position:absolute;left:88.82px;top:622.34px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Email</span><span class="cls_002"> : lemail de la structure͘</span></div>
<div style="position:absolute;left:88.82px;top:638.42px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Contact</span><span class="cls_002"> : le numéro de téléphone dappel du point géolocalisés.</span></div>
<div style="position:absolute;left:88.82px;top:654.38px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Active</span><span class="cls_002"> : Oui si le compte est activé, Non sinon.</span></div>
</div>
</div>
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="<?= base_url('turnjs/Hyper/background6.jpg')?>" width=595 height=841></div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">6</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:263.21px;top:101.22px" class="cls_002"><span class="cls_002">III-Superviseurs</span></div>
<div style="position:absolute;left:255.53px;top:394.41px" class="cls_009"><span class="cls_009">Figure 4 : Superviseurs</span></div>
<div style="position:absolute;left:70.82px;top:440.63px" class="cls_002"><span class="cls_002">LHyperviseur dispose dune carte sur laquelle sont marquées les positions des superviseurs de son</span></div>
<div style="position:absolute;left:70.82px;top:456.23px" class="cls_002"><span class="cls_002">réseau et dun tableau avec les mêmes informations que celui des utilisateurs géolocalisés͘</span></div>
<div style="position:absolute;left:70.82px;top:481.67px" class="cls_013"><span class="cls_013">Notons que dans ce cas la catégorie est à Super.</span></div>
</div>
</div>
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="<?= base_url('turnjs/Hyper/background7.jpg')?>" width=595 height=841></div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">7</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:250.61px;top:75.78px" class="cls_002"><span class="cls_002">Demandes de crédits</span></div>
<div style="position:absolute;left:70.82px;top:127.98px" class="cls_002"><span class="cls_002">En cliquant sur </span><span class="cls_003">Demandes de crédits</span><span class="cls_002"> dans le menu de gauche, lhyperviseur est emmené ă</span></div>
<div style="position:absolute;left:70.82px;top:143.46px" class="cls_002"><span class="cls_002">sélectionner </span><span class="cls_003">le superviseur</span><span class="cls_002"> pour lequel il désire consulter les demandes de crédit.</span></div>
<div style="position:absolute;left:240.29px;top:421.07px" class="cls_009"><span class="cls_009">Figure 4 : Demandes de crédits</span></div>
<div style="position:absolute;left:70.82px;top:467.39px" class="cls_002"><span class="cls_002">LHyperviseur dispose des informations suivantes :</span></div>
<div style="position:absolute;left:88.82px;top:493.31px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Le</span><span class="cls_002"> </span><span class="cls_003">temps moyen de traitement</span><span class="cls_002"> des demandes quil reçoit͘</span></div>
<div style="position:absolute;left:88.82px;top:509.39px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Un tableau listant les </span><span class="cls_003">demandes quil reçoit</span><span class="cls_002"> avec leur </span><span class="cls_003">statut</span><span class="cls_002">, </span><span class="cls_015">la date et le délai de traitement</span><span class="cls_002">.</span></div>
<div style="position:absolute;left:88.82px;top:525.35px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Des tableaux montrant les </span><span class="cls_003">5 demandes</span><span class="cls_002"> les plus rapidement/tardivement traités.</span></div>
</div>
</div>
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="<?= base_url('turnjs/Hyper/background8.jpg')?>" width=595 height=841></div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">8</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:247.97px;top:75.78px" class="cls_002"><span class="cls_002">Demandes dadhésion</span></div>
<div style="position:absolute;left:70.82px;top:102.66px" class="cls_013"><span class="cls_013">Les demandes dadhésion sont celles des nouveaux superviseurs vers lhyperviseur.</span></div>
<div style="position:absolute;left:237.89px;top:398.13px" class="cls_009"><span class="cls_009">Figure 5 : Demandes dadhésion</span></div>
<div style="position:absolute;left:70.82px;top:444.47px" class="cls_002"><span class="cls_002">LHyperviseur dispose des informations suivantes :</span></div>
<div style="position:absolute;left:88.82px;top:470.39px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_003"> Le</span><span class="cls_002"> </span><span class="cls_003">temps moyen de traitement</span><span class="cls_002"> des demandes quil reçoit͘</span></div>
<div style="position:absolute;left:88.82px;top:486.47px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Un tableau listant les </span><span class="cls_003">demandes quil reçoit</span><span class="cls_002"> avec leur </span><span class="cls_003">statut</span><span class="cls_002">, </span><span class="cls_015">la date et le délai de traitement</span><span class="cls_002">.</span></div>
<div style="position:absolute;left:88.82px;top:502.43px" class="cls_011"><span class="cls_011"></span><span class="cls_012"> </span><span class="cls_002"> Des tableaux montrant les </span><span class="cls_003">5 demandes</span><span class="cls_002"> les plus rapidement/tardivement traités.</span></div>
</div>
</div>
<div>
<div style="position:absolute;left:50%;margin-left:-297px;top:0px;width:595px;height:841px;border-style:outset;overflow:hidden">
<div style="position:absolute;left:0px;top:0px">
<img src="<?= base_url('turnjs/Hyper/background9.jpg')?>" width=595 height=841></div>
<div style="position:absolute;left:417.34px;top:33.76px" class="cls_002"><span class="cls_002">iLink World Corporation</span></div>
<div style="position:absolute;left:535.30px;top:33.76px" class="cls_002"><span class="cls_002">9</span></div>
<div style="position:absolute;left:438.94px;top:47.20px" class="cls_003"><span class="cls_003">Tutorial Backoffice</span></div>
<div style="position:absolute;left:268.37px;top:75.78px" class="cls_002"><span class="cls_002">Déconnexion</span></div>
<div style="position:absolute;left:255.41px;top:321.81px" class="cls_009"><span class="cls_009">Figure 6 : déconnexion</span></div>
<div style="position:absolute;left:70.82px;top:368.01px" class="cls_002"><span class="cls_002">Pour se déconnecter, lHyperviseur clique sur son nom dutilisateur dans le coin supérieur droit pour</span></div>
<div style="position:absolute;left:70.82px;top:383.37px" class="cls_002"><span class="cls_002">faire apparaitre le menu de déconnexion lui présentant : Le réseau courant, son code parrain, son</span></div>
<div style="position:absolute;left:70.82px;top:398.97px" class="cls_002"><span class="cls_002">adresse email, son pays, son numéro de téléphone et </span><span class="cls_003">le bouton de déconnexion</span><span class="cls_002">.</span></div>
</div>
</div>
<div></div>
<div class="hard"></div>
</div>
<?php } ?>
</div>
</div>
<script type="text/javascript">
function loadApp() {
// Create the flipbook
$('.flipbook').turn({
// Width
width:922,
// Height
height:600,
// Elevation
elevation: 50,
// Enable gradients
gradients: true,
// Auto center this flipbook
autoCenter: true
});
}
// Load the HTML4 version if there's not CSS transform
yepnope({
test : Modernizr.csstransforms,
yep: ["<?= base_url('dist/js/turn.js') ?>"],
nope: ["<?= base_url('dist/js/turn.html4.min.js') ?>"],
both: ["<?= base_url('dist/js/basic.css') ?>"],
complete: loadApp
});
</script>
</body>
</html>