Vous ne pouvez pas sélectionner plus de 25 sujets Les noms de sujets doivent commencer par une lettre ou un nombre, peuvent contenir des tirets ('-') et peuvent comporter jusqu'à 35 caractères.

index.php 32KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485
  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. \backend\assets\VuejsDistributionIndexAsset::register($this);
  32. $this->setTitle('Distributions') ;
  33. $this->setPageTitle('Distributions') ;
  34. ?>
  35. <div id="app-distribution-index">
  36. <?php if(strlen($date)): ?>
  37. <span id="distribution-date"><?= $date; ?></span>
  38. <?php endif; ?>
  39. <div id="loading" v-if="showLoading">
  40. <img src="<?= Yii::$app->urlManagerBackend->getBaseUrl(); ?>/img/loader.gif" alt="Chargement ..." />
  41. </div>
  42. <div id="wrapper-app-distribution-index" :class="{'loaded': !loading}">
  43. <div class="col-md-4">
  44. <div id="calendar">
  45. <v-date-picker
  46. is-inline
  47. is-expanded
  48. v-model="date"
  49. popover-visibility="hidden"
  50. :mode="calendar.mode"
  51. :formats="calendar.formats"
  52. :theme-styles="calendar.themeStyles"
  53. :attributes="calendar.attrs"
  54. @dayclick='dayClicked'>
  55. ></v-date-picker>
  56. </div>
  57. <div class="clr"></div>
  58. </div>
  59. <div class="col-md-8">
  60. <div v-if="date">
  61. <div id="infos-top">
  62. <div class="col-md-12">
  63. <div class="info-box" id="info-box-distribution">
  64. <span :class="'info-box-icon '+(distribution.active ? 'bg-green' : 'bg-red')"><i :class="'fa '+(distribution.active ? 'fa-check' : 'fa-remove')"></i></span>
  65. <div class="info-box-content">
  66. <span class="info-box-text">
  67. <h4>Distribution du <strong>{{ dateFormat }}</strong></h4>
  68. <a @click="activeWeekDistribution" data-active="0" class="btn btn-default btn-active-week" v-if="oneDistributionWeekActive">Désactiver cette semaine</a>
  69. <a @click="activeWeekDistribution" data-active="1" class="btn btn-default btn-active-week" v-else>Activer cette semaine</a>
  70. <a @click="activeDistribution" data-active="0" class="btn btn-default" v-if="distribution.active">Désactiver ce jour</a>
  71. <a @click="activeDistribution" data-active="1" class="btn btn-default" v-else>Activer ce jour</a>
  72. </span>
  73. </div>
  74. </div>
  75. </div>
  76. <!-- produits -->
  77. <div class="col-md-6">
  78. <div class="info-box col-md-4">
  79. <span class="info-box-icon bg-yellow"><i class="fa fa-clone"></i></span>
  80. <div class="info-box-content">
  81. <span class="info-box-text">
  82. {{ countActiveProducts }} Produits<br /><br />
  83. <button class="btn btn-default" @click="showModalProducts = true">Configurer</button>
  84. </span>
  85. </div>
  86. </div>
  87. </div>
  88. <modal v-if="showModalProducts" id="modal-products" @close="showModalProducts = false">
  89. <h3 slot="header">Produits</h3>
  90. <div slot="body">
  91. <table class="table table-condensed table-bordered table-hover">
  92. <thead>
  93. <tr>
  94. <td>Actif</td>
  95. <td>Nom</td>
  96. <td class="quantity-ordered">Commandé</td>
  97. <td class="quantity-max">Maximum</td>
  98. </tr>
  99. </thead>
  100. <tbody>
  101. <tr v-for="product in products">
  102. <td>
  103. <button class="btn btn-success" v-if="product.productDistribution[0].active == 1"><span class="glyphicon glyphicon-ok"></span></button>
  104. <button class="btn btn-default" v-else data-active-product="1" :data-id-product="product.id" @click="productActiveClick"><span class="glyphicon glyphicon-ok"></span></button>
  105. <button class="btn btn-danger" v-if="product.productDistribution[0].active == 0"><span class="glyphicon glyphicon-remove"></span></button>
  106. <button class="btn btn-default" v-else data-active-product="0" :data-id-product="product.id" @click="productActiveClick"><span class="glyphicon glyphicon-remove"></span></button>
  107. </td>
  108. <td>{{ product.name }}</td>
  109. <td class="quantity-ordered">{{ product.quantity_ordered ? product.quantity_ordered : '-' }}</td>
  110. <td class="quantity-max"><input type="text" class="form-control quantity-max" placeholder="&infin;" :data-id-product="product.id" v-model="product.productDistribution[0].quantity_max" @keyup="productQuantityMaxChange" /></td>
  111. </tr>
  112. </tbody>
  113. </table>
  114. </div>
  115. </modal>
  116. <div class="col-md-6">
  117. <div class="info-box col-md-4">
  118. <span class="info-box-icon bg-yellow"><i class="fa fa-map-marker"></i></span>
  119. <div class="info-box-content">
  120. <span class="info-box-text">
  121. {{ countActivePointsSale }} Points de vente<br /><br />
  122. <button class="btn btn-default" @click="showModalPointsSale = true">Configurer</button>
  123. </span>
  124. </div>
  125. </div>
  126. </div>
  127. <modal v-if="showModalPointsSale" id="modal-points-sale" @close="showModalPointsSale = false">
  128. <h3 slot="header">Points de vente</h3>
  129. <div slot="body">
  130. <table class="table table-condensed table-bordered table-hover">
  131. <thead>
  132. <tr>
  133. <td>Actif</td>
  134. <td>Nom</td>
  135. </tr>
  136. </thead>
  137. <tbody>
  138. <tr v-for="pointSale in pointsSale">
  139. <td>
  140. <button class="btn btn-success" v-if="pointSale.pointSaleDistribution[0].delivery == 1"><span class="glyphicon glyphicon-ok"></span></button>
  141. <button class="btn btn-default" v-else data-delivery-point-sale="1" :data-id-point-sale="pointSale.id" @click="pointSaleActiveClick"><span class="glyphicon glyphicon-ok"></span></button>
  142. <button class="btn btn-danger" v-if="pointSale.pointSaleDistribution[0].delivery == 0"><span class="glyphicon glyphicon-remove"></span></button>
  143. <button class="btn btn-default" v-else data-delivery-point-sale="0" :data-id-point-sale="pointSale.id" @click="pointSaleActiveClick"><span class="glyphicon glyphicon-remove"></span></button>
  144. </td>
  145. <td>{{ pointSale.name }}</td>
  146. </tr>
  147. </tbody>
  148. </table>
  149. </div>
  150. </modal>
  151. <div class="col-md-6">
  152. <div id="summary-ca-weight" class="info-box col-md-4">
  153. <span class="info-box-icon bg-yellow"><i class="fa fa-euro"></i></span>
  154. <div class="info-box-content">
  155. <span class="info-box-text">CA</span>
  156. <span class="info-box-number">{{ distribution.revenues }} € <span class="normal">/ {{ distribution.potential_revenues }} €</span></span>
  157. <span class="info-box-text">Poids</span>
  158. <span class="info-box-number">{{ distribution.weight }} kg <span class="normal">/ {{ distribution.potential_weight }} kg</span></span>
  159. </div>
  160. </div>
  161. </div>
  162. <div class="col-md-6">
  163. <div class="info-box col-md-4">
  164. <span class="info-box-icon bg-yellow"><i class="fa fa-download"></i></span>
  165. <div class="info-box-content">
  166. <span class="info-box-text">
  167. {{ countOrders }} Commande<span v-if="countOrders > 1">s</span><br /><br />
  168. <a href="#" class="btn btn-default" disabled="disabled" v-if="countOrders == 0">Télécharger (PDF)</a>
  169. <a :href="distribution.url_report" class="btn btn-default" v-else>Télécharger (PDF)</a>
  170. </span>
  171. </div>
  172. </div>
  173. </div>
  174. </div>
  175. </div>
  176. <div class="callout callout-info" v-else>
  177. <h4><i class="fa fa-info"></i> Pour commencer</h4>
  178. <p>Veuillez choisir une date de distribution.</p>
  179. </div>
  180. </div>
  181. <div class="clr"></div>
  182. <div id="orders" class="panel panel-default" v-if="date">
  183. <div class="panel-heading">
  184. <h3 class="panel-title">Commandes <label class="label label-success" v-if="orders.length">{{ orders.length }}</label><label class="label label-danger" v-else>0</label></h3>
  185. </div>
  186. <div class="panel-body">
  187. <button id="btn-add-order" @click="showModalFormOrderCreate = true" class="btn btn-primary btn-xs"><span class="glyphicon glyphicon-plus"></span> Ajouter une commande</button>
  188. <order-form
  189. v-if="showModalFormOrderCreate"
  190. :date="date"
  191. :order="orderCreate"
  192. :points-sale="pointsSale"
  193. :users="users"
  194. :products="products"
  195. @close="showModalFormOrderCreate = false"
  196. @ordercreatedupdated="orderCreatedUpdated"
  197. ></order-form>
  198. <div id="wrapper-nav-points-sale">
  199. <ul id="nav-points-sale">
  200. <li data-id-point-sale="0" data-id-point-sale="0" v-if="countActivePointsSale > 1" @click="pointSaleClick">
  201. <a class="btn btn-default btn-primary" v-if="idActivePointSale == 0">Tous <span class="label label-default">{{ orders.length }}</span> <span class="glyphicon glyphicon-triangle-bottom"></span></a>
  202. <a class="btn btn-default" v-else>Tous <span class="label label-default">{{ orders.length }}</span><span class="glyphicon glyphicon-triangle-bottom"></span></a>
  203. </li>
  204. <li v-for="pointSale in pointsSale" :data-id-point-sale="pointSale.id" v-if="pointSale.pointSaleDistribution[0].delivery == 1" @click="pointSaleClick">
  205. <a class="btn btn-default btn-primary" v-if="idActivePointSale == pointSale.id">{{ pointSale.name }} <span class="label label-default">{{ countOrdersByPointSale[pointSale.id] }}</span><span class="glyphicon glyphicon-triangle-bottom"></span></a>
  206. <a class="btn btn-default" v-else>{{ pointSale.name }} <span class="label label-default">{{ countOrdersByPointSale[pointSale.id] }}</span><span class="glyphicon glyphicon-triangle-bottom"></span></a>
  207. </li>
  208. </ul>
  209. <div class="clr"></div>
  210. </div>
  211. <table class="table table-condensed table-bordered table-hover" v-if="countOrdersByPointSale[idActivePointSale] > 0 || (idActivePointSale == 0 && orders.length > 0)">
  212. <tbody>
  213. <template v-for="order in orders" v-if="idActivePointSale == 0 || idActivePointSale == order.id_point_sale">
  214. <tr>
  215. <td>
  216. <label class="label label-success" v-if="order.origin == 'user'">client</label>
  217. <label class="label label-default" v-else-if="order.origin == 'auto'">auto</label>
  218. <label class="label label-warning" v-else>admin</label>
  219. </td>
  220. <td>
  221. <span v-if="order.user">{{ order.user.name +' '+order.user.lastname }}</span>
  222. <span v-else>{{ order.username }}</span>
  223. </td>
  224. <td v-if="idActivePointSale == 0">
  225. {{ order.pointSale.name }}
  226. </td>
  227. <td>{{ order.amount.toFixed(2).replace(/(\d)(?=(\d{3})+(?:\.\d+)?$)/g, "$1,")+' €' }}</td>
  228. <td>
  229. <span class="label label-success" v-if="order.amount_paid == order.amount">payé</span>
  230. <span class="label label-default" v-else-if="order.amount_paid == 0">non réglé</span>
  231. <span class="label label-default" v-else-if="order.amount_paid > order.amount">surplus</span>
  232. <span class="label label-warning" v-else-if="order.amount_paid < order.amount">reste à payer</span>
  233. </td>
  234. <td>
  235. <span class="label label-danger" v-if="order.date_delete">annulée</span>
  236. <span class="label label-warning" v-if="order.date_update">modifiée</span>
  237. </td>
  238. <td class="column-actions">
  239. <a class="btn btn-default" :href="baseUrl+'/subscription/update?id='+order.id_subscription" v-if="order.id_subscription > 0"><span class="glyphicon glyphicon-repeat"></span></a>
  240. <button class="btn btn-default" :data-id-order="order.id" @click="orderViewClick"><span :class="'glyphicon ' + ((showViewProduct && idOrderView == order.id) ? 'glyphicon-eye-close' : 'glyphicon-eye-open')"></span></button>
  241. <button class="btn btn-default" :data-id-order="order.id" @click="orderPaymentModalClick" v-show="order.user"><span class="glyphicon glyphicon-euro"></span></button>
  242. <button class="btn btn-default" :data-id-order="order.id" @click="updateOrderClick"><span class="glyphicon glyphicon-pencil"></span></button>
  243. <button class="btn btn-default" :data-id-order="order.id" @click="deleteOrderClick"><span class="glyphicon glyphicon-trash"></span></button>
  244. <order-form
  245. v-if="showModalFormOrderUpdate && idOrderUpdate == order.id"
  246. :date="date"
  247. :id-point-sale="idActivePointSale"
  248. :points-sale="pointsSale"
  249. :users="users"
  250. :products="products"
  251. :order="order"
  252. @close="showModalFormOrderUpdate = false"
  253. @ordercreatedupdated="orderCreatedUpdated"
  254. ></order-form>
  255. <modal v-if="showModalPayment && idOrderPayment == order.id" class="modal-payment" @close="showModalPayment = false">
  256. <h3 slot="header">
  257. Commande du <strong>{{ dateFormat }}</strong> &gt;
  258. <strong><span v-if="order.user">{{ order.user.name +' '+order.user.lastname }}</span>
  259. <span v-else>{{ order.username }}</span></strong>
  260. </h3>
  261. <div slot="body">
  262. <div class="col-md-4">
  263. <div class="info-box">
  264. <span :class="'info-box-icon ' +((order.amount_paid == order.amount) ? 'bg-green' : 'bg-red')"><i class="fa fa-check"></i></span>
  265. <div class="info-box-content">
  266. <span class="info-box-text">Montant</span>
  267. <span class="info-box-number">{{ order.amount.toFixed(2).replace(/(\d)(?=(\d{3})+(?:\.\d+)?$)/g, "$1,")+' €' }}</span>
  268. <span class="info-box-text">
  269. Statut<br />
  270. <span class="label label-success" v-if="order.amount_paid == order.amount">payé</span>
  271. <span class="label label-default" v-else-if="order.amount_paid == 0">non réglé</span>
  272. <span class="label label-default" v-else-if="order.amount_paid > order.amount">surplus</span>
  273. <span class="label label-warning" v-else-if="order.amount_paid < order.amount">reste à payer</span>
  274. </span>
  275. </div>
  276. </div>
  277. <div class="info-box">
  278. <span :class="'info-box-icon ' +((order.user.credit > 0) ? 'bg-green' : 'bg-red')"><i class="fa fa-user"></i></span>
  279. <div class="info-box-content">
  280. <span class="info-box-text">Crédit utilisateur</span>
  281. <span class="info-box-number">{{ order.user.credit.toFixed(2).replace(/(\d)(?=(\d{3})+(?:\.\d+)?$)/g, "$1,")+' €' }}</span>
  282. </div>
  283. </div>
  284. <button v-if="order.amount_paid == order.amount"
  285. class="btn btn-default"
  286. :data-amount="order.amount"
  287. data-type="refund"
  288. @click="orderPaymentClick" >
  289. <span class="glyphicon glyphicon-chevron-right"></span>
  290. Rembourser {{ order.amount.toFixed(2).replace(/(\d)(?=(\d{3})+(?:\.\d+)?$)/g, "$1,")+' €' }}
  291. </button>
  292. <button v-else-if="order.amount_paid == 0"
  293. class="btn btn-default"
  294. :data-amount="order.amount"
  295. data-type="payment"
  296. @click="orderPaymentClick">
  297. <span class="glyphicon glyphicon-chevron-right"></span>
  298. Payer {{ order.amount.toFixed(2).replace(/(\d)(?=(\d{3})+(?:\.\d+)?$)/g, "$1,")+' €' }}
  299. </button>
  300. <button v-else-if="order.amount_paid > order.amount"
  301. class="btn btn-default"
  302. :data-amount="order.amount_surplus"
  303. data-type="refund"
  304. @click="orderPaymentClick">
  305. <span class="glyphicon glyphicon-chevron-right"></span>
  306. Rembourser {{ order.amount_surplus.toFixed(2).replace(/(\d)(?=(\d{3})+(?:\.\d+)?$)/g, "$1,")+' €' }}
  307. </button>
  308. <button v-else-if="order.amount_paid < order.amount"
  309. class="btn btn-default"
  310. :data-amount="order.amount_remaining"
  311. data-type="payment"
  312. @click="orderPaymentClick">
  313. <span class="glyphicon glyphicon-chevron-right"></span>
  314. Payer le restant {{ order.amount_remaining.toFixed(2).replace(/(\d)(?=(\d{3})+(?:\.\d+)?$)/g, "$1,")+' €' }}
  315. </button>
  316. </div>
  317. <div class="col-md-8">
  318. <h4>Historique paiement</h4>
  319. <table class="table table-condensed table-bordered table-hover">
  320. <thead>
  321. <tr>
  322. <td>Date</td>
  323. <td>Utilisateur</td>
  324. <td>Action</td>
  325. <td>- Débit</td>
  326. <td>+ Crédit</td>
  327. </tr>
  328. </thead>
  329. <tbody>
  330. <tr v-for="creditHistory in order.creditHistory">
  331. <td>{{ creditHistory.date }}</td>
  332. <td>{{ creditHistory.user_action }}</td>
  333. <td v-html="creditHistory.wording"></td>
  334. <td v-html="creditHistory.debit"></td>
  335. <td v-html="creditHistory.credit"></td>
  336. </tr>
  337. </tbody>
  338. </table>
  339. </div>
  340. </div>
  341. </modal>
  342. </td>
  343. </tr>
  344. <tr class="view" v-if="showViewProduct && idOrderView == order.id">
  345. <td colspan="6">
  346. <strong><span class="glyphicon glyphicon-menu-right"></span> Produits</strong>
  347. <ul>
  348. <li v-for="product in products" v-if="order.productOrder[product.id] > 0">
  349. {{ order.productOrder[product.id] }} x {{ product.name }}
  350. </li>
  351. </ul>
  352. </td>
  353. </tr>
  354. </template>
  355. </tbody>
  356. </table>
  357. <div class="alert alert-warning" v-else>
  358. Aucune commande
  359. </div>
  360. </div>
  361. </div>
  362. </div>
  363. </div>
  364. <!-- template for the order-form component -->
  365. <script type="text/x-template" id="order-form-template">
  366. <modal class="modal-form-order" @close="$emit('close')">
  367. <h3 slot="header">Ajouter une commande</h3>
  368. <div slot="body">
  369. <div class="callout callout-warning" v-if="errors.length">
  370. <ul>
  371. <li v-for="error in errors">{{ error }}</li>
  372. </ul>
  373. </div>
  374. <div class="col-md-4">
  375. <div class="form-group">
  376. <label class="control-label" for="select-id-point-sale">Point de vente</label>
  377. <select class="form-control" id="select-id-point-sale" v-model="order.id_point_sale">
  378. <option v-for="pointSale in pointsSale" v-if="pointSale.pointSaleDistribution[0].delivery == 1" :value="pointSale.id">{{ pointSale.name }}</option>
  379. </select>
  380. </div>
  381. <div class="form-group">
  382. <label class="control-label" for="select-id-user">Utilisateur</label>
  383. <select class="form-control" v-model="order.id_user">
  384. <option v-for="user in users" :value="user.id_user">{{ user.name +' '+ user.lastname }}</option>
  385. </select>
  386. <input v-model="order.username" type="text" class="form-control" placeholder="Ou saisissez ici le nom de l'utilisateur" />
  387. </div>
  388. <div class="form-group">
  389. <label class="control-label" for="textarea-comment">Commentaire</label>
  390. <textarea class="form-control" id="textarea-comment" v-model="order.comment"></textarea>
  391. </div>
  392. </div>
  393. <div class="col-md-8">
  394. <label class="control-label">Produits</label>
  395. <table class="table table-condensed table-bordered table-hover table-products">
  396. <tbody>
  397. <tr v-for="product in products" :class="(order.productOrder[product.id] > 0) ? 'product-ordered' : ''">
  398. <td>
  399. <span class="label label-success" v-if="product.productDistribution[0].active == 1">Actif</span>
  400. <span class="label label-danger" v-else>Inactif</span>
  401. </td>
  402. <td>{{ product.name }}</td>
  403. <td class="quantity">
  404. <div class="input-group">
  405. <span class="input-group-btn">
  406. <button class="btn btn-default btn-moins" type="button" @click="productQuantityClick(product.id, -1)"><span class="glyphicon glyphicon-minus"></span></button>
  407. </span>
  408. <input type="text" v-model="order.productOrder[product.id]" class="form-control" />
  409. <span class="input-group-btn">
  410. <button class="btn btn-default btn-plus" type="button" @click="productQuantityClick(product.id, 1)"><span class="glyphicon glyphicon-plus"></span></button>
  411. </span>
  412. </div>
  413. </td>
  414. <td class="quantity-remaining">/ {{ product.quantity_remaining }}</td>
  415. </tr>
  416. </tbody>
  417. </table>
  418. </div>
  419. </div>
  420. <div slot="footer">
  421. <div class="actions-form">
  422. <button class="modal-default-button btn btn-primary" @click="submitFormUpdate" v-if="order.id">Modifier</button>
  423. <button class="modal-default-button btn btn-primary" @click="submitFormCreate" v-else>Créer</button>
  424. <button class="modal-default-button btn btn-default" @click="$emit('close')">Annuler</button>
  425. </div>
  426. </div>
  427. </modal>
  428. </script>
  429. <!-- template for the modal component -->
  430. <script type="text/x-template" id="modal-template">
  431. <transition name="modal">
  432. <div class="modal-mask">
  433. <div class="modal-wrapper">
  434. <div class="modal-container">
  435. <div class="modal-header">
  436. <slot name="header"></slot>
  437. </div>
  438. <div class="modal-body">
  439. <slot name="body"></slot>
  440. </div>
  441. <div class="modal-footer">
  442. <slot name="footer">
  443. <button class="modal-default-button btn btn-default" @click="$emit('close')">Fermer</button>
  444. </slot>
  445. </div>
  446. </div>
  447. </div>
  448. </div>
  449. </transition>
  450. </script>