数据接口对接

ui1
yujialong 3 years ago
parent 4a172c4890
commit d7ae5b59c3
  1. 2
      public/index.html
  2. 11
      src/api/index.js
  3. 187
      src/pages/data/list/index.vue
  4. 23
      src/pages/index/list/index.vue
  5. 4
      src/pages/user/list/index.vue
  6. 24
      src/plugins/requests/index.js
  7. 4
      src/setting.js

@ -5,7 +5,7 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="//at.alicdn.com/t/font_830376_qzecyukz0s.css">
<title>电子竞技数字化考试系统-用户端</title>
<title>或然数据平台</title>
</head>
<body>
<noscript>

@ -1,9 +1,11 @@
import Setting from '@/setting'
let uploadURL = Setting.upload.apiURL
let host = 'http://www.liuwanr.cn'
let host1 = 'http://192.168.31.125:8888'
export default {
// 登录注册
logins: `liuwanr/userInfo/adminLogins`,
logins: `${host}/liuwanr/userInfo/adminLogins`,
uploadUserAvatars: `liuwanr/userInfo/uploadUserAvatars`,
queryProvince: `liuwanr/province/queryProvince`,
@ -53,4 +55,11 @@ export default {
delRolePermission:`evaluation/sys-permission/delRolePermission`,
queryPermissionArrById:`evaluation/sys-permission/queryPermissionArrById`,
roleTree:`evaluation/sys-permission/tree`,
// 表展示
getIdQueryTable:`/data/huoran/data/table/getIdQueryTable`,
getTableByClassification:`/data/huoran/data/table/getTableByClassification`,
getTableByCondition:`/data/huoran/data/table/getTableByCondition`,
downloadData:`/data/data/download`,
previewData:`${host1}/data/data/preview`,
}

@ -1,66 +1,66 @@
<template>
<div class="wrap">
<div class="left">
<el-menu class="menu" @open="handleOpen" @close="handleClose" :default-active="active">
<el-menu class="menu" @open="handleOpen" @close="handleClose" @select="selectType" unique-opened :default-active="active">
<template v-for="item in typeList">
<!-- 如果第一层有子菜单则继续循环 -->
<template v-if="item.subs">
<el-submenu :index="item.index" :key="item.index">
<template v-if="item.children.length">
<el-submenu :index="item.id" :key="item.id">
<template slot="title">
<i :class="item.icon"></i>
<span slot="title">{{ item.title }}</span>
<span slot="title">{{ item.categoryName }}</span>
</template>
<!-- 第二层 -->
<template v-for="subItem in item.subs">
<template v-for="subItem in item.children">
<!-- 如果第二层有子菜单则继续循环 -->
<template v-if="subItem.subs">
<el-submenu :index="subItem.index" :key="subItem.index">
<template v-if="subItem.children.length">
<el-submenu :index="subItem.id" :key="subItem.id">
<template slot="title">
<span slot="title">{{ subItem.title }}</span>
<span slot="title">{{ subItem.categoryName }}</span>
</template>
<!-- <el-menu-item v-for="(threeItem,i) in subItem.subs" :key="i" :index="threeItem.index">{{ threeItem.title }}</el-menu-item> -->
<!-- <el-menu-item v-for="(threeItem,i) in subItem.children" :key="i" :index="threeItem.index">{{ threeItem.title }}</el-menu-item> -->
<!-- 第三层 -->
<template v-for="subItem2 in subItem.subs">
<template v-for="subItem2 in subItem.children">
<!-- 如果第三层有子菜单则继续循环 -->
<template v-if="subItem2.subs">
<el-submenu :index="subItem2.index" :key="subItem2.index">
<template v-if="subItem2.children.length">
<el-submenu :index="subItem2.id" :key="subItem2.id">
<template slot="title">
<span slot="title">{{ subItem2.title }}</span>
<span slot="title">{{ subItem2.categoryName }}</span>
</template>
<!-- <el-menu-item v-for="(fourItem,i) in subItem2.subs" :key="i" :index="fourItem.index">{{ fourItem.title }}</el-menu-item> -->
<!-- <el-menu-item v-for="(fourItem,i) in subItem2.children" :key="i" :index="fourItem.index">{{ fourItem.title }}</el-menu-item> -->
<!-- 第四层 -->
<template v-for="subItem3 in subItem2.subs">
<template v-for="subItem3 in subItem2.children">
<!-- 如果第四层有子菜单则继续循环 -->
<template v-if="subItem3.subs">
<el-submenu :index="subItem3.index" :key="subItem3.index">
<template v-if="subItem3.children">
<el-submenu :index="subItem3.id" :key="subItem3.id">
<template slot="title">
<!-- <i :class="item.icon"></i> -->
<!-- <span slot="title">{{ subItem2.title }}</span> -->
{{ subItem3.title }}
{{ subItem3.categoryName }}
</template>
<el-menu-item v-for="(fiveItem,i) in subItem3.subs" :key="i" :index="fiveItem.index">{{ fiveItem.title }}</el-menu-item>
<el-menu-item v-for="(fiveItem,i) in subItem3.children" :key="i" :index="fiveItem.id">{{ fiveItem.categoryName }}</el-menu-item>
</el-submenu>
</template>
<!-- 如果第四层没有子菜单 -->
<el-menu-item v-else :index="subItem3.index" :key="subItem3.index">{{ subItem3.title }}</el-menu-item>
<el-menu-item v-else :index="subItem3.id" :key="subItem3.id">{{ subItem3.categoryName }}</el-menu-item>
</template>
</el-submenu>
</template>
<!-- 如果第三层没有子菜单 -->
<el-menu-item v-else :index="subItem2.index" :key="subItem2.index">{{ subItem2.title }}</el-menu-item>
<el-menu-item v-else :index="subItem2.id" :key="subItem2.id">{{ subItem2.categoryName }}</el-menu-item>
</template>
</el-submenu>
</template>
<!-- 如果第二层没有子菜单 -->
<el-menu-item v-else :index="subItem.index" :key="subItem.index">{{ subItem.title }}</el-menu-item>
<el-menu-item v-else :index="subItem.id" :key="subItem.id">{{ subItem.categoryName }}</el-menu-item>
</template>
</el-submenu>
</template>
<!-- 如果第一层没有子菜单 -->
<template v-else>
<el-menu-item :index="item.index" :key="item.index">
<el-menu-item :index="item.id" :key="item.id">
<i :class="item.icon"></i>
<span slot="title">{{ item.title }}</span>
<span slot="title">{{ item.categoryName }}</span>
</el-menu-item>
</template>
</template>
@ -69,16 +69,14 @@
<div class="right">
<div class="block">
<h6 class="title">数据介绍</h6>
<div class="desc">
测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试
</div>
<div class="desc">{{introduce}}</div>
<el-table :data="listData" class="table" stripe header-align="center" row-key="id">
<el-table-column type="index" width="100" label="序号" align="center"></el-table-column>
<el-table-column prop="practiseName" label="数据表名称" align="center"></el-table-column>
<el-table-column prop="paperName" label="数据总量" align="center"></el-table-column>
<el-table-column prop="questionsNum" label="数据大小" align="center"></el-table-column>
<el-table-column prop="peopleNum" label="更新时间" align="center"></el-table-column>
<el-table-column prop="showName" label="数据表名称" align="center"></el-table-column>
<el-table-column prop="dataTotal" label="数据总量" align="center"></el-table-column>
<el-table-column prop="dataSize" label="数据大小" align="center"></el-table-column>
<el-table-column prop="updateTime" label="更新时间" align="center"></el-table-column>
<el-table-column label="操作" width="220" align="center">
<template slot-scope="scope">
<el-button type="text" @click="preview(scope.row)">预览</el-button>
@ -91,25 +89,12 @@
</div>
</div>
<div class="block">
<div class="block" v-if="previewHead.length">
<h6 class="title">数据预览</h6>
<el-table :data="previewData" class="table" stripe header-align="center" row-key="id">
<el-table-column type="index" width="100" label="序号" align="center"></el-table-column>
<el-table-column prop="practiseName" label="代码" align="center"></el-table-column>
<el-table-column prop="paperName" label="名称" align="center"></el-table-column>
<el-table-column prop="questionsNum" label="最新价" align="center"></el-table-column>
<el-table-column prop="peopleNum" label="涨跌额" align="center"></el-table-column>
<el-table-column prop="peopleNum" label="涨跌幅" align="center"></el-table-column>
<el-table-column prop="peopleNum" label="今开" align="center"></el-table-column>
<el-table-column prop="peopleNum" label="最高" align="center"></el-table-column>
<el-table-column prop="peopleNum" label="最低" align="center"></el-table-column>
<el-table-column prop="peopleNum" label="昨结" align="center"></el-table-column>
<el-table-column prop="peopleNum" label="成交量" align="center"></el-table-column>
<el-table-column prop="peopleNum" label="成交额" align="center"></el-table-column>
<el-table-column prop="peopleNum" label="买盘(外盘)" align="center"></el-table-column>
<el-table-column prop="peopleNum" label="买盘(内盘)" align="center"></el-table-column>
<el-table-column prop="peopleNum" label="持仓量" align="center"></el-table-column>
<el-table-column v-for="(item,index) in previewHead" :prop="item.field" :label="item.comment" align="center"></el-table-column>
</el-table>
<div class="pagination">
<el-pagination background @current-change="handlePreviewCurrentChange" :current-page="pagePreview" layout="total, prev, pager, next" :total="totalPreview"></el-pagination>
@ -121,16 +106,16 @@
<el-form ref="form" label-width="100px" label-suffix="">
<el-form-item label="数据筛选">
<div class="checkboxs">
<el-checkbox-group v-model="field">
<el-checkbox v-for="(item,index) in fieldList" :key="index" :label="item.name"></el-checkbox>
<el-checkbox-group v-model="fields">
<el-checkbox v-for="(item,index) in previewHead" :key="index" :label="item.comment"></el-checkbox>
</el-checkbox-group>
</div>
</el-form-item>
<el-form-item label="开始时间">
<el-date-picker v-model="startTime" type="date" placeholder="请选择开始时间" size="small"></el-date-picker>
<el-date-picker v-model="startTime" type="date" placeholder="请选择开始时间" size="small" format="yyyy-MM-dd" value-format="yyyy-MM-dd"></el-date-picker>
</el-form-item>
<el-form-item label="结束时间">
<el-date-picker v-model="endTime" type="date" placeholder="请选择结束时间" size="small"></el-date-picker>
<el-date-picker v-model="endTime" type="date" placeholder="请选择结束时间" size="small" format="yyyy-MM-dd" value-format="yyyy-MM-dd"></el-date-picker>
</el-form-item>
<el-form-item label="数据频率">
<el-select v-model="frequency" placeholder="请选择数据频率" size="small">
@ -148,33 +133,26 @@
</template>
<script>
import axios from 'axios'
import util from '@/libs/util'
export default {
data() {
return {
typeList: [
{
icon: 'menu-icon icon-index',
index: '1',
title: '股票数据'
},{
icon: 'menu-icon icon-index',
index: '2',
title: '期货数据',
},
],
active: '1',
listData: [
{}
],
typeList: [],
active: '',
introduce: '',
listData: [],
page: 1,
pageSize: 10,
total: 0,
previewHead: [],
previewData: [],
pagePreview: 1,
pageSizePreview: 10,
totalPreview: 0,
downloadVisible: false,
field: [],
tableName: '',
fields: [],
startTime: '',
endTime: '',
frequency: '',
@ -208,27 +186,87 @@ export default {
}
},
mounted() {
this.getType()
},
methods: {
getType(){
this.$post(this.api.getTableByClassification).then(res => {
res.map(n => {
n.id = String(n.id)
n.children.map(n => {
n.id = String(n.id)
})
})
this.typeList = res
if(res[0].children.length){
this.active = res[0].children[0].id
}else{
this.active = res[0].id
}
this.getData()
}).catch(res => {})
},
getData(){
let data = {
endTime: '',
fields: [],
frequency: '',
startTime: '',
tableName: '',
}
// util.successMsg('')
// location.href = 'http://192.168.31.125:8888/data/data/download?endTime=&frequency=&startTime=&tableName='
// this.$get(this.api.download,data).then(res => {
// }).catch(res => {})
this.$post(`${this.api.getIdQueryTable}?categoryId=${this.active}&showName=&pageNum=${this.page}&pageSize=${this.pageSize}`).then(res => {
this.listData = res.list
this.total = res.totalCount
}).catch(res => {})
},
handleCurrentChange(val) {
this.page = val
this.$refs.table.clearSelection()
this.getData()
},
selectType(index,indexPath){
this.active = index
this.introduce = this.typeList.find(n => n.id == indexPath[0]).introduce
this.previewHead = []
this.previewData = []
this.getData()
},
handlePreviewCurrentChange(val) {
this.pagePreview = val
this.$refs.table.clearSelection()
this.getData()
},
preview(row){
this.$get(`${this.api.previewData}?tableName=${row.name}`).then(res => {
let comment = res.comment
let previewHead = []
comment.map(n => {
n.field != 'id' && n.field != 'operation_time' && previewHead.push(n)
})
this.previewHead = previewHead
this.previewData = res.data
}).catch(res => {})
},
download(row){
this.tableName = row.name
this.downloadVisible = true
this.$get(`${this.api.previewData}?tableName=${row.name}`).then(res => {
let comment = res.comment
let previewHead = []
comment.map(n => {
n.field != 'id' && n.field != 'operation_time' && previewHead.push(n)
})
this.previewHead = previewHead
}).catch(res => {})
},
closeDownload(){
@ -240,7 +278,17 @@ export default {
},
confirmDown(){
// return console.log(this.startTime,this.endTime)
let fields = this.fields
let newFields = []
let previewHead = this.previewHead
fields.map(n => {
newFields.push(`fields=${previewHead.find(e => e.comment == n).field}`)
})
// return console.log(this.fields,newFields)
this.$get(`${this.api.downloadData}?tableName=${this.tableName}&${newFields.join('&')}&startTime=${this.startTime}&endTime=${this.endTime}&frequency=${this.frequency}`).then(res => {
}).catch(res => {})
}
}
};
@ -263,6 +311,8 @@ export default {
}
}
}
.right{
flex: 1;
.block{
padding: 34px;
margin-bottom: 20px;
@ -282,4 +332,5 @@ export default {
}
}
}
}
</style>

@ -13,15 +13,15 @@
<template v-if="keyword">
<div class="tips">
<p class="result">搜索结果</p>
<p class="num">搜索完成共有4个结果匹配</p>
<p class="num">搜索完成共有{{total}}个结果匹配</p>
</div>
<el-table :data="listData" class="table" ref="table" stripe header-align="center" @selection-change="handleSelectionChange">
<el-table-column type="index" width="100" label="序号" align="center"></el-table-column>
<el-table-column prop="roleName" label="数据表名称" align="center"></el-table-column>
<el-table-column prop="roleName" label="数据总量" align="center"></el-table-column>
<el-table-column prop="roleName" label="数据大小" align="center"></el-table-column>
<el-table-column prop="roleName" label="更新时间" align="center"></el-table-column>
<el-table-column prop="showName" label="数据表名称" align="center"></el-table-column>
<el-table-column prop="dataTotal" label="数据总量" align="center"></el-table-column>
<el-table-column prop="dataSize" label="数据大小" align="center"></el-table-column>
<el-table-column prop="updateTime" label="更新时间" align="center"></el-table-column>
<el-table-column label="操作" width="180" align="center">
<template slot-scope="scope">
<el-button type="text" @click="download(scope.row)">下载</el-button>
@ -52,16 +52,23 @@ export default {
keyword: function(val) {
clearTimeout(this.searchTimer)
this.searchTimer = setTimeout(() => {
this.getData()
this.initData()
},500)
}
},
mounted() {
this.initData()
},
methods: {
getData(){
this.$post(`${this.api.getTableByCondition}?showName=${this.keyword}&pageNum=${this.page}&pageSize=${this.pageSize}`).then(res => {
this.listData = res.list
this.total = res.totalCount
}).catch(res => {})
},
initData(){
this.page = 1
this.getData()
},
handleCurrentChange(val) {
this.page = val

@ -96,8 +96,8 @@
</div>
</template>
<script>
import Setting from '@/setting';
import { mapState } from 'vuex';
import Setting from '@/setting'
import { mapState } from 'vuex'
import util from '@/libs/util'
export default {
data() {

@ -5,7 +5,7 @@ import Setting from '@/setting'
const service = axios.create({
baseURL: Setting.apiBaseURL,
timeout: 50000
timeout: 10000000
})
// post请求头
@ -32,18 +32,18 @@ service.defaults.headers.post['Content-Type'] = 'application/json;charset=UTF-8'
service.interceptors.response.use(
response => {
const res = response.data
if (res.status == 200) {
// if (res.status == 200) {
return Promise.resolve(res).catch(e => {})
} else {
switch (res.code) {
case 201:
util.errorMsg(res.message ? res.message : '数据请求异常')
break;
default:
Promise.reject(res).catch(e => {})
}
return Promise.reject(res).catch(e => {})
}
// } else {
// switch (res.code) {
// case 201:
// util.errorMsg(res.message ? res.message : '数据请求异常')
// break;
// default:
// Promise.reject(res).catch(e => {})
// }
// return Promise.reject(res).catch(e => {})
// }
},
// 服务器状态码不是200的情况
error => {

@ -15,8 +15,8 @@ const Setting = {
// 页面切换时,是否显示模拟的进度条
showProgressBar: true,
// 接口请求地址
// apiBaseURL: env === 'development' ? 'http://192.168.31.151:8001' : 'http://39.108.250.202:8000',
apiBaseURL: env === 'development' ? 'http://www.occupationlab.com' : 'http://www.liuwanr.cn',
// apiBaseURL: env === 'development' ? 'http://192.168.31.125:8888' : 'http://39.108.250.202:8000',
apiBaseURL: env === 'development' ? 'http://192.168.31.216:8888' : 'http://www.liuwanr.cn',
// 接口请求返回错误时,弹窗的持续时间,单位:秒
modalDuration: 3,
// 接口请求返回错误时,弹窗的类型,可选值为 Message 或 Notice

Loading…
Cancel
Save