修改图表

src/pages/result/index.vue

@@ -120,7 +120,7 @@ export default {
               if (response.data.length < 7) {
                 response.data.map((item, index) => {
                   data1.push(item.score)
-                  data2.push(this.getNowTime(item.date_index, 1))
+                  data2.push(this.getNowTime2(item.date_index))
                 })
                 setTimeout(() => {
                   for (let i = 0; i < 7 - response.data.length; i++) {
@@ -131,176 +131,86 @@ export default {
               } else {
                 response.data.map((item, index) => {
                   data1.push(item.score)
-                  data2.push(this.getNowTime(item.date_index, 1))
+                  data2.push(this.getNowTime(item.date_index))
                 })
               }
             }
-            if (data1.length === 1) {
-              this.polar = {
-                dataZoom: [{
-                  type: 'inside',
-                  start: 0,
-                  end: 50
-                }],
-                grid: {
-                  x: 30,
-                  y: 20,
+            this.polar = {
+              grid: {
+                x: 30,
+                y: 20,
+                x2: 0,
+                y2: 30
+              },
+              itemStyle: {
+                // color: 'linear-gradient(0deg, #00A2DB, #35D0E9)'
+                color: {
+                  type: 'linear',
+                  x: 0,
+                  y: 0,
                   x2: 0,
-                  y2: 30
+                  y2: 1,
+                  colorStops: [{
+                    offset: 1, color: '#00A2DB'
+                  }, {
+                    offset: 0, color: '#35D0E9'
+                  }],
+                  global: false // 缺省为 false
+                }
+              },
+              xAxis: {
+                type: 'category',
+                data: data2,
+                axisLabel: {
+                  color: 'rgba(255,255,255,0.3)'
                 },
-                itemStyle: {
-                  // color: 'linear-gradient(0deg, #00A2DB, #35D0E9)'
-                  color: {
-                    type: 'linear',
-                    x: 0,
-                    y: 0,
-                    x2: 0,
-                    y2: 1,
-                    colorStops: [{
-                      offset: 1, color: '#00A2DB'
-                    }, {
-                      offset: 0, color: '#35D0E9'
-                    }],
-                    global: false // 缺省为 false
-                  }
+                axisLine: {
+                  show: false
                 },
-                xAxis: {
-                  type: 'category',
-                  data: data2,
-                  axisLabel: {
-                    color: 'rgba(255,255,255,0.3)'
-                  },
-                  axisLine: {
-                    show: false
-                  },
-                  axisTick: {
-                    show: false
-                  },
-                  splitLine: {
-                    lineStyle: {
-                      color: ['#D4D4D8'],
-                      opacity: 0.1
-                    }
-                  }
+                axisTick: {
+                  show: false
                 },
-                yAxis: {
-                  // minInterval: 50,
-                  // interval: 50,
-                  splitNumber: 3,
-                  type: 'value',
-                  axisLabel: {
-                    color: 'rgba(255,255,255,0.3)'
-                  },
-                  axisLine: {
-                    show: false
-                  },
-                  axisTick: {
-                    show: false
-                  },
-                  splitLine: {
-                    lineStyle: {
-                      color: ['#D4D4D8'],
-                      opacity: 0.1
-                    }
+                splitLine: {
+                  lineStyle: {
+                    color: ['#D4D4D8'],
+                    opacity: 0.1
                   }
+                }
+              },
+              yAxis: {
+                // minInterval: 50,
+                // interval: 50,
+                splitNumber: 3,
+                type: 'value',
+                axisLabel: {
+                  color: 'rgba(255,255,255,0.3)'
                 },
-                series: [{
-                  data: data1,
-                  type: 'line',
-                  // symbol: 'none',
-                  smooth: true,
-                  itemStyle: {
-                    normal: {
-                      lineStyle: {
-                        width: 3
-                      }
-                    }
-                  }
-                }]
-              }
-            } else {
-              this.polar = {
-                dataZoom: [{
-                  type: 'inside',
-                  start: 0,
-                  end: 50
-                }],
-                grid: {
-                  x: 30,
-                  y: 20,
-                  x2: 0,
-                  y2: 30
+                axisLine: {
+                  show: false
                 },
-                itemStyle: {
-                  // color: 'linear-gradient(0deg, #00A2DB, #35D0E9)'
-                  color: {
-                    type: 'linear',
-                    x: 0,
-                    y: 0,
-                    x2: 0,
-                    y2: 1,
-                    colorStops: [{
-                      offset: 1, color: '#00A2DB'
-                    }, {
-                      offset: 0, color: '#35D0E9'
-                    }],
-                    global: false // 缺省为 false
-                  }
+                axisTick: {
+                  show: false
                 },
-                xAxis: {
-                  type: 'category',
-                  data: data2,
-                  axisLabel: {
-                    color: 'rgba(255,255,255,0.3)'
-                  },
-                  axisLine: {
-                    show: false
-                  },
-                  axisTick: {
-                    show: false
-                  },
-                  splitLine: {
-                    lineStyle: {
-                      color: ['#D4D4D8'],
-                      opacity: 0.1
-                    }
+                splitLine: {
+                  lineStyle: {
+                    color: ['#D4D4D8'],
+                    opacity: 0.1
                   }
-                },
-                yAxis: {
-                  // minInterval: 50,
-                  // interval: 50,
-                  splitNumber: 3,
-                  type: 'value',
-                  axisLabel: {
-                    color: 'rgba(255,255,255,0.3)'
-                  },
-                  axisLine: {
-                    show: false
-                  },
-                  axisTick: {
-                    show: false
-                  },
-                  splitLine: {
+                }
+              },
+              series: [{
+                data: data1,
+                type: 'line',
+                symbol: 'none',
+                smooth: true,
+                itemStyle: {
+                  normal: {
                     lineStyle: {
-                      color: ['#D4D4D8'],
-                      opacity: 0.1
+                      width: 3
                     }
                   }
-                },
-                series: [{
-                  data: data1,
-                  type: 'line',
-                  symbol: 'none',
-                  smooth: true,
-                  itemStyle: {
-                    normal: {
-                      lineStyle: {
-                        width: 3
-                      }
-                    }
-                  }
-                }]
-              }
+                }
+              }]
             }
             this.$forceUpdate()
           }
@@ -315,7 +225,7 @@ export default {
       let dateTemp
       const flag = 1
       for (let i = 0; i < 7; i++) {
-        dateTemp = (myDate.getMonth() + 1) + '-' + myDate.getDate()
+        dateTemp = (this.toDo(myDate.getMonth() + 1)) + '-' + this.toDo(myDate.getDate())
         dateArray.push(dateTemp)
         myDate.setDate(myDate.getDate() + flag)
       }
@@ -326,7 +236,7 @@ export default {
       const myDate = new Date(start)
       myDate.setDate(myDate.getDate() - dayNum)
       console.log(dayNum, '=123')
-      return (myDate.getMonth() + 1) + '-' + myDate.getDate()
+      return (this.toDo(myDate.getMonth() + 1)) + '-' + this.toDo(myDate.getDate())
     },
     getStyle(score) {
       return `bottom: ${score.score / score.score_sum * 100}%`
@@ -348,6 +258,12 @@ export default {
         : this.toDo(yy) + '-' + this.toDo(mm) + '-' + this.toDo(dd) + ' ' + this.toDo(hh) + ':' + this.toDo(mf) + ':' + this.toDo(ss)
       return dateTime
     },
+    getNowTime2(n) {
+      const date = new Date(n * 1000)
+      const mm = date.getMonth() + 1
+      const dd = date.getDate()
+      return this.toDo(mm) + '-' + this.toDo(dd)
+    },
     toDo(n) {
       return n < 10 ? '0' + n : n
     },