liuwei_x_x/abot
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

调整趋势图功能，加入了查询数据库，分析群聊聊天数量的功能

Browse Source
This commit is contained in:
liuwei
2025-03-26 13:52:34 +08:00
parent 6bafc1b21e
commit 850d81a9ff
1 changed files with 120 additions and 231 deletions
Download Patch File Download Diff File Expand all files Collapse all files

351
plugins/stats_dashboard/templates/robot_management.html
View File

@@ -149,8 +149,9 @@
<p>加载中...</p>
</div>
<div v-else>
<div style="width: 100%; height: 400px;">
<canvas ref="trendChart" style="width: 100%; height: 100%;"></canvas>
<div class="chart-container">
<h3>消息数量趋势</h3>
<canvas id="messageTrendChart" width="800" height="300"></canvas>
</div>
<div style="margin-top: 20px; text-align: center;">
<el-radio-group v-model="trendDays" @change="loadMessageTrend">
@@ -193,7 +194,7 @@
trendDialogVisible: false,
trendLoading: false,
trendDays: 7,
trendChart: null
charts: {} // 使用charts对象存储图表实例
}
},
computed: {
@@ -251,53 +252,21 @@
this.$message.error('加载权限失败: ' + error.message);
});
},
toggleRobotStatus(group) {
const newStatus = group.robot_status === 'enabled' ? 'disabled' : 'enabled';
// 找到ROBOT功能对应的feature_id
const robotFeatureId = 1; // 根据Feature枚举，ROBOT的值为1
axios.post(`/api/robot/group/${group.group_id}/permissions`, {
feature_id: robotFeatureId,
status: newStatus
})
.then(response => {
if (response.data.success) {
group.robot_status = newStatus;
this.$message.success(`机器人已${newStatus === 'enabled' ? '启用' : '关闭'}`);
} else {
this.$message.error('操作失败');
}
})
.catch(error => {
console.error('更新权限失败:', error);
this.$message.error('更新权限失败: ' + error.message);
});
},
togglePermission(permission) {
const newStatus = permission.statusBool ? 'enabled' : 'disabled';
axios.post(`/api/robot/group/${this.currentGroupId}/permissions`, {
axios.post(`/api/robot/group/${this.currentGroupId}/permission`, {
feature_id: permission.feature_id,
status: newStatus
})
.then(response => {
if (response.data.success) {
permission.status = newStatus;
// 如果是ROBOT功能，更新群组列表中的状态
if (permission.feature_id === 1) { // ROBOT的feature_id为1
const group = this.groups.find(g => g.group_id === this.currentGroupId);
if (group) {
group.robot_status = newStatus;
}
}
this.$message.success(`功能已${newStatus === 'enabled' ? '启用' : '关闭'}`);
this.$message.success('更新权限成功');
} else {
// 恢复原状态
permission.statusBool = !permission.statusBool;
this.$message.error('操作失败');
this.$message.error('更新权限失败');
}
})
.catch(error => {
@@ -307,185 +276,113 @@
this.$message.error('更新权限失败: ' + error.message);
});
},
// 显示添加群组对话框
enableAllPermissions() {
this.updateAllPermissions('enabled');
},
disableAllPermissions() {
this.updateAllPermissions('disabled');
},
updateAllPermissions(status) {
axios.post(`/api/robot/group/${this.currentGroupId}/permissions`, {
status: status
})
.then(response => {
if (response.data.success) {
// 更新本地数据
this.permissions.forEach(p => {
p.status = status;
p.statusBool = status === 'enabled';
});
this.$message.success('批量更新权限成功');
} else {
this.$message.error('批量更新权限失败');
}
})
.catch(error => {
console.error('批量更新权限失败:', error);
this.$message.error('批量更新权限失败: ' + error.message);
});
},
toggleRobotStatus(group) {
const newStatus = group.robot_status === 'enabled' ? 'disabled' : 'enabled';
axios.post(`/api/robot/group/${group.group_id}/status`, {
status: newStatus
})
.then(response => {
if (response.data.success) {
group.robot_status = newStatus;
this.$message.success('更新机器人状态成功');
} else {
this.$message.error('更新机器人状态失败');
}
})
.catch(error => {
console.error('更新机器人状态失败:', error);
this.$message.error('更新机器人状态失败: ' + error.message);
});
},
showAddGroupDialog() {
this.addGroupForm.groupId = '';
this.addGroupDialogVisible = true;
},
// 提交添加群组
submitAddGroup() {
this.$refs.addGroupForm.validate((valid) => {
this.$refs.addGroupForm.validate(valid => {
if (valid) {
axios.post('/api/robot/add_group', {
axios.post('/api/robot/group', {
group_id: this.addGroupForm.groupId
})
.then(response => {
if (response.data.success) {
this.$message.success(response.data.message);
// 添加新群组到列表
if (response.data.group) {
this.groups.push(response.data.group);
}
this.addGroupDialogVisible = false;
this.$message.success('添加群组成功');
// 重新加载群组列表
this.loadGroups();
} else {
this.$message.error(response.data.error || '添加失败');
this.$message.error('添加群组失败');
}
})
.catch(error => {
console.error('添加群组失败:', error);
this.$message.error('添加群组失败: ' + (error.response?.data?.error || error.message));
this.$message.error('添加群组失败: ' + error.message);
});
}
});
},
enableAllPermissions() {
this.$confirm('确定要启用所有功能吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
const promises = this.permissions.map(permission => {
if (permission.status !== 'enabled') {
permission.statusBool = true;
return axios.post(`/api/robot/group/${this.currentGroupId}/permissions`, {
feature_id: permission.feature_id,
status: 'enabled'
});
}
return Promise.resolve();
});
Promise.all(promises)
.then(() => {
this.permissions.forEach(p => {
p.status = 'enabled';
p.statusBool = true;
});
// 更新群组列表中的机器人状态
const group = this.groups.find(g => g.group_id === this.currentGroupId);
if (group) {
group.robot_status = 'enabled';
}
this.$message.success('所有功能已启用');
})
.catch(error => {
console.error('批量启用失败:', error);
this.$message.error('批量启用失败');
});
}).catch(() => {});
},
disableAllPermissions() {
this.$confirm('确定要关闭所有功能吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
const promises = this.permissions.map(permission => {
if (permission.status !== 'disabled') {
permission.statusBool = false;
return axios.post(`/api/robot/group/${this.currentGroupId}/permissions`, {
feature_id: permission.feature_id,
status: 'disabled'
});
}
return Promise.resolve();
});
Promise.all(promises)
.then(() => {
this.permissions.forEach(p => {
p.status = 'disabled';
p.statusBool = false;
});
// 更新群组列表中的机器人状态
const group = this.groups.find(g => g.group_id === this.currentGroupId);
if (group) {
group.robot_status = 'disabled';
}
this.$message.success('所有功能已关闭');
})
.catch(error => {
console.error('批量关闭失败:', error);
this.$message.error('批量关闭失败');
});
}).catch(() => {});
},
batchEnableRobot() {
if (this.selectedGroups.length === 0) {
this.$message.warning('请先选择群组');
return;
}
this.$confirm(`确定要批量启用 ${this.selectedGroups.length} 个群组的机器人吗?`, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
const promises = this.selectedGroups.map(groupId => {
return axios.post(`/api/robot/group/${groupId}/permissions`, {
feature_id: 1, // ROBOT的feature_id为1
status: 'enabled'
});
});
Promise.all(promises)
.then(() => {
// 更新本地数据
this.selectedGroups.forEach(groupId => {
const group = this.groups.find(g => g.group_id === groupId);
if (group) {
group.robot_status = 'enabled';
}
});
this.$message.success('批量启用成功');
})
.catch(error => {
console.error('批量启用失败:', error);
this.$message.error('批量启用失败');
});
}).catch(() => {});
this.batchUpdateRobotStatus('enabled');
},
batchDisableRobot() {
this.batchUpdateRobotStatus('disabled');
},
batchUpdateRobotStatus(status) {
if (this.selectedGroups.length === 0) {
this.$message.warning('请先选择群组');
return;
}
this.$confirm(`确定要批量关闭 ${this.selectedGroups.length} 个群组的机器人吗?`, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
const promises = this.selectedGroups.map(groupId => {
return axios.post(`/api/robot/group/${groupId}/permissions`, {
feature_id: 1, // ROBOT的feature_id为1
status: 'disabled'
axios.post('/api/robot/batch_operation', {
operation: 'update_status',
group_ids: this.selectedGroups,
status: status
})
.then(response => {
if (response.data.success) {
// 更新本地数据
this.groups.forEach(g => {
if (this.selectedGroups.includes(g.group_id)) {
g.robot_status = status;
}
});
});
Promise.all(promises)
.then(() => {
// 更新本地数据
this.selectedGroups.forEach(groupId => {
const group = this.groups.find(g => g.group_id === groupId);
if (group) {
group.robot_status = 'disabled';
}
});
this.$message.success('批量关闭成功');
})
.catch(error => {
console.error('批量关闭失败:', error);
this.$message.error('批量关闭失败');
});
}).catch(() => {});
this.$message.success('批量更新状态成功');
} else {
this.$message.error('批量更新状态失败');
}
})
.catch(error => {
console.error('批量更新状态失败:', error);
this.$message.error('批量更新状态失败: ' + error.message);
});
},
batchRemoveGroups() {
if (this.selectedGroups.length === 0) {
@@ -523,30 +420,22 @@
this.currentGroupId = group.group_id;
this.currentGroupName = group.group_name || group.group_id;
this.trendDialogVisible = true;
// 不在这里立即加载，而是等对话框打开后再加载
},
// 对话框打开后的回调
onTrendDialogOpened() {
console.log('对话框已打开，准备加载数据');
// 重置图表
this.trendChart = null;
this.loadMessageTrend();
},
loadMessageTrend() {
this.trendLoading = true;
console.log('开始加载消息趋势数据');
axios.get(`/api/robot/group/${this.currentGroupId}/message_trend?days=${this.trendDays}`)
.then(response => {
if (response.data.success) {
console.log('数据加载成功，准备渲染图表');
// 延迟渲染，确保DOM已更新
this.$nextTick(() => {
setTimeout(() => {
this.renderTrendChart(response.data.data);
}, 300);
this.renderTrendChart(response.data.data);
this.trendLoading = false;
});
} else {
this.$message.error('加载消息趋势失败');
@@ -562,47 +451,30 @@
renderTrendChart(data) {
try {
console.log('开始渲染图表');
this.trendLoading = false;
const ctx = document.getElementById('messageTrendChart').getContext('2d');
// 使用Vue的$refs获取Canvas元素
const canvas = this.$refs.trendChart;
console.log('Canvas元素:', canvas);
if (!canvas) {
console.error('找不到Canvas元素 (通过$refs)');
// 尝试通过ID获取
const canvasById = document.getElementById('messageTrendChart');
console.log('通过ID获取Canvas元素:', canvasById);
if (!canvasById) {
this.$message.error('无法找到图表元素，请尝试重新打开对话框');
return;
}
// 如果能通过ID获取，使用它
canvas = canvasById;
// 销毁旧图表
if (this.charts.trendChart) {
this.charts.trendChart.destroy();
}
const ctx = canvas.getContext('2d');
if (!ctx) {
console.error('无法获取Canvas上下文');
this.$message.error('无法初始化图表，请尝试重新打开对话框');
return;
// 确保charts对象存在
if (!this.charts) {
this.charts = {};
}
// 如果已有图表，先销毁
if (this.trendChart) {
this.trendChart.destroy();
}
// 准备数据
const labels = data.dates;
const messageData = data.counts.map(count => parseInt(count) || 0);
console.log('创建新图表');
// 创建新图表
this.trendChart = new Chart(ctx, {
this.charts.trendChart = new Chart(ctx, {
type: 'line',
data: {
labels: data.dates,
labels: labels,
datasets: [{
label: '消息数量',
data: data.counts,
data: messageData,
backgroundColor: 'rgba(75, 192, 192, 0.2)',
borderColor: 'rgba(75, 192, 192, 1)',
borderWidth: 2,
@@ -615,8 +487,7 @@
maintainAspectRatio: false,
plugins: {
title: {
display: true,
text: '群聊消息数量趋势'
display: false
},
tooltip: {
mode: 'index',
@@ -643,7 +514,6 @@
}
}
});
console.log('图表创建完成');
} catch (error) {
console.error('渲染图表出错:', error);
this.$message.error('渲染图表出错: ' + error.message);
@@ -653,4 +523,23 @@
}
});
</script>
{% endblock %}
{% block styles %}
<style>
.chart-container {
margin-bottom: 20px;
padding: 10px;
background-color: #fff;
border-radius: 4px;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
.chart-container h3 {
margin-top: 0;
margin-bottom: 10px;
font-size: 16px;
color: #606266;
}
</style>
{% endblock %}