Skip to content

R
robot-monitor
Commit 3113ec2e authored by 王奇's avatar 王奇
Browse files
Options

add currency

parent 6c0e3067
Show whitespace changes
Inline Side-by-side
Showing with 587 additions and 1 deletion
src/components/navLeft.vue
View file @ 3113ec2e
......@@ -13,7 +13,7 @@
<template slot="title">网站监控</template>
<el-menu-item :index="`/monitor/${index}`" v-for="(item, index) in platInfo" :key="item.platform">{{item.platform}}</el-menu-item>
</el-submenu>
<el-submenu index="2" v-if="environment=='inside'">>
<el-submenu index="2" v-if="environment=='inside'">
<template slot="title">币种监控</template>
<el-menu-item index="/monitor/BTY">BTY</el-menu-item>
<el-menu-item index="/monitor/YCC">YCC</el-menu-item>
......@@ -24,6 +24,9 @@
<el-menu-item index="/monitor/coinRecharge" v-if="environment=='inside'">
<span slot="title">币种充提统计</span>
</el-menu-item>
<el-menu-item index="/monitor/currency" v-if="environment=='inside'">
<span slot="title">币种波动统计</span>
</el-menu-item>
</el-menu>
</div>
</template>
......
src/router/index.js
View file @ 3113ec2e
......@@ -24,6 +24,12 @@ const router = new Router({
children:
[
{
path: '/monitor/currency',
component: function(resolve){
require(['../views/currency.vue'],resolve);
},
},
{
path: '/monitor/account',
component: function(resolve){
require(['../views/account.vue'],resolve);
......
src/views/currency.vue 0 → 100644
View file @ 3113ec2e
<template>
<div class="overview">
<div class="overview-title">
<span>币种波动统计</span>
</div>
<ul class="classify-overview">
<li class="normal" :class="{ 'filter' : robotStatus === 'normal'}" @click="statusFilter('normal')">
<p>{{robotStatusList.status_normal}}</p>
<p>正在运行(台)</p>
</li>
<li class="stop" :class="{ 'filter' : robotStatus === 'stop'}" @click="statusFilter('stop')">
<p>{{robotStatusList.status_stop}}</p>
<p>停止运行(台)</p>
</li>
<li class="abnormal" :class="{ 'filter' : robotStatus === 'profit'}" @click="statusFilter('profit')" v-if="environment=='inside'">
<p>{{robotStatusList.profit_status_abnormal}}</p>
<p>目标币今日波动异常(台)</p>
</li>
<li class="abnormal" :class="{ 'filter' : robotStatus === 'coin'}" @click="statusFilter('coin')">
<p>{{robotStatusList.coin_status_abnormal}}</p>
<p>基础币今日波动异常(台)</p>
</li>
<li class="abnormal" :class="{ 'filter' : robotStatus === 'base'}" @click="statusFilter('base')">
<p>{{robotStatusList.base_status_abnormal}}</p>
<p>目标币余额异常(台)</p>
</li>
<li class="abnormal" :class="{ 'filter' : robotStatus === 'balance'}" @click="statusFilter('balance')">
<p>{{robotStatusList.base_status_abnormal}}</p>
<p>基础币余额异常(台)</p>
</li>
</ul>
<!-- 当日波动统计 -->
<div class="record-box">
<div class="boxTitle">
<div class="title-box clearfix">
<span class="title">当日波动统计</span>
</div>
<!-- 通过机器人搜索框 -->
<div class="robotInput">
<el-input v-model="robotAccount" placeholder="通过机器人UID、账户地址搜索">
<el-button @click="searchByAccount" slot="append" icon="el-icon-search"></el-button>
</el-input>
</div>
<!-- 交易所筛选 -->
<div>
</div>
<!-- 币种筛选 -->
<div>
</div>
</div>
<!-- 阶段统计和导出以及日期框 -->
<div>
<el-button type="primary">阶段统计</el-button>
<el-button type="primary">导出当前</el-button>
<el-button type="primary">导出所有</el-button>
<el-date-picker
v-model="selectTime"
type="daterange"
align="right"
unlink-panels
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</div>
<el-table
v-loading="Loading"
:data="tableData"
stripe
style="width: 100%">
<el-table-column
width="150"
label="机器人UID">
<template slot-scope="scope">
<span>{{ scope.row.coin_id }}</span>
</template>
</el-table-column>
<el-table-column
label="目标币当日波动量(比例)"
>
<template slot-scope="scope">
<i class="iconfont" :class=" 'icon-'+scope.row.coin+'3'"></i>
<span>{{ scope.row.coin }}</span>
</template>
</el-table-column>
<el-table-column
label="基础币当日波动量(比例)">
<template slot-scope="scope">
<span>{{ scope.row.active }}</span>
</template>
</el-table-column>
<el-table-column
label="当日手续费"
width="150">
<template slot-scope="scope">
<span>{{ scope.row.records || 0 }}</span>
</template>
</el-table-column>
<el-table-column
label="当日手续费"
width="150">
<template slot-scope="scope">
<span>{{ scope.row.min_amount }}</span>
</template>
</el-table-column>
<el-table-column
label="日期"
width="150">
<template slot-scope="scope">
<span>{{ scope.row.recharge_amount }}</span>
</template>
</el-table-column>
</el-table>
</div>
<p v-if="robotList === null" class="no-data">暂无数据</p>
</div>
</template>
<script>
import Bus from '../assets/js/bus'
import axios from 'axios';
import ApiConfig from "../config/api-config";
import ClickOutside from 'vue-click-outside';
export default {
data() {
return {
selectTime:"", //筛选时间
environment:sessionStorage.getItem('environment'),
robotAccount: '',//通过机器人账户搜索
_robotAccount: '',//说明通过机器人账户搜索成功
platform: '',//导航选中的交易所
value1: true, //是否开启机器人
robotStatus: '', //机器人状态
robotStatusList: [],//状态预警信息
RobotListParams: {
class: "robot", //账户级别
coin: [], //目标币种，用于首页里的筛选和币种监控 可选参数
symbol: [], //币种对，用于网站监控里的筛选 可选参数
status: "", //机器人运行状态 可选参数
abnormal: "", //有profit,coin,base这三种异常类别 可选参数
platform: [] //交易所种类 可选参数
},//筛选机器人参数
robotList: [],//符合条件的机器人列表
robotDetailInfo: '',
subtitle: '所有机器人', //副标题
checkAll: false, //交易所筛选
checkedWebs: [],
webs: [],
isIndeterminate: true,
foldExchange: true,
checkAll0: false, //币种筛选
checkedCurrencies: [],
allCurrencies: [],//所有币种
currencies: [],//符合交易所条件的所有币种
isIndeterminate0: true,
foldExchange0: true,
checkAll1: false, //交易对筛选
checkedPairs: [],
pairs: [],
isIndeterminate1: true,
foldExchange1: true,
showWebFilter: false,//是否显示交易所过滤
showCurrencyFilter: false,//是否显示币种过滤
showPairFilter: false,//是否显示交易对过滤
};
},
props: ['platInfo'],
mounted () {
// prevent click outside event with popupItem.
this.popupItem = this.$refs.selectBar
},
// do not forget this section
directives: {
ClickOutside
},
created() {
this.webs = this.webs.length === 0 && sessionStorage.getItem('webs') ? JSON.parse(sessionStorage.getItem('webs')) : this.webs;
this.currencies = this.currencies.length === 0 && sessionStorage.getItem('currencies') ? JSON.parse(sessionStorage.getItem('currencies')) : this.currencies;
this.init();
Bus.$on('refresh', ()=>{
this.robotAccount = this._robotAccount ='';
this.checkAll = false;
this.isIndeterminate = true;
this.foldExchange = true;
this.checkAll0 = false;
this.isIndeterminate0 = true;
this.foldExchange0 = true;
this.checkAll1 = false;
this.isIndeterminate1 = true;
this.foldExchange1 = true;
this.checkedWebs = [];
this.checkedCurrencies = [];
this.checkedPairs = [];
this.robotStatus = '', //机器人状态
this.subtitle = '所有机器人';
this.init();
});
Bus.$on('back', ()=>{
this.init('back');
})
},
beforeDestroy() {
Bus.$off('refresh');
Bus.$off('back');
},
methods: {
init(type) {
const RoutePath = this.$route.path;
const RouteParam = RoutePath.split('/')[2];
var StatusParams = {platform: '', coin: ''};//预警状态查询入参
switch (RouteParam) {
case 'home':
this.checkedPairs = [];
this.showWebFilter = this.showCurrencyFilter = true;
this.showPairFilter = false;
this.RobotListParams.coin = [];
this.RobotListParams.platform = [];
break;
case 'BTY':
case 'YCC':
this.checkedPairs = [];
this.checkedCurrencies = [];
this.showWebFilter = true;
this.showCurrencyFilter = this.showPairFilter = false;
StatusParams.coin = RouteParam;
this.RobotListParams.coin = [RouteParam];
this.RobotListParams.platform = [];
break;
default:
this.checkedWebs = [];
this.checkedCurrencies = [];
this.showPairFilter = true;
this.showWebFilter = this.showCurrencyFilter = false;
var index = +RouteParam;
this.pairs = JSON.parse(sessionStorage.getItem('platInfo'))[index].symbol;
if(type !== 'back') {
this.checkedPairs = [];
}
this.platform = JSON.parse(sessionStorage.getItem('platInfo'))[index].platform;
StatusParams.platform = this.platform;
this.RobotListParams.platform = [this.platform];
this.RobotListParams.coin = [];
break;
}
this.getRobotStatus(StatusParams);
if (type === 'back') {
let Coin = RouteParam === 'BTY' || RouteParam === 'YCC' ? [RouteParam] : [];
let Platform = (RouteParam!=='home'&&RouteParam!=='BTY'&&RouteParam !== 'YCC') ? [this.platform] : [];
var Params = {//详情返回时的请求参数
class: "robot", //账户级别
coin: Coin, //目标币种，用于首页里的筛选和币种监控 可选参数
symbol: "", //币种对，用于网站监控里的筛选 可选参数
status: "", //机器人运行状态 可选参数
abnormal: "", //有profit,coin,base这三种异常类别 可选参数
platform: Platform //交易所种类 可选参数
};
if (this.robotStatus==='normal' || this.robotStatus==='stop') {
Params.status = this.robotStatus;
}else {
Params.abnormal = this.robotStatus;
}
if (!this.robotStatus) {
Params.coin = Coin.length !== 0 ? Coin : this.checkedCurrencies;
Params.platform = Platform.length !== 0 ? Platform : this.checkedWebs;
Params.symbol = this.checkedPairs;
}
Params = this._robotAccount!=='' ? {class: "robot", account: this._robotAccount} : Params;
this.getRobotList(Params);
}else {
this.getRobotList(this.RobotListParams);
}
},
//机器人预警状态查询
getRobotStatus(params) {
axios.post(ApiConfig.GetRobotStatus,params).then( res => {
if (res.data.code === 200) {
// console.log(res.data)
this.robotStatusList = res.data.data;
}
})
},
//获取符合筛选条件的机器人列表
getRobotList(params) {
axios.post(ApiConfig.GetMatchRobots,params).then( res => {
if (res.data.code === 200) {
// console.log(res.data.data);
this.robotList = res.data.data;
}
}).catch( error => {
this.$notify({
title: '错误',
message: "服务器崩溃啦，请稍后再试",
type: 'error',
duration:'2000',
});
})
},
//通过机器人状态筛选
statusFilter(status) {
this.robotAccount = this._robotAccount ='';
this.robotStatus = status;
this.subtitle = status === 'normal' ? '正在运行机器人' :
(status === 'stop' ? '停止运行机器人' :
(status === 'profit' ? '盈利异常机器人' :
(status === 'coin' ? '目标币异常机器人' :
(status === 'base' ? '基础币异常机器人':'所有机器人'))));
//筛选机器人参数
const path = this.$route.params.name;
let Coin = path === 'BTY' || path === 'YCC' ? [path] : [];
let Platform = (path!=='home'&&path!=='BTY'&&path !== 'YCC') ? [this.platform] : [];
var ListParams = {
class: "robot", //账户级别
coin: Coin, //目标币种，用于首页里的筛选和币种监控 可选参数
symbol: [], //币种对，用于网站监控里的筛选 可选参数
status: "", //机器人运行状态 可选参数
abnormal: "", //有profit,coin,base这三种异常类别 可选参数
platform: Platform, //交易所种类 可选参数
};
if (status==='normal' || status==='stop') {
ListParams.status = status;
}else {
ListParams.abnormal = status;
}
this.getRobotList(ListParams);
},
//通过机器人账户搜索
searchByAccount() {
if (!this.robotAccount) {
this.$notify({
title: '错误',
message: "请先输入账户地址后再试",
type: 'error',
duration:'2000',
});
return;
}
this.checkAll = false;
this.isIndeterminate = true;
this.foldExchange = true;
this.checkAll0 = false;
this.isIndeterminate0 = true;
this.foldExchange0 = true;
this.checkAll1 = false;
this.checkedPairs = [];
this.isIndeterminate1 = true;
this.foldExchange1 = true;
this.checkedWebs = [];
this.checkedCurrencies = [];
this.checkedPairs = [];
let Params = {
class:"robot", //账户级别 有robot bank admin三个返回数据也不同
account: this.robotAccount,
}
this._robotAccount = this.robotAccount;
this.getRobotList(Params);
},
},
watch:{
platInfo(val){
this.webs = [];
//获取所有的交易所和币种
for (let item of this.platInfo){
this.webs.push(item.platform);
this.currencies = this.allCurrencies = [...new Set(this.currencies.concat(item.coin))];
sessionStorage.setItem('webs', JSON.stringify(this.webs));
sessionStorage.setItem('currencies', JSON.stringify(this.currencies));
}
}
}
};
</script>
<style scoped>
.record-box {
background:rgba(255,255,255,1);
border-radius:4px;
border:1px solid rgba(119,146,167,1);
padding: 20px;
margin: 20px 0 20px 0;
}
.title-box {
position: relative;
z-index: 10;
margin: 25px 0 20px 0;
/*margin-bottom: 20px;*/
&>.title {
display: inline-block;
/*margin-bottom: 20px;*/
line-height: 40px;
font-size:18px;
color:rgba(51,51,51,1);
}
}
.title {
display: inline-block;
width: 125px;
text-align: center;
position: relative;
}
.overview-title {
position: relative;
height: 40px;
line-height: 40px;
margin-bottom: 20px;
font-size:18px;
color:rgba(51,51,51,1);
}
ul.classify-overview {
height: 100px;
display:flex;
justify-content:space-between;
li {
cursor: pointer;
position: relative;
float: left;
width: 18.8%;
height: 100px;
margin-right: 1.5%;
text-align: center;
box-sizing: border-box;
border-radius:4px;
padding-top: 16px;
&:last-child {
margin-right: 0;
}
p {
font-size:12px;
&:first-child {
font-size:24px;
margin-bottom: 13px;
}
}
}
li.normal {
background:rgba(241,250,244,1);
border:1px solid rgba(166,216,186,1);
color:rgba(76,171,115,1);
}
li.stop {
background:rgba(239,243,245,1);
border:1px solid rgba(199,217,225,1);
color:rgba(121,130,134,1);
}
li.abnormal {
margin-right: 20px;
background:rgba(248,243,243,1);
border:1px solid rgba(236,184,184,1);
color:rgba(217,120,120,1);
}
li.filter {
height: 120px;
top: -10px;
color: #fff;
&.normal {
background-color: rgba(76,171,115,1);
}
&.stop {
background-color:rgba(121,130,134,1);
}
&.abnormal {
background-color: rgba(217,120,120,1);
}
}
}
.el-icon-caret-right {
color: rgba(192,212,218,1);
}
.robot-name {
font-size:14px;
font-weight: 600;
color:rgba(51,51,51,1);
line-height:20px;
text-align: center;
margin: 12px 0 20px 0;
}
.chart-box {
margin: auto;
width: 154px;
box-sizing: border-box;
height: 154px;
border-radius: 50%;
text-align: center;
position: relative;
padding-top: 43px;
.title {
height: 17px;
font-size:12px;
color:rgba(128,128,128,1);
line-height:17px;
}
.data {
font-size:24px;
line-height:33px;
&.gain {
color:rgba(217,120,120,1);
}
&.lose {
color:rgba(76,171,115,1);
}
&.none {
color:rgba(208,216,220,1);
}
}
div {
height: 40px;
width: 100%;
background-color: white;
position: absolute;
bottom: -5px;
.type {
font-size:14px;
line-height:20px;
/* margin: -10px 0 4px 0; */
}
.inside{
margin: -10px 0 4px 0;
}
.outside{
margin: -50px 0 4px 0;
}
.result {
font-size:12px;
color:rgba(128,128,128,1);
line-height:17px;
}
.data {
font-size:14px;
line-height:20px;
}
}
}
.coin,.base {
height: 20px;
line-height: 20px;
font-size:12px;
color:rgba(128,128,128,1);
.sum {
float: right;
font-size:14px;
color:rgba(51,51,51,1);
}
}
.coin {
margin: 19px 0 10px 0;
}
.no-data {
text-align: center;
font-size: 20px;
margin-top: 100px;
}
.search-box {
width: 300px;
margin: 0px 0 20px 0;
}
.boxTitle {
display: flex;
/* justify-content: center; */
align-items: center;
}
.robotInput{
margin-left: 20px;
}
</style>
<style>
/*select组件样式覆盖*/
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment