项目中日期类型的处理

项目中日期类型的处理

1. H5新增的日期输入框

//我们普通的日期类型。yyyy-MM-dd
<input type="date" value="2015-09-24"/>
//时间类型
<input type="time" value="13:59"/>
<input type="time" value="13:59:59"/>
//我们最常用的，精确的时间
<input type="datetime-local" value="2015-09-24T13:59:59"/>
//月份
<input type="month" value="2015-09"/>
//周
<input type="week" value="2015-W02"/>

1.1 前端 ==》后端 传值

我们发现每次获得datetime-local的值，传到后台，总是会接收不到，我们只能把datetime-local的值进行一个处理，转换成我们标准的 ”yyyy-MM-dd mm:hh:ss“的格式，转换代码如下：

function datetimeFormat(stringTypeDate){
    var datetimeType = "";
    var date = new Date(stringTypeDate);
    datetimeType = date.getFullYear()+"-"+getMonth(date)+"-"+getDay(date)+" "+
        getHours(date)+":"+getMinutes(date)+":"+getSeconds(date);//yyyy-MM-dd 00:00:00格式日期
    return datetimeType;
}
//返回 01-12 的月份值
function getMonth(date){
    var month = "";
    month = date.getMonth() + 1; //getMonth()得到的月份是0-11
    if(month<10){
        month = "0" + month;
    }
    return month;
}
//返回01-30的日期
function getDay(date){
    var day = "";
    day = date.getDate();
    if(day<10){
        day = "0" + day;
    }
    return day;
}
//返回小时
function getHours(date){
    var hours = "";
    hours = date.getHours();
    if(hours<10){
        hours = "0" + hours;
    }
    return hours;
}
//返回分
function getMinutes(date){
    var minute = "";
    minute = date.getMinutes();
    if(minute<10){
        minute = "0" + minute;
    }
    return minute;
}
//返回秒
function getSeconds(date){
    var second = "";
    second = date.getSeconds();
    if(second<10){
        second = "0" + second;
    }
    return second;
}

转换成字符串之后，可以通过后台的String类型接收，但是我们想在后台直接映射成Date对象，我们就需要在实体类上面加上一些注解（就可以自动映射成对应的Date对象了）：

@DateTimeFormat(pattern = "yyyy-MM-dd yyyy-MM-dd hh:mm:ss")
@JsonFormat(pattern = "yyyy-MM-dd hh:mm:ss", timezone = "GMT+8")
private Date endTime;

1.2 后端 ==》 前端 传值

异步的方式获得数据，我们可以使用JsonFormat注解实现，但是我们如果使用Thymeleaf 模板引擎就会失效了，前端显示的是日期的标准格式。这时候就是用到了Thymeleaf的工具类了；

具体代码如下：

<span th:text="${#dates.format(emp.getStartTime(),'yyyy-MM-dd hh:mm:ss')}"/>

#dates.format （ 日期对象， 格式化字符串）；

另外附上我们关闭当前页面的代码：

setTimeout(function() {
    window.opener = null;
    window.open('','_self');
    window.close();
}, 2000);