133 lines
4.0 KiB
HTML
133 lines
4.0 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<!-- import CSS -->
|
|
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
|
|
</head>
|
|
<body>
|
|
<div id="app">
|
|
<el-row v-loading="loading"
|
|
element-loading-text="拼命加载中"
|
|
element-loading-spinner="el-icon-loading"
|
|
>
|
|
<el-col :span="3" :offset="1">
|
|
<el-select v-model="game" placeholder="请选择">
|
|
<el-option
|
|
v-for="item in options"
|
|
:key="item.value"
|
|
:label="item.label"
|
|
:value="item.value">
|
|
</el-option>
|
|
</el-select>
|
|
</el-col>
|
|
|
|
<el-col :span="5">
|
|
<el-time-picker
|
|
is-range
|
|
v-model="date"
|
|
range-separator="至"
|
|
start-placeholder="开始时间"
|
|
end-placeholder="结束时间"
|
|
placeholder="选择时间范围">
|
|
</el-time-picker>
|
|
</el-col>
|
|
|
|
<el-col :span="1">
|
|
<el-button icon="el-icon-search" circle @click="seach()"></el-button>
|
|
</el-col>
|
|
|
|
<el-col :span="2" :offset="10">
|
|
<el-switch
|
|
v-model="isDev"
|
|
active-text="测试"
|
|
inactive-text="生产">
|
|
</el-switch>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
|
|
<el-row v-html="userTable">
|
|
|
|
</el-row>
|
|
|
|
<el-row v-html="paylistTable">
|
|
|
|
</el-row>
|
|
|
|
|
|
<el-row v-html="eventTable">
|
|
|
|
</el-row>
|
|
|
|
</div>
|
|
</body>
|
|
<!-- import Vue before Element -->
|
|
<script src="https://unpkg.com/vue/dist/vue.js"></script>
|
|
<!-- import JavaScript -->
|
|
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
|
|
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
|
|
<script>
|
|
const curTime = new Date();
|
|
|
|
new Vue({
|
|
el: '#app',
|
|
|
|
|
|
data: function () {
|
|
return {
|
|
options: [{
|
|
value: 'fengbaoqibing',
|
|
label: '风暴奇兵'
|
|
}, {
|
|
value: 'geshouccs',
|
|
label: '歌手ccs'
|
|
}, {
|
|
value: 'shenghuajiyuan',
|
|
label: '生化纪元'
|
|
}, {
|
|
value: 'xinyaoling',
|
|
label: '新妖灵'
|
|
}, {
|
|
value: 'zgzhanchui',
|
|
label: '中古战锤'
|
|
}],
|
|
loading: false,
|
|
game: 'geshouccs',
|
|
cdate: new Date(),
|
|
date: [new Date(curTime.setMinutes(curTime.getMinutes() - 10)), new Date()],
|
|
userTable: '',
|
|
paylistTable: '',
|
|
eventTable: '',
|
|
isDev: true,
|
|
}
|
|
},
|
|
|
|
methods: {
|
|
seach: function () {
|
|
this.loading = true;
|
|
var game = this.game;
|
|
var is_dev = this.isDev==true?1:2;
|
|
var st = Date.parse(this.date[0]) / 1000;
|
|
var et = Date.parse(this.date[1]) / 1000;
|
|
axios.get('http://10.0.0.7:5777/' + game, {params: {'st': st, 'et': et,'is_dev':is_dev}})
|
|
.then(response => {
|
|
this.userTable = '<h1>user</h1>' + response.data['user'];
|
|
this.paylistTable = '<h1>paylist</h1>' + response.data['paylist'];
|
|
this.eventTable = '<h1>event</h1>' + response.data['event'];
|
|
this.loading = false;
|
|
})
|
|
.catch(error => {
|
|
alert('查询异常');
|
|
this.loading = false;
|
|
});
|
|
}
|
|
}
|
|
}
|
|
)
|
|
|
|
</script>
|
|
</html>
|
|
|
|
|