{$layout}
{$template "menu"}

<p class="comment" v-if="logs.length == 0">暂时还没有日志。</p>

<div v-if="logs.length > 0">
   <div class="margin"></div>
   <table class="ui table selectable celled">
       <thead>
            <tr>
                <th class="two wide">操作人</th>
                <th>IP</th>
                <th class="two wide">状态</th>
                <th>描述</th>
                <th style="width: 12em">时间</th>
            </tr>
       </thead>
        <tr v-for="log in logs">
            <td>
                <span v-if="log.admin.id > 0">{{log.admin.name}}</span>
                <span v-else class="grey">{{log.admin.name}}</span>
            </td>
            <td>
                <span v-if="log.addr != null"><a :href="'/clusters/ip-addrs/addr?addrId=' + log.addr.id">{{log.addr.ip}}</a></span>
                <span v-else class="disabled">已删除</span>
            </td>
            <td>
                <span v-if="!log.isOn" class="red">停用</span>
                <span v-else-if="!log.canAccess" class="red">不可访问</span>
                <span v-else-if="log.isUp && log.backupIP.length > 0" class="orange">备用
                    <br/><span class="grey small">{{log.backupIP}}</span>
                </span>
                <span v-else-if="log.isUp" class="green">上线</span>
                <span v-else class="red">离线</span>
            </td>
            <td>{{log.description}}</td>
            <td>{{log.createdTime}}</td>
        </tr>
   </table>
</div>

<div class="page" v-html="page"></div>