家里合并前上传4/14晚上

src/pages/report/index.vue

@@ -265,7 +265,7 @@ function initHightPieChart(canvas, width, height) {
   });
   canvas.setChart(hight_att_pie_charts);
 
-  var option = getHightPieChartOption(0, 0); // ECharts 配置项
+  var option = getHightPieChartOption(0, 0); // ECharts 配置项  
 
   hight_att_pie_charts.setOption(option);
 

src/utils/index.js

@@ -1,85 +1,82 @@
 function formatNumber(n) {
-  const str = n.toString()
-  return str[1] ? str : `0${str}`
+  const str = n.toString();
+  return str[1] ? str : `0${str}`;
 }
 
 export function formatTime(date) {
   if (date.length <= 11) {
-    date = date * 1000
+    date = date * 1000;
   }
-  var date = new Date(date)
-  const year = date.getFullYear()
-  const month = date.getMonth() + 1
-  const day = date.getDate()
+  var date = new Date(date);
+  const year = date.getFullYear();
+  const month = date.getMonth() + 1;
+  const day = date.getDate();
 
-  const hour = date.getHours()
+  const hour = date.getHours();
 
-  return year + "/" + month + "/" + day
+  return year + "/" + month + "/" + day;
 }
 
-
 export function formatAllTime(date) {
   if (date.length <= 11) {
-    date = date * 1000
+    date = date * 1000;
   }
-  var date = new Date(date)
-  const year = date.getFullYear()
-  const month = date.getMonth() + 1
-  const day = date.getDate()
+  var date = new Date(date);
+  const year = date.getFullYear();
+  const month = date.getMonth() + 1;
+  const day = date.getDate();
 
-  const hour = date.getHours()
-  const minutes = date.getMinutes()
+  const hour = date.getHours();
+  const minutes = date.getMinutes();
 
-  return year + "/" + month + "/" + day + " " + hour + ":" + minutes
+  return year + "/" + month + "/" + day + " " + hour + ":" + minutes;
 }
 
-
 export function formatTimeForSeconds(date) {
   if (date.length <= 11) {
-    date = date * 1000
+    date = date * 1000;
   }
-  var date = new Date(date)
-  const year = date.getFullYear()
-  const month = date.getMonth() + 1
-  const day = date.getDate()
+  var date = new Date(date);
+  const year = date.getFullYear();
+  const month = date.getMonth() + 1;
+  const day = date.getDate();
 
-  const hour = date.getHours()
-  const minute = date.getMinutes()
+  const hour = date.getHours();
+  const minute = date.getMinutes();
 
-  return year + "/" + month + "/" + day + " " + hour + ":" + minute
+  return year + "/" + month + "/" + day + " " + hour + ":" + minute;
 }
 
-
 export function formatValidityTime(date) {
   if (date.toString().length <= 11) {
-    date = date * 1000
+    date = date * 1000;
   }
-  var date = new Date(date)
-  const year = date.getFullYear()
-  const month = date.getMonth() + 1
-  const day = date.getDate()
+  var date = new Date(date);
+  const year = date.getFullYear();
+  const month = date.getMonth() + 1;
+  const day = date.getDate();
 
-  const hour = date.getHours()
+  const hour = date.getHours();
 
-  return year + "/" + month + "/" + day + " " + hour + "时"
+  return year + "/" + month + "/" + day + " " + hour + "时";
 }
 
 export function formatBirthday(date) {
-  var date = new Date(date * 1000)
-  const year = date.getFullYear()
-  const month = date.getMonth() + 1
-  const day = date.getDate()
+  var date = new Date(date * 1000);
+  const year = date.getFullYear();
+  const month = date.getMonth() + 1;
+  const day = date.getDate();
 
-  const hour = date.getHours()
+  const hour = date.getHours();
 
-  const t1 = [year, month, day].map(formatNumber).join('-')
+  const t1 = [year, month, day].map(formatNumber).join("-");
 
-  return `${t1}`
+  return `${t1}`;
 }
 
 // 专注力与放松力图表
 function getLineOption(lineData_att, lineData_med) {
-  const that = this
+  const that = this;
   var option = {
     color: ["#FFB400", "#D4327A"],
     legend: {
@@ -95,10 +92,10 @@ function getLineOption(lineData_att, lineData_med) {
       textStyle: {
         // fontWeight: 'bold',
         fontSize: 10,
-        color: "#CFCFCF"
+        color: "#CFCFCF",
       },
       selectedMode: false,
-      show: false
+      show: false,
     },
     grid: {
       left: 20,
@@ -107,79 +104,80 @@ function getLineOption(lineData_att, lineData_med) {
       top: 16,
       // show:true,
       containLabel: true,
-      zlevel: 1
+      zlevel: 1,
     },
     tooltip: {
       show: true,
-      trigger: 'axis'
+      trigger: "axis",
     },
     yAxis: {
-      x: 'center',
-      type: 'value',
+      x: "center",
+      type: "value",
       splitLine: {
         lineStyle: {
-          type: 'dashed'
-        }
+          type: "dashed",
+        },
       },
       axisLine: {
         lineStyle: {
-          color: '#ccc'
+          color: "#ccc",
         },
-        show: false
+        show: false,
       },
       axisLabel: {
-        color: '#ccc'
+        color: "#ccc",
       },
       max: 100,
       // data: ["0", "20", "40", "60", "80", "100"]
       // show: false
     },
     xAxis: {
-      type: 'category',
+      type: "category",
       boundaryGap: false,
       splitLine: {
         lineStyle: {
-          type: 'dashed'
-        }
+          type: "dashed",
+        },
       },
       axisLine: {
         lineStyle: {
-          color: '#ccc'
-        }
+          color: "#ccc",
+        },
       },
       axisLabel: {
-        color: '#ccc'
+        color: "#ccc",
       },
-      show: false
-    },
-    series: [{
-      name: "Att(专注度)",
-      symbol: 'none', //取消折点圆圈
-      type: 'line',
-      smooth: true,
-      data: lineData_att
+      show: false,
     },
+    series: [
+      {
+        name: "Att(专注度)",
+        symbol: "none", //取消折点圆圈
+        type: "line",
+        smooth: true,
+        data: lineData_att,
+      },
       {
         name: "Med(放松度)",
-        symbol: 'none', //取消折点圆圈
-        type: 'line',
+        symbol: "none", //取消折点圆圈
+        type: "line",
         smooth: true,
-        data: lineData_med
+        data: lineData_med,
       },
     ],
-    animation: false
-  }
-  return option
+    animation: false,
+  };
+  return option;
 }
 
 // 基本脑波图
 function getBaseOption(delta, theta, alpha, beta) {
-  const that = this
+  const that = this;
   var option = {
     color: ["#4b8cb4", "#ed4b59", "#fdb64b", "#F6CB90"],
     legend: {
       data: ["Delta", "Theta", "Alpha", "Beta"],
-      left: 'center',
+      left: "center",
       bottom: 20,
       icon: "circle",
       itemWidth: 8,
@@ -190,7 +188,7 @@ function getBaseOption(delta, theta, alpha, beta) {
         fontSize: 10,
         color: "#CFCFCF",
       },
-      show: false
+      show: false,
     },
     grid: {
       left: 20,
@@ -198,90 +196,92 @@ function getBaseOption(delta, theta, alpha, beta) {
       bottom: 16,
       top: 16,
       // show:false,
-      containLabel: true
+      containLabel: true,
     },
     tooltip: {
       show: true,
-      trigger: 'axis'
+      trigger: "axis",
     },
     yAxis: {
-      x: 'center',
-      type: 'value',
+      x: "center",
+      type: "value",
       splitLine: {
         lineStyle: {
-          type: 'dashed'
-        }
+          type: "dashed",
+        },
       },
       axisLine: {
         lineStyle: {
-          color: '#ccc'
+          color: "#ccc",
         },
-        show: false
+        show: false,
       },
       axisLabel: {
-        color: '#ccc'
+        color: "#ccc",
       },
       // max: 100,
       // data: ["0", "20", "40", "60", "80", "100"]
       // show: false
     },
     xAxis: {
-      type: 'category',
+      type: "category",
       boundaryGap: false,
       splitLine: {
         lineStyle: {
-          type: 'dashed'
-        }
+          type: "dashed",
+        },
       },
       axisLine: {
         lineStyle: {
-          color: '#ccc'
-        }
+          color: "#ccc",
+        },
       },
       axisLabel: {
-        color: '#ccc'
+        color: "#ccc",
       },
-      show: false
-    },
-    series: [{
-      name: "Delta",
-      symbol: 'none', //取消折点圆圈
-      type: 'line',
-      smooth: true,
-      data: delta
+      show: false,
     },
+    series: [
+      {
+        name: "Delta",
+        symbol: "none", //取消折点圆圈
+        type: "line",
+        smooth: true,
+        data: delta,
+      },
       {
         name: "Theta",
-        symbol: 'none', //取消折点圆圈
-        type: 'line',
+        symbol: "none", //取消折点圆圈
+        type: "line",
         smooth: true,
-        data: theta
+        data: theta,
       },
       {
         name: "Alpha",
-        symbol: 'none', //取消折点圆圈
-        type: 'line',
+        symbol: "none", //取消折点圆圈
+        type: "line",
         smooth: true,
-        data: alpha
+        data: alpha,
       },
       {
         name: "Beta",
-        symbol: 'none', //取消折点圆圈
-        type: 'line',
+        symbol: "none", //取消折点圆圈
+        type: "line",
         smooth: true,
         data: beta,
       },
     ],
-    animation: false
-  }
-  return option
+    animation: false,
+  };
+  return option;
 }
 
 export function formatSeconds(value) {
-  var secondTime = parseInt(value);// 秒
-  var minuteTime = 0;// 分
-  var hourTime = 0;// 小时
-  if (secondTime > 60) {//如果秒数大于60，将秒数转换成整数
+  var secondTime = parseInt(value); // 秒
+  var minuteTime = 0; // 分
+  var hourTime = 0; // 小时
+  if (secondTime > 60) {
+    //如果秒数大于60，将秒数转换成整数
     //获取分钟，除以60取整数，得到整数分钟
     minuteTime = parseInt(secondTime / 60);
     //获取秒数，秒数取佘，得到整数秒数
@@ -305,153 +305,167 @@ export function formatSeconds(value) {
   return result;
 }
 
-
 //获取等级名称
 function get_level_name($level_id) {
-  let $level = ['普通用户', '体验会员', '黄金会员', '白金会员', '钻石会员', '创客代理', '区域代理', '合伙人', '店员', '店长', '老师']
-  return $level[$level_id]
+  let $level = [
+    "普通用户",
+    "体验会员",
+    "黄金会员",
+    "白金会员",
+    "钻石会员",
+    "创客代理",
+    "区域代理",
+    "合伙人",
+    "店员",
+    "店长",
+    "老师",
+  ];
+  return $level[$level_id];
 }
 
 export function cal_down_time($final_time) {
-  let $today = new Date().getTime()
-  let $differ = $final_time * 1000 - $today
+  let $today = new Date().getTime();
+  let $differ = $final_time * 1000 - $today;
   //计算出相差天数
-  var days = Math.floor($differ / (24 * 3600 * 1000))
+  var days = Math.floor($differ / (24 * 3600 * 1000));
   //计算出小时数
 
-  var leave1 = $differ % (24 * 3600 * 1000)    //计算天数后剩余的毫秒数
-  var hours = Math.floor(leave1 / (3600 * 1000))
+  var leave1 = $differ % (24 * 3600 * 1000); //计算天数后剩余的毫秒数
+  var hours = Math.floor(leave1 / (3600 * 1000));
   //计算相差分钟数
-  var leave2 = leave1 % (3600 * 1000)        //计算小时数后剩余的毫秒数
-  var minutes = Math.floor(leave2 / (60 * 1000))
+  var leave2 = leave1 % (3600 * 1000); //计算小时数后剩余的毫秒数
+  var minutes = Math.floor(leave2 / (60 * 1000));
   //计算相差秒数
-  var leave3 = leave2 % (60 * 1000)      //计算分钟数后剩余的毫秒数
-  var seconds = Math.round(leave3 / 1000)
+  var leave3 = leave2 % (60 * 1000); //计算分钟数后剩余的毫秒数
+  var seconds = Math.round(leave3 / 1000);
   return {
-    differ: $differ, days, hours, minutes, seconds
-  }
+    differ: $differ,
+    days,
+    hours,
+    minutes,
+    seconds,
+  };
 }
 
 export function getHightPieChartOption($params, $total) {
-  console.log($params,$total);
   let $option = {
     tooltip: {
       // trigger: 'item'
-      show:false
+      show: false,
     },
     series: [
       {
-        name: '访问来源',
-        type: 'pie',
-        radius: '50%',
+        name: "访问来源",
+        type: "pie",
+        radius: "50%",
         labelLine: {
-          show: false
+          show: false,
         },
         data: [
           // {value: $params, name: '高专注占比'},
           // {value: Math.abs(100-$params), name: '直接访问'},
-          {value: $params, name: '高专注占比'},
-          {value: Math.abs($total - $params), name: '直接访问'},
-        ]
-      }
-    ]
+          { value: $params, name: "高专注占比" },
+          { value: Math.abs($total - $params), name: "直接访问" },
+        ],
+      },
+    ],
   };
-  return $option
+  return $option;
 }
 
-
 export function getRadarChartOption($params) {
-  console.log( '雷达图参数会打印什么呢？', $params)
+  console.log("雷达图参数会打印什么呢？", $params);
   let $option = {
     tooltip: {},
     radar: {
       // shape: 'circle',
-      radius: '55%',
+      radius: "55%",
       name: {
         textStyle: {
-          color: '#fff',
-          backgroundColor: '#999',
+          color: "#fff",
+          backgroundColor: "#999",
           borderRadius: 3,
-          padding: [3, 5]
-        }
+          padding: [3, 5],
+        },
       },
       indicator: [
-        {name: '专注力平均值指数', max: 100},
-        {name: '专注力广度指数', max: 100},
-        {name: '专注力爆发指数', max: 100},
-        {name: '专注力抗性指数', max: 100},
-        {name: '专注力启动指数', max: 100},
-        {name: '高专注力占比指数', max: 100}
-      ]
+        { name: "专注力平均值指数", max: 100 },
+        { name: "专注力广度指数", max: 100 },
+        { name: "专注力爆发指数", max: 100 },
+        { name: "专注力抗性指数", max: 100 },
+        { name: "专注力启动指数", max: 100 },
+        { name: "高专注力占比指数", max: 100 },
+      ],
     },
-    series: [{
-      name: '预算 vs 开销（Budget vs spending）',
-      type: 'radar',
-      // areaStyle: {normal: {}},
-      lineStyle: {
-        color: "#D28885"
+    series: [
+      {
+        name: "预算 vs 开销（Budget vs spending）",
+        type: "radar",
+        // areaStyle: {normal: {}},
+        lineStyle: {
+          color: "#D28885",
+        },
+        data: [
+          {
+            value: $params,
+            // name: '实际开销（Actual Spending）'
+            name: "专注力要素分析数据",
+          },
+        ],
       },
-      data: [
-        {
-          value: $params,
-          // name: '实际开销（Actual Spending）'
-          name: '专注力要素分析数据'
-        }
-      ]
-    }]
+    ],
   };
-  return $option
+  return $option;
 }
 
-
 //获取饼状图图属性
 export function getPieChartsOption($pie_datas) {
   if ($pie_datas) {
-    console.log($pie_datas)
+    console.log($pie_datas);
     let option = {
       tooltip: {
-        trigger: 'item',
-        formatter: '{a} \r\n {b}: {c} ({d}%)'
+        trigger: "item",
+        formatter: "{a} \r\n {b}: {c} ({d}%)",
       },
       legend: {
-        orient: 'vertical',
-        right: '10%',
-        top: '5%',
-        data: $pie_datas['legends']
+        orient: "vertical",
+        right: "10%",
+        top: "5%",
+        data: $pie_datas["legends"],
       },
       series: [
         {
-          name: '访问来源',
-          type: 'pie',
-          radius: ['40%', '70%'],
+          name: "访问来源",
+          type: "pie",
+          radius: ["40%", "70%"],
           avoidLabelOverlap: false,
           label: {
             show: false,
-            position: 'center'
+            position: "center",
           },
-          right: '40%',
+          right: "40%",
           emphasis: {
             label: {
               show: true,
-              fontSize: '30',
-              fontWeight: 'bold'
-            }
+              fontSize: "30",
+              fontWeight: "bold",
+            },
           },
           labelLine: {
-            show: true
+            show: true,
           },
-          data: $pie_datas['datas']
-        }
-      ]
+          data: $pie_datas["datas"],
+        },
+      ],
     };
-    return option
+    return option;
   }
 }
 
 //过滤饼状数据
 export function filterPieData(datas) {
-  let $this = this
-  let legends = []
+  let $this = this;
+  let legends = [];
   let $att_region = [
     // {
     //   min: 81,
@@ -475,34 +489,45 @@ export function filterPieData(datas) {
     // },
     {
       min: 0,
-      max: 20
+      max: 20,
     },
     {
       min: 21,
-      max: 40
+      max: 40,
     },
     {
       min: 41,
-      max: 60
+      max: 60,
     },
     {
       min: 61,
-      max: 80
+      max: 80,
     },
     {
       min: 81,
-      max: 100
+      max: 100,
     },
-  ]
+  ];
   datas.forEach(($val, $index) => {
-    legends.push($att_region[$index]['min'] + "-" + $att_region[$index]['max'] + "：" + formatSeconds($val))
+    legends.push(
+      $att_region[$index]["min"] +
+        "-" +
+        $att_region[$index]["max"] +
+        "：" +
+        formatSeconds($val)
+    );
     let _data = {
-      name: $att_region[$index]['min'] + "-" + $att_region[$index]['max'] + "：" + formatSeconds($val),
-      value: $val
-    }
-    datas[$index] = _data
-  })
-  return {datas, legends}
+      name:
+        $att_region[$index]["min"] +
+        "-" +
+        $att_region[$index]["max"] +
+        "：" +
+        formatSeconds($val),
+      value: $val,
+    };
+    datas[$index] = _data;
+  });
+  return { datas, legends };
 }
 
 export default {
@@ -510,5 +535,5 @@ export default {
   formatTime,
   getLineOption,
   getBaseOption,
-  get_level_name
-}
+  get_level_name,
+};