Front-end selection time range associated date quick query

renderings

html part

<div class="select-list">
    <ul>
    	<li>
            <label>时间：</label>
            <select id="timeInterval">
                <option value="1">自定义</option>
                <option value="2">当天</option>
                <option value="3">本周</option>
                <option value="4">本月</option>
                <option value="5">本年</option>
            </select>
        </li>
        <li class="select-time">
            <label>查询日期： </label>
            <input type="text" class="time-input" placeholder="开始日期"
                   name="params[beginTime]"/>
            <span>-</span>
            <input type="text" class="time-input" placeholder="结束日期"
                   name="params[endTime]"/>
        </li>
	</ul>
</div>

js part

<script type="text/javascript">
timeInterval.addEventListener('change', function() {
    
    
        switch (timeInterval.value) {
    
    
            case "1":
                beginDateInput.value = "";
                endDateInput.value = "";
                break;

            case "2":
                beginDateInput.value = formatDate(today);
                endDateInput.value = formatDate(today);
                break;

            case "3":
                var firstDayOfWeek = new Date(today.getFullYear(), today.getMonth(), today.getDate() - dayOfWeek + 1);
                var lastDayOfWeek = new Date(today.getFullYear(), today.getMonth(), today.getDate() - dayOfWeek + 7);
                beginDateInput.value = formatDate(firstDayOfWeek);
                endDateInput.value = formatDate(lastDayOfWeek);
                break;

            case "4":
                var firstDayOfMonth = new Date(today.getFullYear(), today.getMonth(), 1);
                var lastDayOfMonth = new Date(today.getFullYear(), today.getMonth() + 1, 0);
                beginDateInput.value = formatDate(firstDayOfMonth);
                endDateInput.value = formatDate(lastDayOfMonth);
                break;

            case "5":
                var firstDayOfYear = new Date(today.getFullYear(), 0, 1);
                var lastDayOfYear = new Date(today.getFullYear(), 11, 31);
                beginDateInput.value = formatDate(firstDayOfYear);
                endDateInput.value = formatDate(lastDayOfYear);
                break;
        }
    });

    function formatDate(date) {
    
    
        var year = date.getFullYear();
        var month = ("0" + (date.getMonth() + 1)).slice(-2);
        var day = ("0" + date.getDate()).slice(-2);
        return year + "-" + month + "-" + day;
    }
</script>