@@ -41,9 +41,9 @@
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="6">
|
||||
<el-card class="overview-card overview-card--soft" shadow="hover">
|
||||
<div class="overview-label">治理告警</div>
|
||||
<div class="overview-value">{% raw %}{{ governanceRiskCount }}{% endraw %}</div>
|
||||
<div class="overview-note">存在配置、依赖或加载风险的插件</div>
|
||||
<div class="overview-label">作者数量</div>
|
||||
<div class="overview-value">{% raw %}{{ authorsCount }}{% endraw %}</div>
|
||||
<div class="overview-note">参与维护的作者规模</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
@@ -74,42 +74,11 @@
|
||||
<el-table-column prop="description" label="描述" min-width="280" show-overflow-tooltip></el-table-column>
|
||||
<el-table-column label="状态" width="120" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-tag :type="pluginStatusTagType(scope.row.status)">
|
||||
{% raw %}{{ pluginStatusLabel(scope.row) }}{% endraw %}
|
||||
<el-tag :type="scope.row.status === 'RUNNING' ? 'success' : 'info'">
|
||||
{% raw %}{{ scope.row.status === 'RUNNING' ? '已启用' : '已禁用' }}{% endraw %}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="治理健康" width="170" align="center">
|
||||
<template slot-scope="scope">
|
||||
<div class="governance-cell">
|
||||
<el-tag :type="governanceTagType(scope.row.governance_status)" size="small">
|
||||
{% raw %}{{ governanceLabel(scope.row.governance_status) }}{% endraw %}
|
||||
</el-tag>
|
||||
<div class="governance-note">
|
||||
{% raw %}{{ governanceIssueSummary(scope.row) }}{% endraw %}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="能力类型" width="150" align="center">
|
||||
<template slot-scope="scope">
|
||||
<div class="command-tags command-tags--compact">
|
||||
<el-tag v-for="pluginType in (scope.row.plugin_types || [])" :key="pluginType" size="mini" effect="plain">
|
||||
{% raw %}{{ pluginType }}{% endraw %}
|
||||
</el-tag>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="命令 / 权限" min-width="180">
|
||||
<template slot-scope="scope">
|
||||
<div class="entity-subtitle">
|
||||
{% raw %}{{ scope.row.command_count ? `命令 ${scope.row.command_count} 个` : '无命令声明' }}{% endraw %}
|
||||
</div>
|
||||
<div class="entity-subtitle">
|
||||
{% raw %}{{ scope.row.feature_key ? `Feature: ${scope.row.feature_key}` : '未接入群级权限' }}{% endraw %}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" min-width="290">
|
||||
<template slot-scope="scope">
|
||||
<div class="action-row">
|
||||
@@ -149,21 +118,17 @@
|
||||
<div class="entity-subtitle">模块：{% raw %}{{ plugin.module_name }}{% endraw %}</div>
|
||||
</div>
|
||||
</div>
|
||||
<el-tag :type="pluginStatusTagType(plugin.status)" size="small">
|
||||
{% raw %}{{ pluginStatusLabel(plugin) }}{% endraw %}
|
||||
<el-tag :type="plugin.status === 'RUNNING' ? 'success' : 'info'" size="small">
|
||||
{% raw %}{{ plugin.status === 'RUNNING' ? '已启用' : '已禁用' }}{% endraw %}
|
||||
</el-tag>
|
||||
</div>
|
||||
<div class="mobile-plugin-card__meta">
|
||||
<span>版本：{% raw %}{{ plugin.version || '未知' }}{% endraw %}</span>
|
||||
<span>治理：{% raw %}{{ governanceLabel(plugin.governance_status) }}{% endraw %}</span>
|
||||
<span>作者：{% raw %}{{ plugin.author || '未知' }}{% endraw %}</span>
|
||||
</div>
|
||||
<div class="mobile-plugin-card__desc">
|
||||
{% raw %}{{ plugin.description || '暂无描述' }}{% endraw %}
|
||||
</div>
|
||||
<div class="mobile-plugin-card__meta">
|
||||
<span>{% raw %}{{ governanceIssueSummary(plugin) }}{% endraw %}</span>
|
||||
<span>{% raw %}{{ plugin.feature_key ? `Feature: ${plugin.feature_key}` : '未接入群级权限' }}{% endraw %}</span>
|
||||
</div>
|
||||
<div class="mobile-plugin-card__actions">
|
||||
<el-button
|
||||
size="mini"
|
||||
@@ -194,40 +159,14 @@
|
||||
<el-descriptions-item label="版本" :span="1">{% raw %}{{ selectedPlugin.version }}{% endraw %}</el-descriptions-item>
|
||||
<el-descriptions-item label="作者" :span="1">{% raw %}{{ selectedPlugin.author }}{% endraw %}</el-descriptions-item>
|
||||
<el-descriptions-item label="状态" :span="1">
|
||||
<el-tag :type="pluginStatusTagType(selectedPlugin.status)" size="small">
|
||||
{% raw %}{{ pluginStatusLabel(selectedPlugin) }}{% endraw %}
|
||||
</el-tag>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="治理健康" :span="1">
|
||||
<el-tag :type="governanceTagType(selectedPlugin.governance_status)" size="small">
|
||||
{% raw %}{{ governanceLabel(selectedPlugin.governance_status) }}{% endraw %}
|
||||
<el-tag :type="selectedPlugin.status === 'RUNNING' ? 'success' : 'info'" size="small">
|
||||
{% raw %}{{ selectedPlugin.status === 'RUNNING' ? '已启用' : '已禁用' }}{% endraw %}
|
||||
</el-tag>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="命令前缀" :span="1" v-if="selectedPlugin.command_prefix !== undefined">
|
||||
{% raw %}{{ selectedPlugin.command_prefix || '无' }}{% endraw %}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="描述" :span="2">{% raw %}{{ selectedPlugin.description }}{% endraw %}</el-descriptions-item>
|
||||
<el-descriptions-item label="能力类型" :span="2" v-if="selectedPlugin.plugin_types && selectedPlugin.plugin_types.length > 0">
|
||||
<div class="command-tags">
|
||||
<el-tag v-for="pluginType in selectedPlugin.plugin_types" :key="pluginType" size="mini" effect="plain">
|
||||
{% raw %}{{ pluginType }}{% endraw %}
|
||||
</el-tag>
|
||||
</div>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="Feature Key" :span="1">
|
||||
{% raw %}{{ selectedPlugin.feature_key || '未声明' }}{% endraw %}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="群级开关" :span="1">
|
||||
{% raw %}{{ selectedPlugin.supports_group_switch ? '支持' : '未接入' }}{% endraw %}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="依赖插件" :span="2">
|
||||
<div v-if="selectedPlugin.dependencies && selectedPlugin.dependencies.length > 0" class="command-tags">
|
||||
<el-tag v-for="dependency in selectedPlugin.dependencies" :key="dependency" size="mini" effect="plain">
|
||||
{% raw %}{{ dependency }}{% endraw %}
|
||||
</el-tag>
|
||||
</div>
|
||||
<span v-else>无</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="命令列表" :span="2" v-if="selectedPlugin.commands && selectedPlugin.commands.length > 0">
|
||||
<div class="command-tags">
|
||||
<el-tag v-for="cmd in selectedPlugin.commands" :key="cmd" size="mini" class="command-tag">
|
||||
@@ -235,46 +174,6 @@
|
||||
</el-tag>
|
||||
</div>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="配置概览" :span="2" v-if="selectedPlugin.config_overview">
|
||||
<div class="config-overview-grid">
|
||||
<div class="config-overview-item">
|
||||
<span class="config-overview-label">配置文件</span>
|
||||
<span class="config-overview-value">{% raw %}{{ selectedPlugin.config_overview.exists ? '存在' : '缺失' }}{% endraw %}</span>
|
||||
</div>
|
||||
<div class="config-overview-item">
|
||||
<span class="config-overview-label">解析状态</span>
|
||||
<span class="config-overview-value">{% raw %}{{ selectedPlugin.config_overview.parse_ok ? '正常' : '失败' }}{% endraw %}</span>
|
||||
</div>
|
||||
<div class="config-overview-item">
|
||||
<span class="config-overview-label">配置分组</span>
|
||||
<span class="config-overview-value">{% raw %}{{ selectedPlugin.config_overview.section_count || 0 }}{% endraw %}</span>
|
||||
</div>
|
||||
<div class="config-overview-item">
|
||||
<span class="config-overview-label">敏感字段</span>
|
||||
<span class="config-overview-value">{% raw %}{{ selectedPlugin.config_overview.sensitive_field_count || 0 }}{% endraw %}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="entity-subtitle" style="margin-top: 8px;">
|
||||
{% raw %}{{ selectedPlugin.config_path || '未声明配置路径' }}{% endraw %}
|
||||
</div>
|
||||
<div class="entity-subtitle" v-if="selectedPlugin.config_overview.parse_error">
|
||||
{% raw %}{{ `解析错误：${selectedPlugin.config_overview.parse_error}` }}{% endraw %}
|
||||
</div>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="治理诊断" :span="2" v-if="selectedPlugin.governance_diagnostics">
|
||||
<div v-if="selectedPlugin.governance_diagnostics.length > 0" class="diagnostic-list">
|
||||
<div
|
||||
v-for="(diagnostic, index) in selectedPlugin.governance_diagnostics"
|
||||
:key="`${diagnostic.code}-${index}`"
|
||||
class="diagnostic-item">
|
||||
<el-tag :type="governanceTagType(diagnostic.level)" size="mini">
|
||||
{% raw %}{{ governanceLabel(diagnostic.level) }}{% endraw %}
|
||||
</el-tag>
|
||||
<span class="diagnostic-text">{% raw %}{{ diagnostic.message }}{% endraw %}</span>
|
||||
</div>
|
||||
</div>
|
||||
<span v-else>暂无治理诊断项</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="配置信息" :span="2" v-if="selectedPlugin.config">
|
||||
<div class="config-container">
|
||||
<div class="config-actions">
|
||||
@@ -471,8 +370,8 @@
|
||||
stoppedPluginsCount() {
|
||||
return this.plugins.filter(plugin => plugin.status !== 'RUNNING').length;
|
||||
},
|
||||
governanceRiskCount() {
|
||||
return (this.plugins || []).filter(plugin => ['warning', 'error'].includes((plugin.governance_status || '').toLowerCase())).length;
|
||||
authorsCount() {
|
||||
return new Set((this.plugins || []).map(plugin => plugin.author).filter(Boolean)).size;
|
||||
},
|
||||
// 弹窗宽度按视口分级收缩，保证手机上弹窗内容不会贴边或继续触发横向溢出。
|
||||
pluginInfoDialogWidth() {
|
||||
@@ -501,55 +400,6 @@
|
||||
// 这里统一以 768px 作为移动端断点，和常见后台管理布局断点保持一致。
|
||||
this.isMobileViewport = window.innerWidth <= 768;
|
||||
},
|
||||
pluginStatusTagType(status) {
|
||||
const normalizedStatus = String(status || '').toUpperCase();
|
||||
if (normalizedStatus === 'RUNNING') return 'success';
|
||||
if (normalizedStatus === 'ERROR') return 'danger';
|
||||
if (normalizedStatus === 'LOADED') return 'warning';
|
||||
return 'info';
|
||||
},
|
||||
pluginStatusLabel(plugin) {
|
||||
if (plugin && plugin.status_label) return plugin.status_label;
|
||||
const normalizedStatus = String(plugin?.status || '').toUpperCase();
|
||||
const mapping = {
|
||||
RUNNING: '运行中',
|
||||
STOPPED: '已停用',
|
||||
LOADED: '已加载',
|
||||
UNLOADED: '未加载',
|
||||
ERROR: '异常',
|
||||
DISCOVERED: '待处理'
|
||||
};
|
||||
return mapping[normalizedStatus] || '未知';
|
||||
},
|
||||
governanceTagType(level) {
|
||||
const normalizedLevel = String(level || '').toLowerCase();
|
||||
if (normalizedLevel === 'error') return 'danger';
|
||||
if (normalizedLevel === 'warning') return 'warning';
|
||||
if (normalizedLevel === 'healthy') return 'success';
|
||||
return 'info';
|
||||
},
|
||||
governanceLabel(level) {
|
||||
const normalizedLevel = String(level || '').toLowerCase();
|
||||
const mapping = {
|
||||
healthy: '健康',
|
||||
warning: '告警',
|
||||
error: '异常',
|
||||
info: '提示'
|
||||
};
|
||||
return mapping[normalizedLevel] || '提示';
|
||||
},
|
||||
governanceIssueSummary(plugin) {
|
||||
const errorCount = Number(plugin?.governance_error_count || 0);
|
||||
const warningCount = Number(plugin?.governance_warning_count || 0);
|
||||
const infoCount = Number(plugin?.governance_info_count || 0);
|
||||
if (errorCount > 0 || warningCount > 0) {
|
||||
return `错误 ${errorCount} / 告警 ${warningCount}`;
|
||||
}
|
||||
if (infoCount > 0) {
|
||||
return `提示 ${infoCount} 项`;
|
||||
}
|
||||
return '暂无治理问题';
|
||||
},
|
||||
loadPlugins() {
|
||||
this.loading = true;
|
||||
axios.get('/api/plugins')
|
||||
@@ -637,6 +487,7 @@
|
||||
},
|
||||
saveConfig() {
|
||||
try {
|
||||
let configObj;
|
||||
axios.post('/api/plugins/config/update', {
|
||||
plugin_name: this.selectedPlugin.module_name,
|
||||
config_text: this.editedConfig,
|
||||
@@ -647,11 +498,7 @@
|
||||
this.$message.success('配置保存成功');
|
||||
this.isEditingConfig = false;
|
||||
this.selectedPlugin.configText = this.editedConfig;
|
||||
// 保存成功后立即重新拉取详情：
|
||||
// 1. 同步刷新治理诊断、配置概览和内存中的插件配置快照；
|
||||
// 2. 避免页面上继续停留在旧的健康状态；
|
||||
// 3. 这样后续是否重载插件，用户都能先看到“配置文本已通过校验并落盘”。
|
||||
this.showPluginInfo(this.selectedPlugin);
|
||||
this.selectedPlugin.config = configObj;
|
||||
this.$confirm('配置已保存，是否要重载插件以应用新配置?', '提示', {
|
||||
confirmButtonText: '重载插件',
|
||||
cancelButtonText: '稍后手动重载',
|
||||
@@ -867,66 +714,10 @@
|
||||
}
|
||||
.config-container pre { margin: 0; white-space: pre-wrap; word-break: break-word; }
|
||||
.command-tags { display: flex; flex-wrap: wrap; gap: 6px; }
|
||||
.command-tags--compact { justify-content: center; }
|
||||
.command-tag { margin: 0 !important; }
|
||||
.config-actions { margin-bottom: 10px; display: flex; gap: 10px; }
|
||||
.config-editor { font-family: monospace; font-size: 12px; }
|
||||
.config-error { color: #ef4444; font-size: 12px; margin-top: 5px; }
|
||||
.governance-cell {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
}
|
||||
.governance-note {
|
||||
font-size: 11px;
|
||||
color: #94a3b8;
|
||||
line-height: 1.4;
|
||||
}
|
||||
.config-overview-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
|
||||
gap: 10px;
|
||||
}
|
||||
.config-overview-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
padding: 10px 12px;
|
||||
border-radius: 12px;
|
||||
background: rgba(255,255,255,0.72);
|
||||
border: 1px solid rgba(148,163,184,0.12);
|
||||
}
|
||||
.config-overview-label {
|
||||
font-size: 12px;
|
||||
color: #64748b;
|
||||
}
|
||||
.config-overview-value {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: #0f172a;
|
||||
}
|
||||
.diagnostic-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
}
|
||||
.diagnostic-item {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 10px;
|
||||
padding: 10px 12px;
|
||||
border-radius: 12px;
|
||||
background: rgba(248,250,252,0.82);
|
||||
border: 1px solid rgba(148,163,184,0.12);
|
||||
}
|
||||
.diagnostic-text {
|
||||
flex: 1;
|
||||
font-size: 13px;
|
||||
color: #334155;
|
||||
line-height: 1.6;
|
||||
word-break: break-word;
|
||||
}
|
||||
.plugin-group-status-dialog { min-height: 240px; }
|
||||
.mobile-plugin-list,
|
||||
.mobile-group-list {
|
||||
|
||||
Reference in New Issue
Block a user