{$layout "layout_popup"}

<!-- <h3>添加账号</h3> -->
<form class="ui form" data-tea-action="$" data-tea-success="success">
    <csrf-token></csrf-token>

    <table class="ui table definition selectable">
        <tr>
            <td>账号名称 *</td>
            <td>
                <input type="text" name="name" maxlength="50" ref="focus" tabindex="1"/>
                <p class="comment">为当前账号起一个容易识别的名称。</p>
            </td>
        </tr>
        <tr>
            <td class="title">证书服务商 *</td>
            <td>
                <b-select
                    name="providerCode"
                    v-model="providerCode"
                    @change="changeProvider"
                    tabindex="2"
                    auto-width
                    :options="[
                        {label: '[选择服务商]', value: ''},
                        ...providers.map(provider => ({
                            label: provider.name,
                            value: provider.code,
                        }))
                    ]"
                ></b-select>

                <!-- <select class="ui dropdown auto-width" name="providerCode" v-model="providerCode" @change="changeProvider" tabindex="2">
                    <option value="">[选择服务商]</option>
                    <option v-for="provider in providers" :value="provider.code">{{provider.name}}</option>
                </select> -->
                <p class="comment" v-if="selectedProvider != null" v-html="selectedProvider.description"></p>
            </td>
        </tr>
        <tbody v-show="selectedProvider != null && selectedProvider.requireEAB">
            <tr>
                <td>EAB Kid *</td>
                <td>
                    <input type="text" name="eabKid" maxlength="100" tabindex="3"/>
                    <p class="comment" v-if="selectedProvider != null" v-html="selectedProvider.eabDescription"></p>
                </td>
            </tr>
            <tr>
                <td>EAB HMAC Key *</td>
                <td>
                    <input type="text" name="eabKey" maxlength="300" tabindex="4"/>
                </td>
            </tr>
        </tbody>
    </table>
    <submit-btn></submit-btn>
</form>