diff --git a/application/admin/controller/statistics/Item.php b/application/admin/controller/statistics/Item.php index 437cb35..1dbfa30 100644 --- a/application/admin/controller/statistics/Item.php +++ b/application/admin/controller/statistics/Item.php @@ -56,8 +56,6 @@ class Item extends Backend $end_at = trim($arr[1]) . ' 23:29:59'; } } - $offset = request()->get('offset',0); - $limit = request()->get('limit',15); $build->whereBetween('create_time', [$start, $end_at]) ->field([ 'item_title name', // 类型 diff --git a/application/admin/view/statistics/item/index.html b/application/admin/view/statistics/item/index.html index 749ac6e..2613f89 100644 --- a/application/admin/view/statistics/item/index.html +++ b/application/admin/view/statistics/item/index.html @@ -43,6 +43,15 @@
+
+ + + + + + + +
diff --git a/public/assets/js/backend/statistics/item.js b/public/assets/js/backend/statistics/item.js index 97349e2..44a0583 100644 --- a/public/assets/js/backend/statistics/item.js +++ b/public/assets/js/backend/statistics/item.js @@ -1,9 +1,11 @@ -define(['jquery', 'bootstrap', 'backend', 'table', 'form', 'echarts', 'echarts-theme', 'template','addtabs','moment'], function ($, undefined, Backend, Table, Form,echarts,undefined,Template,Datatable,Moment) { +define(['jquery', 'bootstrap', 'backend', 'table', 'form', 'echarts', 'echarts-theme', 'template', 'addtabs', 'moment','citypicker'], function ($, undefined, Backend, Table, Form, echarts, undefined, Template, Datatable, Moment) { var Controller = { index: function () { //绑定事件 + Controller.api.datepicker(); + Controller.api.areapicker(); $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) { var $targetPanel = $($(this).attr("href")); var tabVal = $(this).data('val'); @@ -20,19 +22,19 @@ define(['jquery', 'bootstrap', 'backend', 'table', 'form', 'echarts', 'echarts-t toolbar: '#toolbar1', sortName: 'id', search: false, - commonSearch:true, + commonSearch: false, visible: false, showToggle: false, showColumns: false, showExport: true, - searchFormVisible:true, + searchFormVisible: true, columns: [ [ // {field: 'id', title: __('ID'),visible:true,operate: false}, - {field: 'name', title: '项目类型',operate: false}, + {field: 'name', title: '项目类型', operate: false}, {field: 'total', title: __('成效额(￥)'), operate: false}, {field: 'performance', title: __('总业绩(￥)'), operate: false}, - {field: 'count_num', title: __('总订单数'),operate: false}, + {field: 'count_num', title: __('总订单数'), operate: false}, {field: 'performance_rate', title: __('利润率(%)'), operate: false}, @@ -45,40 +47,10 @@ define(['jquery', 'bootstrap', 'backend', 'table', 'form', 'echarts', 'echarts-t {field: 'avg_time_diff', title: __('派单时效(小时)'), operate: false}, {field: 'cost_total', title: __('总成本(￥)'), operate: false}, - {field: 'finish_num', title: __('完单数'),operate: false}, + {field: 'finish_num', title: __('完单数'), operate: false}, {field: 'refund_count', title: __('退款单数'), operate: false}, {field: 'refund_total', title: __('退款金额(￥)'), operate: false}, - - {field: 'daterange', title: __('时间筛选'), addclass:'datetimerange', - autocomplete:false, - operate: "RANGE", - datetimeFormat: "YYYY-MM-DD", - //defaultValue:today()+' - '+today(), - data:'autocomplete="off" data-local={"format":"YYYY-MM-DD"}', - visible:false, - defaultValue: Config.default_daterange - }, - // {field: 'operate', title: __('Operate'), table: table2, events: - // Table.api.events.operate, - // formatter: Table.api.formatter.operate, - // buttons: [ - // { - // name: 'aftersales', - // text:"售后列表", - // title:"售后列表", - // icon: 'fa fa-list', - // url: function(row){ - // return 'aftersales/aftersale/index?from=2&man_id='+row.id; - // }, - // extend: 'data-toggle="tooltip" data-container="body"', - // classname: 'btn btn-xs btn-default btn-dialog', - // visible:function(row){ - // return true; - // } - // }, - // ] - // } ] ] }); @@ -87,84 +59,17 @@ define(['jquery', 'bootstrap', 'backend', 'table', 'form', 'echarts', 'echarts-t } }); - // 触发 tab 后发起 ajax 获取图表数据 $('ul.nav-tabs li.active a[data-toggle="tab"]').on("shown.bs.tab", function () { - getChartData(); + Controller.api.getChartData(); }); - function getChartData(){ - // 获取日期范围值 - var daterange = $('#daterange').val(); - - // 构建查询参数 - var params = { - 'daterange': daterange, - }; - - $.ajax({ - url: "statistics/item/chartData", // - type: "POST", - dataType: "json", - data:params, - success: function (response) { - Controller.api.chart(response); - }, - error: function () { - console.error("图表数据加载失败"); - } - }); - } - - - - - var form = $("#chart-filter"); - var ranges = {}; - ranges[__('Today')] = [Moment().startOf('day'), Moment().endOf('day')]; - ranges[__('Yesterday')] = [Moment().subtract(1, 'days').startOf('day'), Moment().subtract(1, 'days').endOf('day')]; - ranges[__('Last 7 Days')] = [Moment().subtract(6, 'days').startOf('day'), Moment().endOf('day')]; - ranges[__('Last 30 Days')] = [Moment().subtract(29, 'days').startOf('day'), Moment().endOf('day')]; - ranges[__('This Month')] = [Moment().startOf('month'), Moment().endOf('month')]; - ranges[__('Last Month')] = [Moment().subtract(1, 'month').startOf('month'), Moment().subtract(1, 'month').endOf('month')]; - ranges[__('今年')] = [Moment().startOf('year'), Moment().endOf('year')]; - var options = { - timePicker: false, - autoUpdateInput: false, - timePickerSeconds: true, - timePicker24Hour: true, - autoApply: true, - locale: { - format: 'YYYY-MM-DD', - customRangeLabel: __("Custom Range"), - applyLabel: __("Apply"), - cancelLabel: __("Clear"), - }, - ranges: ranges, - }; - var callback = function (start, end) { - $(this.element).val(start.format(options.locale.format) + " - " + end.format(options.locale.format)); - }; - require(['bootstrap-daterangepicker'], function () { - $(".datetimerange", form).each(function () { - $(this).on('apply.daterangepicker', function (ev, picker) { - callback.call(picker, picker.startDate, picker.endDate); - var label = picker.chosenLabel; - $(picker.element).data('label', label).trigger("change"); - }); - $(this).on('cancel.daterangepicker', function (ev, picker) { - $(this).val(''); - }); - $(this).daterangepicker($.extend({}, options), callback); - }); - }); - // 手动触发一次激活 tab 的 shown.bs.tab - getChartData(); + Controller.api.getChartData(); // 绑定查询按钮的点击事件 - $('#filter-btn').on('click', function() { - getChartData(); + $('#filter-btn').on('click', function () { + Controller.api.getChartData(); }); }, @@ -183,11 +88,11 @@ define(['jquery', 'bootstrap', 'backend', 'table', 'form', 'echarts', 'echarts-t bindevent: function () { Form.api.bindevent($("form[role=form]")); }, - chart(chartData){ + chart(chartData) { const option = { tooltip: { trigger: 'axis', - axisPointer: { type: 'shadow' } + axisPointer: {type: 'shadow'} }, legend: { data: chartData.series.map(s => s.name) @@ -197,20 +102,84 @@ define(['jquery', 'bootstrap', 'backend', 'table', 'form', 'echarts', 'echarts-t data: chartData.xAxis }, yAxis: [ - { type: 'value', name: '金额 (¥)' }, - { type: 'value', name: '比率 (%)' } + {type: 'value', name: '金额 (¥)'}, + {type: 'value', name: '比率 (%)'} ], series: chartData.series }; - -// 初始化图表 + // 初始化图表 const myChart = echarts.init(document.getElementById('bar-chart')); myChart.setOption(option); // 监听窗口大小变化，自动重新绘制图表 - window.addEventListener('resize', function() { + window.addEventListener('resize', function () { myChart.resize(); }); + }, + datepicker: function () { + var ranges = {}; + ranges[__('Today')] = [Moment().startOf('day'), Moment().endOf('day')]; + ranges[__('Yesterday')] = [Moment().subtract(1, 'days').startOf('day'), Moment().subtract(1, 'days').endOf('day')]; + ranges[__('Last 7 Days')] = [Moment().subtract(6, 'days').startOf('day'), Moment().endOf('day')]; + ranges[__('Last 30 Days')] = [Moment().subtract(29, 'days').startOf('day'), Moment().endOf('day')]; + ranges[__('This Month')] = [Moment().startOf('month'), Moment().endOf('month')]; + ranges[__('Last Month')] = [Moment().subtract(1, 'month').startOf('month'), Moment().subtract(1, 'month').endOf('month')]; + ranges[__('今年')] = [Moment().startOf('year'), Moment().endOf('year')]; + var options = { + timePicker: false, + autoUpdateInput: false, + timePickerSeconds: true, + timePicker24Hour: true, + autoApply: true, + locale: { + format: 'YYYY-MM-DD', + customRangeLabel: __("Custom Range"), + applyLabel: __("Apply"), + cancelLabel: __("Clear"), + }, + ranges: ranges, + }; + var callback = function (start, end) { + $(this.element).val(start.format(options.locale.format) + " - " + end.format(options.locale.format)); + }; + require(['bootstrap-daterangepicker'], function () { + $(".datetimerange").each(function () { + $(this).on('apply.daterangepicker', function (ev, picker) { + callback.call(picker, picker.startDate, picker.endDate); + var label = picker.chosenLabel; + $(picker.element).data('label', label).trigger("change"); + }); + $(this).on('cancel.daterangepicker', function (ev, picker) { + $(this).val(''); + }); + $(this).daterangepicker($.extend({}, options), callback); + }); + }); + }, + areapicker: function () { + $("#area-table").citypicker(); + }, + getChartData: function () { + // 获取日期范围值 + var daterange = $('#daterange').val(); + + // 构建查询参数 + var params = { + 'daterange': daterange, + }; + + $.ajax({ + url: "statistics/item/chartData", // + type: "POST", + dataType: "json", + data: params, + success: function (response) { + Controller.api.chart(response); + }, + error: function () { + console.error("图表数据加载失败"); + } + }); } } };