Merge remote-tracking branch 'origin/feature/hant' into feature/hant
This commit is contained in:
commit
83a19267e8
|
|
@ -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', // 类型
|
||||
|
|
|
|||
|
|
@ -43,6 +43,15 @@
|
|||
</section>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="second">
|
||||
<div id="chart-filter-table" style="margin-top:20px;margin-bottom: 30px;">
|
||||
|
||||
<input class="form-control" data-toggle="city-picker" type="text" placeholder="地区" id="area-table">
|
||||
|
||||
<input type="text" class="form-control datetimerange" data-locale='{"format":"YYYY-MM-DD"}' placeholder="指定日期" name="filter[daterange]" id="daterange-table" autocomplete="off" style="width: 180px;">
|
||||
|
||||
<!-- 查询按钮 -->
|
||||
<button class="btn btn-default" id="filter-btn-table" style="margin-left: 15px;">查询</button>
|
||||
</div>
|
||||
<table id="table2" class="table table-striped table-bordered table-hover">
|
||||
</table>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -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("图表数据加载失败");
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user