Merge pull request #2977 from xinnan-tech/role-tag

新增角色标签配置
This commit is contained in:
wengzh
2026-03-02 15:40:59 +08:00
committed by GitHub
12 changed files with 283 additions and 19 deletions
+31
View File
@@ -398,4 +398,35 @@ export default {
});
}).send();
},
// 获取智能体标签
getAgentTags(agentId, callback) {
RequestService.sendRequest()
.url(`${getServiceUrl()}/agent/${agentId}/tags`)
.method('GET')
.success((res) => {
RequestService.clearRequestTime();
callback(res);
})
.networkFail(() => {
RequestService.reAjaxFun(() => {
this.getAgentTags(agentId, callback);
});
}).send();
},
// 保存智能体标签
saveAgentTags(agentId, tags, callback) {
RequestService.sendRequest()
.url(`${getServiceUrl()}/agent/${agentId}/tags`)
.method('PUT')
.data(tags)
.success((res) => {
RequestService.clearRequestTime();
callback(res);
})
.networkFail(() => {
RequestService.reAjaxFun(() => {
this.saveAgentTags(agentId, tags, callback);
});
}).send();
},
}
@@ -14,7 +14,7 @@
<div style="color: red;display: inline-block;">*</div> {{ $t('addAgentDialog.agentName') }}
</div>
<div class="input-46" style="margin-top: 12px;">
<el-input ref="inputRef" :placeholder="$t('addAgentDialog.placeholder')" v-model="wisdomBodyName" @keyup.enter.native="confirm" />
<el-input maxLength="64" ref="inputRef" :placeholder="$t('addAgentDialog.placeholder')" v-model="wisdomBodyName" @keyup.enter.native="confirm" />
</div>
</div>
<div style="display: flex;margin: 15px 15px;gap: 7px;">
+80 -4
View File
@@ -1,13 +1,15 @@
<template>
<div class="device-item">
<div style="display: flex;justify-content: space-between;">
<div style="font-weight: 700;font-size: 18px;text-align: left;color: #3d4566;">
<el-tooltip :content="device.agentName" placement="top" effect="light">
<div class="device-item-title">
{{ device.agentName }}
</div>
</el-tooltip>
<div>
<img src="@/assets/home/delete.png" alt="" style="width: 18px;height: 18px;margin-right: 10px;"
@click.stop="handleDelete" />
<el-tooltip class="item" effect="dark" :content="device.systemPrompt" placement="top"
<el-tooltip class="item" effect="light" :content="device.systemPrompt" placement="top"
popper-class="custom-tooltip">
<img src="@/assets/home/info.png" alt="" style="width: 18px;height: 18px;" />
</el-tooltip>
@@ -39,6 +41,11 @@
</div>
<div class="version-info">
<div>{{ $t('home.lastConversation') }}{{ formattedLastConnectedTime }}</div>
<div ref="scrollRef" class="version-info-scroll">
<div ref="tagsRef" class="version-info-tags">
<el-tag v-for="(tag, index) in tags" :key="index" size="mini">{{ tag }}</el-tag>
</div>
</div>
</div>
</div>
</template>
@@ -81,6 +88,10 @@ export default {
} else {
return this.device.lastConnectedAt;
}
},
tags() {
if (!this.device.tags) return [];
return this.device.tags.map((tag) => tag.tagName);
}
},
methods: {
@@ -102,16 +113,45 @@ export default {
}
this.$emit('chat-history', { agentId: this.device.agentId, agentName: this.device.agentName })
}
},
watch: {
tags: {
handler(newTags) {
if (newTags.length === 0) return;
this.$nextTick(() => {
const scrollWidth = this.$refs.scrollRef.clientWidth;
const tagsWidth = this.$refs.tagsRef.clientWidth;
if (tagsWidth < scrollWidth) {
this.$refs.tagsRef.style.width = '100%';
this.$refs.tagsRef.style.justifyContent = 'flex-end';
} else {
this.$refs.tagsRef.style.width = 'fit-content';
this.$refs.tagsRef.style.justifyContent = 'flex-start';
}
})
},
immediate: true
}
}
}
</script>
<style scoped>
<style lang="scss" scoped>
.device-item {
width: 342px;
border-radius: 20px;
background: #fafcfe;
padding: 22px;
padding: 22px 22px 14px;
box-sizing: border-box;
&-title {
flex: 1;
font-weight: bold;
font-size: 18px;
color: #3d4566;
text-align: left;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
}
.device-name {
@@ -142,6 +182,42 @@ export default {
font-size: 12px;
color: #979db1;
font-weight: 400;
> div {
&:first-of-type {
margin-top: 5px;
}
}
&-scroll {
height: 26px;
margin-left: 20px;
flex: 1;
overflow-x: auto;
padding-bottom: 4px;
&::-webkit-scrollbar {
height: 6px;
background: #e6ebff;
}
&::-webkit-scrollbar-thumb {
background: #409EFF;
border-radius: 8px;
}
}
&-tags {
width: fit-content;
display: flex;
gap: 6px;
}
}
.more-tag {
cursor: pointer;
flex-shrink: 0;
}
.all-tags-popover {
display: flex;
flex-wrap: wrap;
gap: 4px;
}
.disabled-btn {
+19 -2
View File
@@ -71,8 +71,14 @@
{{ $t('ttsModel.delete') }}
</el-button>
</template>
<el-button v-else type="success" size="mini" @click="saveEdit(scope.row)" class="save-Tts">{{ $t('ttsModel.save') }}
<template v-else>
<el-button type="success" size="mini" @click="cancelEdit(scope.row)" class="save-Tts">
{{ $t('button.cancel') }}
</el-button>
<el-button type="success" size="mini" @click="saveEdit(scope.row)" class="save-Tts">
{{ $t('ttsModel.save') }}
</el-button>
</template>
</template>
</el-table-column>
</el-table>
@@ -340,6 +346,17 @@ export default {
this.$set(row, 'originalData', { ...row });
},
cancelEdit(row) {
// 通过新增创建的数据,取消编辑时,需要从数组中移除
if (!row.id) {
this.ttsModels.shift(row);
} else {
Object.assign(row, row.originalData);
delete row.originalData;
}
row.editing = false;
},
saveEdit(row) {
if (!row.voiceCode || !row.voiceName || !row.languageType) {
this.$message.error({
@@ -447,7 +464,7 @@ export default {
referenceText: '',
selected: false,
editing: true,
sort: maxSort + 1
sort: 0 // 新增数据默认排序在顶部
};
this.ttsModels.unshift(newRow);
+2 -1
View File
@@ -25,7 +25,7 @@ export default {
'header.featureManagement': 'Systemfunktionsverwaltung',
'header.changePassword': 'Passwort ändern',
'header.logout': 'Abmelden',
'header.searchPlaceholder': 'Namen oder MAC suchen',
'header.searchPlaceholder': 'Name, Tag oder Mac-Suche',
// McpToolCallDialog component text
'mcpToolCall.title': 'Werkzeugaufruf',
@@ -747,6 +747,7 @@ export default {
// Role configuration page text
'roleConfig.title': 'Rollenkonfiguration',
'roleConfig.addTag': 'Neues Label hinzufügen',
'roleConfig.restartNotice': 'Nach dem Speichern der Konfiguration müssen Sie das Gerät neu starten, damit die neue Konfiguration wirksam wird.',
'roleConfig.saveConfig': 'Konfiguration speichern',
'roleConfig.reset': 'Zurücksetzen',
+2 -1
View File
@@ -25,7 +25,7 @@ export default {
'header.featureManagement': 'System Feature Management',
'header.changePassword': 'Change Password',
'header.logout': 'Logout',
'header.searchPlaceholder': 'Search name or mac',
'header.searchPlaceholder': 'Name, tag or MAC search',
// McpToolCallDialog component text
'mcpToolCall.title': 'Tool Call',
@@ -747,6 +747,7 @@ export default {
// Role configuration page text
'roleConfig.title': 'Role Configuration',
'roleConfig.addTag': 'Add New Tag',
'roleConfig.restartNotice': 'After saving the configuration, you need to restart the device for the new configuration to take effect.',
'roleConfig.saveConfig': 'Save Configuration',
'roleConfig.reset': 'Reset',
+2 -1
View File
@@ -25,7 +25,7 @@ export default {
'header.featureManagement': 'Gerenciamento de Funcionalidades do Sistema',
'header.changePassword': 'Alterar Senha',
'header.logout': 'Sair',
'header.searchPlaceholder': 'Pesquisar nome ou MAC',
'header.searchPlaceholder': 'Nome, tag ou pesquisa no Mac',
// Texto do componente McpToolCallDialog
'mcpToolCall.title': 'Chamada de Ferramenta',
@@ -747,6 +747,7 @@ export default {
// Página de configuração de papel
'roleConfig.title': 'Configuração de Papel',
'roleConfig.addTag': 'Adicionar Novo Rótulo',
'roleConfig.restartNotice': 'Após salvar a configuração, é necessário reiniciar o dispositivo para que a nova configuração tenha efeito.',
'roleConfig.saveConfig': 'Salvar Configuração',
'roleConfig.reset': 'Redefinir',
+2 -1
View File
@@ -25,7 +25,7 @@ export default {
'header.featureManagement': 'Cấu hình chức năng hệ thống',
'header.changePassword': 'Đổi mật khẩu',
'header.logout': 'Đăng xuất',
'header.searchPlaceholder': 'Tìm tên hoặc MAC',
'header.searchPlaceholder': 'Tên, thẻ hoặc tìm kiếm mac',
// McpToolCallDialog component text
'mcpToolCall.title': 'Gọi công cụ',
@@ -747,6 +747,7 @@ export default {
// Role configuration page text
'roleConfig.title': 'Vai trò',
'roleConfig.addTag': 'Thêm mới nhãn',
'roleConfig.restartNotice': 'Sau khi lưu cấu hình, bạn cần khởi động lại thiết bị để cấu hình mới có hiệu lực.',
'roleConfig.saveConfig': 'Lưu cấu hình',
'roleConfig.reset': 'Đặt lại',
+2 -1
View File
@@ -25,7 +25,7 @@ export default {
'header.featureManagement': '系统功能配置',
'header.changePassword': '修改密码',
'header.logout': '退出登录',
'header.searchPlaceholder': '输入名称或mac搜索',
'header.searchPlaceholder': '名称、标签或mac搜索',
// McpToolCallDialog组件文本
'mcpToolCall.title': '工具调用',
@@ -747,6 +747,7 @@ export default {
// 角色配置页面文本
'roleConfig.title': '角色配置',
'roleConfig.addTag': '添加新标签',
'roleConfig.restartNotice': '保存配置后,需要重启设备,新的配置才会生效。',
'roleConfig.saveConfig': '保存配置',
'roleConfig.reset': '重置',
+2 -1
View File
@@ -25,7 +25,7 @@ export default {
'header.featureManagement': '系統功能配置',
'header.changePassword': '修改密碼',
'header.logout': '退出登錄',
'header.searchPlaceholder': '輸入名稱或mac搜索',
'header.searchPlaceholder': '名稱、標籤或mac搜索',
// McpToolCallDialog组件文本
'mcpToolCall.title': '工具調用',
@@ -747,6 +747,7 @@ export default {
// 角色配置頁面文本
'roleConfig.title': '角色配置',
'roleConfig.addTag': '添加新標籤',
'roleConfig.restartNotice': '保存配置後,需要重啟設備,新的配置才會生效。',
'roleConfig.saveConfig': '保存配置',
'roleConfig.reset': '重置',
+10
View File
@@ -19,4 +19,14 @@ select:-webkit-autofill:focus {
.el-icon-video-play, .el-icon-video-pause {
font-size: 18px !important;
}
.is-light {
border: 1px solid #e4e7ed !important;
color: #595959;
font-size: 14px;
background: #fafcfe !important;
.popper__arrow {
border-top-color: #e4e7ed !important;
}
}
+130 -6
View File
@@ -11,10 +11,34 @@
<div class="content-area">
<el-card class="config-card" shadow="never">
<div class="config-header">
<div class="header-icon">
<img loading="lazy" src="@/assets/home/setting-user.png" alt="" />
<div class="header-left">
<div class="header-icon">
<img loading="lazy" src="@/assets/home/setting-user.png" alt="" />
</div>
<span class="header-title">{{ form.agentName }}</span>
</div>
<div class="header-tags">
<el-tag
v-for="tag in dynamicTags"
:key="tag.id"
closable
:disable-transitions="false"
@close="handleClose(tag.id)">
{{tag.tagName}}
</el-tag>
<el-input
class="input-new-tag"
v-if="inputVisible"
v-model="inputValue"
ref="saveTagInput"
size="small"
maxLength="64"
@keyup.enter.native="handleInputConfirm"
@blur="handleInputConfirm"
>
</el-input>
<el-button v-else size="small" @click="showInput">+ {{ $t("roleConfig.addTag") }}</el-button>
</div>
<span class="header-title">{{ form.agentName }}</span>
<div class="header-actions">
<div class="hint-text">
<img loading="lazy" src="@/assets/home/info.png" alt="" />
@@ -39,7 +63,7 @@
<el-input
v-model="form.agentName"
class="form-input"
maxlength="10"
maxlength="64"
/>
</el-form-item>
<el-form-item :label="$t('roleConfig.roleTemplate') + ''">
@@ -362,13 +386,23 @@ export default {
vad: false, // 语言检测活动功能状态
asr: false, // 语音识别功能状态
},
dynamicTags: [],
inputVisible: false,
inputValue: ''
};
},
methods: {
goToHome() {
this.$router.push("/home");
},
saveConfig() {
async saveConfig() {
try {
await this.handleSaveAgentTags(this.$route.query.agentId);
} catch (error) {
console.error('保存标签失败:', error);
return;
}
const configData = {
agentCode: this.form.agentCode,
agentName: this.form.agentName,
@@ -407,6 +441,7 @@ export default {
});
}
});
},
resetConfig() {
this.$confirm(i18n.t("roleConfig.confirmReset"), i18n.t("message.info"), {
@@ -435,6 +470,7 @@ export default {
intentModelId: "",
},
};
this.dynamicTags = [];
this.currentFunctions = [];
this.$message.success({
message: i18n.t("roleConfig.resetSuccess"),
@@ -1010,6 +1046,45 @@ export default {
console.error("加载功能状态失败:", error);
}
},
handleClose(id) {
this.dynamicTags = this.dynamicTags.filter((item) => item.id !== id);
},
showInput() {
this.inputVisible = true;
this.$nextTick(_ => {
this.$refs.saveTagInput.$refs.input.focus();
});
},
handleInputConfirm() {
let inputValue = this.inputValue;
if (inputValue) {
const tag = { id: new Date().getTime(), tagName: inputValue };
this.dynamicTags.push(tag);
}
this.inputVisible = false;
this.inputValue = '';
},
getAgentTags(agentId) {
Api.agent.getAgentTags(agentId, ({ data }) => {
if (data.code === 0) {
this.dynamicTags = data.data || [];
}
});
},
handleSaveAgentTags(agentId) {
return new Promise((resolve, reject) => {
const tagNames = this.dynamicTags.map(tag => tag.tagName);
Api.agent.saveAgentTags(agentId, { tagNames }, ({ data }) => {
if (data.code === 0) {
resolve();
} else {
reject(data.msg);
}
});
});
}
},
watch: {
"form.model.ttsModelId": {
@@ -1036,6 +1111,7 @@ export default {
const agentId = this.$route.query.agentId;
if (agentId) {
this.fetchAgentConfig(agentId);
this.getAgentTags(agentId);
this.fetchAllFunctions();
}
this.fetchModelOptions();
@@ -1046,7 +1122,7 @@ export default {
};
</script>
<style scoped>
<style lang="scss" scoped>
.welcome {
min-width: 900px;
height: 100vh;
@@ -1123,6 +1199,48 @@ export default {
font-weight: 700;
font-size: 19px;
color: #3d4566;
justify-content: space-between;
}
.header-left {
display: flex;
align-items: center;
gap: 13px;
flex-shrink: 0;
}
.header-tags {
display: flex;
align-items: center;
gap: 8px;
flex: 1;
min-width: 0;
overflow-x: auto;
padding-bottom: 4px;
&::-webkit-scrollbar {
height: 6px;
background: #e6ebff;
}
&::-webkit-scrollbar-thumb {
background: #409EFF;
border-radius: 8px;
}
}
.header-tags .el-tag {
flex-shrink: 0;
}
.more-tag {
cursor: pointer;
flex-shrink: 0;
}
.all-tags-popover {
display: flex;
flex-wrap: wrap;
gap: 4px;
padding: 8px;
}
.header-icon {
@@ -1411,4 +1529,10 @@ export default {
text-decoration: underline;
}
}
.input-new-tag {
width: 90px;
&::v-deep(.el-input__inner) {
width: 90px !important;
}
}
</style>