云服务器配置 - 已选配置

<div class='wrap-rule-name' style='width: 100%;'>
    <span>已选配置：</span>
    <a class='sty-zkss' @click='toggleCollapse'>展开{{ isCollapsed ? '↓' : '↑' }}</a>
</div>
<div class='wrap-rule-body clearfix' :class='{ 'collapsed': isCollapsed }'>
    <div class='row' style='margin-top:12px;font-size:12px;'>
        <div class='col-sm-3' v-show='!isCollapsed'>
            {_('可用区')}：<span v-text='area.name'></span>/<span v-text='server_line.name'></span>/<span v-text='cluster.name'></span><br>
            {_('规格')}：<span v-text='server.title'></span><br>
            <template v-if='form_data.system_name'>
                {_('操作系统')}：<span v-text='form_data.system_name'></span><br>
            </template>
            <template v-if='server.kvm_type != 'pterodactyl''>
                {_('登录凭证')}：<span v-text='ssh_mod_list[form_data.ssh_mod]'></span><br>
            </template>
        </div>
        <div class='col-sm-3' v-show='!isCollapsed'>
            {_('CPU')}：<span v-text='form_data.cpus'></span>{_('核')}<br>
            {_('内存')}：<span v-text='mem_format(form_data.mem,2,'MB')'></span><br>
            {_('存储')}：<span v-text='mem_format(form_data.disk,2,'GB')'></span>
            <span v-if='form_data.disks.length > 0' v-for='(m,i) in form_data.disks'>
                <span class='text-muted'> + </span>
                <span v-text='mem_format(m,2,'GB')'></span>
            </span>
        </div>
        <div class='col-sm-3' v-show='!isCollapsed && server.kvm_type != 'pterodactyl''>
            {_('IP数量')}：<span v-text='form_data.ip_number'></span>个<br>
            <span v-show='form_data.net_mod == 1'>{_('固定带宽')}：<span v-text='form_data.net'></span>Mbps</span>
            <span v-show='form_data.net_mod == 3'>{_('流量包')}：<span v-text='form_data.flows'></span>GB</span>
            <span v-show='form_data.net_mod == 2'>{_('按实时流量计费')}</span><br>
            <span v-show='form_data.net_mod == 2 || form_data.net_mod == 3'>{_('带宽峰值')}：<span v-text='form_data.flow'></span>Mbps<br></span>
            <span v-show='form_data.def > 0'>{_('防御峰值')}：<span v-text='form_data.def'></span>GB<br></span>
        </div>
        <div class='col-sm-3' v-show='!isCollapsed'>
            {_('自动续费')}：<span v-text='renew_list[form_data.auto_renew]'></span><br>
            {_('购买量')}：<span v-text='form_data.buy_num'></span>{_e()}{_('台')} * <span v-text='price_cycle[form_data.payment_mod].name'></span><br>
            {_('主机别名')}：<span v-text='form_data.server_name'></span><br>
        </div>
    </div>
</div>
<script>
    new Vue({
        el: '.wrap-rule-name',
        data: {
            isCollapsed: true,
        },
        methods: {
            toggleCollapse() {
                this.isCollapsed = !this.isCollapsed;
            },
        },
    });
</script>