# up total-history linechart

src/views/dashboard/admin/components/LineChart.vue

@@ -72,7 +72,7 @@ export default {
     }
   },
   methods: {
-    setOptions({ expectedData, actualData } = {}) {
+    setOptions({ totalHistoryData, actualData } = {}) {
       this.chart.setOption({
         xAxis: {
           data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
@@ -101,10 +101,10 @@ export default {
           }
         },
         legend: {
-          data: ['expected', 'actual']
+          data: ['Total', 'Increment']
         },
         series: [{
-          name: 'expected', itemStyle: {
+          name: 'Total', itemStyle: {
             normal: {
               color: '#FF005A',
               lineStyle: {
@@ -115,12 +115,12 @@ export default {
           },
           smooth: true,
           type: 'line',
-          data: expectedData,
+          data: totalHistoryData,
           animationDuration: 2800,
           animationEasing: 'cubicInOut'
         },
         {
-          name: 'actual',
+          name: 'Increment',
           smooth: true,
           type: 'line',
           itemStyle: {
@@ -143,7 +143,7 @@ export default {
     },
     initChart() {
       this.chart = echarts.init(this.$el, 'macarons')
-      this.setOptions(this.chartData)
+      // this.setOptions(this.chartData)
     }
   }
 }

src/views/dashboard/admin/components/LogHistoryTable.vue

@@ -41,7 +41,7 @@ export default {
           item.oid = index + 1
         })
         this.listLoading = false
-        // console.log(this.historyList)
+        this.$emit('history', this.historyList)
       })
     }
   },

src/views/dashboard/admin/components/PanelGroup.vue

@@ -1,7 +1,7 @@
 <template>
   <el-row class="panel-group" :gutter="40">
     <el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
-      <div class='card-panel' @click="handleSetLineChartData('newVisitis')">
+      <div class='card-panel' @click="handleSetLineChartData('historyData')">
         <div class="card-panel-icon-wrapper icon-plus">
           <svg-icon icon-class="plus" class-name="card-panel-icon" />
         </div>

src/views/dashboard/admin/index.vue

@@ -16,7 +16,9 @@
     </el-row>
 
     <el-row>
-      <log-history-table :historyList="historyList"></log-history-table>
+      <log-history-table
+        @history="handleHistoryLine"
+      ></log-history-table>
     </el-row>
 
     <!-- <el-row :gutter="32">
@@ -67,12 +69,12 @@ import
 {
   fetchDeviceLogStatistic,
   fetchDeviceInfoStatistic
+  // fetchLogStatisticHistory
 } from '@/api/counter'
 
 const lineChartData = {
-  newVisitis: {
+  historyData: {
-    expectedData: [100, 120, 161, 134, 105, 160, 165],
+    totalHistoryData: []
-    actualData: [120, 82, 91, 154, 162, 140, 145]
   },
   messages: {
     expectedData: [200, 192, 120, 144, 160, 130, 140],
@@ -104,13 +106,12 @@ export default {
   },
   data() {
     return {
-      lineChartData: lineChartData.newVisitis,
+      lineChartData: lineChartData.historyData,
       totalCount: 0,
       dailyCount: 0,
       onlineCount: 0,
       offlineCount: 0,
-      historyList: [],
+      historyList: []
-      historyLoading: true
     }
   },
   methods: {
@@ -130,11 +131,30 @@ export default {
         this.totalCount = logData['total_count']
         this.dailyCount = logData['daily_count']
       })
+    },
+    handleHistoryLine(historyList) {
+      var totalList = []
+      historyList.forEach((item, index) => {
+        totalList.push(item.total)
+      })
+      this.lineChartData.totalHistoryData = totalList.reverse()
+      // console.log(this.lineChartData.totalHistoryData)
     }
+    // getLogStatisticHistory() {
+    //   fetchLogStatisticHistory().then(response => {
+    //     var totalList = []
+    //     this.historyList = response.data.results
+    //     this.historyList.forEach((item, index) => {
+    //       totalList.push(item.total)
+    //     })
+    //     this.lineChartData.totalHistoryData = totalList
+    //   })
+    // }
   },
   created() {
     this.getDeviceInfoStatistic()
     this.getDeviceLogStatistic()
+    // this.getLogStatisticHistory()
   }
 }
 </script>