update:插件名称前,不同颜色的点易让人产生误解

This commit is contained in:
hrz
2025-11-13 11:01:28 +08:00
parent 8a4f786c0b
commit cd113a5351
2 changed files with 19 additions and 27 deletions
@@ -13,7 +13,9 @@
<div class="function-column">
<div class="column-header">
<h4 class="column-title">{{ $t('functionDialog.unselectedFunctions') }}</h4>
<el-button type="text" @click="selectAll" class="select-all-btn">{{ $t('functionDialog.selectAll') }}</el-button>
<el-button type="text" @click="selectAll" class="select-all-btn">
{{ $t('functionDialog.selectAll') }}
</el-button>
</div>
<div class="function-list">
<div v-if="unselected.length">
@@ -21,7 +23,7 @@
<el-checkbox :label="func.name" v-model="selectedNames" @change="(val) => handleCheckboxChange(func, val)"
@click.native.stop></el-checkbox>
<div class="func-tag" @click="handleFunctionClick(func)">
<div class="color-dot" :style="{ backgroundColor: getFunctionColor(func.name) }"></div>
<div class="color-dot"></div>
<span>{{ func.name }}</span>
</div>
</div>
@@ -36,7 +38,9 @@
<div class="function-column">
<div class="column-header">
<h4 class="column-title">{{ $t('functionDialog.selectedFunctions') }}</h4>
<el-button type="text" @click="deselectAll" class="select-all-btn">{{ $t('functionDialog.selectAll') }}</el-button>
<el-button type="text" @click="deselectAll" class="select-all-btn">
{{ $t('functionDialog.selectAll') }}
</el-button>
</div>
<div class="function-list">
<div v-if="selectedList.length > 0">
@@ -44,7 +48,7 @@
<el-checkbox :label="func.name" v-model="selectedNames" @change="(val) => handleCheckboxChange(func, val)"
@click.native.stop></el-checkbox>
<div class="func-tag" @click="handleFunctionClick(func)">
<div class="color-dot" :style="{ backgroundColor: getFunctionColor(func.name) }"></div>
<div class="color-dot"></div>
<span>{{ func.name }}</span>
</div>
</div>
@@ -57,7 +61,9 @@
<!-- 右侧参数配置 -->
<div class="params-column">
<h4 v-if="currentFunction" class="column-title">{{ $t('functionDialog.paramConfig') }} - {{ currentFunction.name }}</h4>
<h4 v-if="currentFunction" class="column-title">
{{ $t('functionDialog.paramConfig') }} - {{ currentFunction.name }}
</h4>
<div v-if="currentFunction" class="params-container">
<el-form :model="currentFunction" class="param-form">
<!-- 遍历 fieldsMeta而不是 params keys -->
@@ -119,8 +125,8 @@
<el-input v-model="mcpUrl" readonly class="url-input">
<template #suffix>
<el-button @click="copyUrl" class="inner-copy-btn" icon="el-icon-document-copy">
{{ $t('functionDialog.copy') }}
</el-button>
{{ $t('functionDialog.copy') }}
</el-button>
</template>
</el-input>
</div>
@@ -191,10 +197,6 @@ export default {
selectedNames: [],
currentFunction: null,
modifiedFunctions: {},
functionColorMap: [
'#FF6B6B', '#4ECDC4', '#45B7D1',
'#96CEB4', '#FFEEAD', '#D4A5A5', '#A2836E'
],
tempFunctions: {},
// 添加一个标志位来跟踪是否已经保存
hasSaved: false,
@@ -405,10 +407,6 @@ export default {
// 通知父组件对话框已关闭且已保存
this.$emit('dialog-closed', true);
},
getFunctionColor(name) {
const hash = [...name].reduce((acc, char) => acc + char.charCodeAt(0), 0);
return this.functionColorMap[hash % this.functionColorMap.length];
},
fieldRemark(field) {
let description = (field && field.label) ? field.label : '';
if (field.default) {
@@ -527,6 +525,7 @@ export default {
flex-shrink: 0;
width: 8px;
height: 8px;
background-color: #5778ff;
margin-right: 8px;
border-radius: 50%;
}
+5 -12
View File
@@ -104,7 +104,7 @@
<div slot="content">
<div><strong>功能名称:</strong> {{ func.name }}</div>
</div>
<div class="icon-dot" :style="{ backgroundColor: getFunctionColor(func.name) }">
<div class="icon-dot">
{{ getFunctionDisplayChar(func.name) }}
</div>
</el-tooltip>
@@ -189,10 +189,6 @@ export default {
voiceOptions: [],
showFunctionDialog: false,
currentFunctions: [],
functionColorMap: [
'#FF6B6B', '#4ECDC4', '#45B7D1',
'#96CEB4', '#FFEEAD', '#D4A5A5', '#A2836E'
],
allFunctions: [],
originalFunctions: [],
}
@@ -428,20 +424,16 @@ export default {
}
});
},
getFunctionColor(name) {
const hash = [...name].reduce((acc, char) => acc + char.charCodeAt(0), 0);
return this.functionColorMap[hash % this.functionColorMap.length];
},
getFunctionDisplayChar(name) {
if (!name || name.length === 0) return '';
for (let i = 0; i < name.length; i++) {
const char = name[i];
if (/[\u4e00-\u9fa5a-zA-Z0-9]/.test(char)) {
return char;
}
}
// 如果没有找到有效字符,返回第一个字符
return name.charAt(0);
},
@@ -768,11 +760,12 @@ export default {
display: inline-flex;
align-items: center;
justify-content: center;
color: white;
color: #5778ff;
font-weight: bold;
font-size: 12px;
margin-right: 8px;
position: relative;
background-color: #e6ebff;
}
::v-deep .el-form-item__label {