首页内容的实现

.env.development

 # 开发环境配置
 ENV = 'development'
 
-# 正式环境
-#VUE_APP_BASE_API = 'http://sjapi.jxhh.com'
+# dev环境
+VUE_APP_BASE_API = 'http://192.168.111.240:6605/api/v1'
 
 # 测试环境
-VUE_APP_BASE_API = 'http://192.168.26.179:6605/api/v1'
+#VUE_APP_BASE_API = 'http://192.168.26.179:6605/api/v1'
 
 # 文档模块 直接调用 sys开放接口
 VUE_APP_BASE_SYS_API = 'http://sysapi.jxhh.com'
 
 # 路由懒加载
 VUE_CLI_BABEL_TRANSPILE_MODULES = true
+

.env.development.rej

-diff a/.env.development b/.env.development	(rejected hunks)
-@@ -5,6 +5,7 @@
- VUE_APP_BASE_API = 'http://sjapi.jxhh.com'
- # 开发环境
- #VUE_APP_BASE_API = 'http://192.168.111.36:8200'
-+#VUE_APP_BASE_API = 'http://192.168.111.34:8200'
- 
- # 路由懒加载
- VUE_CLI_BABEL_TRANSPILE_MODULES = true
-                  
\ No newline at end of file

src/api/system/home/home.js

+import request from '@/utils/request'
+//默认首页返回
+export function getStatisticalHome(){
+    return request({
+        url:'local/statistical/statisticalHome',
+        method:'get',
+    })
+}
+
+//获取运营数据
+export function getOperationalData(query){
+    return request({
+        url:'local/statistical/operationalData',
+        method:'get',
+        params:query
+    })
+}
+
+//获取店铺数据
+export function getStoreData(query){
+    return request({
+        url:'local/statistical/storeData',
+        method:'get',
+        params:query
+    })
+}
+
+//获取店铺排行数据
+export function getGoodsSale(query){
+    return request({
+        url:'local/statistical/getGoodsSale',
+        method:'get',
+        params:query
+    })
+}
+//获取热销类目数据
+export function getCategorySale(){
+    return request({
+        url:'local/statistical/getCategorySale',
+        method:'get',
+    })
+}
\ No newline at end of file

src/views/dashboard/LineChart.vue

@@ -26,25 +26,34 @@ export default {
       type: Boolean,
       default: true
     },
-    chartData: {
+    numberData: {
       type: Object,
       required: true
     }
   },
   data() {
     return {
-      chart: null
+      dateArr: [],
+      yAsix:10000,
     }
   },
   watch: {
-    chartData: {
+    numberData: {
       deep: true,
       handler(val) {
+        this.dateArr= val.date
+        this.numberMax(this.numberData.ordercount,this.numberData.customerprice)
         this.setOptions(val)
       }
     }
   },
+  created() {
+    this.$nextTick(() => {
+      this.initChart()
+    })
+  },
   mounted() {
+
     this.$nextTick(() => {
       this.initChart()
     })
@@ -57,43 +66,22 @@ export default {
     this.chart = null
   },
   methods: {
-    moneyMax(num) {
-      let prec = 2
-      let ceil = true
-      const len = String(num).length;
-      if (len <= prec) {
-        return num
-      }
-      const mult = Math.pow(10, prec);
-      return ceil ? Math.ceil(num / mult) * mult : Math.floor(num / mult) * mult;
-    },
     numberMax(num1,num2){
-      let num = ''
-      if (num1 >= num2) {
-        num = num1
-      } else {
-        num = num2
-      }
-      let prec = 2
-      let ceil = true
-      const len = String(num).length;
-      if (len <= prec) {
-        return num
+      if(num1,num2){
+        var c = num1.concat(num2)
+        this.yAsix =  Math.ceil(Math.max(...c))
       }
-      const mult = Math.pow(10, prec);
-      return ceil ? Math.ceil(num / mult) * mult : Math.floor(num / mult) * mult;
+
     },
     initChart() {
       this.chart = echarts.init(this.$el, 'macarons')
-      if(this.chartData.months){
-        this.setOptions(this.chartData)
-      }
+      this.setOptions(this.numberData)
     },
-    setOptions({ expectedData, actualData, moneyData, months} = {}) {
+    setOptions({ordercount,customerprice,ordertotal,customerArr,dateArr,retentionArr} = {}) {
       this.chart.setOption({
         xAxis: {
-          data: months,
-          boundaryGap: false,
+          data: this.dateArr,
+          boundaryGap: true,
           axisTick: {
             show: true
           }
@@ -115,38 +103,43 @@ export default {
         yAxis: [
           {
           	type: 'value',
-          	name: '数量',
+          	name: '交易量',
           	min: 0,
-          	max: this.numberMax(this.chartData.maxAccountData,this.chartData.maxChannelData)<10?10:this.numberMax(this.chartData.maxAccountData,this.chartData.maxChannelData),
-          	interval: this.numberMax(this.chartData.maxAccountData,this.chartData.maxChannelData)<10?2:(this.numberMax(this.chartData.maxAccountData,this.chartData.maxChannelData))/5,
+          	max: this.yAsix,
+          	interval: Math.ceil(this.yAsix/5),
           	axisLabel: {
-          		formatter: '{value} '
+          		formatter: '{value}'
           	}
           },
-          {
-          	type: 'value',
-          	name: '收益',
-          	min: 0,
-          	max: this.moneyMax(this.chartData.maxMoneyData),
-          	interval: (this.moneyMax(this.chartData.maxMoneyData) / 5),
-          	axisLabel: {
-          		formatter: '{value} 元'
-          	}
-          }
-
         ],
         legend: {
-          data: [ '订单','收益']
+          data: ['总订单数','总订单金额','客单价']
         },
         series: [{
-          name: '订单',
+          name: '总订单数', itemStyle: {
+            normal: {
+              color: '#4784FF',
+              lineStyle: {
+                color: '#4784FF',
+                width: 2
+              }
+            }
+          },
+          smooth: true,
+          type: 'bar',
+          data: ordercount,
+          animationDuration: 2800,
+          animationEasing: 'quadraticOut'
+        },
+        {
+          name: '总订单金额',
           smooth: true,
           type: 'line',
           itemStyle: {
             normal: {
-              color: '#3888fa',
+              color: '#EE7945',
               lineStyle: {
-                color: '#3888fa',
+                color: '#EE7945',
                 width: 2
               },
               areaStyle: {
@@ -154,20 +147,20 @@ export default {
               }
             }
           },
-          data: actualData,
+          data: ordertotal,
           animationDuration: 2800,
-          animationEasing: 'quadraticOut'
+          animationEasing: 'cubicInOut'
         },
         {
-          name: '收益',
+          name: '客单价',
           smooth: true,
-          type: 'line',
-          yAxisIndex: 1,
+          type: 'bar',
+          // yAxisIndex: 1,
           itemStyle: {
             normal: {
-              color: '#40c9c6',
+              color: '#49D3CE',
               lineStyle: {
-                color: '#40c9c6',
+                color: '#49D3CE',
                 width: 2
               },
               areaStyle: {
@@ -175,7 +168,7 @@ export default {
               }
             }
           },
-          data: moneyData,
+          data: customerprice,
           animationDuration: 2800,
           animationEasing: 'quadraticOut'
         }]