nazar-pc / PickMeUp

Really simple, powerful, customizable and lightweight standalone datepicker
BSD Zero Clause License
615 stars 191 forks source link

select weekend on click #182

Closed peretc001 closed 6 years ago

peretc001 commented 6 years ago

Can you help me with button which selects weekend

$('#week').on('click', function (e) {
var today = new Date();
var monday = new Date();
var tuesday = new Date();
var wednesday = new Date();
var thursday = new Date();
var friday = new Date();
var saturday = new Date();
var sunday = new Date();
// Задаем следующий Пн
if(today.getDay()){monday.setDate(today.getDate() + 8 - today.getDay())} else {monday.setDate(today.getDate() + 1)}
// Задаем остальные дни относительно Пн
tuesday.setDate(monday.getDate() + 1);
wednesday.setDate(monday.getDate() + 2);
thursday.setDate(monday.getDate() + 3);
friday.setDate(monday.getDate() + 4);
saturday.setDate(monday.getDate() + 5);
sunday.setDate(monday.getDate() + 6);

if (today.getDay() == 0 || today.getDay() == 6) // если сегодня Сб или Вс
{
pickmeup('.clndr').set_date([saturday,sunday]); // next week
}
else {
pickmeup('.clndr').set_date([6,7]); // saturday and sunday this week. [6,7]  - TypeError: a.split is not a function
}
});

sorry for my bad english

peretc001 commented 6 years ago

and i have a bug with work days https://jsfiddle.net/peretc001/5999xnbg/

nazar-pc commented 6 years ago

set_date accepts strings. You don't have to craft Date object. But I'm not here to teach you JavaScript basics, sorry.

peretc001 commented 6 years ago

Is it correct?

var today = new Date();

// Задаем следующий Пн
if(today.getDay()){ //если != 0, т.е. не Вс
    monday_date = today.getDate() + 7 - today.getDay(); // вообще-то должно быть +8, но время установлено T21:00:00.000Z, поэтому +7 (фиг знает почему, видимо временная зона какая-то не UTC+3)
    //monday_date = 14+7-4 = 17 хотя по нашей UTC это 18.09.2017 Понедельник, ну да ладно
    //14 - сегодня 14.09.2017
    //4 - сегодня четверг
    } else {
    //если сегодня 0, т.е. сегодня Вс
    monday_date = today.getDate() + 1;
    }

// получаем полное число следующего понедельника в формате YYYY-mm-dd
monday_mec = today.getMonth()+1; // js всегда определяет месяц на 1 меньше поэтому добавляем 1
if (monday_date < 10)  { monday_date = '0' + monday_date; } // если дата меньше 10, добавляем 0, чтоб было 09 например
if (monday_mec < 10)  { monday_mec = '0' + monday_mec; } // тоже самое с месяцем
time = 'T21:00:00.000Z'; // добавляем стандартную временную зону pickmeup календаря

m = today.getUTCFullYear() + '-' + monday_mec + '-' + monday_date + time; // собираем все, получаем понедельник следующей недели, 2017-09-17T21:00:00.000Z
console.log(m);
f = today.getUTCFullYear() + '-' + monday_mec + '-' + (monday_date + 4) + time; // пятница на следующей недели
console.log(f);
su = today.getUTCFullYear() + '-' + monday_mec + '-' + (monday_date + 6) + time; // и воскресенье на следующей недели
console.log(su);
//так как в календарь надо передавать массив, то нам надо только первая и последняя дата выделения
//т.е. для рабочей недели Пн-Пт, для выходных Пт-Вс
this_f = today.getUTCFullYear() + '-' + monday_mec + '-' + (monday_date - 3) + time; // a это пятница на этой недели
console.log(this_f);
this_su = today.getUTCFullYear() + '-' + monday_mec + '-' + (monday_date - 1) + time; // воскресенье на этой недели
console.log(this_su);

//собираем массив рабочих дней
var work = new Array(new Date(m), new Date(f));
console.log(work);
//собираем массив выходных дней на этой недели
var this_week = new Array(new Date(this_f), new Date(this_su));
console.log(this_week);
//собираем массив выходных дней на следующей недели
var next_week = new Array(new Date(f), new Date(su));
console.log(next_week);

$('#work').on('click', function (e) {
    pickmeup('.clndr').set_date(work);  
    var dates_range = pickmeup('.clndr').get_date(); 
    console.log(e.detail.formatted_date);   
});
$('#week').on('click', function (e) {
    //если сегодня Вс, Пт или Сб выделяем даты следующих выходных
    if (today.getDay() == 0 || today.getDay() == 5 || today.getDay() == 6) // если сегодня Сб или Вс
    {
         pickmeup('.clndr').set_date(next_week);
    }
    //если Пн-Чт то этих выходных
    else { pickmeup('.clndr').set_date(this_week); }
}); 

but i don`t understand one things

$('#work').on('click', function (e) {
        pickmeup('.clndr').set_date(work); //Array [ Date 2017-09-17T21:00:00.000Z, Date 2017-09-21T21:00:00.000Z ] 
        var dates_range = pickmeup('.clndr').get_date(); 
        console.log(e.detail.formatted_date);   
    });

why console.log(e.detail.formatted_date); displays undefined

peretc001 commented 6 years ago

https://jsfiddle.net/peretc001/us55fztz/

nazar-pc commented 6 years ago

Friday seems selected with weekend, but otherwise if it works - fine. I'm pretty sure, however, that I'd write it somehow more compact:)

peretc001 commented 6 years ago

friday is small saturday :)