节点列表节点IP超出4个后可以自动隐藏和显示

web/views/@default/clusters/cluster/nodes.html

@@ -73,7 +73,7 @@
 		<th class="two op">操作</th>
 	</tr>
 	</thead>
-	<tr v-for="node in nodes">
+	<tr v-for="(node, nodeIndex) in nodes">
         <td class="node-name-td"><a :href="'/clusters/cluster/node?clusterId=' + clusterId + '&nodeId=' + node.id">{{node.name}}<sup v-if="node.level > 1"><span class="blue"> &nbsp;L{{node.level}}</span></sup></a>
 
             <a :href="'/clusters/cluster/node/update?clusterId=' + clusterId + '&nodeId=' + node.id" title="设置"><i class="icon setting grey"></i></a>
@@ -91,7 +91,7 @@
 		<td>
 			<span v-if="node.ipAddresses.length == 0" class="disabled">-</span>
 			<div v-else class="address-box">
-				<div v-for="addr in node.ipAddresses" style="margin-bottom:0.3em">
+				<div v-for="(addr, index) in node.ipAddresses" v-if="node.ipAddresses.length < mostIPVisible || node.ipAddressesVisible || index < mostIPVisible" style="margin-bottom:0.3em">
 					<div class="ui label tiny basic">{{addr.ip}}
 						<span class="small" v-if="addr.name.length > 0">（{{addr.name}}<span v-if="!addr.canAccess">，不可访问</span>）</span>
 						<span class="small" v-if="addr.name.length == 0 && !addr.canAccess">（不可访问）</span>
@@ -102,6 +102,10 @@
                         </div>
 					</div>
 				</div>
+                <a href="" @click.prevent="showMoreIP(nodeIndex, node)" v-show="node.ipAddresses.length > mostIPVisible">
+                    <span class="small grey" v-if="!node.ipAddressesVisible">更多IP...</span>
+                    <span class="small grey" v-if="node.ipAddressesVisible">...收起</span>
+                </a>
 			</div>
 		</td>
 		<td class="routes-box" :class="{'show-link': node.dnsRouteNames.length == 0 &&  hasClusterDNS}">