2023-10-31 14:44:15 +01:00

245 lines
11 KiB
HTML

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="https://www.thymeleaf.org">
<head th:replace="~{fragments/resources::head}">
</head>
<body>
<!-- Modal -->
<div class="modal modal-lg fade" id="csvQueryExportModal" tabindex="-1" aria-labelledby="csvQueryExportModalLabel" aria-hidden="true"
th:if="${results != null}">
<form th:action="|/${dbadmin_baseUrl}/console/export/${activeQuery.getId()}|" method="GET">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="csvQueryExportModalLabel">Export settings</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="container-fluid">
<p class="text-muted">The export file will contain all the pages in the results. If the table is big,
this might take some time.</p>
<h5 class="fw-bold">Include columns</h5>
<div th:each="field : ${results.getSortedFields()}" th:if="${field.isExportable()}">
<div class="form-check">
<input class="form-check-input" type="checkbox"
th:value="${field.getName()}" th:id="|__check_${field.getName()}|"
th:name="fields[]"
checked>
<label class="form-check-label" th:for="|__check_${field.getName()}|">
[[ ${field.getName()} ]]
</label>
</div>
</div>
<h5 class="fw-bold mt-3">Export format</h3>
<select name="format" class="form-select">
<option th:each="format : ${T(tech.ailef.snapadmin.external.dto.DataExportFormat).values()}"
th:value="${format}" th:text="${format}">
</option>
</select>
<div class="form-check mt-3">
<input class="form-check-input" type="checkbox" checked="checked"
disabled
id="__check_raw"
th:name="raw">
<label class="form-check-label" for="__check_raw">
Export raw values
</label>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
<button type="submit" class="btn btn-primary">Export [[ ${pagination.getMaxElement()} ]] rows</button>
</div>
</div>
</div>
</form>
</div>
<!-- End modal -->
<div class="bg-light main-wrapper">
<nav th:replace="~{fragments/resources :: navbar}"></nav>
<div class="d-flex">
<div th:replace="~{fragments/resources :: sidebar('console')}"></div>
<div class="main-content bg-lighter">
<h1 class="fw-bold mb-4"><i class="align-middle bi bi-terminal"></i><span class="align-middle"> SQL console</span></h1>
<div class="row mt-4">
<div class="col">
<div class="w-100 d-flex inner-navigation">
<a th:each="query : ${tabs}" th:href="|/${dbadmin_baseUrl}/console/run/${query.getId()}|"
class="d-inline-block query-tab"
th:classAppend="${query.getId() == activeQuery.getId() ? 'active' : ''}">
<div class="ui-tab ps-5 pe-5 p-3">
<i class="bi bi-filetype-sql pe-2"></i>
<span th:text="${query.getTitle()}"></span>
</div>
</a>
<div class="inner-navigation-border flex-grow-1 align-items-center d-flex">
<h3 class="ms-3 mt-0 mb-0">
<a th:href="|/${dbadmin_baseUrl}/console/new|">
<i class="bi bi-plus-square-fill align-middle"></i>
</a>
</h3>
</div>
</div>
<div class="box with-navigation">
<form th:action="|/${dbadmin_baseUrl}/console/run/${activeQuery.getId()}|" method="GET">
<span class="text-muted fw-bold mb-1 d-inline-block">Query title</span>
<input type="text" class="form-control mb-3"
name="queryTitle" th:value="${activeQuery.getTitle()}">
<span class="text-muted fw-bold mb-1 d-inline-block">SQL</span>
<textarea class="form-control font-monospace" rows="6" name="query"
th:text="${activeQuery.getSql()}"></textarea>
<input class="ui-btn btn btn-primary mt-3" type="submit" value="Run">
<a href="#" class="ms-4 ui-btn btn btn-danger mt-3" id="console-delete-btn">Delete</a>
</form>
<div class="d-flex justify-content-end">
<form th:action="|/${dbadmin_baseUrl}/console/delete/${activeQuery.getId()}|" method="POST"
id="console-delete-form">
</form>
</div>
<div th:if="${error == null && activeQuery.getSql() != null}">
<div class="separator mt-3 mb-3"></div>
<!-- Pagination -->
<nav aria-label="Results pagination">
<div class="d-flex justify-content-between">
<div th:if="${pagination != null && pagination.getMaxPage() != 1}" class="d-flex">
<ul class="pagination me-3">
<li class="page-item" th:if="${pagination.getCurrentPage() != 1}">
<a class="page-link"
th:href="@{|${dbadmin_requestUrl}${pagination.getLink(pagination.getCurrentPage() - 1)}|}"
aria-label="Previous">
<span aria-hidden="true">&laquo;</span>
<span class="sr-only">Previous</span>
</a>
</li>
<li class="page-item" th:each="p : ${pagination.getBeforePages()}">
<a class="page-link"
th:href="@{|${dbadmin_requestUrl}${pagination.getLink(p)}|}" th:text="${p}"></a>
</li>
<li class="page-item active">
<a class="page-link" href="#" th:text="${pagination.getCurrentPage()}"></a>
</li>
<li class="page-item" th:each="p : ${pagination.getAfterPages()}">
<a class="page-link"
th:href="@{|${dbadmin_requestUrl}${pagination.getLink(p)}|}"
th:text="${p}"></a>
</li>
<li class="page-item">
<a class="page-link"
th:if="${!pagination.isLastPage()}"
th:href="@{|${dbadmin_requestUrl}${pagination.getLink(pagination.getCurrentPage() + 1)}|}"
aria-label="Next">
<span class="sr-only">Next</span>
<span aria-hidden="true">&raquo;</span>
</a>
</li>
</ul>
<div class="d-flex align-items-center" th:if="${pagination.getMaxPage() > 1}">
<p class="m-0 p-0">
<i>Showing [[ ${results.size()} ]] of [[ ${pagination.getMaxElement()} ]]
results in [[ ${elapsedTime} ]] seconds</i>
</p>
<button th:if="${results != null}" title="Open export data window" type="button"
class="btn pb-0 pt-0" data-bs-toggle="modal" data-bs-target="#csvQueryExportModal">
<i class="bi bi-file-earmark-spreadsheet export-icon" style="font-size: 1.6rem;"></i>
</button>
</div>
</div>
<div class="d-flex align-items-center" th:if="${pagination.getMaxPage() == 1}">
<p class="m-0 p-0">
<i>Showing [[ ${results.size()} ]] of [[ ${pagination.getMaxElement()} ]]
results in [[ ${elapsedTime} ]] seconds</i>
</p>
<button th:if="${results != null}" title="Open export data window" type="button"
class="btn pb-0 pt-0" data-bs-toggle="modal" data-bs-target="#csvQueryExportModal">
<i class="bi bi-file-earmark-spreadsheet export-icon" style="font-size: 1.6rem;"></i>
</button>
</div>
</div>
</nav>
<div th:replace="~{fragments/generic_table :: table(results=${results})}"></div>
<!-- Pagination -->
<nav aria-label="Results pagination">
<div class="d-flex justify-content-between">
<div th:if="${pagination != null && pagination.getMaxPage() != 1}" class="d-flex">
<ul class="pagination me-3">
<li class="page-item" th:if="${pagination.getCurrentPage() != 1}">
<a class="page-link"
th:href="@{|${dbadmin_requestUrl}${pagination.getLink(pagination.getCurrentPage() - 1)}|}"
aria-label="Previous">
<span aria-hidden="true">&laquo;</span>
<span class="sr-only">Previous</span>
</a>
</li>
<li class="page-item" th:each="p : ${pagination.getBeforePages()}">
<a class="page-link"
th:href="@{|${dbadmin_requestUrl}${pagination.getLink(p)}|}" th:text="${p}"></a>
</li>
<li class="page-item active">
<a class="page-link" href="#" th:text="${pagination.getCurrentPage()}"></a>
</li>
<li class="page-item" th:each="p : ${pagination.getAfterPages()}">
<a class="page-link"
th:href="@{|${dbadmin_requestUrl}${pagination.getLink(p)}|}"
th:text="${p}"></a>
</li>
<li class="page-item">
<a class="page-link"
th:if="${!pagination.isLastPage()}"
th:href="@{|${dbadmin_requestUrl}${pagination.getLink(pagination.getCurrentPage() + 1)}|}"
aria-label="Next">
<span class="sr-only">Next</span>
<span aria-hidden="true">&raquo;</span>
</a>
</li>
</ul>
<div class="d-flex align-items-center" th:if="${pagination.getMaxPage() > 1}">
<p class="m-0 p-0">
<i>Showing [[ ${results.size()} ]] of [[ ${pagination.getMaxElement()} ]]
results in [[ ${elapsedTime} ]] seconds</i>
</p>
</div>
</div>
<div class="d-flex align-items-center" th:if="${pagination.getMaxPage() == 1}">
<p class="m-0 p-0">
<i>Showing [[ ${results.size()} ]] of [[ ${pagination.getMaxElement()} ]]
results in [[ ${elapsedTime} ]] seconds</i>
</p>
</div>
</div>
</nav>
</div>
<div th:if="${error != null}">
<div class="separator mt-3 mb-3"></div>
<th:block th:replace="~{fragments/resources :: alerts}"></th:block>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript" th:src="|/${dbadmin_baseUrl}/js/console.js|"></script>
</body>
</html>