hemall.terabimsoft.com.cn/plugins/shop-statistics/views/backend/coupon.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">
                <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.givenCoupon">
                    </statistics-card>
                </li>
                <li>
                    <statistics-card colorful count-color="#f26163" background="{!! resource_get('plugins/shop-statistics/assets/images/statistics_card_1.png') !!}" :border="false" title="已领取优惠券" tip="累计领券中心领取优惠券总数" :count="overall.receiveCoupon">
                    </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.usedCoupon">
                    </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.expiredCoupon">
                    </statistics-card>
                </li>
            </ul>
        </panel>
        <panel>

            <el-row :gutter="20">
                <el-col :span="4">
                    <statistics-card :title="dataItem.title" :tip="dataItem.tip" :count="dataItem.count" v-for="dataItem in couponStatistics.data" :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 type="date" v-model="couponStatistics.dataTime" @change="getCouponStatisticsData"></el-date-picker>
                        </el-form-item>
                    </panel-form>
                    <div ref="couponChart" style="margin-top:20px;width:100%;height:575px;"></div>
                </el-col>
            </el-row>
        </panel>
        <panel id="couponRankPanel">
            <statistics-card-title>
                领取优惠券排行
                <el-tooltip class="item" effect="dark" content="领券中心领取优惠券数量排名" placement="top">
                    <i class="el-icon-info"></i>
                </el-tooltip>
            </statistics-card-title>
            <el-table :data="couponRank.data">
                <el-table-column width="100px" label="排名">
                    <template slot-scope="scope">
                        <div class="member-rank" plain mini :data-rank="scope.row.rank" round mini>[[ scope.row.rank ]]</div>
                    </template>
                </el-table-column>
                <el-table-column width="200px" label="优惠券id" prop="id"></el-table-column>
                <el-table-column label="优惠券名称" prop="name"></el-table-column>
                <el-table-column width="100px" label="已领取数量" prop="receiveCoupon"></el-table-column>
            </el-table>
            <el-row style="margin-top:20px;">
                <el-col align="right">
                    <el-pagination :total="couponRank.pagination.total" :page-size="couponRank.pagination.limit" :current-page="couponRank.pagination.pages" @current-change="getCouponRankData"></el-pagination>
                </el-col>
            </el-row>
        </panel>
    </div>
</div>

<script>
    const GetCouponOverallDataUrl = "{!! yzWebFullUrl('plugin.shop-statistics.backend.coupon.get-coupon-statistic') !!}"; //* 获取优惠券整体统计信息
    const GetCouponStatisticsDataUrl = "{!! yzWebFullUrl('plugin.shop-statistics.backend.coupon.search-coupon-statistic') !!}"; //* 获取优惠券统计数据
    const GetCouponRankDataUrl = "{!! yzWebFullUrl('plugin.shop-statistics.backend.coupon.search-coupon-ranking') !!}"; //* 获取优惠券排行榜数据
</script>
<script src="{{resource_get('plugins/shop-statistics/assets/js/components.js')}}"></script>
<script src="{{resource_get('plugins/shop-statistics/assets/js/coupon.js')}}?timestamp={{ time() }}"></script>
<script src="{{resource_get('plugins/shop-statistics/assets/js/common.js')}}"></script>
@endsection