{$layout}
{$template "/left_menu"}

{$var "header"}
<script src="/servers/certs/datajs" type="text/javascript"></script>
<script src="/js/sortable.min.js" type="text/javascript"></script>
{$end}

<div class="right-box">
    {$if eq .canSpecifyPort false}
    <p class="ui message warning">根据管理员设定，你不能修改此服务端口信息。</p>
    {$end}
	<form method="post" class="ui form" data-tea-action="$" data-tea-success="success">
		<input type="hidden" name="serverId" :value="serverId"/>
		<input type="hidden" name="serverType" :value="serverType"/>
		<table class="ui table selectable definition">
			<tr>
				<td class="title">绑定端口 *</td>
				<td>
                    <div v-show="canSpecifyPort">
                        <network-addresses-box :v-server-type="serverType" :v-addresses="tlsConfig.listen" :v-protocol="'tls'" ></network-addresses-box>
                    </div>
                    <div v-show="!canSpecifyPort" v-if="tlsConfig.listen != null">
                        <span v-for="listen in tlsConfig.listen" class="ui basic small label">tls://*:{{listen.portRange}}</span>
                    </div>
				</td>
			</tr>
		</table>

		<!-- SSL配置 -->
		<ssl-config-box :v-ssl-policy="tlsConfig.sslPolicy" :v-protocol="'tls'" v-show="tlsConfig.isOn"></ssl-config-box>

		<submit-btn></submit-btn>
	</form>
</div>