{$layout} {$template "list_menu"}

<!--<second-menu>
    <menu-item @click.prevent="createIP">[创建IP]</menu-item>
</second-menu>-->

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

<form class="ui form" action="/waf/iplists/items">
  <input type="hidden" name="listId" :value="list.id" />
  <div class="ui fields inline">
    <div class="ui field">
      <input
        type="text"
        size="20"
        placeholder="x.x.x.x"
        name="keyword"
        v-model="keyword"
      />
    </div>
    <div class="ui field">
      <b-select
        name="eventLevel"
        v-model="eventLevel"
        :options="[
            {label: '[级别]', value: ''},
            ...eventLevels.map(level => ({
                label: level.name,
                value: level.code,
            })),
        ]"
      ></b-select>
      <!-- <select class="ui dropdown" name="eventLevel" v-model="eventLevel">
        <option value="">[级别]</option>
        <option v-for="level in eventLevels" :value="level.code">
          {{level.name}}
        </option>
      </select> -->
    </div>
    <div class="ui field">
      <button class="ui button" type="submit">搜索</button>
      &nbsp;
      <a
        :href="'/waf/iplists/items?listId=' + list.id"
        v-if="keyword.length > 0 || eventLevel.length > 0"
        >[清除条件]</a
      >
    </div>
  </div>
  <div class="margin"></div>
</form>

<!-- <p class="comment" v-if="items.length == 0">暂时还没有IP。</p> -->
<b-empty v-if="items.length == 0">暂时还没有IP。</b-empty>

<ip-list-table
  v-if="items.length > 0"
  :v-items="items"
  @update-item="updateItem"
  @delete-item="deleteItem"
  :v-keyword="keyword"
></ip-list-table>

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