提交 5a82819a 编写于 作者: G gongfuxiang

新增后台管理首页仪表盘

上级 521b7482
...@@ -74,6 +74,30 @@ class Index extends Common ...@@ -74,6 +74,30 @@ class Index extends Common
$user = StatisticalService::UserYesterdayTodayTotal(); $user = StatisticalService::UserYesterdayTodayTotal();
$this->assign('user', $user['data']); $this->assign('user', $user['data']);
// 订单总数
$order_number = StatisticalService::OrderNumberYesterdayTodayTotal();
$this->assign('order_number', $order_number['data']);
// 订单成交总量
$order_complete_number = StatisticalService::OrderCompleteYesterdayTodayTotal();
$this->assign('order_complete_number', $order_complete_number['data']);
// 订单收入总计
$order_complete_money = StatisticalService::OrderCompleteMoneyYesterdayTodayTotal();
$this->assign('order_complete_money', $order_complete_money['data']);
// 近7日订单交易走势
$order_trading_trend = StatisticalService::OrderTradingTrendSevenTodayTotal();
$this->assign('order_trading_trend', $order_trading_trend['data']);
// 近7日订单支付方式
$order_type_number = StatisticalService::OrderPayTypeSevenTodayTotal();
$this->assign('order_type_number', $order_type_number['data']);
// 近7日热销商品
$goods_hot_sale = StatisticalService::GoodsHotSaleSevenTodayTotal();
$this->assign('goods_hot_sale', $goods_hot_sale['data']);
return $this->fetch(); return $this->fetch();
} }
} }
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
<div class="content-right"> <div class="content-right">
<div class="content"> <div class="content">
<!-- 基础统计 --> <!-- 基础统计 -->
<div class="echarts-container shopxo-base" style="display: none;"> <div class="echarts-container shopxo-base">
<div class="echarts-title"> <div class="echarts-title">
<span class="icon"></span> <span class="icon"></span>
<span class="title">商城统计</span> <span class="title">商城统计</span>
...@@ -27,42 +27,42 @@ ...@@ -27,42 +27,42 @@
<li> <li>
<div class="li-content"> <div class="li-content">
<p class="name">订单总量</p> <p class="name">订单总量</p>
<p class="total">234234</p> <p class="total">{{$order_number.total_count}}</p>
<div class="yesterday"> <div class="yesterday">
<span>昨日</span> <span>昨日</span>
<span>34324</span> <span>{{$order_number.yesterday_count}}</span>
</div> </div>
<div class="today"> <div class="today">
<span>今日</span> <span>今日</span>
<span>65645</span> <span>{{$order_number.today_count}}</span>
</div> </div>
</div> </div>
</li> </li>
<li> <li>
<div class="li-content"> <div class="li-content">
<p class="name">成交总量</p> <p class="name">成交总量</p>
<p class="total">234234</p> <p class="total">{{$order_complete_number.total_count}}</p>
<div class="yesterday"> <div class="yesterday">
<span>昨日</span> <span>昨日</span>
<span>34324</span> <span>{{$order_complete_number.yesterday_count}}</span>
</div> </div>
<div class="today"> <div class="today">
<span>今日</span> <span>今日</span>
<span>65645</span> <span>{{$order_complete_number.today_count}}</span>
</div> </div>
</div> </div>
</li> </li>
<li> <li>
<div class="li-content"> <div class="li-content">
<p class="name">收入总计</p> <p class="name">收入总计</p>
<p class="total">234234</p> <p class="total">{{$order_complete_money.total_count}}</p>
<div class="yesterday"> <div class="yesterday">
<span>昨日</span> <span>昨日</span>
<span>34324</span> <span>{{$order_complete_money.yesterday_count}}</span>
</div> </div>
<div class="today"> <div class="today">
<span>今日</span> <span>今日</span>
<span>65645</span> <span>{{$order_complete_money.today_count}}</span>
</div> </div>
</div> </div>
</li> </li>
...@@ -70,17 +70,17 @@ ...@@ -70,17 +70,17 @@
</div> </div>
<!-- 支付方式 --> <!-- 近7日订单交易走势 -->
<div class="echarts-container" style="display: none;"> <div class="echarts-container">
<div class="echarts-title"> <div class="echarts-title">
<span class="icon"></span> <span class="icon"></span>
<span class="title">支付方式</span> <span class="title">近7日订单交易走势</span>
</div> </div>
<div id="echarts-order-pay-type"></div> <div id="echarts-order-trading"></div>
</div> </div>
<!-- 组合 --> <!-- 组合 -->
<ul class="am-avg-sm-1 am-avg-sm-2 am-avg-lg-2 echarts-combination-container-2" style="display: none;"> <ul class="am-avg-sm-1 am-avg-sm-2 am-avg-lg-2 echarts-combination-container-2">
<li> <li>
<!-- 近7日热销商品 --> <!-- 近7日热销商品 -->
<div class="echarts-title"> <div class="echarts-title">
...@@ -91,12 +91,12 @@ ...@@ -91,12 +91,12 @@
</li> </li>
<li> <li>
<!-- 近7日订单交易走势 --> <!-- 近7日订单支付方式 -->
<div class="echarts-title"> <div class="echarts-title">
<span class="icon"></span> <span class="icon"></span>
<span class="title">近7日订单交易走势</span> <span class="title">近7日订单支付方式</span>
</div> </div>
<div id="echarts-order-trading"></div> <div id="echarts-order-pay-type"></div>
</li> </li>
</ul> </ul>
...@@ -155,14 +155,20 @@ ...@@ -155,14 +155,20 @@
<script type="text/javascript"> <script type="text/javascript">
$(function() $(function()
{ {
// 订单支付方式 // 近7日订单交易走势
var order_pay_type_chart = echarts.init(document.getElementById('echarts-order-pay-type')); var order_trading_chart = echarts.init(document.getElementById('echarts-order-trading'));
var option = { var option = {
tooltip : { tooltip : {
trigger: 'axis' trigger: 'axis',
axisPointer: {
type: 'cross',
label: {
backgroundColor: '#6a7985'
}
}
}, },
legend: { legend: {
data:['支付宝','微信','现金支付','货到付款'] data: {{:json_encode($order_trading_trend.title_arr)}}
}, },
toolbox: { toolbox: {
show : true, show : true,
...@@ -171,15 +177,20 @@ $(function() ...@@ -171,15 +177,20 @@ $(function()
dataView : {show: true, readOnly: false}, dataView : {show: true, readOnly: false},
magicType : {show: true, type: ['line', 'bar', 'stack', 'tiled']}, magicType : {show: true, type: ['line', 'bar', 'stack', 'tiled']},
restore : {show: true}, restore : {show: true},
saveAsImage : {show: true} saveAsImage : {name:'近7日订单交易走势', show: true}
} }
}, },
calculable : true, grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis : [ xAxis : [
{ {
type : 'category', type : 'category',
boundaryGap : false, boundaryGap : false,
data : ['周一','周二','周三','周四','周五','周六','周日'] data : {{:json_encode($order_trading_trend.name_arr)}}
} }
], ],
yAxis : [ yAxis : [
...@@ -187,37 +198,12 @@ $(function() ...@@ -187,37 +198,12 @@ $(function()
type : 'value' type : 'value'
} }
], ],
series : [ series : {{:json_encode($order_trading_trend.data)}}
{
name:'支付宝',
type:'line',
tiled: '总量',
data:[120, 132, 101, 134, 90, 230, 210]
},
{
name:'微信',
type:'line',
tiled: '总量',
data:[220, 182, 191, 234, 290, 330, 310]
},
{
name:'现金支付',
type:'line',
tiled: '总量',
data:[150, 232, 201, 154, 190, 330, 410]
},
{
name:'货到付款',
type:'line',
tiled: '总量',
data:[320, 332, 301, 334, 390, 330, 320]
},
]
}; };
order_pay_type_chart.setOption(option); order_trading_chart.setOption(option);
// 热销商品 // 近7日热销商品
var goods_hot_chart = echarts.init(document.getElementById('echarts-goods-hot')); var goods_hot_chart = echarts.init(document.getElementById('echarts-goods-hot'));
var option = { var option = {
title : { title : {
...@@ -226,12 +212,7 @@ $(function() ...@@ -226,12 +212,7 @@ $(function()
}, },
tooltip : { tooltip : {
trigger: 'item', trigger: 'item',
formatter: "{a} <br/>{b} : {c} ({d}%)" formatter: "{b} : {c} ({d}%)"
},
legend: {
orient : 'vertical',
x : 'left',
data:['直接访问','邮件营销','联盟广告','视频广告','搜索引擎']
}, },
toolbox: { toolbox: {
show : true, show : true,
...@@ -250,60 +231,47 @@ $(function() ...@@ -250,60 +231,47 @@ $(function()
} }
} }
}, },
restore : {show: true}, restore : {show: false},
saveAsImage : {show: true} saveAsImage : {name:'近7日热销商品', show: true}
} }
}, },
calculable : true, calculable : true,
series : [ series : [
{ {
name:'访问来源',
type:'pie', type:'pie',
radius : '55%', radius : '55%',
center: ['50%', '60%'], center: ['50%', '60%'],
data:[ data: {{:json_encode($goods_hot_sale.data)}}
{value:335, name:'直接访问'},
{value:310, name:'邮件营销'},
{value:234, name:'联盟广告'},
{value:135, name:'视频广告'},
{value:1548, name:'搜索引擎'}
]
} }
] ]
}; };
goods_hot_chart.setOption(option); goods_hot_chart.setOption(option);
// 订单交易走势 // 近7日订单支付方式
var order_trading_chart = echarts.init(document.getElementById('echarts-order-trading')); var order_pay_type_chart = echarts.init(document.getElementById('echarts-order-pay-type'));
var option = { var option = {
tooltip : { tooltip : {
trigger: 'axis', trigger: 'axis'
axisPointer: {
type: 'cross',
label: {
backgroundColor: '#6a7985'
}
}
}, },
legend: { legend: {
data:['邮件营销','联盟广告','视频广告','直接访问','搜索引擎'] data: {{:json_encode($order_type_number.title_arr)}}
}, },
toolbox: { toolbox: {
feature: { show : true,
saveAsImage: {} feature : {
mark : {show: true},
dataView : {show: true, readOnly: false},
magicType : {show: true, type: ['line', 'bar']},
restore : {show: false},
saveAsImage : {name:'近7日订单支付方式', show: true}
} }
}, },
grid: { calculable : true,
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis : [ xAxis : [
{ {
type : 'category', type : 'category',
boundaryGap : false, boundaryGap : false,
data : ['周一','周二','周三','周四','周五','周六','周日'] data : {{:json_encode($order_type_number.name_arr)}}
} }
], ],
yAxis : [ yAxis : [
...@@ -311,46 +279,9 @@ $(function() ...@@ -311,46 +279,9 @@ $(function()
type : 'value' type : 'value'
} }
], ],
series : [ series : {{:json_encode($order_type_number.data)}}
{
name:'邮件营销',
type:'line',
stack: '总量',
areaStyle: {},
data:[120, 132, 101, 134, 90, 230, 210]
},
{
name:'联盟广告',
type:'line',
stack: '总量',
areaStyle: {},
data:[220, 182, 191, 234, 290, 330, 310]
},
{
name:'视频广告',
type:'line',
stack: '总量',
areaStyle: {},
data:[150, 232, 201, 154, 190, 330, 410]
},
{
name:'直接访问',
type:'line',
stack: '总量',
areaStyle: {normal: {}},
data:[320, 332, 301, 334, 390, 330, 320]
},
{
name:'搜索引擎',
type:'line',
stack: '总量',
areaStyle: {normal: {}},
data:[820, 932, 901, 934, 1290, 1330, 1320]
}
]
}; };
order_trading_chart.setOption(option); order_pay_type_chart.setOption(option);
// 浏览器大小改变则实时更新图表大小 // 浏览器大小改变则实时更新图表大小
window.onresize = function () window.onresize = function ()
......
...@@ -27,6 +27,10 @@ class StatisticalService ...@@ -27,6 +27,10 @@ class StatisticalService
private static $nearly_fifteen_days; private static $nearly_fifteen_days;
private static $nearly_thirty_days; private static $nearly_thirty_days;
// 近7天日期
private static $seven_time_start;
private static $seven_time_end;
// 昨天日期 // 昨天日期
private static $yesterday_time_start; private static $yesterday_time_start;
private static $yesterday_time_end; private static $yesterday_time_end;
...@@ -46,6 +50,10 @@ class StatisticalService ...@@ -46,6 +50,10 @@ class StatisticalService
*/ */
public static function Init($params = []) public static function Init($params = [])
{ {
// 近7天日期
self::$seven_time_start = strtotime(date('Y-m-d 00:00:00', strtotime('-7 day')));
self::$seven_time_end = time();
// 昨天日期 // 昨天日期
self::$yesterday_time_start = strtotime(date('Y-m-d 00:00:00', strtotime('-1 day'))); self::$yesterday_time_start = strtotime(date('Y-m-d 00:00:00', strtotime('-1 day')));
self::$yesterday_time_end = strtotime(date('Y-m-d 23:59:59', strtotime('-1 day'))); self::$yesterday_time_end = strtotime(date('Y-m-d 23:59:59', strtotime('-1 day')));
...@@ -75,10 +83,10 @@ class StatisticalService ...@@ -75,10 +83,10 @@ class StatisticalService
} }
self::${$name} = $date; self::${$name} = $date;
} }
} }
/** /**
* 用户总数,今日,昨日 * 用户总数,今日,昨日,总数
* @author Devil * @author Devil
* @blog http://gong.gg/ * @blog http://gong.gg/
* @version 0.0.1 * @version 0.0.1
...@@ -108,12 +116,319 @@ class StatisticalService ...@@ -108,12 +116,319 @@ class StatisticalService
$today_count = Db::name('User')->where($where)->count(); $today_count = Db::name('User')->where($where)->count();
// 数据组装 // 数据组装
$data = [ $result = [
'total_count' => $total_count,
'yesterday_count' => $yesterday_count,
'today_count' => $today_count,
];
return DataReturn('处理成功', 0, $result);
}
/**
* 订单总数,今日,昨日,总数
* @author Devil
* @blog http://gong.gg/
* @version 0.0.1
* @datetime 2016-12-06T21:31:53+0800
* @param [array] $params [输入参数]
*/
public static function OrderNumberYesterdayTodayTotal($params = [])
{
// 初始化
self::Init($params);
// 订单状态
// (0待确认, 1已确认/待支付, 2已支付/待发货, 3已发货/待收货, 4已完成, 5已取消, 6已关闭)
// 总数
$where = [
['status', '<=', 4],
];
$total_count = Db::name('Order')->where($where)->count();
// 昨天
$where = [
['status', '<=', 4],
['add_time', '>=', self::$yesterday_time_start],
['add_time', '<=', self::$yesterday_time_end],
];
$yesterday_count = Db::name('Order')->where($where)->count();
// 今天
$where = [
['status', '<=', 4],
['add_time', '>=', self::$today_time_start],
['add_time', '<=', self::$today_time_end],
];
$today_count = Db::name('Order')->where($where)->count();
// 数据组装
$result = [
'total_count' => $total_count,
'yesterday_count' => $yesterday_count,
'today_count' => $today_count,
];
return DataReturn('处理成功', 0, $result);
}
/**
* 订单成交总量,今日,昨日,总数
* @author Devil
* @blog http://gong.gg/
* @version 0.0.1
* @datetime 2016-12-06T21:31:53+0800
* @param [array] $params [输入参数]
*/
public static function OrderCompleteYesterdayTodayTotal($params = [])
{
// 初始化
self::Init($params);
// 订单状态
// (0待确认, 1已确认/待支付, 2已支付/待发货, 3已发货/待收货, 4已完成, 5已取消, 6已关闭)
// 总数
$where = [
['status', '=', 4],
];
$total_count = Db::name('Order')->where($where)->count();
// 昨天
$where = [
['status', '=', 4],
['add_time', '>=', self::$yesterday_time_start],
['add_time', '<=', self::$yesterday_time_end],
];
$yesterday_count = Db::name('Order')->where($where)->count();
// 今天
$where = [
['status', '=', 4],
['add_time', '>=', self::$today_time_start],
['add_time', '<=', self::$today_time_end],
];
$today_count = Db::name('Order')->where($where)->count();
// 数据组装
$result = [
'total_count' => $total_count, 'total_count' => $total_count,
'yesterday_count' => $yesterday_count, 'yesterday_count' => $yesterday_count,
'today_count' => $today_count, 'today_count' => $today_count,
]; ];
return DataReturn('处理成功', 0, $data); return DataReturn('处理成功', 0, $result);
}
/**
* 订单收入总计,今日,昨日,总数
* @author Devil
* @blog http://gong.gg/
* @version 0.0.1
* @datetime 2016-12-06T21:31:53+0800
* @param [array] $params [输入参数]
*/
public static function OrderCompleteMoneyYesterdayTodayTotal($params = [])
{
// 初始化
self::Init($params);
// 订单状态
// (0待确认, 1已确认/待支付, 2已支付/待发货, 3已发货/待收货, 4已完成, 5已取消, 6已关闭)
// 总数
$where = [
['status', '<=', 4],
];
$total_count = Db::name('Order')->where($where)->sum('total_price');
// 昨天
$where = [
['status', '<=', 4],
['add_time', '>=', self::$yesterday_time_start],
['add_time', '<=', self::$yesterday_time_end],
];
$yesterday_count = Db::name('Order')->where($where)->sum('total_price');
// 今天
$where = [
['status', '<=', 4],
['add_time', '>=', self::$today_time_start],
['add_time', '<=', self::$today_time_end],
];
$today_count = Db::name('Order')->where($where)->sum('total_price');
// 数据组装
$result = [
'total_count' => PriceNumberFormat($total_count),
'yesterday_count' => PriceNumberFormat($yesterday_count),
'today_count' => PriceNumberFormat($today_count),
];
return DataReturn('处理成功', 0, $result);
}
/**
* 订单交易趋势, 7天数据
* @author Devil
* @blog http://gong.gg/
* @version 0.0.1
* @datetime 2016-12-06T21:31:53+0800
* @param [array] $params [输入参数]
*/
public static function OrderTradingTrendSevenTodayTotal($params = [])
{
// 初始化
self::Init($params);
// 订单状态列表
$order_status_list = lang('common_order_user_status');
$status_arr = array_column($order_status_list, 'id');
// 循环获取统计数据
$data = [];
$count_arr = [];
$name_arr = [];
if(!empty($status_arr))
{
foreach(self::$nearly_seven_days as $day)
{
// 当前日期名称
$name_arr[] = $day['name'];
// 根据支付名称获取数量
foreach($status_arr as $status)
{
// 获取订单
$where = [
['status', '=', $status],
['add_time', '>=', $day['start_time']],
['add_time', '<=', $day['end_time']],
];
$count_arr[$status][] = Db::name('Order')->where($where)->count();
}
}
}
// 数据格式组装
foreach($status_arr as $status)
{
$data[] = [
'name' => $order_status_list[$status]['name'],
'type' => 'line',
'tiled' => '总量',
'data' => empty($count_arr[$status]) ? [] : $count_arr[$status],
];
}
// 数据组装
$result = [
'title_arr' => array_column($order_status_list, 'name'),
'name_arr' => $name_arr,
'data' => $data,
];
return DataReturn('处理成功', 0, $result);
}
/**
* 订单支付方式, 7天数据
* @author Devil
* @blog http://gong.gg/
* @version 0.0.1
* @datetime 2016-12-06T21:31:53+0800
* @param [array] $params [输入参数]
*/
public static function OrderPayTypeSevenTodayTotal($params = [])
{
// 初始化
self::Init($params);
// 获取支付方式名称
$where = [
['business_type', '=', 1],
];
$pay_name_arr = Db::name('PayLog')->where($where)->group('payment_name')->column('payment_name');
// 循环获取统计数据
$data = [];
$count_arr = [];
$name_arr = [];
if(!empty($pay_name_arr))
{
foreach(self::$nearly_seven_days as $day)
{
// 当前日期名称
$name_arr[] = date('m-d', strtotime($day['name']));
// 根据支付名称获取数量
foreach($pay_name_arr as $payment)
{
// 获取订单
$where = [
['payment_name', '=', $payment],
['add_time', '>=', $day['start_time']],
['add_time', '<=', $day['end_time']],
];
$count_arr[$payment][] = Db::name('PayLog')->where($where)->count();
}
}
}
// 数据格式组装
foreach($pay_name_arr as $payment)
{
$data[] = [
'name' => $payment,
'type' => 'line',
'stack' => '总量',
'areaStyle' => (object) [],
'data' => empty($count_arr[$payment]) ? [] : $count_arr[$payment],
];
}
// 数据组装
$result = [
'title_arr' => $pay_name_arr,
'name_arr' => $name_arr,
'data' => $data,
];
return DataReturn('处理成功', 0, $result);
}
/**
* 热销商品, 7天数据
* @author Devil
* @blog http://gong.gg/
* @version 0.0.1
* @datetime 2016-12-06T21:31:53+0800
* @param [array] $params [输入参数]
*/
public static function GoodsHotSaleSevenTodayTotal($params = [])
{
// 初始化
self::Init($params);
// 获取热销商品
$where = [
['d.add_time', '>=', self::$seven_time_start],
['d.add_time', '<=', self::$seven_time_end],
];
$data = Db::name('Goods')->alias('g')->join(['__ORDER_DETAIL__'=>'d'], 'g.id=d.goods_id') ->where($where)->field('g.title AS name,g.sales_count AS value')->order('g.sales_count desc')->limit(10)->group('g.id')->select();
if(!empty($data))
{
foreach($data as &$v)
{
if(mb_strlen($v['name'], 'utf-8') > 15)
{
$v['name'] = mb_substr($v['name'], 0, 15).'...';
}
}
}
// 数据组装
$result = [
'name_arr' => array_column($data, 'name'),
'data' => $data,
];
return DataReturn('处理成功', 0, $result);
} }
} }
......
...@@ -478,7 +478,7 @@ class UserService ...@@ -478,7 +478,7 @@ class UserService
]; ];
if(!empty($params['alias'])) if(!empty($params['alias']))
{ {
$data['alias'] = floatval($params['alias']); $data['alias'] = $params['alias'];
} }
if(!empty($params['lng'])) if(!empty($params['lng']))
{ {
......
...@@ -24,7 +24,7 @@ html, body { ...@@ -24,7 +24,7 @@ html, body {
margin-left: 10px; margin-left: 10px;
} }
.echarts-container .echarts-title .icon { .echarts-container .echarts-title .icon {
background: #2196F3; background: #3f82fe;
display: block; display: block;
width: 5px; width: 5px;
height: 16px; height: 16px;
...@@ -90,16 +90,23 @@ html, body { ...@@ -90,16 +90,23 @@ html, body {
margin: 0; margin: 0;
color: #fff; color: #fff;
} }
.shopxo-base li .total { .shopxo-base li .li-content .total {
margin: 0 0 5px 0; margin: 0 0 5px 0;
color: #fff; color: #fff;
font-size: 26px; font-size: 26px;
font-weight: 700;
}
.shopxo-base li .li-content p, .shopxo-base li .li-content .yesterday, .shopxo-base li .li-content .today {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
max-width: 100%;
} }
.shopxo-base li .yesterday, .shopxo-base li .today { .shopxo-base li .li-content .yesterday, .shopxo-base li .li-content .today {
color: #f0f0f0; color: #f0f0f0;
font-size: 12px; font-size: 12px;
} }
.shopxo-base li .yesterday { .shopxo-base li .li-content .yesterday {
padding-bottom: 5px; padding-bottom: 5px;
} }
@media only screen and (max-width: 641px) { @media only screen and (max-width: 641px) {
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册