Загрузка данных


<!DOCTYPE html>
<%@ taglib prefix="tags" tagdir="/WEB-INF/tags" %>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="s" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

<%@ page session="true" language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>

<html lang="ru">
<jsp:useBean id="currentDate" class="java.util.Date" />
<jsp:include page="head.jsp" />

<body>
    <script type="text/javascript" src="<c:url value='/js/${version}/queryAction.js'/>"></script>
    <script type="text/javascript" src="<c:url value='/js/${version}/queryTable.js'/>"></script>
    <script type="text/javascript">

        $(function () {
					let ppTableDom = document.getElementById("pp");
					let npTableDom = document.getElementById("np");
					let spvTableDom = document.getElementById("spv");
					let evTableDom = document.getElementById("ev");
					npTableDom.style.display = "none";
					spvTableDom.style.display = "none";
					evTableDom.style.display = "none";
					// ПП 
					let ppTable = new QueryTable("rc0HJOkR", {
						initComplete: function (settings, json) {
						},
						onRowSelect: function (data, index) {
						},
						onRowDeselect: function (data, index) {
						},
						drawCallback: function (settings) {
						}
					},
					() => {
						let data = {};
						data.start_date = $("#start_date").val();
						data.end_date = $("#end_date").val();
						data.br_date = $("#br_date").val();
						return data;
					});	
					// НП
					let npTable = new QueryTable("dHYYcT47", {
						initComplete: function (settings, json) {
						},
						onRowSelect: function (data, index) {
						},
						onRowDeselect: function (data, index) {
						},
						drawCallback: function (settings) {
						}
					},
					() => {
						let data = {};
						//data.start_date = $("#start_date").val();
						data.end_date = $("#end_date").val();
						data.br_date = $("#br_date").val();
						return data;
					});	
					// СПВ
					let spvTable = new QueryTable("OHA5PxyG", {
						initComplete: function (settings, json) {
						},
						onRowSelect: function (data, index) {
						},
						onRowDeselect: function (data, index) {
						},
						drawCallback: function (settings) {
						}
					},
					() => {
						let data = {};
						data.date_of_application = $("#end_date").val();
						//data.date_of_application = $("#start_date").val();
						data.br_date = $("#br_date").val();
						return data;
					});
					// ЕВ
					// TODO: подставить реальный код queryTable для ЕВ (второе место — в jsp:param ниже)
					let evTable = new QueryTable("1h8OffNY", {
						initComplete: function (settings, json) {
						},
						onRowSelect: function (data, index) {
						},
						onRowDeselect: function (data, index) {
						},
						drawCallback: function (settings) {
						}
					},
					() => {
						let data = {};
						data.start_date = $("#start_date").val();
						data.end_date = $("#end_date").val();
						data.br_date = $("#br_date").val();
						return data;
					});
					$("#appType").select2({
						placeholder: "Вид",
						allowClear: true,
						minimumInputLength: 0,
						id: function (e) {
							return e.code;
						},
						ajax: {
							url: "queryModel?queryModelCode=HuRqrY62",
							dataType: 'json',
							data: function (term, page) {
							},
							results: function (data, page) {
								return {
									results: data.list
								};
							}
						},
						formatResult: formatTypeResult,
						formatSelection: formatTypeSelection,
					});
					
					function formatTypeResult(data) {
						return '<div>' + data.short_name + '</div>';
					};

					function formatTypeSelection(data) {
						return data.short_name;
					};
					
					$("#formBtn").click(() => {
    let appType = $("#appType").val();

    if (appType == '') {
        showMessage('Не выбран тип заявлений', null, 'WARNING');
        return;
    }

    if (appType == 'PP') {
        startDateBlock.show();

        ppTableDom.style.display = "block";
        npTableDom.style.display = "none";
        spvTableDom.style.display = "none";
        evTableDom.style.display = "none";

        ppTable.reload();

    } else if (appType == 'NP') {
        startDateBlock.hide();

        ppTableDom.style.display = "none";
        npTableDom.style.display = "block";
        spvTableDom.style.display = "none";
        evTableDom.style.display = "none";

        npTable.reload();

    } else if (appType == 'SPV') {
        startDateBlock.hide();

        ppTableDom.style.display = "none";
        npTableDom.style.display = "none";
        spvTableDom.style.display = "block";
        evTableDom.style.display = "none";

        spvTable.reload();

    } else if (appType == 'EV') {
        startDateBlock.show();

        ppTableDom.style.display = "none";
        npTableDom.style.display = "none";
        spvTableDom.style.display = "none";
        evTableDom.style.display = "block";

        evTable.reload();
    }
});
        });
			

    </script>

    <jsp:include page="header.jsp" />
    <jsp:include page="navbar.jsp" />
    <div class="container" id="mainContainer">
        <div class="page-header">
            <h1>Отчет по банковским реквизитам решений и заявлений</h1>
        </div>
        <div class="container-fluid">
            <div class="row row-main">
                <jsp:include page="sidebar.jsp" />
							<div class="col-sm-10">
								<tags:breadcrumbs path="https://portal.futurenpf.ru/knowledgebase/category/30239/"/>
								<div class="row">
									<h4 class="col-sm-12">Отчет по банковским реквизитам решений и заявлений</h4>
									<div class="col-sm-4">
										<div class="form-group">
											<div class="form-group">
												<label for="appType">Вид заявления</label>
												<div class="form-control" id="appType"></div>
											</div>
										</div>
									</div>
									<div class="col-sm-2" id="startDateBlock">
    <div class="form-group">
        <label for="start_date">Начальная дата</label>
        <input type="text" class="form-control date-picker-on"
               id="start_date"
               value="<fmt:formatDate value='${currentDate}' pattern='dd.MM.yyyy' />"
               name="start_date"
               placeholder="Дата"/>
    </div>
</div>
									<div class="col-sm-2">
										<div class="form-group">
											<label for="end_date">Конечная дата</label>
											<input type="text" class="form-control date-picker-on" 
														 id="end_date" value="<fmt:formatDate value='${currentDate}' pattern='dd.MM.yyyy' />"
														 name="end_date" placeholder="Дата"/>
										</div>
									</div>
									<div class="col-sm-2">
										<div class="form-group">
    <label for="br_date">Дата БР</label>
    <input type="text" class="form-control date-picker-on" 
           id="br_date" 
           name="br_date" placeholder="Дата"/>
</div>

									</div>
								</div>	
									<div class="col-sm-3 pull-left">
										<div class="btn-group pull-left">
											<button id="formBtn" name="formBtn" type="button"
															class="btn btn-success" data-loading-text="Отбор...">
												Сформировать
											</button>
										</div>
									</div>
									<div class="col-sm-12" id="pp">
										<form class="form-vertical" id="paramFormPp">
											<jsp:include page="queryTable.jsp">
												<jsp:param name="queryTableCode" value="rc0HJOkR"/>
												<jsp:param name="queryTableStyle" value="white-space:nowrap;"/>
											</jsp:include>
										</form>
									</div>
									<div class="col-sm-12" id="np">
										<form class="form-vertical" id="paramFormNp">
											<jsp:include page="queryTable.jsp">
												<jsp:param name="queryTableCode" value="dHYYcT47"/>
												<jsp:param name="queryTableStyle" value="white-space:nowrap;"/>
											</jsp:include>
										</form>
									</div>
									<div class="col-sm-12" id="spv">
										<form class="form-vertical" id="paramFormSpv">
											<jsp:include page="queryTable.jsp">
												<jsp:param name="queryTableCode" value="OHA5PxyG"/>
												<jsp:param name="queryTableStyle" value="white-space:nowrap;"/>
											</jsp:include>
										</form>
									</div>
									<div class="col-sm-12" id="ev">
										<form class="form-vertical" id="paramFormEv">
											<jsp:include page="queryTable.jsp">
												<jsp:param name="queryTableCode" value="1h8OffNY"/>
												<jsp:param name="queryTableStyle" value="white-space:nowrap;"/>
											</jsp:include>
										</form>
									</div>
							</div>
            </div>
        </div>
    </div>
    <jsp:include page="footer.jsp" />
</body>
</html>