{$layout}
{$template "menu"}

<div class="margin"></div>
<form class="ui form" method="get" action="/admins" v-show="!hasWeakPassword">
    <div class="ui fields inline">
        <div class="ui field">
            <input type="text" name="keyword" placeholder="用户名、全名 ..." v-model="keyword"/>
        </div>
        <div class="ui field">
            <button class="ui button" type="submit">搜索</button>
            &nbsp;
            <a href="/admins" v-if="keyword.length > 0">[清除条件]</a>
        </div>
    </div>
</form>

<div v-if="admins.length == 0">
    <b-empty>
        暂时还没有<span v-if="keyword.length > 0">跟关键词匹配</span>管理员。
    </b-empty>
</div>

<div v-if="hasWeakPassword">
    <b-label small>
        当前正在筛选弱密码管理员 <a href="/admins"><i class="pi pi-times"></i></a>
    </b-label>
    <span class="ui label small basic">当前正在筛选弱密码管理员 <a href="/admins"><i class="pi pi-times"></i></a></span>
</div>

<table class="ui table selectable" v-show="admins.length > 0">
	<thead>
		<tr>
			<th>用户名</th>
			<th>全名</th>
            <th>允许登录</th>
            <th>OTP认证</th>
			<th class="center width10">状态</th>
			<th class="two op">操作</th>
		</tr>
	</thead>
	<tr v-for="admin in admins">
        <td :class="{disabled:!admin.isOn}">
            <a :href="'/admins/admin?adminId=' + admin.id"><keyword :v-word="keyword">{{admin.username}}</keyword></a>
			<!-- <div v-if="admin.isSuper || admin.hasWeakPassword" style="margin-top: 0.5em">
				<tiny-basic-label class="olive" v-if="admin.isSuper">超级管理员</tiny-basic-label>
                <a :href="'/admins/update?adminId=' + admin.id" v-if="admin.hasWeakPassword">
                    <tiny-basic-label class="red" title="当前管理员已设置密码为弱密码，有极大的安全风险，请及时修改">弱密码</tiny-basic-label>
                </a>
			</div> -->
            <b-label-group style="margin-top: 0.5em">
                <b-label
                    v-if="admin.isSuper"
                    size="tiny"
                    color="olive"
                    text="超级管理员"
                ></b-label>
                <b-label
                    v-if="admin.hasWeakPassword"
                    size="tiny"
                    color="red"
                    :href="'/admins/update?adminId=' + admin.id"
                    title="当前管理员已设置密码为弱密码，有极大的安全风险，请及时修改"
                    text="弱密码"
                ></b-label>
            </b-label-group>
		</td>
		<td :class="{disabled:!admin.isOn}"><keyword :v-word="keyword">{{admin.fullname}}</keyword></td>
        <td>
            <span v-if="admin.canLogin" class="green">Y</span>
            <span v-else class="disabled">N</span>
        </td>
        <td>
            <span v-if="admin.otpLoginIsOn" class="green">Y</span>
            <span v-else class="disabled">N</span>
        </td>
		<td class="center">
			<label-on :v-is-on="admin.isOn"></label-on>
		</td>
		<td>
			<a :href="'/admins/admin?adminId=' + admin.id">详情</a> &nbsp; <a href="" @click.prevent="deleteAdmin(admin.id)">删除</a>
		</td>
	</tr>
</table>

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