Browse Source

总览接口调整

lite
xyiege 3 years ago
parent
commit
68f1fe3a40
  1. 1
      config/index.js
  2. 6
      public/config.js
  3. 12
      src/api/home.js
  4. 4
      src/components/index/index.vue
  5. 65
      src/components/zongLan/zongLan.vue
  6. 6
      src/main.js
  7. 12
      src/utils/request.js

1
config/index.js

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

6
public/config.js

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

12
src/api/home.js

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

4
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>

65
src/components/zongLan/zongLan.vue

@ -5,19 +5,14 @@
<div class="keliu">
<div class="keliuTxt">客流趋势</div>
<div class="keliuBtn">
<div
v-for="(item, index) in keliuList"
:key="index"
class="btnItem"
@click="clickQushi(item.unit)"
:class="item.unit == selectVal1 ? 'btnItemS' : 'btnItemD'"
>
<div v-for="(item, index) in keliuList" :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
style="
position: absolute;
color: white;
top: 11%;
left: 18%;
font-weight: bold;
"
>
<div 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: [
"Mon",
"Tue",
"Wed",
"Thu",
"Fri",
"Sat",
"Sun",
"0c",
"90",
"10",
],
data: that.bar_tdata,
},
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,
//

6
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',

12
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

Loading…
Cancel
Save