{$layout}

{$template "/left_menu"}

<div class="http-config-container">
    {$if eq .canSpecifyPort false}
    <div class="audit-message warning">
        <i class="icon warning circle"></i>
        根据系统管理员设定，你不能修改此网站的端口信息。
    </div>
    {$end}
    
    <form method="post" class="ui form http-config-form" data-tea-action="$" data-tea-success="success">
        <csrf-token></csrf-token>
        <input type="hidden" name="serverId" :value="serverId"/>
        <input type="hidden" name="serverType" :value="serverType"/>
        
        <div class="config-section">
            <div class="section-title">
                <i class="icon plug"></i>
                TCP配置
            </div>
            
            <div class="config-item">
                <div class="item-label">
                    <i class="icon exchange"></i>
                    绑定端口 *
                </div>
                <div class="item-content">
                    <div v-show="canSpecifyPort">
                        <network-addresses-box :v-server-type="serverType" :v-addresses="tcpConfig.listen" :v-protocol="'tcp'"></network-addresses-box>
                    </div>
                    <div v-show="!canSpecifyPort" v-if="tcpConfig.listen != null" class="port-labels">
                        <span v-for="listen in tcpConfig.listen" class="ui basic label">tcp://*:{{listen.portRange}}</span>
                    </div>
                </div>
            </div>
        </div>
        
        <submit-btn v-if="canSpecifyPort"></submit-btn>
    </form>
</div>