templates/DemandeAchatVue/demandeAchat.html.twig line 1

Open in your IDE?
  1. {% extends 'layoutachat.html.twig' %}
  3. {% block stylesheets2 %}
  5. <link rel="stylesheet" href="{{ asset('css/bootstrap-datepicker.min.css') }}" type="text/css" />
  8. <style type="text/css">
  10. .custom-shadow {
  11. box-shadow: 0 8px 20px rgba(0,0,0,0.15);
  12. border-radius: 10px;
  13. transition: all 0.3s ease;
  14. }
  16. .custom-shadow:hover {
  17. box-shadow: 0 12px 30px rgba(0,0,0,0.25);
  18. transform: translateY(-3px);
  19. }
  21. select {
  22. font-size: 13px;
  23. font-weight: 600;
  25. letter-spacing: 0.3px;
  26. }
  28. .police {
  29. font-size: 13px;
  30. font-weight: 600;
  32. letter-spacing: 0.3px;
  33. }
  34. .modal-dialog {
  35. max-width: 570px; /* ajuste ici */
  36. height: 600px; /* ajuste ici */
  37. }
  39. .modal .form-control {
  40. height: calc(1.5em + .4rem + 2px);
  41. padding: .2rem .4rem;
  42. font-size: 0.85rem;
  43. }
  44. .modal-right {
  45. margin: 0;
  46. margin-left: auto; /* pousse le modal à droite */
  47. margin-right: 10px; /* petit espace du bord */
  48. }
  49. .taille {color:#006666;}
  50. .vert {color:green;}
  51. .rouge {color:red;}
  53. #listecom{
  54. width:550px;
  55. height:400px;
  56. overflow:auto;
  57. }
  58. .cre{
  59. margin-left:0px;
  60. padding-left:0px;
  61. padding-right:0px;
  62. }
  63. .limit{
  64. border:solid 1px #CCCCCC;
  65. height:100px;
  66. margin-right:10px;
  67. background-color:#FFFFFFF;
  68. box-shadow: 1px 1px 1px #656565;
  69. }
  71. .taille2{
  72. font-size: 10px;
  73. }
  74. #parente {
  75. width:1200px;
  76. }
  77. #match3, #match, #match2 {
  78. max-width:400px;
  79. height:100px;
  80. overflow:auto;
  81. }
  82. #li{
  83. color: #FF0000;
  84. }
  85. #bol{
  86. color: #000099;
  87. }
  89. /* ── MODAL GLOBAL ── */
  90. #infos .modal-content {
  91. border: none !important;
  92. border-radius: 16px !important;
  93. box-shadow: 0 25px 60px rgba(0,0,0,.2) !important;
  94. overflow: hidden;
  95. font-family: 'Nunito', sans-serif;
  96. }
  98. /* ── HEADER ── */
  99. #infos .modal-header {
  100. background: linear-gradient(135deg, #0f2942 0%, #1d6fa4 100%) !important;
  101. border-bottom: none !important;
  102. padding: 1.1rem 1.4rem !important;
  103. display: flex !important;
  104. align-items: center !important;
  105. justify-content: space-between !important;
  106. }
  107. .modal-header-left {
  108. display: flex; align-items: center; gap: .75rem;
  109. }
  110. .modal-header-icon {
  111. width: 40px; height: 40px;
  112. background: rgba(255,255,255,.2); border-radius: 10px;
  113. display: flex; align-items: center; justify-content: center;
  114. font-size: 1rem; color: #fff; flex-shrink: 0;
  115. }
  116. #infos .modal-title {
  117. font-size: .95rem !important; font-weight: 800 !important;
  118. color: #fff !important; margin: 0 !important;
  119. }
  120. .modal-subtitle {
  121. font-size: .72rem; color: rgba(255,255,255,.65); margin: 0;
  122. }
  123. .close-btn {
  124. width: 32px; height: 32px; border-radius: 8px;
  125. background: rgba(255,255,255,.15); border: none; color: #fff;
  126. display: flex; align-items: center; justify-content: center;
  127. font-size: .9rem; cursor: pointer; transition: background .15s; flex-shrink: 0;
  128. }
  129. .close-btn:hover { background: rgba(255,255,255,.3); }
  131. /* ── BODY ── */
  132. #infos .modal-body {
  133. padding: 0 !important;
  134. background: #f8fafc;
  135. }
  137. /* ── FORM SECTIONS ── */
  138. .form-section {
  139. background: #fff;
  140. border-radius: 12px;
  141. margin: 1rem 1.25rem;
  142. padding: 1.1rem 1.25rem;
  143. box-shadow: 0 1px 6px rgba(0,0,0,.06);
  144. border: 1px solid #e2e8f0;
  145. }
  146. .form-section-title {
  147. font-size: .75rem; font-weight: 800; text-transform: uppercase;
  148. letter-spacing: .09em; color: #1d6fa4;
  149. display: flex; align-items: center; gap: .4rem;
  150. margin-bottom: 1rem; padding-bottom: .6rem;
  151. border-bottom: 1px solid #e2e8f0;
  152. }
  154. /* ── LABELS & INPUTS ── */
  155. .field-label {
  156. font-size: .79rem; font-weight: 700; color: #374151;
  157. margin-bottom: .3rem; display: block;
  158. }
  159. .required-star { color: #dc2626; font-weight: 800; }
  160. .optional-tag {
  161. font-size: .68rem; font-weight: 600; color: #94a3b8;
  162. background: #f1f5f9; padding: .1rem .4rem; border-radius: 4px; margin-left: .3rem;
  163. }
  165. .da-form .da-input,
  166. .da-form .form-control {
  167. border-radius: 8px !important;
  168. border: 1.5px solid #e2e8f0 !important;
  169. font-family: 'Nunito', sans-serif !important;
  170. font-size: .84rem !important;
  171. color: #1e293b !important;
  172. background: #fff !important;
  173. transition: border-color .2s, box-shadow .2s;
  174. height: calc(1.5em + .75rem + 4px);
  175. }
  176. .da-form .da-input:focus,
  177. .da-form .form-control:focus {
  178. border-color: #1d6fa4 !important;
  179. box-shadow: 0 0 0 3px rgba(29,111,164,.15) !important;
  180. outline: none !important;
  181. }
  182. .da-form textarea.da-input { height: auto !important; }
  183. .da-form select.da-input { cursor: pointer; }
  185. /* Input avec icône */
  186. .input-icon-wrap { position: relative; }
  187. .input-icon {
  188. position: absolute; left: .75rem; top: 50%;
  189. transform: translateY(-50%); color: #94a3b8; font-size: .8rem; z-index: 1;
  190. }
  191. .da-form .with-icon { padding-left: 2.1rem !important; }
  193. /* ── BOUTONS ACTION ── */
  194. .action-buttons {
  195. display: flex; flex-direction: column; gap: .4rem; align-items: stretch;
  196. }
  197. .btn-da {
  198. display: flex; align-items: center; justify-content: center; gap: .35rem;
  199. padding: .5rem .85rem; border-radius: 8px; font-size: .78rem;
  200. font-weight: 700; font-family: 'Nunito', sans-serif;
  201. border: none; cursor: pointer; transition: all .15s; white-space: nowrap;
  202. }
  203. .btn-da-primary {
  204. background: linear-gradient(135deg, #0f2942, #1d6fa4);
  205. color: #fff;
  206. }
  207. .btn-da-primary:hover { filter: brightness(1.1); transform: translateY(-1px); }
  208. .btn-da-secondary {
  209. background: #f1f5f9; color: #64748b;
  210. border: 1.5px solid #e2e8f0 !important;
  211. }
  212. .btn-da-secondary:hover { background: #e2e8f0; color: #334155; }
  214. /* ── RESPONSIVE ── */
  215. @media (max-width: 767px) {
  216. .form-section { margin: .75rem; padding: .85rem; }
  217. #infos .modal-dialog { margin: .5rem; }
  218. .action-buttons { flex-direction: row; }
  219. }
  222. </style>
  223. {% endblock %}
  225. {% block section %}
  228. <div class="container-fluid mt-2">
  230. <div class="card shadow-sm p-2 mb-3">
  232. <div class="d-flex flex-wrap align-items-center justify-content-between">
  234. <div>
  235. <img src="{{ asset('img/demachat.jpg') }}" width="35">
  236. <strong>DEMANDE D'ACHAT</strong>
  238. </div>
  240. <div class="btn-group flex-wrap">
  244. <button data-toggle="modal" href="#infos" class="btn btn-info btn-sm">
  245. ➕ Nouveau
  246. </button>
  247. &nbsp;&nbsp;
  248. {% if is_granted('ROLE_LOGIS') or is_granted('ROLE_DAPPM') %}
  249. <button data-toggle="modal" href="#inf33" class="btn btn-secondary btn-sm">
  250. 📄 DA PPM
  251. </button>
  252. {% endif %}
  253. &nbsp;&nbsp;
  254. <button data-toggle="modal" href="#pss" class="btn btn-secondary btn-sm">
  255. 📁 DA fichier
  256. </button>
  257. &nbsp;&nbsp;
  258. <a href="{{ path('reception_achat') }}" class="btn btn-secondary btn-sm">
  259. 📥 Réception
  260. </a>
  261. &nbsp;&nbsp;
  262. </div>
  264. </div>
  266. </div>
  268. </div>
  270. <div class="container-fluid">
  272. <div class="card p-3 shadow-sm mb-3">
  276. <!-- FILTRES -->
  277. <div class="row mt-2">
  281. <div class="col-md-4 mb-2">
  282. {{ form_widget(form6.user)}}
  283. <img id="loduse" src="{{ asset('img/loders.gif')}}" width="20">
  284. {{ form_widget(form6.listnum4)}}
  285. </div>
  287. <div class="col-md-4 mb-2">
  289. {{ form_widget(form8.usebaille)}}
  290. <img id="lodbail" src="{{ asset('img/loders.gif')}}" width="20">
  291. {{ form_widget(form8.listnum6)}}
  292. </div>
  293. <div class="col-md-2 mb-2">
  294. {{ form_widget(form110.listnum55) }}
  295. </div>
  297. </div>
  299. </div>
  301. </div>
  303. <div class="container-fluid">
  305. <div class="row text-center">
  307. <div class="col-6 col-md-2 mb-2">
  308. <div class="card p-3 custom-shadow text-center">
  310. <div class=" police" >Mes DAs</div>
  311. <span class=" taille" > <h3>{{ nbmesda }}</h3></span>
  313. <form id="monlistnum9" action="{{ path('mstopes_gestion_demande_achat') }}" method="post">
  314. <div class="mt-2">
  315. {{ form_widget(form9.listnum9) }}
  316. </div>
  317. </form>
  319. </div>
  320. </div>
  321. <div class="col-6 col-md-2 mb-2">
  322. <div class="card p-3 custom-shadow">
  323. <div class=" police">DA à mon niveau</div>
  324. <h3>{{ nbdanivo }}</h3>
  326. <form id="monlistnum2" action="{{ path('mstopes_gestion_demande_achat') }}" method="post">
  327. <div class="mt-2">
  328. {{ form_widget(form4.listnum2) }}
  329. </div>
  330. </form>
  332. </div>
  333. </div>
  335. <div class="col-6 col-md-2 mb-2">
  336. <div class="card p-3 custom-shadow">
  337. <div class=" police">DAs que j'ai Validé</div>
  338. <span class="vert" > <h3>{{ nbdavalid }}</h3> </span >
  340. <form id="monlistnum3" action="{{ path('mstopes_gestion_demande_achat') }}" method="post">
  341. <div class="mt-2">
  342. {{ form_widget(form5.listnum3) }}
  343. </div>
  344. </form>
  345. </div>
  346. </div>
  348. <div class="col-6 col-md-2 mb-2">
  349. <div class="card p-3 custom-shadow">
  350. <div class=" police">DAs que j'ai Rejeté</div>
  351. <span class="rouge" > <h3>{{ nbdarejet }}</h3> </span>
  353. <form id="monlistnum7" action="{{ path('mstopes_gestion_demande_achat') }}" method="post">
  354. <div class="mt-2">
  355. {{ form_widget(form7.listnum7) }}
  356. </div>
  357. </form>
  358. </div>
  359. </div>
  360. {% if is_granted('ROLE_VU_ALL') %}
  361. <div class="col-6 col-md-2 mb-2">
  362. <div class="card p-3 custom-shadow">
  363. <div class=" police">Toute DAs </div>
  364. <span > <h3>{{ nballda }}</h3> </span>
  366. <div class="mt-2">
  367. {{ form_widget(form2.listnum)}}
  368. </div>
  369. </div>
  370. </div>
  371. <div class="col-6 col-md-2 mb-2">
  372. <div class="card p-3 custom-shadow">
  373. <div class=" police">- </div>
  374. <span > <h3>-</h3> </span>
  376. <div class="mt-2">
  377. -
  378. </div>
  379. </div>
  380. </div>
  381. {% endif %}
  382. </div>
  383. </div>
  386. <!-- TABLE / CONTENU -->
  387. <div class=" mt-1" align="center">
  389. <img src="{{ asset('img/load.gif')}}" id="load" />
  390. <div id="liste">
  393. </div>
  394. </div>
  396. {# ── MODAL : Créer une DA ── #}
  397. <div class="modal fade" id="infos" tabindex="-1" role="dialog" aria-labelledby="infosLabel" aria-hidden="true">
  398. <div class="modal-dialog modal-lg modal-dialog-centered modal-dialog-scrollable" role="document">
  399. <div class="modal-content">
  401. {# ── HEADER ── #}
  402. <div class="modal-header">
  403. <div class="modal-header-left">
  404. <div class="modal-header-icon">
  405. <i class="fas fa-file-alt"></i>
  406. </div>
  407. <div>
  408. <h5 class="modal-title" id="infosLabel">Créer une Demande d'Achat</h5>
  409. <p class="modal-subtitle">Remplissez les champs obligatoires <span class="required-star">*</span></p>
  410. </div>
  411. </div>
  412. <button type="button" class="close-btn" data-dismiss="modal" aria-label="Close">
  413. <i class="fas fa-times"></i>
  414. </button>
  415. </div>
  417. {# ── BODY ── #}
  418. <div class="modal-body">
  420. {{ form_start(form, {
  421. 'action': path('mstopes_gestion_demande_achat'),
  422. 'attr': {'id': 'monForms', 'class': 'da-form'}
  423. }) }}
  425. {# ── Section : Informations générales ── #}
  426. <div class="form-section">
  427. <div class="form-section-title">
  428. <i class="fas fa-info-circle"></i> Informations générales
  429. </div>
  430. <div class="form-row">
  432. <div class="form-group col-md-6">
  433. <label class="field-label">
  434. Région <span class="required-star">*</span>
  435. </label>
  436. {{ form_widget(form.region1, {'attr': {'class': 'form-control da-input'}}) }}
  437. </div>
  439. <div class="form-group col-md-6">
  440. <label class="field-label">Objet</label>
  441. {{ form_widget(form.obje, {'attr': {'class': 'form-control da-input'}}) }}
  442. </div>
  444. <div class="form-group col-md-6">
  445. <label class="field-label">
  446. Centre de Coût <span class="required-star">*</span>
  447. </label>
  448. {{ form_widget(form.centreCou, {'attr': {'class': 'form-control da-input'}}) }}
  449. </div>
  451. <div class="form-group col-md-6">
  452. <label class="field-label">
  453. Nom du Projet <span class="required-star">*</span>
  454. </label>
  455. {{ form_widget(form.baille, {'attr': {'class': 'form-control da-input'}}) }}
  456. </div>
  458. </div>
  459. </div>
  461. {# ── Section : Détails de la commande ── #}
  462. <div class="form-section">
  463. <div class="form-section-title">
  464. <i class="fas fa-shopping-cart"></i> Détails de la commande
  465. </div>
  466. <div class="form-row">
  468. <div class="form-group col-md-6">
  469. <label class="field-label">Délais de livraison souhaité</label>
  470. {{ form_widget(form.delais, {'attr': {'class': 'form-control da-input', 'autocomplete': 'off' }}) }}
  471. </div>
  473. <div class="form-group col-md-6">
  474. <label class="field-label">
  475. Quantité demandée <span class="required-star">*</span>
  476. </label>
  477. {{ form_widget(form.quantDemand, {'attr': {'class': 'form-control da-input', 'min': '1'}}) }}
  478. </div>
  480. <div class="form-group col-md-6">
  481. <label class="field-label">
  482. Prix Unitaire <span class="required-star">*</span>
  483. </label>
  484. <div class="input-icon-wrap">
  485. <i class="fas fa-coins input-icon"></i>
  486. {{ form_widget(form.prixUnit, {'attr': {'class': 'form-control da-input with-icon'}}) }}
  487. </div>
  488. </div>
  490. <div class="form-group col-md-6">
  491. <label class="field-label">Description <span class="optional-tag">Optionnel</span></label>
  492. {{ form_widget(form.descript, {'attr': {'class': 'form-control da-input', 'rows': '2'}}) }}
  493. </div>
  495. </div>
  496. </div>
  498. {# ── Section : Désignation ── #}
  499. <div class="form-section">
  500. <div class="form-section-title">
  501. <i class="fas fa-tag"></i> Désignation de l'article
  502. </div>
  503. <div class="form-row align-items-end">
  505. <div class="form-group col-md-9 mb-0">
  506. <label class="field-label">
  507. Désignation <span class="required-star">*</span>
  508. </label>
  509. <div style="position:relative;">
  510. <i class="fas fa-search" style="position:absolute;left:.75rem;top:50%;transform:translateY(-50%);color:#94a3b8;font-size:.8rem;z-index:1;"></i>
  511. {{ form_widget(form.designrech, {
  512. 'attr': {
  513. 'class': 'form-control da-input',
  514. 'style': 'padding-left:2.1rem;',
  515. 'autocomplete': 'off',
  516. 'placeholder': 'Rechercher une désignation…'
  517. }
  518. }) }}
  519. </div>
  520. <div id="match" class="mt-1"></div>
  521. </div>
  523. <div class="form-group col-md-3 mb-0">
  524. <div class="action-buttons">
  525. <img id="loders" src="{{ asset('img/loders.gif')}}" width="32"
  526. style="display:none; margin-bottom:.4rem;">
  527. <button type="submit" id="but" class="btn-da btn-da-primary">
  528. <i class="fas fa-plus-circle"></i> Ajouter
  529. </button>
  530. <button type="button" id="but2" class="btn-da btn-da-secondary">
  531. <i class="fas fa-plus"></i> Ajouter
  532. </button>
  533. </div>
  534. </div>
  536. </div>
  537. </div>
  539. {{ form_end(form, {'render_rest': false}) }}
  541. </div>{# end modal-body #}
  543. </div>
  544. </div>
  545. </div>
  547. <div class="modal fade" id="inf33" tabindex="-1" role="dialog" aria-labelledby="inf33Label" aria-hidden="true">
  548. <div class="modal-dialog modal-lg modal-dialog-centered modal-dialog-scrollable" modal-right" role="document">
  549. <div class="modal-content">
  551. <!-- HEADER -->
  552. <div class="modal-header">
  553. <h5 class="modal-title" id="inf33Label">Ajouter un item</h5>
  554. <button type="button" class="close" data-dismiss="modal">
  555. <span>&times;</span>
  556. </button>
  557. </div>
  559. <!-- BODY -->
  560. <div class="modal-body">
  562. {{ form_start(form33, {
  563. 'action': path('mstopes_gestion_demande_achat'),
  564. 'attr': {'id': 'monFormul33', 'class': 'monForm'}
  565. }) }}
  567. <div class="container-fluid">
  568. <div class="form-row">
  570. <div class="form-group col-md-6">
  571. <label>Objet</label>
  572. {{ form_widget(form33.obje2, {'attr': {'class': 'form-control'}}) }}
  573. </div>
  575. <div class="form-group col-md-6">
  576. <label>Nom de Projet</label>
  577. {{ form_widget(form33.baille2, {'attr': {'class': 'form-control'}}) }}
  578. </div>
  580. <div class="form-group col-md-6">
  581. <label>Quantité Demandée</label>
  582. {{ form_widget(form33.quantd2, {'attr': {'class': 'form-control'}}) }}
  583. </div>
  585. <div class="form-group col-md-6">
  586. <label>Prix Unitaire</label>
  587. {{ form_widget(form33.prixUni2, {'attr': {'class': 'form-control'}}) }}
  588. </div>
  590. <div class="form-group col-md-6">
  591. <label>Designation</label>
  592. {{ form_widget(form33.design2, {
  593. 'attr': {
  594. 'class': 'form-control ui-autocomplete-input',
  595. 'autocomplete': 'off'
  596. }
  597. }) }}
  598. <div id="match3" class="mt-1"></div>
  599. </div>
  603. <div class="form-group col-md-6">
  604. <label>Description</label>
  605. {{ form_widget(form33.descrip2, {'attr': {'class': 'form-control'}}) }}
  606. </div>
  608. </div>
  609. </div>
  611. <!-- FOOTER -->
  612. <div class="d-flex justify-content-between align-items-center mt-3">
  613. <img id="loa" src="{{ asset('img/loders.gif')}}" width="50">
  615. <div>
  616. <button type="submit" id="button" class="btn btn-primary">
  617. Ajouter Item
  618. </button>
  619. <button type="button" id="button2" class="btn btn-secondary">
  620. Ajouter Item
  621. </button>
  622. </div>
  623. {{ form_end(form, {'render_rest': false}) }}
  624. </div>
  628. </div>
  629. </div>
  630. </div>
  631. </div>
  635. <div class="modal fade" id="pss" tabindex="-1" role="dialog" aria-labelledby="pssLabel" aria-hidden="true">
  636. <div class="modal-dialog modal-dialog-centered" role="document">
  637. <div class="modal-content">
  639. <!-- HEADER -->
  640. <div class="modal-header">
  641. <h5 class="modal-title" id="pssLabel">Importer un fichier</h5>
  643. <!-- Bouton télécharger -->
  644. <a href="{{ path('download_file_DA', {'id_ap': admin.images.id}) }}"
  645. class="btn btn-info btn-sm ml-3">
  646. Télécharger modèle
  647. </a>
  649. <button type="button" class="close ml-auto" data-dismiss="modal">
  650. <span>&times;</span>
  651. </button>
  652. </div>
  654. <!-- BODY -->
  655. <div class="modal-body">
  657. {{ form_start(form01, {
  658. 'action': path('mstopes_gestion_demande_achat'),
  659. 'attr': {'id': 'monForms', 'class': 'monForm'}
  660. }) }}
  662. <div class="form-group">
  663. {{ form_widget(form01.fiche, {'attr': {'class': 'form-control-file'}}) }}
  664. </div>
  666. <!-- FOOTER -->
  667. <div class="d-flex justify-content-center">
  668. <button type="submit" class="btn btn-primary">
  669. OK
  670. </button>
  671. </div>
  673. {{ form_end(form, {'render_rest': false}) }}
  675. </div>
  676. </div>
  677. </div>
  678. </div>
  679. <div class="modal fade" id="inf" tabindex="-1" role="dialog" aria-labelledby="infLabel" aria-hidden="true">
  680. <div class="modal-dialog modal-lg modal-dialog-centered modal-dialog-scrollable" role="document">
  681. <div class="modal-content">
  683. <!-- HEADER -->
  684. <div class="modal-header">
  685. <h5 class="modal-title" id="infLabel">Modifier / Ajouter</h5>
  686. <button type="button" class="close" data-dismiss="modal">
  687. <span>&times;</span>
  688. </button>
  689. </div>
  691. <!-- BODY -->
  692. <div class="modal-body">
  694. {{ form_start(form3, {
  695. 'action': path('mstopes_gestion_demande_achat'),
  696. 'attr': {'id': 'monFormul', 'class': 'monForm'}
  697. }) }}
  699. <div class="container-fluid">
  700. <div class="form-row">
  702. <div class="form-group col-md-6">
  703. <label>Nom de Projet</label>
  704. {{ form_widget(form3.bailleu, {'attr': {'class': 'form-control'}}) }}
  705. </div>
  707. <div class="form-group col-md-6">
  708. <label>Centre Cout</label>
  709. {{ form_widget(form3.centreCo, {'attr': {'class': 'form-control'}}) }}
  710. </div>
  712. <div class="form-group col-md-6">
  713. <label>Quantité Demandée</label>
  714. {{ form_widget(form3.quantd, {'attr': {'class': 'form-control'}}) }}
  715. </div>
  717. <div class="form-group col-md-6">
  718. <label>Prix Unitaire</label>
  719. {{ form_widget(form3.prixUni, {'attr': {'class': 'form-control'}}) }}
  720. </div>
  721. <div class="form-group col-md-6">
  722. <label>Description</label>
  723. {{ form_widget(form3.descrip, {'attr': {'class': 'form-control'}}) }}
  724. </div>
  725. <div class="form-group col-md-10">
  726. <label>Designation</label>
  727. {{ form_widget(form3.design, {
  728. 'attr': {
  729. 'class': 'form-control ui-autocomplete-input',
  730. 'autocomplete': 'off'
  731. }
  732. }) }}
  733. <div id="match2" class="mt-1"></div>
  734. </div>
  735. <div class="form-group col-md-2">
  736. <img id="lodes" src="{{ asset('img/loders.gif')}}" width="50">
  738. <button type="submit" id="buton" class="btn btn-primary"> Valider </button>
  739. </div>
  742. </div>
  743. </div>
  745. <!-- FOOTER -->
  746. <div class="d-flex justify-content-between align-items-center mt-3">
  748. </div>
  750. {{ form_end(form, {'render_rest': false}) }}
  752. </div>
  753. </div>
  754. </div>
  755. </div>
  756. {% endblock %}
  758. {% block js %}
  759. <script type="text/javascript" src="{{ asset('js/bootstrap-datepicker.min.js')}}"></script>
  760. <script type="text/javascript" src="{{ asset('js/da-offline.js') }}"></script>
  761. <script>
  762. DAOffline.init({
  763. routes: {
  764. ajouterTemp : '{{ path("api_da_ajouter_temp") }}',
  765. ajoutDesign : '{{ path("api_da_ajout_design_temp") }}',
  766. daEnvoyer : '{{ path("api_da_envoyer") }}',
  767. importExcel : '{{ path("api_da_import_excel") }}',
  768. }
  769. });
  770. </script>
  772. <script>
  773. /**
  774. * Mise en cache des données de référence pour le mode offline
  775. * (catalogue, centres de coût, bailleurs)
  776. * Exécuté une fois à chaque visite online, stocke dans IndexedDB
  777. */
  778. (async function cacheReferences() {
  780. if (!navigator.onLine) return;
  781. if (!('indexedDB' in window)) return;
  783. // Ne rafraîchir que toutes les 12h maximum
  784. const lastCache = localStorage.getItem('da_references_cached_at');
  785. if (lastCache) {
  786. const diff = Date.now() - parseInt(lastCache);
  787. if (diff < 12 * 60 * 60 * 1000) return; // moins de 12h → skip
  788. }
  790. try {
  791. const resp = await fetch('{{ path("api_da_references") }}', {
  792. credentials: 'include'
  793. });
  794. if (!resp.ok) return;
  796. const data = await resp.json();
  797. if (!data.success) return;
  799. // Ouvrir IndexedDB (même base que da-shell.html)
  800. const db = await new Promise((resolve, reject) => {
  801. const r = indexedDB.open('erp_da_offline', 2);
  802. r.onsuccess = e => resolve(e.target.result);
  803. r.onerror = () => reject();
  804. r.onupgradeneeded = e => {
  805. const d = e.target.result;
  807. // Stores avec keyPath 'localId' (cohérent avec da-offline.js)
  808. ['pending_temp', 'pending_envoi', 'pending_excel', 'brouillons_locaux'].forEach(name => {
  809. if (!d.objectStoreNames.contains(name))
  810. d.createObjectStore(name, { keyPath: 'localId', autoIncrement: true });
  811. });
  813. // Stores avec keyPath 'id' (pour les caches de référence)
  814. ['catalogue_cache', 'centrecout_cache', 'bailleur_cache'].forEach(name => {
  815. if (!d.objectStoreNames.contains(name))
  816. d.createObjectStore(name, { keyPath: 'id' });
  817. });
  818. };
  819. });
  821. // Fonction helper pour vider et repeupler un store
  822. async function replaceStore(storeName, items, keyField = 'id') {
  823. return new Promise((resolve, reject) => {
  824. const tx = db.transaction(storeName, 'readwrite');
  825. const store = tx.objectStore(storeName);
  826. store.clear();
  827. items.forEach(item => store.put(item));
  828. tx.oncomplete = resolve;
  829. tx.onerror = reject;
  830. });
  831. }
  833. // Normaliser les clés (Doctrine retourne parfois des indices numériques)
  834. const catalogue = data.catalogue.map(c => ({
  835. id : c.id,
  836. designation : c.designation,
  837. prix : 0, // ← 0 par défaut, sera saisi manuellement
  838. }));
  839. const centres = data.centres.map(c => ({
  840. id : c.id,
  841. libele: c.libele,
  842. }));
  844. const bailleurs = data.bailleurs.map(b => ({
  845. id : b.id,
  846. libele: b.libele,
  847. }));
  849. await Promise.all([
  850. replaceStore('catalogue_cache', catalogue),
  851. replaceStore('centrecout_cache', centres),
  852. replaceStore('bailleur_cache', bailleurs),
  853. ]);
  855. localStorage.setItem('da_references_cached_at', Date.now().toString());
  857. console.log('[DA Offline] Références mises en cache :',
  858. catalogue.length, 'articles,',
  859. centres.length, 'centres,',
  860. bailleurs.length, 'bailleurs'
  861. );
  863. } catch (e) {
  864. console.warn('[DA Offline] Impossible de mettre les références en cache:', e);
  865. }
  867. })();
  868. </script>
  870. <script>
  871. $(document).ready(function() {
  872. $('#but').click(function(e)
  873. { e.preventDefault();
  876. var region = $('#form_region1').val();
  879. // Vérifie si le champ est vide
  880. if (!region.trim()) {
  881. $('#form_region1').focus();
  882. return false;
  884. }
  886. var centreCou = $('#form_centreCou').val();
  889. // Vérifie si le champ est vide
  890. if (!centreCou.trim()) {
  891. $('#form_centreCou').focus();
  892. return false;
  894. }
  895. var baille = $('#form_baille').val();
  896. if (!baille.trim()) {
  897. $('#form_baille').focus();
  898. return false;
  900. }
  903. $("#but").prop("disabled",true);
  904. $("#loders").show();
  906. $.ajax({
  907. type : 'POST',
  909. url : '{{ path('ajouter_achat_temp')}}',
  911. data : 'centreCout=' + $("#form_centreCou").val()+
  912. '&bailleur=' + $("#form_baille").val()+
  915. '&quantDemand=' + $("#form_quantDemand").val()+
  916. '&prixUnit=' + $("#form_prixUnit").val()+
  917. '&obje=' + $("#form_obje").val()+
  918. '&delais=' + $("#form_delais").val()+
  919. '&descrip=' + $("#form_descript").val()+
  920. '&region=' + $("#form_region1").val()+
  921. '&iddesignrech=' + $("#form_designrech").val(),
  924. success: function(data)
  925. {
  927. alert('ajout effectué avec succes');
  928. $("#loders").hide();
  929. $("#but").hide();
  930. $("#but2").show();
  931. $("#obj").hide();
  933. $("#del").hide();
  934. $("#reg").hide();
  935. $("#form_quantDeman").val("");
  936. $("#form_prixUnit").val("");
  937. $("#form_designrech").val("");
  938. $("#form_descript").val("");
  939. $('#liste').html(data);
  944. }
  949. });
  955. });
  960. });
  964. </script>
  966. <script>
  968. $("#load").hide();
  969. $("#but2").hide();
  970. $("#loders").hide();
  971. $("#lodes").hide();
  972. $("#button2").hide();
  973. $("#loa").hide();
  974. $("#loduse").hide();
  975. $("#lodbail").hide();
  976. </script>
  979. <script>
  980. $("#load2").hide();
  981. </script>
  983. <script>
  984. $("#form_date1_day").hide();
  985. $("#form_date2_day").hide();
  986. </script>
  987. <script>
  988. $(document).ready(function() {
  990. $('#form_listnum').change(function()
  991. {
  992. $("#load").show();
  993. $.ajax({
  994. type : 'POST',
  996. url : '{{ path('ajax_liste_demachat')}}',
  998. data : 'listnum=' + $('#form_listnum').val(),
  1000. })
  1002. .done(function(response)
  1003. {
  1004. $("#load").hide();
  1005. $('#liste').html(response);
  1007. })
  1008. .fail(function(jqXHR, textStatus, errorThrown)
  1009. {
  1010. $("#load").hide();
  1011. alert('Error : ' + errorThrown);
  1012. });
  1014. return false;
  1018. });
  1019. });
  1020. </script>
  1022. <script>
  1024. $('#monFormul').submit(function(e)
  1025. { e.preventDefault();
  1026. $("#buton").prop("disabled",true);
  1027. $("#lodes").show();
  1028. $.ajax({
  1029. type : 'POST',
  1031. url : '{{ path('ajax_ajout_design_achat')}}',
  1032. data : 'quantDemand=' + $("#form_quantd").val()+
  1033. '&prixUni=' + $("#form_prixUni").val()+
  1034. '&listnum=' + $("#form_listnum").val()+
  1035. '&listnum2=' + $('#form_listnum2').val()+
  1036. '&listnum1=' + $('#form_listnum1').val()+
  1037. '&listnum5=' + $('#form_listnum5').val()+
  1038. '&listnum4=' + $('#form_listnum4').val()+
  1039. '&listnum3=' + $('#form_listnum3').val()+
  1040. '&listnum7=' + $('#form_listnum7').val()+
  1041. '&listnum9=' + $('#form_listnum9').val()+
  1042. '&centreCout=' + $("#form_centreCo").val()+
  1043. '&bailleur=' + $("#form_bailleu").val()+
  1044. '&descrip=' + $("#form_descrip").val()+
  1045. '&designation=' + $("#form_design").val(),
  1047. success: function(data)
  1048. {
  1050. $("#lodes").hide();
  1053. $("#buton").prop("disabled",false);
  1054. $('#liste').html(data);
  1056. $("#form_design").val("");
  1057. $("#form_quantd").val("");
  1058. $("#form_prixUni").val("");
  1065. }
  1067. });
  1072. });
  1076. </script>
  1079. <script>
  1080. $('#monlistnum2').change(function()
  1081. {
  1082. $("#load").show();
  1083. $.ajax({
  1084. type : 'POST',
  1086. url : '{{ path('ajax_liste_demachat')}}',
  1088. data : 'listnum=' + $('#form_listnum2').val(),
  1090. })
  1092. .done(function(response)
  1093. {
  1094. $("#load").hide();
  1095. $('#liste').html(response);
  1097. })
  1098. .fail(function(jqXHR, textStatus, errorThrown)
  1099. {
  1100. $("#load").hide();
  1101. alert('Error : ' + errorThrown);
  1102. });
  1104. return false;
  1108. });
  1110. </script>
  1113. <script>
  1114. $('#monlistnum3').change(function()
  1115. {
  1116. $("#load").show();
  1117. $.ajax({
  1118. type : 'POST',
  1120. url : '{{ path('ajax_liste_demachat')}}',
  1122. data : 'listnum=' + $('#form_listnum3').val(),
  1124. })
  1126. .done(function(response)
  1127. {
  1128. $("#load").hide();
  1129. $('#liste').html(response);
  1131. })
  1132. .fail(function(jqXHR, textStatus, errorThrown)
  1133. {
  1134. $("#load").hide();
  1135. alert('Error : ' + errorThrown);
  1136. });
  1138. return false;
  1142. });
  1144. </script>
  1148. <script>
  1150. $("#form_user").change(function() {
  1151. $("#loduse").show();
  1152. $.ajax({
  1153. type: 'POST',
  1155. url: '{{ path('ajax_listnum4') }}',
  1156. data: 'id=' + $(this).val(),
  1157. success: function(response)
  1158. {
  1159. $("#loduse").hide();
  1160. $('#form_listnum4').find("option").remove();
  1161. $.each(response, function(i, item) {
  1162. $('#form_listnum4').append(new Option(item, i));
  1163. });
  1164. }
  1165. });
  1166. });
  1168. </script>
  1172. <script>
  1173. $('#form_listnum4').change(function()
  1174. {
  1175. $("#load").show();
  1176. $.ajax({
  1177. type : 'POST',
  1179. url : '{{ path('ajax_liste_demachat')}}',
  1181. data : 'listnum=' + $(this).val(),
  1183. })
  1185. .done(function(response)
  1186. {
  1187. $("#load").hide();
  1188. $('#liste').html(response);
  1190. })
  1191. .fail(function(jqXHR, textStatus, errorThrown)
  1192. {
  1193. $("#load").hide();
  1194. alert('Error : ' + errorThrown);
  1195. });
  1197. return false;
  1201. });
  1203. </script>
  1205. <script>
  1207. $("#form_usebaille").change(function() {
  1208. $("#lodbail").show();
  1209. $.ajax({
  1210. type: 'POST',
  1212. url: '{{ path('ajax_listnum6') }}',
  1213. data: 'id=' + $(this).val(),
  1214. success: function(response)
  1215. {
  1216. $("#lodbail").hide();
  1217. $('#form_listnum6').find("option").remove();
  1218. $.each(response, function(i, item) {
  1219. $('#form_listnum6').append(new Option(item, i));
  1220. });
  1221. }
  1222. });
  1223. });
  1225. </script>
  1229. <script>
  1230. $('#form_listnum6 , #form_listnum55').change(function()
  1231. {
  1232. $("#load").show();
  1233. $.ajax({
  1234. type : 'POST',
  1236. url : '{{ path('ajax_liste_demachat')}}',
  1238. data : 'listnum=' + $(this).val(),
  1240. })
  1242. .done(function(response)
  1243. {
  1244. $("#load").hide();
  1245. $('#liste').html(response);
  1247. })
  1248. .fail(function(jqXHR, textStatus, errorThrown)
  1249. {
  1250. $("#load").hide();
  1251. alert('Error : ' + errorThrown);
  1252. });
  1254. return false;
  1258. });
  1260. </script>
  1261. <script>
  1262. var loader = "{{ asset('img/loder.gif') }}";
  1263. $(document).ready(function(){
  1264. $("#form_designrech").on('keyup', function() {
  1265. var input = $(this).val();
  1267. if (input.length >= 1) {
  1269. // ── OFFLINE : chercher dans IndexedDB ────────────────────
  1270. if (!navigator.onLine) {
  1271. DAOffline.searchCatalogue(input, function(html) {
  1272. $('#match').html(html);
  1273. $('#matchList li').on('click', function() {
  1274. $('#form_designrech').val($(this).text());
  1275. $('#match').text('');
  1276. });
  1277. });
  1278. return;
  1279. }
  1281. // ── ONLINE : comportement AJAX existant ──────────────────
  1282. var data = {input: input};
  1283. $.ajax({
  1284. type : "POST",
  1285. url : '{{ path('ajax_autocomplete_design')}}',
  1286. data : data,
  1287. dataType: 'json',
  1288. timeout : 3000,
  1289. success : function(response){
  1290. $('#match').html(response.countryList);
  1291. $('#matchList li').on('click', function() {
  1292. $('#form_designrech').val($(this).text());
  1293. $('#match').text('');
  1294. });
  1295. },
  1296. error: function() {
  1297. $('#match').text('Probleme de connexion internet!');
  1298. }
  1299. });
  1301. } else {
  1302. $('#match').text('');
  1303. }
  1304. });
  1305. });
  1306. </script>
  1308. <script>
  1309. var loader = "{{ asset('img/loder.gif') }}";
  1310. $(document).ready(function(){
  1311. $("#form_design").on('keyup', function() {
  1312. var input = $(this).val();
  1313. if ( input.length >= 1 ) {
  1314. //$('#match2').html('<img src="' + window.loader + '" />');
  1315. var data = {input: input};
  1316. $.ajax({
  1317. type: "POST",
  1318. url:'{{ path('ajax_autocomplete_design')}}',
  1319. data: data,
  1320. dataType: 'json',
  1321. timeout: 3000,
  1322. success: function(response){
  1323. $('#match2').html(response.countryList);
  1324. $('#matchList li').on('click', function() {
  1325. $('#form_design').val($(this).text());
  1326. $('#match2').text('');
  1327. });
  1328. },
  1329. error: function() {
  1330. $('#match2').text('Problem de connexion internet!');
  1331. }
  1332. });
  1333. } else {
  1334. $('#match2').text('');
  1335. }
  1336. });
  1337. });
  1338. </script>
  1343. <script>
  1344. $('#form_delais').datepicker({
  1345. language: 'fr',
  1346. format: 'dd/mm/yyyy',
  1347. startDate: new Date(), // Empêche la sélection de dates antérieures à aujourd'hui
  1348. autoclose: true, // Ferme automatiquement le calendrier après sélection
  1349. todayHighlight: true // Met en surbrillance la date du jour
  1350. });
  1351. </script>
  1354. <script>
  1355. $(document).ready(function() {
  1356. $('#but2').click(function(e)
  1357. { e.preventDefault();
  1359. var baille = $('#form_baille').val();
  1360. if (!baille.trim()) {
  1361. $('#form_baille').focus();
  1362. return false;
  1364. }
  1365. var quant = $('#form_quantDemand').val();
  1366. if (!quant.trim()) {
  1367. $('#form_quantDemand').focus();
  1368. return false;
  1370. }
  1371. var prix = $('#form_prixUnit').val();
  1372. if (!prix.trim()) {
  1373. $('#form_prixUnit').focus();
  1374. return false;
  1376. }
  1380. $("#but2").prop("disabled",true);
  1381. $("#loders").show();
  1384. $.ajax({
  1385. type : 'POST',
  1387. url : '{{ path('ajout_design_da_temp')}}',
  1389. data : 'quantDemand=' + $("#form_quantDemand").val()+
  1390. '&bailleur=' + $("#form_baille").val()+
  1392. '&prixUnit=' + $("#form_prixUnit").val()+
  1394. '&descrip=' + $("#form_descript").val()+
  1395. '&centreCout=' + $("#form_centreCou").val()+
  1396. '&iddesignrech=' + $("#form_designrech").val(),
  1399. success: function(data)
  1400. {
  1402. alert('ajout effectué avec succes');
  1403. $("#loders").hide();
  1406. $("#form_quantDemand").val("");
  1407. $("#form_prixUnit").val("");
  1408. $("#form_designrech").val("");
  1409. $("#form_descript").val("");
  1410. $("#but2").prop("disabled",false);
  1411. $('#liste').html(data);
  1416. }
  1419. });
  1425. });
  1427. });
  1429. </script>
  1433. <script>
  1434. $('#monlistnum7').change(function()
  1435. {
  1436. $("#load").show();
  1437. $.ajax({
  1438. type : 'POST',
  1440. url : '{{ path('ajax_liste_demachat')}}',
  1442. data : 'listnum=' + $('#form_listnum7').val(),
  1444. })
  1446. .done(function(response)
  1447. {
  1448. $("#load").hide();
  1449. $('#liste').html(response);
  1451. })
  1452. .fail(function(jqXHR, textStatus, errorThrown)
  1453. {
  1454. $("#load").hide();
  1455. alert('Error : ' + errorThrown);
  1456. });
  1458. return false;
  1462. });
  1464. </script>
  1465. <script>
  1466. $('#monlistnum9').change(function()
  1467. {
  1468. $("#load").show();
  1469. $.ajax({
  1470. type : 'POST',
  1472. url : '{{ path('ajax_liste_demachat')}}',
  1474. data : 'listnum=' + $('#form_listnum9').val(),
  1476. })
  1478. .done(function(response)
  1479. {
  1480. $("#load").hide();
  1481. $('#liste').html(response);
  1483. })
  1484. .fail(function(jqXHR, textStatus, errorThrown)
  1485. {
  1486. $("#load").hide();
  1487. alert('Error : ' + errorThrown);
  1488. });
  1490. return false;
  1494. });
  1496. </script>
  1498. <script>
  1499. $('#monlistnum1').change(function()
  1500. {
  1501. $("#load").show();
  1502. $.ajax({
  1503. type : 'POST',
  1505. url : '{{ path('ajax_liste_demachat')}}',
  1507. data : 'listnum=' + $('#form_listnum1').val(),
  1509. })
  1511. .done(function(response)
  1512. {
  1513. $("#load").hide();
  1514. $('#liste').html(response);
  1516. })
  1517. .fail(function(jqXHR, textStatus, errorThrown)
  1518. {
  1519. $("#load").hide();
  1520. alert('Error : ' + errorThrown);
  1521. });
  1523. return false;
  1527. });
  1529. </script>
  1530. <script>
  1531. $('#monlistnum5').change(function()
  1532. {
  1533. $("#load").show();
  1534. $.ajax({
  1535. type : 'POST',
  1537. url : '{{ path('ajax_liste_demachat')}}',
  1539. data : 'listnum=' + $('#form_listnum5').val(),
  1541. })
  1543. .done(function(response)
  1544. {
  1545. $("#load").hide();
  1546. $('#liste').html(response);
  1548. })
  1549. .fail(function(jqXHR, textStatus, errorThrown)
  1550. {
  1551. $("#load").hide();
  1552. alert('Error : ' + errorThrown);
  1553. });
  1555. return false;
  1559. });
  1561. </script>
  1564. <script>
  1566. $("#form_usebaille").change(function() {
  1568. $.ajax({
  1569. type: 'POST',
  1571. url: '{{ path('ajax_listnum6') }}',
  1572. data: 'id=' + $(this).val(),
  1573. success: function(response)
  1574. {
  1575. $('#form_listnum6').find("option").remove();
  1576. $.each(response, function(i, item) {
  1577. $('#form_listnum6').append(new Option(item, i));
  1578. });
  1579. }
  1580. });
  1581. });
  1583. </script>
  1587. <script>
  1588. $('#form_listnum6').change(function()
  1589. {
  1590. $("#load").show();
  1591. $.ajax({
  1592. type : 'POST',
  1594. url : '{{ path('ajax_liste_demachat')}}',
  1596. data : 'listnum=' + $(this).val(),
  1598. })
  1600. .done(function(response)
  1601. {
  1602. $("#load").hide();
  1603. $('#liste').html(response);
  1605. })
  1606. .fail(function(jqXHR, textStatus, errorThrown)
  1607. {
  1608. $("#load").hide();
  1609. alert('Error : ' + errorThrown);
  1610. });
  1612. return false;
  1616. });
  1618. </script>
  1620. <script>
  1621. $(document).ready(function() {
  1622. $('#button2').click(function(e)
  1623. { e.preventDefault();
  1624. $("#button2").prop("disabled",true);
  1625. $("#loa").show();
  1627. function sendForm() {
  1628. $.ajax({
  1629. type : 'POST',
  1631. url : '{{ path('ajax_ajout_da_temp')}}',
  1633. data : 'quantDemand=' + $("#form_quantd2").val()+
  1635. '&prixUnit=' + $("#form_prixUni2").val()+
  1636. '&obje=' + $("#form_obje2").val()+
  1637. '&descrip=' + $("#form_descrip2").val()+
  1638. '&baille2=' + $("#form_baille2").val()+
  1639. '&iddesignrech=' + $("#form_design2").val(),
  1642. success: function(data)
  1643. {
  1645. alert('ajout effectué avec succes');
  1646. $("#loa").hide();
  1648. $("#button2").prop("disabled",false);
  1651. $("#form_quantDeman2").val("");
  1652. $("#form_prixUnit2").val("");
  1653. $("#form_design2").val("");
  1654. $("#form_descript2").val("");
  1655. $('#liste').html(data);
  1660. },
  1661. error: function(xhr, status, error) {
  1662. if (!navigator.onLine) {
  1663. // Si la connexion internet est perdue
  1664. alert('Connexion perdue. Tentative de réenvoi dans 5 secondes...');
  1665. setTimeout(retrySending, 5000); // Réessaye dans 5 secondes
  1666. }
  1667. }
  1669. });
  1671. }
  1673. // Fonction pour retenter l'envoi
  1674. function retrySending() {
  1675. if (navigator.onLine) {
  1676. sendForm(); // Si la connexion est rétablie, renvoie le formulaire
  1677. } else {
  1678. setTimeout(retrySending, 5000); // Réessayer jusqu'à ce que la connexion revienne
  1679. }
  1680. }
  1682. // Premier essai d'envoi
  1683. sendForm();
  1686. });
  1688. });
  1690. </script>
  1692. <script>
  1693. $(document).ready(function() {
  1694. $('#button').click(function(e) {
  1695. e.preventDefault();
  1697. $("#button").prop("disabled", true); // Désactiver le bouton
  1698. $("#loa").show(); // Afficher le loader
  1699. function sendForm() {
  1700. $.ajax({
  1701. type : 'POST',
  1703. url : '{{ path('ajax_da_temp')}}',
  1705. data : 'quantDemand=' + $("#form_quantd2").val()+
  1707. '&prixUnit=' + $("#form_prixUni2").val()+
  1708. '&obje=' + $("#form_obje2").val()+
  1709. '&descrip=' + $("#form_descrip2").val()+
  1710. '&baille2=' + $("#form_baille2").val()+
  1711. '&iddesignrech=' + $("#form_design2").val(),
  1714. success: function(data) {
  1715. alert('ajout effectué avec succès');
  1716. $("#loa").hide(); // Cacher le loader
  1717. $("#button").hide();
  1718. $("#button2").show();
  1719. $("#obje2").hide();
  1720. $("#form_quantd2").val("");
  1721. $("#form_prixUni2").val("");
  1722. $("#form_design2").val("");
  1723. $("#form_descrip2").val("");
  1724. $('#liste').html(data);
  1726. },
  1727. error: function(xhr, status, error) {
  1728. if (!navigator.onLine) {
  1729. // Si la connexion internet est perdue
  1730. alert('Connexion perdue. Tentative de réenvoi dans 5 secondes...');
  1731. setTimeout(retrySending, 5000); // Réessaye dans 5 secondes
  1732. }
  1733. }
  1735. });
  1737. }
  1740. // Fonction pour retenter l'envoi
  1741. function retrySending() {
  1742. if (navigator.onLine) {
  1743. sendForm(); // Si la connexion est rétablie, renvoie le formulaire
  1744. } else {
  1745. setTimeout(retrySending, 5000); // Réessayer jusqu'à ce que la connexion revienne
  1746. }
  1747. }
  1749. // Premier essai d'envoi
  1750. sendForm();
  1751. });
  1752. });
  1753. </script>
  1756. <script>
  1757. var loader = "{{ asset('img/loders.gif') }}";
  1758. $(document).ready(function(){
  1759. $("#form_design2").on('keyup', function() {
  1760. var input = $(this).val();
  1761. if ( input.length >= 1 ) {
  1762. //$('#match3').html('<img src="' + window.loader + '" />');
  1763. var data = {input: input};
  1764. $.ajax({
  1765. type: "POST",
  1766. url:'{{ path('ajax_autocomplete_design')}}',
  1767. data: data,
  1768. dataType: 'json',
  1769. timeout: 3000,
  1770. success: function(response){
  1771. $('#match3').html(response.countryList);
  1772. $('#matchList li').on('click', function() {
  1773. $('#form_design2').val($(this).text());
  1774. $('#match3').text('');
  1775. });
  1776. },
  1777. error: function() {
  1778. $('#match3').text('Problem de connexion internet!');
  1779. }
  1780. });
  1781. } else {
  1782. $('#match3').text('');
  1783. }
  1784. });
  1785. });
  1786. </script>
  1789. <script>
  1790. $('#monlistnum55').change(function()
  1791. {
  1792. $("#load").show();
  1793. $.ajax({
  1794. type : 'POST',
  1796. url : '{{ path('ajax_liste_demachat')}}',
  1798. data : 'listnum=' + $('#form_listnum55').val(),
  1800. })
  1802. .done(function(response)
  1803. {
  1804. $("#load").hide();
  1805. $('#liste').html(response);
  1807. })
  1808. .fail(function(jqXHR, textStatus, errorThrown)
  1809. {
  1810. $("#load").hide();
  1811. alert('Error : ' + errorThrown);
  1812. });
  1814. return false;
  1818. });
  1820. </script>
  1827. {% endblock %}