{$layout}
{$template "list_menu"}

{$var "header"}
<link rel="stylesheet" href="./update.css">
{$end}

<div class="config-section ip-list-form-section">
    <div class="section-title">
        <i class="pi pi-pencil"></i>
        <span style="margin: 0 0.5rem;">{{t('servers_iplists_update@编辑IP名单')}}</span>
    </div>
    
    <div class="config-item">
        <form class="ui form" data-tea-action="$" data-tea-success="success">
            <input type="hidden" name="listId" :value="list.id"/>
            <csrf-token></csrf-token>
            
            <div class="config-item">
                <div class="item-label">{{t('servers_iplists_update@名称')}} *</div>
                <div class="item-content">
                    <input type="text" name="name" maxlength="100" ref="focus" v-model="list.name" :placeholder="t('servers_iplists_update@请输入IP名单名称')"/>
                </div>
            </div>
            
            <div class="config-item">
                <div class="item-label">{{t('servers_iplists_update@代号')}}</div>
                <div class="item-content">
                    <input type="text" name="code" maxlength="100" v-model="list.code" :placeholder="t('servers_iplists_update@可选例如MyIpList')"/>
                    <p class="comment">{{t('servers_iplists_update@可选参数组合')}}</p>
                </div>
            </div>
            
            <div class="config-item">
                <div class="item-label">{{t('servers_iplists_update@类型')}}</div>
                <div class="item-content">
                    <span class="ui label tiny" :class="{
                        'black': list.type == 'black',
                        'white': list.type == 'white',
                        'gray': list.type == 'grey'
                    }">{{list.typeName}}</span>
                </div>
            </div>
            
            <div class="config-item">
                <div class="item-label">{{t('servers_iplists_update@备注')}}</div>
                <div class="item-content">
                    <textarea name="description" rows="3" maxlength="200" v-model="list.description" :placeholder="t('servers_iplists_update@可选填写备注')"></textarea>
                </div>
            </div>
            
            <submit-btn></submit-btn>
        </form>
    </div>
</div>