const ViewAccessPoints = {
	template: `<div class="row">
		<h1>AccessPoints</h1>
		<table class="p-table--mobile-card" role="grid">
			<thead>
				<tr role="row">
					<th scope="col" role="columnheader" id="t-name" aria-sort="none">Name</th>
					<th scope="col" role="columnheader" id="t-users" aria-sort="none" class="u-align--right">Users</th>
					<th scope="col" role="columnheader" id="t-units" aria-sort="none" class="u-align--right">Units</th>
				</tr>
			</thead>
			<tbody>
				<accesspoint-table-item/>
			</tbody>
		</table>
	</div>`
}

Vue.component('accesspoint-table-item', {
	template: `<tr role="row">
		<td role="rowheader" aria-label="Name">Grape</td>
		<td role="gridcell" aria-label="Users" class="u-align--right">8</td>
		<td role="gridcell" aria-label="Units" class="u-align--right">19</td>
	</tr>`
})