<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <title>监测点范围</title>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport"
          content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <link rel="stylesheet" href="${ctx}/css/plugin/bootstrap/bootstrap.min.css">
    <link rel="stylesheet" href="${ctx}/css/plugin/datatimepicker/bootstrap-datetimepicker.css">
    <link rel="stylesheet" href="${ctx}/css/basic.css">

    <style>
        .row {
            margin-top: 15px;
        }
    </style>
</head>
<div class="container">
    <div class="row">
        <label class="col-sm-12 col-xs-12 control-label" id="title" style="color: red"></label>

    </div>
    <div class="row">
        <label for="startTime" class="col-sm-3 col-xs-3 control-label" style="margin-top: 10px">开始时间</label>
        <div class="col-sm-9 col-xs-9">
            <input readonly type="text" class="form-control" id="startTime" placeholder="请选择开始时间">
        </div>
    </div>
    <div class="row">
        <label for="endTime" class="col-sm-3 col-xs-3 control-label" style="margin-top: 10px">结束时间</label>
        <div class="col-sm-9  col-xs-9">
            <input readonly type="text" class="form-control" id="endTime" placeholder="请选择结束时间">
        </div>
    </div>

    <div class="row">
        <label for="endTime" class="col-sm-3 col-xs-3 control-label" style="margin-top: 10px">波形类型</label>
        <div class="col-sm-9  col-xs-9">
            <select type="text" class="form-control" id="type">
                <option value="1">瞬时波形</option>
                <option value="2">RMS波形</option>
            </select>
        </div>
    </div>


    <div class="row">

        <div class="col-sm-offset-5 col-xs-offset-5 col-sm-7 col-xs-7">
            <button style="margin-top: 100px" type="submit" class="btn btn-primary" id="submit">确认</button>
        </div>

    </div>
</div>
<script src="${ctx}/js/plugin/jquery/jquery.min.js"></script>
<script src="${ctx}/js/plugin/bootstrap/bootstrap.min.js"></script>
<script src="${ctx}/js/plugin/bootstrap/bootstrap-datetimepicker.js"></script>
<script src="${ctx}/js/plugin/bootstrap/bootstrap-datetimepicker.zh-CN.js"></script>
<script src="${ctx}/jspJS/utils/judgeAjaxStatus.js"></script>
<script src="${ctx}/js/plugin/layui/layer.js"></script>
<script src="${ctx}/jspJS/utils/loading.js"></script>
<script src="${ctx}/jspJS/utils/common.js"></script>
<script>

    $("#startTime").datetimepicker({
        format: 'yyyy-mm-dd hh:00:00',
        language: 'zh-CN',
        minView: 1,
        autoclose: 1,
    });
    $("#endTime").datetimepicker({
        format: 'yyyy-mm-dd hh:00:00',
        language: 'zh-CN',
        minView: 1,
        autoclose: 1,
    });
    $(function () {


        $("#title").text("数据量较大,请耐心等待。。。。。")

        $("#submit").click(function () {
            let startTime = $("#startTime").val();
            let endTime = $("#endTime").val();
            let type = $("#type").val();

            if (startTime == null || startTime == '' || endTime == null || endTime == '') {
                layer.msg('请选择时间', {icon: 2, time: 1000});
                return;
            }


            if (new Date(startTime).getTime() > new Date(endTime).getTime()) {
                layer.msg('开始时间不可大于结束时间', {icon: 2, time: 1000});
                return;
            }

            let i;
            $.ajax({
                method : "get",
                url : "/pqs9900/csv/getAllWavedataToCsv",
                data: {
                    startTime:startTime,
                    endTime:endTime,
                    type:type
                },
                beforeSend: function () {
                    i = layer.msg('文件下载中...', {
                        icon : 16,
                        shade : [ 0.5, '#f5f5f5' ],
                        scrollbar : false,
                        area:'200px',
                        time : 600000
                    });
                },
                success : function(data) {
                    if(data.code == 200){
                        window.location.href ='/pqs9900/csv/downloadDataZip'
                        DOWNLOAD_CLOSE_LOAD_LAYER(i)
                    }else {
                        layer.msg(data.body, {icon: 2, time: 1000});
                    }

                },
                error :function (res) {

                }
            })

        })


    })


</script>
</body>
</html>
