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

<form method="get" action="/clusters/cluster/node/logs" class="ui form" autocomplete="off">
    <input type="hidden" name="clusterId" :value="clusterId"/>
    <input type="hidden" name="nodeId" :value="nodeId"/>
    <div class="ui fields inline">
        <div class="ui field">
            <input type="text" name="dayFrom" :placeholder="t('clusters_cluster_node_logs@开始日期')" v-model="dayFrom" value="" style="width:8em" id="day-from-picker"/>
        </div>
        <div class="ui field">
            <input type="text" name="dayTo" :placeholder="t('clusters_cluster_node_logs@结束日期')" v-model="dayTo" value="" style="width:8em" id="day-to-picker"/>
        </div>
        <div class="ui field">
            <b-select
                name="level"
                v-model="level"
                :options="[
                    {label: t('clusters_cluster_node_logs@级别Placeholder'), value: ''},
                    {label: t('clusters_cluster_node_logs@级别错误'), value: 'error'},
                    {label: t('clusters_cluster_node_logs@级别警告'), value: 'warning'},
                    {label: t('clusters_cluster_node_logs@级别信息'), value: 'info'},
                    {label: t('clusters_cluster_node_logs@级别成功'), value: 'success'},
                ]"
            ></b-select>
        </div>
        <div class="ui field">
            <b-select
                name="tag"
                v-model="tag"
                :options="[
                    {label: t('clusters_cluster_node_logs@标签Placeholder'), value: ''},
                    ...tags.map(tag => ({
                        label: tag.name??'',
                        value: tag.code??'',
                    }))
                ]"
            ></b-select>
        </div>
        <div class="ui field">
            <input type="text" name="keyword" style="width:10em" v-model="keyword" :placeholder="t('clusters_cluster_node_logs@关键词')"/>
        </div>
        <div class="ui field">
            <button type="submit" class="ui button">{{t('clusters_cluster_node_logs@查询')}}</button>
        </div>
        <div class="ui field" v-if="dayFrom.length > 0 || dayTo.length > 0 || keyword.length > 0 || level.length > 0 || tag.length > 0">
            <a :href="'/clusters/cluster/node/logs?clusterId=' + clusterId + '&nodeId=' + nodeId">{{t('clusters_cluster_node_logs@清除条件')}}</a>
        </div>
    </div>
</form>

<b-empty v-if="logs.length == 0">{{t('clusters_cluster_node_logs@暂时还没有日志')}}</b-empty>

<table class="ui table selectable" v-if="logs.length > 0">
    <thead>
        <tr>

        </tr>
    </thead>
    <tr v-for="log in logs">
        <td>
            <node-log-row :v-log="log" :v-keyword="keyword"></node-log-row>
        </td>
    </tr>
</table>

<div class="page" v-html="filterPageContent(page)"></div>