screen/public/assets/js/backend/overview.js

define(['jquery', 'bootstrap', 'backend', 'addtabs', 'table', 'echarts', 'echarts-theme', 'template','form'], function ($, undefined, Backend, Datatable, Table, Echarts, undefined, Template,Form) {

    return {
        index: function () {
            Form.events.daterangepicker($('form'))
            // 基于准备好的dom，初始化echarts实例
            var myChart = Echarts.init(document.getElementById('echart'), 'walden');
            var myChart1 = Echarts.init(document.getElementById('echart1'), 'walden');

            // 指定图表的配置项和数据
            var option = {
                title: {
                    text: '各支付方式订单数',

                    left: 'center'
                },
                xAxis: {
                    type: 'category',
                    data: Config.type_column
                },
                yAxis: {
                    type: 'value'
                },
                tooltip: {
                    trigger: 'item'
                },
                series: [
                    {

                        data: Config.type_data,
                        type: 'bar',
                        showBackground: true,
                        itemStyle: {
                            normal: {
                                color: function (params) {
                                    // build a color map as your need.
                                    var colorList = [
                                        '#C1232B', '#B5C334', '#FCCE10', '#E87C25', '#27727B',
                                        '#FE8463', '#9BCA63', '#FAD860', '#F3A43B', '#60C0DD',
                                        '#D7504B', '#C6E579', '#F4E001', '#F0805A', '#26C0C0'
                                    ];
                                    return colorList[params.dataIndex]
                                }
                            }
                        },
                    }
                ]
            };

            var option1 = {
                title: {
                    text: '支付方式占比',

                    left: 'center'
                },
                tooltip: {
                    trigger: 'item'
                },
                legend: {
                    orient: 'vertical',
                    left: 'left'
                },
                series: [{
                    name: '',
                    type: 'pie', // 设置图表类型为饼图
                    radius: '55%', // 饼图的半径，外半径为可视区尺寸（容器高宽中较小一项）的 55% 长度。
                    color: ['#37A2DA', '#32C5E9'],
                    label: {
                        normal: {
                            show: true,
                            formatter: '{b}: {c}({d}%)'
                        }
                    },
                    data: [
                        {value: Config.type_data[0], name: Config.type_column[0]},
                        {value: Config.type_data[1], name: Config.type_column[1]},
                        {value: Config.type_data[2], name: Config.type_column[2]},
                        {value: Config.type_data[3], name: Config.type_column[3]},
                        {value: Config.type_data[4], name: Config.type_column[4]},
                        {value: Config.type_data[5], name: Config.type_column[5]}
                    ],
                }]

            };


            // 使用刚指定的配置项和数据显示图表。
            myChart.setOption(option);
            myChart1.setOption(option1);

            Table.api.init()
            var table = $("#table");
            table.bootstrapTable({
                url: location.href,
                pk: 'id',
                sortName: 'amount_profit',
                searchFormVisible: true,
                showExport: true,
                commonSearch: true,
                search: false,
                columns: [
                    [
                        {field: 'rank', title: __('排名'), operate: false,},
                        {field: 'order_no', title: __('订单号'), operate: false,},
                        {field: 'amount_profit', title: __('毛利'), operate: false,sortable:true},
                        {field: 'amount_profit_per', title: __('毛利率'), operate: false,sortable:true},
                        {field: 'date', title: __('时间'), operate: 'range', addClass: 'datetimerange', visible: false,defaultValue:defDate},
                    ]
                ]
            });
            Table.api.bindevent(table);
        },
        seller_statistics() {
            Form.api.bindevent($('.form'))
            Table.api.init()
            var table = $("#table");
            var table1 = $("#table1");
            // 初始化表格
            table.bootstrapTable({
                url: location.href+'&type=1',
                pk: 'id',
                sortName: 'id',
                searchFormVisible: true,
                showExport: true,
                commonSearch: true,
                search: false,
                columns: [
                    [
                        {field: 'rank', title: __('排名'), operate: false,},
                        {field: 'nickname', title: __('销售人'), operate: false,},
                        {field: 'amount', title: __('销售额'), operate: false,},
                        {field: 'date', title: __('时间'), operate: 'range', addClass: 'datetimerange', visible: false,defaultValue:defDate},
                    ]
                ]
            });
            table1.bootstrapTable({
                url: location.href+'&type=2',
                pk: 'id',
                sortName: 'id',
                searchFormVisible: true,
                showExport: true,
                commonSearch: true,
                search: false,
                columns: [
                    [
                        {field: 'rank', title: __('排名'), operate: false,},
                        {field: 'nickname', title: __('销售人'), operate: false,},
                        {field: 'amount', title: __('提成额'), operate: false,},
                        {field: 'date', title: __('时间'), operate: 'range', addClass: 'datetimerange', visible: false,defaultValue:defDate},
                    ]
                ]
            });
            Table.api.bindevent(table);
            Table.api.bindevent(table1);
        }
    };
});