hemall.terabimsoft.com.cn/plugins/shop-statistics/views/backend/balance.blade.php

<script src="{{static_url('js/echarts.js')}}" type="text/javascript"></script>
@extends('layouts.base')
@section('title', '余额数据统计')
<script src="{{resource_get('plugins/shop-statistics/assets/js/echarts.min.js')}}"></script>
@section('content')
<link rel="stylesheet" type="text/css" href="{{static_url('yunshop/goods/vue-goods1.css')}}" />
<link rel="stylesheet" href="{{resource_get('plugins/shop-statistics/assets/css/common.css')}}">
<link rel="stylesheet" href="{{resource_get('plugins/shop-statistics/assets/css/statistics.css')}}">
<div class="all">
    <div id="app">
        <panel>
            <statistics-card-title>数据情况</statistics-card-title>
            <ul class="statistics-overall" type="flex" :gutter="10" style="flex-wrap:wrap;row-gap:10px;">
                <li>
                    <statistics-card colorful count-color="#fba04b" background="{!! resource_get('plugins/shop-statistics/assets/images/statistics_card_7.png') !!}" :border="false" title="累计可使用余额" tip="累计剩余余额总数" :count="overall.balanceUseCount">
                    </statistics-card>
                </li>
                <li>
                    <statistics-card colorful count-color="#4652a9" background="{!! resource_get('plugins/shop-statistics/assets/images/statistics_card_2.png') !!}" :border="false" title="累计已使用余额" tip="累计已使用余额总数" :count="overall.balanceUsedCount">
                    </statistics-card>
                </li>
                <li>
                    <statistics-card colorful count-color="#36c3a7" background="{!! resource_get('plugins/shop-statistics/assets/images/statistics_card_5.png') !!}" :border="false" title="累计已提现余额" tip="累计已提现余额总数" :count="overall.balanceWithdrawCount">
                    </statistics-card>
                </li>
                <li>
                    <statistics-card colorful count-color="#da9a01" background="{!! resource_get('plugins/shop-statistics/assets/images/statistics_card_6.png') !!}" :border="false" title="累计收入余额" tip="累计收入提现到余额总数" :count="overall.balanceIncomeCount">
                    </statistics-card>
                </li>
                <li>
                    <statistics-card colorful count-color="#43bae0" background="{!! resource_get('plugins/shop-statistics/assets/images/statistics_card_3.png') !!}" :border="false" title="累计后台充值" tip="累计后台充值余额总数" :count="overall.balanceRechargeCount">
                    </statistics-card>
                </li>
                <li>
                    <statistics-card colorful count-color="#28b183" background="{!! resource_get('plugins/shop-statistics/assets/images/statistics_card_4.png') !!}" :border="false" title="累计会员充值" tip="累计会员充值余额总数" :count="overall.balanceMemberRechargeCount">
                    </statistics-card>
                </li>
            </ul>
        </panel>
        <panel>
            <el-row type="flex" :gutter="20" style="flex-wrap:wrap;row-gap: 10;">
                <el-col :span="4">
                    <statistics-card :title="dataItem.title" :tip="dataItem.tip" :count="dataItem.count" v-for="dataItem in balanceStatisticsData" :key="dataItem.key" style="margin-bottom:15px;" :decimals="dataItem.decimals">
                    </statistics-card>
                </el-col>
                <el-col :span="20">
                    <panel-form inline style="text-align: right;">
                        <el-form-item>
                            <el-date-picker v-model="balanceStatisticsTime" type="date" placeholder="选择日期" @change="getBalanceStatisticsData">
                            </el-date-picker>
                        </el-form-item>
                    </panel-form>
                    <div ref="balanceChart" style="margin-top:20px;width:100%;height:700px;"></div>
                </el-col>
            </el-row>
        </panel>
        <panel>
            <statistics-card-title>
                会员余额使用情况排名
                <panel-form slot="right" inline>
                    <el-form-item>
                        <el-input placeholder="会员id/昵称/手机号" v-model="balanceUseDataSearchMember"></el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" plain @click="searchMemberBalanceUseData" :loading="balanceUseDataSearchMemberLoading">搜索</el-button>
                    </el-form-item>
                </panel-form>
            </statistics-card-title>
            <el-table :data="balanceUseData">
                <el-table-column label="排名" width="100">
                    <template slot-scope="scope">
                        <div class="member-rank" :data-rank="scope.row.rank" plain mini>
                            [[ scope.row.rank ]]
                        </div>
                    </template>
                </el-table-column>
                <el-table-column label="会员id" prop="uid" width="100"></el-table-column>
                <el-table-column label="会员昵称/手机号" width="300">
                    <template slot-scope="scope">
                        <div class="member-info">
                            <el-avatar class="member-avatar" :src="scope.row.avatar"></el-avatar>
                            [[ scope.row.nickname ]] / [[ scope.row.mobile ]]
                        </div>
                    </template>
                </el-table-column>
                <el-table-column label="可使用余额" prop="useBalance"></el-table-column>
                <el-table-column label="已使用余额" prop="usedBalance"></el-table-column>
                <el-table-column label="已提现余额" prop="withdrawBalance"></el-table-column>
                <el-table-column label="收入余额" prop="incomeBalance"></el-table-column>
                <el-table-column label="后台充值余额" prop="recharge"></el-table-column>
                <el-table-column label="会员充值余额" prop="memberRecharge"></el-table-column>
            </el-table>
            <el-row style="margin-top:20px;">
                <el-col align="right">
                    <el-pagination :current-page="balanceUsePagination.pages" :page-size="balanceUsePagination.limit" :total="balanceUsePagination.total" @current-change="getMemberBalanceUseData"></el-pagination>
                </el-col>
            </el-row>
        </panel>
    </div>
</div>

<script>
    const GetBalanceOverallDataUrl = "{!! yzWebFullUrl('plugin.shop-statistics.backend.balance.get-balance-statistic') !!}"; //* 获取整体数据
    const GetBalanceStaitsticsUrl = "{!! yzWebFullUrl('plugin.shop-statistics.backend.balance.search-balance-statistic') !!}"; //* 获取统计数据
    const GetMemberBalanceUseDataUrl = "{!! yzWebFullUrl('plugin.shop-statistics.backend.balance.search-balance-ranking') !!}"; //* 获取会员余额使用情况
</script>
<script src="{{resource_get('plugins/shop-statistics/assets/js/components.js')}}"></script>
<script src="{{resource_get('plugins/shop-statistics/assets/js/balance.js')}}?timestamp={{ time() }}"></script>
<script src="{{resource_get('plugins/shop-statistics/assets/js/common.js')}}"></script>
@endsection