1.3.3新增后台微信图文发送功能，小程序配置，增加小程序授权等,修复一些bug等

2019-11-29 19:05:38 +08:00
parent 185fc51e1d
commit 17aa0f4676
12 changed files with 525 additions and 147 deletions
--- a/src/views/dashboard/BarChart.vue
+++ b/src/views/dashboard/BarChart.vue
@ -6,6 +6,7 @@
 import echarts from 'echarts'
 require('echarts/theme/macarons') // echarts theme
 import { debounce } from '@/utils'
+import { chart } from '@/api/visits'

 const animationDuration = 6000

@ -26,7 +27,8 @@ export default {
  },
  data() {
    return {
-      chart: null
+      chart: null,
+      day: [],num: []
    }
  },
  mounted() {
@ -50,56 +52,60 @@ export default {
    initChart() {
      this.chart = echarts.init(this.$el, 'macarons')

-      this.chart.setOption({
-        tooltip: {
-          trigger: 'axis',
-          axisPointer: { // 坐标轴指示器，坐标轴触发有效
-            type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
-          }
-        },
-        grid: {
-          top: 10,
-          left: '2%',
-          right: '2%',
-          bottom: '3%',
-          containLabel: true
-        },
-        xAxis: [{
-          type: 'category',
-          data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
-          axisTick: {
-            alignWithLabel: true
-          }
-        }],
-        yAxis: [{
-          type: 'value',
-          axisTick: {
-            show: false
-          }
-        }],
-        series: [{
-          name: 'pageA',
-          type: 'bar',
-          stack: 'vistors',
-          barWidth: '60%',
-          data: [79, 52, 200, 334, 390, 330, 220],
-          animationDuration
-        }, {
-          name: 'pageB',
-          type: 'bar',
-          stack: 'vistors',
-          barWidth: '60%',
-          data: [80, 52, 200, 334, 390, 330, 220],
-          animationDuration
-        }, {
-          name: 'pageC',
-          type: 'bar',
-          stack: 'vistors',
-          barWidth: '60%',
-          data: [30, 52, 200, 334, 390, 330, 220],
-          animationDuration
-        }]
+      chart().then(res => {
+         var _info = res.chart,
+          day = [],
+          num = [];
+        _info.forEach(function(item) {
+          day.push(item.time);
+          num.push(item.num);
+        });
+
+        console.log(day,num)
+
+        this.chart.setOption({
+          tooltip: {
+            trigger: 'axis',
+            axisPointer: { // 坐标轴指示器，坐标轴触发有效
+              type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
+            }
+          },
+          grid: {
+            top: 10,
+            left: '2%',
+            right: '2%',
+            bottom: '3%',
+            containLabel: true
+          },
+          xAxis: [{
+            type: 'category',
+            data: day,
+            axisTick: {
+              alignWithLabel: true
+            }
+          }],
+          yAxis: [{
+            type: 'value',
+            axisTick: {
+              show: false
+            }
+          }],
+          series: [{
+            name: 'pageA',
+            type: 'line',
+            stack: 'vistors',
+            barWidth: '60%',
+            data: num,
+            animationDuration
+          }]
+        })
+
      })
+
+      console.log('day:'+this.day)
+
+
+
    }
  }
 }
--- a/src/views/dashboard/BarChartT.vue
+++ b/src/views/dashboard/BarChartT.vue
@ -0,0 +1,112 @@
+<template>
+  <div :class="className" :style="{height:height,width:width}"/>
+</template>
+
+<script>
+import echarts from 'echarts'
+require('echarts/theme/macarons') // echarts theme
+import { debounce } from '@/utils'
+import { chart } from '@/api/visits'
+
+const animationDuration = 6000
+
+export default {
+  props: {
+    className: {
+      type: String,
+      default: 'chart'
+    },
+    width: {
+      type: String,
+      default: '100%'
+    },
+    height: {
+      type: String,
+      default: '300px'
+    }
+  },
+  data() {
+    return {
+      chart: null,
+      day: [],num: []
+    }
+  },
+  mounted() {
+    this.initChart()
+    this.__resizeHandler = debounce(() => {
+      if (this.chart) {
+        this.chart.resize()
+      }
+    }, 100)
+    window.addEventListener('resize', this.__resizeHandler)
+  },
+  beforeDestroy() {
+    if (!this.chart) {
+      return
+    }
+    window.removeEventListener('resize', this.__resizeHandler)
+    this.chart.dispose()
+    this.chart = null
+  },
+  methods: {
+    initChart() {
+      this.chart = echarts.init(this.$el, 'macarons')
+
+      chart().then(res => {
+         var _info = res.chartT,
+          day = [],
+          num = [];
+        _info.forEach(function(item) {
+          day.push(item.time);
+          num.push(item.num);
+        });
+
+        console.log(day,num)
+
+        this.chart.setOption({
+          tooltip: {
+            trigger: 'axis',
+            axisPointer: { // 坐标轴指示器，坐标轴触发有效
+              type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
+            }
+          },
+          grid: {
+            top: 10,
+            left: '2%',
+            right: '2%',
+            bottom: '3%',
+            containLabel: true
+          },
+          xAxis: [{
+            type: 'category',
+            data: day,
+            axisTick: {
+              alignWithLabel: true
+            }
+          }],
+          yAxis: [{
+            type: 'value',
+            axisTick: {
+              show: false
+            }
+          }],
+          series: [{
+            name: 'pageA',
+            type: 'line',
+            stack: 'vistors',
+            barWidth: '60%',
+            data: num,
+            animationDuration
+          }]
+        })
+
+      })
+
+      console.log('day:'+this.day)
+
+
+
+    }
+  }
+}
+</script>
--- a/src/views/dashboard/PanelGroup.vue
+++ b/src/views/dashboard/PanelGroup.vue
@ -3,68 +3,73 @@
    <el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
      <div class="card-panel">
        <div class="card-panel-icon-wrapper icon-people">
-          <svg-icon icon-class="visits" class-name="card-panel-icon" />
+          <i class="el-icon-price-tag card-panel-icon"></i>
        </div>
        <div class="card-panel-description">
-          <div class="card-panel-text">日流量</div>
-          <count-to :start-val="0" :end-val="count.newVisits" :duration="2600" class="card-panel-num"/>
+          <div class="card-panel-text">今日成交额</div>
+          <count-to :start-val="0" :end-val="count.todayPrice" :duration="2600" class="card-panel-num"/>
        </div>
      </div>
    </el-col>
    <el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
      <div class="card-panel">
        <div class="card-panel-icon-wrapper icon-message">
-          <svg-icon icon-class="ipvisits" class-name="card-panel-icon" />
+          <i class="el-icon-money card-panel-icon"></i>
        </div>
        <div class="card-panel-description">
-          <div class="card-panel-text">日IP量</div>
-          <count-to :start-val="0" :end-val="count.newIp" :duration="3000" class="card-panel-num"/>
+          <div class="card-panel-text">昨日成交额</div>
+          <count-to :start-val="0" :end-val="count.proPrice" :duration="3000" class="card-panel-num"/>
        </div>
      </div>
    </el-col>
    <el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
      <div class="card-panel">
        <div class="card-panel-icon-wrapper icon-money">
-          <svg-icon icon-class="visits" class-name="card-panel-icon" />
+          <i class="el-icon-price-tag card-panel-icon"></i>
        </div>
        <div class="card-panel-description">
-          <div class="card-panel-text">周流量</div>
-          <count-to :start-val="0" :end-val="count.recentVisits" :duration="3200" class="card-panel-num"/>
+          <div class="card-panel-text">上周成交额</div>
+          <count-to :start-val="0" :end-val="count.lastWeekPrice" :duration="3200" class="card-panel-num"/>
        </div>
      </div>
    </el-col>
    <el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
      <div class="card-panel">
        <div class="card-panel-icon-wrapper icon-shopping">
-          <svg-icon icon-class="ipvisits" class-name="card-panel-icon" />
+          <i class="el-icon-money card-panel-icon"></i>
        </div>
        <div class="card-panel-description">
-          <div class="card-panel-text">周IP量</div>
-          <count-to :start-val="0" :end-val="count.recentIp" :duration="3600" class="card-panel-num"/>
+          <div class="card-panel-text">本月成交额</div>
+          <count-to :start-val="0" :end-val="count.monthPrice" :duration="3600" class="card-panel-num"/>
        </div>
      </div>
    </el-col>
  </el-row>
 </template>
-
 <script>
 import CountTo from 'vue-count-to'
-import { get } from '@/api/visits'
+import { get,gett } from '@/api/visits'
 export default {
  components: {
    CountTo
  },
  data() {
    return {
-      count: { newIp: 0, newVisits: 0, recentIp: 0, recentVisits: 0 }
+      count: { todayPrice: 0, todayCount: 0, proPrice: 0, proCount: 0,
+        monthPrice: 0, monthCount: 0, lastWeekCount: 0, lastWeekPrice: 0 }
    }
  },
  mounted() {
-    get().then(res => {
-      this.count.newIp = res.newIp
-      this.count.newVisits = res.newVisits
-      this.count.recentIp = res.recentIp
-      this.count.recentVisits = res.recentVisits
+    gett().then(res => {
+      this.count.todayPrice = res.todayPrice
+      this.count.todayCount = res.todayCount
+      this.count.proCount = res.proCount
+      this.count.proPrice = res.proPrice
+
+      this.count.monthPrice = res.monthPrice
+      this.count.monthCount = res.monthCount
+      this.count.lastWeekCount = res.lastWeekCount
+      this.count.lastWeekPrice = res.lastWeekPrice
    })
  }
 }
--- a/src/views/dashboard/PanelGroupT.vue
+++ b/src/views/dashboard/PanelGroupT.vue
@ -0,0 +1,133 @@
+<template>
+  <el-row :gutter="40" class="panel-group">
+    <el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
+      <div class="card-panel">
+        <div class="card-panel-icon-wrapper icon-people">
+          <i class="el-icon-s-order card-panel-icon"></i>
+        </div>
+        <div class="card-panel-description">
+          <div class="card-panel-text">今日订单数</div>
+          <count-to :start-val="0" :end-val="count.todayCount" :duration="2600" class="card-panel-num"/>
+        </div>
+      </div>
+    </el-col>
+    <el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
+      <div class="card-panel">
+        <div class="card-panel-icon-wrapper icon-message">
+          <i class="el-icon-s-order card-panel-icon"></i>
+        </div>
+        <div class="card-panel-description">
+          <div class="card-panel-text">昨日订单数</div>
+          <count-to :start-val="0" :end-val="count.proCount" :duration="3000" class="card-panel-num"/>
+        </div>
+      </div>
+    </el-col>
+    <el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
+      <div class="card-panel">
+        <div class="card-panel-icon-wrapper icon-money">
+          <i class="el-icon-s-order card-panel-icon"></i>
+        </div>
+        <div class="card-panel-description">
+          <div class="card-panel-text">上周订单数</div>
+          <count-to :start-val="0" :end-val="count.lastWeekCount" :duration="3200" class="card-panel-num"/>
+        </div>
+      </div>
+    </el-col>
+    <el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
+      <div class="card-panel">
+        <div class="card-panel-icon-wrapper icon-shopping">
+          <i class="el-icon-s-order card-panel-icon"></i>
+        </div>
+        <div class="card-panel-description">
+          <div class="card-panel-text">本月订单数</div>
+          <count-to :start-val="0" :end-val="count.monthCount" :duration="3600" class="card-panel-num"/>
+        </div>
+      </div>
+    </el-col>
+  </el-row>
+</template>
+<script>
+import CountTo from 'vue-count-to'
+import { get,gett } from '@/api/visits'
+export default {
+  components: {
+    CountTo
+  },
+  data() {
+    return {
+      count: { todayPrice: 0, todayCount: 0, proPrice: 0, proCount: 0,
+        monthPrice: 0, monthCount: 0, lastWeekCount: 0, lastWeekPrice: 0 }
+    }
+  },
+  mounted() {
+    gett().then(res => {
+      this.count.todayPrice = res.todayPrice
+      this.count.todayCount = res.todayCount
+      this.count.proCount = res.proCount
+      this.count.proPrice = res.proPrice
+
+      this.count.monthPrice = res.monthPrice
+      this.count.monthCount = res.monthCount
+      this.count.lastWeekCount = res.lastWeekCount
+      this.count.lastWeekPrice = res.lastWeekPrice
+    })
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+.panel-group {
+  margin-top: 18px;
+  .card-panel-col{
+    margin-bottom: 32px;
+  }
+  .card-panel {
+    height: 108px;
+    font-size: 12px;
+    position: relative;
+    overflow: hidden;
+    color: #666;
+    background: #fff;
+    box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
+    border-color: rgba(0, 0, 0, .05);
+    .icon-people {
+      color: #40c9c6;
+    }
+    .icon-message {
+      color: #36a3f7;
+    }
+    .icon-money {
+      color: #f4516c;
+    }
+    .icon-shopping {
+      color: #34bfa3
+    }
+    .card-panel-icon-wrapper {
+      float: left;
+      margin: 14px 0 0 14px;
+      padding: 16px;
+      transition: all 0.38s ease-out;
+      border-radius: 6px;
+    }
+    .card-panel-icon {
+      float: left;
+      font-size: 48px;
+    }
+    .card-panel-description {
+      float: right;
+      font-weight: bold;
+      margin: 26px;
+      margin-left: 0px;
+      .card-panel-text {
+        line-height: 18px;
+        color: rgba(0, 0, 0, 0.45);
+        font-size: 16px;
+        margin-bottom: 12px;
+      }
+      .card-panel-num {
+        font-size: 20px;
+      }
+    }
+  }
+}
+</style>