{$layout}
{$template "menu"}

<div class="right-box">
    <form class="ui form" method="get" action="/finance/accounts">
        <div class="ui fields inline">
            <div class="ui field">
                <input type="text" name="keyword" v-model="keyword" :placeholder="t('finance_accounts_index@用户名全名')"/>
            </div>
            <div class="ui field">
                <button class="ui button" type="submit">{{t('finance_accounts_index@搜索')}}</button>
                &nbsp;
                <a href="/finance/accounts" v-if="keyword.length > 0">[{{t('finance_accounts_index@清除条件')}}]</a>
            </div>
        </div>
    </form>
    <div class="margin"></div>
    <b-empty v-if="accounts.length == 0">{{t('finance_accounts_index@暂时还没有用户账户')}}</b-empty>

    <b-table
        v-if="accounts.length > 0"
        :columns="[
            {
                title: t('finance_accounts_index@用户'),
                key: 'user',
                scopedSlots: { customRender: 'userSlot' }
            },
            {
                title: t('finance_accounts_index@余额'),
                dataIndex: 'total',
                key: 'total',
                scopedSlots: { customRender: 'totalSlot' },
                width: '15%'
            },
            {
                title: t('finance_accounts_index@操作'),
                key: 'action',
                scopedSlots: { customRender: 'actionSlot' },
                width: '10%'
            }
        ]"
        :data-source="accounts"
        :row-key="'id'"
        :pagination="false"
        size="middle"
    >
        <template slot="userSlot" slot-scope="{ text, record }">
             <a :href="'/finance/accounts/account?accountId=' + record.id"><user-link :v-user="record.user" :v-keyword="keyword"></user-link></a>
        </template>

        <template slot="totalSlot" slot-scope="{ text, record }">
            {{record.total}}{{t('finance_accounts_index@元')}}
        </template>

         <template slot="actionSlot" slot-scope="{ text, record }">
             <a-button type="link" :href="'/finance/accounts/account?accountId=' + record.id">{{t('finance_accounts_index@详情')}}</a-button>
         </template>
    </b-table>

    <div class="page" v-html="filterPageContent(page)"></div>
</div>