总览接口调整

config/index.js

@@ -10,6 +10,7 @@ module.exports = {
     // Paths
     assetsSubDirectory: 'static',
     assetsPublicPath: '/',
+    // 代理
     proxyTable: {},
 
     // Various Dev Server settings

public/config.js

@@ -0,0 +1,6 @@
+window.publicConfig = {
+    // 必填: api地址, 换成自己的域名即可
+    // BASE_API: '../index.php?s=/store'
+    BASE_API: 'http://btgym.xingtongworld.com/'
+  }
+  

src/api/home.js

@@ -7,11 +7,11 @@ const api={
     daily_klqs:'index.php/allGroupTimeNum?granularity=daily'
 }
 
-// 获取用户信息
+// 获取群组
-export function apiGetUserInfo() {
+export function allGroupTimeNum(param) {
-    return httpRequest({
+    return request({
-		url: 'your api url',
+		url: api.daily_klqs,
-		method: 'post',
+		method: 'get',
-		data: param,
+		param,
 	})
 }

src/components/index/index.vue

@@ -14,10 +14,10 @@
             <div @click="clickItme(1)" class="ty guan" :class="selectVal == 1 ? 'ty_active' : 'ty'">
               <div class="txt">体育</div>
             </div>
-            <div @click="clickItme(2)" class="zl guan" :class="selectVal == 2 ? 'zl_active' : 'zl'">
+            <div  class="zl guan" :class="selectVal == 2 ? 'zl_active' : 'zl'">
               <div class="txt">总览</div>
             </div>
-            <div @click="clickItme(3)" class="wh guan" :class="selectVal == 3 ? 'wh_active' : 'wh'">
+            <div class="wh guan" :class="selectVal == 3 ? 'wh_active' : 'wh'">
               <div class="txt">文化</div>
             </div>
 

src/components/zongLan/zongLan.vue

@@ -5,19 +5,14 @@
         <div class="keliu">
           <div class="keliuTxt">客流趋势</div>
           <div class="keliuBtn">
-            <div
+            <div  v-for="(item, index) in keliuList" :key="index" class="btnItem" @click="clickQushi(item.unit)" 
-              v-for="(item, index) in keliuList"
+            :class="item.unit == selectVal1 ? 'btnItemS' : 'btnItemD'">
-              :key="index"
-              class="btnItem"
-              @click="clickQushi(item.unit)"
-              :class="item.unit == selectVal1 ? 'btnItemS' : 'btnItemD'"
-            >
               <div class="txt">{{ item.unit }}</div>
             </div>
           </div>
         </div>
 
-        <div class="tongjitu" id="homebar" style="height: 230px; width: 680px"></div>
+        <div class="tongjitu" id="homebar" style="height: 230px; width: 100%"></div>
 
         <div class="qushiBaifb">
           <div class="baifbLeft">
@@ -101,20 +96,12 @@
         <!-- 今日各场馆人数趋势 折线图 -->
         <div class="keliu keliuTu1">
           <div class="keliuTxt">今日各场馆人数趋势</div>
-          <div id="kl-line" style="width: 680px; height: 180px;"></div>
+          <div id="kl-line" style="width: 100%; height: 180px;"></div>
         </div>
       </div>
 
       <div class="middle">
-        <div
+        <div style=" position: absolute; color: white; top: 11%; left: 18%; font-weight: bold;  " >
-          style="
-            position: absolute;
-            color: white;
-            top: 11%;
-            left: 18%;
-            font-weight: bold;
-          "
-        >
           345,235
         </div>
         <div
@@ -243,6 +230,8 @@
 <script>
 // 引入echarts
 import * as echarts from "echarts";
+// 引入api
+import * as homeApi from '@/api/home'
 
 var uChartsInstance = {};
 export default {
@@ -260,6 +249,10 @@ export default {
           unit: "日",
         },
       ],
+      // 条线图
+      bar_data:[],
+      // 柱子图x轴
+      bar_tdata:[],
       selectVal1: "年",
     };
   },
@@ -268,6 +261,8 @@ export default {
     this.home_bar();
     // 折线图
     this.line_zone();
+    
+    this.getStat();
   },
   methods: {
     clickItme(val) {
@@ -277,27 +272,34 @@ export default {
       this.selectVal1 = val;
     },
 
+    //获取统计数据
+    getStat(){
+      let that = this
+      homeApi.allGroupTimeNum().then(res=>{
+        // get allTimeData
+        const tmpdata = res.data.allTimeData
+        let btdata = new Array();
+        let bvdata = new Array();
+        tmpdata.foreach(function(item,index){
+          console.log(item);
+        });
+
+      });
+    },
+
     // 透明背景柱状统计图
     home_bar() {
       var chartDom = document.getElementById("homebar");
       var myChart = echarts.init(chartDom);
       var option;
 
+      //
+      let that = this
+
       option = {
         xAxis: {
           type: "category",
-          data: [
+          data: that.bar_tdata,
-            "Mon",
-            "Tue",
-            "Wed",
-            "Thu",
-            "Fri",
-            "Sat",
-            "Sun",
-            "0c",
-            "90",
-            "10",
-          ],
         },
         yAxis: {
           type: "value",
@@ -311,7 +313,8 @@ export default {
         },
         series: [
           {
-            data: [120, 200, 150, 80, 70, 110, 130, 630, 530, 460],
+            //data: [120, 200, 150, 80, 70, 110, 130, 630, 530, 460],
+            data: that.bar_data,
             type: "bar",
             showBackground: true,
             // 设置顶部圆形

src/main.js

@@ -4,10 +4,14 @@ import Vue from 'vue'
 import App from './App'
 import router from './router'
 import less from 'less'
-Vue.config.productionTip = false
+//axios
+import axios from 'axios'
 
+Vue.config.productionTip = false
 
 Vue.use(less)
+Vue.use(axios)
+
 /* eslint-disable no-new */
 new Vue({
   el: '#app',

src/utils/request.js

@@ -1,14 +1,17 @@
 import axios from 'axios'
+
+//https://www.jb51.net/article/246548.htm
+
 // 创建一个 axios 实例
 const service = axios.create({
-	baseURL: '/api', // 所有的请求地址前缀部分
+	//baseURL: '/api', // 所有的请求地址前缀部分
+	//baseURL: publicConfig.BASE_API,
+	//baseURL:ahost,
 	timeout: 60000, // 请求超时时间毫秒
 	withCredentials: true, // 异步请求携带cookie
 	headers: {
 		// 设置后端需要的传参类型
 		'Content-Type': 'application/json',
-		'token': 'your token',
-		'X-Requested-With': 'XMLHttpRequest',
 	},
 })
 
@@ -20,7 +23,6 @@ service.interceptors.request.use(
 	},
 	function (error) {
 		// 对请求错误做些什么
-		console.log(error)
 		return Promise.reject(error)
 	}
 )
@@ -28,7 +30,7 @@ service.interceptors.request.use(
 // 添加响应拦截器
 service.interceptors.response.use(
 	function (response) {
-		console.log(response)
+		//console.log(response)
 		// 2xx 范围内的状态码都会触发该函数。
 		// 对响应数据做点什么
 		// dataAxios 是 axios 返回数据中的 data