templates/invoices.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% set currentPath = path(app.request.attributes.get('_route')) %}
  5. {% block body %}
  6. <div class="container">
  7.   <div class="row">
  8.       <div id="loader" class="col s12 progress" style="display:none"><div class="indeterminate"></div></div>
  9.       <div class="col s12">
  10.       <div class="card">
  11.           <div class="card-content">
  12.               <!-- <span class="card-title">Filters</span> -->
  13.               <div class="row">
  14.                   <h5>Gestione Ordini</h5>
  15.                   <hr/>
  16.                   <div class="row">
  17.                       <!-- ><div class="col s2">
  18.                           <select id="filter-year" name="filter-year">
  19.                               <option value="">-- Anno --</option>
  20.                             <option value="2020" selected>Anno 2020</option>
  21.                             <option value="2021">Anno 2021</option>
  22.                             <option value="2022">Anno 2022</option>
  23.                           </select>
  24.                       </div> -->
  25.                       <div class="col s3">
  26.                           <select id="filter-type" name="filter-type">
  27.                             <option value="">-- Filtra per --</option>
  28.                             <option value="invoices">Fatture</option>
  29.                             <option value="corrispettivi">Corrispettivi</option>
  30.                             <option value="not managed">Non gestiti</option>
  31.                           </select>
  32.                       </div>
  33.                       <div class="col s3">
  34.                           <label></label>
  35.                           <div id="filter-orders-ids" class="chips chips-placeholder">
  36.                               <input name="filter-orders-ids" placeholder="Filtro ID Ordini">
  37.                           </div>
  38.                       </div>
  39.                     <div class="col s3">
  40.                           <label></label>
  41.                           <div id="filter-fatture-ids" class="chips chips-placeholder">
  42.                               <input name="filter-fatture-ids" placeholder="Filtro ID Fatture">
  43.                           </div>
  44.                       </div>
  45.                   </div>
  46.                   <div class="row">
  47.                       <div class="col s2">
  48.                           <label>Da:</label>
  49.                           <input type="text" name="filter-date-from" class="datepicker">
  50.                       </div>
  51.                       <div class="col s2">
  52.                           <label>A:</label>
  53.                           <input type="text" name="filter-date-to" class="datepicker">
  54.                       </div>
  55.                       <div class="col s2">
  56.                           <button type="button" onclick="Manebi.getInvoices()" name="submit-filter" class="btn waves-effect waves-light">RECUPERA</button>
  57.                       </div>
  58.                   </div>
  59.               </div>
  60.           </div>
  61.          </div>
  62.       </div>
  63.   </div>
  64.   <div class="row">
  65.       <div class="col s12">
  66.       <div class="card">
  67.           <div class="card-content">
  68.               <div id="invoices-table-results">
  69.                   <div class="row">
  70.                       <div class="col s4">Risultati: <span id="invoices-table-results-total"></span></div>
  71.                       <div id="invoices-table-results-actions" class="col s8"></div>
  72.                   </div>
  73.               </div>
  74.               <div class="row">
  75.                   <div class="col s10"><div class="invoices-table-pagination"></div></div>
  76.               </div>
  77.               <table id="invoices-table" class="striped fixed_header">
  78.                   <thead></thead>
  79.                   <tbody></tbody>
  80.               </table>
  81.               
  82.               <div class="row">
  83.                   <div class="col s10"><div class="invoices-table-pagination"></div></div>
  84.                   <div class="col s2"><label for="invoices-table-page-size-list">Per pagina: <select class="invoices-table-page-size-list" name="invoices-table-page-size-list" after-render="initMaterializeSelect"></select></label></div>
  85.               </div>
  86.           </div>
  87.          </div>
  88.       </div>
  89.   </div>
  90.   <div class="row">
  91.       <div class="col s12">
  92.       <div class="card">
  93.           <div class="card-content">
  94.               {% if ordiniSenzaIncassiERimborsi %}
  95.                   <ul class="collapsible">
  96.                       <li>
  97.                           <div class="collapsible-header"><b>ATTENZIONE: ci sono {{ ordiniSenzaIncassiERimborsi|length }} Ordini che non possiedono alcun tipo di transazione (Incassi / Rimborsi)</b></div>
  98.                           <div class="collapsible-body">
  99.                               <table class="table">
  100.                                   <thead><tr><th>Ordine</th><th>Tipo</th><th>Numero</th><th>Payment Reference</th><th>Payment Method</th><th>Total</th><th>Data creazione</th></tr></thead>
  101.                                   <tbody>
  102.                                   {% for o in ordiniSenzaIncassiERimborsi %}
  103.                                       <tr>
  104.                                           <td>{{ o.Order }}</td>
  105.                                           <td>{{ o['Tipo'] }}</td>
  106.                                         <td>{{ o['Numero'] }}</td>
  107.                                           <td>{{ o['Payment Reference'] }}</td>
  108.                                           <td>{{ o['Payment Method'] }}</td>
  109.                                           <td>{{ o['Total'] }}</td>
  110.                                           <td>{{ o['Created at'] }}</td>
  111.                                       </tr>
  112.                                   {% endfor %}
  113.                                   </tbody>
  114.                               </table>
  115.                           </div>
  116.                       </li>
  117.                   </ul> 
  118.               {% endif %}
  119.           </div>
  120.       </div>
  121.   </div>
  122. </div>
  125. <!-- Modal Structure -->
  126. <div id="viewInvoiceModal" class="modal modal-fixed-footer modal-fixed-header" style="width:100%">
  127.   <div class="modal-header"></div>
  128.   <div class="modal-content"></div>
  129.   <div class="modal-footer">
  130.     <a href="#!" class="modal-close waves-effect waves-green btn btn-small">OK</a>
  131.   </div>
  132. </div>
  134. <div id="genericPopup" class="modal modal-fixed-footer modal-fixed-header">
  135.     <div class="modal-header"></div>
  136.     <div class="modal-content">
  137.         <p class="alert alert-warning">Queste sono le righe associate a questa integrazione. Verificare  dati che saranno rimossi prima di procedere alla rimozione.</p>
  138.         <hr/>
  139.         <div id="invoices-table-results">
  140.             <div class="row">
  141.                 <div class="col s4">Risultati: <span id="invoices-table-results-total"></span></div>
  142.                 <div id="invoices-table-results-actions" class="col s8"></div>
  143.             </div>
  144.         </div>
  145.         <table id="invoices-table" class="striped fixed_header">
  146.             <thead></thead>
  147.             <tbody></tbody>
  148.         </table>
  149.     </div>
  150.     <div class="modal-footer">
  151.         <a id="button-delete-log-imports" href="#!" class="waves-effect waves-red btn btn-small" style="background-color: #F00" onclick="deleteLogImports(this)" data-id-log-imports="">CONFERMA ELIMINAZIONE DEI DATI DI QUESTA INTEGRAZIONE</a>
  152.         <a href="#!" class="modal-close waves-effect waves-green btn btn-small">CHIUDI</a>
  153. </div>
  155. {% block javascripts %}
  156. <script src="{{ asset('tmb-data-table.v1_0.min.js') }}"></script>
  158. <script>
  159. var Manebi = {};
  160. var urlAjax = "{{ currentPath }}";
  162. var filterInstances = {'collapsible': {}, 'dates': {}, 'chips': {}, 'modals': {}, 'selects': {}};
  163. var tableInvoices = null;
  165. var tableColumns =  {
  166.                     'Ordine': {'headerName': 'Order', 'value': function(data){ return '<b>' + data['Order'] + '</b>'}, 'sortable': true, 'sort-by-value': 'Order'}, 
  167.                     'Numero Fattura': {'headerName': 'Fattura', 'value': function(data){ return '<b>' + data['Numero Fattura'] + '</b>'}, 'sortable': true}, 
  168.                     'Corrispettivo': {'headerName': 'Corrispettivo', 'value': function(data){ return '<b>' + (data['Corrispettivo'] == null ? '-' : data['Corrispettivo']) + '</b>'}, 'sortable': true}, 
  169.                     'Incassi':{'headerName': 'Incassi', 'value': 'Incassi'},
  170.                     'Rimborsi':{'headerName': 'Rimborsi', 'value': 'Rimborsi'},
  171.                     'Shipping Country': {'headerName': 'Paese Sped.', 'value': 'Shipping Country', 'sortable': true},
  172.                     'Created at': {'headerName': 'Creato il', 'value': 'Created at', 'sortable': true},
  173.                     'Total Amount': {'headerName': 'Totale', 'value': function(data){ return getPrice(data.Total,2) + ' '+ getCurrencySymbol(data.Currency)}, 'type': 'float', 'sortable': true, 'sort-by-value': 'Total'},
  174.                     'Payment': {'headerName': 'Payment', 'value': 'Payment Method', 'sortable': true}, 
  175.                     'Shipping  Name': {'headerName': 'Cliente', 'value': 'Shipping Name', 'sortable': true},
  176.                     'Export': {'headerName': 'Export', 'value': function(data){
  177.                             var o = '';
  178.                             
  179.                             if(data['ftp_export_status'] == 0)
  180.                             {
  181.                                 o += '<b style="color:#00F">IN ATTESA</b>';
  182.                             }
  183.                             
  184.                             if(data['ftp_export_status'] == 100)
  185.                             {
  186.                                 o += '<b style="color:#0F0">OK</b>';
  187.                             }
  188.                             
  189.                             if(data['ftp_export_status'] == 200)
  190.                             {
  191.                                 o += '<b style="color:#F00">ERROR - '+data['ftp_export_message']+'</b>';
  192.                             }
  193.                             
  194.                             return o;
  195.                     }, 'sortable': true, 'sort-by-value': 'ftp_export_status'},
  196.                     'Actions': {'headerName': 'Actions', 
  197.                                 'value': function(data){
  198.                                             var o = '<div style="width: 100px;">\
  199.                                             <button type="button" class="btn-floating btn-small waves-effect waves-light" onclick="Manebi.getInvoice(\''+ data.Order +'\')"><i class="material-icons">search</i></button>&nbsp;&nbsp;';
  200.                                             o += '<button type="button" class="btn-floating btn-small waves-effect waves-light red" style="width: 25px;height: 25px;padding: 0px;line-height: normal;" onclick="Manebi.deleteOrder(\''+ data.Order.replace('#','') +'\')" data-id-order="'+data.Order.replace('#','')+'" >X</button>&nbsp;&nbsp;';
  202.                                             o += (data['Numero Fattura'] != '' ? ('<a href="/admin/pdf/invoices/'+ data.Order.replace('#','') +'" target="blank" class="btn-floating btn-small waves-effect waves-light red"><i class="material-icons">picture_as_pdf</i></a>') : '');
  203.                                             o += (data['Numero Fattura'] != '' ? ('<a href="/admin/pdf/invoices/'+ data.Order.replace('#','') +'?proforma_return=1" target="blank" class="btn-floating btn-small waves-effect waves-light blue"><i class="material-icons">picture_as_pdf</i></a>') : '');
  204.                                             o += '</div>';
  205.                                             
  206.                                             return o;
  207.                                         }
  208.                                 }
  209.                 };
  211. function getPrice(price, decimal)
  212. {
  213.     var price =  parseFloat(price);
  214.     return price.toFixed(decimal);
  215. }
  217. function getCurrencySymbol(cur)
  218. {
  219.     switch(cur){
  220.         case 'EUR': return '€';
  221.         case 'USD': return '$';
  222.         default: return '';
  223.     }
  224. }
  226. function toggleElement(elId){
  227.   var x = document.getElementById(elId);
  228.   
  229.   if (x.style.display === "none") {
  230.     x.style.display = "block";
  231.   } else {
  232.     x.style.display = "none";
  233.   }
  234. }
  236. function initMaterializeSelect(el) {
  237.     M.FormSelect.init(el, {});
  238. }
  240. document.addEventListener('DOMContentLoaded', function() {
  241.     //Initialize Collapsible
  242.     var elems = document.querySelectorAll('.collapsible');
  243.     
  244.     for(var i = 0; i < elems.length; i++)
  245.     {
  246.       key = typeof(elems[i].getAttribute('id')) !== "undefined" ? elems[i].getAttribute('id') : i;
  247.       filterInstances.collapsible[key] = M.Collapsible.init(elems[i]);
  248.     }
  249.   
  250.     // Initialize DatePicker
  251.     var elems = document.querySelectorAll('.datepicker');
  252.     
  253.     for(var i = 0; i < elems.length; i++)
  254.     {
  255.         key = elems[i].getAttribute('name');
  256.         filterInstances.dates[key] = M.Datepicker.init(elems[i], {autoClose: true, format: "yyyy-mm-dd", showClearBtn: true});
  257.     }
  259.     // Initialize Chips
  260.     var elems = document.querySelectorAll('.chips');
  261.     
  262.     for(var i = 0; i < elems.length; i++)
  263.     {
  264.         key = elems[i].getAttribute('id');
  265.         filterInstances.chips[key] = M.Chips.init(elems[i]);
  266.     }
  268.     // Initialize Modals
  269.     var elems = document.querySelectorAll('.modal');
  270.     
  271.     for(var i = 0; i < elems.length; i++)
  272.     {
  273.         key = elems[i].getAttribute('id');
  274.         filterInstances.modals[key] = M.Modal.init(elems[i], {'startingTop': '0%', 'endingTop': '0%', 'endingBottom': '10%'});
  275.     }
  276.     
  277.     var elems = document.querySelectorAll('select');
  278.     
  279.     for(var i = 0; i < elems.length; i++)
  280.     {
  281.         key = elems[i].getAttribute('name');
  282.         filterInstances.selects[key] = M.FormSelect.init(elems[i]);
  283.     }
  284.     
  285.     //Get Invoices
  286.     Manebi.getInvoices = function(){
  287.                             window.toggleElement('loader');
  288.                             
  289.                             filter_type = filterInstances.selects['filter-type'].el.value;
  290.                             
  291.                             $.ajax({
  292.                                 url: urlAjax,
  293.                                 dataType: "json",
  294.                                 data: {
  295.                                     'filter': 1,
  296.                                     'filter-date-from': filterInstances.dates['filter-date-from'].toString(),
  297.                                     'filter-date-to': filterInstances.dates['filter-date-to'].toString(),
  298.                                     'filter-type': filter_type,
  299.                                     'filter-fatture-ids': filterInstances.chips['filter-fatture-ids'].chipsData,
  300.                                     'filter-orders-ids': filterInstances.chips['filter-orders-ids'].chipsData
  301.                                 }
  302.                             }).then(function(data){
  303.                                 tableInvoices = new TmbDataTable('invoices-table', tableColumns, {'pageSize': 50, 'selectable': true});
  304.                                 tableInvoices.setData(data.data).generateTable();
  305.                                 
  306.                                 actions = '';
  307.                                 actions += '<button type="button" class="btn btn-small waves-effect waves-light" style="float:right;background-color:#36a700" onclick=\'Manebi.exportFile(\"' + filter_type + '\", \"exportCSVDetails\")\'><i class="material-icons">file_download</i> <span>CSV  - Dettagli</span></button>&nbsp;';
  308.                                 actions += '<button type="button" class="btn btn-small waves-effect waves-light" style="float:right;background-color:#36a700" onclick=\'Manebi.exportFile(\"' + filter_type + '\", \"exportCSV\")\'><i class="material-icons">file_download</i> <span>CSV</span></button>&nbsp;';
  309.                                 
  310.                                 if(filter_type != "")
  311.                                     actions += '<button type="button" class="btn btn-small waves-effect waves-light" style="float:right;background-color:#36a700" onclick=\'Manebi.exportFile(\"' + filter_type + '\", \"exportProfis\")\' ><i class="material-icons">import_export</i>XML PROFIS</button>&nbsp;';
  313.                                 actions += '<button type="button" class="btn btn-small waves-effect waves-light" style="float:right;background-color:#36a700;" onclick=\'Manebi.exportFile(\"' + filter_type + '\", \"exportFatturaElettronica\")\' ><i class="material-icons">import_export</i>Fattura Elettronica</button>';
  315.                                 tableInvoices.setAction(actions);
  316.                                 
  317.                                 window.toggleElement('loader');
  318.                             });
  319.                         }
  321.     // Get Invoice
  322.     Manebi.getInvoice = function(id) {
  323.         window.toggleElement('loader');
  324.         
  325.         $.ajax({
  326.                 url: urlAjax + '/' + id.replace('#',''), 
  327.                 dataType: "json"
  328.                }).then(function(data){
  329.                
  330.                        if(data.status == 'OK' && (data.data.length > 0)){
  331.                            var invoice = data.data[0];
  333.                            Manebi.viewInvoice(invoice);
  334.                        }
  335.                     
  336.                    window.toggleElement('loader');
  337.                });
  338.     }
  339.     
  340.     Manebi.viewInvoice = function(data){
  341.         var o = '<table class="table"><tbody>';
  342.         
  343.         for(var i in data)
  344.         {
  345.             if(typeof(data[i]) !== 'object')
  346.             {
  347.                 o += '<tr><td><b>'+i+'</b></td><td>'+data[i]+'</td></tr>';
  348.             }
  349.         
  350.         }
  351.         o += '</tbody></table>'; 
  352.         
  353.         if(typeof(data.products) !== "undefined")
  354.         {
  355.             o += '<div><h5>Ordered products</h5>'+'<table class="table"><tbody>';
  356.             for(var i in data.products)
  357.             {
  358.                 o += '<tr><td><b>'+i+'</b></td></tr>';
  359.             }
  360.             
  361.             o += '</tbody></table></div>'; 
  362.         }
  363.         
  364.         filterInstances.modals['viewInvoiceModal'].el.querySelector('.modal-header').innerHTML = '<h4>Dettagli ordine ('+data.Order+')</h4>';
  365.         filterInstances.modals['viewInvoiceModal'].el.querySelector('.modal-content').innerHTML = o;
  366.         filterInstances.modals['viewInvoiceModal'].open();
  367.     }
  369.     Manebi.deleteOrder = function(id_order) {
  370.         var choice;
  372.         choice = confirm("Sei sicuro di voler rimuovere l'Ordine " + id_order + " e i suoi relativi prodotti?");
  374.         if(choice) {
  375.             $.ajax({
  376.                 url: urlAjax + "/" + id_order + "/delete",
  377.                 type: "POST",
  378.                 dataType: "json",
  379.                 }).then(function(data) {
  380.                     if(data.status == "OK") {
  381.                         alert('Ordine eliminato!');
  382.                     }else{
  383.                         alert(data.message);
  384.                     }
  386.                      Manebi.getInvoices(); 
  387.                 });
  388.         }
  389.     }
  390.     
  391.     // Export Invoices in Profis XML
  392.     Manebi.exportFile = function(filter_type, export_type) {
  393.             var form = document.createElement("form");
  394.             
  395.             form.setAttribute("id", "export-profis");
  396.             form.method = "POST";
  397.             form.action = urlAjax;
  398.             form.target = '_blank';    
  399.             
  400.             document.body.appendChild(form);
  401.             
  402.             f = document.createElement("input");f.type='hidden';
  403.             f.setAttribute('name', export_type);f.setAttribute('value', 1);
  404.             form.appendChild(f);
  405.             
  406.             f = document.createElement("input");f.type='hidden';
  407.             f.setAttribute('name', 'filter');f.setAttribute('value', 1);
  408.             form.appendChild(f);
  409.             
  410.             f = document.createElement("input");f.type='hidden';
  411.             f.setAttribute('name', 'filter-date-from');f.setAttribute('value', filterInstances.dates['filter-date-from'].toString());
  412.             form.appendChild(f);
  413.             
  414.             f = document.createElement("input");f.type='hidden';
  415.             f.setAttribute('name', 'filter-date-to');f.setAttribute('value', filterInstances.dates['filter-date-to'].toString());
  416.             form.appendChild(f);
  417.             
  418.             filter_type = filterInstances.selects['filter-type'].el.value;
  419.             
  420.             f = document.createElement("input");f.type='hidden';
  421.             f.setAttribute('name', 'filter-type');f.setAttribute('value', filter_type);
  422.             form.appendChild(f);
  423.             
  424.             chips = filterInstances.chips['filter-orders-ids'].chipsData;
  425.             
  426.             for(var i=0; i < chips.length; i++){
  427.                 f = document.createElement("input");f.type='hidden';
  428.                 f.setAttribute('name', 'filter-orders-ids['+i+'][tag]');f.setAttribute('value', chips[i].tag);
  429.                 form.appendChild(f);
  430.             }
  431.             
  432.             chips = filterInstances.chips['filter-fatture-ids'].chipsData;
  433.             
  434.             for(var i=0; i < chips.length; i++){
  435.                 f = document.createElement("input");f.type='hidden';
  436.                 f.setAttribute('name', 'filter-fatture-ids['+i+'][tag]');f.setAttribute('value', chips[i].tag);
  437.                 form.appendChild(f);
  438.             }
  440.             form.appendChild(f);            
  441.             form.submit();
  442.     }                
  443.   });
  444. </script>
  445. {% endblock %}
  446. <style>
  448. td, th {
  449.     padding: 2px 5px;
  450.     font-size: 0.9rem;
  451. }
  453. th.sortable {
  454.     text-decoration: underline;
  455. }
  457. th.sortable.asc::after {
  458.     content: '\2b61';
  459. }
  460. th.sortable.desc::after {
  461.     content: '\2b63';
  462. }
  464. table.striped > thead > tr{
  465.     background-color: #e4e4e4;
  466.     border-bottom: 1px solid #CCC !important;
  467. }
  469. tbody > tr > td:first-child{
  470.     background-color: #e4e4e4;
  471. }
  473. tr.selectable:hover > td{
  474.     cursor: pointer;
  475.     background-color: #BBB;
  476. }
  478. .modal {
  479.    max-height: 100%;
  480.    width:95%;
  481. }
  483. .moda.modal-header {
  484.    box-shadow: 1px 1px 5px #DDD;
  485.    padding: 3px;
  486. }
  488. .modal.modal-fixed-footer {
  489.    height: 90%;
  490. }
  492. .invoices-table-pagination {
  493.     text-align: center;
  494. }
  496. .invoices-table-pagination .page {
  497.     display: inline;
  498.     padding: 8px;
  499. }
  501. .invoices-table-pagination .page a {
  502.     color: #000;
  503. }
  505. .invoices-table-pagination .page.active a {
  506.     font-weight: bold;
  507.     padding: 5px;
  508.     text-decoration: underline;
  509. }
  510. div.select-wrapper{
  511.     display:inline-block;
  512. }
  513. </style>
  514. {% endblock %}