{$layout "layout_popup"}

<!-- <h3>{{t('certs_selectPopup@选择证书')}} <span v-if="searchingDomains.length > 0">（{{t('certs_selectPopup@当前网站域名')}}：{{searchingDomains[0]}}<var style="font-style: normal" v-if="searchingDomains.length > 1">{{t('certs_selectPopup@等N个域名', searchingDomains.length)}}</var>）</span></h3> -->

<!-- 搜索表单 -->
<form class="ui form" action="/servers/certs/selectPopup" ref="searchForm">
    <input type="hidden" name="selectedCertIds" :value="selectedCertIds"/>
    <input type="hidden" name="searchingType" :value="searchingType"/>
    <input type="hidden" name="searchingDomains" :value="searchingDomains.join(',')"/>
    <div class="ui fields inline">
        <div class="ui field">
            <user-selector :v-user-id="userId" ref="userSelector"></user-selector>
        </div>
        <div class="ui field">
            <input type="text" name="keyword" v-model="keyword" :placeholder="t('certs_selectPopup@域名、说明文字等')" size="30"/>
        </div>
        <div class="ui field">
            <button class="ui button" type="submit">{{t('certs_selectPopup@搜索')}}</button> &nbsp;
            <a :href="'/servers/certs/selectPopup?selectedCertIds=' + selectedCertIds + '&searchingType=' + searchingType + '&searchingDomains=' + encodeURL(searchingDomains.join(','))" v-if="keyword.length > 0">[{{t('certs_selectPopup@清除条件')}}]</a>
        </div>
    </div>
</form>

<!-- 选项卡 -->
<div v-if="searchingDomains.length > 0">
    <div class="ui divider" style="margin-bottom: 0"></div>
    <second-menu>
        <span class="item"><span v-if="searchingUserId > 0">{{t('certs_selectPopup@当前用户')}}</span><span v-else>{{t('certs_selectPopup@未指定用户')}}</span></span>
        <raquo-item></raquo-item>
        <menu-item :active="searchingType == 'all'" :href="baseURL + '&searchingType=all'">{{t('certs_selectPopup@所有证书')}} <span class="small">({{totalAll}})</span></menu-item>
        <span class="separator">|</span>
        <menu-item :active="searchingType == 'match'" :href="baseURL + '&searchingType=match'">{{t('certs_selectPopup@域名匹配证书')}} <span class="small"> ({{totalMatch}})</span></menu-item>
    </second-menu>
</div>

<!-- 全选 -->
<div v-if="countChecked > 0">
    <div class="margin"></div>
    <button class="ui button small basic" type="button" @click.prevent="confirmChecked">{{t('certs_selectPopup@使用选中的N个证书', [countChecked])}}</button>
</div>

<!-- 证书列表 -->
<b-empty v-if="certs.length == 0">
    <span v-if="searchingUserId > 0">{{t('certs_selectPopup@当前用户下')}}</span>{{t('certs_selectPopup@暂时还没有')}}<span v-if="searchingType == 'match'">{{t('certs_selectPopup@跟所添加域名匹配的')}}</span>{{t('certs_selectPopup@相关证书')}}<span v-if="searchingUserId > 0">,<a href="" @click.prevent="searchNoneUserCerts">[{{t('certs_selectPopup@尝试搜索管理员证书')}}]</a></span>。
</b-empty>
<table class="ui table selectable celled b-no-vertical" v-if="certs.length > 0">
	<thead>
        <tr>
            <th style="width:1em"><checkbox @input="changeAll"></checkbox></th>
            <th>{{t('certs_selectPopup@证书说明')}}</th>
            <th>{{t('certs_selectPopup@域名')}}</th>
            <th>{{t('certs_selectPopup@过期日期')}}</th>
            <th v-if="viewSize == 'normal'">{{t('certs_selectPopup@引用网站')}}</th>
            <th>{{t('certs_selectPopup@状态')}}</th>
            <th class="one op">{{t('certs_selectPopup@操作')}}</th>
        </tr>
	</thead>
	<tr v-for="(cert, index) in certs">
        <td>
            <checkbox v-model="cert.isChecked" ref="certCheckboxes" @input="changeCertChecked" v-if="!certInfos[index].isSelected"></checkbox>
        </td>
        <td>
            <a href="" @click.prevent="selectCert(cert)" v-if="!certInfos[index].isSelected"><keyword :v-word="keyword">{{cert.name}}</keyword></a>
            <span  v-if="certInfos[index].isSelected">{{cert.name}}</span>

            <div v-if="cert.commonNames != null && cert.commonNames.length > 0" style="margin-top:0.5em">
                <span class="grey small">{{cert.commonNames[cert.commonNames.length-1]}}</span>
            </div>

			<div v-if="cert.isCA" style="margin-top:0.5em">
				<span class="ui label olive tiny">CA</span>
			</div>
		</td>
		<td>
			<div v-for="dnsName in cert.dnsNames" style="margin-bottom:0.4em">
                <span class="ui label tiny basic"><keyword :v-word="keyword">{{dnsName}}</keyword></span>
			</div>
		</td>
		<td>{{certInfos[index].endDay}}</td>
		<td v-if="viewSize == 'normal'">{{certInfos[index].countServers}}</td>
		<td nowrap="">
			<span class="ui label red tiny basic" v-if="certInfos[index].isExpired">{{t('certs_selectPopup@已过期')}}</span>
			<span class="ui label green tiny basic" v-else>{{t('certs_selectPopup@有效中')}}</span>
		</td>
		<td>
			<a href="" @click.prevent="selectCert(cert)" v-if="!certInfos[index].isSelected">{{t('certs_selectPopup@选择')}}</a>
			<span v-else>{{t('certs_selectPopup@已选')}}</span>
		</td>
	</tr>
</table>

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