<template>
    <BasePage>
        <!-- <div class="asset asset-1">
            <div class="t">
                <a @click.stop="$navigate('/CashoutRecord?Area=Balance')" class="a">
                    <img src="/img/asset-i1.png" />
                    <i>提现记录</i>
                    <van-icon name="arrow"></van-icon>
                </a>
                <div class="c">
                    <div class="tit">
                        <span>当前{{ $route.meta.title }}<van-icon name="question-o"
                                @click.stop="onShowTerm"></van-icon></span>
                    </div>
                    <div class="number">
                        <b>{{ data.total?.totalsum?.toFixed(2) }}</b>
                        <div class="r box box-tb box-align-center">
                            <van-button @click="$navigate('Cashout')" color="#ef3126" round size="small">提
                                现</van-button>
                            <van-button style="border: solid 1px #ef3126;color: #ef3126;margin-top:2.13vw ;"
                                @click="$navigate('Transfer')" color="#fff" round size="small">互转</van-button>
                        </div>
                    </div>
                    <div class="total" style="margin: 1vw 0 0;">
                        <div>
                            累计收入
                            <p>{{ data.total?.positivesum?.toFixed(2) }}</p>
                        </div>
                        <div>
                            累计支出
                            <p>{{ Math.abs((data.total?.negativesum))?.toFixed(2) }}</p>
                        </div>
                    </div>
                </div>
            </div>


            <div class="times">
                <div class="_m">
                    <div class="l" @click="showDate = true">
                        <span>
                            {{ date[0] }}年
                            <p>{{ (parseInt(date[1]) < 10) ? `0${parseInt(date[1])}` : parseInt(date[1]) }}月</p>
                        </span>
                        <img src="/img/i-date.png">
                    </div>
                    <div class="right">
                        <p>
                            收入<br />
                            {{ data.total?.positivesumcurrent?.toFixed(2) }}
                        </p>
                        <p>
                            支出<br />
                            {{ Math.abs((data.total?.negativesumcurrent))?.toFixed(2) }}
                        </p>
                    </div>
                </div>
            </div>

            <van-tabs v-model:active="searchParams.RecordSource" class="balance-tabs" type="card"
                background="transparent" color="#ff5e5e" title-inactive-color="#313131" title-active-color="#fff"
                @click="changeTabs">
                <van-tab title="全部" name=""></van-tab>
                <van-tab title="参团补贴" name="fail"></van-tab>
                <van-tab title="分享补贴" name="direct"></van-tab>
                <van-tab title="管理补贴" name="subsidy"></van-tab>
                <van-tab title="销售分成" name="sale"></van-tab>
            </van-tabs>

            <BaseList ref="baselist" url="/v1/client/DUsermoneysClient" class="_m_" :params="searchParams">
                <template #default="{ item }">
                    <div class="list" :key="item.TradeCode">
                        <table width="100%" cellpadding="0" cellspacing="0">
                            <tbody>
                                <tr>
                                    <td>
                                        <div style="margin-bottom: 2vw;">{{ $route.meta.title }}：{{
                                            item.balance?.toFixed(2) }}</div>
                                    </td>
                                    <td style="text-align: right;">
                                        <van-tag :type="item.nums > 0 ? 'primary' : 'danger'"
                                            style="margin-bottom: 2vw;">
                                            {{ item.nums > 0 ? "增加：+" : "减少："
                                            }}{{ (item.nums).toFixed(2) }}
                                        </van-tag>
                                    </td>
                                </tr>
                                <tr v-if="item.remark">
                                    <td colspan="2">
                                        <div style="line-height: 5vw;word-break: break-all; color: #999">
                                            备注：{{ item.remark }}
                                        </div>
                                    </td>
                                </tr>
                                <tr v-if="item.ordernum">
                                    <td colspan="2">
                                        <div
                                            style="line-height: 5vw;word-break: break-all;color: #999;display: inline;">
                                            订单：{{ item.ordernum }}
                                        </div>
                                        <u style="color: #535353; margin-left: 1.667vw"
                                            @click="$copyText(item.ordernum); $showSuccessToast('复制成功')">复制</u>
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="2">
                                        <div
                                            style="line-height: 5vw;word-break: break-all;color: #999;display: inline;">
                                            时间：{{ $formatGMT(item.addtime, 'yyyy-MM-dd HH:mm:ss') }}
                                        </div>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </template>
</BaseList>
<div class="_m" style="padding-top: 0;">
    <div class="b_l_w">
        <div v-for="item in list" :key="item.TradeCode" class="list">
            <table width="100%" cellpadding="0" cellspacing="0">
                <tbody>
                    <tr>
                        <td>
                            <div style="margin-bottom: 2vw;">{{ $route.meta.title }}：{{
                                item.CurValue?.toFixed(2) }}</div>
                        </td>
                        <td style="text-align: right;">
                            <van-tag :type="item.OpeType == '1' ? 'primary' : 'danger'" style="margin-bottom: 2vw;">
                                {{ item.OpeType == "1" ? "增加：+" : "减少：-"
                                }}{{ (item.RecordValue).toFixed(2) }}
                            </van-tag>
                        </td>
                    </tr>
                    <tr v-if="item.Remark">
                        <td colspan="2">
                            <div style="line-height: 5vw;word-break: break-all; color: #999">
                                备注：{{ item.Remark }}
                            </div>
                        </td>
                    </tr>
                    <tr v-if="item.TradeCode">
                        <td colspan="2">
                            <div style="line-height: 5vw;word-break: break-all;color: #999;display: inline;">
                                订单：{{ item.TradeCode }}
                            </div>
                            <u style="color: #535353; margin-left: 1.667vw"
                                @click="$copyText(item.TradeCode); $showSuccessToast('复制成功')">复制</u>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2">
                            <div style="line-height: 5vw;word-break: break-all;color: #999;display: inline;">
                                时间：{{ $date.dateformat(item.CTime, true) }}
                            </div>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>
</div> -->
        <div class="balance">
            <div class="top">
                <div class="line">
                    <b class="tit">
                        当前余额 <van-icon name="question-o" @click.stop="showTerm = true"></van-icon>
                    </b>

                    <div class="co_box" @click="$navigate('CashoutRecord')">
                        <img src="/img/co_icon.png" alt="">
                        <span>提现记录</span>
                        <van-icon name="arrow"></van-icon>
                    </div>
                </div>

                <div class="line">
                    <b class="num">
                        {{ data.total.totalsum?.toFixed(2) }}
                    </b>

                    <button class="r" @click="$navigate('Cashout')">
                        提现
                    </button>
                </div>

                <div class="line">
                    <div class="pn">
                        累计收入:
                        <p>{{ data.total?.positivesum?.toFixed(2) }}</p>
                    </div>
                    <div class="r pn">
                        累计支出:
                        <p>{{ Math.abs((data.total?.negativesum))?.toFixed(2) }}</p>
                    </div>
                </div>
            </div>

            <div class="botom">
                <div class="date_box">
                    <div class="date" @click="showDate = true">
                        {{ date[0] }}-
                        <p>{{ (parseInt(date[1]) < 10) ? `0${parseInt(date[1])}` : parseInt(date[1]) }}</p>
                                <img src="/img/down.png" alt="">
                    </div>

                    <div class="count">
                        <div>
                            <span>收入</span>
                            <p> {{ data.total?.positivesumcurrent?.toFixed(2) }}</p>
                        </div>

                        <div>
                            <span>支出</span>
                            <p> {{ Math.abs((data.total?.negativesumcurrent))?.toFixed(2) }}</p>
                        </div>
                    </div>
                </div>

                <van-tabs v-model:active="active" type="card" class="tabs" color="#374c6d" @change="changeTabs">
                    <van-tab title="全部"></van-tab>
                    <van-tab title="礼包" name="31"></van-tab>
                    <van-tab title="商家" name="34"></van-tab>
                    <van-tab title="商城" name="33"></van-tab>
                    <van-tab title="分成" name="32"></van-tab>
                </van-tabs>

                <BaseList ref="baselist" url="/v1/client/DUsermoneysClient" class="_m_" :params="searchParams">
                    <template #default="{ item }">
                        <div class="list" :key="item.TradeCode">
                            <table width="100%" cellpadding="0" cellspacing="0">
                                <tbody>
                                    <tr>
                                        <td>
                                            <div style="margin-bottom: 2vw;">{{ $route.meta.title }}：{{
                                                item.balance?.toFixed(2) }}</div>
                                        </td>
                                        <td style="text-align: right;">
                                            <van-tag :class="item.nums > 0 ? 'in' : 'out'" style="margin-bottom: 2vw;">
                                                {{ item.nums > 0 ? "增加：+" : "减少："
                                                }}{{ (item.nums).toFixed(2) }}
                                            </van-tag>
                                        </td>
                                    </tr>
                                    <tr v-if="item.remark">
                                        <td colspan="2">
                                            <div style="line-height: 5vw;word-break: break-all; color: #999">
                                                备注：{{ item.remark }}
                                            </div>
                                        </td>
                                    </tr>
                                    <tr v-if="item.ordernum">
                                        <td colspan="2">
                                            <div
                                                style="line-height: 5vw;word-break: break-all;color: #999;display: inline;">
                                                订单：{{ item.ordernum }}
                                            </div>
                                            <u style="color: #535353; margin-left: 1.667vw"
                                                @click="$copyText(item.ordernum); $showSuccessToast('复制成功')">复制</u>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td colspan="2">
                                            <div
                                                style="line-height: 5vw;word-break: break-all;color: #999;display: inline;">
                                                时间：{{ $formatGMT(item.addtime, 'yyyy-MM-dd HH:mm:ss') }}
                                            </div>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </template>
                </BaseList>
            </div>
        </div>

        <van-popup v-model:show="showDate" position="bottom">
            <van-date-picker v-model="currentDate" title="选择年月" :columns-type="['year', 'month']" @confirm="onconfirm"
                @cancel="showDate = false" />
        </van-popup>
        <van-action-sheet v-model:show="showTerm" safe-area-inset-bottom :title="`${this.$route.meta.title}说明`"
            closeable style="min-height: 50%; padding: 0px 10px 10px 10px">
            <div class="w100 html" v-html="$datadic.getContent('code_yesm')" />
        </van-action-sheet>

    </BasePage>
</template>
<script>
export default {
    name: 'Balance',
    mounted() {
        this.init();
    },
    data() {
        return {
            active: 0,
            data: {
                total: {
                    Balance: 8888.88,
                    TotalBalance: 20000.00,
                    MonthBalance: 5200.00,
                    MonthReduceBalance: 1311.12,
                },
                Term: '余额说明：余额可用于提现、购物等。',
            },
            date: [`${new Date().getFullYear()}`, `${new Date().getMonth() + 1}`],
            currentDate: [`${new Date().getFullYear()}`, `${new Date().getMonth() + 1}`],
            show: false,
            showDate: false,
            searchParams: {
                type: '',
                year: new Date().getFullYear(),
                month: new Date().getMonth() + 1,
            },
            loading: false,
            showTerm: false,
            list: [],
        }
    },
    methods: {
        init() {
            this.$get('/v1/client/DUsermoneysClient/statistics', this.searchParams).then(data => {
                this.data.total = data.data;
            }).catch(err => {
                this.$showFailToast(err.message || '加载失败');
            })

            this.$get('/v1/client/DUsermoneysClient/select').then(res => {
                // console.log(res.data);

            })
        },
        onconfirm(value) {
            this.date = this.currentDate;
            this.showDate = false;
            this.searchParams.year = Number.parseInt(this.currentDate[0]);
            this.searchParams.month = Number.parseInt(this.currentDate[1]);
            this.init();
            this.$refs.baselist.refresh()
        },
        changeTabs(e) {
            this.searchParams.type = e || '';
            // this.$refs.baselist.refresh();
        },
        onShowTerm() {
            this.showTerm = true;
        }
    }
}
</script>
