73 lines
2.6 KiB
HTML
73 lines
2.6 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}用户统计 - 机器人统计看板{% endblock %}
|
|
|
|
{% block content %}
|
|
<!-- 用户统计 -->
|
|
<div>
|
|
<el-row :gutter="20">
|
|
<el-col :span="24">
|
|
<el-card shadow="hover">
|
|
<div slot="header">
|
|
<span>用户活跃度排行</span>
|
|
</div>
|
|
<el-table :data="userStats" style="width: 100%" border>
|
|
<el-table-column prop="user_id" label="用户ID"></el-table-column>
|
|
<el-table-column prop="total_calls" label="调用次数" sortable></el-table-column>
|
|
<el-table-column prop="success_calls" label="成功次数" sortable></el-table-column>
|
|
<el-table-column prop="error_calls" label="失败次数" sortable></el-table-column>
|
|
<el-table-column label="成功率" sortable>
|
|
<template slot-scope="scope">
|
|
{{ (scope.row.success_calls / scope.row.total_calls * 100).toFixed(2) }}%
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="操作">
|
|
<template slot-scope="scope">
|
|
<el-button size="mini" type="primary" @click="viewUserDetail(scope.row)">查看详情</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-card>
|
|
</el-col>
|
|
</el-row>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block scripts %}
|
|
<script>
|
|
new Vue({
|
|
el: '#app',
|
|
mixins: [baseApp],
|
|
data() {
|
|
return {
|
|
userStats: []
|
|
}
|
|
},
|
|
mounted() {
|
|
this.currentView = '3';
|
|
this.loadData();
|
|
},
|
|
methods: {
|
|
loadData() {
|
|
const days = parseInt(this.timeRange);
|
|
this.loadUserStats(days);
|
|
},
|
|
loadUserStats(days) {
|
|
axios.get(`/api/user_stats?days=${days}&limit=20`)
|
|
.then(response => {
|
|
if (response.data.success) {
|
|
this.userStats = response.data.data || [];
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error('加载用户统计数据出错:', error);
|
|
this.$message.error('加载用户统计数据出错');
|
|
});
|
|
},
|
|
viewUserDetail(user) {
|
|
this.$message.info('用户详情功能开发中');
|
|
}
|
|
}
|
|
});
|
|
</script>
|
|
{% endblock %} |