xp-dev.com Git - namibia/blob - public/templates/page/customercompletevaluation.html

   1 <script>
   2     dataLayer = [];
   3 </script>
   4 <!-- Google Tag Manager -->
   5 <noscript>
   6     <iframe src="//www.googletagmanager.com/ns.html?id=GTM-PQWKM6" height="0" width="0" style="display:none;visibility:hidden"></iframe>
   7 </noscript>
   8 <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
   9         new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
  10         j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
  11         '//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
  12 })(window,document,'script','dataLayer','GTM-PQWKM6');
  13 </script>
  14
  15 <!-- End Google Tag Manager -->
  16 <form id="frmCustomerCompleteValuationView" action="">
  17     <div>
  18             <div class="wizardDiv">
  19                 <input type="hidden" id="valuatorSelected">
  20                 <input type="hidden" id="dateSelected">
  21                 <input type="hidden" id="timeSelected">
  22                 <input type="hidden" id="timeIdSelected">
  23                 <input type="hidden" id="publicDealer">
  24                 <input type="hidden" id="publicDealerContactNumber">
  25                 <input type="hidden" id="vehicleYear">
  26                 <input type="hidden" id="registrationNumber">
  27                 <input type="hidden" id="fuelType">
  28                 <input type="hidden" id="transmissionType">
  29
  30                 <div class="wizard" data-initialize="wizard" data-restrict="next" id="myWizard">
  31
  32                     <div class="step-content">
  33                         <div class="steps-container">
  34                             <ul class="steps">
  35                                 <li data-step="1" data-name="campaign" class="active"><span class="badge">1</span>Customer Details<span class="chevron"></span></li>
  36                                 <li data-step="2"><span class="badge">2</span>Book my appointment<span class="chevron"></span></li>
  37                                 <li data-step="3"><span class="badge">3</span>Time of appointment<span class="chevron"></span></li>
  38                                 <li data-step="4"><span class="badge">4</span>Confirmation<span class="chevron"></span></li>
  39                             </ul>
  40                         </div>
  41                         <div class="step-pane active" data-step="1">
  42                             <br>
  43                             <center><h2 style="color:white;margin-top:40px!important;">Customer Details</h2></center>
  44                             <br>
  45                             <div class="row-fluid">
  46                                 <div class="span12">
  47                                     <div class="span5 offset1 boxed">
  48                                         <div class="span12">
  49                                             <div class="control-group mobile-control-group" id="[tid]_firstName">
  50                                                 [firstName]
  51                                             </div>
  52                                             <div class="control-group mobile-control-group" id="[tid]_familyName">
  53                                                 [familyName]
  54                                             </div>
  55                                             <div class="control-group mobile-control-group" id="[tid]_mobile">
  56                                                 [mobile]
  57                                             </div>
  58                                             <div class="control-group mobile-control-group" id="[tid]_email">
  59                                                 [email]
  60                                             </div>
  61                                         </div>
  62                                     </div>
  63                                     <div class="span5 boxed">
  64
  65                                         <div class="control-group mobile-control-group" id="[tid]_customerAddressStreet">
  66                                             [customerAddressStreet]
  67                                         </div>
  68                                         <div class="control-group mobile-control-group" id="[tid]_customerAddressStreetName">
  69                                             [customerAddressStreetName]
  70                                         </div>
  71                                         <div class="control-group mobile-control-group" id="[tid]_customerAddressSuburb">
  72                                             [customerAddressSuburb]
  73                                         </div>
  74                                         <div class="control-group mobile-control-group" id="[tid]_customerAddressCity">
  75                                             [customerAddressCity]
  76                                         </div>
  77                                         <div class="control-group mobile-control-group" id="[tid]_customerAddressPostalCode">
  78                                             [customerAddressPostalCode]
  79                                         </div>
  80
  81                                     </div>
  82                                 </div>
  83                             </div>
  84                             <div class="row-fluid">
  85                                 <div class="span12">
  86                                     <button type="button" id="btnContinue1" class="btn btn-success span2 pull-right">
  87                                         Continue
  88                                     </button>
  89                                 </div>
  90                             </div>
  91                         </div>
  92                         <div class="step-pane" data-step="2">
  93                             <br>
  94                             <center><h2 style="color:white;margin-top:40px!important;">Book my appointment</h2></center>
  95                             <br>
  96
  97                             <div class="row-fluid">
  98                                 <div class="span12">
  99
 100                                     <div class="span12 table-form-2">
 101                                         <div class="span12">
 102                                             <div class="table-form-actions">
 103                                                 <button class="btn btn-danger table-form-btn-prev" type="button" id="table-form-actions-prev">
 104                                                     <span class="icon-circle-arrow-left icon-white "></span>
 105                                                     Previous Week
 106                                                 </button>
 107                                                 <button class="btn btn-danger table-form-btn-next pull-right" type="button" id="table-form-actions-next">
 108                                                     Next Week
 109                                                     <span class="icon-circle-arrow-right icon-white"></span>
 110                                                 </button>
 111                                             </div>
 112                                         </div>
 113                                         <br><br>
 114                                         <table class="table valuation">
 115                                             <tbody>
 116                                             <tr id="completeValuationGridColumnHeaders" class="table-header mobile-table-header table-header-wrapper">
 117                                                 <th class="hidden-phone">
 118                                                     <div class="table-heading-wrapper">
 119                                                         Valuator
 120                                                     </div>
 121                                                 </th>
 122                                                 <th class="hidden-phone">
 123                                                     <div class="table-heading-wrapper" id="date_monday">
 124                                                         Monday
 125                                                     </div>
 126                                                 </th>
 127                                                 <th class="type">
 128                                                     <div class="table-heading-wrapper" id="date_tuesday">
 129                                                         Tuesday
 130                                                     </div>
 131                                                 </th>
 132                                                 <th class="year">
 133                                                     <div class="table-heading-wrapper" id="date_wednesday">
 134                                                         Wednesday
 135                                                     </div>
 136                                                 </th>
 137                                                 <th class="hidden-phone kms">
 138                                                     <div class="table-heading-wrapper" id="date_thursday">
 139                                                         Thursday
 140                                                     </div>
 141                                                 </th>
 142                                                 <th class="hidden-phone">
 143                                                     <div class="table-heading-wrapper" id="date_friday">
 144                                                         Friday
 145                                                     </div>
 146                                                 </th>
 147                                             </tr>
 148                                             </tbody>
 149                                             <tbody id="completeValuationGridRowRepeater" class="grid">
 150                                             <tr class="handy">
 151                                                 <td class="valuator no-hover">Valuator</td>
 152                                                 <td class="monday_status">Available</td>
 153                                                 <td class="tuesday_status">Available</td>
 154                                                 <td class="wednesday_status">Available</td>
 155                                                 <td class="thursday_status">Available</td>
 156                                                 <td class="friday_status">Available</td>
 157                                             </tr>
 158                                             </tbody>
 159                                         </table>
 160
 161                                     </div>
 162                                 </div>
 163                             </div>
 164                             <div class="row-fluid">
 165                                 <div class="span12">
 166                                     <button type="button" id="btnContinue2" class="btn btn-success span2 pull-right">
 167                                         Continue
 168                                     </button>
 169                                     <button type="button" class="btn btn-primary span2 pull-left btn-prev">
 170                                         Previous
 171                                     </button>
 172                                 </div>
 173                             </div>
 174                         </div>
 175                         <div class="step-pane" data-step="3">
 176                             <br>
 177                             <center><h2 style="color:white;margin-top:40px!important;">Book my appointment</h2></center>
 178                             <br>
 179
 180                             <div class="row-fluid">
 181                                 <div class="span12 table-form-2">
 182                                     <table class="table valuation">
 183                                         <tbody>
 184                                         <tr id="completeValuationGridColumnHeadersTime" class="table-header mobile-table-header table-header-wrapper">
 185                                             <th class="">
 186                                                 <div class="table-heading-wrapper">
 187                                                     Valuator
 188                                                 </div>
 189                                             </th>
 190                                             <th class="">
 191                                                 <div class="table-heading-wrapper" id="date_monday">
 192                                                     Date
 193                                                 </div>
 194                                             </th>
 195                                             <th class="">
 196                                                 &nbsp;
 197                                             </th>
 198                                             <th class="">
 199                                                 &nbsp;
 200                                             </th>
 201                                             <th class="">
 202                                                 &nbsp;
 203                                             </th>
 204                                             <th class="">
 205                                                 &nbsp;
 206                                             </th>
 207                                         </tr>
 208                                         </tbody>
 209                                         <tbody id="completeValuationGridRowRepeaterTime" class="grid">
 210                                         <tr class="handy">
 211                                             <td class="">Monday</td>
 212                                             <td class="">Tuesday</td>
 213                                             <td class="">Wednesday</td>
 214                                             <td class="">Thursday</td>
 215                                             <td class="">Friday</td>
 216                                         </tr>
 217                                         </tbody>
 218                                     </table>
 219
 220                                 </div>
 221                             </div>
 222                             <div class="row-fluid">
 223                                 <div class="span12">
 224                                     <button type="button" id="btnContinue3" class="btn btn-success span2 pull-right">
 225                                         Continue
 226                                     </button>
 227                                     <button type="button" class="btn btn-primary span2 pull-left btn-prev">
 228                                         Previous
 229                                     </button>
 230                                 </div>
 231                             </div>
 232                         </div>
 233                         <div class="step-pane" data-step="4">
 234                             <br>
 235                             <center><h2 style="color:white;margin-top:40px!important;">Booking confirmation</h2></center>
 236                             <br>
 237
 238
 239
 240                             <div class="row-fluid">
 241                                 <div class="span12 boxed">
 242                                     <div class="span12">
 243                                         <div class="span12 offset1">
 244                                             <div class="span4">
 245                                                 <div class="span12 offset1">
 246                                                     <h3>What you'll need</h3>
 247                                                     <br>
 248                                                     <p>
 249                                                         <li>Original ID / Drivers of the registered owner or proxy</li>
 250                                                         <li>If the registered owner is not the person selling the vehicle, a letter of authorization will need to accompany.</li>
 251                                                         <li>Proof of banking details for EFT purposes</li>
 252                                                         <li>Completed Indemnity form. <a href='/documents/wp4c_indemnity.pdf' target="_blank">(Download Here)</a></li>
 253                                                         <li>Settlement Letter if financed</li>
 254                                                         <li>Original Natis document or copy if financed</li>
 255                                                     </p>
 256                                                     <br>
 257
 258                                                     <h3>Additional if Specified</h3>
 259                                                     <br>
 260                                                     <p>
 261                                                         <li>Spare Keys</li>
 262                                                         <li>Service books</li>
 263                                                         <li>Owner's manual</li>
 264                                                         <li>Proof of previous repairs</li>
 265                                                         <li>Vehicle accessories, e.g. Tool kits / Removable trim</li>
 266                                                     </p>
 267                                                     <br>
 268                                                 </div>
 269                                             </div>
 270                                             <div class="span6 pull-right">
 271
 272                                                 <div id="confirmationOfInfo"></div>
 273
 274                                             </div>
 275                                         </div>
 276                                     </div>
 277                                 </div>
 278
 279                                 <br><br><br>
 280
 281                                 <div class="span12 offset3 ">
 282                                     <div class="control-group mobile-control-group" >
 283                                         <label class="checkbox checkbox-line highlighted">
 284                                             <input type="checkbox" id="terms" value="">
 285                                             <span class="styled-checkbox"></span>
 286                                             <!--   <a href="/documents/Registration_Terms_and_Conditions.pdf" target="_blank">terms and conditions</a> -->
 287                                                     <span class="acceptText">
 288                                                         I accept the <a style="color:#08c;" href="/documents/t_c_7Sept16.pdf" title="" target="_blank">terms &amp; conditions</a> of this submission.
 289                                                     </span>
 290                                         </label>
 291                                                 <span class="acceptTextIE" style="display:none;">
 292                                                     I accept the <a style="color:#08c;" href="/documents/t_c_7Sept16.pdf" title="" target="_blank">terms &amp; conditions</a> of this submission.
 293                                                 </span>
 294                                     </div>
 295                                 </div>
 296                                 <div class="row-fluid">
 297                                     <div class="span12">
 298                                         <button type="button" id="btnContinue4" class="btn btn-success span2 pull-right">
 299                                             Submit
 300                                         </button>
 301                                         <button type="button" class="btn btn-primary span2 pull-left btn-prev">
 302                                             Previous
 303                                         </button>
 304                                     </div>
 305                                 </div>
 306                             </div>
 307                         </div>
 308                     </div>
 309
 310
 311
 312                     <div class="actions" style="display: none">
 313                         <button type="button" class="btn btn-default btn-prev"><span
 314                                 class="glyphicon glyphicon-arrow-left"></span>&nbsp;</button>
 315                         <button type="button" class="btn btn-default btn-next" data-last=" ">&nbsp;<span
 316                                 class="glyphicon glyphicon-arrow-right"></span></button>
 317                     </div>
 318                 </div>
 319
 320
 321                 <div class="row-fluid">&nbsp;</div>
 322             </div>
 323     </div>
 324
 325 </form>