时间控件添加

src/main/webapp/WEB-INF/ehr/jsp/server/sEnvManage.jsp

@@ -2,7 +2,7 @@
<%@include file="/WEB-INF/ehr/commons/jsp/commonInclude.jsp" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<style>
    .c-item{float:left;height: 30px;line-height: 30px;width: 60px;background: #fff;color:#000;text-align: center;font-size: 12px;border:1px solid #dcdcdc;}
    .c-item{float:left;height: 30px;line-height: 30px;width: 150px;background: #fff;color:#000;text-align: center;font-size: 12px;border:1px solid #dcdcdc;}
    .c-bor-r{border-right: 0;}
    .c-item.active{background: #16B3EE;color:#fff}
</style>
@@ -19,14 +19,21 @@
        <!-- ####### 查询条件部分 ####### -->
        <div class="m-form-inline" data-role-form>
            <div class="m-form-group">
                <label style="width: 100px;">开始时间：</label>
                <div class="m-form-control">
                    <!--输入框-->
                    <input type="text" id="inp_search" placeholder="请输入服务器时间" data-attr-scan="searchNm"/>
                    <input id="repeatStartTime" type="text" />
                </div>
                <label style="width: 100px;">结束时间：</label>
                <div class="m-form-control">
                    <input id="repeatEndTime" type="text" />
                </div>
                <div class="m-form-control">
                    <!--按钮:查询 & 新增-->
                    <div id="btnSearch" class="l-button">
                        <span>搜索</span>
                    </div>
                </div>
            </div>
        <%-- 选显卡部分--%>
@@ -38,6 +45,9 @@
        </div>
            <%-- echarts 数据--%>
        <div id="main" style="width: 600px;height:400px;border: solid deepskyblue 1px;"></div>
            <div id="info" style="width: 600px;height:400px;border: solid deepskyblue 1px;">
            </div>
    </div>
</div>

src/main/webapp/WEB-INF/ehr/jsp/server/sEnvManageJs.jsp

@@ -4,17 +4,58 @@
<script>
    $(function () {
        //初始化
        //l-layout-left
        //初始化layout
        $("#div_wrapper").ligerLayout({
            height: "99%",
            leftWidth: 200,
            isLeftCollapse: false,//左边区域初始化不可以隐藏
            allowLeftCollapse: false//左边区域不可以隐藏
        });
        /*初始化时间控件-start*/
        $("#repeatStartTime").ligerDateEditor({
            width: 240,
            showTime: true
        });
        $("#repeatEndTime").ligerDateEditor({
            width: 240,
            showTime: true
        });
        $("#repeatStartTime").ligerDateEditor("setValue",prevDate());
        $("#repeatEndTime").ligerDateEditor("setValue",nowDate());
        /*初始化时间控件-end*/
        //初始化图表
        var type = $(".div-menu .active").attr("data-item");
        var beginTime,endTime;
        var beginTime = $("#repeatStartTime").ligerDateEditor("getValue");
        var endTime = $("#repeatEndTime").ligerDateEditor("getValue");
        getServerInfo(type,beginTime,endTime);
        //搜索按钮事件
        $(".m-form-control").on("click","#btnSearch",function(){
            var beginTime = $("#repeatStartTime").ligerDateEditor("getValue");
            var endTime = $("#repeatEndTime").ligerDateEditor("getValue");
            if(beginTime=="" && $endTime=="")
            {
                $.ligerDialog.error("请选择起始结束时间！");
                return false;
            }
            var type = $(".div-menu .active").attr("data-item");
            //获取服务器监控数据
            getServerInfo(type,beginTime,endTime);
        })
        //选项卡切换时间
        $(".div-menu").on("click",".c-item",function(){
            $(".div-menu .c-item").removeClass("active");
            $(this).addClass("active");
            var type = $(this).attr("data-item");
            //获取服务器监控数据
            var beginTime,endTime;
            var beginTime = $("#repeatStartTime").ligerDateEditor("getValue");
            var endTime = $("#repeatEndTime").ligerDateEditor("getValue");
            getServerInfo(type,beginTime,endTime);
        })
@@ -25,7 +66,7 @@
            type: "GET",
            url : "${contextRoot}/server/environment/usage",
            dataType : "json",
            data:{type:type,beginTime:"2015-10-22 00:00:00",endTime:"2016-11-31 00:00:00"},
            data:{type:type,beginTime:beginTime,endTime:endTime},
            cache:false,
            success :function(re){
                if(re.successFlg) {
@@ -86,8 +127,7 @@
                     left: 'center'
                 },
                 tooltip: {
                     trigger: 'item',
                     formatter: '{b} <br/>{a} : {c}'
                     trigger: 'axis'
                 },
                 legend: {
                     left: 'left',
@@ -113,16 +153,23 @@
                     {
                         name: '总使用率',
                         type: 'line',
//                         itemStyle: {normal: {areaStyle: {type: 'default'}}},
                         data: y1
                     },
                     {
                         name: '用户使用率',
                         type: 'line',
//                         itemStyle: {normal: {areaStyle: {type: 'default'}}},
                         data: y2
                     }
                 ]
             };
             myChart.setOption(option);
             //设置图例下方的信息
         }
         else{
             me.clearTop();
@@ -154,8 +201,7 @@
                        left: 'center'
                    },
                    tooltip: {
                        trigger: 'item',
                        formatter: '{b} <br/>{a} : {c}'
                        trigger: 'axis'
                    },
                    legend: {
                        left: 'left',
@@ -225,8 +271,7 @@
                        left: 'center'
                    },
                    tooltip: {
                        trigger: 'item',
                        formatter: '{b} <br/>{a} : {c}'
                        trigger: 'axis'
                    },
                    legend: {
                        left: 'left',
@@ -291,8 +336,7 @@
                        left: 'center'
                    },
                    tooltip: {
                        trigger: 'item',
                        formatter: '{b} <br/>{a} : {c}'
                        trigger: 'axis'
                    },
                    legend: {
                        left: 'left',
@@ -336,5 +380,25 @@
    }
    /*当前时间*/
    function nowDate(){
        var date = new Date();
        var year = date.getFullYear();
        var month = date.getMonth() + 1;
        var day = date.getDate();
        var hour = date.getHours();
        var minute = date.getMinutes();
        var second = date.getSeconds();
        return year + '-' + month + '-' + day  + ' ' + hour + ':' + minute + ':' + second;
    }
    /*前一天时间*/
    function prevDate(){
        var now = new Date();
        var date = new Date(now.getTime() -  24 * 3600 * 1000);
        var year = date.getFullYear();
        var month = date.getMonth() + 1;
        var day = date.getDate();
        return year + '-' + month + '-' + day  + ' 00:00:00';
    }
</script>