{% extends "layout.html" %}
{% block title %}{{title_pre}} Devices {% endblock %}
 {% block bread %}
 
    <div class="col-sm-4">
        <h2>Manage Devices</h2>
        <ol class="breadcrumb">
            <li class="breadcrumb-item">
                <a href="index.php">Home</a>
            </li>
             <li class="breadcrumb-item active">
                <strong>All Devices</strong>
            </li>
        </ol>
    </div>
    
 {% endblock %}
{% block content %}
   <div class="page_content" >

        <div class="wrapper wrapper-content">
                <div class="row animated fadeInDown">
                    <div class="col-lg-12 ">
                        <div class="ibox" >
                                <div class="ibox-title">
                                        <h5>{% if _get.id_store > 0%} Show Devices of Stoer:  <i>{{store_name}} </i> <a class="ml-5" href="index.php?page=devices" > show all devices</a> {%else%}All Stores{% endif %} </h5>
                                        <div class="ibox-tools">
                                            <span style="font-size: 13px;"  data-toggle="modal" data-target="#editDispositif" class="btn label label-primary mr-1"> Add New Device</span>

                                            <a class="collapse-link">
                                                <i class="fa fa-chevron-up"></i>
                                            </a>
                                            
                                        </div>
                                    </div>
                                 <div class="ibox-content"> 
                                        <div class="table-responsive">
                                                <table class="table table-striped table-bordered table-hover dataTables-example" >
                                                <thead>
                                                <tr>
                                                    <th >Active</th>
                                                    <th>Device Code</th>
                                                    <th>Name</th>
                                                    <th>Type</th>
                                                    <th>Store</th>
                                                    <th>Network</th>
                                                    <th>Surge</th>
                                                    <th>Video</th>
                                                    <th>Version</th>
                                                    <th style="width:30px;"></th>
                                                </tr>
                                                </thead>
                                                <tbody>
                                             {% for key,device in  devices %} 
                                                <tr class="gradeX device-{{device.id}}" >
                                                   <!-- <td>{{ device.activite }}</td>-->
                                                    <td class="text-center" style="border-left:solid  {{ device.color}};cursor:pointer;" >
                                                        <span  class="fa code-o-modal" data-toggle="modal" data-target="#dialoginfodisp_{{device.id}}">
                                                                {{device.codeVal}}<br/>{{device.date}}</span>
                                                    </td>
                                                    <td>{{ device.code }}</td>                  
                                                    <td >{{ device.title }}</td>
                                                    <td class="text-center" ><i class="fa {{ device.type }} "></i><!--<img src="../css/images/{{ device.type }}" />--></td> 
                                                    <td >{{ device.magasin_nom }}</td> 
                                                    <td >{{ device.majreseau }}</td> 
                                                    <td >{{ device.parasurtenseur }}</td>  
                                                    <td >{{ device.connexion }}</td>  
                                                    <td >{{ device.version }}</td>  
                                                    <td>
                                                        <i class="fa fa-pencil edit_dis"  data-toggle="modal" data-target="#editDispositif"   data-id="{{device.id}}"
                                                            data-type="{{device.type_val}}"  data-magasin="{{device.magasin}}" data-parasurtenseur="{{device.parasurtenseur_val}}"   
                                                            data-name="{{device.title}}"  data-code="{{device.code}}"
                                                            data-connexion="{{device.connexion_val}}" data-version="{{device.version_val}}" data-majreseau="{{device.majreseau_val}}"title="Edit"></i>
                                                        {% if _session.user.admin != "2"  and  _session.user.admin != "0" %}<a ><i class="fa fa-trash-o dis_dlt"  d-id="{{device.id}}" dis-livr="{{device.idlivraison}}" title="Move to Trash"></i></a> {% endif %} 
                                                    </td>
                                                    </tr>
                                               {% endfor %}
                                                </tbody>
                                                <tfoot>
                                                <tr>
                                                        <th >Active</th>
                                                        <th>Device Code</th>
                                                        <th>Name</th>
                                                        <th>Type</th>
                                                        <th>Store</th>
                                                        <th>Network</th>
                                                        <th>Surge</th>
                                                        <th>Video</th>
                                                        <th>Version</th>
                                                        <th></th>
                                                </tr>
                                                </tfoot>
                                                </table>
                                         </div>
                            
                                   
                                 </div>       
                                   
                        </div>
                        
                    </div>
                </div>


                                
    
            </div>

      
    </div>


    
    <script src="{{ constant('HTTP_JS') }}/plugins/pace/pace.min.js"></script>

          <script src="{{ constant('HTTP_JS') }}/plugins/dataTables/datatables.min.js"></script>
          <script src="{{ constant('HTTP_JS') }}/plugins/dataTables/dataTables.bootstrap4.min.js"></script>
              <!-- Page-Level Scripts -->
              <script>
                      $(document).ready(function(){
                          $('.dataTables-example').DataTable({
                              pageLength: 25,
                              responsive: true,
                              dom: '<"html5buttons"B>lTfgitp',
                              buttons: [
                                  { extend: 'copy'},
                                  {extend: 'csv'},
                                  {extend: 'excel', title: 'Devices'},
                                  {extend: 'pdf', title: 'Devices'},
              
                                  {extend: 'print',
                                   customize: function (win){
                                          $(win.document.body).addClass('white-bg');
                                          $(win.document.body).css('font-size', '10px');
              
                                          $(win.document.body).find('table')
                                                  .addClass('compact')
                                                  .css('font-size', 'inherit');
                                  }
                                  }
                              ]
              
                          });
              
                      });
              
                  </script>
              
              

                  <div class="modal fade" id="editDispositif" tabindex="-1" role="dialog" aria-labelledby="editDispositifLabel" aria-hidden="true">
                  <div class="modal-dialog" role="document">
                    <div class="modal-content">
                      <div class="modal-header">
                        <h5 class="modal-title" id="editDispositifLabel">Edit</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                      </div>
                        <form method="post" id="editDispositifForm" class="" >
                            <div class="modal-body">
                                <input type="hidden" name="cf" value="edit_device" />
                                <input type="hidden" name="modifdispositif" id="dispositif_id" />
                                {% if _session.user.admin != "2"  and  _session.user.admin != "0" %}
                               
                                    <div class="form-group col-6 float-left">
                                        <label for="recipient-name" class="form-control-label">Name:</label>
                                        <input required="required" type="text" class="form-control " name="nom" id="nom">
                                    </div>
                                                
                                    <div class="form-group col-6 float-left">
                                        <label for="recipient-name" class="form-control-label">Code device:</label>
                                        <input required="required" type="text" class="form-control " name="codedispositif" id="codedispositif">
                                    </div>
                                    
                                    <div class="form-group col-6 float-left">
                                        <label for="recipient-name" class="form-control-label mr-3">Type:</label>
                                        <select class="custom-select w-100" name="idtype" id="idtype">
                                            {% for type in types %}
                                                <option value="{{ type.id }}" > {{ type.nom }} </option>
                                            {% endfor%} 
                                        </select>
                                    </div>
                                    
                                    <div class="form-group col-6 float-left">
                                        <label for="recipient-name" class="form-control-label">Store:</label>
                                        <select class="custom-select w-100"  name="idmagasin" id="idmagasin"  >
                                            {% for store in stores %}
                                            <option value="{{ store.id }}" > {{ store.nom }} </option>
                                            {% endfor%} 
                                        </select>
                                    </div>
                                {% endif %} 
                                <div class="form-group col-6 float-left">
                                    <label for="recipient-name" class="form-control-label">Surge:</label>
                                    <select name="parasurtenseur" id="parasurtenseur"  class="custom-select w-100" >
                                        <option  value="0">No</option>
                                        <option value="1">Yes</option>
                                    </select>
                                </div>
                                  
                                <div class="form-group col-6 float-left" id="majreseaumag_row" >
                                    <label for="recipient-name" class="form-control-label" >Network shift:</label>
                                    <select name="majreseaumag"   id="majreseaumag"  class="custom-select w-100" >	
                                        <option value="0">No</option>
                                        <option value="1">Yes</option>
                                    </select>
                                </div>
                                  
                                <div class="form-group col-6 float-left">
                                    <label for="recipient-name" class="form-control-label" >Video:</label>
                                    <select name="connexion"  id="connexion"  class="custom-select w-100" >
                                        <option value="0">HDMI</option>
                                        <option value="1">RCA</option>
                                    </select>
                                </div>
                                
                                <div class="form-group col-6 float-left" id="version_row">
                                    <label for="recipient-name" class="form-control-label" >Version:</label>
                                    <select name="version"  id="version"  class="custom-select w-100" >
                                        <option value="1">1.0</option>
                                        <option value="2">2.0</option>
                                        <option value="3">3.0</option>
                                        <option value="4">4.0</option>
                                    </select>
                                </div>
                            </div>
                
                            <div class="modal-footer">
                              <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                              <button type="button" class="btn btn-primary sbmt_form_dis">Save</button>
                            </div>
                        </form>
                    </div>
                  </div>
                </div>
                
                                    
                            
    

            

     {% for key,modal in  modals %} 







<div class="modal fade" id="dialoginfodisp_{{modal.id}}" tabindex="-1" role="dialog" aria-labelledby="addVilleLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
    <div class="modal-content">
        <div class="modal-header">
            <h5 class="modal-title" id="editDispositifLabel"> Informations Device {{ modal.type_name }}</h5>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
        <div class="modal-body">
        
            <div id="dialoginfodisp{{ modal.id }}" title="Informations Device {% if modal.idtype == "1" %} Sound {% else %} Media {% endif %}">
                <table style="font-size:14px;text-align:left;width:100%;{% if now.0-modal.derniereconnection <=  temps_inactivite %} background-color:#18a689;color:#fff; {% endif %}" cellpadding="5">
                    <tr>
                        <td>
                            <b>Shop {{ modal.store.nom }}</b>
                            <br/>
                            {{ modal.store.codemagasin }}
                        </td>
                        <td style="float:right;text-align:right">
                            +33 {{ modal.store.phone }}
                            <br/>
                            {{ modal.store.email }}
                        </td>
                    </tr>
                    <tr>
                        <td>
                             Address IP:
                        </td>
                        <td  style="float:right">
                           <a href="{{ modal.store.link }}"{% if now.0-modal.derniereconnection <=  temps_inactivite %} style="color:#fff;" {% endif %} target="_blank">{{ modal.store.link_txt }}</a>
                        </td>
                    </tr>
                </table>
                
                <br/>	
                {% if modal.bug.bugreportdate != "" %}
                
                    <table style="font-size:14px;text-align:left;color:white;background-color:grey;width:100%" cellpadding="5">
                        <tr>
                            <td>
                                Date of the last store incident :
                            </td>
                            <td style="float:right">
                                    {{ modal.bug.date_txt}}
                            </td>
                        </tr>
                        <tr>
                            <td>
                                State : 
                            </td>
                            <td style="float:right">
                                {{ modal.bug.bug_txt}}
                            </td>
                        </tr>
                        <tr>
                            <td colspan=2>
                                Information : 
                            </td>
                        </tr>
                        <tr>
                            <td style="width:400px;overflow-x:auto;text-align:right" colspan=2>
                                {{ modal.bug.infos }}
                            </td>
                        </tr>
                    </table>
                    
                    <br/>	
                        
               {% endif %}
               {% if modal.intervention.buginterventiondate != "" %}
                    <table style="font-size:14px;text-align:left;color:white;background-color:#a7a7a7;width:100%; width: 100%;" cellpadding="5">
                        <tr>
                            <td>
                                Date of last intervention :
                            </td>
                            <td style="float:right">
                                {{ modal.etat.date}}
                            </td>
                        </tr>
                        <tr>
                            <td>
                                State : 
                            </td>
                            <td style="float:right">
                                {{modal.intervention.bugreport_txt}}
                            </td>
                        </tr>
                        <tr>
                            <td colspan=2>
                                Information : 
                            </td>
                        </tr>
                        <tr>
                            <td style="width:400px;overflow-x:auto;text-align:right" colspan=2>
                                {{modal.intervention.infos}}
                            </td>
                        </tr>
                    </table>
                    
                    <br/>	

               {% endif %}
                
                <FORM Method="POST" id="forminfodisp{{ modal.id }}">
                
                            <div class="form-group">
                              <label >Information :   </label>
                              <textarea name="infos" class="form-control" ></textarea>
                            </div>

                            <div class="form-group">
                              <label >Device state</label>
                            
                                
                                    <input type="hidden" name="envoirapport" value="{{ modal.idmagasin }}">
                                    <input type="hidden" name="typerapport" value="{{ modal.idtype }}">
                                    <input type="hidden" name="cf" value="send_report">
                                    
                                    
                                    <select name="newetat" class="form-control custom-select mb-2 mr-sm-2 mb-sm-0 ">
                                        <option value="0" {% if modal.etat.bugreport == 0 %}  selected {% endif %} >Problem solved</option>
                                        <option value="1" {% if modal.etat.bugreport == 1 %}  selected {% endif %} >Problem present</option>
                                        <option value="2" {% if modal.etat.bugreport == 2 %}  selected {% endif %} >Problem in treatment</option>
                                        <option value="3" {% if modal.etat.bugreport == 3 %}  selected {% endif %} >Sending solution</option>
                                    </select>
                            </div>
                                                    
                </FORM>		
            </div>
                
            
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                                    
                <button type="button" class="btn btn-primary sbmt_form_dis_rep" src-id="{{modal.id}}">Send Intervention Report</button>
            </div>
    
    
        </div>
      </div>
    </div>


     {% endfor %}


                      
    
                  





{% endblock %}