935090232@qq.com
2020-12-02 f0a4a0eb23c868a5d4b78980b9e1d6eaea66b158
zq-erp/src/main/resources/templates/views/admin/hive-erp/analysis/customerFlow.html
@@ -12,7 +12,12 @@
    <script type="text/javascript"
            th:src="@{/js/plugin/jquery-2.1.4.min.js}"></script>
    <script type="text/javascript" th:src="@{/js/systools/MBase.js}"></script>
    <style>
        .echarts {
            height: 400px
        }
    </style>
</head>
<body class=" container-fluid">
@@ -55,30 +60,17 @@
    <div class="row chartsBox "  style="margin-top: 40px">
        <div class=" col-md-12">
            <div class="echarts" id="echarts-line-chart1"></div>
        </div>
    </div>
    <div class="row chartsBox "  style="margin-top: 40px">
        <div class=" col-md-12">
            <div class="echarts" id="echarts-line-chart2"></div>
        </div>
    </div>
   <!-- <div class="row chartsBox "  style="margin-top: 40px">
        <div class=" col-md-12" id="table">
            <table class="table table-striped" >
                <thead>
                <tr>
                    <th>时间</th>
                    <th v-for="name in legend" >{{name}}</th>
                </tr>
                </thead>
                <tbody>
                <tr v-for="(item,index) in xAxis">
                    <td>{{item}}</td>
                    <td v-for="data in series[index].data" >{{data}}</td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>
-->
</div>
<script type="text/javascript" th:src="@{/js/systools/MJsBase.js}"></script>
@@ -88,7 +80,7 @@
<script type="text/javascript" th:src="@{/plugin/StringUtil.js}"></script>
<script type="text/javascript" th:src="@{/plugin/moment.min.js}"></script>
<script type="text/javascript" th:src="@{/js/systools/ChartsUtils.js}"></script>
<script type="text/javascript" th:src="@{/js/plugin/vue.js}"></script>
<script>
@@ -98,11 +90,14 @@
    // 基于准备好的dom,初始化echarts实例
    var myChart1 = echarts.init(document.getElementById('echarts-line-chart1'), 'macarons');
    var myChart2 = echarts.init(document.getElementById('echarts-line-chart2'), 'macarons');
    myChart2.on('click', function (params) {
   /*
   点击事件
   myChart1.on('click', function (params) {
        console.log(params);
    });
*/
    // 指定图表的配置项和数据
    function getption(title) {
        return {
@@ -138,12 +133,6 @@
            yAxis: {
                type: 'value'
            },
            series: [{
                name: '人头数',
                type: 'line',
                smooth: true,
                data: [1,2]
            }],
            dataZoom: [
                {
                    id: 'dataZoomX',
@@ -153,8 +142,8 @@
                }
            ],
            animation: true,
            animationDuration: 1000,
            animationDurationUpdate: 1000,
            animationDuration: 500,
            animationDurationUpdate: 500,
            animationEasing: 'linear',
            animationEasingUpdate: 'linear',
        }
@@ -166,7 +155,7 @@
    //加载数据
    function loadData() {
        //加载门店客流对比
        myChart2.showLoading();
        myChart1.showLoading();
        $.AjaxProxy({
            p: MForm.toJson("#serchform"),
            c: false,
@@ -181,28 +170,41 @@
                option.xAxis.data = map.xAxis;
                console.log(option);
                // 使用刚指定的配置项和数据显示图表。
                myChart1.setOption(option);
                myChart1.hideLoading();
            });
    }
    var chartsUtils1 = new ChartsUtils(loadData);
    chartsUtils1.setDataPackTimeValue();
    chartsUtils1.loadChartData();
    //加载数据2
    function loadData2() {
        //加载门店客流对比
        myChart2.showLoading();
        $.AjaxProxy({
            p: MForm.toJson("#serchform"),
            c: false,
        }).invoke(basePath+"/admin/analysis/customerEnterCountCompare",
            function (loj) {
                var map = loj.getValue("mapInfo");
                var option = getption("门店人次对比");
                option.series = map.series;
                option.legend.data = map.legendData;
                option.xAxis.data = map.xAxis;
                // 使用刚指定的配置项和数据显示图表。
                myChart2.setOption(option);
                myChart2.hideLoading();
            });
    }
    var ChartsUtils = new ChartsUtils(loadData);
    ChartsUtils.setDataPackTimeValue();
    ChartsUtils.loadChartData();
    var chartsUtils2 = new ChartsUtils(loadData2);
    chartsUtils2.setDataPackTimeValue();
    chartsUtils2.loadChartData();
    function  buildTable(map){
        console.log(buildTable,map);
        var app = new Vue({
            el: '#table',
            data: {
                series : map.series,
                legend : map.legendData,
                xAxis : map.xAxis
            }
        } );
    }