javascript - 从时间表中删除休息时间

标签 javascript php laravel

我有以下代码。

function hmsToSeconds(hms)
    {
        var times = hms.split(':');
        var hrs = parseInt(times[0]);
        var mins = parseInt(times[1]);
        var secs = parseInt(times[2]);

        return (hrs*3600)+(mins*60)+secs;
    }

    function totalSecondsWorked(start, finish, breaks)
    {
        return hmsToSeconds(finish) - hmsToSeconds(start) - hmsToSeconds(breaks);
    }

    function nearestFullHour(seconds)
    {
        return Math.floor(seconds/3600);
    }

    function checkTime(value)
    {
        var patt = /([0-9][0-9]):([0-5][0-9]):([0-5][0-9])/;

        if (patt.test(value))
        {
            return value;
        }

        return '00:00:00';
    }

    function calculateDay(day)
    {
        var start = checkTime($("input[name='"+day+"[startTime]']").val());
        var finish = checkTime($("input[name='"+day+"[endTime]']").val());
        var breaks = checkTime($("input[name='"+day+"[breaks]']").val());

        var seconds = totalSecondsWorked(start, finish, breaks);
        var hours = nearestFullHour(seconds);

        $("input[name='"+day+"[total]']").val(hours > 0 ? hours : 0);
        document.getElementById('totalPayableHoursTotal').innerHTML = hours > 0 ? hours : 0;
    }

    $(function(){

        $.each([ 'monday', 'tuesday', 'wednesday', 'thursday', 'friday' , 'saturday', 'sunday' ], function( index, day ) {
            calculateDay(day);
        });

        $(document).on('keyup', 'input.calculate', function(e){
            calculateDay($(this).data('day'));
        });

    });

这确实有效,但不,我需要减去中断并认为 Math.floor() 方法是问题的原因,但一是我不太擅长数学,二是刚刚进入 javascript,所以寻找寻求一些帮助。

例如,我输入 09:00:00 作为开始时间,然后输入 15:00:00 作为结束时间,这将是 6 小时,但如果我输入 00:30:00 应该返回 5.5 小时,所以我需要让它像示例一样工作。

我还需要每天合计每周总计,如何做到这一点?

最佳答案

尝试一下(我对您的 JS 代码进行了一些更改,因此您可能希望比较以查看所有内容):

<!DOCTYPE html>
<html>
    <head>
        <script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
        <script>
        function hmsToSeconds(hms) {
            var times = hms.split(':');
            var hrs = parseInt(times[0]);
            var mins = parseInt(times[1]);
            var secs = parseInt(times[2]);
            return (hrs*3600)+(mins*60)+secs;
        }
        function totalSecondsWorked(day) {
            var start = checkTime($("input[name='"+day+"[startTime]']").val());
            var finish = checkTime($("input[name='"+day+"[endTime]']").val());
            var breaks = checkTime($("input[name='"+day+"[breaks]']").val());

            return hmsToSeconds(finish) - hmsToSeconds(start) - hmsToSeconds(breaks);
        }
        function nearestFullHour(seconds) {
            return Math.floor(seconds/3600);
            return seconds;
        }
        function secondsToHms(seconds_param) {
            var raw_hours = seconds_param / 3600;
            var hours = parseInt(raw_hours);
            var raw_minutes = (raw_hours - hours) * 60;
            var minutes = parseInt(raw_minutes);
            var seconds = (Math.round((raw_minutes - minutes) * 100) / 100) * 60;

            if (seconds > 59) {
                do {
                    ++minutes;
                    seconds -= 60;
                } while (seconds > 59);
            }

            var hours_str = hours < 10 ? '0' + hours.toString() : hours.toString();
            var minutes_str = minutes < 10 ? '0' + minutes.toString() : minutes.toString();
            var seconds_str = seconds < 10 ? '0' + seconds.toString() : seconds.toString();
            return hours_str + ':' + minutes_str + ':' + seconds_str;
        }
        function checkTime(value) {
            var patt = /([0-9][0-9]):([0-5][0-9]):([0-5][0-9])/;
            if (patt.test(value)) {
                return value;
            }
            return '00:00:00';
        }
        $(document).ready(function() {
            var total_seconds = 0;
            $.each([ 'monday', 'tuesday', 'wednesday', 'thursday', 'friday' , 'saturday', 'sunday' ], function( index, day ) {
                var seconds = totalSecondsWorked(day);
                total_seconds += seconds;
                $("input[name='"+day+"[total]']").val(seconds > 0 ? secondsToHms(seconds) : 0);
            });
            document.getElementById('totalPayableHoursTotal').innerHTML = total_seconds > 0 ? secondsToHms(total_seconds) : 0;
            $('#calculate').click(function () {
                var total_seconds = 0;
                $.each([ 'monday', 'tuesday', 'wednesday', 'thursday', 'friday' , 'saturday', 'sunday' ], function( index, day ) {
                    var seconds = totalSecondsWorked(day);
                    total_seconds += seconds;
                    $("input[name='"+day+"[total]']").val(seconds > 0 ? secondsToHms(seconds) : 0);
                });
                document.getElementById('totalPayableHoursTotal').innerHTML = total_seconds > 0 ? secondsToHms(total_seconds) : 0;
            });
        });
        </script>
    </head>
    <body>
        <h5>Monday</h5>
        Start: <input name="monday[startTime]" type="text" value="09:00:00" />
        End: <input name="monday[endTime]" type="text" value="15:00:00" />
        Breaks: <input name="monday[breaks]" type="text" value="00:30:00" />
        Total: <input name="monday[total]" type="text" value="" />
        <h5>Tuesday</h5>
        Start: <input name="tuesday[startTime]" type="text" value="09:00:00" />
        End: <input name="tuesday[endTime]" type="text" value="15:00:00" />
        Breaks: <input name="tuesday[breaks]" type="text" value="00:30:00" />
        Total: <input name="tuesday[total]" type="text" value="" />
        <h5>Wednesday</h5>
        Start: <input name="wednesday[startTime]" type="text" value="09:00:00" />
        End: <input name="wednesday[endTime]" type="text" value="15:00:00" />
        Breaks: <input name="wednesday[breaks]" type="text" value="00:30:00" />
        Total: <input name="wednesday[total]" type="text" value="" />
        <h5>Thursday</h5>
        Start: <input name="thursday[startTime]" type="text" value="09:00:00" />
        End: <input name="thursday[endTime]" type="text" value="15:00:00" />
        Breaks: <input name="thursday[breaks]" type="text" value="00:30:00" />
        Total: <input name="thursday[total]" type="text" value="" />
        <h5>Friday</h5>
        Start: <input name="friday[startTime]" type="text" value="09:00:00" />
        End: <input name="friday[endTime]" type="text" value="15:00:00" />
        Breaks: <input name="friday[breaks]" type="text" value="00:30:00" />
        Total: <input name="friday[total]" type="text" value="" />
        <h5>Saturday</h5>
        Start: <input name="saturday[startTime]" type="text" value="09:00:00" />
        End: <input name="saturday[endTime]" type="text" value="15:00:00" />
        Breaks: <input name="saturday[breaks]" type="text" value="00:30:00" />
        Total: <input name="saturday[total]" type="text" value="" />
        <h5>Sunday</h5>
        Start: <input name="sunday[startTime]" type="text" value="09:00:00" />
        End: <input name="sunday[endTime]" type="text" value="15:00:00" />
        Breaks: <input name="sunday[breaks]" type="text" value="00:30:00" />
        Total: <input name="sunday[total]" type="text" value="" />
        <br />
        <input id="calculate" type="button" value="Calculate" />
        <div id="totalPayableHoursTotal"></div>
    </body>
</html>

您也可以在 jsfiddle 上测试它.

确保在投入生产之前进行彻底的测试,虽然我做了测试,但我并不是真正的 QA 人员.. ^)

关于javascript - 从时间表中删除休息时间,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32007267/

相关文章:

php - 在 Laravel 5.1 中将查询生成器条件设置为模型

javascript - 如何停止函数处理直到ajax调用完成?

javascript - 实时流程图上的标签?

JavaScript onclick : only works once

php - 获取引荐来源网址 - 来自 Paypal (HTTPS) 的访客

php - 在 PHP/MySQL 中隐藏过去的事情

php - 数据库中的 Laravel 订单项

javascript - Ubuntu 12.04 缺少 Gulpfile

php - 反射特性过滤器

php - 连接 POS 到电子商务 RESTFUL API