{$layout}
{$template "menu"}
{$template "/datepicker"}

<div class="margin"></div>

<form method="get" action="/log" class="ui form" autocomplete="off">
	<div class="ui fields inline">
		<div class="ui field">
			<input type="text" name="dayFrom" placeholder="开始日期" v-model="dayFrom" value="" style="width:8em" id="day-from-picker"/>
		</div>
		<div class="ui field">
			<input type="text" name="dayTo" placeholder="结束日期" v-model="dayTo" value="" style="width:8em" id="day-to-picker"/>
		</div>
		<div class="ui field">
			<input type="text" name="keyword" style="width:10em" v-model="keyword" placeholder="关键词"/>
		</div>
        <div class="ui field">
            <select class="ui dropdown auto-width" name="userType" v-model="userType">
                <option value="">[用户类型]</option>
                <option value="admin">管理员</option>
                <option value="user">用户</option>
            </select>
        </div>
		<div class="ui field">
			<button type="submit" class="ui button">查询</button>
		</div>
		<div class="ui field" v-if="dayFrom.length > 0 || dayTo.length > 0 || keyword.length > 0">
			<a href="/log">[清除条件]</a>
		</div>
		<div class="ui field">
			<a href="" @click.prevent="exportExcel">[导出到Excel]</a>
		</div>
	</div>
</form>

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

<table class="ui table selectable" v-for="log in logs">
	<tr :class="{error: log.level == 'error', warning: log.level == 'warn'}">
		<td class="log-row">{{log.createdTime}} <span class="grey"> <span
                v-if="log.userName.length > 0">| <span v-if="log.userId>0">用户 &nbsp;|&nbsp;</span> {{log.userName}}</span> | <keyword :v-word="keyword">{{log.ip}}</keyword><span
						v-if="log.region.length > 0"> | {{log.region}}</span> &nbsp; <a href="" @click.prevent="showMore(log)" title="显示更多">...</a> &nbsp;<span v-if="log.moreVisible">{{log.action}}</span></span>
			<span class="buttons"><a v-if="logConfig.canDelete" href="" title="删除" @click.prevent="deleteLog(log.id)"><i class="icon remove small"></i></a> </span>
		</td>
	</tr>
	<tr :class="{error: log.level == 'error', warning: log.level == 'warn'}">
        <td><keyword :v-word="keyword">{{log.description}}</keyword></td>
	</tr>
</table>

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