Szabadság Kiadás, naptárban

app.js

@@ -33,11 +33,21 @@ var os = require('os');
 console.log(os.type());
 if (os.type()==='Windows_NT')
 {
-  mongoose.connect('mongodb://admin:MarkoSn1Pb1@iotechnic.eu:27017/nodekb', {  useFindAndModify: false , useNewUrlParser: true,useUnifiedTopology: true });
+  mongoose.connect('mongodb://admin:MarkoSn1Pb1@iotechnic.eu:27017/nodekb', {  useFindAndModify: false , useNewUrlParser: true,useUnifiedTopology: true })
+  .then(() => {
+    console.log('Connected to MongoDB');
+    }).catch((error) => {
+    console.error('Error connecting to MongoDB:', error);
+    });
 }
 else
 {
-  mongoose.connect('mongodb://admin:MarkoSn1Pb1@localhost/nodekb', {  useFindAndModify: false , useNewUrlParser: true,useUnifiedTopology: true });
+  mongoose.connect('mongodb://admin:MarkoSn1Pb1@localhost/nodekb', {  useFindAndModify: false , useNewUrlParser: true,useUnifiedTopology: true })
+  .then(() => {
+    console.log('Connected to MongoDB');
+    }).catch((error) => {
+    console.error('Error connecting to MongoDB:', error);
+    });
 }
 //mongoose.connect('mongodb://nodeUser:Kutafaja1234@localhost/nodekb',{ useMongoClient: true,useFindAndModify: false , useNewUrlParser: true,useUnifiedTopology: true });
 //mongoose.connect('mongodb://admin:MarkoSn1Pb1@iotechnic.eu:27017/nodekb',{ useMongoClient: true });
@@ -1873,6 +1883,7 @@ let receipts = require('./routes/receipts');
 let employee = require('./routes/employee');
 let employeeHolidays = require('./routes/employeeHolidays');
 let gantt = require('./routes/gantt');
+let gantt_holidays = require('./routes/gantt_holidays');
 let devices_rfid = require('./routes/devices_rfid');
 //let tools = require('./routes/tools');
 let certificates_kif = require('./routes/certificates_kif');
@@ -1891,6 +1902,7 @@ const { generateXML } = require('./js/enaploGen');
 app.use('/devicesrfid', devices_rfid);
 app.use('/vehicles', vehicles);
 app.use('/gantt', gantt);
+app.use('/gantt_holidays', gantt_holidays);
 app.use('/articles', articles);
 app.use('/invoices', invoices);
 app.use('/users', users);

js/cmHelper.js

@@ -10,6 +10,7 @@ const CM_Fetch_WorkNumbers=async()=>
 {
     try{
       const response = await fetch(url)
+      if (response.ok){
       const jsonData = await response.json();        
       
         if (jsonData.success)
@@ -137,6 +138,11 @@ const CM_Fetch_WorkNumbers=async()=>
             });
             //console.log(jsonData.val);
           }
+      }
+      else
+      {
+        console.log("Response error CMHelper")
+      }
 }
   catch(error)  {
     console.log(error);

routes/employee.js

@@ -1971,7 +1971,68 @@ router.get('/get_holidaysById/:id', utils.ensureAuthenticated,function(req,res){
   });
 });
 
+// Szabadságok naptárba
+router.get("/holidays_byperson_calendar/:id/:year", async function(req, res){
+  console.log('GANTT3');
+  var data=[];
+  moment.locale('HU');
+  const empId=req.params.id
+  const year=req.params.year
+  const employees=await  Employee.find({'konyvelesre':'on','isSubcontractor':{$ne:'on'}},null,{sort: {name: 1}} );
   
+          await employees.forEach(element => {
+
+              //const color = generateColorHsl(element.name, saturationRange, lightnessRange);
+              //const c=HSLToRGB(color.h,color.s,color.l);
+                element.holidayData.forEach(hd=>{
+                    if (moment(hd.start_date,'DD.MM.YYYY').format('YYYY')==year || moment(hd.end_date,'DD.MM.YYYY').format('YYYY')==year)
+                    {
+                      if (empId==element._id)
+                      {
+                      var task={
+                          id:hd._id,
+                          
+                          start:moment(hd.start_date,'DD.MM.YYYY').startOf('day').format('YYYY-MM-DD HH:mm:SS'),
+                          end:moment(hd.end_date,'DD.MM.YYYY').endOf('day').format('YYYY-MM-DD HH:mm:SS'),//.add(1, 'days').toDate(),//.endOf('day').toDate(),
+                          title:element.name,
+                          allDay:true,
+                          eventBackgroundColor: '#378006',//rgb(c.r,c.g,c.b), 
+                          color: '#378006',
+                          editable:true,
+                          display:'all',
+                          extendedProps: {
+                            employeeId:element._id,
+                            order:1,
+                          },
+                      }
+                    }
+                    else
+                    {
+                      var task={
+                        id:hd._id,
+                        
+                        start:moment(hd.start_date,'DD.MM.YYYY').startOf('day').format('YYYY-MM-DD HH:mm:SS'),
+                        end:moment(hd.end_date,'DD.MM.YYYY').endOf('day').format('YYYY-MM-DD HH:mm:SS'),//.endOf('day').toDate(),
+                        title:element.name,
+                        allDay:true,
+                        eventBackgroundColor: '#378006',//rgb(c.r,c.g,c.b), 
+                        color: '#CDCDCD',
+                        display:'all',
+                        editable:false,
+                        extendedProps: {
+                          employeeId:element._id,
+                          order:0,
+                        },
+                    }
+                    }
+                      data.push(task);
+                    }
+                })
+             
+          });
+          res.send(data);            
+
+});
 // Táppénz felvétele
 router.get('/sickpay_byperson/:id', utils.ensureAuthenticated,function(req,res){
 
@@ -2051,6 +2112,9 @@ router.get('/get_sickpayById/:id', utils.ensureAuthenticated,function(req,res){
       }
   });
 });
+
+
+
 // Új Szabadság kiadása
 router.get('/holidays_byperson/:id', utils.ensureAuthenticated,function(req,res){
 
@@ -2074,6 +2138,42 @@ router.get('/holidays_byperson/:id', utils.ensureAuthenticated,function(req,res)
   });
 });
 
+// Szabadság módosítása
+router.post('/holiday_update', async function(req,res){
+
+  const hd_event=req.body.event;
+  var a = moment(hd_event.start,'YYYY-MM-DD');
+  var b = moment(hd_event.end,'YYYY-MM-DD');
+  //a.diff(b, 'days') // 1
+  let hd ={   
+    duration: b.diff(a, 'days'), // 1
+    start_date: a.format('DD.MM.YYYY'),
+    end_date: b.subtract(1,'days').format('DD.MM.YYYY'),
+
+    
+
+  };
+  const result=await Employee.updateOne(
+    {'_id':mongo.ObjectId(hd_event.extendedProps.employeeId),"holidayData._id":hd_event.id}, 
+    {$set:{'holidayData.$.start_date':hd.start_date,'holidayData.$.end_date':hd.end_date}},
+    )
+   if (result.ok)
+   { 
+    console.log('Holiday Updated! '+hd_event.id);
+    res.setHeader('Content-Type', 'application/json');
+    res.send({'response':'OK','message':'Sikeres módosítás!'});  
+  
+  }
+   else
+   {
+    console.log('Holiday Failed to Update! '+hd_event.id);
+    res.setHeader('Content-Type', 'application/json');
+    res.send({'response':'Fail','message':'Sikertelen Módosítás!'});  
+  
+  }
+  //console.log('Old event: '+old_event.start+' '+old_event.stop)
+})
+
 // Szabadság törlése
 router.delete('/holidays_delete/:uid/:hid',utils.ensureAuthenticated,function(req,res){
   console.log("Delete UID: "+req.params.uid);

routes/gantt_holidays.js

@@ -0,0 +1,165 @@
+const express = require('express');
+const router = express.Router();
+const moment = require('moment');
+
+const { mongo, Mongoose } = require('mongoose');
+let Work=require('../models/works');
+let Employee = require('../models/employee');
+var utils = require('../js/utils');
+const { default: mongoose } = require('mongoose');
+
+// Add Devices ToRoute
+router.get('/', utils.ensureAuthenticated,async function (req,res)  {
+  const employees=await  Employee.find({'konyvelesre':'on','isSubcontractor':{$ne:'on'}},null,{sort: {name: 1}} );
+  await employees.forEach(element => {
+
+    const color = generateColorHsl(element.name, saturationRange, lightnessRange);
+    const c=HSLToRGB(color.h,color.s,color.l);
+    element.color=c;
+    })
+        res.render('gantt_holiday', {
+                title: 'Szabadságok',
+                employees:employees
+              });            
+
+   });
+
+   router.get('/getcolors', utils.ensureAuthenticated,async function (req,res)  {
+    const employees=await  Employee.find({'konyvelesre':'on'},null,{sort: {name: 1}} );
+    var colors=[];
+    await employees.forEach(element => {
+  
+      const color = generateColorHsl(element.name, saturationRange, lightnessRange);
+      const c=HSLToRGB(color.h,color.s,color.l);
+      colors.push(c);
+      })
+      res.send(colors);            
+  
+     });
+
+const getHashOfString = (str) => {
+    let hash = 0;
+    for (let i = 0; i < str.length; i++) {
+      // tslint:disable-next-line: no-bitwise
+      hash = str.charCodeAt(i) + ((hash << 5) - hash);
+    }
+    hash = Math.abs(hash);
+    return hash;
+  };
+
+  const normalizeHash = (hash, min, max) => {
+    return Math.floor((hash % (max - min)) + min);
+  };
+
+  const generateHSL = (name, saturationRange, lightnessRange) => {
+    const hash = getHashOfString(name);
+    const h = normalizeHash(hash, 0, 360);
+    const s = normalizeHash(hash, saturationRange[0], saturationRange[1]);
+    const l = normalizeHash(hash, lightnessRange[0], lightnessRange[1]);
+    return [h, s, l];
+  };
+
+  const HSLtoString = (hsl) => {
+   // return `hsl(${hsl[0]}, ${hsl[1]}%, ${hsl[2]}%)`;
+   return {'h':hsl[0],'s':hsl[1],'l':hsl[2]}
+  };
+  
+const generateColorHsl = (id, saturationRange, lightnessRange) => {
+    return HSLtoString(generateHSL(id, saturationRange, lightnessRange));
+  };
+  
+  const getInitials = (user) => {
+      return `${user.name.first[0]}${user.name.last[0]}`
+  }
+  
+  const setValue = (functionFor) => {
+      return (e) => {
+        const value = parseInt(e.target.value);
+      functionFor(value);
+    }
+  };
+  
+  const getRange = (value, range) => {
+      return [Math.max(0, value-range), Math.min(value+range, 100)];
+  }
+
+  const saturation = 50;
+  const lightness = 50;
+  const range = 10;
+  const saturationRange = getRange(saturation, range);
+  const lightnessRange = getRange(lightness, range);
+  	
+  function HSLToRGB(h,s,l) {
+  // Must be fractions of 1
+  s /= 100;
+  l /= 100;
+
+  let c = (1 - Math.abs(2 * l - 1)) * s,
+      x = c * (1 - Math.abs((h / 60) % 2 - 1)),
+      m = l - c/2,
+      r = 0,
+      g = 0,
+      b = 0;
+  
+    if (0 <= h && h < 60) {
+      r = c; g = x; b = 0;  
+    } else if (60 <= h && h < 120) {
+      r = x; g = c; b = 0;
+    } else if (120 <= h && h < 180) {
+      r = 0; g = c; b = x;
+    } else if (180 <= h && h < 240) {
+      r = 0; g = x; b = c;
+    } else if (240 <= h && h < 300) {
+      r = x; g = 0; b = c;
+    } else if (300 <= h && h < 360) {
+      r = c; g = 0; b = x;
+    }
+    r = Math.round((r + m) * 255);
+    g = Math.round((g + m) * 255);
+    b = Math.round((b + m) * 255);
+  
+    //return {'r':r,'g':g,'b':b};
+   return "rgb(" + r + "," + g + "," + b + ")";
+  }
+
+router.get("/data/:display/:year", async function(req, res){
+    console.log('GANTT2');
+    var data=[];
+    moment.locale('HU');
+    const display=req.params.display
+    const year=req.params.year
+    const employees=await  Employee.find({'konyvelesre':'on','isSubcontractor':{$ne:'on'}},null,{sort: {name: 1}} );
+
+            await employees.forEach(element => {
+
+                const color = generateColorHsl(element.name, saturationRange, lightnessRange);
+                const c=HSLToRGB(color.h,color.s,color.l);
+                if (element.konyvelesre=='on')
+                {
+                  element.holidayData.forEach(hd=>{
+                      if (moment(hd.start_date,'DD.MM.YYYY').format('YYYY')==year || moment(hd.end_date,'DD.MM.YYYY').format('YYYY')==year)
+                      {
+                        var task={
+                            id:hd._id,
+                            
+                            start:moment(hd.start_date,'DD.MM.YYYY').startOf('day').format('YYYY-MM-DD HH:mm:SS'),
+                            end:moment(hd.end_date,'DD.MM.YYYY').add(1, 'days').toDate(),//.endOf('day').toDate(),
+                            title:element.name,
+                            allDay:true,
+                            eventBackgroundColor: '#378006',//rgb(c.r,c.g,c.b), 
+                            color: c,//'#378006',
+                            display:display,
+                            extendedProps: {
+                              employeeId:element._id,
+                            },
+                        }
+                        data.push(task);
+                      }
+                  })
+                }
+            });
+            res.send(data);            
+
+});
+
+module.exports = router;

views/employee_holidays_byperson.pug

@@ -4,6 +4,10 @@ block content
     - function datesDiff(s,e) { var a=moment(e,'DD-MM-YYYY');var b=moment(s,'DD-MM-YYYY'); return a.diff(b,'days'); };
     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(rel='stylesheet', type='text/css', href='https://unpkg.com/lightpick@latest/css/lightpick.css')
+    style(type="text/css").
+      .mx {
+          margin: 0 5px;
+      }
     #holidayModal.modal(tabindex='-1', role='dialog', aria-labelledby='holidayModalLabel', aria-hidden='true')
       form(method='POST',id='holidayForm' action='/employee/holidays_byperson/'+employee._id)
         .modal-dialog(role='document', style='width:620px')
@@ -23,88 +27,51 @@ block content
               button.btn.btn-primary(type='submit') Rendben
     br 
     label#uid(style='display:none;') #{employee._id}
-    .container#wrapper(style='width:100%;')
-      h2.contHeader(id='month') #{title} 
+    .container(style='width:95%')
+
+        .panel.panel-primary(style='width:95%')
+          .panel-heading
+            h2 #{title}
+          .panel-body
             br
-      #form-group(style='margin-left:65px;width:90%; background-color:#1F2739;')
+            #form-group(style='margin-left:65px;width:90%;')
               
               .row(style='padding-left:10px;')
-          .col-sm-2(style='min-width:100px;')
+                .col-sm-2(style='min-width:100px')
                   .form-group
-              label Összes szabadság:
-              input.form-control(id='vacationYear',name='vacationYear',type=text,readonly,  style='color: white;background-color:#2C3446;width:140px',value=employee.vacationYear)
+                    label(style='color:black  !important;') Összes szabadság:
+                    input.form-control(id='vacationYear',name='vacationYear',type=text,readonly,  style='color: black;width:140px',value=employee.vacationYear)
                 .col-sm-2(style='min-width:100px;')
                   .form-group(style='min-width:100px;')
-              label Kiadott szabadság:
-              input.form-control(id='vacationUsed',name='vacationUsed',type=text,readonly,  style='color: white;background-color:#2C3446;width:140px',value=employee.vacationUsed)
+                    label(style='color:black  !important;') Kiadott szabadság:
+                    input.form-control(id='vacationUsed',name='vacationUsed',type=text,readonly,  style='color: black;width:140px',value=employee.vacationUsed)
                 .col-sm-2(style='min-width:100px;')
                   .form-group(style='min-width:100px;')
-              label Maradék szabadság:
-              input.form-control(id='vacationLeft',name='vacationLeft',type=text,readonly,  style='color: white;background-color:#2C3446;width:140px',value=employee.vacationYear-employee.vacationUsed) 
-          .col-sm-3
+                    label(style='color:black  !important;') Maradék szabadság:
+                    input.form-control(id='vacationLeft',name='vacationLeft',type=text,readonly,  style='color: black;width:140px',value=employee.vacationYear-employee.vacationUsed) 
+                .col-sm-5
                   .form-group(style='min-width:100px;')
-              a.btn.btn-primary(href='#',data-toggle='modal', data-target='#holidayModal',style='margin-top:24px;') Új szabadság kiadása
-              //a.trigger(href='#', data-toggle='modal', data-target='#holidayModal') Új szabadság kiadása  
+                    a.btn.btn-primary.btn-sm(href='#',data-toggle='modal', data-target='#holidayModal',style='margin-top:24px;') Új szabadság kiadása
                     |    
                     button.btn.btn-default.btn-sm(id='print2',name='print2',type='button',style='margin-top:24px;', data-toggle='modal', data-target='#holidayModal')
                       span.glyphicon.glyphicon-print
                       |  Nyomtat 
+                    |    
+                    a.btn.btn-success.btn-sm(href='/employee/detailstemp/'+employee._id,style='margin-top:24px;') Vissza
             br         
-      #darktable.container
-        table#holidayTable.container(style='width:90%;')
-          col(width='5%')
-          -//col(width='auto')
-          col(width='17%')
-          col(width='12%')
-          col(width='12%')
-          -//col(width='5%')
-          -//col(width='5%')
-          -//col(width='5%')
-          thead
-            tr
-              th
-                h1(style='text-align:center') #
-              -//  th
-              -//    h1 Név
-              th
-                h1(style='text-align:left') Kezdet                
-              th
-                h1(style='text-align:left') Lejárat
-              th
-                h1(style='text-align:left') Napok               
-              th
-                h1(style='text-align:left') Művelet
-            -// th
-            -//   h1(style='text-align:right') Státusz
-            -// th
-            -//   h1(style='text-align:center') Helyszín                
-            -// th
-            -//   h1(style='text-align:center') Órák
-          tbody
-            each hd, i in employee.holidayData
-              tr
-                td #{i+1}
-                td(style='text-align:left') #{moment(hd.start_date,'DD-MM-YYYY').format('YYYY.MM.DD')}
-                td(style='text-align:left') #{moment(hd.end_date,'DD-MM-YYYY').format('YYYY.MM.DD')}
-                td(style='text-align:left') #{hd.duration} 
-                td 
-                  div
-                    a.delete-holiday(href='#' ,data-id=employee._id,data-hid=hd._id, style="color:red")
-                      span.glyphicon.glyphicon-trash.normal
+            #calendar(style="background-color: white;")     
+
+ 
  
     script(type='text/javascript', src='/bower_components/jquery/dist/jquery.min.js')
     script(type='text/javascript', src='/bower_components/moment/min/moment.min.js')
+    script(src='https://cdn.jsdelivr.net/npm/fullcalendar/index.global.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='https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js')
     script(src='https://unpkg.com/lightpick@latest/lightpick.js')          
     script(src='/js/workingtime.js')
     script.
-      function submitDeviceNumber(a)
-      {
-        console.log(a);
-      }
-
       //Szabadság törlése
         $(document).on("click",".delete-holiday",function(e)
         {
@@ -179,12 +146,101 @@ block content
 
          
         });
-        /*$.get('/employee/worktimelist/'+moment().format('YYYY.MM.DD') , function(wtList) { 
-          renderWorkingTimesTable(wtList);
-        });	*/
+
         $("#mworkers").click();
         $("#listworktime").addClass("active");
+        //  Calendar
+                    var calendarEl = document.getElementById('calendar');
+                    var empId = document.getElementById('uid')
+                    const year=+moment().format("YYYY")
+                    var calendar = new FullCalendar.Calendar(calendarEl, {
+                    initialView: 'multiMonthFourMonth',
+                    locale: 'hu',
+                    firstDay: 1,
+                    initialDate: '2024-01-01',
+                    height: 'auto',
+                    //eventLimit: true,
+                    eventOrder: '-order',
+                    showNonCurrentDates:false,
+                    //dayMaxEvents: 10,
+                    //dayMaxEventRows: 10,
+                    nextDayThreshold: "01:00:00",
+                    displayEventTime: false,
+                    editable: true,
+                    eventStartEditable:true,
+                    eventDurationEditable:true,
+                    views: {
+                      multiMonthFourMonth: {
+                        type: 'multiMonth',
+                        duration: { months: 12 },
+                        multiMonthMaxColumns: 2,
+                        eventLimit: 10,
+                      }
+                    },
+                    //initialEvents: res,
+                    //events: '/employee/holidays_byperson_calendar/'+empId.textContent+'/'+year,
+                    weekNumbers: true,
+                    themeSystem: 'default',
+                      eventClick: function(info) {
+                      //alert('Event: ' + info.event.title+'\n'+info.event.id+'\n'+info.event.extendedProps.employeeId);
+                      console.log('Event: ' + info.event.title+'\n'+info.event.id+'\n'+info.event.extendedProps.employeeId)
+
+                      // change the border color just for fun
+                      info.el.style.borderColor = 'red';
+                    },
+                      eventDrop: async function( eventDropInfo ) {
+                        if (!confirm("Biztosan végrehajtja a módosítást?\n\nA változásról "+eventDropInfo.event.title+" e-mail értesítést fog kapni.")) 
+                        {
+                          eventDropInfo.revert();
+                        }
+                        else 
+                        {
+                          console.log("Event ID: "+eventDropInfo.event.id)
+                          console.log("Event Before Drop\n"+eventDropInfo.oldEvent.start+'-'+eventDropInfo.oldEvent.end)
+                          console.log("Event After Drop\n"+eventDropInfo.event.start+'-'+eventDropInfo.event.end)
+                          const response = await fetch("/employee/holiday_update", {
+                              headers: {
+                                "Content-Type": "application/json",
+                              },
+                            method: "POST",
+                            body: JSON.stringify({ event: eventDropInfo.event }),
+                            });
+                            if (!response.ok) {
+                                      //throw new Error(`HTTP error! Status: ${response.status}`);
+                                      alert(`HTTP error! Status: ${response.status}`)
+                                  }
+                            if (response.response="OK")
+                            {
+                              alert("Sikeres Módosítás!")
+                            }
+                        }
+                      },
+                      eventResize:function( eventResizeInfo ) {
+                        if (!confirm("Biztosan végrehajtja a módosítást?\n\nA változásról "+eventResizeInfo.event.title+" e-mail értesítést fog kapni.")) 
+                        {
+                          eventResizeInfo.revert();
+                        }
+                        else 
+                        {                        
+                          console.log("Event Before Drop\n"+eventResizeInfo.oldEvent.start+'-'+eventResizeInfo.oldEvent.end)
+                          console.log("Event After Drop\n"+eventResizeInfo.event.start+'-'+eventResizeInfo.event.end)
+                        }
+                      },
+                    // ÉV választás
+                        datesSet: async function (info) {
+                        var empId = document.getElementById('uid')
+                        const year=moment(info.view.activeStart).format("YYYY")
+                        calendar.removeAllEventSources();
+                        calendar.addEventSource('/employee/holidays_byperson_calendar/'+empId.textContent+'/'+year)    
+                        
+                        
+
+
+                      }
 
                     });
                       
+                      calendar.render();
+              });
+
   

views/employee_holidays_byperson_2.pug

@@ -0,0 +1,190 @@
+extends layout_side
+
+block content
+    - function datesDiff(s,e) { var a=moment(e,'DD-MM-YYYY');var b=moment(s,'DD-MM-YYYY'); return a.diff(b,'days'); };
+    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(rel='stylesheet', type='text/css', href='https://unpkg.com/lightpick@latest/css/lightpick.css')
+    #holidayModal.modal(tabindex='-1', role='dialog', aria-labelledby='holidayModalLabel', aria-hidden='true')
+      form(method='POST',id='holidayForm' action='/employee/holidays_byperson/'+employee._id)
+        .modal-dialog(role='document', style='width:620px')
+          .modal-content
+            .modal-header
+              h4#holidayModalLabel.modal-title Szabadság kiadása #{employee.name}
+              h4.modal-title(id='Holidays', data-remaining=employee.vacationYear-employee.vacationUsed) Kiadható szabadság: #{employee.vacationYear-employee.vacationUsed} nap.
+            .modal-body
+              h4 Szabadság időtartama:
+              input#sField(name='sField',type=text,readonly, style='display:none;') 
+              input#eField(name='eField',type=text,readonly, style='display:none;')
+              input.form-control(id='holidayPicker',name='holidayPicker',type=text, tabindex='2',readonly,style='background-color:#c9ddfc;') 
+              //input(type="text",id="datepicker")
+              br                 
+            .modal-footer
+              button.btn.btn-secondary(type='button', data-dismiss='modal') Mégsem
+              button.btn.btn-primary(type='submit') Rendben
+    br 
+    label#uid(style='display:none;') #{employee._id}
+    .container#wrapper(style='width:100%;')
+      h2.contHeader(id='month') #{title} 
+      br
+      #form-group(style='margin-left:65px;width:90%; background-color:#1F2739;')
+        
+        .row(style='padding-left:10px;')
+          .col-sm-2(style='min-width:100px;')
+            .form-group
+              label Összes szabadság:
+              input.form-control(id='vacationYear',name='vacationYear',type=text,readonly,  style='color: white;background-color:#2C3446;width:140px',value=employee.vacationYear)
+          .col-sm-2(style='min-width:100px;')
+            .form-group(style='min-width:100px;')
+              label Kiadott szabadság:
+              input.form-control(id='vacationUsed',name='vacationUsed',type=text,readonly,  style='color: white;background-color:#2C3446;width:140px',value=employee.vacationUsed)
+          .col-sm-2(style='min-width:100px;')
+            .form-group(style='min-width:100px;')
+              label Maradék szabadság:
+              input.form-control(id='vacationLeft',name='vacationLeft',type=text,readonly,  style='color: white;background-color:#2C3446;width:140px',value=employee.vacationYear-employee.vacationUsed) 
+          .col-sm-3
+            .form-group(style='min-width:100px;')
+              a.btn.btn-primary(href='#',data-toggle='modal', data-target='#holidayModal',style='margin-top:24px;') Új szabadság kiadása
+              //a.trigger(href='#', data-toggle='modal', data-target='#holidayModal') Új szabadság kiadása  
+              |    
+              button.btn.btn-default.btn-sm(id='print2',name='print2',type='button',style='margin-top:24px;', data-toggle='modal', data-target='#holidayModal')
+                span.glyphicon.glyphicon-print
+                |  Nyomtat  
+      br      
+      #darktable.container
+        table#holidayTable.container(style='width:90%;')
+          col(width='5%')
+          -//col(width='auto')
+          col(width='17%')
+          col(width='12%')
+          col(width='12%')
+          -//col(width='5%')
+          -//col(width='5%')
+          -//col(width='5%')
+          thead
+            tr
+              th
+                h1(style='text-align:center') #
+              -//  th
+              -//    h1 Név
+              th
+                h1(style='text-align:left') Kezdet                
+              th
+                h1(style='text-align:left') Lejárat
+              th
+                h1(style='text-align:left') Napok               
+              th
+                h1(style='text-align:left') Művelet
+            -// th
+            -//   h1(style='text-align:right') Státusz
+            -// th
+            -//   h1(style='text-align:center') Helyszín                
+            -// th
+            -//   h1(style='text-align:center') Órák
+          tbody
+            each hd, i in employee.holidayData
+              tr
+                td #{i+1}
+                td(style='text-align:left') #{moment(hd.start_date,'DD-MM-YYYY').format('YYYY.MM.DD')}
+                td(style='text-align:left') #{moment(hd.end_date,'DD-MM-YYYY').format('YYYY.MM.DD')}
+                td(style='text-align:left') #{hd.duration} 
+                td 
+                  div
+                    a.delete-holiday(href='#' ,data-id=employee._id,data-hid=hd._id, style="color:red")
+                      span.glyphicon.glyphicon-trash.normal
+ 
+    script(type='text/javascript', src='/bower_components/jquery/dist/jquery.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='https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js')
+    script(src='https://unpkg.com/lightpick@latest/lightpick.js')          
+    script(src='/js/workingtime.js')
+    script.
+      function submitDeviceNumber(a)
+      {
+        console.log(a);
+      }
+
+      //Szabadság törlése
+        $(document).on("click",".delete-holiday",function(e)
+        {
+            var id = $(this).data('id');
+            var hid = $(this).data('hid');
+            console.log("DataId: "+id+"\nHolidayId: "+hid);
+            var r = confirm("Biztosan torli a "+id+" azonosítójú szabadságot?\r\n(A művelet nem visszavonható !)");
+            if (r == true) 
+            {
+                  $.ajax({
+                      type: 'DELETE',
+                      url: '/employee/holidays_delete/'+id+'/'+hid,
+                      success: function(response)
+                        {
+                          //refreshAccessDetails(); // Lista frissítése betöltéskor	
+                        // window.location.href='/';
+                          console.log('Resp: '+response);
+                          location.reload();
+                          alert('Resp: '+response);
+                        },
+                      error: function(err)
+                        {
+                          alert('A törlés nem sikerült.');
+                        }
+                    });
+            } 
+        });   
+        $('#holidayform').on('submit', function(e) {
+            e.preventDefault();
+            var data =  $(this).serialize();
+            $.get('/localLogin', data, function(result) {
+                if(result.valid == true)
+                {
+                    window.location.href = '/profile';
+                }
+                else
+                {
+                    $('#loginPopup').html(result);
+                }
+            });
+        });
+      $(document).ready(function () {
+        //jQuery.noConflict();
+        var bodyId = document.getElementById('Holidays');
+        var remaining=bodyId.getAttribute('data-remaining');
+
+
+        var picker = new Lightpick({ field: document.getElementById('holidayPicker'),
+                                    singleDate: false, 
+                                    inline: true,  
+                                    numberOfColumns: 2,  
+                                    numberOfMonths: 4,
+                                    disableWeekends: false,
+                                    //minDate: moment(),
+                                    maxDays:  remaining,
+                                    //disableDates:  [['21.09.2020', '22.09.2020'], ['24.09.2020', '25.09.2020']],
+                                    onSelect: function(start, end){
+                                      var startField = '';
+                                      var endField = '';
+                                      startField = start.format('DD.MM.YYYY');
+                                      endField = end ? end.format('DD.MM.YYYY') : '...';
+                                      document.getElementById('sField').value = startField;
+                                      document.getElementById('eField').value = endField;
+                                    }
+                                    
+                                    });
+
+            console.log(remaining);
+            $.get('/employee/get_holidaysById/'+document.getElementById('uid').innerHTML, function(result){
+            console.log(result);
+            picker.setDisableDates(result);
+
+         
+        });
+        /*$.get('/employee/worktimelist/'+moment().format('YYYY.MM.DD') , function(wtList) { 
+          renderWorkingTimesTable(wtList);
+        });	*/
+        $("#mworkers").click();
+        $("#listworktime").addClass("active");
+
+      });
+
+  

views/gantt_holiday.pug

@@ -0,0 +1,181 @@
+extends layout
+
+block content
+    link(rel='stylesheet' href='/bower_components/jquery-typeahead/dist/jquery.typeahead.min.css')
+    
+    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='https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.13.1/css/all.css' rel='stylesheet')
+    style(type="text/css").
+        #calendar {
+        height: 100%;
+        margin: 40px auto;
+      }
+      .fc-event.hidden {
+      display: none;
+      }
+      .badge{
+          position: relative !important;
+          right: -1.7em !important;
+          top: -0.7em !important;
+         
+
+      }
+
+      //-.container#wrapper(style='width:100%;')
+    .mainContainer
+      .panel.panel-primary
+        .panel-heading
+          h2.contHeader #{title}
+        .panel-body
+        
+          .container(style='width:100%; ')
+            button.btn.btn-warning(id='toggleAll',class='toggleAll',style='margin-right:4px;margin-bottom: 4px',data-view='auto') Mind elrejt
+          .container#buttonsEmp(style='width:100%; ')
+              each employee, l in employees
+                button.btn.btn-none(id=employee._id,class='toggle',style='width:200px;margin-right:4px;margin-bottom: 4px; color:white',data-index=l,data-empId=employee._id,data-view='auto',data-color=employee.color)&attributes({'style': 'background-color:'+employee.color}) 
+                  | #{employee.name}
+                  span.badge.badge-warning
+                    | #{employee.vacationYear+'/'+employee.vacationUsed}
+                    
+          #calendar(style="background-color: white")
+    script(src='/bower_components/jquery/dist/jquery.js')
+    script(src='https://cdn.jsdelivr.net/npm/fullcalendar/index.global.min.js')
+    //-script(src='https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js')
+    script(src='https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js')
+    script(type='text/javascript').
+     $(document).ready(async function() {
+            //var toggle=[];
+            //const response = await fetch('/gantt_holidays/getcolors');
+            //const colors = await response.json();
+            var calendarEl = document.getElementById('calendar');
+            var calendar = new FullCalendar.Calendar(calendarEl, {
+            initialView: 'multiMonthYear',
+            locale: 'hu',
+            firstDay: 1,
+            eventLimit:true,
+            dayMaxEvents: 10,
+            dayMaxEventRows: 10,
+            displayEventTime: false,
+            editable: false,
+            height: 'auto',
+            //initialEvents: res,
+            events: '/gantt_holidays/data/all/'+moment().format("YYYY"),
+            weekNumbers: true,
+            themeSystem: 'default',
+              eventClick: function(info) {
+              //alert('Event: ' + info.event.title+'\n'+info.event.id+'\n'+info.event.extendedProps.employeeId);
+              console.log('Event: ' + info.event.title+'\n'+info.event.id+'\n'+info.event.extendedProps.employeeId)
+
+              // change the border color just for fun
+              info.el.style.borderColor = 'red';
+            },
+            // ÉV választás
+                datesSet: async function (info) {
+                calendar.removeAllEventSources();
+                calendar.addEventSource('/gantt_holidays/data/all/'+moment(info.view.activeStart).format("YYYY"))    
+                
+                //Az összes gomb visszaállítása.
+                const buttonsEmp = document.querySelectorAll('.toggle')
+
+                buttonsEmp.forEach(await function(currentBtn){
+                      currentBtn.style='\
+                                        width:200px; \
+                                        margin-right: \
+                                        4px;margin-bottom: 4px; \
+                                        color: white; \
+                                        background-color:'+currentBtn.dataset.color
+
+                  })
+              }
+
+            });
+              
+              calendar.render();
+              function handleEvent(ev)
+              {
+                const empid=ev.target.dataset.empid
+                const btnIndex=ev.target.dataset.index
+                var visible=ev.target.dataset.view
+                if (visible=='auto')
+                {
+                    //ev.target.className='btn btn-none col-sm-1 toggle'
+                    ev.target.dataset.view='none'
+                    ev.target.style='margin-right:4px;margin-bottom: 4px;'
+                }
+                else 
+                {
+                  //ev.target.className='btn btn-none col-sm-1 toggle'
+                  ev.target.dataset.view='auto'
+                  ev.target.style='margin-right:4px;margin-bottom: 4px; background-color:'+ev.target.dataset.color//colors[btnIndex]
+                  
+                }
+                
+                console.log(empid)
+                let event = calendar.getEventById(empid)
+                let eventList=calendar.getEvents();
+                eventList.forEach(function(evt){
+                  if (evt.extendedProps.employeeId==empid)
+                  {
+                      evt.setProp('display', ev.target.dataset.view ) ;  
+                  }
+                })
+
+              }
+
+              async function handleEventAll(ev)
+              {
+              
+                var visible=ev.target.dataset.view
+                //console.log('Before'+ev.target.dataset.view)
+                if (visible=='auto')
+                {
+                    ev.target.className='btn btn-none toggleAll'
+                    ev.target.dataset.view='none'
+                    ev.target.dataset.textContent='Mind látszik'
+                    ev.target.dataset.url='/gantt_holidays/data/none'
+                   
+                }
+                else 
+                {
+                  ev.target.className='btn btn-warning toggleAll'
+                  ev.target.dataset.view='auto'
+                  ev.target.dataset.textContent='Mind elrejt'
+                  ev.target.dataset.url='/gantt_holidays/data/all'
+                  
+                }
+                ev.target.textContent=ev.target.dataset.textContent
+                //console.log('After'+ev.target.dataset.view)
+                calendar.removeAllEventSources();
+                calendar.addEventSource(ev.target.dataset.url+moment(calendar.currentData.currentDate).format("YYYY"))
+                
+                const buttons = document.querySelectorAll('.toggle')
+
+                buttons.forEach(await function(currentBtn){
+                    if (ev.target.dataset.view=='auto')
+                    {
+                      currentBtn.style='width:200px;margin-right:4px;margin-bottom: 4px; color: white;background-color:'+currentBtn.dataset.color
+                    }
+                    else 
+                    {
+                      currentBtn.style='width:200px;margin-right:4px;margin-bottom: 4px; color:black'
+                      
+                    }
+                    currentBtn.dataset.view=ev.target.dataset.view
+                  })
+              }
+
+
+              const buttons = document.querySelectorAll('.toggle')
+              buttons.forEach(function(currentBtn){
+                currentBtn.addEventListener('click', handleEvent)
+              })
+              const buttonAll = document.getElementById('toggleAll')
+              
+                buttonAll.addEventListener('click', handleEventAll)
+              
+            //document.querySelector(".toggle").addEventListener('click',function(ev) {
+
+              //calendar.changeView('timeGridWeek');
+              
+           
+      })

views/vehicles.pug

@@ -223,7 +223,7 @@ block content
            // Szerkesztés modal
            $(document).on('show.bs.modal','#vehicleEditModal', function () {
            //$('#vehicleEditModal').on('show.bs.modal', function () {
-            console.log('PICSA!');
+           // console.log('PICSA!');
           //$(document).on('show.bs.modal','#vehicleEditModal', function () {
               var getIdFromRow = $(event)[0].currentTarget.activeElement.getAttribute('data-id')//$(event.target).closest('tr').data('id');
               var getVidFromRow = $(event)[0].currentTarget.activeElement.getAttribute('data-vid');//$(event.target).closest('tr').data('vid');