{$layout}
{$template "menu"}

<div class="right-box">
    <div class="config-section">
        <div class="section-title">{{t('finance_accounts_update@账户操作')}}</div>
        <form class="ui form" data-tea-action="$" data-tea-success="success">
            <csrf-token></csrf-token>
            <div class="config-item">
                <div class="item-label">{{t('finance_accounts_update@选择用户')}} *</div>
                <div class="item-content">
                    <finance-user-selector @change="changeUser"></finance-user-selector>
                    <p class="comment">
                        <span v-if="userAccount != null">{{t('finance_accounts_index@余额')}} {{userAccount.total}}{{t('finance_accounts_index@元')}}</span>
                    </p>
                </div>
            </div>
            <div class="config-item">
                <div class="item-label">{{t('finance_accounts_update@操作类型')}} *</div>
                <div class="item-content">
                    <b-select
                        name="eventType"
                        v-model="eventType"
                        auto-width
                        :options="[
                            ...eventTypes.map(eventType => ({
                                label: eventType.name,
                                value: eventType.code,
                            }))
                        ]"
                    ></b-select>
                    <p class="comment">{{event.description}}</p>
                </div>
            </div>
            <div class="config-item">
                <div class="item-label">{{t('finance_accounts_update@操作金额')}} *</div>
                <div class="item-content">
                   <div class="ui input left right labeled">
                       <span class="ui label green" v-if="event != null && event.isPositive">+</span>
                       <span class="ui label red" v-if="event != null && !event.isPositive">-</span>
                       <input type="text" name="delta" value="" style="width: 8em" maxlength="8"/>
                       <span class="ui label">{{t('finance_accounts_index@元')}}</span>
                   </div>
                </div>
            </div>
            <div class="config-item">
                <div class="item-label">{{t('finance_accounts_update@描述')}}</div>
                <div class="item-content">
                    <textarea rows="3" name="description" class="ui input"></textarea>
                </div>
            </div>
             <div class="config-item">
                <div class="item-label">{{t('finance_accounts_update@操作')}}</div>
                <div class="item-content">
                    <submit-btn></submit-btn>
                </div>
            </div>
        </form>
    </div>
</div>