From a13a93a493e7e94e28b2225c26e7e13b52d3288c Mon Sep 17 00:00:00 2001 From: xiaoyong931011 <15274802129@163.com> Date: Mon, 12 Apr 2021 19:48:45 +0800 Subject: [PATCH] 20210412 tqq环境 --- zq-erp/src/main/resources/templates/views/admin/hive-erp/analysis/customerFlow.html | 107 +++++++++++++++++++++++++++++++++++++++++++++-------- 1 files changed, 90 insertions(+), 17 deletions(-) diff --git a/zq-erp/src/main/resources/templates/views/admin/hive-erp/analysis/customerFlow.html b/zq-erp/src/main/resources/templates/views/admin/hive-erp/analysis/customerFlow.html index ccf9076..2cbe29c 100644 --- a/zq-erp/src/main/resources/templates/views/admin/hive-erp/analysis/customerFlow.html +++ b/zq-erp/src/main/resources/templates/views/admin/hive-erp/analysis/customerFlow.html @@ -11,6 +11,7 @@ <!-- 本框架基本脚本和样式 --> <script type="text/javascript" th:src="@{/js/plugin/jquery-2.1.4.min.js}"></script> + <link rel="stylesheet" th:href="@{/plugin/element-ui/index.css}"> <script type="text/javascript" th:src="@{/js/systools/MBase.js}"></script> <style> .echarts { @@ -45,7 +46,7 @@ name="endTime" type="text" class="form-control datetimepicker" autocomplete="off" id="endTime"> </div> - <div class="form-group mr-20 "> + <div class="form-group mr-20 mt-20 "> <label>统计单位</label> <select name="statisticsUnit" class=" form-control " id="unitSelect" style="width: 80px"> @@ -56,31 +57,78 @@ </select> </div> </form> + + <!-- 搜索框部分en --> <div class="row chartsBox " style="margin-top: 40px"> - <div class=" col-md-12"> - <div class="echarts" id="echarts-line-chart1"></div> + + <div class=" col-md-6"> + <div class="panel panel-info"> + <div class="panel-heading">门店人次对比分析</div> + <div class="panel-body"> + <div class="echarts" id="echarts-line-chart2"></div> + </div> + </div> + </div> + <div class=" col-md-6"> + <div class="panel panel-info"> + <div class="panel-heading">门店人头对比分析</div> + <div class="panel-body"> + <div class="echarts" id="echarts-line-chart1"></div> + </div> + </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 class=" col-md-6"> + <div class="panel panel-info"> + <div class="panel-heading">门店到店率对比分析</div> + <div class="panel-body"> + <div class="echarts" id="echarts-line-chart3"></div> + </div> + </div> + </div> + <div class=" col-md-6"> + <div class="panel panel-warning"> + <div class="panel-heading">数据统计说明</div> + <div class="panel-body "> + <div class="echarts"> + <ul> + <li> + <h3>会员人头数</h3> + <p>一段时间内某个门店所有进店客户的总人数,同一个人无论进店几次都视为一个人头数</p> + </li> + <li> + <h3>会员人次</h3> + <p>一段时间内某个门店一个会员有3天来过门店则人次为3以此类推</p> + </li> + <li> + <h3>到店率</h3> + <p>一段时间内某个门店所有客户人次数除以人头数即为到店率</p> + </li> + </ul> + + </div> + </div> + </div> </div> </div> + </div> <script type="text/javascript" th:src="@{/js/systools/MJsBase.js}"></script> -<script type="text/javascript" th:src="@{/plugin/echarts/echarts.all.js}"></script> +<script type="text/javascript" th:src="@{/plugin/echarts/echarts.min.js}"></script> <script type="text/javascript" th:src="@{/plugin/echarts/macarons.js}"></script> <script type="text/javascript" th:src="@{/plugin/dateformat.js}"></script> <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 type="text/javascript" th:src="@{/plugin/element-ui/index.js}"></script> <script> @@ -92,17 +140,18 @@ // 基于准备好的dom,初始化echarts实例 var myChart1 = echarts.init(document.getElementById('echarts-line-chart1'), 'macarons'); var myChart2 = echarts.init(document.getElementById('echarts-line-chart2'), 'macarons'); - /* - 点击事件 - myChart1.on('click', function (params) { - console.log(params); - }); -*/ + var myChart3 = echarts.init(document.getElementById('echarts-line-chart3'), 'macarons'); + /* + 点击事件 + myChart1.on('click', function (params) { + console.log(params); + }); + */ // 指定图表的配置项和数据 - function getption(title) { + function getption() { return { title: { - text: title, + text: "", padding: 20 }, legend: {}, @@ -117,7 +166,10 @@ } }, tooltip: { - trigger: 'axis' + trigger: 'axis', + axisPointer: { + type: 'shadow' + } }, xAxis: { type: 'category', @@ -202,10 +254,31 @@ } var chartsUtils2 = new ChartsUtils(loadData2); - chartsUtils2.setDataPackTimeValue(); chartsUtils2.loadChartData(); + //加载数据3 + function loadData3() { + //加载门店到店率 + myChart3.showLoading(); + $.AjaxProxy({ + p: MForm.toJson("#serchform"), + c: false, + }).invoke(basePath+"/admin/analysis/customerEnterRateCompare", + function (loj) { + var map = loj.getValue("mapInfo"); + var option = getption("门店到店率对比"); + option.series = map.series; + option.legend.data = map.legendData; + option.xAxis.data = map.xAxis; + // 使用刚指定的配置项和数据显示图表。 + myChart3.setOption(option); + myChart3.hideLoading(); + }); + } + + var chartsUtils3 = new ChartsUtils(loadData3); + chartsUtils3.loadChartData(); </script> -- Gitblit v1.9.1