extends layout_side

block content
    -var convertMinsToHrsMins= function (minutes) { var h = Math.floor(minutes / 60); var m = minutes % 60; h = h < 10 ? '0' + h : h; m = m < 10 ? '0' + m : m; return h + ':' + m;}
    link(rel='stylesheet', href='https://use.fontawesome.com/releases/v5.6.1/css/all.css', integrity='sha384-gfdkjb5BdAXd+lj+gudLWI+BXq4IuLW5IT+brZEZsLFm++aCMlF1V92rMkPaX4PP', crossorigin='anonymous')
    link(href='/bower_components/jquery-ui/themes/vader/jquery-ui.css', rel='stylesheet', type='text/css')
    link(rel='stylesheet', type='text/css', href='/css/ribbonBanner.css')
    link(rel='stylesheet', type='text/css', href='/css/buttonBox.css')
    style(type="text/css"). 
      .glyphicon.normal:hover{
      color:#44c5ff;
      }
      .disabledLink {
        
          cursor: not-allowed;
          color: #afafaf;

      }
        .disabledLink:hover {
          cursor:not-allowed;
          
          }
      .ibr {
          //display: flex !important; 
          clor: blue;
          display: flex;
       // background-color: #006100;
       // width: 140px;
       // height: 140px;
      }
      span2 {
       //border: 2px solid crimson;
       //margin: 4px;
       color: magenta
      }
    #wtimeEditModal.fade.modal(tabindex='-1', role='dialog', aria-labelledby='wtimeEditModalLabel', aria-hidden='true')
      form(method='POST',id='wtimeEditForm' action='/employee/setWorkingTimeById/'+employee._id)
        .modal-dialog(role='document', style='width:620px')
          .modal-content
            .modal-header.bg-primary
              h4#wtimeEditModalLabel.modal-title Munkaidő módosítás #{employee.name} 
            .modal-body

              h4 Jelenlegi rögzítés
              br
              .row 
                .col-sm-3
                  p Bejegyzés Id: 
                .col-sm-2
                  input#idField.idField(name='idField',type=text,readonly) 
              br
              .row 
                .col-sm-3
                  p Érkezés cím: 
                .col-sm-2                                    
                  input#locStartField.locStartField(name='locStartField',type=text) 
              br
              .row  
                .col-sm-3
                  p Érkezés coord: 
                .col-sm-3  
                  input#latStartField.latStartField(name='latStartField',type=text) 
                  input#lonStartField.lonStartField(name='lonStartField',type=text)                 
              br
              .row   
                .col-sm-3
                  p Távozás cím: 
                .col-sm-3  
                  input#locStopField.locStopField(name='locStopField',type=text) 
              br
              .row 
                .col-sm-3
                  p Távozás coord:
                .col-sm-3 
                  input#latStopField.latStopField(name='latStopField',type=text) 
                  input#lonStopField.lonStopField(name='lonStopField',type=text) 
              br
              .row  
                .col-sm-3
                  p Munkaidő:
                .col-sm-3 
                  input#dtPickerArrive(type='datetime-local',pattern="[0-9]{4}.[0-9]{2}.[0-9]{2}. T[0-9]{2}:[0-9]{2}",required, name='dtPickerArrive')     
                  input#dtPickerGetaway(type='datetime-local',pattern="[0-9]{4}.[0-9]{2}.[0-9]{2}. T[0-9]{2}:[0-9]{2}",required, name='dtPickerGetaway')     
                  //input#timeStartField.timeStartField(name='timeStartField',type=text) 
                  //input#timeStopField.timeStopField(name='timeStopField',type=text) 
              
              //input.form-control(id='arrivePicker',name='arrivePicker',type=text, tabindex='2',readonly,style='background-color:#c9ddfc;') 
              //input(type="text",id="datepicker")
              br
              .row 
                .col-sm-3
                  p Munkáltató megjegyzés: 
                .col-sm-4                                   
                  input#companyNotes(name='companyNotes',type=text) 
              br
              //input#birthdaytime(type='datetime-local',pattern="[0-9]{4}.[0-9]{2}.[0-9]{2}. T[0-9]{2}:[0-9]{2}",required, name='birthdaytime')                 
            .modal-footer
              button.btn.btn-secondary(type='button', data-dismiss='modal') Mégsem
              button.btn.btn-primary(type='submit') Rendben
    br    
    if (employee.isSubcontractor==='on')
      aside.ribbon-banner Alvállalkozó 
    else if(employee.isStudent==='on')
      aside.ribbon-banner.student Diák
    .container#wrapper(style='width:100%;')
      .row 
        .col-sm-4
          h2.contHeader(id='title') #{title}
        .col-sm-3
          h2.contHeader(id='month') 
      br
      label(id='uid', style='display:none;') #{employee._id}
      label(id='mindate', style='display:none;' ) 
      //style='display:none;') 
      #form-group(style='margin-left:80px;width:90%;')
        label Elszámolási hónap:
        .row 
          .button-box.col-lg-12
            .input-group.mb-3
              #datetimepicker5.input-group.date
                input.form-control(id='calcDate',name='dateEmission', tabindex='6',type='text',style='color: white;background-color:#2C3446;')
                span.input-group-addon
                  span.glyphicon.glyphicon-calendar  
          
            button.btn.btn-default.button-spacer(id='print2',name='print2',type='button')
              span.glyphicon.glyphicon-print
              |  Nyomtat   
          
            if (employee.isSubcontractor===null) 
                  
              if ((employee.vacationYear-employee.vacationUsed)>0)          
                a.btn.btn-primary.button-spacer(href='/employee/holidays_byperson/'+employee._id) Szabadságok
              else
                a.btn.btn-default.button-spacer(disabled) Szabadságok
              
              a.btn.btn-primary.button-spacer(href='/employee/sickpay_byperson/'+employee._id) Keresőképtelenség
            
            a.btn.btn-success.button-spacer(href='/employee/accesslist') Vissza
        hr     
      if (employee.isSubcontractor===null)
        #darktable.container
          table#monthSumTable.container(style='width:90%;')
            col(width='auto')
            col(width='10%')
            col(width='10%')
            col(width='10%')
            col(width='10%')
            col(width='10%')
            thead
              tr
                th
                  h1(style='text-align:left;font-size: 16px;') Megnevezés
                th
                  h1(style='text-align:center;font-size: 16px;') Normál
                th
                  h1(style='text-align:center;font-size: 16px;') Túlóra   
                th
                  h1(style='text-align:center;font-size: 16px;') Összesen                                
                th
                  h1(style='text-align:center;font-size: 16px;') Pótlék 
                th
                  h1(style='text-align:center;font-size: 16px;') Összesen Pótlékkal                               
            tbody
      if (employee.isSubcontractor==='on')
        #darktable.container
          table#monthSumTable.container(style='width:90%;')
            col(width='auto')
            col(width='10%')
            col(width='10%')
            col(width='10%')
            thead
              tr
                th
                  h1(style='text-align:left;font-size: 16px;') Megnevezés
                th
                  h1(style='text-align:center;font-size: 16px;') Normál
                th
                  h1(style='text-align:center;font-size: 16px;') Túlóra   
                th
                  h1(style='text-align:center;font-size: 16px;') Összesen                                
            tbody            
      if (employee.isSubcontractor===null)              
        #form-group(style='margin-left:5%;width:90%; background-color:#1F2739;')
    
          .row(style='padding-left:10px;')
            .col-sm-2(style='min-width:120px;')
              .form-group(style='min-width:120px;')
                label Éves szabadság:
                input.form-control(id='vacationsY',name='weekendsCount',type=text,readonly,  style='color: white;background-color:#2C3446;')   
            .col-sm-2(style='min-width:120px;')
              .form-group(style='min-width:120px;')
                label Kiadható szabadság:
                input.form-control(id='vacations',name='vacations',type=text,readonly,  style='color: white;background-color:#2C3446;')  
            .col-sm-2(style='min-width:120px;')
              .form-group(style='min-width:120px;')
                label Munkaszüneti napok:
                input.form-control(id='munkaszunet',name='munkaszunet',type=text,readonly,  style='color: white;background-color:#2C3446;')               
      else 
        br
      br
      #darktable.container
        br
        table#monthHoursTableDetails.container(style='width:90%;')
          col(width='5%')
          col(width='5%')
          col(width='40%')
          col(width='6%')
          col(width='6%')
          if(userIsAdmin==true) 
            col(width='3%')
            col(width='3%')          
          col(width='6%')
          col(width='6%')
          col(width='auto')
          thead
            tr
              th
                h1(style='text-align:center') dátum
              th
                h1(style='text-align:center') nap
              th
                h1(style='text-align:center') Helyszín                 
              th
                h1(style='text-align:center') Érkezés               
              th
                h1(style='text-align:right') Távozás
              if(userIsAdmin==true)            
                th
                  h1(style='text-align:center')   
                th
                  h1(style='text-align:center')                              
              th
                h1(style='text-align:left') Órák
              th
                h1(style='text-align:center') Túlóra   
              th
                h1(style='text-align:left') Megjegyzés
          tbody
    script(type='text/javascript', src='/bower_components/jquery/dist/jquery.min.js')
    script(type='text/javascript', src='/bower_components/jquery-ui/jquery-ui.min.js')
    script(type='text/javascript', src='/bower_components/bootstrap/dist/js/bootstrap.min.js') 
    script(type='text/javascript', src='/bower_components/moment/min/moment.min.js')
    script(src='/bower_components/moment/min/moment-with-locales.js')    
    
    script(type='text/javascript', src='/bower_components/eonasdan-bootstrap-datetimepicker/build/js/bootstrap-datetimepicker.min.js') 
    script(src='/js/workingtime.js')
    script(src='/js/accessdetails.js')
    //script(src='/bower_components/air-datepicker/dist/js/datepicker.min.js')
    //script(src='/bower_components/air-datepicker/dist/js/i18n/datepicker.hu.js')
    script.
      $(document).ready(function () {
         jQuery.noConflict(); 
            
        $("#mworkers").click();
        $("#listworktime").addClass("active");
        });
        $(document).on("click",".delete-worktime",function(e){
          var id = $(this).data('id');
          console.log("DataId: "+id)
            var r = confirm("Biztosan torli a "+id+" azonosítójú bejegyzést?\r\n(A művelet nem visszavonható !)");
            if (r == true) {
                  $.ajax({
                  type: 'DELETE',
                  url: '/employee/deleteWorktime/'+id,
                  success: function(response){
                    refreshAccessDetails(); // Lista frissítése betöltéskor	
                  // window.location.href='/';
                  },
                  error: function(err){
                    alert('A törlés nem sikerült.');
                  }
                });
            } 
            

        });
        $(document).on("click", ".openModal", function () {
            var id = $(this).data('id');
            console.log("Click");
            		$.get('/employee/getWorkingTimeById/'+id , function(resp) { 
                  console.log(resp);
                  $(".modal-body #locStartField").val( resp.location);
                  $(".modal-body #locStopField").val( resp.locationStop);
                  $(".modal-body #latStartField").val( resp.latitudeS);
                  $(".modal-body #lonStartField").val( resp.longitudeS);
                  $(".modal-body #latStopField").val( resp.latitudeE);
                  $(".modal-body #lonStopField").val( resp.longitudeE);
                  $(".modal-body #companyNotes").val( resp.company_notes);
                  document.getElementById("dtPickerArrive").value=moment(resp.timeArrive,'YYYY.MM.DD. HH:mm').format('YYYY-MM-DDTHH:mm');
                  document.getElementById("dtPickerGetaway").value=moment(resp.timeGetaway,'YYYY.MM.DD. HH:mm').format('YYYY-MM-DDTHH:mm');
                  
                  });
            //console.log(UserName);
            $(".modal-body #idField").val( id );
        });    
        // Szabadság választó
        $('#datepicker-here').datepicker({
            
            language: 'hu',
            inline: 'true',
            minDate: new Date(), // Now can select only dates, which goes after today
            dateFormat: 'yyyy-mm-dd',
            disableNavWhenOutOfRange: true,
             //selectDate: dt(),
            date: new Date(),
            onSelect : function(fd,date){
            //console.log(fd);
            }
        })