Skip to content

Commit d7d3afc

Browse files
ysfscreamysfscream
committed
feat(copilot): localize MCPSettings UI with i18n support
1 parent 635792f commit d7d3afc

File tree

2 files changed

+154
-27
lines changed

2 files changed

+154
-27
lines changed

‎src/components/ai/MCPSettings.vue

+27-27
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,17 @@
11
<template>
22
<div class="settings-mcp">
3-
<div class="settings-title">MCP (Model Context Protocol)</div>
3+
<div class="settings-title">{{ $t('copilot.mcpTitle') }}</div>
44

55
<el-divider></el-divider>
66

77
<el-row class="settings-item" type="flex" justify="space-between">
88
<el-col :span="20">
9-
<label>Enable MCP</label>
9+
<label>{{ $t('copilot.mcpEnableLabel') }}</label>
1010
<el-tooltip
1111
placement="top"
1212
:effect="currentTheme !== 'light' ? 'light' : 'dark'"
1313
:open-delay="500"
14-
:content="'Enable MCP to let AI use external tools and services'"
14+
:content="$t('copilot.mcpEnableTooltip')"
1515
>
1616
<a href="javascript:;" class="icon-oper">
1717
<i class="el-icon-warning-outline"></i>
@@ -35,12 +35,12 @@
3535
<el-row class="settings-item" type="flex" justify="space-between" align="middle">
3636
<el-col :span="24">
3737
<div class="section-header">
38-
<label>MCP Server Configuration</label>
38+
<label>{{ $t('copilot.mcpServerConfigLabel') }}</label>
3939
<el-tooltip
4040
placement="top"
4141
:effect="currentTheme !== 'light' ? 'light' : 'dark'"
4242
:open-delay="500"
43-
:content="'Configure MCP servers in JSON format, supports multiple servers'"
43+
:content="$t('copilot.mcpServerConfigTooltip')"
4444
>
4545
<a href="javascript:;" class="icon-oper">
4646
<i class="el-icon-warning-outline"></i>
@@ -75,12 +75,12 @@
7575
<el-row class="settings-item" type="flex" justify="space-between" align="middle">
7676
<el-col :span="24">
7777
<div class="section-header">
78-
<label>Configured MCP Servers</label>
78+
<label>{{ $t('copilot.mcpConfiguredServersLabel') }}</label>
7979
<el-tooltip
8080
placement="top"
8181
:effect="currentTheme !== 'light' ? 'light' : 'dark'"
8282
:open-delay="500"
83-
:content="'Display list of currently configured MCP servers'"
83+
:content="$t('copilot.mcpConfiguredServersTooltip')"
8484
>
8585
<a href="javascript:;" class="icon-oper">
8686
<i class="el-icon-warning-outline"></i>
@@ -92,7 +92,7 @@
9292

9393
<el-row class="settings-item" v-if="!mcpConfig.mcpServers || Object.keys(mcpConfig.mcpServers).length === 0">
9494
<el-col :span="24">
95-
<div class="no-servers">No MCP servers configured yet</div>
95+
<div class="no-servers">{{ $t('copilot.mcpNoServersConfigured') }}</div>
9696
</el-col>
9797
</el-row>
9898

@@ -102,7 +102,7 @@
102102
<span class="server-name">{{ name }}</span>
103103
<div class="server-actions">
104104
<div class="server-enabled-switch" v-if="serverResults[name] && serverResults[name].success">
105-
<span class="enable-label">Enable:</span>
105+
<span class="enable-label">{{ $t('common.enable') }}</span>
106106
<el-switch
107107
v-model="serverEnabledStatus[name]"
108108
active-color="#13ce66"
@@ -131,7 +131,7 @@
131131
icon="el-icon-document-copy"
132132
class="copy-btn"
133133
@click="copyCommand(server.command + ' ' + server.args.join(' '))"
134-
title="Copy Command"
134+
:title="$t('common.copy')"
135135
></el-button>
136136
</div>
137137

@@ -146,7 +146,7 @@
146146
</div>
147147

148148
<div v-if="serverResults[name].tools && serverResults[name].tools.length > 0" class="tools-list">
149-
<div class="tools-header">Available Tools:</div>
149+
<div class="tools-header">{{ $t('copilot.mcpAvailableTools') }}</div>
150150
<div class="tools-container">
151151
<el-tag
152152
v-for="(tool, index) in serverResults[name].tools"
@@ -215,7 +215,7 @@ export default class MCPSettings extends Vue {
215215
this.mcpConfigStr = JSON.stringify(this.mcpConfig, null, 2)
216216
} catch (error) {
217217
this.$log.error(`[MCP] Failed to parse MCP configuration: ${error}`)
218-
this.mcpConfigError = 'Failed to parse stored configuration, reset to default'
218+
this.mcpConfigError = this.$t('copilot.mcpFailedParseConfig').toString()
219219
this.mcpConfig = { mcpServers: {} }
220220
this.mcpConfigStr = JSON.stringify(this.mcpConfig, null, 2)
221221
}
@@ -286,13 +286,13 @@ export default class MCPSettings extends Vue {
286286
if (enabled) {
287287
this.$log.info(`[MCP] Server ${serverName} enabled`)
288288
this.$message({
289-
message: `Server ${serverName} enabled`,
289+
message: `${serverName} ${this.$t('copilot.mcpServerTestSuccess').toString()}`,
290290
type: 'success',
291291
})
292292
} else {
293293
this.$log.info(`[MCP] Server ${serverName} disabled`)
294294
this.$message({
295-
message: `Server ${serverName} disabled`,
295+
message: `${serverName} ${this.$t('common.disable').toString()}`,
296296
type: 'info',
297297
})
298298
}
@@ -310,14 +310,14 @@ export default class MCPSettings extends Vue {
310310
311311
// Validate configuration format
312312
if (!config.mcpServers || typeof config.mcpServers !== 'object') {
313-
this.mcpConfigError = 'Configuration must include mcpServers object'
313+
this.mcpConfigError = this.$t('copilot.mcpConfigError').toString()
314314
return
315315
}
316316
317317
// Validate each server configuration
318318
for (const [name, server] of Object.entries(config.mcpServers)) {
319319
if (!server.command || !Array.isArray(server.args)) {
320-
this.mcpConfigError = `Server "${name}" configuration is invalid, must include command and args array`
320+
this.mcpConfigError = this.$t('copilot.mcpServerConfigInvalid', [name]).toString()
321321
return
322322
}
323323
}
@@ -347,7 +347,7 @@ export default class MCPSettings extends Vue {
347347
this.mcpConfig = config
348348
localStorage.setItem('mcpConfig', value)
349349
} catch (error) {
350-
this.mcpConfigError = 'Invalid JSON format'
350+
this.mcpConfigError = this.$t('copilot.mcpInvalidJsonFormat').toString()
351351
}
352352
}
353353
@@ -383,7 +383,7 @@ export default class MCPSettings extends Vue {
383383
384384
this.$log.info(`[MCP] Successfully connected to server ${serverName}`)
385385
this.$message({
386-
message: `Successfully connected to server ${serverName}`,
386+
message: `${this.$t('copilot.mcpServerTestSuccess').toString()}: ${serverName}`,
387387
type: 'success',
388388
})
389389
} else {
@@ -393,7 +393,7 @@ export default class MCPSettings extends Vue {
393393
394394
this.$log.error(`[MCP] Failed to connect to server ${serverName}: ${result.message}`)
395395
this.$message({
396-
message: `Failed to connect to server ${serverName}: ${result.message}`,
396+
message: `${this.$t('copilot.mcpServerTestFailed').toString()}: ${serverName}: ${result.message}`,
397397
type: 'error',
398398
})
399399
}
@@ -412,7 +412,9 @@ export default class MCPSettings extends Vue {
412412
413413
this.$log.error(`[MCP] Error during connection test: ${error instanceof Error ? error.message : String(error)}`)
414414
this.$message({
415-
message: `Error during connection test: ${error instanceof Error ? error.message : String(error)}`,
415+
message: `${this.$t('copilot.mcpConnectionFailed', [serverName]).toString()}: ${
416+
error instanceof Error ? error.message : String(error)
417+
}`,
416418
type: 'error',
417419
})
418420
} finally {
@@ -434,21 +436,21 @@ export default class MCPSettings extends Vue {
434436
if (successful) {
435437
this.$log.info('[MCP] Command copied to clipboard')
436438
this.$message({
437-
message: 'Command copied to clipboard',
439+
message: this.$t('copilot.mcpCopySuccess').toString(),
438440
type: 'success',
439441
duration: 2000,
440442
})
441443
} else {
442444
this.$log.warn('[MCP] Copy failed, please select and copy manually')
443445
this.$message({
444-
message: 'Copy failed, please select and copy manually',
446+
message: this.$t('copilot.mcpCopyFailed').toString(),
445447
type: 'warning',
446448
})
447449
}
448450
} catch (err) {
449451
this.$log.warn(`[MCP] Copy failed: ${err}`)
450452
this.$message({
451-
message: 'Copy failed, please select and copy manually',
453+
message: this.$t('copilot.mcpCopyFailed').toString(),
452454
type: 'warning',
453455
})
454456
}
@@ -461,9 +463,7 @@ export default class MCPSettings extends Vue {
461463
*/
462464
private removeMCPServer(name: string) {
463465
if (this.mcpConfig.mcpServers && this.mcpConfig.mcpServers[name]) {
464-
this.$confirm(`Are you sure you want to delete server "${name}"?`, 'Confirm', {
465-
confirmButtonText: 'Confirm',
466-
cancelButtonText: 'Cancel',
466+
this.$confirm(this.$t('copilot.mcpDeleteConfirm', [name]).toString(), {
467467
type: 'warning',
468468
})
469469
.then(async () => {
@@ -490,7 +490,7 @@ export default class MCPSettings extends Vue {
490490
this.$log.info(`[MCP] Successfully deleted server ${name}`)
491491
this.$message({
492492
type: 'success',
493-
message: 'Successfully deleted!',
493+
message: this.$t('common.deleteSuccess').toString(),
494494
})
495495
})
496496
.catch(() => {

‎src/lang/copilot.ts

+127
Original file line numberDiff line numberDiff line change
@@ -545,4 +545,131 @@ export default {
545545
ja: 'MQTT関連の質問を入力してください。質問を説明してください：',
546546
hu: 'Kérjük, bármilyen kapcsolódó kérdést MQTT-re írjon be, a kérdés leírását:',
547547
},
548+
// MCP Settings UI
549+
mcpTitle: {
550+
zh: 'MCP (模型上下文协议)',
551+
en: 'MCP (Model Context Protocol)',
552+
tr: 'MCP (Model Context Protocol)',
553+
ja: 'MCP (モデルコンテキストプロトコル)',
554+
hu: 'MCP (Model Context Protocol)',
555+
},
556+
mcpEnableLabel: {
557+
zh: '启用 MCP',
558+
en: 'Enable MCP',
559+
tr: 'MCP Etkinleştir',
560+
ja: 'MCPを有効にする',
561+
hu: 'MCP engedélyezése',
562+
},
563+
mcpEnableTooltip: {
564+
zh: '启用 MCP 让 AI 使用外部工具和服务',
565+
en: 'Enable MCP to let AI use external tools and services',
566+
tr: "AI'nın dış araçları ve hizmetleri kullanmasına izin vermek için MCP'yi etkinleştirin",
567+
ja: 'AIが外部ツールやサービスを使用できるようにMCPを有効にする',
568+
hu: 'Engedélyezze az MCP-t, hogy az AI külső eszközöket és szolgáltatásokat használhasson',
569+
},
570+
mcpServerConfigLabel: {
571+
zh: 'MCP 服务器配置',
572+
en: 'MCP Server Configuration',
573+
tr: 'MCP Sunucu Yapılandırması',
574+
ja: 'MCPサーバー構成',
575+
hu: 'MCP szerver konfiguráció',
576+
},
577+
mcpServerConfigTooltip: {
578+
zh: '以 JSON 格式配置 MCP 服务器，支持多个服务器',
579+
en: 'Configure MCP servers in JSON format, supports multiple servers',
580+
tr: 'MCP sunucularını JSON formatında yapılandırın, birden çok sunucuyu destekler',
581+
ja: 'MCPサーバーをJSON形式で構成、複数のサーバーをサポート',
582+
hu: 'MCP szerverek konfigurálása JSON formátumban, több szerver támogatása',
583+
},
584+
mcpConfiguredServersLabel: {
585+
zh: '已配置的 MCP 服务器',
586+
en: 'Configured MCP Servers',
587+
tr: 'Yapılandırılmış MCP Sunucuları',
588+
ja: '構成済みのMCPサーバー',
589+
hu: 'Konfigurált MCP szerverek',
590+
},
591+
mcpConfiguredServersTooltip: {
592+
zh: '显示当前已配置的 MCP 服务器列表',
593+
en: 'Display list of currently configured MCP servers',
594+
tr: 'Şu anda yapılandırılmış MCP sunucularının listesini görüntüler',
595+
ja: '現在構成されているMCPサーバーのリストを表示',
596+
hu: 'A jelenleg konfigurált MCP szerverek listájának megjelenítése',
597+
},
598+
mcpNoServersConfigured: {
599+
zh: '尚未配置 MCP 服务器',
600+
en: 'No MCP servers configured yet',
601+
tr: 'Henüz MCP sunucusu yapılandırılmadı',
602+
ja: 'MCPサーバーはまだ構成されていません',
603+
hu: 'Még nincs konfigurált MCP szerver',
604+
},
605+
mcpAvailableTools: {
606+
zh: '可用工具：',
607+
en: 'Available Tools:',
608+
tr: 'Kullanılabilir Araçlar:',
609+
ja: '利用可能なツール：',
610+
hu: 'Elérhető eszközök:',
611+
},
612+
mcpDeleteConfirm: {
613+
zh: '确定要删除服务器 "{0}" 吗？',
614+
en: 'Are you sure you want to delete server "{0}"?',
615+
tr: '"{0}" sunucusunu silmek istediğinizden emin misiniz?',
616+
ja: 'サーバー「{0}」を削除してもよろしいですか？',
617+
hu: 'Biztosan törölni szeretné a(z) "{0}" szervert?',
618+
},
619+
mcpCopySuccess: {
620+
zh: '命令已复制到剪贴板',
621+
en: 'Command copied to clipboard',
622+
tr: 'Komut panoya kopyalandı',
623+
ja: 'コマンドがクリップボードにコピーされました',
624+
hu: 'Parancs a vágólapra másolva',
625+
},
626+
mcpCopyFailed: {
627+
zh: '复制失败，请手动选择并复制',
628+
en: 'Copy failed, please select and copy manually',
629+
tr: 'Kopyalama başarısız oldu, lütfen manuel olarak seçin ve kopyalayın',
630+
ja: 'コピーに失敗しました。手動で選択してコピーしてください',
631+
hu: 'Másolás sikertelen, kérjük, válassza ki és másolja manuálisan',
632+
},
633+
mcpConfigError: {
634+
zh: '配置必须包含 mcpServers 对象',
635+
en: 'Configuration must include mcpServers object',
636+
tr: 'Yapılandırma mcpServers nesnesini içermelidir',
637+
ja: '構成にはmcpServersオブジェクトを含める必要があります',
638+
hu: 'A konfigurációnak tartalmaznia kell az mcpServers objektumot',
639+
},
640+
mcpServerConfigInvalid: {
641+
zh: '服务器 "{0}" 配置无效，必须包含 command 和 args 数组',
642+
en: 'Server "{0}" configuration is invalid, must include command and args array',
643+
tr: 'Sunucu "{0}" yapılandırması geçersiz, komut ve args dizisini içermelidir',
644+
ja: 'サーバー「{0}」の構成が無効です。コマンドとargs配列を含める必要があります',
645+
hu: 'A(z) "{0}" szerver konfigurációja érvénytelen, tartalmaznia kell a parancsot és az args tömböt',
646+
},
647+
mcpInvalidJsonFormat: {
648+
zh: 'JSON 格式无效',
649+
en: 'Invalid JSON format',
650+
tr: 'Geçersiz JSON biçimi',
651+
ja: '無効なJSON形式',
652+
hu: 'Érvénytelen JSON formátum',
653+
},
654+
mcpFailedParseConfig: {
655+
zh: '无法解析存储的配置，重置为默认',
656+
en: 'Failed to parse stored configuration, reset to default',
657+
tr: 'Depolanan yapılandırma ayrıştırılamadı, varsayılana sıfırlandı',
658+
ja: '保存された構成の解析に失敗しました。デフォルトにリセットします',
659+
hu: 'Nem sikerült elemezni a tárolt konfigurációt, visszaállítás alapértelmezettre',
660+
},
661+
mcpServerTestSuccess: {
662+
zh: '服务器连接成功',
663+
en: 'Server connected successfully',
664+
tr: 'Sunucu başarıyla bağlandı',
665+
ja: 'サーバー接続成功',
666+
hu: 'A(z) szerver sikeresen csatlakoztatva',
667+
},
668+
mcpServerTestFailed: {
669+
zh: '服务器连接失败',
670+
en: 'Server connection failed',
671+
tr: 'Sunucu bağlantısı başarısız',
672+
ja: 'サーバー接続に失敗しました',
673+
hu: 'A(z) szerver csatlakoztatása sikertelen',
674+
},
548675
}

0 commit comments

Comments
 (0)