{$layout}
{$template "menu"}

<div v-if="!configIsValid">
    <div class="margin"></div>
    <p class="ui message error">管理员尚未完成系统配置，暂时无法添加域名，请联系客服。</p>
</div>

<div class="server-names-container">
    <div class="config-section">
        <div class="section-title">
            <i class="icon globe"></i>
            添加域名
        </div>
        <div class="config-item">
            <form class="ui form item-content" data-tea-action="$" data-tea-success="success" v-show="configIsValid">
                <csrf-token></csrf-token>
                <input type="hidden" name="addingType" :value="addingType" />
                <div class="config-item">
                    <div class="item-label">域名 *</div>
                    <div class="item-content">
                        <!-- 单个添加 -->
                        <div v-show="addingType == 'one'">
                            <input type="text" name="name" maxlength="255" ref="nameInput" placeholder="单个域名" />
                            <p class="comment">
                                <a href="" @click.prevent="setAddingType('batch')"
                                    class="more-options-toggle">[批量添加]</a>
                            </p>
                        </div>

                        <!-- 批量添加 -->
                        <div v-show="addingType == 'batch'">
                            <textarea rows="10" name="names" placeholder="每行一个域名" ref="namesInput"></textarea>
                            <p class="comment">
                                <a href="" @click.prevent="setAddingType('one')" class="more-options-toggle">[单个添加]</a>
                            </p>
                        </div>
                    </div>
                </div>

                <div class="config-item" v-if="hasGroups">
                    <div class="item-label">所属分组</div>
                    <div class="item-content">
                        <ns-domain-group-selector ref="groupSelector"></ns-domain-group-selector>
                    </div>
                </div>
                <submit-btn v-if="quotaCanCreate"></submit-btn>
                <p class="ui message error" v-if="!quotaCanCreate">已添加域名个数已超出最大限额（{{quotaMaxDomains}}个域名），请升级套餐后重试。</p>
            </form>
        </div>

    </div>
</div>