You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

524 lines
36KB

  1. <?php
  2. /**
  3. Copyright distrib (2018)
  4. contact@opendistrib.net
  5. Ce logiciel est un programme informatique servant à aider les producteurs
  6. à distribuer leur production en circuits courts.
  7. Ce logiciel est régi par la licence CeCILL soumise au droit français et
  8. respectant les principes de diffusion des logiciels libres. Vous pouvez
  9. utiliser, modifier et/ou redistribuer ce programme sous les conditions
  10. de la licence CeCILL telle que diffusée par le CEA, le CNRS et l'INRIA
  11. sur le site "http://www.cecill.info".
  12. En contrepartie de l'accessibilité au code source et des droits de copie,
  13. de modification et de redistribution accordés par cette licence, il n'est
  14. offert aux utilisateurs qu'une garantie limitée. Pour les mêmes raisons,
  15. seule une responsabilité restreinte pèse sur l'auteur du programme, le
  16. titulaire des droits patrimoniaux et les concédants successifs.
  17. A cet égard l'attention de l'utilisateur est attirée sur les risques
  18. associés au chargement, à l'utilisation, à la modification et/ou au
  19. développement et à la reproduction du logiciel par l'utilisateur étant
  20. donné sa spécificité de logiciel libre, qui peut le rendre complexe à
  21. manipuler et qui le réserve donc à des développeurs et des professionnels
  22. avertis possédant des connaissances informatiques approfondies. Les
  23. utilisateurs sont donc invités à charger et tester l'adéquation du
  24. logiciel à leurs besoins dans des conditions permettant d'assurer la
  25. sécurité de leurs systèmes et ou de leurs données et, plus généralement,
  26. à l'utiliser et l'exploiter dans les mêmes conditions de sécurité.
  27. Le fait que vous puissiez accéder à cet en-tête signifie que vous avez
  28. pris connaissance de la licence CeCILL, et que vous en avez accepté les
  29. termes.
  30. */
  31. use common\helpers\GlobalParam ;
  32. use common\models\Producer ;
  33. use common\models\Distribution ;
  34. \producer\assets\VuejsOrderOrderAsset::register($this);
  35. $this->setTitle('Commander') ;
  36. $producer = GlobalParam::getCurrentProducer() ;
  37. ?>
  38. <script>
  39. var appInitValues = {
  40. };
  41. </script>
  42. <div id="app-order-order" :class="{'loaded': !loadingInit}">
  43. <?php if(isset($order)): ?>
  44. <span id="order-distribution-date"><?= $order->distribution->date; ?></span>
  45. <?php endif; ?>
  46. <?php if(isset($date)): ?>
  47. <span id="distribution-date"><?= $date; ?></span>
  48. <?php endif; ?>
  49. <div v-if="loadingInit && distributions.length == 0" class="alert alert-warning">
  50. Aucune distribution n'est prévue chez ce producteur.
  51. </div>
  52. <div v-else>
  53. <div>
  54. <div id="steps">
  55. <ul>
  56. <?php if($producer->option_order_entry_point == Producer::ORDER_ENTRY_POINT_DATE): ?>
  57. <step-date
  58. first="true"
  59. :step="step"
  60. :point-sale-active="pointSaleActive"
  61. :date-format="dateFormat"
  62. :change-step="changeStep"
  63. :producer="producer"
  64. ></step-date>
  65. <step-point-sale
  66. :step="step"
  67. :point-sale-active="pointSaleActive"
  68. :change-step="changeStep"
  69. :producer="producer"
  70. ></step-point-sale>
  71. <?php else: ?>
  72. <step-point-sale
  73. first="true"
  74. :step="step"
  75. :point-sale-active="pointSaleActive"
  76. :change-step="changeStep"
  77. :producer="producer"
  78. ></step-point-sale>
  79. <step-date
  80. :step="step"
  81. :point-sale-active="pointSaleActive"
  82. :date-format="dateFormat"
  83. :change-step="changeStep"
  84. :producer="producer"
  85. ></step-date>
  86. <?php endif; ?>
  87. <li id="step-products" :class="'col-md-3 '+((step == 'products') ? 'active ' : '')">
  88. <button @click="changeStep('products')" :class="'btn '+ (step == 'products' ? 'btn-primary' : 'btn-default')" :disabled="step == 'date' || step == 'point-sale'">
  89. <span class="button-content"><span class="glyphicon glyphicon-th-list"></span> Produits</span>
  90. </button>
  91. <div class="info-step" v-if="oneProductOrdered()">
  92. {{ countProductOrdered() }} produit{{ (countProductOrdered() > 1) ? 's' : '' }}
  93. </div>
  94. </li>
  95. <li id="step-payment" :class="'col-md-3 '+((step == 'payment') ? 'active' : '')">
  96. <button @click="changeStep('payment')" :class="'btn '+ (step == 'payment' ? 'btn-primary' : 'btn-default')" :disabled="step == 'date' || step == 'point-sale' || step == 'products'">
  97. <span class="button-content"><span class="glyphicon glyphicon-ok"></span> Confirmation</span>
  98. </button>
  99. </li>
  100. </ul>
  101. <div class="clr"></div>
  102. </div>
  103. <div class="content">
  104. <div v-if="errors && errors.length" class="alert alert-danger">
  105. <ul>
  106. <li v-for="error in errors">
  107. <div v-html="error"></div>
  108. </li>
  109. </ul>
  110. </div>
  111. <div v-if="loading && !step">
  112. Chargement ...
  113. </div>
  114. <transition name="slide">
  115. <div id="content-step-date" v-if="step == 'date'">
  116. <div v-if="loading">
  117. Chargement ...
  118. </div>
  119. <div v-else>
  120. <?php if($producer->behavior_order_select_distribution == Producer::BEHAVIOR_ORDER_SELECT_DISTRIBUTION_LIST ): ?>
  121. <div style="display:none ;">
  122. <?php endif; ?>
  123. <div id="legend">
  124. <div><span id="distribution-date-color"></span> Prochains jours de distribution</div>
  125. <div><span id="order-date-color"></span> Vos commandes déjà enregistrées</div>
  126. </div>
  127. <div id="calendar">
  128. <v-calendar
  129. is-inline
  130. is-double-paned
  131. is-expanded
  132. v-model="date"
  133. mode="single"
  134. locale="fr-FR"
  135. :locale="{ id: 'fr_FR', firstDayOfWeek: 1, masks: { weekdays: 'WW' } }"
  136. :formats="calendar.formats"
  137. :theme-styles="calendar.themeStyles"
  138. :attributes="calendar.attrs"
  139. :available-dates="calendar.availableDates"
  140. @dayclick='dayClick'
  141. ></v-calendar>
  142. </div>
  143. <?php if($producer->behavior_order_select_distribution == Producer::BEHAVIOR_ORDER_SELECT_DISTRIBUTION_LIST ): ?>
  144. </div>
  145. <?php endif; ?>
  146. <?php if($producer->behavior_order_select_distribution == Producer::BEHAVIOR_ORDER_SELECT_DISTRIBUTION_LIST ): ?>
  147. <div id="distributions-list">
  148. <?php $incomingDistributions = Distribution::getIncomingDistributions(); ?>
  149. <?php foreach($incomingDistributions as $distribution): ?>
  150. <?php
  151. $pointSaleDistributions = PointSaleDistribution::searchAll([
  152. 'id_distribution' => $distribution->id,
  153. 'delivery' => 1
  154. ], [], [
  155. 'with' => 'pointSale'
  156. ]);
  157. ?>
  158. <div class="panel panel-default">
  159. <div class="panel-body">
  160. <button class="btn btn-primary" @click="dayClickList" data-distribution-date="<?= $distribution->date.' 00:00:00' ?>">Sélectionner cette distribution</button>
  161. <span class="date"><?= ucfirst(strftime('%A %d %B', strtotime($distribution->date))); ?></span>
  162. <?php
  163. if($pointSaleDistributions && count($pointSaleDistributions) > 0) {
  164. echo '<div class="point-sales">' ;
  165. foreach($pointSaleDistributions as $pointSaleDistribution) {
  166. echo $pointSaleDistribution->pointSale->name.'' ;
  167. if(strlen($pointSaleDistribution->pointSale->locality)) {
  168. echo ' ('.$pointSaleDistribution->pointSale->locality.')' ;
  169. }
  170. echo '<br />' ;
  171. }
  172. echo '</div>' ;
  173. }
  174. ?>
  175. </div>
  176. </div>
  177. <?php endforeach; ?>
  178. </div>
  179. <?php endif; ?>
  180. </div>
  181. </div>
  182. </transition>
  183. <transition name="slide">
  184. <div id="content-step-point-sale" v-if="step == 'point-sale'">
  185. <div v-if="loading">
  186. Chargement ...
  187. </div>
  188. <div v-else>
  189. <h3>Où souhaitez-vous récupérer votre commande ?</h3>
  190. <table id="points-sale" class="table table-bordered" v-if="pointsSale.length">
  191. <thead>
  192. <tr>
  193. <th>Nom</th>
  194. <th>Localité</th>
  195. <th></th>
  196. </tr>
  197. </thead>
  198. <tbody>
  199. <tr v-for="pointSale in orderedPointsSale" v-if="pointSale && (producer.option_order_entry_point == 'point-sale' || (producer.option_order_entry_point == 'date' && pointSale.pointSaleDistribution.delivery))" :class="(pointSaleActive && pointSale.id == pointSaleActive.id) ? 'selected' : ''">
  200. <td class="name">
  201. <span class="the-name">{{ pointSale.name }}</span>
  202. <div class="comment" v-if="pointSale.userPointSale">
  203. {{ pointSale.userPointSale.comment }}
  204. </div>
  205. </td>
  206. <td class="locality">{{ pointSale.locality }}</td>
  207. <td class="actions">
  208. <div :class="'form-group' + (pointSale.invalid_code ? ' has-error' : '')">
  209. <div class="input-group" v-if="pointSale.code.length > 0">
  210. <span class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></span>
  211. <input v-model="pointsSaleCodes[pointSale.id]" type="password" placeholder="Code" class="form-control input-code" />
  212. </div>
  213. </div>
  214. <button class="btn btn-primary" @click="pointSaleClick" :data-code="pointSale.code.length > 0" :data-id-point-sale="pointSale.id">
  215. <span class="glyphicon glyphicon-map-marker"></span>
  216. Choisir
  217. </button>
  218. </td>
  219. </tr>
  220. </tbody>
  221. </table>
  222. <div class="alert alert-warning" v-else>
  223. Aucun point de vente disponible pour ce jour de distribution.
  224. </div>
  225. </div>
  226. </div>
  227. </transition>
  228. <transition name="slide">
  229. <div id="content-step-products" v-if="step == 'products'">
  230. <div v-if="loading">
  231. Chargement ...
  232. </div>
  233. <div v-else>
  234. <div v-if="products.length">
  235. <table id="products" class="table table-bordered" >
  236. <thead>
  237. <tr>
  238. <th>Photo</th>
  239. <th>Nom</th>
  240. <th>Prix unitaire</th>
  241. <th>Quantité</th>
  242. <th>Total</th>
  243. </tr>
  244. </thead>
  245. <tbody>
  246. <template v-for="category in categories">
  247. <tr v-if="category.id && countProductsByCategory(category)">
  248. <td class="category-name" colspan="5" @click="setCategoryCurrent(category)">
  249. <span v-if="categoryCurrent && categoryCurrent.id == category.id" class="glyphicon glyphicon-triangle-bottom"></span>
  250. <span v-else class="glyphicon glyphicon-triangle-right"></span>
  251. {{ category.name }}
  252. <span class="label label-default">{{ countProductsByCategory(category) }} produit<template v-if="countProductsByCategory(category) > 1">s</template></span>
  253. <span v-if="countSelectedProductsByCategory(category) > 0" class="label label-success">{{ countSelectedProductsByCategory(category) }} produit<template v-if="countSelectedProductsByCategory(category) > 1">s</template> sélectionné<template v-if="countSelectedProductsByCategory(category) > 1">s</template></span>
  254. </td>
  255. </tr>
  256. <template v-if="(categoryCurrent && categoryCurrent.id == category.id) || category.id == null">
  257. <tr v-for="product in products" v-if="product.id_product_category == category.id && product.productDistribution && product.productDistribution[0] && product.productDistribution[0].active == 1">
  258. <td class="photo">
  259. <img v-if="product.photo.length" class="photo-product" :src="'<?php echo Yii::$app->urlManager->getBaseUrl(); ?>/uploads/'+product.photo" />
  260. </td>
  261. <td class="name">
  262. <span class="name">{{ product.name }}</span>
  263. <span class="other">
  264. <span v-if="product.description.length">/</span>
  265. <span class="description">{{ product.description }}</span>
  266. <span v-if="product.weight">({{ product.weight }}&nbsp;g)</span>
  267. </span>
  268. <span v-if="product.quantity_max > 0 && ((product.quantity_form / product.coefficient_unit == product.quantity_remaining) || ((product.quantity_remaining * product.coefficient_unit) - product.quantity_form) < product.step)" class="label label-danger">
  269. Épuisé
  270. </span>
  271. <div class="recipe" v-if="product.recipe.length">{{ product.recipe }}</div>
  272. </td>
  273. <td class="price-unit">
  274. <template v-if="product.price_with_tax >= 0">{{ formatPrice(product.price_with_tax) }}<br /><span class="unit">{{ product.wording_unit }}</span></template>
  275. </td>
  276. <td class="td-quantity">
  277. <template v-if="product.price_with_tax >= 0">
  278. <div class="input-group">
  279. <span class="input-group-btn">
  280. <button class="btn btn-default btn-moins" type="button" @click="productQuantityClick(product, product.unit == 'piece' ? -1 : -parseFloat(product.step))" :disabled="product.quantity_form == 0"><span class="glyphicon glyphicon-minus"></span></button>
  281. </span>
  282. <input type="text" v-model="product.quantity_form" class="form-control quantity" readonly="readonly" />
  283. <span class="input-group-addon">{{ product.unit == 'piece' ? 'p.' : product.unit }}</span>
  284. <span class="input-group-btn">
  285. <button class="btn btn-default btn-plus" type="button" @click="productQuantityClick(product, product.unit == 'piece' ? 1 : parseFloat(product.step))" :disabled="product.quantity_form == product.quantity_remaining && product.quantity_max > 0"><span class="glyphicon glyphicon-plus"></span></button>
  286. </span>
  287. </div>
  288. </template>
  289. </td>
  290. <td class="price-total">
  291. <template v-if="product.price_with_tax >= 0 && product.quantity_form > 0">
  292. {{ formatPrice(product.price_with_tax * (product.quantity_form / product.coefficient_unit )) }}
  293. </template>
  294. </td>
  295. </tr>
  296. </template>
  297. </template>
  298. <tr class="total">
  299. <td class="summary" colspan="4">
  300. <template v-if="priceTotal() > 0">
  301. <h3>&gt; Résumé</h3>
  302. <ul>
  303. <li v-for="product in products" v-if="product.quantity_form > 0">
  304. <span class="quantity">{{ product.quantity_form }} {{ product.unit == 'piece' ? 'p.' : product.unit }} x</span>
  305. <span class="name">{{ product.name }}</span>
  306. <span class="other">
  307. <span v-if="product.description.length">/</span>
  308. <span class="description">{{ product.description }}</span>
  309. <span v-if="product.weight">({{ product.weight }}&nbsp;g)</span>
  310. </li>
  311. </ul>
  312. </template>
  313. </td>
  314. <td class="price-total">{{ priceTotal(true) }}</td>
  315. </tr>
  316. </tbody>
  317. </table>
  318. <div class="block-actions">
  319. <button class="btn btn-primary" @click="changeStep('payment')">Valider</button>
  320. </div>
  321. </div>
  322. <div class="alert alert-warning" v-else>
  323. Aucun produit disponible
  324. </div>
  325. </div>
  326. </div>
  327. </transition>
  328. <transition name="slide">
  329. <div id="content-step-payment" v-if="step == 'payment'">
  330. <div class="delivery">
  331. <div class="delivery-home" v-if="producer.option_delivery">
  332. <input type="checkbox" name="delivery" id="delivery" v-model="delivery" />
  333. <label for="delivery">Je souhaite être livré à domicile</label>
  334. </div>
  335. <div class="delivery-address" v-if="delivery">
  336. <label for="deliver-address">Adresse de livraison</label>
  337. <textarea id="deliver-address" v-model="deliveryAddress" class="form-control" required="required"></textarea>
  338. </div>
  339. </div>
  340. <div class="comment">
  341. <label for="order-comment">Commentaire</label>
  342. <textarea id="order-comment" v-model="comment" class="form-control"></textarea>
  343. </div>
  344. <template v-if="!checkCreditLimit(order) && pointSaleActive.credit_functioning == 'mandatory'">
  345. <div class="alert alert-danger">Vous devez recharger votre crédit ou supprimer des produits. Votre producteur n'autorise pas un crédit inférieur à <strong>{{ formatPrice(creditLimit) }}</strong>.</div>
  346. <div class="block-actions">
  347. <a class="btn btn-primary" href="<?= Yii::$app->urlManager->createUrl(['site/index']) ?>">Retour à l'accueil</a>
  348. </div>
  349. </template>
  350. <template v-else>
  351. <div class="credit">
  352. <div v-if="user && producer.credit == 1 && pointSaleActive.credit == 1 && (pointSaleActive.credit_functioning != 'user' || (pointSaleActive.credit_functioning == 'user' && user.credit_active))">
  353. <input type="checkbox" id="use-credit" v-model="useCredit" disabled="disabled" v-if="pointSaleActive.credit_functioning == 'mandatory' || (pointSaleActive.credit_functioning == 'user' && user.credit_active)" />
  354. <input type="checkbox" id="use-credit" v-model="useCredit" v-else /> <label for="use-credit">Utiliser mon Crédit ({{ formatPrice(user.credit) }})</label>
  355. <div class="info" v-if="useCredit">
  356. <template v-if="order == null || order.amount_paid == 0">
  357. <span v-if="checkCreditLimit(order)">{{ priceTotal(true) }} seront débités</span>
  358. <span v-else>
  359. {{ formatPrice(user.credit) }} seront débités. (Limite de crédit à {{ formatPrice(producer.credit_limit) }})<br />
  360. Restera {{ formatPrice(priceTotal() - credit) }} à régler.
  361. </span>
  362. </template>
  363. <template v-else-if="order != null && order.amount_paid > 0 && order.amount_paid < priceTotal()">
  364. <span v-if="checkCreditLimit(order)">{{ formatPrice(priceTotal() - order.amount_paid) }} seront débités</span>
  365. <span v-else>
  366. {{ formatPrice(user.credit) }} seront débités. (Limite de crédit à {{ formatPrice(producer.credit_limit) }})<br />
  367. Restera {{ formatPrice(priceTotal() - order.amount_paid - user.credit) }} à régler.
  368. </span>
  369. </template>
  370. <template v-else-if="order != null && order.amount_paid > priceTotal()">
  371. <span>{{ formatPrice(order.amount_paid - priceTotal()) }} seront remboursés</span>
  372. </template>
  373. </div>
  374. </div>
  375. <div v-else>
  376. <span class="glyphicon glyphicon-chevron-right"></span>
  377. <?php if($producer->option_payment_info && strlen($producer->option_payment_info) > 0): ?>
  378. Confirmez votre commande et retrouvez les informations liées au paiement sur la page suivante.
  379. <?php else: ?>
  380. La commande sera à régler sur place.
  381. <?php endif; ?>
  382. </div>
  383. </div>
  384. <div id="signup-guest" v-if="!user && producer.option_allow_order_guest">
  385. <h3>Informations personnelles</h3>
  386. <form action="#">
  387. <div class="form-group field-signupguest-email required">
  388. <label class="control-label" for="signupguest-email">Email</label>
  389. <input type="email" id="signupguest-email" class="form-control" name="SignupForm[email]">
  390. <p class="help-block help-block-error"></p>
  391. </div>
  392. <!--<div class="form-group field-signupguest-password required">
  393. <label class="control-label" for="signupguest-password">Mot de passe</label>
  394. <input type="password" id="signupguest-password" class="form-control" name="SignupForm[password]">
  395. <p class="help-block help-block-error"></p>
  396. </div>-->
  397. <div class="form-group field-signupguest-firstname required">
  398. <label class="control-label" for="signupguest-firstname">Prénom</label>
  399. <input type="text" id="signupguest-firstname" class="form-control" name="SignupForm[firstname]">
  400. <p class="help-block help-block-error"></p>
  401. </div>
  402. <div class="form-group field-signupguest-lastname required">
  403. <label class="control-label" for="signupguest-lastname">Nom</label>
  404. <input type="text" id="signupguest-lastname" class="form-control" name="SignupForm[lastname]">
  405. <p class="help-block help-block-error"></p>
  406. </div>
  407. <div class="form-group field-signupguest-phone required">
  408. <label class="control-label" for="signupguest-phone">Téléphone</label>
  409. <input type="text" id="signupguest-phone" class="form-control" name="SignupForm[phone]">
  410. <p class="help-block help-block-error"></p>
  411. </div>
  412. </form>
  413. </div>
  414. <div class="block-actions">
  415. <button class="btn btn-primary" disabled="disabled" v-if="disableConfirmButton">Je confirme ma commande</button>
  416. <button class="btn btn-primary" v-else @click="confirmClick">Je confirme ma commande</button>
  417. </div>
  418. </template>
  419. </div>
  420. </transition>
  421. </div>
  422. </div>
  423. <div id="infos" v-if="producer != null && producer.order_infos != null && producer.order_infos.length">
  424. <div class="panel panel-default">
  425. <div class="panel-heading">
  426. Informations
  427. </div>
  428. <div class="panel-body">
  429. {{ producer.order_infos }}
  430. </div>
  431. </div>
  432. </div>
  433. <?php
  434. $producer = GlobalParam::getCurrentProducer() ;
  435. if($producer->hasSpecificDelays()): ?>
  436. <div id="specific-delays" class="panel panel-default">
  437. <div class="panel-heading">
  438. Délais de commande spécifiques
  439. </div>
  440. <div class="panel-body">
  441. <table class="table table-bordered">
  442. <thead>
  443. <tr>
  444. <th>Jour</th>
  445. <th>Délai</th>
  446. </tr>
  447. </thead>
  448. <?php foreach($producer->getSpecificDelays() as $day => $delay): ?>
  449. <?php if($delay['order_delay'] && $delay['order_deadline']): ?>
  450. <tr>
  451. <td>
  452. <?php
  453. switch($day) {
  454. case 'monday': echo 'Lundi' ; break;
  455. case 'tuesday': echo 'Mardi' ; break;
  456. case 'wednesday': echo 'Mercredi' ; break;
  457. case 'thursday': echo 'Jeudi' ; break;
  458. case 'friday': echo 'Vendredi' ; break;
  459. case 'saturday': echo 'Samedi' ; break;
  460. case 'sunday': echo 'Dimanche' ; break;
  461. }
  462. ?>
  463. </td>
  464. <td>
  465. <span><?= $delay['order_delay'] ?> jour<?= ($delay['order_delay'] > 1) ? 's' : '' ?></span> à l'avance,
  466. avant <span><?= ($delay['order_deadline'] == 24) ? 'minuit' : $delay['order_deadline'].'h' ; ?></span>
  467. </td>
  468. </tr>
  469. <?php endif; ?>
  470. <?php endforeach; ?>
  471. </table>
  472. </div>
  473. </div>
  474. <?php endif; ?>
  475. </div>
  476. </div>
  477. <script type="text/x-template" id="template-step-date">
  478. <li id="step-date" :class="'col-md-3'+((step == 'date') ? ' active' : '')+(first ? ' first' : '')">
  479. <button @click="changeStep('date')" :class="'btn '+ (step == 'date' ? 'btn-primary' : 'btn-default')" :disabled="producer && producer.option_order_entry_point == 'point-sale' && !pointSaleActive">
  480. <span class="button-content"><span class="glyphicon glyphicon-time"></span> Date</span></span>
  481. </button>
  482. <div class="info-step" v-if="dateFormat">
  483. {{ dateFormat }}
  484. </div>
  485. </li>
  486. </script>
  487. <script type="text/x-template" id="template-step-point-sale">
  488. <li id="step-point-sale" :class="'col-md-3'+((step == 'point-sale') ? ' active ' : '')+(first ? ' first' : '')">
  489. <button @click="changeStep('point-sale')" :class="'btn '+ (step == 'point-sale' ? 'btn-primary' : 'btn-default')" :disabled="producer && (producer.option_order_entry_point == 'date' && step == 'date')">
  490. <span class="button-content"><span class="glyphicon glyphicon-map-marker"></span> Points de vente</span>
  491. </button>
  492. <div class="info-step" v-if="pointSaleActive">
  493. {{ pointSaleActive.name }}
  494. </div>
  495. </li>
  496. </script>