派单员统计列表

application/admin/controller/statistics/Dispatcher.php

@@ -2,10 +2,12 @@
 
 namespace app\admin\controller\statistics;
 
+use app\admin\model\Admin;
 use app\admin\model\Order;
 use app\common\controller\Backend;
 use think\exception\DbException;
 use think\response\Json;
+use function Symfony\Component\Clock\now;
 
 /**
  * 订单列管理
@@ -46,32 +48,53 @@ class Dispatcher extends Backend
      */
     public function index()
     {
-
+        //$this->chart();
-
+        $today = now()->format('Y-m-d');
-        $this->chart();
+        $today_end = now()->format('Y-m-d');
 
         //设置过滤方法
         $this->request->filter(['strip_tags', 'trim']);
         if (false === $this->request->isAjax()) {
+            $this->assign('daterange',$today.' - '.$today_end);
+
             return $this->view->fetch();
         }
-        //如果发送的来源是 Selectpage，则转发到 Selectpage
+        return json([]);
-        if ($this->request->request('keyField')) {
-            return $this->selectpage();
     }
-        [$where, $sort, $order, $offset, $limit] = $this->buildparams();
+
-        $list = $this->model
+
-            ->where($where)
+    public function chartData()
-            ->order($sort, $order)
+    {
-            ->paginate($limit);
+        $data = $this->chart();
-        $result = ['total' => $list->total(), 'rows' => $list->items()];
+
-        return json($result);
+        $newData = [
+            ['派单员','总业绩(￥)','转化率(%)','利润率(%)','变现值']
+        ];
+        foreach ($data as $datum){
+            $newData[] = [
+                $datum['admin_user'],
+                $datum['performance'],
+                $datum['trans_rate'],
+                $datum['performance_rate'],
+                $datum['cash_value'],
+            ];
+        }
+        return $newData;
     }
 
     //图表统计
     public function chart(){
+        $filter = $this->request->post();
+        if(!empty($filter['daterange'])){
+            $arr = explode(' - ',$filter['daterange']);
+            if(trim($arr[0])){
+                $filter['start_time'] = trim($arr[0]);
+            }
+            if(trim($arr[1])){
+                $filter['end_time'] = trim($arr[1]).' 23:59:59';
+            }
+        }
 
-        $filter = $this->request->param('filter/a',[]);
 
         $orderValid = implode(',',$this->model->tabStatus(Order::TAB_VALID));
 
@@ -106,9 +129,8 @@ class Dispatcher extends Backend
             }else{                  //按录单时间
                 $time_field = 'create_time';
             }
-            $builder->whereBetween($time_field,$filter['start_time'],$filter['end_time']);
+            $builder->whereBetween($time_field,[$filter['start_time'],$filter['end_time']]);
         }
-
         //城市
         if(!empty($filter['area_id'])){
             $builder->where('area_id',$filter['area_id']);
@@ -121,11 +143,13 @@ class Dispatcher extends Backend
 
         $newData = [];
 
+
+        if(!empty($data)){
             foreach ($data as $datum){
                 //利润率 = 总业绩/总成效额
-            $datum->performance_rate = $this->_calc($datum->performance,$datum->total);
+                $datum->performance_rate = $this->_calc($datum->performance,$datum->total,4,true);
                 //转化率 = 完单数 / 总订单数
-            $datum->trans_rate = $this->_calc($datum->finish_num,$datum->count_num);
+                $datum->trans_rate = $this->_calc($datum->finish_num,$datum->count_num,4,true);
                 //变现值 = 总业绩 / 总订单数
                 $datum->cash_value = $this->_calc($datum->performance,$datum->count_num,2);
                 //客单利润 = 总利润 / 完单数
@@ -133,10 +157,17 @@ class Dispatcher extends Backend
                 //客单价 = 总成效额 / 完单数
                 $datum->total_avg = $this->_calc($datum->total,$datum->finish_num,2);
 
+                $datum->admin_user = Admin::where($datum->dispatch_admin_id)->value('nickname')??'未知';
+
                 $newData[] = $datum->toArray();
             }
+        }
 
-        dump($newData);exit;
+
+
+
+        return $newData;
+        //dump($newData);exit;
     }
 
 
@@ -146,8 +177,14 @@ class Dispatcher extends Backend
      * @param $scale
      * @return int|string
      */
-    private function _calc($a,$b,$scale=4){
+    private function _calc($a,$b,$scale=4,$is_percent=false){
-        return $b > 0 ? bcdiv($a,$b,$scale) : 0;
+        $val =  $b > 0 ? bcdiv($a,$b,$scale) : 0;
+
+        if($is_percent){
+
+            return bcmul($val,100,2);
+        }
+        return $val;
     }
 
 }

application/admin/view/statistics/dispatcher/index.html

@@ -1,46 +1,66 @@
 <div class="panel panel-default panel-intro">
-    
     <div class="panel-heading">
-        {:build_heading(null,FALSE)}
+        <!--<div class="panel-lead"><em>多表格（Multitable）</em>用于展示在一个页面展示多个表格数据,并且每次切换时刷新</div>-->
-        <ul class="nav nav-tabs" data-field="status">
+        <ul class="nav nav-tabs">
-            <li class="{:$Think.get.status === null ? 'active' : ''}"><a href="#t-all" data-value="" data-toggle="tab">{:__('All')}</a></li>
+            <li class="active"><a href="#first" data-toggle="tab">统计图表</a></li>
-            {foreach name="statusList" item="vo"}
+            <li><a href="#second" data-toggle="tab">统计列表</a></li>
-            <li class="{:$Think.get.status === (string)$key ? 'active' : ''}"><a href="#t-{$key}" data-value="{$key}" data-toggle="tab">{$vo}</a></li>
-            {/foreach}
         </ul>
     </div>
 
 
     <div class="panel-body">
         <div id="myTabContent" class="tab-content">
-            <div class="tab-pane fade active in" id="one">
+            <div class="tab-pane fade active in" id="first">
-                <div class="widget-body no-padding">
+                <section class="connectedSortable">
-                    <div id="toolbar" class="toolbar">
-                        <a href="javascript:;" class="btn btn-primary btn-refresh" title="{:__('Refresh')}" ><i class="fa fa-refresh"></i> </a>
-                        <a href="javascript:;" class="btn btn-success btn-add {:$auth->check('statistics/dispatcher/add')?'':'hide'}" title="{:__('Add')}" ><i class="fa fa-plus"></i> {:__('Add')}</a>
-                        <a href="javascript:;" class="btn btn-success btn-edit btn-disabled disabled {:$auth->check('statistics/dispatcher/edit')?'':'hide'}" title="{:__('Edit')}" ><i class="fa fa-pencil"></i> {:__('Edit')}</a>
-                        <a href="javascript:;" class="btn btn-danger btn-del btn-disabled disabled {:$auth->check('statistics/dispatcher/del')?'':'hide'}" title="{:__('Delete')}" ><i class="fa fa-trash"></i> {:__('Delete')}</a>
 
+                    <div class="nav-tabs-custom charts-custom">
+                        <!-- Tabs within a box -->
+                        <ul class="nav nav-tabs pull-right">
+                            <li class="active"><a href="#bar-chart" data-toggle="tab">柱状图</a></li>
+                        <!--    <li><a href="#pie-chart" data-toggle="tab">饼图</a></li>-->
 
-                        <div class="dropdown btn-group {:$auth->check('statistics/dispatcher/multi')?'':'hide'}">
+                            <li class="pull-left header"><i class="fa fa-inbox"></i> 派单员数据</li>
-                            <a class="btn btn-primary btn-more dropdown-toggle btn-disabled disabled" data-toggle="dropdown"><i class="fa fa-cog"></i> {:__('More')}</a>
-                            <ul class="dropdown-menu text-left" role="menu">
-                                {foreach name="statusList" item="vo"}
-                                <li><a class="btn btn-link btn-multi btn-disabled disabled" href="javascript:" data-params="status={$key}">{:__('Set status to ' . $key)}</a></li>
-                                {/foreach}
                         </ul>
+
+                        <div>
+
+                            <div class="form-inline" id="chart-filter" style="margin-top:20px;margin-bottom: 30px;">
+                                <!-- 单选：维度 -->
+                                <div class="form-group">
+                                    <label class="radio-inline">
+                                        <input type="radio" name="filter[time_by]" value="1" checked> 派单时间
+                                    </label>
+                                    <label class="radio-inline">
+                                        <input type="radio" name="filter[time_by]" value="2"> 录单时间
+                                    </label>
                                 </div>
 
+                                <!-- 时间范围 -->
+                                <div class="form-group" style="margin-left: 15px;">
+                                    <input type="text" class="form-control datetimerange" data-locale='{"format":"YYYY-MM-DD"}' placeholder="指定日期" name="filter[daterange]" id="daterange" value="{$daterange}" autocomplete="off" style="width: 170px;">
+                                </div>
+
+                                <!-- 查询按钮 -->
+                                <button class="btn btn-default" id="filter-btn" style="margin-left: 15px;">查询</button>
+                            </div>
 
                         </div>
-                    <table id="table" class="table table-striped table-bordered table-hover table-nowrap"
+
-                           data-operate-edit="{:$auth->check('statistics/dispatcher/edit')}"
+                        <div class="tab-content no-padding">
-                           data-operate-del="{:$auth->check('statistics/dispatcher/del')}"
+                            <!-- Morris chart - Sales -->
-                           width="100%">
+<!--
+                            <div class="chart tab-pane" id="pie-chart" style="width: 100%; height: 500px;"></div>
+-->
+                            <div class="chart tab-pane active" id="bar-chart" style="width: 100%; height: 500px;"></div>
+                        </div>
+                    </div>
+
+                </section>
+            </div>
+            <div class="tab-pane fade" id="second">
+                <table id="table2" class="table table-striped table-bordered table-hover" width="100%">
                 </table>
             </div>
         </div>
-
-        </div>
     </div>
 </div>

public/assets/js/backend/statistics/dispatcher.js

@@ -1,87 +1,160 @@
-define(['jquery', 'bootstrap', 'backend', 'table', 'form'], function ($, undefined, Backend, Table, Form) {
+define(['jquery', 'bootstrap', 'backend', 'table', 'form', 'echarts', 'echarts-theme', 'template','addtabs','moment'], function ($, undefined, Backend, Table, Form,Echarts,undefined,Template,Datatable,Moment) {
 
     var Controller = {
+
         index: function () {
             // 初始化表格参数配置
-            Table.api.init({
+            Table.api.init();
-                extend: {
+
-                    index_url: 'statistics/dispatcher/index' + location.search,
+            //绑定事件
-                    add_url: 'statistics/dispatcher/add',
+           /* $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
-                    edit_url: 'statistics/dispatcher/edit',
+                var panel = $($(this).attr("href"));
-                    del_url: 'statistics/dispatcher/del',
+                if (panel.length > 0) {
-                    multi_url: 'statistics/dispatcher/multi',
+                    /!*Controller.table[panel.attr("id")].call(this);
-                    import_url: 'statistics/dispatcher/import',
+                    $(this).on('click', function (e) {
-                    table: 'order',
+                       // $($(this).attr("href")).find(".btn-refresh").trigger("click");
+                    });*!/
+                }
+                //移除绑定的事件
+                $(this).unbind('shown.bs.tab');
+            });*/
+
+            //必须默认触发shown.bs.tab事件
+            /*$('ul.nav-tabs li.active a[data-toggle="tab"]').trigger("shown.bs.tab");
+
+            var barChart = Echarts.init(document.getElementById('bar-chart'), 'walden');
+            var option = {
+                legend: {},
+                tooltip: {},
+                dataset: {
+                    source: [
+                        ['产品销售', '2015', '2016', '2017'],
+                        ['风扇', 43.3, 85.8, 93.7],
+                        ['电视机', 83.1, 73.4, 55.1],
+                        ['空调', 86.4, 65.2, 82.5],
+                        ['冰箱', 72.4, 53.9, 39.1]
+                    ]
+                },
+                xAxis: {type: 'category'},
+                yAxis: {},
+                // Declare several bar series, each will be mapped
+                // to a column of dataset.source by default.
+                series: [
+                    {type: 'bar'},
+                    {type: 'bar'},
+                    {type: 'bar'}
+                ]
+            };
+            // 使用刚指定的配置项和数据显示图表。
+            barChart.setOption(option);*/
+
+            // 触发 tab 后发起 ajax 获取图表数据
+            $('ul.nav-tabs li.active a[data-toggle="tab"]').on("shown.bs.tab", function () {
+                getChartData();
+            });
+
+
+            function getChartData(){
+                // 获取单选框选中的值
+                var timeBy = $('input[name="filter[time_by]"]:checked').val();
+
+                // 获取日期范围值
+                var daterange = $('#daterange').val();
+
+                // 构建查询参数
+                var params = {
+                    'time_by': timeBy,
+                    'daterange': daterange
+                };
+
+                $.ajax({
+                    url: "statistics/dispatcher/chartData", // 替换为你的接口地址
+                    type: "POST",
+                    dataType: "json",
+                    data:params,
+                    success: function (response) {
+                        // 假设返回的数据结构是
+                        // response = {
+                        //   source: [
+                        //     ['产品销售', '2015', '2016', '2017'],
+                        //     ['风扇', 43.3, 85.8, 93.7],
+                        //     ...
+                        //   ]
+                        // }
+
+                        var barChart = Echarts.init(document.getElementById('bar-chart'), 'walden');
+                        var option = {
+                            legend: {},
+                            tooltip: {},
+                            dataset: {
+                                source: response
+                            },
+                            xAxis: { type: 'category' },
+                            yAxis: {},
+                            series: [
+                                { type: 'bar' },
+                                { type: 'bar' },
+                                { type: 'bar' },
+                                { type: 'bar' }
+                            ]
+                        };
+                        barChart.setOption(option);
+                    },
+                    error: function () {
+                        console.error("图表数据加载失败");
                     }
                 });
+            }
 
-            var table = $("#table");
 
-            // 初始化表格
+
-            table.bootstrapTable({
+
-                url: $.fn.bootstrapTable.defaults.extend.index_url,
+            var form = $("#chart-filter");
-                pk: 'id',
+            var ranges = {};
-                sortName: 'id',
+            ranges[__('Today')] = [Moment().startOf('day'), Moment().endOf('day')];
-                fixedColumns: true,
+            ranges[__('Yesterday')] = [Moment().subtract(1, 'days').startOf('day'), Moment().subtract(1, 'days').endOf('day')];
-                fixedRightNumber: 1,
+            ranges[__('Last 7 Days')] = [Moment().subtract(6, 'days').startOf('day'), Moment().endOf('day')];
-                columns: [
+            ranges[__('Last 30 Days')] = [Moment().subtract(29, 'days').startOf('day'), Moment().endOf('day')];
-                    [
+            ranges[__('This Month')] = [Moment().startOf('month'), Moment().endOf('month')];
-                        {checkbox: true},
+            ranges[__('Last Month')] = [Moment().subtract(1, 'month').startOf('month'), Moment().subtract(1, 'month').endOf('month')];
-                        {field: 'id', title: __('Id')},
+            ranges[__('今年')] = [Moment().startOf('year'), Moment().endOf('year')];
-                        {field: 'order_no', title: __('Order_no'), operate: 'LIKE'},
+            var options = {
-                        {field: 'customer', title: __('Customer'), operate: 'LIKE'},
+                timePicker: false,
-                        {field: 'tel', title: __('Tel'), operate: 'LIKE'},
+                autoUpdateInput: false,
-                        {field: 'status', title: __('Status'), searchList: {"0":__('Status 0'),"10":__('Status 10'),"20":__('Status 20'),"30":__('Status 30'),"40":__('Status 40'),"50":__('Status 50'),"60":__('Status 60'),"-10":__('Status -10')}, formatter: Table.api.formatter.status},
+                timePickerSeconds: true,
-                        {field: 'area_id', title: __('Area_id'), operate: 'LIKE'},
+                timePicker24Hour: true,
-                        {field: 'address', title: __('Address'), operate: 'LIKE', table: table, class: 'autocontent', formatter: Table.api.formatter.content},
+                autoApply: true,
-                        {field: 'lng', title: __('Lng'), operate:'BETWEEN'},
+                locale: {
-                        {field: 'lat', title: __('Lat'), operate:'BETWEEN'},
+                    format: 'YYYY-MM-DD',
-                        {field: 'work_tel_id', title: __('Work_tel_id')},
+                    customRangeLabel: __("Custom Range"),
-                        {field: 'source_shop', title: __('Source_shop'), operate: 'LIKE'},
+                    applyLabel: __("Apply"),
-                        {field: 'source', title: __('Source')},
+                    cancelLabel: __("Clear"),
-                        {field: 'source_uid', title: __('Source_uid'), operate: 'LIKE'},
+                },
-                        {field: 'item_id', title: __('Item_id')},
+                ranges: ranges,
-                        {field: 'item_title', title: __('Item_title'), operate: 'LIKE'},
+            };
-                        {field: 'detail', title: __('Detail'), operate: 'LIKE', table: table, class: 'autocontent', formatter: Table.api.formatter.content},
+            var callback = function (start, end) {
-                        {field: 'remark', title: __('Remark'), operate: 'LIKE', table: table, class: 'autocontent', formatter: Table.api.formatter.content},
+                $(this.element).val(start.format(options.locale.format) + " - " + end.format(options.locale.format));
-                        {field: 'images', title: __('Images'), operate: false, events: Table.api.events.image, formatter: Table.api.formatter.images},
+            };
-                        {field: 'plan_time', title: __('Plan_time'), operate:'RANGE', addclass:'datetimerange', autocomplete:false},
+            require(['bootstrap-daterangepicker'], function () {
-                        {field: 'admin_id', title: __('Admin_id')},
+                $(".datetimerange", form).each(function () {
-                        {field: 'coupon_id', title: __('Coupon_id')},
+                    $(this).on('apply.daterangepicker', function (ev, picker) {
-                        {field: 'total', title: __('Total'), operate:'BETWEEN'},
+                        callback.call(picker, picker.startDate, picker.endDate);
-                        {field: 'online_amount', title: __('Online_amount'), operate:'BETWEEN'},
+                        var label = picker.chosenLabel;
-                        {field: 'offline_amount', title: __('Offline_amount'), operate:'BETWEEN'},
+                        $(picker.element).data('label', label).trigger("change");
-                        {field: 'online_amount_last', title: __('Online_amount_last'), operate:'BETWEEN'},
+                    });
-                        {field: 'offline_amount_type', title: __('Offline_amount_type'), searchList: {"1":__('Offline_amount_type 1'),"2":__('Offline_amount_type 2')}, formatter: Table.api.formatter.normal},
+                    $(this).on('cancel.daterangepicker', function (ev, picker) {
-                        {field: 'discount_amount', title: __('Discount_amount'), operate:'BETWEEN'},
+                        $(this).val('');
-                        {field: 'refund_amount', title: __('Refund_amount'), operate:'BETWEEN'},
+                    });
-                        {field: 'worker_refund_amount', title: __('Worker_refund_amount'), operate:'BETWEEN'},
+                    $(this).daterangepicker($.extend({}, options), callback);
-                        {field: 'real_amount', title: __('Real_amount'), operate:'BETWEEN'},
+                });
-                        {field: 'cost', title: __('Cost'), operate:'BETWEEN'},
-                        {field: 'material_cost', title: __('Material_cost'), operate:'BETWEEN'},
-                        {field: 'performance', title: __('Performance'), operate:'BETWEEN'},
-                        {field: 'cancel_reason_id', title: __('Cancel_reason_id')},
-                        {field: 'cancel_detail', title: __('Cancel_detail'), operate: 'LIKE', table: table, class: 'autocontent', formatter: Table.api.formatter.content},
-                        {field: 'audit_remark', title: __('Audit_remark'), operate: 'LIKE', table: table, class: 'autocontent', formatter: Table.api.formatter.content},
-                        {field: 'audit_admin_id', title: __('Audit_admin_id')},
-                        {field: 'create_time', title: __('Create_time'), operate:'RANGE', addclass:'datetimerange', autocomplete:false},
-                        {field: 'update_time', title: __('Update_time'), operate:'RANGE', addclass:'datetimerange', autocomplete:false},
-                        {field: 'delete_time', title: __('Delete_time'), operate:'RANGE', addclass:'datetimerange', autocomplete:false},
-                        {field: 'dispatch_type', title: __('Dispatch_type')},
-                        {field: 'receive_type', title: __('Receive_type')},
-                        {field: 'revisit_id', title: __('Revisit_id')},
-                        {field: 'dispatch_admin_id', title: __('Dispatch_admin_id')},
-                        {field: 'dispatch_admin_user', title: __('Dispatch_admin_user'), operate: 'LIKE'},
-                        {field: 'dispatch_time', title: __('Dispatch_time'), operate:'RANGE', addclass:'datetimerange', autocomplete:false},
-                        {field: 'aftersale_id', title: __('Aftersale_id')},
-                        {field: 'amount_images', title: __('Amount_images'), operate: false, events: Table.api.events.image, formatter: Table.api.formatter.images},
-                        {field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, formatter: Table.api.formatter.operate}
-                    ]
-                ]
             });
 
-            // 为表格绑定事件
+            // 手动触发一次激活 tab 的 shown.bs.tab
-            Table.api.bindevent(table);
+            getChartData();
+            // 绑定查询按钮的点击事件
+            $('#filter-btn').on('click', function() {
+                getChartData();
+            });
         },
         add: function () {
             Controller.api.bindevent();