{$layout}
{$template "menu"}

<div class="left-right-box-container">
	{$template "/left_menu"}

	<div class="right-box">
		<b-empty v-if="nodes.length == 0">暂时没有需要远程安装的节点。</b-empty>

		<div v-if="nodes.length > 0">
			<b-settings-header>所有未安装节点</b-settings-header>
			<!-- <h3>所有未安装节点</h3> -->
			<table class="ui table selectable celled">
				<thead>
					<tr>
						<th>节点名</th>
						<th>访问IP</th>
						<th>SSH地址</th>
						<th class="four wide">节点状态</th>
						<th class="two op">操作</th>
					</tr>
				</thead>
				<tr v-for="node in nodes">
					<td>
						<a :href="'/clusters/cluster/node?clusterId=' + clusterId + '&nodeId=' + node.id">{{node.name}}</a>
					</td>
					<td>
						<span v-for="addr in node.addresses" v-if="addr.canAccess" class="ui label tiny">{{addr.ip}}</span>
					</td>
					<td>
						<span v-if="node.login != null && node.login.type == 'ssh' && node.loginParams != null && node.loginParams.host != null && node.loginParams.host.length > 0">
							{{node.loginParams.host}}:{{node.loginParams.port}}
						</span>
						<span v-else class="disabled">没有设置</span>
					</td>
					<td>
						<span class="disabled">等待安装</span>
					</td>
					<td>
						<a :href="'/clusters/cluster/node/install?clusterId=' + clusterId + '&nodeId=' + node.id">手动安装</a>
					</td>
				</tr>
			</table>
		</div>
	</div>
</div>