mirror of
https://github.com/crmeb/CRMEB.git
synced 2025-12-26 04:50:16 +00:00
444 lines
18 KiB
PHP
444 lines
18 KiB
PHP
{extend name="public/container"}
|
||
{block name="head_top"}
|
||
<link rel="stylesheet" href="{__PLUG_PATH}daterangepicker/daterangepicker.css">
|
||
<link href="{__FRAME_PATH}css/plugins/footable/footable.core.css" rel="stylesheet">
|
||
<script src="{__PLUG_PATH}sweetalert2/sweetalert2.all.min.js"></script>
|
||
<script src="{__PLUG_PATH}moment.js"></script>
|
||
<script src="{__PLUG_PATH}daterangepicker/daterangepicker.js"></script>
|
||
<script src="{__PLUG_PATH}echarts.common.min.js"></script>
|
||
{/block}
|
||
{block name="content"}
|
||
|
||
<div class="row">
|
||
<div class="col-sm-12">
|
||
<div class="ibox">
|
||
<div class="ibox-content">
|
||
<div class="m-b m-l">
|
||
<div action="" class="form-inline">
|
||
<div class="search-item" data-name="status">
|
||
<span>创建时间：</span>
|
||
<a class="btn {if !$where.data && $where.date==''}btn-primary btn-sm {else}btn-outline btn-link{/if}" href="{:Url('index',['date'=>''])}">全部</a>
|
||
<a class="btn {if !$where.data && $where.date=='today'}btn-primary btn-sm {else}btn-outline btn-link{/if}" href="{:Url('index',['date'=>'today'])}">今天</a>
|
||
<a class="btn {if !$where.data && $where.date=='week'}btn-primary btn-sm{else}btn-outline btn-link{/if}" href="{:Url('index',['date'=>'week'])}">本周</a>
|
||
<a class="btn {if !$where.data && $where.date=='month'}btn-primary btn-sm{else}btn-outline btn-link{/if}" href="{:Url('index',['date'=>'month'])}">本月</a>
|
||
<a class="btn {if !$where.data && $where.date=='quarter'}btn-primary btn-sm{else}btn-outline btn-link{/if}" href="{:Url('index',['date'=>'quarter'])}">本季度</a>
|
||
<a class="btn {if !$where.data && $where.date=='year'}btn-primary btn-sm{else}btn-outline btn-link{/if}" href="{:Url('index',['date'=>'year'])}">本年</a>
|
||
<div class="datepicker" style="display: inline-block;">
|
||
<a class="btn btn-link {if $where.data}btn-primary{else}btn-outline{/if}" href="javascript:(0)" data-value="{$where.data?:'no'}">自定义</a>
|
||
</div>
|
||
<form action="">
|
||
<input class="search-item-value" type="hidden" name="data" value="{$where.data}" />
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-sm-12">
|
||
<div class="ibox">
|
||
<div class="ibox-content">
|
||
{volist name='header' id='val'}
|
||
<div class="col-sm-3">
|
||
<div class="widget style1 {$val.color}-bg" style="height: 120px;">
|
||
<div class="row" style="margin-top: 16px;padding: 0 20px;">
|
||
<div class="col-xs-4">
|
||
<i class="fa {$val.class} fa-5x"></i>
|
||
</div>
|
||
<div class="col-xs-8 text-right">
|
||
<span> {$val.name} </span>
|
||
<h2 class="font-bold">{$val.value}</h2>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
{/volist}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
<!--------------------------->
|
||
|
||
<div class="row">
|
||
<div class="col-sm-12">
|
||
<div class="col-sm-8">
|
||
<div class="ibox float-e-margins">
|
||
<div class="ibox-title">
|
||
<h5>主要数据统计</h5>
|
||
<div class="ibox-tools">
|
||
<a class="collapse-link">
|
||
<i class="fa fa-chevron-up"></i>
|
||
</a>
|
||
<!-- <a class="close-link">-->
|
||
<!-- <i class="fa fa-times"></i>-->
|
||
<!-- </a>-->
|
||
</div>
|
||
</div>
|
||
<div class="ibox-content">
|
||
<div id="ec-goods-count" style="height:390px;"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-sm-4">
|
||
<div class="ibox float-e-margins">
|
||
<div class="ibox-title">
|
||
<h5>支付方式</h5>
|
||
<div class="ibox-tools">
|
||
<a class="collapse-link">
|
||
<i class="fa fa-chevron-up"></i>
|
||
</a>
|
||
<!-- <a class="close-link">-->
|
||
<!-- <i class="fa fa-times"></i>-->
|
||
<!-- </a>-->
|
||
</div>
|
||
</div>
|
||
<div class="ibox-content">
|
||
<div id="ec-order-count" style="height:390px;"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-sm-12">
|
||
<div class="col-sm-4">
|
||
<div class="ibox float-e-margins">
|
||
<div class="ibox-title">
|
||
<h5>支出详情</h5>
|
||
<div class="ibox-tools">
|
||
<a class="collapse-link">
|
||
<i class="fa fa-chevron-up"></i>
|
||
</a>
|
||
<!-- <a class="close-link">-->
|
||
<!-- <i class="fa fa-times"></i>-->
|
||
<!-- </a>-->
|
||
</div>
|
||
</div>
|
||
<div class="ibox-content">
|
||
<div id="ec-zhichu-count" style="height:300px;"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-sm-4">
|
||
<div class="ibox float-e-margins">
|
||
<div class="ibox-title">
|
||
<h5>营收详情</h5>
|
||
<div class="ibox-tools">
|
||
<a class="collapse-link">
|
||
<i class="fa fa-chevron-up"></i>
|
||
</a>
|
||
<!-- <a class="close-link">-->
|
||
<!-- <i class="fa fa-times"></i>-->
|
||
<!-- </a>-->
|
||
</div>
|
||
</div>
|
||
<div class="ibox-content">
|
||
<div id="ec-revenue-count" style="height:300px;"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-sm-4">
|
||
<div class="ibox float-e-margins">
|
||
<div class="ibox-title">
|
||
<h5>最近交易记录</h5>
|
||
<div class="ibox-tools">
|
||
<a class="collapse-link">
|
||
<i class="fa fa-chevron-up"></i>
|
||
</a>
|
||
<!-- <a class="close-link">-->
|
||
<!-- <i class="fa fa-times"></i>-->
|
||
<!-- </a>-->
|
||
</div>
|
||
</div>
|
||
<div class="ibox-content" >
|
||
<div id="ec-new-count" style="height:300px;">
|
||
{volist name="trans" id="vo"}
|
||
<div class="col-sm-3 col-xs-3"><h4 class="text-overflow">{$vo.nickname}</h4></div>
|
||
<div class="col-sm-6 col-xs-6"><h4 class="text-overflow">购买{$vo.store_name}</h4></div>
|
||
<div class="col-sm-3 col-xs-3"><h4 class="text-overflow">￥{$vo.pay_price}</h4></div>
|
||
{/volist}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-sm-12">
|
||
<div class="ibox-content">
|
||
|
||
<div class="text-left">
|
||
{if condition="$price['pay_price_wx'] GT 0"}
|
||
<div class="count-price">
|
||
<span>微信支付金额：<strong class="text-danger">￥{$price.pay_price_wx}</strong></span>
|
||
</div>
|
||
{/if}
|
||
{if condition="$price['pay_price_yue'] GT 0"}
|
||
<div class="count-price">
|
||
<span>余额支付金额：<strong class="text-danger">￥{$price.pay_price_yue}</strong></span>
|
||
</div>
|
||
{/if}
|
||
{if condition="$price['pay_price_offline'] GT 0"}
|
||
<div class="count-price">
|
||
<span>线下支付金额：<strong class="text-danger">￥{$price.pay_price_offline}</strong></span>
|
||
</div>
|
||
{/if}
|
||
</div>
|
||
<div class="m-t-n-lg text-right">
|
||
<div class="input-group">
|
||
<span class="input-group-btn">
|
||
<a class="btn btn-sm btn-info btn-outline" href="{:Url('index',['export'=>'1'])}">Excel导出</a>
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script src="{__FRAME_PATH}js/content.min.js?v=1.0.0"></script>
|
||
<script>
|
||
(function(){
|
||
var option = {
|
||
title: {
|
||
text: '数据统计'
|
||
},
|
||
tooltip: {
|
||
trigger: 'axis'
|
||
},
|
||
xAxis: {
|
||
type: 'category',
|
||
boundaryGap: false,
|
||
splitLine: {show: false},
|
||
data: <?=json_encode($orderDays)?>
|
||
},
|
||
yAxis: {
|
||
splitLine: {
|
||
show: false
|
||
},
|
||
type: 'value'
|
||
},
|
||
legend: {
|
||
orient: 'horizontal',
|
||
left: 'center',
|
||
top: 25,
|
||
data: ['营业额','支出','盈利']
|
||
},
|
||
toolbox: {
|
||
left: 'right',
|
||
feature: {
|
||
restore: {},
|
||
saveAsImage: {}
|
||
}
|
||
},
|
||
//dataZoom: [{
|
||
// startValue: '<?php
|
||
// $index = count($orderDays) > 30 ? count($orderDays)-30 : 0;
|
||
// if(isset($orderDays[$index]))
|
||
// echo $orderDays[$index];
|
||
// ?>//'
|
||
//}, {
|
||
// type: 'inside'
|
||
//}],
|
||
visualMap: {
|
||
top: 10,
|
||
right: 10,
|
||
pieces: [{
|
||
gt: 0,
|
||
lte: 50,
|
||
color: '#096'
|
||
}, {
|
||
gt: 50,
|
||
lte: 100,
|
||
color: '#ffde33'
|
||
}, {
|
||
gt: 100,
|
||
lte: 150,
|
||
color: '#ff9933'
|
||
}, {
|
||
gt: 150,
|
||
lte: 200,
|
||
color: '#cc0033'
|
||
}, {
|
||
gt: 200,
|
||
lte: 300,
|
||
color: '#660099'
|
||
}, {
|
||
gt: 300,
|
||
color: '#7e0023'
|
||
}],
|
||
outOfRange: {
|
||
color: '#999'
|
||
}
|
||
},
|
||
series: <?= json_encode($Statistic)?>
|
||
};
|
||
var myChart = echarts.init(document.getElementById('ec-goods-count'),'light');
|
||
myChart.setOption(option);
|
||
})();
|
||
(function(){
|
||
var option = {
|
||
tooltip: {
|
||
trigger: 'item',
|
||
formatter: "{a} <br/>{b}: {c} ({d}%)"
|
||
},
|
||
legend: {
|
||
orient: 'vertical',
|
||
x: 'left',
|
||
data:['商品成本','优惠券抵扣','积分抵扣','推广人佣金','会员充值赠送']
|
||
},
|
||
series: [
|
||
{
|
||
name:'支出',
|
||
type:'pie',
|
||
radius: ['40%', '70%'],
|
||
avoidLabelOverlap: false,
|
||
label: {
|
||
normal: {
|
||
show: false,
|
||
position: 'center'
|
||
},
|
||
emphasis: {
|
||
show: true,
|
||
textStyle: {
|
||
fontSize: '15',
|
||
fontWeight: 'bold'
|
||
}
|
||
}
|
||
},
|
||
labelLine: {
|
||
normal: {
|
||
show: false
|
||
}
|
||
},
|
||
data:<?= json_encode($data)?>
|
||
}
|
||
]
|
||
};
|
||
var myChart = echarts.init(document.getElementById('ec-zhichu-count'),'light');
|
||
myChart.setOption(option);
|
||
})();
|
||
(function(){
|
||
var option = {
|
||
color: ['#3398DB'],
|
||
tooltip : {
|
||
trigger: 'axis',
|
||
axisPointer : {
|
||
type : 'shadow'
|
||
}
|
||
},
|
||
grid: {
|
||
left: '3%',
|
||
right: '4%',
|
||
top: '4%',
|
||
containLabel: true
|
||
},
|
||
yAxis : [
|
||
{
|
||
inverse:true,
|
||
axisLine: {show: false},
|
||
type : 'category',
|
||
data : ['1、普通商品', '2、拼团商品', '3、会员充值','4、秒杀商品'],
|
||
axisTick: {
|
||
alignWithLabel: true
|
||
}
|
||
}
|
||
],
|
||
xAxis : [
|
||
{
|
||
show:false,
|
||
type : 'value'
|
||
}
|
||
],
|
||
series : [
|
||
{
|
||
name:'金额',
|
||
type:'bar',
|
||
barWidth: '60%',
|
||
data:<?= json_encode([$ordinary,$pink,$recharge,$seckill])?>
|
||
}
|
||
]
|
||
};
|
||
var myChart = echarts.init(document.getElementById('ec-revenue-count'),'light');
|
||
myChart.setOption(option);
|
||
})();
|
||
(function(){
|
||
var option = {
|
||
title: {
|
||
text: '支付统计'
|
||
},
|
||
tooltip : {
|
||
trigger: 'item',
|
||
formatter: "{a} <br/>{b} : {c} ({d}%)"
|
||
},
|
||
legend: {
|
||
orient: 'horizontal',
|
||
left: 'left',
|
||
top: 25,
|
||
data: <?=urldecode(json_encode(array_keys($orderCount)))?>,
|
||
selected:<?php
|
||
$data = [];
|
||
$selected = [];
|
||
foreach ($orderCount as $k=>$count){
|
||
$data[] = ['value'=>$count,'name'=>$k];
|
||
$selected[$k] = $count>0;
|
||
}
|
||
echo urldecode(json_encode($selected));
|
||
?>
|
||
},
|
||
series : [
|
||
{
|
||
name: '订单数量',
|
||
type: 'pie',
|
||
radius : '55%',
|
||
center: ['50%', '60%'],
|
||
data:<?=urldecode(json_encode($data))?>,
|
||
itemStyle: {
|
||
emphasis: {
|
||
shadowBlur: 10,
|
||
shadowOffsetX: 0,
|
||
shadowColor: 'rgba(0, 0, 0, 0.5)'
|
||
}
|
||
}
|
||
}
|
||
]
|
||
};
|
||
var myChart = echarts.init(document.getElementById('ec-order-count'),'light');
|
||
myChart.setOption(option);
|
||
})();
|
||
var dateInput =$('.datepicker');
|
||
dateInput.daterangepicker({
|
||
autoUpdateInput: false,
|
||
"opens": "center",
|
||
"drops": "down",
|
||
"ranges": {
|
||
'今天': [moment(), moment().add(1, 'days')],
|
||
'昨天': [moment().subtract(1, 'days'), moment()],
|
||
'上周': [moment().subtract(6, 'days'), moment()],
|
||
'前30天': [moment().subtract(29, 'days'), moment()],
|
||
'本月': [moment().startOf('month'), moment().endOf('month')],
|
||
'上月': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
|
||
},
|
||
"locale" : {
|
||
applyLabel : '确定',
|
||
cancelLabel : '取消',
|
||
fromLabel : '起始时间',
|
||
toLabel : '结束时间',
|
||
format : 'YYYY/MM/DD',
|
||
customRangeLabel : '自定义',
|
||
daysOfWeek : [ '日', '一', '二', '三', '四', '五', '六' ],
|
||
monthNames : [ '一月', '二月', '三月', '四月', '五月', '六月',
|
||
'七月', '八月', '九月', '十月', '十一月', '十二月' ],
|
||
firstDay : 1
|
||
}
|
||
});
|
||
dateInput.on('apply.daterangepicker', function(ev, picker) {
|
||
$("input[name=data]").val(picker.startDate.format('YYYY/MM/DD') + ' - ' + picker.endDate.format('YYYY/MM/DD'));
|
||
$('form').submit();
|
||
});
|
||
</script>
|
||
{/block}
|