{$layout "layout_popup"}

<!-- <h3>使用域名"{{domain}}"的节点</h3> -->
<b-settings-header> 使用域名"{{domain}}"的节点 </b-settings-header>

<form class="ui form" action="/dns/domains/nodesPopup" method="get">
  <input type="hidden" name="domainId" :value="domainId" />
  <div class="ui fields inline">
    <div class="ui field">
      <input type="text" placeholder="关键词" v-model="keyword" />
    </div>
    <div class="ui field">
      <b-select
        v-model="status"
        auto-width
        :options="[
        {label: '[全部状态]', value: ''},
        {label: '已解析', value: 'ok'},
        {label: '未解析', value: 'notOk'},
        ]"
      ></b-select>
      <!-- <select class="ui dropdown auto-width" v-model="status">
            <option value="">[全部状态]</option>
            <option value="ok">已解析</option>
            <option value="notOk">未解析</option>
        </select> -->
    </div>
  </div>
</form>
<div class="ui divider"></div>
<table class="ui table selectable">
  <thead>
    <tr>
      <th>集群</th>
      <th>节点</th>
      <th>子域名</th>
      <th>线路</th>
      <th>IP</th>
      <th class="width10">解析状态</th>
    </tr>
  </thead>
  <tr v-for="node in nodes">
    <td>
      {{node.cluster.name}}<a
        :href="'/clusters/cluster?clusterId=' + node.cluster.id"
        target="_blank"
        ><link-icon></link-icon
      ></a>
    </td>
    <td>
      {{node.name}}<a
        :href="'/clusters/cluster/node?clusterId=' + node.cluster.id + '&nodeId=' + node.id"
        target="_blank"
        ><link-icon></link-icon
      ></a>
    </td>
    <td>{{node.cluster.dnsName}}</td>
    <td>{{node.route.name}}</td>
    <td>{{node.ipAddr}}</td>
    <td>
      <span class="green" v-if="node.isOk">已解析</span>
      <span class="red" v-else>未解析</span>
    </td>
  </tr>
</table>
