机构画像

src/main/webapp/WEB-INF/views/modules/userNew/cmClubPortrait.jsp

@@ -138,10 +138,11 @@
 <script type="text/javascript" src="${ctxStatic}/datapicker/moment-2.29.min.js"></script>
 <script type="text/javascript" src="${ctxStatic}/datapicker/jquery.daterangepicker.js"></script>
 <script type="text/javascript" src="${ctxStatic}/echarts/echarts.min.js"></script>
-<script type="text/javascript" src="${ctxStatic}/modules/cmClubPortrait/orderEacths.js"></script>
-<script type="text/javascript" src="${ctxStatic}/modules/cmClubPortrait/keWordsEacths.js"></script>
-<script type="text/javascript" src="${ctxStatic}/modules/cmClubPortrait/serviceEacths.js"></script>
-<script type="text/javascript" src="${ctxStatic}/modules/cmClubPortrait/visitEacths.js"></script>
+<%--<script type="text/javascript" src="${ctxStatic}/modules/cmClubPortrait/orderEacths.js"></script>--%>
+<%--<script type="text/javascript" src="${ctxStatic}/modules/cmClubPortrait/keWordsEacths.js"></script>--%>
+<%--<script type="text/javascript" src="${ctxStatic}/modules/cmClubPortrait/serviceEacths.js"></script>--%>
+<%--<script type="text/javascript" src="${ctxStatic}/modules/cmClubPortrait/visitEacths.js"></script>--%>
+<script type="text/javascript" src="${ctxStatic}/modules/cmClubPortrait/cmClubEacths.js"></script>
 <script type="text/javascript" src="${ctxStatic}/modules/cmClubPortrait/cmClubPortrait.js"></script>
 </body>
 </html>

src/main/webapp/static/modules/cmClubPortrait/cmClubEacths.js

@@ -0,0 +1,276 @@
+/**
+ * Created 机构订单图表 by zjy on 2023/02/10.
+ */
+function getDateStr(dd, addCount) {
+    dd.setDate(dd.getDate() + addCount);//获取addCount天后的日期
+    var y = dd.getFullYear();
+    var m = (dd.getMonth() + 1) < 10 ? "0" + (dd.getMonth() + 1) : (dd.getMonth() + 1);//获取当前月份的日期，不足10补0
+    var d = dd.getDate() < 10 ? "0" + dd.getDate() : dd.getDate();
+    return y + "/" + m + "/" + d;
+}
+// PC
+const isPC = ($(window).width() > 768);
+//默认参数
+const defaultParams = {
+    clubId:0,//  机构id
+    dateType:0,//   日期类别 0日 1月 2半年 3全年
+    startTime:'',//   开始时间
+    endTime:'',//   结束时间
+    type:0//  统计类别 0订单 1搜索关键词 2咨询记录 3访问记录 4初始状态
+}
+// 默认时间
+const startDate = getDateStr(new Date(), -365),
+      endDate = getDateStr(new Date(), 0);
+// 初始化订单选择时间控件
+const getInfoOrderDate = function () {
+    $('#orderDate').dateRangePicker({
+        language: 'cn',
+        startDate: startDate,
+        endDate: endDate,
+        format: 'YYYY-MM-DD',
+        showShortcuts: false,
+        autoClose: isPC,
+        isNowrap: false,
+        getValue: function () {
+            if (defaultParams.startTime && defaultParams.endTime) {
+                return defaultParams.startTime + ' to ' + defaultParams.endTime;
+            } else {
+                return '';
+            }
+        },
+        setValue: function (s, s1, s2) {
+            defaultParams.startTime = s1;
+            defaultParams.endTime = s2;
+            $('#orderTimeStart').val(s1);
+            $('#orderTimeEnd').val(s2);
+            getClubEacthsData(0,0)
+        }
+    });
+}
+// 初始化关键词选择时间控件
+const getInfoKeyWordsDate = function () {
+    $('#keyWordsDate').dateRangePicker({
+        language: 'cn',
+        startDate: startDate,
+        endDate: endDate,
+        format: 'YYYY-MM-DD',
+        showShortcuts: false,
+        autoClose: isPC,
+        isNowrap: false,
+        getValue: function () {
+            if (defaultParams.startTime && defaultParams.endTime) {
+                return defaultParams.startTime + ' to ' + defaultParams.endTime;
+            } else {
+                return '';
+            }
+        },
+        setValue: function (s, s1, s2) {
+            defaultParams.startTime = s1;
+            defaultParams.endTime = s2;
+            $('#keyWordsTimeStart').val(s1);
+            $('#keyWordsTimeEnd').val(s2);
+            getClubEacthsData(1,0)
+        }
+    });
+}
+// 初始化咨询选择时间控件
+const getInfoServiceDate = function () {
+    $('#serviceDate').dateRangePicker({
+        language: 'cn',
+        startDate: startDate,
+        endDate: endDate,
+        format: 'YYYY-MM-DD',
+        showShortcuts: false,
+        autoClose: isPC,
+        isNowrap: false,
+        getValue: function () {
+            if (defaultParams.startTime && defaultParams.endTime) {
+                return defaultParams.startTime + ' to ' + defaultParams.endTime;
+            } else {
+                return '';
+            }
+        },
+        setValue: function (s, s1, s2) {
+            defaultParams.startTime = s1;
+            defaultParams.endTime = s2;
+            $('#serviceTimeStart').val(s1);
+            $('#serviceTimeEnd').val(s2);
+            getClubEacthsData(2,0)
+        }
+    });
+}
+// 初始化访问记录选择时间控件
+const getInfoVisitDate = function () {
+    $('#visitDate').dateRangePicker({
+        language: 'cn',
+        startDate: startDate,
+        endDate: endDate,
+        format: 'YYYY-MM-DD',
+        showShortcuts: false,
+        autoClose: isPC,
+        isNowrap: false,
+        getValue: function () {
+            if (defaultParams.startTime && defaultParams.endTime) {
+                return defaultParams.startTime + ' to ' + defaultParams.endTime;
+            } else {
+                return '';
+            }
+        },
+        setValue: function (s, s1, s2) {
+            defaultParams.startTime = s1;
+            defaultParams.endTime = s2;
+            $('#visitTimeStart').val(s1);
+            $('#visitTimeEnd').val(s2);
+            getClubEacthsData(3,0)
+        }
+    });
+}
+// 数据接口请求
+const  getClubEacthsData = function (type,dateType) {
+    defaultParams.type = type;
+    defaultParams.dateType = dateType;
+    console.log('数据接口请求参数',defaultParams)
+    if(type === 0){
+        const data = [
+            {value: 50, name: '普通订单【25%】【1个】'},
+            {value: 20, name: '二手订单【25%】【1个】'},
+            {value: 30, name: '返佣订单【25%】【1个】'},
+            {value: 60, name: '部分退款订单【25%】【1个】'},
+            {value: 50, name: '全部退款订单【25%】【1个】'},
+            {value: 20, name: '已关闭订单【25%】【1个】'},
+        ]
+        getOrderEacths(data)
+    }else{
+        const dataMap = {
+            1:{
+                id:'keyWordsEacths',
+                color:'#e15616',
+                series:{
+                    yAxisData:['M22', '玻尿酸', '超声刀', '面膜', '耗材', '润月雅', 'Ross', '超声跑', '拗口似','是脚手'],
+                    seriesData:[1000, 2000, 3000, 4000, 5000, 6000,7000,8000,9000,10000]
+                },
+            },
+            2:{
+                id:'serviceEacths',
+                color:'#36cbcb',
+                series:{
+                    yAxisData:['M22', '玻尿酸', '超声刀', '面膜', '耗材', '润月雅', 'Ross', '超声跑', '拗口似','是脚手'],
+                    seriesData:[1000, 2000, 3000, 4000, 5000, 6000,7000,8000,9000,10000]
+                },
+            },
+            3:{
+                id:'visitEacths',
+                color:'#3aa0ff',
+                series:{
+                    yAxisData:['搜索供应商', '楼层详情', '新品橱窗', '文章列表', '供应商主页', '二手列表','个人中心','新商品详情','商品搜索','首页'],
+                    seriesData:[1000, 2000, 3000, 4000, 5000, 6000,7000,8000,9000,10000]
+                },
+            }
+        }
+        getOtherEacths(dataMap[type].id,dataMap[type].series,dataMap[type].color);
+    }
+    // $.ajax({
+    //     url: "${ctx}/order/cmPayShop/modifyPayShopAmount",
+    //     type: "GET",
+    //     data: params,
+    //     contentType : 'application/json;charset=UTF-8', //contentType很重要
+    //     success: function (res) {
+    //         if (res.success) {
+    //
+    //         } else {
+    //            console.log('机构订单图表数据异常')
+    //         }
+    //     }
+    // });
+}
+// 基于准备好的dom，初始化echarts实例
+const getOrderEacths = function (data) {
+    // 基于准备好的dom，初始化echarts实例
+    const myChart = echarts.init(document.getElementById('orderEacths'));
+    const option = {
+        tooltip: {
+            trigger: 'item'
+        },
+        legend: {
+            orient: 'vertical',
+            right: '10%',
+            top:'20%',
+            textStyle: {
+                fontSize: 14,
+            },
+        },
+        color:['#3aa0ff','#36cbcb','#fad337','#4dcb73','#f2637b','#975fe4'],
+        series: [
+            {
+                name: '订单总量',
+                type: 'pie',
+                radius: '70%',
+                center: ['25%', '50%'],
+                avoidLabelOverlap: false,
+                emphasis: {
+                    itemStyle: {
+                        shadowBlur: 10,
+                        shadowOffsetX: 0,
+                        shadowColor: 'rgba(0, 0, 0, 0.5)'
+                    }
+                },
+                label: {
+                    show: false,
+                    position: 'center'
+                },
+                data:data
+            }
+        ]
+    };
+    // 使用刚指定的配置项和数据显示图表。
+    myChart.setOption(option);
+    window.onresize = myChart.resize;//移动适配
+};
+// 其他三个图表
+const getOtherEacths = function (id,data,color) {
+    // 基于准备好的dom，初始化echarts实例
+    console.log('id',id)
+    const myChart = echarts.init(document.getElementById(id));
+    const option = {
+        title: {
+            show:false
+        },
+        tooltip: {
+            trigger: 'axis',
+            axisPointer: {
+                type: 'shadow'
+            }
+        },
+        legend: {
+            show:false,
+        },
+        grid: {
+            left: '3%',
+            right: '4%',
+            bottom: '3%',
+            containLabel: true
+        },
+        xAxis: {
+            type: 'value',
+            boundaryGap: [0, 0.01]
+        },
+        yAxis: {
+            type: 'category',
+            data: data.yAxisData
+        },
+        series: [
+            {
+                type: 'bar',
+                name: '2023',
+                data: data.seriesData,
+                itemStyle:{
+                    color:color,
+                    fontSize: 14,
+                }
+            }
+        ]
+    };
+    // 使用刚指定的配置项和数据显示图表。
+    myChart.setOption(option);
+    window.onresize = myChart.resize;//移动适配
+};

src/main/webapp/static/modules/cmClubPortrait/cmClubPortrait.js

@@ -1,27 +1,31 @@
 /**
  * Created 机构画像 by zjy on 2023/02/10.
  */
-const isPC = ($(window).width() > 768);
-
-function getDateStr(dd, addCount) {
-    dd.setDate(dd.getDate() + addCount);//获取addCount天后的日期
-    var y = dd.getFullYear();
-    var m = (dd.getMonth() + 1) < 10 ? "0" + (dd.getMonth() + 1) : (dd.getMonth() + 1);//获取当前月份的日期，不足10补0
-    var d = dd.getDate() < 10 ? "0" + dd.getDate() : dd.getDate();
-    return y + "/" + m + "/" + d;
-}
-
 $(function(){
-    var startDate = getDateStr(new Date(), -365),
-        endDate = getDateStr(new Date(),0);
+    // 机构订单初始化时间
+    getInfoOrderDate();
+    // 机构搜索关键词初始化时间
+    getInfoKeyWordsDate();
+    // 机构咨询记录初始化时间
+    getInfoServiceDate();
+    // 机构访问记录初始化时间
+    getInfoVisitDate();
+    // 执行机构订单图表
+    getClubEacthsData(0);
+    // 执行关键词排名图表
+    getClubEacthsData(1);
+    // 执行咨询记录排名图表
+    getClubEacthsData(2);
+    // 执行访问记录排名图表
+    getClubEacthsData(3);
     // 点击筛选机构订单数据
     $('#orderTabs').children("a").each(function (index) {
         $(this).click(function () {
             //alert(index);
             $(this).addClass('active').siblings('a').removeClass('active');
-            let type = $(this).attr('data-type');
-            alert(`点击筛选机构订单数据类型${type}`)
-            getOrdersData(type);
+            let dateType = $(this).attr('data-type');
+            alert(`点击筛选机构订单数据类型${dateType}`)
+            getClubEacthsData(0,dateType)
         });
     });
     // 点击筛选机构搜索关键词数据
@@ -29,9 +33,9 @@ $(function(){
         $(this).click(function () {
             //alert(index);
             $(this).addClass('active').siblings('a').removeClass('active');
-            let type = $(this).attr('data-type');
-            alert(`点击筛选机构搜索关键词数据类型${type}`)
-            getKeyWordsData(type)
+            let dateType = $(this).attr('data-type');
+            alert(`点击筛选机构搜索关键词数据类型${dateType}`)
+            getClubEacthsData(1,dateType)
         });
     });
     // 点击筛选咨询记录数据
@@ -39,9 +43,9 @@ $(function(){
         $(this).click(function () {
             //alert(index);
             $(this).addClass('active').siblings('a').removeClass('active');
-            let type = $(this).attr('data-type');
-            alert(`点击筛选咨询记录数据类型${type}`)
-            getServiceData(type)
+            let dateType = $(this).attr('data-type');
+            alert(`点击筛选咨询记录数据类型${dateType}`)
+            getClubEacthsData(2,dateType)
         });
     });
     // 点击筛选机构访问记录数据
@@ -49,23 +53,10 @@ $(function(){
         $(this).click(function () {
             //alert(index);
             $(this).addClass('active').siblings('a').removeClass('active');
-            let type = $(this).attr('data-type');
-            alert(`点击筛选机构访问记录数据类型${type}`)
-            getVisitData(type)
+            let dateType = $(this).attr('data-type');
+            alert(`点击筛选机构访问记录数据类型${dateType}`)
+            getClubEacthsData(3,dateType)
         });
     });
-    // 初始化时间
-    getInfoOrderDate();
-    getInfoKeyWordsDate();
-    getInfoServiceDate();
-    getInfoVisitDate();
-    // 执行机构订单图表
-    getOrdersData();
 
-    // 执行关键词排名图表
-    getKeyWordsData();
-    // 执行咨询记录排名图表
-    getServiceData();
-    // 执行访问记录排名图表
-    getVisitData();
 })

src/main/webapp/static/modules/cmClubPortrait/keWordsEacths.js

@@ -1,14 +1,17 @@
 /**
  * Created 机构订单图表 by zjy on 2023/02/10.
  */
+const KeyWordDefaultParams = {
+    clubId:0,//  机构id
+    dateType:0,//   日期类别 0日 1月 2半年 3全年
+    startTime:'',//   开始时间
+    endTime:'',//   结束时间
+    type:0//  统计类别 0订单 1搜索关键词 2咨询记录 3访问记录 4初始状态
+}
 const getInfoKeyWordsDate = function () {
     // 初始化选择时间控件
-    const keyWordsData = {
-        beginTime: '',
-        endTime: ''
-    };
     const startDate = getDateStr(new Date(), -365),
-        endDate = getDateStr(new Date(), 0);
+          endDate = getDateStr(new Date(), 0);
     $('#keyWordsDate').dateRangePicker({
         language: 'cn',
         startDate: startDate,
@@ -18,22 +21,24 @@ const getInfoKeyWordsDate = function () {
         autoClose: isPC,
         isNowrap: false,
         getValue: function () {
-            if (keyWordsData.beginTime && keyWordsData.endTime) {
-                return keyWordsData.beginTime + ' to ' + keyWordsData.endTime;
+            if (KeyWordDefaultParams.startTime && KeyWordDefaultParams.endTime) {
+                return KeyWordDefaultParams.startTime + ' to ' + KeyWordDefaultParams.endTime;
             } else {
                 return '';
             }
         },
         setValue: function (s, s1, s2) {
-            keyWordsData.beginTime = s1;
-            keyWordsData.endTime = s2;
+            KeyWordDefaultParams.startTime = s1;
+            KeyWordDefaultParams.endTime = s2;
             $('#keyWordsTimeStart').val(s1);
             $('#keyWordsTimeEnd').val(s2);
+            getKeyWordsData()
         }
     });
 }
-const  getKeyWordsData = function (params) {
-    console.log('机构关键词数据接口请求')
+const  getKeyWordsData = function (dateType) {
+    KeyWordDefaultParams.dateType = dateType;
+    console.log('机构关键词数据接口请求',KeyWordDefaultParams)
     const data = {
         yAxisData:['M22', '玻尿酸', '超声刀', '面膜', '耗材', '润月雅', 'Ross', '超声跑', '拗口似','是脚手'],
         seriesData:[1000, 2000, 3000, 4000, 5000, 6000,7000,8000,9000,10000]

src/main/webapp/static/modules/cmClubPortrait/orderEacths.js

@@ -1,14 +1,17 @@
 /**
  * Created 机构订单图表 by zjy on 2023/02/10.
  */
+const orderDefaultParams = {
+    clubId:0,//  机构id
+    dateType:0,//   日期类别 0日 1月 2半年 3全年
+    startTime:'',//   开始时间
+    endTime:'',//   结束时间
+    type:0//  统计类别 0订单 1搜索关键词 2咨询记录 3访问记录 4初始状态
+}
 const getInfoOrderDate = function () {
     // 初始化选择时间控件
-    const orderData = {
-        beginTime: '',
-        endTime: ''
-    };
     const startDate = getDateStr(new Date(), -365),
-        endDate = getDateStr(new Date(), 0);
+          endDate = getDateStr(new Date(), 0);
     $('#orderDate').dateRangePicker({
         language: 'cn',
         startDate: startDate,
@@ -18,22 +21,24 @@ const getInfoOrderDate = function () {
         autoClose: isPC,
         isNowrap: false,
         getValue: function () {
-            if (orderData.beginTime && orderData.endTime) {
-                return orderData.beginTime + ' to ' + orderData.endTime;
+            if (orderDefaultParams.startTime && orderDefaultParams.endTime) {
+                return orderDefaultParams.startTime + ' to ' + orderDefaultParams.endTime;
             } else {
                 return '';
             }
         },
         setValue: function (s, s1, s2) {
-            orderData.beginTime = s1;
-            orderData.endTime = s2;
+            orderDefaultParams.startTime = s1;
+            orderDefaultParams.endTime = s2;
             $('#orderTimeStart').val(s1);
             $('#orderTimeEnd').val(s2);
+            getOrdersData()
         }
     });
 }
-const  getOrdersData = function (params) {
-    console.log('机构订单数据接口请求')
+const  getOrdersData = function (dateType) {
+    orderDefaultParams.type = dateType;
+    console.log('机构订单数据接口请求',orderDefaultParams)
     const orderData = [
         {value: 50, name: '普通订单【25%】【1个】'},
         {value: 20, name: '二手订单【25%】【1个】'},

src/main/webapp/static/modules/cmClubPortrait/serviceEacths.js

@@ -1,14 +1,18 @@
 /**
  * Created 机构订单图表 by zjy on 2023/02/10.
  */
+// 初始化咨询记录接口参数
+const serviceDefaultParams = {
+    clubId:0,//  机构id
+    dateType:0,//   日期类别 0日 1月 2半年 3全年
+    startTime:'',//   开始时间
+    endTime:'',//   结束时间
+    type:2//  统计类别 0订单 1搜索关键词 2咨询记录 3访问记录 4初始状态
+}
+// 初始化选择时间控件
 const getInfoServiceDate = function () {
-    // 初始化选择时间控件
-    const serviceData = {
-        beginTime: '',
-        endTime: ''
-    };
     const startDate = getDateStr(new Date(), -365),
-        endDate = getDateStr(new Date(), 0);
+          endDate = getDateStr(new Date(), 0);
     $('#serviceDate').dateRangePicker({
         language: 'cn',
         startDate: startDate,
@@ -18,22 +22,24 @@ const getInfoServiceDate = function () {
         autoClose: isPC,
         isNowrap: false,
         getValue: function () {
-            if (serviceData.beginTime && serviceData.endTime) {
-                return serviceData.beginTime + ' to ' + serviceData.endTime;
+            if (serviceDefaultParams.startTime && serviceDefaultParams.endTime) {
+                return serviceDefaultParams.startTime + ' to ' + serviceDefaultParams.endTime;
             } else {
                 return '';
             }
         },
         setValue: function (s, s1, s2) {
-            serviceData.beginTime = s1;
-            serviceData.endTime = s2;
+            serviceDefaultParams.startTime = s1;
+            serviceDefaultParams.endTime = s2;
             $('#serviceTimeStart').val(s1);
             $('#serviceTimeEnd').val(s2);
+            getServiceData()
         }
     });
 }
-const  getServiceData = function (params) {
-    console.log('机构咨询记录数据接口请求')
+const  getServiceData = function (dateType) {
+    serviceDefaultParams.dateType = dateType;
+    console.log('机构咨询记录数据接口请求',serviceDefaultParams)
     const data = {
         yAxisData:['M22', '玻尿酸', '超声刀', '面膜', '耗材', '润月雅', 'Ross', '超声跑', '拗口似','是脚手'],
         seriesData:[1000, 2000, 3000, 4000, 5000, 6000,7000,8000,9000,10000]

src/main/webapp/static/modules/cmClubPortrait/visitEacths.js

@@ -1,14 +1,18 @@
 /**
  * Created 机构订单图表 by zjy on 2023/02/10.
  */
+// 初始化访问记录接口参数
+const visitDefaultParams = {
+    clubId:0,//  机构id
+    dateType:0,//   日期类别 0日 1月 2半年 3全年
+    startTime:'',//   开始时间
+    endTime:'',//   结束时间
+    type:3//  统计类别 0订单 1搜索关键词 2咨询记录 3访问记录 4初始状态
+}
+// 初始化选择时间控件
 const getInfoVisitDate = function () {
-    // 初始化选择时间控件
-    const visitData = {
-        beginTime: '',
-        endTime: ''
-    };
     const startDate = getDateStr(new Date(), -365),
-        endDate = getDateStr(new Date(), 0);
+          endDate = getDateStr(new Date(), 0);
     $('#visitDate').dateRangePicker({
         language: 'cn',
         startDate: startDate,
@@ -18,22 +22,24 @@ const getInfoVisitDate = function () {
         autoClose: isPC,
         isNowrap: false,
         getValue: function () {
-            if (visitData.beginTime && visitData.endTime) {
-                return visitData.beginTime + ' to ' + visitData.endTime;
+            if (visitDefaultParams.startTime && visitDefaultParams.endTime) {
+                return visitDefaultParams.startTime + ' to ' + visitDefaultParams.endTime;
             } else {
                 return '';
             }
         },
         setValue: function (s, s1, s2) {
-            visitData.beginTime = s1;
-            visitData.endTime = s2;
+            visitDefaultParams.startTime = s1;
+            visitDefaultParams.endTime = s2;
             $('#visitTimeStart').val(s1);
             $('#visitTimeEnd').val(s2);
+            getVisitData()
         }
     });
 }
-const  getVisitData = function (params) {
-    console.log('机构浏览记录数据接口请求')
+const  getVisitData = function (dateType) {
+    visitDefaultParams.dateType = dateType;
+    console.log('机构浏览记录数据接口请求',visitDefaultParams)
     const data = {
         yAxisData:['搜索供应商', '楼层详情', '新品橱窗', '文章列表', '供应商主页', '二手列表','个人中心','新商品详情','商品搜索','首页'],
         seriesData:[1000, 2000, 3000, 4000, 5000, 6000,7000,8000,9000,10000]