{$layout}
{$template "/first-menu"}

<div class="left-right-box-container">
	<div class="right-box without-tabbar">
		{$template "../menu"}

		<div class="base-container">
			<second-menu>
				<menu-item @click.prevent="createUser">
					<i class="pi pi-pen-to-square"></i>
					{{t('acme_users_index@创建用户')}}
				</menu-item>
				<menu-item><tip-icon @click.stop :content="t('acme_users_index@用户信息提示')"></tip-icon></menu-item>
			</second-menu>

			<!-- {{t('acme_users_index@空数据提示')}} -->
			<b-empty v-if="users.length == 0">{{t('acme_users_index@暂无用户')}}</b-empty>

			<!-- {{t('acme_users_index@数据表格区域')}} -->
			<div class="base-form" v-if="users.length > 0">
				<b-table
					:columns="columns"
					:data-source="users"
					row-key="id"
					:bordered="false"
					size="middle"
					:pagination="false">
					
					<!-- {{t('acme_users_index@用户Email列')}} -->
					<template slot="email" slot-scope="{ text, record }">
						<a href="" @click.prevent="updateUser(record.id)">{{record.email}} <i class="icon expand small"></i></a>
						<div class="domain-labels" style="margin-top: 0.5em">
							<div class="domain-label" v-if="record.provider != null">
								<span class="domain-type">{{record.provider.name}}</span>
							</div>
							<div class="domain-label" v-if="record.account != null">
								<span class="domain-type">{{record.account.name}}</span>
							</div>
						</div>
					</template>
					
					<!-- {{t('addPopup@备注')}} -->
					<template slot="description" slot-scope="{ text, record }">
						<span v-if="record.description.length > 0">{{record.description}}</span>
						<span v-else class="disabled">-</span>
					</template>
					
					<!-- {{t('certs_index@操作')}} -->
					<template slot="actions" slot-scope="{ text, record }">
						<div class="action-buttons">
							<a href="" @click.prevent="updateUser(record.id)" class="action-button"><i class="icon edit"></i>{{t('certs_index@修改')}}</a>
							<a href="" @click.prevent="deleteUser(record.id)" class="action-button"><i class="icon trash"></i>{{t('certs_index@删除')}}</a>
						</div>
					</template>
				</b-table>
			</div>

			<!-- {{t('acme_users_index@分页')}} -->
			<div class="page" v-html="filterPageContent(page)"></div>
		</div>
	</div>
</div>