{extend name="public/base"/}
{block name="css"}
<style>
    .header {background-color: var(--blue);color: #ffffff;padding: 15px;}
    .header .title {text-align: center;}
    .header .title .money{font-size: 40px;padding-bottom: 5px;}
    .header .sub-title{padding-top: 30px;display: flex;justify-content: space-between;}
</style>
{/block}
{block name="body"}
<van-nav-bar
        class="nav-theme"
        :fixed="true"
        :placeholder="true"
        left-text="返回"
        left-arrow
        @click-left="onBack"
>
    <template #title>
        <span class="text-white">收益明细</span>
    </template>
</van-nav-bar>

<div class="header">
    <div class="title">
        <div class="money">{{broker.income}}</div>
        <div>
            当前收益
        </div>
    </div>
    <div class="sub-title">
        <div>上月获得：<span>{{month_income}}</span> 元</div>
        <div>累计已获：<span>{{broker.income_total}}</span> 元</div>
    </div>
</div>

{include file="public/list_load" list="<income-list :list='list'></income-list>" /}

{/block}
{block name="script"}
<script>
    function v_setup() {
        let base = list_load('my/listIncome');

        base.onBack = () => {
            location.href = "{:url('/mobile/my/index')}";
        };

        base.broker = {$broker};
        base.month_income = {$month_income};

        return base;
    }
</script>
{/block}
{block name="vue"}
<script src="__COMPONENTS__/incomeList.js"></script>
{/block}