日期时间选取器中的约会释放/锁定控制

Question

我把xdsoft datetimepicker作为我的框架来编程预约系统。我的基本想法是从sql数据库中获取所有配置参数和约会，到目前为止它工作得很好，但问题仍然是灵活性，例如，如果我只想允许特定日期的特定时间，它始终应用于所有日期，而不仅仅是特定日期。如果我想禁用特定时间，它也始终被禁用所有日期。到目前为止，我配置的是我在 PHP 中计算所有内容，并直接在日期时间选择器 ini 中回显所有选项。这是我的代码：

<?php
echo'
    <script> //conf calendar
                        var reserviert = $.parseJSON(''.$reserved.''); //here in this var I get all appointments from sql as a json and parse it afterwards
                        window.onerror = function(errorMsg) {$("#console").html($("#console").html()+"<br>"+errorMsg)}
                        $.datetimepicker.setLocale("de");
                        var logik = function( currentDateTime ){  //logic for specific weekdays
                            switch(currentDateTime.getDay()){
                                case 1:
                                    this.setOptions({
                                      minTime: '.$confIn['min1'].',
                                      maxTime: '.$confIn['max1'].',
                                      allowTimes: ['.$confIn['allow1'].'] 
                                    });
                                break;
                                case 2:
                                    this.setOptions({
                                      minTime: '.$confIn['min2'].',
                                      maxTime: '.$confIn['max2'].',
                                      allowTimes: ['.$confIn['allow2'].']
                                    });
                                break;
                                case 3:
                                    this.setOptions({
                                      minTime: '.$confIn['min3'].',
                                      maxTime: '.$confIn['max3'].',
                                      allowTimes: ['.$confIn['allow3'].']
                                    });
                                break;
                                case 4:
                                    this.setOptions({
                                      minTime: '.$confIn['min4'].',
                                      maxTime: '.$confIn['max4'].',
                                      allowTimes: ['.$confIn['allow4'].']
                                    });
                                break;
                                case 5:
                                    this.setOptions({
                                      minTime: '.$confIn['min5'].',
                                      maxTime: '.$confIn['max5'].',
                                      allowTimes: ['.$confIn['allow5'].']
                                    });
                                break;
                                case 6:
                                    this.setOptions({
                                      minTime: '.$confIn['min6'].',
                                      maxTime: '.$confIn['max6'].',
                                      allowTimes: ['.$confIn['allow6'].']
                                    });
                                break;
                                case 7:
                                    this.setOptions({
                                      minTime: '.$confIn['min7'].',
                                      maxTime: '.$confIn['max7'].',
                                      allowTimes: ['.$confIn['allow7'].']
                                    });
                                break;
                                default:
                                    this.setOptions({
                                         minTime: false,
                                         maxTime: false,
                                         allowTimes: []
                                    });
                            }
                        };
                        $("#datetimepicker3").datetimepicker({
                            '.$blocked.' //blocking weekened
                            inline:true,
                            value: new Date(),
                            allowTimes:['.$weekdatetimeconf['onlyT'].$timeFlex.'], //allowing times, general + flex conf, i should do it in one variable, still need to change it though
                            allowDates: ['.$weekdatetimeconf['onlyD'].$dateFlex.'], // lockes everything except specific date
                            disabledDates: ['.$weekdatetimeconf['banD'].'], // lock specific date
                            disabledWeekDays:['.$weekdatetimeconf['banweekdays'].'], //lock specific weekdays
                            step: '.$allg[0]['terminspanne'].', // min
                            todayButton: true,
                            yearStart: "'.date("Y").'",
                            yearEnd: "'.date('Y', strtotime('+1 year')).'",
                            dayOfWeekStart: 1,
                            onChangeDateTime: logik,
                            onShow: logik,
                            onSelectTime(dp,$input){ //still under construction
                                if($.inArray($input.val(), reserviert)){
                                    alert("reserved!");
                                }
                            },
                            minDate: "0",
                            maxDate: "'.date("Y/m/d", maxDate($freigabe)).'",
                            minTime: "'.date("H:i", strtotime($allg[0]['minOeffnungszeit'])).'",
                            maxTime: "'.date("H:i", strtotime($allg[0]['maxOeffnungszeit'])).'",

    });</script>';</php>

到目前为止，ini，我仍在问自己是否有更好的解决方案来管理日期时间选择器中的空闲/锁定时间，因为我有太多需要修复的错误。有人有更好的主意吗？

Answer 1

不是

最灵活的解决方案，但仍然是解决在 JQuery 中锁定特定日期的时间问题的好方法

<script>
var specificDates = []; 
var hoursToTakeAway = [];
var i=0; var old=0; var from; var collect=[]; var changed = false; var bag=[];
                    $.each( reserviert, function(key, value){
                        specificDates.push(moment(key).format("DD/MM/YYYY")); 
                        $.each( value, function( keyn, valuen ){
                            if(i !== old){
                                old=i;
                                changed = true;
                            }
                            if(i == old){
                                if(keyn.indexOf("from") >= 0){
                                    from = valuen;
                                } else{
                                    bag = addBetween(parseInt(from), parseInt(valuen));
                                    if(changed == false){
                                        collect = bag.concat(collect);  
                                    } else collect = bag;
                                }
                            }
                        });
                        hoursToTakeAway.push(collect);
                        i++;        
                    });
                    function addBetween(p1, p2){
                        var hoursToAdd=[];
                        for(var i=p1; i<=p2; i++){
                            hoursToAdd.push(i);
                        }
                        return hoursToAdd;
                    }
</script>

该代码位于 var reserviert 和 window.onerror 之间，并遍历对象 reserviert，该对象将日期作为键，时间作为值。它被保存在数组中 特定的日期和时间到外卖.我锁定了从数组中得到的时间

<?php 
    echo '$("#datetimepicker3").datetimepicker({
                                        onGenerate:function(ct,$i){
                                            var ind = specificDates.indexOf(moment(ct).format("DD/MM/YYYY"));
                                            $(".xdsoft_time_variant .xdsoft_time").show();
                                            if(ind !== -1){
                                                $(".xdsoft_time_variant .xdsoft_time").each(function(index){
                                                    if(hoursToTakeAway[ind].indexOf($(this).text()) !== -1) {
                                                        $(this).hide();
                                                    }
                                                });
                                            }
                                            '.$blocked.'
                                        },
                                        inline:true,
                                        value: new Date(), //(alloweDateRe)(regexdates)
                                        allowTimes:['.$weekdatetimeconf['onlyT'].$timeFlex.'], 
                                        allowDates: ['.$weekdatetimeconf['onlyD'].$dateFlex.'], 
                                        disabledDates: ['.$weekdatetimeconf['banD'].'], 
                                        disabledWeekDays:['.$weekdatetimeconf['banweekdays'].'], 
                                        step: '.$allg[0]['terminspanne'].', // min
                                        todayButton: true,
                                        yearStart: "'.date("Y").'",
                                        yearEnd: "'.date('Y', strtotime('+1 year')).'",
                                        dayOfWeekStart: 1,
                                        onChangeDateTime: logik,
                                        onShow: logik,
                                        minDate: "0",
                                        maxDate: "'.date("Y/m/d", maxDate($freigabe)).'",
                                        minTime: "'.date("H:i", strtotime($allg[0]['minOeffnungszeit'])).'",
                                        maxTime: "'.date("H:i", strtotime($allg[0]['maxOeffnungszeit'])).'"
                                    });'; 
?>