{% extends "base.html" %}
{% block body %}

<div style="margin-top:5px" class="card border-0 shadow" id="searches">
    <div class="card-header bg-header border border-dark shadow text-white">
        <span style="display:inline-block">
            <h2 style="display:inline-block"><span class="operator">Browse</span> Mythic's logs...</h2>
        </span>
    </div>
    <div style="overflow-y:scroll;height:calc(79vh);padding:0" class="card-body bg-card-body border border-dark shadow">
        <table v-if="entries.length > 0" width="100%" class="table table-condensed table-striped {{config['table-color']}}" >
            <tr>
                <th onclick="sort_table(this)" style="width:15rem">Time</th>
                <th onclick="sort_table(this)" >Host</th>
                <th onclick="sort_table(this)" style="width:10rem;text-align:center">Status</th>
                <th onclick="sort_table(this)">Message</th>
            </tr>
            <tr v-for="entry in entries" :style="'background-color:' + entry['color']">
                <template v-if="entry.type == 'access_log'">
                    <td><pre>[[entry.time]]</pre></td>
                    <td ><pre><font color="#00b0cf">[[entry.host]]</font></pre></td>
                    <td style="text-align:center"><pre><font :color="entry.status === 200 ? 'green' : 'indianred'">[[entry.status]]</font></pre></td>
                    <td><pre>[[entry.request]]</pre></td>
                </template>
                <template v-else-if="entry.type == 'root_log'">
                    <td><pre>[[entry.time]]</pre></td>
                    <td><pre><font color="indianred">Mythic</font></pre></td>
                    <td><pre></pre></td>
                    <td><pre>[[entry.message]]</pre></td>
                </template>
            </tr>
        </table>
    </div>
    <div class="card-footer bg-card-footer">
        <div style="display:inline-block">
            <button type="button" class="btn btn-md btn{{config['outline-buttons']}}info" onclick="location.href='{{http}}://{{links.server_ip}}:{{links.server_port}}{{links.api_base}}/mythic_logs/download'"><i class="fas fa-download fa-lg"></i> Download logs</button>
            <button type="button" :disabled="current_page <= 1" class="btn btn-light" data-toggle="tooltip" title="Go back one page" @click="get_page(current_page-1)"><i class="fas fa-backward"></i></button>&nbsp;
            <template v-if="current_page > 1">
                <button type="button" class="btn btn-light" data-toggle="tooltip" title="Go to first page" @click="get_page(1)">1</button>
            </template>
            <template v-if="current_page > 2">&nbsp;<font size="5" class="text-white">...</font>&nbsp;</template>
            <template v-if="current_page -2 > 1">
                <button type="button" class="btn btn-light" @click="get_page(current_page -2)">[[current_page - 2]]</button>
            </template>
            <template v-if="current_page -1 > 1">
                <button type="button" class="btn btn-light" @click="get_page(current_page -1)">[[current_page - 1]]</button>
            </template>
            <button type="button" disabled class="btn btn-light" data-toggle="tooltip" title="Current page">[[current_page]] </button>
            <template v-if="current_page + 1 < Math.ceil(total_count/page_size)">
                <button type="button" class="btn btn-light" @click="get_page(current_page + 1)">[[current_page + 1]]</button>
            </template>
            <template v-if="current_page + 2 < Math.ceil(total_count/page_size)">
                <button type="button" class="btn btn-light" @click="get_page(current_page +2)">[[current_page + 2]]</button>
            </template>
            <template v-if="current_page < Math.ceil(total_count/page_size) -1">
                &nbsp;<font size="5" class="text-white">...</font>&nbsp;
            </template>
            <template v-if="current_page != Math.ceil(total_count/page_size) && total_count > 0">
                <button type="button" class="btn btn-light" data-toggle="tooltip" title="Go to last page" @click="get_page(Math.ceil(total_count/page_size))">[[Math.ceil(total_count/page_size)]]</button>
            </template>

            <button type="button" class="btn btn-light" :disabled="current_page == Math.ceil(total_count/page_size) || Math.ceil(total_count/page_size) == 0" data-toggle="tooltip" title="Go forward one page" @click="get_page(current_page + 1)"><i class="fa fa-forward"></i></button>
            &nbsp;<font size="4" class="text-white">Total Count: [[total_count]]</font>
        </div>

        <div style="display:inline-block; float:right">
            <span class="input-group">
                <input class="form-control" type="number" size="5em" :placeholder="page_size" id="page_size" @keyup.enter="get_new_page_size()">
                <div class="input-group-append input-group-btn" ><button  type="button" class="btn btn{{config['outline-buttons']}}success" @click="get_new_page_size()">Edit page size</button></div>
            </span>
        </div>

    </div>
</div>

{% endblock %}

{% block scripts %}
{% include "web_log.js" %}
{% endblock %}

{% block body_config %}

{% endblock %}