{$layout}

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

<second-menu>
    <a class="item" :href="'/httpdns/clusters/cluster?clusterId=' + cluster.id">{{cluster.name}}</a>
    <span class="item disabled" style="padding-left: 0; padding-right: 0">&raquo;</span>
    <div class="item"><strong>集群设置</strong></div>
</second-menu>

{$template "/left_menu_with_menu"}

<div class="right-box with-menu">
    <form method="post" class="ui form" data-tea-action="$" data-tea-success="success">
        <csrf-token></csrf-token>
        <input type="hidden" name="clusterId" :value="cluster.id" />

        <table class="ui table definition selectable" v-show="activeSection == 'basic'">
            <tr>
                <td class="title">集群名称 *</td>
                <td>
                    <input type="text" name="name" maxlength="50" ref="focus" v-model="cluster.name" />
                    <p class="comment">用于在系统内部标识该 HTTPDNS 集群。</p>
                </td>
            </tr>
            <tr>
                <td>服务域名 *</td>
                <td>
                    <input type="text" name="gatewayDomain" maxlength="255" v-model="settings.gatewayDomain"
                        placeholder="例如 gw-hz.httpdns.example.com" />
                    <p class="comment">当前集群对外提供 HTTPDNS 服务的接入域名。</p>
                </td>
            </tr>
            <tr>
                <td>节点安装根目录</td>
                <td>
                    <input type="text" name="installDir" maxlength="100" v-model="settings.installDir" />
                    <p class="comment">边缘节点安装 HTTPDNS 服务的默认目录，通常保持默认即可。</p>
                </td>
            </tr>
            <tr>
                <td>默认解析 TTL</td>
                <td>
                    <div class="ui input right labeled">
                        <input type="text" name="cacheTtl" maxlength="5" v-model="settings.cacheTtl" style="width: 6em" />
                        <span class="ui label">秒</span>
                    </div>
                    <p class="comment">SDK 通过 HTTPDNS 解析域名时返回的默认 TTL。</p>
                </td>
            </tr>
            <tr>
                <td>降级超时容忍度</td>
                <td>
                    <div class="ui input right labeled">
                        <input type="text" name="fallbackTimeout" maxlength="5" v-model="settings.fallbackTimeout" style="width: 6em" />
                        <span class="ui label">毫秒</span>
                    </div>
                    <p class="comment">节点回源查询上游 DNS 时的最大等待时间。</p>
                </td>
            </tr>
            <tr>
                <td>启用当前集群</td>
                <td>
                    <div class="ui checkbox">
                        <input type="checkbox" name="isOn" value="1" v-model="settings.isOn" @change="syncDefaultCluster" />
                        <label></label>
                    </div>
                    <p class="comment">取消启用后，该集群不会参与 HTTPDNS 服务。</p>
                </td>
            </tr>
            <tr>
                <td>默认集群</td>
                <td>
                    <div class="ui checkbox">
                        <input type="checkbox" value="1" v-model="settings.defaultClusterEnabled" @change="syncDefaultClusterSelection" />
                        <label>设为默认集群</label>
                    </div>
                    <div class="ui form" style="margin-top: .8em;" v-if="settings.defaultClusterEnabled">
                        <div class="grouped fields" style="margin:0;">
                            <div class="field">
                                <div class="ui radio checkbox">
                                    <input type="radio" v-model="settings.defaultClusterRole" value="primary" @change="syncDefaultClusterSelection" />
                                    <label>主集群</label>
                                </div>
                            </div>
                            <div class="field">
                                <div class="ui radio checkbox">
                                    <input type="radio" v-model="settings.defaultClusterRole" value="backup" @change="syncDefaultClusterSelection" />
                                    <label>备用集群</label>
                                </div>
                            </div>
                        </div>
                    </div>
                    <input type="hidden" name="isDefaultCluster" value="1" v-if="settings.defaultClusterEnabled && settings.defaultClusterRole == 'primary'" />
                    <input type="hidden" name="isDefaultBackupCluster" value="1" v-if="settings.defaultClusterEnabled && settings.defaultClusterRole == 'backup'" />
                    <p class="comment">同一时刻最多 1 个默认集群角色，新设置会自动取消旧设置。</p>
                </td>
            </tr>
        </table>

        <table class="ui table selectable definition" v-show="activeSection == 'tls'">
            <tr>
                <td class="title">绑定端口 *</td>
                <td>
                    <network-addresses-box :v-url="'/httpdns/addPortPopup'" :v-addresses="tlsConfig.listen" :v-protocol="'tls'" :v-support-range="true"></network-addresses-box>
                </td>
            </tr>
        </table>

        <ssl-config-box v-show="activeSection == 'tls'" :v-ssl-policy="tlsConfig.sslPolicy" :v-protocol="'tls'"></ssl-config-box>

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