<!DOCTYPE html>
<html dir="auto" th:lang="${lang}" th:with="lang=${#locale.language}" xmlns:th="http://www.w3.org/1999/xhtml">

<head>
    <meta charset="utf-8">
    <meta content="IE=edge" http-equiv="X-UA-Compatible">
    <meta content="width=device-width, initial-scale=1" name="viewport">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="Alovoa" name="apple-mobile-web-app-title">
    <meta content="#121212" media="(prefers-color-scheme: dark)" name="theme-color">
    <link href="/manifest/manifest.json" rel="manifest">

    <link href="/css/lib/bulma.min.css" rel="stylesheet"/>
    <link href="/css/lib/animate.min.css" rel="stylesheet"/>
    <link href="/css/alovoa.css" rel="stylesheet"/>
    <link href="/css/privacy.css" rel="stylesheet"/>
    <title th:text="#{admin.title}"></title>
</head>

<body>
<div id="main">
    <header th:insert="~{fragments.html::header}"></header>
    <div style="padding-top: 4px;"></div>
    <div class="box" id="report" style="max-height: 693px; overflow: auto;">
        <h3 th:text="#{reports}"></h3>
        <div style="padding-bottom: 16px;" th:class="'user' + ${report.userTo.id}" th:each="report : ${reports}"
             th:id="'report' + ${report.id}">
            <h4 th:text="${report.userTo.firstName}"></h4>
            <textarea class="textarea" readonly th:text="${report.userTo.description}"></textarea>
            <div style="padding-top: 4px;"></div>
            <textarea class="textarea" readonly th:text="${report.comment}"></textarea>
            <div style="padding-top: 4px;"></div>
            <button class="button" th:onclick="viewProfile([[${report.toUuid}]])"><i
                    class="fa fa-user"></i></button>
            <button class="button" th:onclick="viewProfileMedia([[${report.toUuid}]])"><i
                    class="fa fa-photo-video"></i></button>
            <button class="button" th:onclick="deleteReport([[${report.id}]], [[${report.userTo.id}]])"
                    th:text="#{admin.delete-report}"></button>
            <button class="button" th:onclick="removeDescription([[${report.toUuid}]])"
                    th:text="#{admin.remove-description}"></button>
            <button class="button" th:onclick="removeImages([[${report.toUuid}]])"
                    th:text="#{admin.remove-images}"></button>
            <button class="button" th:onclick="banUser([[${report.toUuid}]], [[${report.userTo.id}]])"
                    th:text="#{admin.ban-user}"></button>
        </div>
    </div>

    <div class="box" id="mail-single">
        <h3 th:text="#{admin.mail.send-single}"></h3>
        <form id="mail-single-form" method="POST" th:action="@{/admin/mail/single}">
            <input class="input" name="email" required th:placeholder="#{email}">
            <div style="padding-top: 4px;"></div>
            <input class="input" name="subject" required th:placeholder="#{subject}">
            <div style="padding-top: 4px;"></div>
            <textarea class="textarea" name="body" required th:placeholder="#{message}"></textarea>
            <div style="padding-top: 4px;"></div>
            <button class="button" th:text="#{submit}"></button>
        </form>
    </div>

    <div class="box" id="mail-all">
        <h3 th:text="#{admin.mail.send-all}"></h3>
        <form id="mail-all-form" method="POST" th:action="@{/admin/mail/all}">
            <input class="input" name="subject" required th:placeholder="#{subject}">
            <div style="padding-top: 4px;"></div>
            <textarea class="textarea" name="body" required th:placeholder="#{message}"></textarea>
            <div style="padding-top: 4px;"></div>
            <button class="button" th:text="#{submit}"></button>
        </form>
    </div>

    <div class="box" id="delete-account">
        <h3 th:text="#{admin.account.delete}"></h3>
        <form id="delete-account-form" method="POST" th:action="@{/admin/delete-account}">
            <input class="input" name="email" required th:placeholder="#{email}">
            <div style="padding-top: 4px;"></div>
            <button class="button" th:text="#{submit}"></button>
        </form>
    </div>

    <div class="box" id="user-exists">
        <h3>Check user exists</h3>
        <form id="user-exists-form" method="POST" th:action="@{/admin/user-exists/}">
            <input class="input" id="user-exists-email" name="email" required th:placeholder="#{email}">
            <div style="padding-top: 4px;"></div>
            <button class="button" th:text="#{submit}"></button>
        </form>
    </div>

    <div class="box" id="donation-add">
        <h3>Add donation</h3>
        <form id="donation-add-form" method="POST" th:action="@{/admin/donation/add/}">
            <input class="input" id="donation-add-email" name="email" required th:placeholder="#{email}">
            <input class="input" id="donation-add-amount" name="amount" required step=".01" th:placeholder="Amount"
                   type="number">
            <div style="padding-top: 4px;"></div>
            <button class="button" th:text="#{submit}"></button>
        </form>
    </div>

    <div class="box" id="links">
        <a href="/admin-search">Search</a>
        <a href="/admin-verification">Verification</a>
    </div>

    <div style="padding-bottom: 24px;"></div>

</div>

<script src="/sw.js"></script>
<script src="/js/lib/jquery.min.js"></script>
<script src="/js/lib/fontawesome.all.js"></script>
<script src="/js/lib/bulma-toast.min.js"></script>
<script src="/js/tools/get-text.js"></script>
<script src="/js/alovoa.js"></script>
<script src="/js/admin.js"></script>
</body>

</html>