mirror of
https://github.com/xinnan-tech/xiaozhi-esp32-server.git
synced 2026-07-25 16:43:55 +08:00
updata:智控台页面添加语言切换,支持中英繁。
This commit is contained in:
@@ -7,72 +7,72 @@
|
||||
<div class="scroll-wrapper">
|
||||
<div class="table-container" ref="tableContainer" @scroll="handleScroll">
|
||||
<el-table v-loading="loading" :data="filteredTtsModels" style="width: 100%;" class="data-table"
|
||||
header-row-class-name="table-header" :fit="true" element-loading-text="拼命加载中"
|
||||
header-row-class-name="table-header" :fit="true" :element-loading-text="$t('voicePrint.loading')"
|
||||
element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.8)">
|
||||
<el-table-column label="选择" width="50" align="center">
|
||||
<el-table-column :label="$t('ttsModel.select')" width="50" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-checkbox v-model="scope.row.selected"></el-checkbox>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="音色编码" align="center">
|
||||
<el-table-column :label="$t('ttsModel.voiceCode')" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-input v-if="scope.row.editing" v-model="scope.row.voiceCode"></el-input>
|
||||
<span v-else>{{ scope.row.voiceCode }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="音色名称" align="center">
|
||||
<el-table-column :label="$t('ttsModel.voiceName')" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-input v-if="scope.row.editing" v-model="scope.row.voiceName"></el-input>
|
||||
<span v-else>{{ scope.row.voiceName }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="语言类型" align="center">
|
||||
<el-table-column :label="$t('ttsModel.languageType')" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-input v-if="scope.row.editing" v-model="scope.row.languageType"></el-input>
|
||||
<span v-else>{{ scope.row.languageType }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column v-if="!showReferenceColumns" label="试听" align="center" class-name="audio-column">
|
||||
<el-table-column v-if="!showReferenceColumns" :label="$t('ttsModel.preview')" align="center" class-name="audio-column">
|
||||
<template slot-scope="scope">
|
||||
<div class="custom-audio-container">
|
||||
<el-input v-if="scope.row.editing" v-model="scope.row.voiceDemo" placeholder="请输入MP3地址"
|
||||
<el-input v-if="scope.row.editing" v-model="scope.row.voiceDemo" :placeholder="$t('ttsModel.enterMp3Url')"
|
||||
class="audio-input">
|
||||
</el-input>
|
||||
<AudioPlayer v-else-if="isValidAudioUrl(scope.row.voiceDemo)" :audioUrl="scope.row.voiceDemo" />
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column v-if="!showReferenceColumns" label="备注" align="center">
|
||||
<el-table-column v-if="!showReferenceColumns" :label="$t('ttsModel.remark')" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-input v-if="scope.row.editing" type="textarea" :rows="1" autosize v-model="scope.row.remark"
|
||||
placeholder="这里是备注" class="remark-input"></el-input>
|
||||
:placeholder="$t('ttsModel.enterRemark')" class="remark-input"></el-input>
|
||||
<span v-else>{{ scope.row.remark }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column v-if="showReferenceColumns" label="克隆音频路径" align="center">
|
||||
<el-table-column v-if="showReferenceColumns" :label="$t('ttsModel.cloneAudioPath')" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-input v-if="scope.row.editing" v-model="scope.row.referenceAudio" placeholder="这里是克隆音频路径"></el-input>
|
||||
<el-input v-if="scope.row.editing" v-model="scope.row.referenceAudio" :placeholder="$t('ttsModel.enterCloneAudioPath')"></el-input>
|
||||
<span v-else>{{ scope.row.referenceAudio }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column v-if="showReferenceColumns" label="克隆音频文本" align="center">
|
||||
<el-table-column v-if="showReferenceColumns" :label="$t('ttsModel.cloneAudioText')" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-input v-if="scope.row.editing" v-model="scope.row.referenceText" placeholder="这里是克隆音频对应文本"></el-input>
|
||||
<el-input v-if="scope.row.editing" v-model="scope.row.referenceText" :placeholder="$t('ttsModel.enterCloneAudioText')"></el-input>
|
||||
<span v-else>{{ scope.row.referenceText }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" width="150">
|
||||
<el-table-column :label="$t('ttsModel.operation')" align="center" width="150">
|
||||
<template slot-scope="scope">
|
||||
<template v-if="!scope.row.editing">
|
||||
<el-button type="text" size="mini" @click="startEdit(scope.row)" class="edit-btn">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button type="text" size="mini" @click="deleteRow(scope.row)" class="delete-btn">
|
||||
删除
|
||||
</el-button>
|
||||
{{ $t('ttsModel.edit') }}
|
||||
</el-button>
|
||||
<el-button type="text" size="mini" @click="deleteRow(scope.row)" class="delete-btn">
|
||||
{{ $t('ttsModel.delete') }}
|
||||
</el-button>
|
||||
</template>
|
||||
<el-button v-else type="success" size="mini" @click="saveEdit(scope.row)" class="save-Tts">保存
|
||||
</el-button>
|
||||
<el-button v-else type="success" size="mini" @click="saveEdit(scope.row)" class="save-Tts">{{ $t('ttsModel.save') }}
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
@@ -87,13 +87,13 @@
|
||||
</div>
|
||||
<div class="action-buttons">
|
||||
<el-button type="primary" size="mini" @click="toggleSelectAll" style="background: #606ff3;border: None">
|
||||
{{ selectAll ? '取消全选' : '全选' }}
|
||||
{{ selectAll ? $t('ttsModel.deselectAll') : $t('ttsModel.selectAll') }}
|
||||
</el-button>
|
||||
<el-button type="primary" size="mini" @click="addNew" style="background: #5bc98c;border: None;">
|
||||
新增
|
||||
{{ $t('ttsModel.add') }}
|
||||
</el-button>
|
||||
<el-button type="primary" size="mini" @click="deleteRow(filteredTtsModels.filter(row => row.selected))"
|
||||
style="background: red;border:None">删除
|
||||
style="background: red;border:None">{{ $t('ttsModel.delete') }}
|
||||
</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
@@ -205,7 +205,7 @@ export default {
|
||||
.map(item => ({
|
||||
id: item.id || '',
|
||||
voiceCode: item.ttsVoice || '',
|
||||
voiceName: item.name || '未命名音色',
|
||||
voiceName: item.name || this.$t('ttsModel.unnamedVoice'),
|
||||
languageType: item.languages || '',
|
||||
remark: item.remark || '',
|
||||
referenceAudio: item.referenceAudio || '',
|
||||
@@ -219,7 +219,7 @@ export default {
|
||||
this.total = data.total;
|
||||
} else {
|
||||
this.$message.error({
|
||||
message: data.msg || '获取音色列表失败',
|
||||
message: data.msg || this.$t('ttsModel.getVoiceListFailed'),
|
||||
showClose: true
|
||||
});
|
||||
}
|
||||
@@ -227,7 +227,7 @@ export default {
|
||||
}, (err) => {
|
||||
console.error('加载失败:', err);
|
||||
this.$message.error({
|
||||
message: '加载音色数据失败',
|
||||
message: this.$t('ttsModel.loadVoiceDataFailed'),
|
||||
showClose: true
|
||||
});
|
||||
this.loading = false;
|
||||
@@ -343,7 +343,7 @@ export default {
|
||||
saveEdit(row) {
|
||||
if (!row.voiceCode || !row.voiceName || !row.languageType) {
|
||||
this.$message.error({
|
||||
message: '音色编码、音色名称和语言类型不能为空',
|
||||
message: this.$t('ttsModel.voiceCodeNameLanguageRequired'),
|
||||
showClose: true
|
||||
});
|
||||
return;
|
||||
@@ -390,7 +390,7 @@ export default {
|
||||
delete row.originalData;
|
||||
}
|
||||
this.$message.error({
|
||||
message: '操作失败,请重试',
|
||||
message: this.$t('ttsModel.operationFailed'),
|
||||
showClose: true
|
||||
});
|
||||
}
|
||||
@@ -399,7 +399,7 @@ export default {
|
||||
handleResponse(res, row) {
|
||||
if (res.code === 0) {
|
||||
this.$message.success({
|
||||
message: row.id ? '修改成功' : '保存成功',
|
||||
message: row.id ? this.$t('ttsModel.updateSuccess') : this.$t('ttsModel.saveSuccess'),
|
||||
showClose: true
|
||||
});
|
||||
row.editing = false;
|
||||
@@ -413,9 +413,9 @@ export default {
|
||||
delete row.originalData;
|
||||
}
|
||||
this.$message.error({
|
||||
message: res.msg || (row.id ? '修改失败' : '保存失败'),
|
||||
showClose: true
|
||||
});
|
||||
message: res.msg || (row.id ? this.$t('ttsModel.updateFailed') : this.$t('ttsModel.saveFailed')),
|
||||
showClose: true
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
@@ -429,7 +429,7 @@ export default {
|
||||
addNew() {
|
||||
const hasEditing = this.ttsModels.some(row => row.editing);
|
||||
if (hasEditing) {
|
||||
this.$message.warning('请先完成当前编辑再新增');
|
||||
this.$message.warning(this.$t('ttsModel.finishEditingFirst'));
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -440,7 +440,7 @@ export default {
|
||||
const newRow = {
|
||||
voiceCode: '',
|
||||
voiceName: '',
|
||||
languageType: '中文',
|
||||
languageType: this.$t('editVoiceDialog.defaultLanguageType'),
|
||||
voiceDemo: '',
|
||||
remark: '',
|
||||
referenceAudio: '',
|
||||
@@ -458,34 +458,34 @@ export default {
|
||||
const voices = Array.isArray(row) ? row : [row];
|
||||
|
||||
if (Array.isArray(row) && row.length === 0) {
|
||||
this.$message.warning("请先选择需要删除的音色");
|
||||
this.$message.warning(this.$t('ttsModel.selectVoiceToDelete'));
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
const voiceCount = voices.length;
|
||||
this.$confirm(`确定要删除选中的${voiceCount}个音色吗?`, "警告", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
this.$confirm(this.$t('ttsModel.confirmDeleteVoice', {count: voiceCount}), this.$t('ttsModel.warning'), {
|
||||
confirmButtonText: this.$t('common.confirm'),
|
||||
cancelButtonText: this.$t('common.cancel'),
|
||||
type: "warning",
|
||||
distinguishCancelAndClose: true
|
||||
}).then(() => {
|
||||
const ids = voices.map(voice => voice.id);
|
||||
if (ids.some(id => !id)) {
|
||||
this.$message.error("存在无效的音色ID");
|
||||
this.$message.error(this.$t('ttsModel.invalidVoiceId'));
|
||||
return;
|
||||
}
|
||||
|
||||
Api.timbre.deleteVoice(ids, ({ data }) => {
|
||||
if (data.code === 0) {
|
||||
this.$message.success({
|
||||
message: `成功删除${voiceCount}个参数`,
|
||||
message: this.$t('ttsModel.deleteVoiceSuccess', {count: voiceCount}),
|
||||
showClose: true
|
||||
});
|
||||
this.loadData(); // 刷新参数列表
|
||||
} else {
|
||||
this.$message.error({
|
||||
message: data.msg || '删除失败,请重试',
|
||||
message: data.msg || this.$t('ttsModel.deleteFailed'),
|
||||
showClose: true
|
||||
});
|
||||
}
|
||||
@@ -494,13 +494,13 @@ export default {
|
||||
if (action === 'cancel') {
|
||||
this.$message({
|
||||
type: 'info',
|
||||
message: '已取消删除操作',
|
||||
message: this.$t('ttsModel.deleteCancelled'),
|
||||
duration: 1000
|
||||
});
|
||||
} else {
|
||||
this.$message({
|
||||
type: 'info',
|
||||
message: '操作已关闭',
|
||||
message: this.$t('ttsModel.operationClosed'),
|
||||
duration: 1000
|
||||
});
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user