{include file="{$TPL_PATH}inc/overall_header.html"}
<script type="text/javascript" src="{$LIBS_DIR}esia/index.js"></script>
{strip}
<section class="inlineView splitTwo indexInfo">
    <div class="tableview_title">
        <h3>{$lang.SECTION_INDEX_INFO}</h3>
    </div>
    <div class="contentView">
        <div class="gridSplitTwo">
            <span class="gridFirstCol dataTitle">{$lang.IP_ADDR_PUB}</span>
            <span class="gridSecondCol publicIp">&hellip;</span>
            <span class="gridFirstCol dataTitle">{$lang.IP_ADDR_LOCAL}</span>
            <span class="gridSecondCol">{$gesa.localip}</span>
            <span class="gridFirstCol dataTitle">{$lang.NETMASK}</span>
            <span class="gridSecondCol">{$gesa.netmask}</span>
            <span class="gridFirstCol dataTitle">{$lang.GATEWAY}</span>
            <span class="gridSecondCol">{$gesa.gateway}</span>
            <span class="gridFirstCol dataTitle">{$lang.DNS}</span>
            <span class="gridSecondCol">{implode('<br>', $gesa.dns)}</span>
        </div>
        <div class="gridSplitTwo">
            <span class="gridFirstCol dataTitle">{$lang.SERIAL_NUMBER}</span>
            <span class="gridSecondCol">{$gesa.sn}</span>
            <span class="gridFirstCol dataTitle">{$lang.TYPE}</span>
            <span class="gridSecondCol">{$gesa.type}</span>
            <span class="gridFirstCol dataTitle">{$lang.MODEL}</span>
            <span class="gridSecondCol">{$gesa.model}</span>
            <span class="gridFirstCol dataTitle">{$lang.OS_VERSION}</span>
            <span class="gridSecondCol">{$gesa.version_os}</span>
        </div>
        <div class="gridSplitTwo">
            <span class="gridFirstCol dataTitle">{$lang.LINKED_SERVER}</span>
            <span class="gridSecondCol serverUrl">&hellip;</span>
            <span class="gridFirstCol dataTitle">{$lang.SERVER_PORT_CONNECTION}</span>
            <span class="gridSecondCol serverPort">&hellip;</span>
        </div>
    </div>
</section>
<section class="inlineView splitTwo indexDiag">
    <div class="tableview_title">
        <h3>{$lang.SECTION_INDEX_DIAG}</h3>
    </div>
    <div class="contentView">
        <table>
            <tbody>
                <tr>
                    <td>{$lang.DNS_RESOLUTION}</td>
                    <td class="diagProgress diagDNS">
                        <div class="progressbar">
                            <div class="progress-label">{$lang.FETCHING_DATA}</div>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td>{$lang.INTERNET_ACCESS}</td>
                    <td class="diagProgress diagWEB">
                        <div class="progressbar">
                            <div class="progress-label">{$lang.FETCHING_DATA}</div>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td>{$lang.SERVER_CONNECTION}</td>
                    <td class="diagProgress diagSRV">
                        <div class="progressbar">
                            <div class="progress-label">{$lang.FETCHING_DATA}</div>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td>{$lang.ECATP_LINK}</td>
                    <td class="diagProgress diagECATP">
                        <div class="progressbar">
                            <div class="progress-label">{$lang.FETCHING_DATA}</div>
                        </div>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</section>
<section class="inlineView splitTwo indexMaj">
    <div class="tableview_title">
        <h3>{$lang.SECTION_INDEX_MAJ}</h3>
        <div class="pager">
            <button type="button" id="updateGesa" class="btnOk">{$lang.UPDATE_NOW}</button>
        </div>
    </div>
    <div class="wrapView">
        <div class="contentView gridSplitTwo">
            <div class="gridSplitTwo">
                <span class="gridFirstCol dataTitle">{$lang.LAST_UPDATE} - {$lang.START}</span>
                <span class="gridSecondCol">{$updates.last_start}</span>
                <span class="gridFirstCol dataTitle">{$lang.LAST_UPDATE} - {$lang.END}</span>
                <span class="gridSecondCol">{$updates.last_end}</span>
            </div>
            <div class="gridSplitTwo">
                <span class="gridFirstCol dataTitle">{$lang.DAILY_UPDATE_TIME}</span>
                <span class="gridSecondCol">{$updates.auto}</span>
            </div>
        </div>
        <div class="scrollView">
            <table>
                <caption>{$lang.PACKAGES}</caption>
                <thead>
                    <tr>
                        <th>{$lang.STATE}</th>
                        <th>{$lang.NAME}</th>
                        <th>{$lang.VERSION}</th>
                        <th>{$lang.DESCRIPTION}</th>
                    </tr>
                </thead>
                <tbody>
                {foreach from=$packages item=pack}
                    <tr>
                        <td class="package-state" title="{$pack[0]}">
                            {if $pack[0] == 'ii'}
                                <img src="{$IMG_DIR}accept.png" alt="{$lang.OK}">
                            {else}
                                <img src="{$IMG_DIR}refuse.png" alt="{$lang.FAILED}">
                            {/if}
                        </td>
                        <td>{$pack[1]}</td>
                        <td>{$pack[2]}</td>
                        <td>{$pack[4]}</td>
                    </tr>
                {/foreach}
                </tbody>
            </table>
        </div>
    </div>
</section>
<section class="inlineView splitTwo indexIfaces">
    <div class="tableview_title">
        <h3>{$lang.SECTION_INDEX_IFACES}</h3>
    </div>
    <div class="scrollView">
        <table>
            <thead>
                <tr>
                    <th>{$lang.IF_INDEX}</th>
                    <th>{$lang.IP_ADDR}</th>
                    <th>{$lang.NAME}</th>
                    <th>{$lang.STATE}</th>
                    <th>{$lang.IF_IN_OCTET}</th>
                    <th>{$lang.IF_OUT_OCTET}</th>
                    <th>{$lang.IF_IN_ERROR}</th>
                    <th>{$lang.IF_OUT_ERROR}</th>
                    <th>{$lang.MTU}</th>
                    <th>{$lang.SPEED}</th>
                </tr>
            </thead>
            <tbody>
            {foreach from=$interfaces item=iface}
                <tr>
                    <td>{$iface.index}</td>
                    <td>{$iface.ip}</td>
                    <td>{$iface.name}</td>
                    <td {if $iface.state == "up"}class="EventOK"{else}class="EventUnknown"{/if}>{$iface.state}</td>
                    <td data-value="{$iface.in_octet.raw}">{$iface.in_octet.value} {$iface.in_octet.unity}</td>
                    <td data-value="{$iface.out_octet.raw}">{$iface.out_octet.value} {$iface.out_octet.unity}</td>
                    <td>{$iface.in_error}</td>
                    <td>{$iface.out_error}</td>
                    <td>{$iface.mtu}</td>
                    <td data-value="{$iface.speed.raw}">{$iface.speed.value} {$iface.speed.unity}</td>
                </tr>
            {/foreach}
            </tbody>
        </table>
    </div>
</section>
<script type="text/javascript">
    var gesa_sn = "{$gesa.sn}";

    {literal}
        document.addEventListener('DOMContentLoaded', () => getGesaAsyncData(gesa_sn));
    {/literal}
</script>
{/strip}
{include file="{$TPL_PATH}inc/overall_footer.html"}