{$layout}
{$template "menu"}
{$template "/left_menu_with_menu"}

<div class="left-right-box-container">

	<div class="right-box">
		<b-empty v-if="nodes.length == 0">{{t('clusters_cluster_upgradeRemote@暂时没有需要升级的节点')}}</b-empty>

		<div v-if="nodes.length > 0">
			<b-settings-header
				v-if="selectedNodeIds.length > 0" 
				@action="installBatch()"
				:action-text="t('clusters_cluster_upgradeRemote@批量升级N', [selectedNodeIds.length])"
			>
				{{t('clusters_cluster_upgradeRemote@所有需要升级的节点')}}
			</b-settings-header>
			<b-settings-header v-else>
				{{t('clusters_cluster_upgradeRemote@所有需要升级的节点')}}
			</b-settings-header>

			<b-table
				:columns="columns"
				:data-source="nodes"
				:row-key="'id'"
				:row-selection="{
					type: 'checkbox',
					selectedRowKeys: selectedNodeIds,
					onChange: (selectedRowKeys, selectedRows) => {
						selectedNodeIds = selectedRows.map(v => v.id);
					},
					getCheckboxProps: record => ({
							props: {
									disabled: (record.isInstalling || (record.installStatus && record.installStatus.isFinished && record.installStatus.isOk)), 
									name: record.id.toString(), 
							},
					}),
				}"
				size="middle"
			>
				<!-- 节点名 -->
				<template slot="nameSlot" slot-scope="{ record }">
					<link-icon :href="'/clusters/cluster/node?clusterId=' + clusterId + '&nodeId=' + record.id">{{record.name}}</link-icon>
				</template>

				<!-- 访问IP -->
				<template slot="ipSlot" slot-scope="{ record }">
					<span v-for="addr in record.addresses" v-if="addr.canAccess" class="ui label tiny basic">{{addr.ip}}</span>
					<span v-if="!record.addresses || record.addresses.filter(a => a.canAccess).length == 0" class="disabled">-
				</template>

				<!-- SSH地址 -->
				<template slot="sshSlot" slot-scope="{ record }">
					<span v-if="record.login != null && record.login.type == 'ssh' && record.loginParams != null && record.loginParams.host != null && record.loginParams.host.length > 0">
						{{record.loginParams.host}}:{{record.loginParams.port}}
					</span>
					<span v-else class="disabled">{{t('clusters_cluster_upgradeRemote@没有设置')}}</span>
				</template>

				<!-- 版本变化 -->
				<template slot="versionSlot" slot-scope="{ record }">
					v{{record.oldVersion}} -&gt; v{{record.newVersion}}
				</template>

				<!-- 节点状态 -->
				<template slot="statusSlot" slot-scope="{ record }">
					<div v-if="record.installStatus != null && (record.installStatus.isRunning || record.installStatus.isFinished)">
						<div v-if="record.installStatus.isRunning" class="blue"><i class="icon loading circle notch"></i> {{t('clusters_cluster_upgradeRemote@升级中')}}</div>
						<div v-if="record.installStatus.isFinished">
							<span v-if="record.installStatus.isOk" class="green"><i class="icon check circle"></i> {{t('clusters_cluster_upgradeRemote@已升级成功')}}</span>
							<span v-if="!record.installStatus.isOk" class="red"><i class="icon warning circle"></i> {{t('clusters_cluster_upgradeRemote@升级过程中发生错误', [record.installStatus.error])}}</span>
						</div>
					</div>
					<span v-else class="disabled">{{t('clusters_cluster_upgradeRemote@等待升级')}}</span>
				</template>

				<!-- 操作 -->
				<template slot="actionSlot" slot-scope="{ record }">
					<!-- 如果不在批量操作中，且节点不在安装中，且节点状态不是已完成或不是成功完成 -->
					<a-button type="link" @click.prevent="installNode(record)" v-if="!isInstalling && !record.isInstalling && (!record.installStatus || !record.installStatus.isFinished || !record.installStatus.isOk)">
						<i class="pi pi-upload" style="font-size: 12px; padding: 4px;"></i> {{t('clusters_cluster_upgradeRemote@升级')}}
					</a-button>
					<!-- 如果全局在安装中，且当前节点是正在安装的节点 -->
					<span v-if="isInstalling && record.isInstalling" class="grey"><i class="icon loading circle notch"></i> {{t('clusters_cluster_upgradeRemote@升级中')}}</span>
					<!-- 如果全局在安装中，但当前节点不是正在安装的节点，且不是已成功完成 -->
					<span v-if="isInstalling && !record.isInstalling && (!record.installStatus || !record.installStatus.isFinished || !record.installStatus.isOk)" class="disabled">{{t('clusters_cluster_upgradeRemote@升级')}}</span>
					<!-- 如果节点状态是已完成且成功 -->
					<span v-if="record.installStatus && record.installStatus.isFinished && record.installStatus.isOk" class="green">{{t('clusters_cluster_upgradeRemote@已升级')}}</span>
				</template>
			</b-table>
		</div>
	</div>
</div>