Hass/xiaozhi-esp32-server
1
0
Fork 0
mirror of https://github.com/xinnan-tech/xiaozhi-esp32-server.git synced 2026-07-26 17:13:54 +08:00
Code Issues Packages Projects Releases Wiki Activity

updata:移动端添加语言切换功能

Browse Source
This commit is contained in:
rainv123
2025-09-26 14:33:06 +08:00
parent d022dd385a
commit dfcac51312
23 changed files with 2248 additions and 589 deletions
Download Patch File Download Diff File Expand all files Collapse all files
main/manager-mobile/src/pages/agent/edit.vue
+40 -38
View File
@@ -4,6 +4,7 @@ import { computed, nextTick, onMounted, ref, watch } from 'vue'
import { getAgentDetail, getModelOptions, getPluginFunctions, getRoleTemplates, getTTSVoices, updateAgent } from '@/api/agent/agent'
import { usePluginStore } from '@/store'
import { toast } from '@/utils/toast'
import { t } from '@/i18n'
defineOptions({
name: 'AgentEdit',
@@ -37,14 +38,15 @@ const formData = ref<Partial<AgentDetail>>({
// 显示名称数据
const displayNames = ref({
vad: '请选择',
asr: '请选择',
llm: '请选择',
vllm: '请选择',
intent: '请选择',
memory: '请选择',
tts: '请选择',
voiceprint: '请选择',
// 显示名称数据
vad: t('agent.pleaseSelect'),
asr: t('agent.pleaseSelect'),
llm: t('agent.pleaseSelect'),
vllm: t('agent.pleaseSelect'),
intent: t('agent.pleaseSelect'),
memory: t('agent.pleaseSelect'),
tts: t('agent.pleaseSelect'),
voiceprint: t('agent.pleaseSelect'),
})
// 角色模板数据
@@ -143,7 +145,7 @@ async function loadAgentDetail() {
}
catch (error) {
console.error('加载智能体详情失败:', error)
toast.error('加载失败')
toast.error(t('agent.loadFail'))
}
finally {
loading.value = false
@@ -358,12 +360,12 @@ function getModelDisplayName(modelType: string, modelId: string) {
// 保存智能体
async function saveAgent() {
if (!formData.value.agentName?.trim()) {
toast.warning('请输入助手昵称')
toast.warning(t('agent.pleaseInputAgentName'))
return
}
if (!formData.value.systemPrompt?.trim()) {
toast.warning('请输入角色介绍')
toast.warning(t('agent.pleaseInputRoleDescription'))
return
}
@@ -371,11 +373,11 @@ async function saveAgent() {
saving.value = true
await updateAgent(agentId.value, formData.value)
toast.success('保存成功')
toast.success(t('agent.saveSuccess'))
}
catch (error) {
console.error('保存失败:', error)
toast.error('保存失败')
toast.error(t('agent.saveFail'))
}
finally {
saving.value = false
@@ -441,10 +443,10 @@ onMounted(async () => {
<template>
<view class="bg-[#f5f7fb] px-[20rpx]">
<!-- 基础信息标题 -->
<!--// 基础信息标题
<view class="pb-[20rpx] first:pt-[20rpx]">
<text class="text-[32rpx] text-[#232338] font-bold">
基础信息
{{ t('agent.basicInfo') }}
</text>
</view>
@@ -452,20 +454,20 @@ onMounted(async () => {
<view class="mb-[24rpx] border border-[#eeeeee] rounded-[20rpx] bg-[#fbfbfb] p-[24rpx]" style="box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);">
<view class="mb-[24rpx] last:mb-0">
<text class="mb-[12rpx] block text-[28rpx] text-[#232338] font-medium">
助手昵称
</text>
{{ t('agent.agentName') }}
</text>
<input
v-model="formData.agentName"
class="box-border h-[80rpx] w-full border border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[16rpx_20rpx] text-[28rpx] text-[#232338] leading-[1.4] outline-none focus:border-[#336cff] focus:bg-white placeholder:text-[#9d9ea3]"
type="text"
placeholder="请输入助手昵称"
:placeholder="t('agent.inputAgentName')"
>
</view>
<view class="mb-[24rpx] last:mb-0">
<text class="mb-[12rpx] block text-[28rpx] text-[#232338] font-medium">
角色模式
</text>
{{ t('agent.roleMode') }}
</text>
<view class="mt-0 flex flex-wrap gap-[12rpx]">
<view
v-for="template in roleTemplates"
@@ -483,12 +485,12 @@ onMounted(async () => {
<view class="mb-[24rpx] last:mb-0">
<text class="mb-[12rpx] block text-[28rpx] text-[#232338] font-medium">
角色介绍
</text>
{{ t('agent.roleDescription') }}
</text>
<textarea
v-model="formData.systemPrompt"
:maxlength="2000"
placeholder="请输入角色介绍"
:placeholder="t('agent.inputRoleDescription')"
class="box-border h-[500rpx] w-full resize-none break-words break-all border border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[20rpx] text-[26rpx] text-[#232338] leading-[1.6] outline-none focus:border-[#336cff] focus:bg-white placeholder:text-[#9d9ea3]"
/>
<view class="mt-[8rpx] text-right text-[22rpx] text-[#9d9ea3]">
@@ -500,7 +502,7 @@ onMounted(async () => {
<!-- 模型配置标题 -->
<view class="pb-[20rpx]">
<text class="text-[32rpx] text-[#232338] font-bold">
模型配置
{{ t('agent.modelConfig') }}
</text>
</view>
@@ -509,7 +511,7 @@ onMounted(async () => {
<view class="flex flex-col gap-[16rpx]">
<view class="flex cursor-pointer items-center justify-between border border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[20rpx] transition-all duration-300 active:bg-[#eef3ff]" @click="openPicker('vad')">
<text class="text-[28rpx] text-[#232338] font-medium">
语音活动检测
{{ t('agent.vad') }}
</text>
<text class="mx-[16rpx] flex-1 text-right text-[26rpx] text-[#65686f]">
{{ displayNames.vad }}
@@ -519,7 +521,7 @@ onMounted(async () => {
<view class="flex cursor-pointer items-center justify-between border border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[20rpx] transition-all duration-300 active:bg-[#eef3ff]" @click="openPicker('asr')">
<text class="text-[28rpx] text-[#232338] font-medium">
语音识别
{{ t('agent.asr') }}
</text>
<text class="mx-[16rpx] flex-1 text-right text-[26rpx] text-[#65686f]">
{{ displayNames.asr }}
@@ -529,7 +531,7 @@ onMounted(async () => {
<view class="flex cursor-pointer items-center justify-between border border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[20rpx] transition-all duration-300 active:bg-[#eef3ff]" @click="openPicker('llm')">
<text class="text-[28rpx] text-[#232338] font-medium">
大语言模型
{{ t('agent.llm') }}
</text>
<text class="mx-[16rpx] flex-1 text-right text-[26rpx] text-[#65686f]">
{{ displayNames.llm }}
@@ -539,7 +541,7 @@ onMounted(async () => {
<view class="flex cursor-pointer items-center justify-between border border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[20rpx] transition-all duration-300 active:bg-[#eef3ff]" @click="openPicker('vllm')">
<text class="text-[28rpx] text-[#232338] font-medium">
视觉大模型
{{ t('agent.vllm') }}
</text>
<text class="mx-[16rpx] flex-1 text-right text-[26rpx] text-[#65686f]">
{{ displayNames.vllm }}
@@ -549,7 +551,7 @@ onMounted(async () => {
<view class="flex cursor-pointer items-center justify-between border border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[20rpx] transition-all duration-300 active:bg-[#eef3ff]" @click="openPicker('intent')">
<text class="text-[28rpx] text-[#232338] font-medium">
意图识别
{{ t('agent.intent') }}
</text>
<text class="mx-[16rpx] flex-1 text-right text-[26rpx] text-[#65686f]">
{{ displayNames.intent }}
@@ -559,7 +561,7 @@ onMounted(async () => {
<view class="flex cursor-pointer items-center justify-between border border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[20rpx] transition-all duration-300 active:bg-[#eef3ff]" @click="openPicker('memory')">
<text class="text-[28rpx] text-[#232338] font-medium">
记忆
{{ t('agent.memory') }}
</text>
<text class="mx-[16rpx] flex-1 text-right text-[26rpx] text-[#65686f]">
{{ displayNames.memory }}
@@ -572,7 +574,7 @@ onMounted(async () => {
<!-- 语音设置标题 -->
<view class="pb-[20rpx]">
<text class="text-[32rpx] text-[#232338] font-bold">
语音设置
{{ t('agent.voiceSettings') }}
</text>
</view>
@@ -581,7 +583,7 @@ onMounted(async () => {
<view class="flex flex-col gap-[16rpx]">
<view class="flex cursor-pointer items-center justify-between border border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[20rpx] transition-all duration-300 active:bg-[#eef3ff]" @click="openPicker('tts')">
<text class="text-[28rpx] text-[#232338] font-medium">
语音合成
{{ t('agent.tts') }}
</text>
<text class="mx-[16rpx] flex-1 text-right text-[26rpx] text-[#65686f]">
{{ displayNames.tts }}
@@ -591,7 +593,7 @@ onMounted(async () => {
<view class="flex cursor-pointer items-center justify-between border border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[20rpx] transition-all duration-300 active:bg-[#eef3ff]" @click="openPicker('voiceprint')">
<text class="text-[28rpx] text-[#232338] font-medium">
角色音色
{{ t('agent.voiceprint') }}
</text>
<text class="mx-[16rpx] flex-1 text-right text-[26rpx] text-[#65686f]">
{{ displayNames.voiceprint }}
@@ -601,10 +603,10 @@ onMounted(async () => {
<view class="flex items-center justify-between border border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[20rpx]">
<view class="text-[28rpx] text-[#232338] font-medium">
插件
{{ t('agent.plugins') }}
</view>
<view class="cursor-pointer rounded-[20rpx] bg-[rgba(51,108,255,0.1)] px-[24rpx] py-[12rpx] text-[24rpx] text-[#336cff] transition-all duration-300 active:bg-[#336cff] active:text-white" @click="handleTools">
<text>编辑功能</text>
<text>{{ t('agent.editFunctions') }}</text>
</view>
</view>
</view>
@@ -613,7 +615,7 @@ onMounted(async () => {
<!-- 记忆历史标题 -->
<view class="pb-[20rpx]">
<text class="text-[32rpx] text-[#232338] font-bold">
历史记忆
{{ t('agent.historyMemory') }}
</text>
</view>
@@ -622,7 +624,7 @@ onMounted(async () => {
<view class="mb-[24rpx] last:mb-0">
<textarea
v-model="formData.summaryMemory"
placeholder="记忆内容"
:placeholder="t('agent.memoryContent')"
disabled
class="box-border h-[500rpx] w-full resize-none break-words break-all border border-[#eeeeee] rounded-[12rpx] bg-[#f0f0f0] p-[20rpx] text-[26rpx] text-[#65686f] leading-[1.6] opacity-80 outline-none"
/>
@@ -638,7 +640,7 @@ onMounted(async () => {
custom-class="w-full h-[80rpx] rounded-[16rpx] text-[30rpx] font-semibold bg-[#336cff] active:bg-[#2d5bd1]"
@click="saveAgent"
>
{{ saving ? '保存中...' : '保存' }}
{{ saving ? t('agent.saving') : t('agent.save') }}
</wd-button>
</view>
<!-- 模型选择器 -->
main/manager-mobile/src/pages/agent/index.vue
+6 -6
View File
@@ -11,6 +11,7 @@
<script lang="ts" setup>
import { onLoad } from '@dcloudio/uni-app'
import { computed, onMounted, ref } from 'vue'
import { t } from '@/i18n'
import CustomTabs from '@/components/custom-tabs/index.vue'
import ChatHistory from '@/pages/chat-history/index.vue'
import DeviceManagement from '@/pages/device/index.vue'
@@ -42,7 +43,6 @@ systemInfo = uni.getSystemInfoSync()
safeAreaInsets = systemInfo.safeAreaInsets
// #endif
// 智能体ID
const currentAgentId = ref('default')
@@ -65,25 +65,25 @@ const voiceprintRef = ref()
// Tab 配置
const tabList = [
{
label: '角色配置',
label: t('agent.roleConfig'),
value: 'agent-config',
icon: '/static/tabbar/robot.png',
activeIcon: '/static/tabbar/robot_activate.png',
},
{
label: '设备管理',
label: t('agent.deviceManagement'),
value: 'device-management',
icon: '/static/tabbar/device.png',
activeIcon: '/static/tabbar/device_activate.png',
},
{
label: '聊天记录',
label: t('agent.chatHistory'),
value: 'chat-history',
icon: '/static/tabbar/chat.png',
activeIcon: '/static/tabbar/chat_activate.png',
},
{
label: '声纹管理',
label: t('agent.voiceprintManagement'),
value: 'voiceprint-management',
icon: '/static/tabbar/microphone.png',
activeIcon: '/static/tabbar/microphone_activate.png',
@@ -160,7 +160,7 @@ onMounted(async () => {
<template>
<view class="h-screen flex flex-col bg-[#f5f7fb]">
<!-- 导航栏 -->
<wd-navbar title="智能体" safe-area-inset-top>
<wd-navbar :title="t('agent.pageTitle')" safe-area-inset-top>
<template #left>
<wd-icon name="arrow-left" size="18" @click="goBack" />
</template>
main/manager-mobile/src/pages/agent/tools.vue
+35 -34
View File
@@ -3,8 +3,8 @@
"layout": "default",
"style": {
"navigationBarTitleText": "编辑功能",
"navigationStyle": "custom",
},
"navigationStyle": "custom"
}
}
</route>
@@ -12,12 +12,13 @@
import { useMessage } from 'wot-design-uni'
import { getMcpAddress, getMcpTools } from '@/api/agent/agent'
import { usePluginStore } from '@/store'
import { t } from '@/i18n'
const message = useMessage()
const pluginStore = usePluginStore()
const segmentedList = ref<string[]>(['未选', '已选'])
const currentSegmented = ref('未选')
const segmentedList = ref<string[]>([t('agent.tools.notSelected'), t('agent.tools.selected')])
const currentSegmented = ref(t('agent.tools.notSelected'))
const notSelectedList = ref<any[]>([])
const selectedList = ref<any[]>([])
@@ -191,7 +192,7 @@ function handleJsonChange(key: string, value: string, field: any) {
}
}
catch {
message.alert('JSON格式错误')
message.alert(t('agent.tools.jsonFormatError'))
}
}
@@ -220,7 +221,7 @@ function goBack() {
// 复制MCP地址
function copyMcpAddress() {
if (!mcpAddress.value) {
message.alert('暂无MCP地址可复制')
message.alert(t('agent.tools.noMcpAddressToCopy'))
return
}
@@ -228,11 +229,11 @@ function copyMcpAddress() {
data: mcpAddress.value,
showToast: false,
success: () => {
message.alert('MCP地址已复制到剪贴板')
},
message.alert(t('agent.tools.mcpAddressCopied'))
},
fail: () => {
message.alert('复制失败，请重试')
},
message.alert(t('agent.tools.copyFailed'))
},
})
}
@@ -248,7 +249,7 @@ function getFieldDisplayValue(field: any, value: any) {
function getFieldRemark(field: any) {
let description = field.label || ''
if (field.default) {
description += `（默认值：${field.default}）`
description += `（${t('agent.tools.defaultValue')}：${field.default}）`
}
return description
}
@@ -284,7 +285,7 @@ onMounted(async () => {
<!-- 内置插件区域 -->
<view class="mt-[20rpx] flex flex-1 flex-col">
<view class="text-[32rpx] text-[#333] font-medium">
内置插件
{{ t('agent.tools.builtInPlugins') }}
</view>
<view
class="mt-[20rpx] box-border flex flex-1 flex-col rounded-[10rpx] bg-white p-[20rpx]"
@@ -299,7 +300,7 @@ onMounted(async () => {
<view class="mt-[20rpx] flex-1 overflow-hidden">
<!-- 未选插件 -->
<scroll-view
v-if="currentSegmented === '未选'"
v-if="currentSegmented === t('agent.tools.notSelected')"
class="max-h-[600rpx] bg-transparent"
scroll-y
>
@@ -307,7 +308,7 @@ onMounted(async () => {
v-if="notSelectedList.length === 0"
class="h-[400rpx] flex items-center justify-center"
>
<wd-status-tip image="content" tip="暂无更多插件" />
<wd-status-tip image="content" tip="{{ t('agent.tools.noMorePlugins') }}" />
</view>
<view v-else class="p-[20rpx] space-y-[20rpx]">
<view
@@ -343,7 +344,7 @@ onMounted(async () => {
v-if="selectedList.length === 0"
class="h-[400rpx] flex items-center justify-center"
>
<wd-status-tip image="content" tip="请选择插件功能" />
<wd-status-tip image="content" tip="{{ t('agent.tools.pleaseSelectPlugin') }}" />
</view>
<view v-else class="p-[20rpx] space-y-[20rpx]">
<view
@@ -359,7 +360,7 @@ onMounted(async () => {
{{ func.name }}
</view>
<view class="text-[24rpx] text-[#1677ff]">
点击配置参数
{{ t('agent.tools.clickToConfigure') }}
</view>
</view>
<view class="flex space-x-[20rpx]">
@@ -393,7 +394,7 @@ onMounted(async () => {
<!-- MCP接入点区域 -->
<view class="mt-[20rpx] flex flex-1 flex-col">
<view class="text-[32rpx] text-[#333] font-medium">
mcp接入点
{{ t('agent.tools.mcpEndpoint') }}
</view>
<view
class="mt-[20rpx] box-border flex flex-1 flex-col rounded-[10rpx] bg-white p-[20rpx]"
@@ -406,11 +407,11 @@ onMounted(async () => {
class="flex-1 rounded-[10rpx] bg-[#f5f7fb] p-[20rpx]"
>
<view
class="ml-[20rpx] h-[70rpx] flex items-center justify-center rounded-[10rpx] bg-[#1677ff] px-[20rpx] text-[24rpx] text-white"
@click="copyMcpAddress"
>
复制
</view>
class="ml-[20rpx] h-[70rpx] flex items-center justify-center rounded-[10rpx] bg-[#1677ff] px-[20rpx] text-[24rpx] text-white"
@click="copyMcpAddress"
>
{{ t('agent.tools.copy') }}
</view>
</view>
<!-- 工具列表 -->
<view class="mt-[20rpx] flex-1 overflow-hidden">
@@ -419,7 +420,7 @@ onMounted(async () => {
v-if="mcpTools && mcpTools.length === 0"
class="h-[400rpx] flex items-center justify-center"
>
<wd-status-tip image="content" tip="暂无工具" />
<wd-status-tip image="content" :tip="t('agent.tools.noTools')" />
</view>
<view v-else class="p-[20rpx]">
<view class="flex flex-wrap">
@@ -441,7 +442,7 @@ onMounted(async () => {
<!-- 参数编辑弹窗 -->
<wd-action-sheet
v-model="showParamDialog"
:title="`参数配置 - ${currentFunction?.name || ''}`"
:title="`${t('agent.tools.paramConfiguration')} - ${currentFunction?.name || ''}`"
custom-header-class="h-[75vh]"
@close="closeParamEdit"
>
@@ -460,7 +461,7 @@ onMounted(async () => {
class="h-[400rpx] flex items-center justify-center"
>
<text class="text-[28rpx] text-[#999]">
{{ currentFunction?.name }} 无需配置参数
{{ currentFunction?.name }} {{ t('agent.tools.noParamsNeeded') }}
</text>
</view>
@@ -490,7 +491,7 @@ onMounted(async () => {
v-model="tempParams[field.key]"
class="box-border h-[80rpx] w-full border border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[16rpx_20rpx] text-[28rpx] text-[#232338] focus:border-[#336cff] focus:bg-white placeholder:text-[#9d9ea3]"
type="text"
:placeholder="`请输入${field.label}`"
:placeholder="`${t('agent.tools.pleaseInput')}${field.label}`"
@input="
handleParamChange(field.key, $event.detail.value, field)
"
@@ -499,12 +500,12 @@ onMounted(async () => {
<!-- 数组类型 -->
<view v-else-if="field.type === 'array'">
<text class="mb-[16rpx] block text-[24rpx] text-[#65686f]">
每行输入一个项目
{{ t('agent.tools.eachLineOneItem') }}
</text>
<textarea
v-model="arrayTextCache[field.key]"
class="box-border min-h-[200rpx] w-full border border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[20rpx] text-[26rpx] text-[#232338] leading-[1.6] focus:border-[#336cff] focus:bg-white placeholder:text-[#9d9ea3]"
:placeholder="`请输入${field.label}，每行一个`"
:placeholder="`${t('agent.tools.pleaseInput')}${field.label}，${t('agent.tools.eachLineOneItem')}`"
@input="
handleArrayChange(field.key, $event.detail.value, field)
"
@@ -514,12 +515,12 @@ onMounted(async () => {
<!-- JSON类型 -->
<view v-else-if="field.type === 'json'">
<text class="mb-[16rpx] block text-[24rpx] text-[#65686f]">
请输入有效的JSON格式
{{ t('agent.tools.pleaseInputValidJson') }}
</text>
<textarea
v-model="jsonTextCache[field.key]"
class="box-border min-h-[300rpx] w-full border border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[20rpx] text-[26rpx] text-[#232338] leading-[1.6] font-mono focus:border-[#336cff] focus:bg-white placeholder:text-[#9d9ea3]"
placeholder="请输入合法的JSON格式"
:placeholder="t('agent.tools.pleaseInputValidJson')"
@blur="
handleJsonChange(field.key, $event.detail.value, field)
"
@@ -532,7 +533,7 @@ onMounted(async () => {
v-model="tempParams[field.key]"
class="box-border h-[80rpx] w-full border border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[16rpx_20rpx] text-[28rpx] text-[#232338] focus:border-[#336cff] focus:bg-white placeholder:text-[#9d9ea3]"
type="number"
:placeholder="`请输入${field.label}`"
:placeholder="`${t('agent.tools.pleaseInput')}${field.label}`"
@input="
handleParamChange(
field.key,
@@ -549,10 +550,10 @@ onMounted(async () => {
>
<view class="flex-1">
<text class="mb-[8rpx] block text-[28rpx] text-[#232338]">
启用功能
{{ t('agent.tools.enableFunction') }}
</text>
<text class="block text-[24rpx] text-[#65686f]">
开启或关闭此功能
{{ t('agent.tools.toggleFunction') }}
</text>
</view>
<switch
@@ -569,7 +570,7 @@ onMounted(async () => {
v-model="tempParams[field.key]"
class="box-border h-[80rpx] w-full border border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[16rpx_20rpx] text-[28rpx] text-[#232338] focus:border-[#336cff] focus:bg-white placeholder:text-[#9d9ea3]"
type="text"
:placeholder="`请输入${field.label}`"
:placeholder="`${t('agent.tools.pleaseInput')}${field.label}`"
@input="
handleParamChange(field.key, $event.detail.value, field)
"
main/manager-mobile/src/pages/chat-history/detail.vue
+11 -10
View File
@@ -15,6 +15,7 @@ import { computed, ref } from 'vue'
import { getAudioId, getChatHistory } from '@/api/chat-history/chat-history'
import { getEnvBaseUrl } from '@/utils'
import { toast } from '@/utils/toast'
import { t } from '@/i18n'
defineOptions({
name: 'ChatDetail',
@@ -49,7 +50,7 @@ const agentId = ref('')
const currentAgent = computed(() => {
return {
id: agentId.value,
agentName: '智能助手',
agentName: t('chatHistory.assistantName'),
}
})
@@ -80,7 +81,7 @@ async function loadChatHistory() {
}
catch (error) {
console.error('获取聊天记录失败:', error)
toast.error('获取聊天记录失败')
toast.error(t('chatHistory.loadFailed'))
}
finally {
loading.value = false
@@ -114,10 +115,10 @@ function getMessageContent(message: ChatMessage): string {
function getSpeakerName(message: ChatMessage): string {
if (message.chatType === 1) {
const parsed = parseUserMessage(message.content)
return parsed ? parsed.speaker : '用户'
return parsed ? parsed.speaker : t('chatHistory.userName')
}
else {
return currentAgent.value?.agentName || 'AI助手'
return currentAgent.value?.agentName || t('chatHistory.aiAssistantName')
}
}
@@ -130,7 +131,7 @@ function formatTime(timeStr: string) {
// 播放音频
async function playAudio(audioId: string) {
if (!audioId) {
toast.error('音频ID无效')
toast.error(t('chatHistory.invalidAudioId'))
return
}
@@ -168,7 +169,7 @@ async function playAudio(audioId: string) {
// 监听播放错误
audioContext.value.onError((error) => {
console.error('音频播放失败:', error)
toast.error('音频播放失败')
toast.error(t('chatHistory.audioPlayFailed'))
playingAudioId.value = null
if (audioContext.value) {
audioContext.value.destroy()
@@ -181,7 +182,7 @@ async function playAudio(audioId: string) {
}
catch (error) {
console.error('播放音频失败:', error)
toast.error('播放音频失败')
toast.error(t('chatHistory.playAudioFailed'))
playingAudioId.value = null
}
}
@@ -194,7 +195,7 @@ onLoad((options) => {
}
else {
console.error('缺少必要参数')
toast.error('页面参数错误')
toast.error(t('chatHistory.parameterError'))
}
})
@@ -214,7 +215,7 @@ onUnload(() => {
<view class="w-full bg-white" :style="{ height: `${safeAreaInsets?.top}px` }" />
<!-- 导航栏 -->
<wd-navbar title="聊天详情">
<wd-navbar :title="t('chatHistory.pageTitle')">
<template #left>
<wd-icon name="arrow-left" size="18" @click="goBack" />
</template>
@@ -230,7 +231,7 @@ onUnload(() => {
<view v-if="loading" class="flex flex-col items-center justify-center gap-[20rpx] p-[100rpx_0]">
<wd-loading />
<text class="text-[28rpx] text-[#65686f]">
加载中...
{{ t('chatHistory.loading') }}
</text>
</view>
main/manager-mobile/src/pages/chat-history/index.vue
+30 -29
View File
@@ -2,6 +2,7 @@
import type { ChatSession } from '@/api/chat-history/types'
import { computed, onMounted, ref } from 'vue'
import { getChatSessions } from '@/api/chat-history/chat-history'
import { t } from '@/i18n'
defineOptions({
name: 'ChatHistory',
@@ -53,11 +54,11 @@ const currentAgentId = computed(() => {
// 加载聊天会话列表
async function loadChatSessions(page = 1, isRefresh = false) {
try {
console.log('获取聊天会话列表', { page, isRefresh })
console.log(t('chatHistory.getChatSessions'), { page, isRefresh })
// 检查是否有当前选中的智能体
if (!currentAgentId.value) {
console.warn('没有选中的智能体')
console.warn(t('chatHistory.noSelectedAgent'))
sessionList.value = []
return
}
@@ -86,7 +87,7 @@ async function loadChatSessions(page = 1, isRefresh = false) {
currentPage.value = page
}
catch (error) {
console.error('获取聊天会话列表失败:', error)
console.error(t('chatHistory.getChatSessionsFailed'), error)
if (page === 1) {
sessionList.value = []
}
@@ -115,48 +116,48 @@ async function loadMore() {
// 格式化时间
function formatTime(timeStr: string) {
if (!timeStr)
return '未知时间'
return t('chatHistory.unknownTime')
// 处理时间字符串，确保格式正确
const date = new Date(timeStr.replace(' ', 'T')) // 转换为ISO格式
const now = new Date()
// 检查日期是否有效
if (Number.isNaN(date.getTime())) {
return timeStr // 如果解析失败，直接返回原字符串
}
const diff = now.getTime() - date.getTime()
// 小于1分钟
if (diff < 60000)
return '刚刚'
return t('chatHistory.justNow')
// 小于1小时
if (diff < 3600000)
return `${Math.floor(diff / 60000)}分钟前`
return t('chatHistory.minutesAgo', { minutes: Math.floor(diff / 60000) })
// 小于1天（24小时）
if (diff < 86400000)
return `${Math.floor(diff / 3600000)}小时前`
return t('chatHistory.hoursAgo', { hours: Math.floor(diff / 3600000) })
// 小于7天
if (diff < 604800000) {
const days = Math.floor(diff / 86400000)
return `${days}天前`
return t('chatHistory.daysAgo', { days })
}
// 超过7天，显示具体日期
const year = date.getFullYear()
const month = String(date.getMonth() + 1).padStart(2, '0')
const day = String(date.getDate()).padStart(2, '0')
const currentYear = now.getFullYear()
// 如果是当前年份，不显示年份
if (year === currentYear) {
return `${month}-${day}`
}
return `${year}-${month}-${day}`
}
@@ -186,8 +187,8 @@ defineExpose({
<view v-if="loading && sessionList.length === 0" class="loading-container">
<wd-loading color="#336cff" />
<text class="loading-text">
加载中...
</text>
{{ t('chatHistory.loading') }}
</text>
</view>
<!-- 会话列表 -->
@@ -204,7 +205,7 @@ defineExpose({
<view class="session-info">
<view class="session-header">
<text class="session-title">
对话记录 {{ session.sessionId.substring(0, 8) }}...
{{ t('chatHistory.conversationRecord') }} {{ session.sessionId.substring(0, 8) }}...
</text>
<text class="session-time">
{{ formatTime(session.createdAt) }}
@@ -212,7 +213,7 @@ defineExpose({
</view>
<view class="session-meta">
<text class="chat-count">
共 {{ session.chatCount }} 条对话
{{ t('chatHistory.totalChats', { count: session.chatCount }) }}
</text>
</view>
</view>
@@ -225,14 +226,14 @@ defineExpose({
<view v-if="loadingMore" class="loading-more">
<wd-loading color="#336cff" size="24" />
<text class="loading-more-text">
加载中...
{{ t('chatHistory.loading') }}
</text>
</view>
<!-- 没有更多数据 -->
<view v-else-if="!hasMore && sessionList.length > 0" class="no-more">
<text class="no-more-text">
没有更多数据了
{{ t('chatHistory.noMoreData') }}
</text>
</view>
</view>
@@ -241,11 +242,11 @@ defineExpose({
<view v-else-if="!loading" class="empty-state">
<wd-icon name="chat" custom-class="empty-icon" />
<text class="empty-text">
暂无聊天记录
</text>
<text class="empty-desc">
与智能体的对话记录会显示在这里
</text>
{{ t('chatHistory.noChatRecords') }}
</text>
<text class="empty-desc">
{{ t('chatHistory.chatRecordsDescription') }}
</text>
</view>
</view>
</template>
main/manager-mobile/src/pages/device-config/components/ultrasonic-config.vue
+87 -86
View File
@@ -1,6 +1,7 @@
<script setup lang="ts">
import { computed, ref } from 'vue'
import { useToast } from 'wot-design-uni'
import { t } from '@/i18n'
// 类型定义
interface WiFiNetwork {
@@ -53,7 +54,7 @@ const audioLengthText = computed(() => {
const textBytes = stringToBytes(dataStr)
const totalBits = (START_BYTES.length + textBytes.length + 1 + END_BYTES.length) * 8
const duration = Math.ceil(totalBits / BIT_RATE)
return `约${duration}秒`
return `${t('deviceConfig.about')}${duration}${t('deviceConfig.seconds')}`
})
// 字符串转字节数组 - uniapp兼容版本
@@ -227,15 +228,15 @@ async function generateAndPlay() {
generating.value = true
try {
console.log('生成超声波配网音频...')
console.log(t('deviceConfig.generatingUltrasonicConfigAudio') + '...')
// 准备配网数据 - 参考HTML文件格式
const dataStr = `${props.selectedNetwork.ssid}\n${props.password}`
const textBytes = stringToBytes(dataStr)
const fullBytes = [...START_BYTES, ...textBytes, checksum(textBytes), ...END_BYTES]
console.log('配网数据:', { ssid: props.selectedNetwork.ssid, password: props.password })
console.log('数据字节长度:', textBytes.length)
console.log(t('deviceConfig.configData') + ':', { ssid: props.selectedNetwork.ssid, password: props.password })
console.log(t('deviceConfig.dataBytesLength') + ':', textBytes.length)
// 转换为比特流
let bits: number[] = []
@@ -243,7 +244,7 @@ async function generateAndPlay() {
bits = bits.concat(toBits(b))
})
console.log('比特流长度:', bits.length)
console.log(t('deviceConfig.bitStreamLength') + ':', bits.length)
// AFSK调制 - 减少采样率降低文件大小
const reducedSampleRate = 22050 // 降低采样率
@@ -266,19 +267,19 @@ async function generateAndPlay() {
const base64 = arrayBufferToBase64(wavBuffer)
const dataUri = `data:audio/wav;base64,${base64}`
console.log('base64长度:', base64.length, '约', Math.round(base64.length / 1024), 'KB')
console.log(t('deviceConfig.base64Length') + ':', base64.length, t('deviceConfig.about'), Math.round(base64.length / 1024), 'KB')
// 检查数据大小
if (base64.length > 1024 * 1024) { // 超过1MB
throw new Error('音频文件过大，请缩短SSID或密码长度')
throw new Error(t('deviceConfig.audioFileTooLarge'))
}
audioFilePath.value = dataUri
audioGenerated.value = true
console.log('音频生成成功，比特流长度:', bits.length, '采样点数:', floatBuf.length)
console.log(t('deviceConfig.audioGenerationSuccess') + '，比特流长度:', bits.length, t('deviceConfig.samplePoints') + ':', floatBuf.length)
toast.success('声波生成成功')
toast.success(t('deviceConfig.soundWaveGenerationSuccess'))
// 延迟播放
setTimeout(async () => {
@@ -286,8 +287,8 @@ async function generateAndPlay() {
}, 800) // 增加延迟时间
}
catch (error) {
console.error('音频生成失败:', error)
toast.error(`声波生成失败: ${error.message || error}`)
console.error(t('deviceConfig.audioGenerationFailed') + ':', error)
toast.error(`${t('deviceConfig.soundWaveGenerationFailed')}: ${error.message || error}`)
}
finally {
generating.value = false
@@ -344,7 +345,7 @@ function buildWavOptimized(pcm: Uint8Array, sampleRate: number): ArrayBuffer {
// 播放音频
async function playAudio() {
if (!audioFilePath.value) {
toast.error('请先生成音频')
toast.error(t('deviceConfig.pleaseGenerateAudioFirst'))
return
}
@@ -356,7 +357,7 @@ async function playAudio() {
await new Promise(resolve => setTimeout(resolve, 200))
playing.value = true
console.log('开始播放超声波配网音频')
console.log(t('deviceConfig.startPlayingUltrasonicConfigAudio'))
// 创建新的音频上下文
const innerAudioContext = uni.createInnerAudioContext()
@@ -370,12 +371,12 @@ async function playAudio() {
// 简化的事件监听
innerAudioContext.onPlay(() => {
console.log('超声波音频开始播放')
toast.success('开始播放配网声波')
console.log(t('deviceConfig.ultrasonicAudioStartedPlaying'))
toast.success(t('deviceConfig.startPlayingConfigSoundWave'))
})
innerAudioContext.onEnded(() => {
console.log('超声波音频播放结束')
console.log(t('deviceConfig.ultrasonicAudioPlaybackEnded'))
if (!autoLoop.value) {
playing.value = false
cleanupAudio()
@@ -383,18 +384,18 @@ async function playAudio() {
})
innerAudioContext.onError((error) => {
console.error('音频播放失败:', error)
console.error(t('deviceConfig.audioPlaybackFailed') + ':', error)
playing.value = false
let errorMsg = '音频播放失败'
let errorMsg = t('deviceConfig.audioPlaybackFailed')
if (error.errCode === -99) {
errorMsg = '音频资源繁忙，请稍后重试'
errorMsg = t('deviceConfig.audioResourceBusy')
}
else if (error.errCode === 10004) {
errorMsg = '音频格式不支持，可能是data URI问题'
errorMsg = t('deviceConfig.audioFormatNotSupported')
}
else if (error.errCode === 10003) {
errorMsg = '音频文件错误'
errorMsg = t('deviceConfig.audioFileError')
}
toast.error(errorMsg)
@@ -416,10 +417,10 @@ async function playAudio() {
}, 300)
}
catch (error) {
console.error('播放音频异常:', error)
playing.value = false
await cleanupAudio()
toast.error(`播放失败: ${error.message}`)
console.error(t('deviceConfig.audioPlaybackError') + ':', error)
playing.value = false
await cleanupAudio()
toast.error(`${t('deviceConfig.playbackFailed')}: ${error.message}`)
}
}
@@ -429,10 +430,10 @@ async function cleanupAudio() {
try {
audioContext.value.pause()
audioContext.value.destroy()
console.log('清理音频上下文')
console.log(t('deviceConfig.cleaningUpAudioContext'))
}
catch (e) {
console.log('清理音频上下文失败:', e)
console.log(t('deviceConfig.cleaningUpAudioContextFailed') + ':', e)
}
finally {
audioContext.value = null
@@ -445,8 +446,8 @@ async function stopAudio() {
playing.value = false
await cleanupAudio()
console.log('停止播放超声波音频')
toast.success('已停止播放')
console.log(t('deviceConfig.stoppedPlayingUltrasonicAudio'))
toast.success(t('deviceConfig.stoppedPlaying'))
}
</script>
@@ -456,18 +457,18 @@ async function stopAudio() {
<view v-if="props.selectedNetwork" class="selected-network">
<view class="network-info">
<view class="network-name">
选中网络: {{ props.selectedNetwork.ssid }}
{{ t('deviceConfig.selectedNetwork') }}: {{ props.selectedNetwork.ssid }}
</view>
<view class="network-details">
<text class="network-signal">
信号: {{ props.selectedNetwork.rssi }}dBm
{{ t('deviceConfig.signal') }}: {{ props.selectedNetwork.rssi }}dBm
</text>
<text class="network-security">
{{ props.selectedNetwork.authmode === 0 ? '开放网络' : '加密网络' }}
{{ props.selectedNetwork.authmode === 0 ? t('deviceConfig.openNetwork') : t('deviceConfig.encryptedNetwork') }}
</text>
</view>
<view v-if="props.password" class="network-password">
密码: {{ '*'.repeat(props.password.length) }}
{{ t('deviceConfig.password') }}: {{ '*'.repeat(props.password.length) }}
</view>
</view>
</view>
@@ -482,81 +483,81 @@ async function stopAudio() {
:disabled="!canGenerate"
@click="generateAndPlay"
>
{{ generating ? '生成中...' : '🎵 生成并播放声波' }}
</wd-button>
{{ generating ? t('deviceConfig.generating') : '🎵 ' + t('deviceConfig.generateAndPlaySoundWave') }}
</wd-button>
<wd-button
v-if="audioGenerated"
type="success"
size="large"
block
:loading="playing"
@click="playAudio"
>
{{ playing ? '播放中...' : '🔊 播放声波' }}
</wd-button>
<wd-button
v-if="audioGenerated"
type="success"
size="large"
block
:loading="playing"
@click="playAudio"
>
{{ playing ? t('deviceConfig.playing') : '🔊 ' + t('deviceConfig.playSoundWave') }}
</wd-button>
<wd-button
v-if="playing"
type="warning"
size="large"
block
@click="stopAudio"
>
⏹️ 停止播放
</wd-button>
<wd-button
v-if="playing"
type="warning"
size="large"
block
@click="stopAudio"
>
⏹️ {{ t('deviceConfig.stopPlaying') }}
</wd-button>
</view>
<!-- 音频控制选项 -->
<view v-if="audioGenerated" class="audio-options">
<view class="option-item">
<wd-checkbox v-model="autoLoop">
自动循环播放声波
</wd-checkbox>
</view>
<wd-checkbox v-model="autoLoop">
{{ t('deviceConfig.autoLoopPlaySoundWave') }}
</wd-checkbox>
</view>
</view>
<!-- 音频播放器 -->
<view v-if="audioGenerated" class="audio-player">
<view class="player-info">
<text class="audio-title">
配网音频文件
{{ t('deviceConfig.configAudioFile') }}
</text>
<text class="audio-duration">
时长: {{ audioLengthText }}
{{ t('deviceConfig.duration') }}: {{ audioLengthText }}
</text>
</view>
</view>
<!-- 使用说明 -->
<view class="help-section">
<view class="help-title">
超声波配网说明
<view class="help-title">
{{ t('deviceConfig.ultrasonicConfigInstructions') }}
</view>
<view class="help-content">
<text class="help-item">
1. {{ t('deviceConfig.ensureWifiNetworkSelectedAndPasswordEntered') }}
</text>
<text class="help-item">
2. {{ t('deviceConfig.clickGenerateAndPlaySoundWave') }}
</text>
<text class="help-item">
3. {{ t('deviceConfig.bringPhoneCloseToXiaozhiDevice') }}
</text>
<text class="help-item">
4. {{ t('deviceConfig.duringAudioPlaybackXiaozhiWillReceive') }}
</text>
<text class="help-item">
5. {{ t('deviceConfig.afterConfigSuccessDeviceWillConnect') }}
</text>
<text class="help-tip">
{{ t('deviceConfig.usesAfskModulation') }}
</text>
<text class="help-tip">
{{ t('deviceConfig.ensureModeratePhoneVolume') }}
</text>
</view>
</view>
<view class="help-content">
<text class="help-item">
1. 确保已选择WiFi网络并输入密码
</text>
<text class="help-item">
2. 点击生成并播放声波，系统会将配网信息编码为音频
</text>
<text class="help-item">
3. 将手机靠近xiaozhi设备（距离1-2米）
</text>
<text class="help-item">
4. 音频播放时，xiaozhi会接收并解码配网信息
</text>
<text class="help-item">
5. 配网成功后设备会自动连接WiFi网络
</text>
<text class="help-tip">
使用AFSK调制技术，通过1800Hz和1500Hz频率传输数据
</text>
<text class="help-tip">
请确保手机音量适中，避免环境噪音干扰
</text>
</view>
</view>
</view>
</template>
main/manager-mobile/src/pages/device-config/components/wifi-config.vue
+22 -21
View File
@@ -1,6 +1,7 @@
<script setup lang="ts">
import { computed, ref } from 'vue'
import { useToast } from 'wot-design-uni'
import { t } from '@/i18n'
// 类型定义
interface WiFiNetwork {
@@ -44,7 +45,7 @@ async function checkESP32Connection() {
return response.statusCode === 200
}
catch (error) {
console.log('ESP32连接检查失败:', error)
console.log(t('deviceConfig.esp32ConnectionCheckFailed') + ':', error)
return false
}
}
@@ -57,12 +58,12 @@ async function submitConfig() {
// 检查ESP32连接
const connected = await checkESP32Connection()
if (!connected) {
toast.error('请先连接xiaozhi热点')
return
}
toast.error(t('deviceConfig.connectXiaozhiHotspot'))
return
}
configuring.value = true
console.log('开始WiFi配网:', props.selectedNetwork.ssid)
console.log(t('deviceConfig.startWifiConfig') + ':', props.selectedNetwork.ssid)
try {
const response = await uni.request({
@@ -81,16 +82,16 @@ async function submitConfig() {
console.log('WiFi配网响应:', response)
if (response.statusCode === 200 && (response.data as any)?.success) {
toast.success(`配网成功！设备将连接到 ${props.selectedNetwork.ssid}，设备会自动重启。请断开xiaozhi热点连接。`)
toast.success(`${t('deviceConfig.configSuccess')}！${t('deviceConfig.deviceWillConnectTo')} ${props.selectedNetwork.ssid}，${t('deviceConfig.deviceWillRestart')}。${t('deviceConfig.pleaseDisconnectXiaozhiHotspot')}`)
}
else {
const errorMsg = (response.data as any)?.error || '配网失败'
const errorMsg = (response.data as any)?.error || t('deviceConfig.configFailed')
toast.error(errorMsg)
}
}
catch (error) {
console.error('WiFi配网失败:', error)
toast.error('配网失败，请检查网络连接')
console.error(t('deviceConfig.wifiConfigFailed') + ':', error)
toast.error(`${t('deviceConfig.configFailed')}，${t('deviceConfig.pleaseCheckNetworkConnection')}`)
}
finally {
configuring.value = false
@@ -104,14 +105,14 @@ async function submitConfig() {
<view v-if="props.selectedNetwork" class="selected-network">
<view class="network-info">
<view class="network-name">
选中网络: {{ props.selectedNetwork.ssid }}
{{ t('deviceConfig.selectedNetwork') }}: {{ props.selectedNetwork.ssid }}
</view>
<view class="network-details">
<text class="network-signal">
信号: {{ props.selectedNetwork.rssi }}dBm
{{ t('deviceConfig.signal') }}: {{ props.selectedNetwork.rssi }}dBm
</text>
<text class="network-security">
{{ props.selectedNetwork.authmode === 0 ? '开放网络' : '加密网络' }}
{{ props.selectedNetwork.authmode === 0 ? t('deviceConfig.openNetwork') : t('deviceConfig.encryptedNetwork') }}
</text>
</view>
</view>
@@ -127,30 +128,30 @@ async function submitConfig() {
:disabled="!canSubmit"
@click="submitConfig"
>
{{ configuring ? '配网中...' : '开始WiFi配网' }}
{{ configuring ? t('deviceConfig.configuring') : t('deviceConfig.startWifiConfigButton') }}
</wd-button>
</view>
<!-- 使用说明 -->
<view class="help-section">
<view class="help-title">
WiFi配网说明
</view>
<view class="help-title">
{{ t('deviceConfig.wifiConfigInstructions') }}
</view>
<view class="help-content">
<text class="help-item">
1. 手机连接xiaozhi热点 (xiaozhi-XXXXXX)
1. {{ t('deviceConfig.phoneConnectXiaozhiHotspot') }} (xiaozhi-XXXXXX)
</text>
<text class="help-item">
2. 选择要配网的目标WiFi网络
2. {{ t('deviceConfig.selectTargetWifiNetwork') }}
</text>
<text class="help-item">
3. 输入WiFi密码（如果需要）
3. {{ t('deviceConfig.enterWifiPasswordIfNeeded') }}
</text>
<text class="help-item">
4. 点击开始配网，等待设备连接
4. {{ t('deviceConfig.clickStartConfigAndWait') }}
</text>
<text class="help-tip">
配网成功后设备会自动重启并连接目标WiFi
{{ t('deviceConfig.afterConfigSuccessDeviceWillRestart') }}
</text>
</view>
</view>
main/manager-mobile/src/pages/device-config/components/wifi-selector.vue
+86 -85
View File
@@ -1,6 +1,7 @@
<script setup lang="ts">
import { computed, defineEmits, defineExpose, onMounted, ref } from 'vue'
import { useToast } from 'wot-design-uni'
import { t } from '@/i18n'
// 类型定义
interface WiFiNetwork {
@@ -40,7 +41,7 @@ const selectorExpanded = ref(false)
// 计算属性
const networkDisplayText = computed(() => {
if (!selectedNetwork.value)
return '请选择WiFi网络'
return t('deviceConfig.selectWifiNetwork')
return selectedNetwork.value.ssid
})
@@ -55,7 +56,7 @@ async function checkESP32Connection() {
})
isConnectedToESP32.value = response.statusCode === 200
emit('connection-status', isConnectedToESP32.value)
console.log('xiaozhi连接状态:', isConnectedToESP32.value)
console.log(`${t('deviceConfig.xiaozhi')}连接状态:`, isConnectedToESP32.value)
}
catch (error) {
isConnectedToESP32.value = false
@@ -70,9 +71,9 @@ async function checkESP32Connection() {
// 扫描WiFi网络
async function scanWifi() {
if (!isConnectedToESP32.value) {
toast.error('请先连接xiaozhi热点')
return
}
toast.error(t('deviceConfig.connectXiaozhiHotspot'))
return
}
scanning.value = true
console.log('开始扫描WiFi网络')
@@ -84,13 +85,13 @@ async function scanWifi() {
timeout: 10000,
})
console.log('WiFi扫描响应:', response)
console.log(t('deviceConfig.wifiScanResponse') + ':', response)
if (response.statusCode === 200 && response.data) {
const data = response.data as any
if (data.success && Array.isArray(data.networks)) {
wifiNetworks.value = data.networks
console.log(`扫描成功，发现 ${data.networks.length} 个网络`)
console.log(`${t('deviceConfig.scanSuccess')}，发现 ${data.networks.length} ${t('deviceConfig.networks')}`)
}
else if (Array.isArray(response.data)) {
// 兼容旧格式
@@ -110,8 +111,8 @@ async function scanWifi() {
}
}
catch (error) {
console.error('WiFi扫描失败:', error)
toast.error('扫描失败，请检查xiaozhi连接')
console.error(t('deviceConfig.wifiScanFailed') + ':', error)
toast.error(t('deviceConfig.scanFailedCheckConnection'))
}
finally {
scanning.value = false
@@ -124,9 +125,9 @@ async function showNetworkSelector() {
await checkESP32Connection()
if (!isConnectedToESP32.value) {
toast.error('请先连接xiaozhi热点')
return
}
toast.error(t('deviceConfig.connectXiaozhiHotspot'))
return
}
selectorExpanded.value = true
@@ -172,12 +173,12 @@ function reset() {
// 获取信号强度描述
function getSignalStrength(rssi: number): string {
if (rssi >= -50)
return '信号强'
return t('deviceConfig.signalStrong')
if (rssi >= -60)
return '信号良好'
return t('deviceConfig.signalGood')
if (rssi >= -70)
return '信号一般'
return '信号弱'
return t('deviceConfig.signalFair')
return t('deviceConfig.signalWeak')
}
// 获取信号强度颜色
@@ -212,81 +213,81 @@ onMounted(() => {
<!-- Xiaozhi连接状态 -->
<view v-if="props.autoConnect" class="connection-status">
<view v-if="!isConnectedToESP32" class="status-warning">
<view class="status-content">
<text class="warning-text">
请先连接xiaozhi热点 (xiaozhi-XXXXXX)
</text>
<wd-button
size="small"
type="primary"
:loading="checkingConnection"
@click="checkESP32Connection"
>
{{ checkingConnection ? '检测中...' : '重新检测' }}
</wd-button>
<view class="status-content">
<text class="warning-text">
{{ t('deviceConfig.connectXiaozhiHotspot') }} (xiaozhi-XXXXXX)
</text>
<wd-button
size="small"
type="primary"
:loading="checkingConnection"
@click="checkESP32Connection"
>
{{ checkingConnection ? t('deviceConfig.checking') : t('deviceConfig.reCheck') }}
</wd-button>
</view>
</view>
</view>
<view v-else class="status-success">
<view class="status-content">
<text class="success-text">
已连接xiaozhi热点
</text>
<wd-button
size="small"
:loading="checkingConnection"
@click="checkESP32Connection"
>
{{ checkingConnection ? '检测中...' : '刷新状态' }}
</wd-button>
<view class="status-content">
<text class="success-text">
{{ t('deviceConfig.connectedXiaozhiHotspot') }}
</text>
<wd-button
size="small"
:loading="checkingConnection"
@click="checkESP32Connection"
>
{{ checkingConnection ? t('deviceConfig.checking') : t('deviceConfig.refreshStatus') }}
</wd-button>
</view>
</view>
</view>
</view>
<!-- WiFi网络选择器 -->
<view class="network-selector">
<view class="selector-item" @click="showNetworkSelector">
<text class="selector-label">
WiFi网络
</text>
<text class="selector-value">
{{ networkDisplayText }}
</text>
<wd-icon name="arrow-right" custom-class="arrow-icon" />
<view class="selector-item" @click="showNetworkSelector">
<text class="selector-label">
{{ t('deviceConfig.wifiNetwork') }}
</text>
<text class="selector-value">
{{ networkDisplayText }}
</text>
<wd-icon name="arrow-right" custom-class="arrow-icon" />
</view>
</view>
</view>
<!-- 展开的网络列表 -->
<view v-if="selectorExpanded" class="network-list-overlay">
<view class="network-list-container">
<view class="list-header">
<text class="list-title">
选择WiFi网络
</text>
<view class="list-actions">
<wd-button
type="primary"
size="small"
:loading="scanning"
@click="scanWifi"
>
{{ scanning ? '扫描中...' : '刷新扫描' }}
</wd-button>
<wd-button
size="small"
@click="selectorExpanded = false"
>
取消
</wd-button>
<text class="list-title">
{{ t('deviceConfig.selectWifiNetwork') }}
</text>
<view class="list-actions">
<wd-button
type="primary"
size="small"
:loading="scanning"
@click="scanWifi"
>
{{ scanning ? t('deviceConfig.scanning') : t('deviceConfig.refreshScan') }}
</wd-button>
<wd-button
size="small"
@click="selectorExpanded = false"
>
{{ t('deviceConfig.cancel') }}
</wd-button>
</view>
</view>
</view>
<view class="network-list">
<view v-if="wifiNetworks.length === 0 && !scanning" class="empty-state">
<text class="empty-text">
暂无WiFi网络
{{ t('deviceConfig.noWifiNetworks') }}
</text>
<text class="empty-tip">
请点击刷新扫描
{{ t('deviceConfig.clickRefreshScan') }}
</text>
</view>
@@ -303,16 +304,16 @@ onMounted(() => {
</view>
<view class="wifi-details">
<text class="wifi-signal">
信号: {{ network.rssi }}dBm
{{ t('deviceConfig.signal') }}: {{ network.rssi }}dBm
</text>
<text class="wifi-channel">
频道: {{ network.channel }}
{{ t('deviceConfig.channel') }}: {{ network.channel }}
</text>
</view>
</view>
<view class="wifi-security">
<text class="security-icon">
{{ network.authmode === 0 ? '开放' : '加密' }}
{{ network.authmode === 0 ? t('deviceConfig.open') : t('deviceConfig.encrypted') }}
</text>
</view>
</view>
@@ -324,17 +325,17 @@ onMounted(() => {
<!-- 密码输入 -->
<view v-if="selectedNetwork && selectedNetwork.authmode > 0" class="password-section">
<view class="password-item">
<text class="password-label">
网络密码
</text>
<wd-input
v-model="password"
placeholder="请输入WiFi密码"
show-password
clearable
@input="onPasswordChange"
/>
</view>
<text class="password-label">
{{ t('deviceConfig.networkPassword') }}
</text>
<wd-input
v-model="password"
:placeholder="t('deviceConfig.enterWifiPassword')"
show-password
clearable
@input="onPasswordChange"
/>
</view>
</view>
</view>
</template>
main/manager-mobile/src/pages/device-config/index.vue
+22 -13
View File
@@ -1,5 +1,6 @@
<script setup lang="ts">
import { ref } from 'vue'
import { t } from '@/i18n'
import UltrasonicConfig from './components/ultrasonic-config.vue'
import WifiConfig from './components/wifi-config.vue'
import WifiSelector from './components/wifi-selector.vue'
@@ -33,11 +34,11 @@ const selectedWifiInfo = ref<{
// 配网模式选项
const configTypeOptions = [
{
name: 'WiFi配网',
name: t('deviceConfig.wifiConfig'),
value: 'wifi' as const,
},
// {
// name: '超声波配网',
// name: t('deviceConfig.ultrasonicConfig'),
// value: 'ultrasonic' as const,
// },
]
@@ -67,28 +68,36 @@ function onNetworkSelected(network: WiFiNetwork | null, password: string) {
function onConnectionStatusChange(connected: boolean) {
console.log('ESP32连接状态:', connected)
}
// 在组件挂载后设置导航栏标题
import { onMounted } from 'vue'
onMounted(() => {
uni.setNavigationBarTitle({
title: t('deviceConfig.pageTitle')
})
})
</script>
<template>
<view class="min-h-screen bg-[#f5f7fb]">
<wd-navbar title="设备配网" safe-area-inset-top />
<wd-navbar :title="t('deviceConfig.pageTitle')" safe-area-inset-top />
<view class="box-border px-[20rpx]">
<!-- 配网方式选择 -->
<view class="pb-[20rpx] first:pt-[20rpx]">
<text class="text-[32rpx] text-[#232338] font-bold">
配网方式
</text>
{{ t('deviceConfig.configMethod') }}
</text>
</view>
<view class="mb-[24rpx] border border-[#eeeeee] rounded-[20rpx] bg-[#fbfbfb] p-[24rpx]" style="box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);">
<view class="flex cursor-pointer items-center justify-between border border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[20rpx] transition-all duration-300 active:border-[#336cff] active:bg-[#eef3ff]" @click="showConfigTypeSelector">
<text class="text-[28rpx] text-[#232338] font-medium">
配网方式
</text>
<text class="mx-[16rpx] flex-1 text-right text-[26rpx] text-[#65686f]">
{{ configType === 'wifi' ? 'WiFi配网' : '超声波配网' }}
</text>
{{ t('deviceConfig.configMethod') }}
</text>
<text class="mx-[16rpx] flex-1 text-right text-[26rpx] text-[#65686f]">
{{ configType === 'wifi' ? t('deviceConfig.wifiConfig') : t('deviceConfig.ultrasonicConfig') }}
</text>
<wd-icon name="arrow-right" custom-class="text-[20rpx] text-[#9d9ea3]" />
</view>
</view>
@@ -96,8 +105,8 @@ function onConnectionStatusChange(connected: boolean) {
<!-- WiFi网络选择 -->
<view class="pb-[20rpx]">
<text class="text-[32rpx] text-[#232338] font-bold">
网络配置
</text>
{{ t('deviceConfig.networkConfig') }}
</text>
</view>
<view class="mb-[24rpx] border border-[#eeeeee] rounded-[20rpx] bg-[#fbfbfb] p-[24rpx]" style="box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);">
@@ -139,7 +148,7 @@ function onConnectionStatusChange(connected: boolean) {
<route lang="jsonc" type="page">
{
"style": {
"navigationBarTitleText": "设备配网",
"navigationBarTitleText": "设备配置",
"navigationStyle": "custom"
}
}
main/manager-mobile/src/pages/device/index.vue
+34 -33
View File
@@ -4,6 +4,7 @@ import { computed, onMounted, ref } from 'vue'
import { useMessage } from 'wot-design-uni'
import { bindDevice, getBindDevices, getFirmwareTypes, unbindDevice, updateDeviceAutoUpdate } from '@/api/device'
import { toast } from '@/utils/toast'
import { t } from '@/i18n'
defineOptions({
name: 'DeviceManage',
@@ -91,19 +92,19 @@ function getDeviceTypeName(boardKey: string): string {
// 格式化时间
function formatTime(timeStr: string) {
if (!timeStr)
return '从未连接'
return t('device.neverConnected')
const date = new Date(timeStr)
const now = new Date()
const diff = now.getTime() - date.getTime()
if (diff < 60000)
return '刚刚'
return t('device.justNow')
if (diff < 3600000)
return `${Math.floor(diff / 60000)}分钟前`
return t('device.minutesAgo', { minutes: Math.floor(diff / 60000) })
if (diff < 86400000)
return `${Math.floor(diff / 3600000)}小时前`
return t('device.hoursAgo', { hours: Math.floor(diff / 3600000) })
if (diff < 604800000)
return `${Math.floor(diff / 86400000)}天前`
return t('device.daysAgo', { days: Math.floor(diff / 86400000) })
return date.toLocaleDateString()
}
@@ -114,11 +115,11 @@ async function toggleAutoUpdate(device: Device) {
const newStatus = device.autoUpdate === 1 ? 0 : 1
await updateDeviceAutoUpdate(device.id, newStatus)
device.autoUpdate = newStatus
toast.success(newStatus === 1 ? 'OTA自动升级已开启' : 'OTA自动升级已关闭')
toast.success(newStatus === 1 ? t('device.otaAutoUpdateEnabled') : t('device.otaAutoUpdateDisabled'))
}
catch (error: any) {
console.error('更新设备OTA状态失败:', error)
toast.error('操作失败，请重试')
toast.error(t('device.operationFailed'))
}
}
@@ -127,21 +128,21 @@ async function handleUnbindDevice(device: Device) {
try {
await unbindDevice(device.id)
await loadDeviceList()
toast.success('设备已解绑')
toast.success(t('device.deviceUnbound'))
}
catch (error: any) {
console.error('解绑设备失败:', error)
toast.error('解绑失败，请重试')
toast.error(t('device.unbindFailed'))
}
}
// 确认解绑设备
function confirmUnbindDevice(device: Device) {
message.confirm({
title: '解绑设备',
msg: `确定要解绑设备 "${device.macAddress}" 吗？`,
confirmButtonText: '确定解绑',
cancelButtonText: '取消',
title: t('device.unbindDevice'),
msg: t('device.confirmUnbindDevice', { macAddress: device.macAddress }),
confirmButtonText: t('device.confirmUnbind'),
cancelButtonText: t('device.cancel'),
}).then(() => {
handleUnbindDevice(device)
}).catch(() => {
@@ -153,18 +154,18 @@ function confirmUnbindDevice(device: Device) {
async function handleBindDevice(code: string) {
try {
if (!currentAgentId.value) {
toast.error('请先选择智能体')
toast.error(t('device.pleaseSelectAgent'))
return
}
await bindDevice(currentAgentId.value, code.trim())
await loadDeviceList()
toast.success('设备绑定成功！')
toast.success(t('device.deviceBindSuccess'))
}
catch (error: any) {
console.error('绑定设备失败:', error)
const errorMessage = error?.message || '绑定失败，请检查验证码是否正确'
toast.error(errorMessage)
toast.error(errorMessage || t('device.bindFailed'))
}
}
@@ -172,12 +173,12 @@ async function handleBindDevice(code: string) {
function openBindDialog() {
message
.prompt({
title: '绑定设备',
inputPlaceholder: '请输入设备验证码',
title: t('device.bindDevice'),
inputPlaceholder: t('device.enterDeviceCode'),
inputValue: '',
inputPattern: /^\d{6}$/,
confirmButtonText: '立即绑定',
cancelButtonText: '取消',
confirmButtonText: t('device.bindNow'),
cancelButtonText: t('device.cancel'),
})
.then(async (result: any) => {
if (result.value && String(result.value).trim()) {
@@ -219,7 +220,7 @@ defineExpose({
<view v-if="loading && deviceList.length === 0" class="loading-container">
<wd-loading color="#336cff" />
<text class="loading-text">
加载中...
{{ t('device.loading') }}
</text>
</view>
@@ -240,19 +241,19 @@ defineExpose({
<view class="mb-[20rpx]">
<text class="mb-[12rpx] block text-[28rpx] text-[#65686f] leading-[1.4]">
MAC地址：{{ device.macAddress }}
</text>
<text class="mb-[12rpx] block text-[28rpx] text-[#65686f] leading-[1.4]">
固件版本：{{ device.appVersion }}
</text>
<text class="block text-[28rpx] text-[#65686f] leading-[1.4]">
最近对话：{{ formatTime(device.lastConnectedAt) }}
</text>
{{ t('device.macAddress') }}：{{ device.macAddress }}
</text>
<text class="mb-[12rpx] block text-[28rpx] text-[#65686f] leading-[1.4]">
{{ t('device.firmwareVersion') }}：{{ device.appVersion }}
</text>
<text class="block text-[28rpx] text-[#65686f] leading-[1.4]">
{{ t('device.lastConnection') }}：{{ formatTime(device.lastConnectedAt) }}
</text>
</view>
<view class="flex items-center justify-between border-[1rpx] border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[16rpx_20rpx]">
<text class="text-[28rpx] text-[#232338] font-medium">
OTA升级
{{ t('device.otaUpdate') }}
</text>
<wd-switch
:model-value="device.autoUpdate === 1"
@@ -271,7 +272,7 @@ defineExpose({
@click.stop="confirmUnbindDevice(device)"
>
<wd-icon name="delete" />
<text>解绑</text>
<text>{{ t('device.unbind') }}</text>
</view>
</view>
</template>
@@ -285,10 +286,10 @@ defineExpose({
<view class="flex flex-col items-center justify-center p-[100rpx_40rpx] text-center">
<wd-icon name="phone" custom-class="text-[120rpx] text-[#d9d9d9] mb-[32rpx]" />
<text class="mb-[16rpx] text-[32rpx] text-[#666666] font-medium">
暂无设备
{{ t('device.noDevice') }}
</text>
<text class="text-[26rpx] text-[#999999] leading-[1.5]">
点击右下角 + 号绑定您的第一个设备
{{ t('device.clickToBindFirstDevice') }}
</text>
</view>
</view>
main/manager-mobile/src/pages/index/index.vue
+30 -24
View File
@@ -17,6 +17,7 @@ import { useMessage } from 'wot-design-uni'
import useZPaging from 'z-paging/components/z-paging/js/hooks/useZPaging.js'
import { createAgent, deleteAgent, getAgentList } from '@/api/agent/agent'
import { toast } from '@/utils/toast'
import { t } from '@/i18n'
defineOptions({
name: 'Home',
@@ -78,11 +79,11 @@ async function handleCreateAgent(agentName: string) {
await createAgent({ agentName: agentName.trim() })
// 创建成功后刷新列表
pagingRef.value.reload()
toast.success(`智能体"${agentName}"创建成功！`)
toast.success(`${t('home.agentName')}"${agentName}"${t('message.saveSuccess')}`)
}
catch (error: any) {
console.error('创建智能体失败:', error)
const errorMessage = error?.message || '创建失败，请重试'
const errorMessage = error?.message || t('message.saveFail')
toast.error(errorMessage)
}
}
@@ -93,11 +94,11 @@ async function handleDeleteAgent(agent: Agent) {
await deleteAgent(agent.id)
// 删除成功后刷新列表
pagingRef.value.reload()
toast.success(`智能体"${agent.agentName}"已删除`)
toast.success(`${t('home.agentName')}${t('message.deleteSuccess')}`)
}
catch (error: any) {
console.error('删除智能体失败:', error)
const errorMessage = error?.message || '删除失败，请重试'
const errorMessage = error?.message || t('message.deleteFail')
toast.error(errorMessage)
}
}
@@ -119,13 +120,13 @@ function handleCardClick(agent: Agent) {
function openCreateDialog() {
message
.prompt({
title: '创建智能体',
title: t('home.dialogTitle'),
msg: '',
inputPlaceholder: '例如：客服助手、语音助理、知识问答',
inputPlaceholder: t('home.inputPlaceholder'),
inputValue: '',
inputPattern: /^[\u4E00-\u9FA5a-z0-9\s]{1,50}$/i,
confirmButtonText: '立即创建',
cancelButtonText: '取消',
confirmButtonText: t('home.createNow'),
cancelButtonText: t('common.cancel'),
})
.then(async (result: any) => {
if (result.value && String(result.value).trim()) {
@@ -144,12 +145,12 @@ function formatTime(timeStr: string) {
const diff = now.getTime() - date.getTime()
if (diff < 60000)
return '刚刚'
return t('home.justNow')
if (diff < 3600000)
return `${Math.floor(diff / 60000)}分钟前`
return `${Math.floor(diff / 60000)}${t('home.minutesAgo')}`
if (diff < 86400000)
return `${Math.floor(diff / 3600000)}小时前`
return `${Math.floor(diff / 86400000)}天前`
return `${Math.floor(diff / 3600000)}${t('home.hoursAgo')}`
return `${Math.floor(diff / 86400000)}${t('home.daysAgo')}`
}
// 页面显示时刷新列表
@@ -159,12 +160,20 @@ onShow(() => {
pagingRef.value.reload()
}
})
// 在组件挂载后设置导航栏标题
import { onMounted } from 'vue'
onMounted(() => {
uni.setNavigationBarTitle({
title: t('home.pageTitle')
})
})
</script>
<template>
<z-paging
ref="pagingRef" v-model="agentList" :refresher-enabled="true" :auto-show-back-to-top="true"
:loading-more-enabled="false" :show-loading-more="false" :hide-empty-view="false" empty-view-text="暂无智能体"
:loading-more-enabled="false" :show-loading-more="false" :hide-empty-view="false" :empty-view-text="t('home.emptyState')"
empty-view-img="" :refresher-threshold="80" :back-to-top-style="{
backgroundColor: '#fff',
borderRadius: '50%',
@@ -178,16 +187,13 @@ onShow(() => {
<view class="banner-content">
<view class="welcome-info">
<text class="greeting">
你好，小智
{{ t('home.greeting') }}
</text>
<text class="subtitle">
让我们度过 <text class="highlight">
美好的一天！
{{ t('home.subtitle') }} <text class="highlight">
{{ t('home.wonderfulDay') }}
</text>
</text>
<text class="english-subtitle">
Hello, Let's have a wonderful day!
</text>
</view>
<view class="wave-decoration">
<!-- 添加波浪装饰 -->
@@ -227,13 +233,13 @@ onShow(() => {
<view class="stat-chip">
<wd-icon name="phone" custom-class="chip-icon" />
<text class="chip-text">
设备管理({{ agent.deviceCount }})
{{ t('home.deviceManagement') }}({{ agent.deviceCount }})
</text>
</view>
<view v-if="agent.lastConnectedAt" class="stat-chip">
<wd-icon name="time" custom-class="chip-icon" />
<text class="chip-text">
最近对话：{{ formatTime(agent.lastConnectedAt) }}
{{ t('home.lastConversation') }}{{ formatTime(agent.lastConnectedAt) }}
</text>
</view>
</view>
@@ -247,7 +253,7 @@ onShow(() => {
<view class="swipe-actions">
<view class="action-btn delete-btn" @click.stop="handleDeleteAgent(agent)">
<wd-icon name="delete" />
<text>删除</text>
<text>{{ t('home.delete') }}</text>
</view>
</view>
</template>
@@ -260,10 +266,10 @@ onShow(() => {
<view class="empty-state">
<wd-icon name="robot" custom-class="empty-icon" />
<text class="empty-text">
暂无智能体
{{ t('home.emptyState') }}
</text>
<text class="empty-desc">
点击右下角 + 号创建您的第一个智能体
{{ t('home.createFirstAgent') }}
</text>
</view>
</template>
main/manager-mobile/src/pages/login/index.vue
+149 -38
View File
@@ -3,7 +3,7 @@
"layout": "default",
"style": {
"navigationStyle": "custom",
"navigationBarTitleText": "登陆"
"navigationBarTitleText": "Login"
}
}
</route>
@@ -15,6 +15,9 @@ import { login } from '@/api/auth'
import { useConfigStore } from '@/store'
import { getEnvBaseUrl } from '@/utils'
import { toast } from '@/utils/toast'
// 导入国际化相关功能
import { t, changeLanguage, getSupportedLanguages, initI18n } from '@/i18n'
import type { Language } from '@/store/lang'
// 获取屏幕边界到安全区域距离
let safeAreaInsets
@@ -136,28 +139,28 @@ async function handleLogin() {
// 表单验证
if (loginType.value === 'username') {
if (!formData.value.username) {
toast.warning('请输入用户名')
toast.warning(t('login.enterUsername'))
return
}
}
else {
if (!formData.value.mobile) {
toast.warning('请输入手机号')
toast.warning(t('login.enterPhone'))
return
}
// 手机号格式验证
const phoneRegex = /^1[3-9]\d{9}$/
if (!phoneRegex.test(formData.value.mobile)) {
toast.warning('请输入正确的手机号')
toast.warning(t('login.enterPhone'))
return
}
}
if (!formData.value.password) {
toast.warning('请输入密码')
toast.warning(t('login.enterPassword'))
return
}
if (!formData.value.captcha) {
toast.warning('请输入验证码')
toast.warning(t('login.enterCaptcha'))
return
}
@@ -177,7 +180,7 @@ async function handleLogin() {
uni.setStorageSync('token', response.token)
uni.setStorageSync('expire', response.expire)
toast.success('登录成功')
toast.success(t('message.loginSuccess'))
// 跳转到主页
setTimeout(() => {
@@ -189,6 +192,10 @@ async function handleLogin() {
catch (error: any) {
// 登录失败重新获取验证码
refreshCaptcha()
// 处理验证码错误 - 从error.message中解析错误码
if (error.message.includes('请求错误[10067]')) {
toast.warning(t('login.captchaError'))
}
}
finally {
loading.value = false
@@ -200,14 +207,26 @@ onLoad(() => {
refreshCaptcha()
})
// 语言切换相关
const showLanguageSheet = ref(false)
const supportedLanguages = getSupportedLanguages()
// 初始化国际化
initI18n()
// 切换语言
function handleLanguageChange(lang: Language) {
changeLanguage(lang)
showLanguageSheet.value = false
}
// 组件挂载时确保配置已加载
onMounted(async () => {
if (!configStore.config.name) {
try {
await configStore.fetchPublicConfig()
}
catch (error) {
console.error('获取配置失败:', error)
} catch (error) {
console.error(t('login.fetchConfigError'), error)
}
}
})
@@ -219,21 +238,25 @@ onMounted(async () => {
<view class="logo-section">
<wd-img :width="80" :height="80" round src="/static/logo.png" class="logo" />
<text class="welcome-text">
欢迎回来
{{ t('login.welcomeBack') }}
</text>
<text class="subtitle">
请登录您的账户
{{ t('login.pleaseLogin') }}
</text>
</view>
</view>
<!-- 右上角服务端设置按钮 -->
<view
class="server-btn"
:style="{ top: `${safeAreaInsets?.top + 10}px` }"
@click="goToServerSetting"
>
<wd-icon name="setting" custom-class="server-icon" />
<!-- 右上角按钮组 -->
<view class="top-right-buttons" :style="{ top: `${safeAreaInsets?.top + 10}px` }">
<!-- 语言切换按钮 -->
<view class="lang-btn" @click="showLanguageSheet = true">
<text class="lang-text-icon">🌐</text>
</view>
<!-- 服务端设置按钮 -->
<view class="server-btn" @click="goToServerSetting">
<wd-icon name="setting" custom-class="server-icon" />
</view>
</view>
<view class="form-container">
@@ -253,7 +276,7 @@ onMounted(async () => {
v-model="formData.mobile"
custom-class="styled-input"
no-border
placeholder="请输入手机号码"
:placeholder="t('login.enterPhone')"
type="number"
:maxlength="11"
/>
@@ -270,7 +293,7 @@ onMounted(async () => {
v-model="formData.username"
custom-class="styled-input"
no-border
placeholder="请输入用户名"
:placeholder="t('login.enterUsername')"
/>
</view>
</view>
@@ -282,7 +305,7 @@ onMounted(async () => {
v-model="formData.password"
custom-class="styled-input"
no-border
placeholder="请输入密码"
:placeholder="t('login.enterPassword')"
clearable
show-password
:maxlength="20"
@@ -296,7 +319,7 @@ onMounted(async () => {
v-model="formData.captcha"
custom-class="styled-input"
no-border
placeholder="请输入验证码"
:placeholder="t('login.enterCaptcha')"
:maxlength="6"
/>
<view class="captcha-image" @click="refreshCaptcha">
@@ -307,7 +330,7 @@ onMounted(async () => {
<view class="forgot-password">
<text class="forgot-text">
忘记密码？
{{ t('login.forgotPassword') }}
</text>
</view>
@@ -315,15 +338,15 @@ onMounted(async () => {
class="login-btn"
@click="handleLogin"
>
{{ loading ? '登录中...' : '登录' }}
{{ loading ? t('login.loggingIn') : t('login.loginButton') }}
</view>
<view class="register-hint">
<text class="hint-text">
还没有账户？
{{ t('login.noAccount') }}
</text>
<text class="register-link" @click="goToRegister">
立即注册
{{ t('login.registerNow') }}
</text>
</view>
@@ -352,7 +375,7 @@ onMounted(async () => {
<!-- 区号选择弹窗 -->
<wd-action-sheet
v-model="showAreaCodeSheet"
title="选择国家/地区"
:title="t('login.selectCountry')"
:close-on-click-modal="true"
@close="closeAreaCodeSheet"
>
@@ -386,11 +409,33 @@ onMounted(async () => {
custom-class="confirm-btn"
@click="closeAreaCodeSheet"
>
确认
{{ t('login.confirm') }}
</wd-button>
</view>
</view>
</wd-action-sheet>
<!-- 语言选择弹窗 -->
<wd-action-sheet
v-model="showLanguageSheet"
:title="t('login.selectLanguage')"
:close-on-click-modal="true"
>
<view class="language-sheet">
<scroll-view scroll-y class="language-list">
<view
v-for="lang in supportedLanguages"
:key="lang.code"
class="language-item"
@click="handleLanguageChange(lang.code)"
>
<text class="language-name">
{{ lang.name }}
</text>
</view>
</scroll-view>
</view>
</wd-action-sheet>
</view>
</template>
@@ -793,20 +838,52 @@ onMounted(async () => {
}
}
}
.server-btn {
// 右上角按钮组
.top-right-buttons {
position: absolute;
right: 20rpx; // 距离右边距
top: 40rpx; // 顶部稍微下移，不贴状态栏
right: 20rpx;
display: flex;
gap: 20rpx;
z-index: 999;
}
// 语言切换按钮
.lang-btn {
width: 48rpx;
height: 48rpx;
display: flex;
align-items: center;
justify-content: center;
z-index: 999;
cursor: pointer;
background: rgba(255, 255, 255, 0.15); // 半透明背景，更好看
border-radius: 24rpx; // 圆形按钮
box-shadow: 0 4rpx 12rpx rgba(0,0,0,0.2); // 阴影
background: rgba(255, 255, 255, 0.15);
border-radius: 24rpx;
box-shadow: 0 4rpx 12rpx rgba(0,0,0,0.2);
&:active {
transform: scale(0.95);
}
.lang-text-icon {
font-size: 28rpx;
color: #FFFFFF;
}
&:hover {
background: rgba(255, 255, 255, 0.25);
}
}
// 服务端设置按钮
.server-btn {
width: 48rpx;
height: 48rpx;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
background: rgba(255, 255, 255, 0.15);
border-radius: 24rpx;
box-shadow: 0 4rpx 12rpx rgba(0,0,0,0.2);
&:active {
transform: scale(0.95);
@@ -814,11 +891,45 @@ onMounted(async () => {
.server-icon {
font-size: 28rpx;
color: #FFFFFF; // 白色图标
color: #FFFFFF;
}
&:hover {
background: rgba(255, 255, 255, 0.25); // 悬停效果
background: rgba(255, 255, 255, 0.25);
}
}
// 语言选择弹窗样式
.language-sheet {
background: #ffffff;
border-radius: 24rpx 24rpx 0 0;
overflow: hidden;
.language-list {
max-height: 60vh;
padding: 0 40rpx;
.language-item {
display: flex;
align-items: center;
padding: 32rpx 0;
border-bottom: 1rpx solid #f8f9fa;
cursor: pointer;
transition: background-color 0.3s ease;
&:hover {
background-color: #f8f9fa;
}
&:last-child {
border-bottom: none;
}
.language-name {
font-size: 32rpx;
color: #333333;
}
}
}
}
</style>
main/manager-mobile/src/pages/register/index.vue
+78 -62
View File
@@ -14,6 +14,8 @@ import { register, sendSmsCode } from '@/api/auth'
import { useConfigStore } from '@/store'
import { getEnvBaseUrl } from '@/utils'
import { toast } from '@/utils/toast'
// 导入国际化相关功能
import { t, initI18n } from '@/i18n'
// 获取屏幕边界到安全区域距离
let safeAreaInsets
@@ -134,18 +136,18 @@ async function refreshCaptcha() {
// 发送短信验证码
async function sendSmsVerification() {
if (!formData.value.mobile) {
toast.warning('请输入手机号')
toast.warning(t('register.enterPhone'))
return
}
if (!formData.value.captcha) {
toast.warning('请输入图形验证码')
toast.warning(t('register.enterCode'))
return
}
// 手机号格式验证
const phoneRegex = /^1[3-9]\d{9}$/
if (!phoneRegex.test(formData.value.mobile)) {
toast.warning('请输入正确的手机号')
toast.warning(t('register.enterPhone'))
return
}
@@ -157,7 +159,7 @@ async function sendSmsVerification() {
captchaId: formData.value.captchaId,
})
toast.success('验证码发送成功')
toast.success(t('message.registerSuccess'))
// 开始倒计时
smsCountdown.value = 60
@@ -169,6 +171,10 @@ async function sendSmsVerification() {
}, 1000)
}
catch (error: any) {
// 处理验证码错误 - 从error.message中解析错误码
if (error.message.includes('请求错误[10067]')) {
toast.warning(t('login.captchaError'))
}
// 发送失败重新获取图形验证码
refreshCaptcha()
}
@@ -182,44 +188,44 @@ async function handleRegister() {
// 表单验证
if (registerType.value === 'username') {
if (!formData.value.username) {
toast.warning('请输入用户名')
toast.warning(t('register.enterUsername'))
return
}
}
else {
if (!formData.value.mobile) {
toast.warning('请输入手机号')
toast.warning(t('register.enterPhone'))
return
}
// 手机号格式验证
const phoneRegex = /^1[3-9]\d{9}$/
if (!phoneRegex.test(formData.value.mobile)) {
toast.warning('请输入正确的手机号')
toast.warning(t('register.enterPhone'))
return
}
if (!formData.value.mobileCaptcha) {
toast.warning('请输入短信验证码')
toast.warning(t('register.enterCode'))
return
}
}
if (!formData.value.password) {
toast.warning('请输入密码')
toast.warning(t('register.enterPassword'))
return
}
if (!formData.value.confirmPassword) {
toast.warning('请确认密码')
toast.warning(t('register.confirmPassword'))
return
}
if (formData.value.password !== formData.value.confirmPassword) {
toast.warning('两次输入的密码不一致')
toast.warning(t('register.confirmPassword'))
return
}
if (!formData.value.captcha) {
toast.warning('请输入验证码')
toast.warning(t('register.enterCode'))
return
}
@@ -239,7 +245,7 @@ async function handleRegister() {
}
await register(registerData)
toast.success('注册成功')
toast.success(t('message.registerSuccess'))
// 跳转到登录页
setTimeout(() => {
@@ -247,6 +253,10 @@ async function handleRegister() {
}, 1000)
}
catch (error: any) {
// 处理验证码错误 - 从error.message中解析错误码
if (error.message.includes('请求错误[10067]')) {
toast.warning(t('login.captchaError'))
}
// 注册失败重新获取验证码
refreshCaptcha()
}
@@ -275,7 +285,11 @@ onMounted(async () => {
console.error('获取配置失败:', error)
}
}
// 初始化国际化
initI18n()
})
</script>
<template>
@@ -287,10 +301,10 @@ onMounted(async () => {
<view class="logo-section">
<wd-img :width="80" :height="80" round src="/static/logo.png" class="logo" />
<text class="welcome-text">
欢迎注册
{{ t('register.pageTitle') }}
</text>
<text class="subtitle">
创建您的新账户
{{ t('register.createAccount') }}
</text>
</view>
</view>
@@ -312,7 +326,7 @@ onMounted(async () => {
v-model="formData.mobile"
custom-class="styled-input"
no-border
placeholder="请输入手机号码"
:placeholder="t('register.enterPhone')"
type="number"
:maxlength="11"
/>
@@ -329,7 +343,7 @@ onMounted(async () => {
v-model="formData.username"
custom-class="styled-input"
no-border
placeholder="请输入用户名"
:placeholder="t('register.enterUsername')"
/>
</view>
</view>
@@ -338,41 +352,41 @@ onMounted(async () => {
<view class="input-group">
<view class="input-wrapper">
<wd-input
v-model="formData.password"
custom-class="styled-input"
no-border
placeholder="请输入密码"
show-password
:maxlength="20"
/>
</view>
v-model="formData.password"
custom-class="styled-input"
no-border
:placeholder="t('register.enterPassword')"
show-password
:maxlength="20"
/>
</view>
</view>
<view class="input-group">
<view class="input-wrapper">
<wd-input
v-model="formData.confirmPassword"
custom-class="styled-input"
no-border
placeholder="请确认密码"
show-password
:maxlength="20"
/>
</view>
v-model="formData.confirmPassword"
custom-class="styled-input"
no-border
:placeholder="t('register.confirmPassword')"
show-password
:maxlength="20"
/>
</view>
</view>
<view class="input-group">
<view class="input-wrapper captcha-wrapper">
<wd-input
v-model="formData.captcha"
custom-class="styled-input"
no-border
placeholder="请输入验证码"
:maxlength="6"
/>
<view class="captcha-image" @click="refreshCaptcha">
<image :src="captchaImage" class="captcha-img" />
</view>
v-model="formData.captcha"
custom-class="styled-input"
no-border
:placeholder="t('register.enterCode')"
:maxlength="6"
/>
<view class="captcha-image" @click="refreshCaptcha">
<image :src="captchaImage" class="captcha-img" />
</view>
</view>
</view>
@@ -380,21 +394,21 @@ onMounted(async () => {
<view v-if="registerType === 'mobile'" class="input-group">
<view class="input-wrapper sms-wrapper">
<wd-input
v-model="formData.mobileCaptcha"
custom-class="styled-input"
no-border
placeholder="请输入短信验证码"
type="number"
:maxlength="6"
/>
<wd-button
:loading="smsLoading"
:disabled="smsCountdown > 0"
custom-class="sms-btn"
@click="sendSmsVerification"
>
{{ smsCountdown > 0 ? `${smsCountdown}s` : '获取验证码' }}
</wd-button>
v-model="formData.mobileCaptcha"
custom-class="styled-input"
no-border
:placeholder="t('register.enterCode')"
type="number"
:maxlength="6"
/>
<wd-button
:loading="smsLoading"
:disabled="smsCountdown > 0"
custom-class="sms-btn"
@click="sendSmsVerification"
>
{{ smsCountdown > 0 ? `${smsCountdown}s` : t('register.getCode') }}
</wd-button>
</view>
</view>
@@ -404,15 +418,15 @@ onMounted(async () => {
:loading="loading"
@click="handleRegister"
>
{{ loading ? '注册中...' : '注册' }}
{{ loading ? t('register.registering') : t('register.registerButton') }}
</view>
<view class="login-hint">
<text class="hint-text">
已有账户？
{{ t('register.haveAccount') }}
</text>
<text class="login-link" @click="goBack">
立即登录
{{ t('register.loginNow') }}
</text>
</view>
@@ -441,7 +455,7 @@ onMounted(async () => {
<!-- 区号选择弹窗 -->
<wd-action-sheet
v-model="showAreaCodeSheet"
title="选择国家/地区"
:title="t('register.selectCountry')"
:close-on-click-modal="true"
@close="closeAreaCodeSheet"
>
@@ -475,11 +489,13 @@ onMounted(async () => {
custom-class="confirm-btn"
@click="closeAreaCodeSheet"
>
确认
{{ t('register.confirm') }}
</wd-button>
</view>
</view>
</wd-action-sheet>
</view>
</template>
main/manager-mobile/src/pages/settings/index.vue
+149 -56
View File
@@ -11,6 +11,8 @@ import { clearServerBaseUrlOverride, getEnvBaseUrl, getServerBaseUrlOverride, se
import { isMp } from '@/utils/platform'
import { computed, onMounted, reactive, ref } from 'vue'
import { useToast } from 'wot-design-uni'
import { t, changeLanguage, getSupportedLanguages, getCurrentLanguage } from '@/i18n'
import type { Language } from '@/store/lang'
defineOptions({
name: 'SettingsPage',
@@ -62,7 +64,7 @@ function validateUrl() {
}
if (!/^https?:\/\/.+\/xiaozhi$/.test(baseUrlInput.value)) {
urlError.value = '请输入有效的服务端地址（以 http 或 https 开头，并以 /xiaozhi 结尾）'
urlError.value = t('settings.validServerUrl')
}
}
@@ -85,12 +87,12 @@ async function testServerBaseUrl() {
if (response.statusCode === 200) {
return true
} else {
toast.error('无效地址，请检查服务端是否启动或网络连接是否正常')
toast.error(t('message.invalidAddress'))
return false
}
} catch (error) {
console.error('测试服务端地址失败:', error)
toast.error('无效地址，请检查服务端是否启动或网络连接是否正常')
toast.error(t('message.invalidAddress'))
return false
}
}
@@ -98,7 +100,7 @@ async function testServerBaseUrl() {
// 保存服务端地址
async function saveServerBaseUrl() {
if (!baseUrlInput.value || !/^https?:\/\/.+\/xiaozhi$/.test(baseUrlInput.value)) {
toast.warning('请输入有效的服务端地址（以 http 或 https 开头，并以 /xiaozhi 结尾）')
toast.warning(t('settings.validServerUrl'))
return
}
@@ -113,21 +115,32 @@ async function saveServerBaseUrl() {
clearAllCacheAfterUrlChange()
uni.showModal({
title: '重启应用',
content: '服务端地址已保存并清空缓存，是否立即重启生效？',
confirmText: '立即重启',
cancelText: '稍后',
title: t('settings.restartApp'),
content: t('settings.serverUrlSavedAndCacheCleared'),
confirmText: t('settings.restartNow'),
cancelText: t('settings.restartLater'),
success: (res) => {
if (res.confirm) {
restartApp()
}
else {
toast.success('已保存，可稍后手动重启应用')
toast.success(t('settings.restartSuccess'))
}
},
})
}
// 语言切换
const supportedLanguages = getSupportedLanguages()
const currentLanguage = ref<Language>(getCurrentLanguage())
const showLanguageSheet = ref(false)
function handleLanguageChange(lang: Language) {
changeLanguage(lang)
showLanguageSheet.value = false
toast.success(t('settings.languageChanged'))
}
// 重置为 env 默认
function resetServerBaseUrl() {
clearServerBaseUrlOverride()
@@ -137,16 +150,16 @@ function resetServerBaseUrl() {
clearAllCacheAfterUrlChange()
uni.showModal({
title: '重启应用',
content: '已重置为默认地址并清空缓存，是否立即重启生效？',
confirmText: '立即重启',
cancelText: '稍后',
title: t('settings.restartApp'),
content: t('settings.resetToDefaultAndCacheCleared'),
confirmText: t('settings.restartNow'),
cancelText: t('settings.restartLater'),
success: (res) => {
if (res.confirm) {
restartApp()
}
else {
toast.success('已重置，可稍后手动重启应用')
toast.success(t('settings.resetSuccess'))
}
},
})
@@ -185,8 +198,7 @@ function clearAllCacheAfterUrlChange() {
// 重新获取缓存信息
getCacheInfo()
}
catch (error) {
} catch (error) {
console.error('清除缓存失败:', error)
}
}
@@ -195,12 +207,14 @@ function clearAllCacheAfterUrlChange() {
async function clearCache() {
try {
uni.showModal({
title: '确认清除',
content: '确定要清除所有缓存吗？这将删除所有数据包括登录状态，需要重新登录。',
title: t('settings.confirmClear'),
content: t('settings.confirmClearMessage'),
confirmText: t('common.confirm'),
cancelText: t('common.cancel'),
success: (res) => {
if (res.confirm) {
clearAllCacheAfterUrlChange()
toast.success('缓存清除成功，即将跳转到登录页')
toast.success(t('settings.cacheCleared'))
// 延迟跳转到登录页
setTimeout(() => {
@@ -209,22 +223,22 @@ async function clearCache() {
}
},
})
}
catch (error) {
} catch (error) {
console.error('清除缓存失败:', error)
toast.error('清除缓存失败')
toast.error(t('settings.clearCacheFailed'))
}
}
// 关于我们
function showAbout() {
uni.showModal({
title: `关于${import.meta.env.VITE_APP_TITLE}`,
content: `${import.meta.env.VITE_APP_TITLE}\n\n基于 Vue.js 3 + uni-app 构建的跨平台移动端管理应用，为小智ESP32智能硬件提供设备管理、智能体配置等功能。\n\n© 2025 xiaozhi-esp32-server`,
title: `关于小智智控台`,
content: `小智智控台\n\n基于 Vue.js 3 + uni-app 构建的跨平台移动端管理应用，为小智ESP32智能硬件提供设备管理、智能体配置等功能。\n\n© 2025 xiaozhi-esp32-server 0.8.3`,
title: t('settings.aboutApp', { appName: import.meta.env.VITE_APP_TITLE }),
content: t('settings.aboutContent', {
appName: import.meta.env.VITE_APP_TITLE,
version: '0.8.3'
}),
showCancel: false,
confirmText: '确定',
confirmText: t('common.confirm'),
})
}
@@ -234,19 +248,24 @@ onMounted(async () => {
loadServerBaseUrl()
}
getCacheInfo()
// 动态设置导航栏标题为国际化文本
uni.setNavigationBarTitle({
title: t('settings.title')
})
})
</script>
<template>
<view class="min-h-screen bg-[#f5f7fb]">
<wd-navbar title="设置" placeholder safe-area-inset-top fixed />
<wd-navbar :title="t('settings.title')" placeholder safe-area-inset-top fixed />
<view class="p-[24rpx]">
<!-- 网络设置 - 仅在非小程序环境显示 -->
<view v-if="!isMp" class="mb-[32rpx]">
<view class="mb-[24rpx] flex items-center">
<text class="text-[32rpx] text-[#232338] font-bold">
网络设置
{{ t('settings.networkSettings') }}
</text>
</view>
@@ -254,19 +273,19 @@ onMounted(async () => {
style="box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.06);">
<view class="mb-[24rpx]">
<text class="text-[28rpx] text-[#232338] font-semibold">
服务端接口地址
{{ t('settings.serverApiUrl') }}
</text>
<text class="mt-[8rpx] block text-[24rpx] text-[#9d9ea3]">
修改后将自动清空缓存并重启应用
{{ t('settings.modifyWillClearCache') }}
</text>
</view>
<view class="mb-[24rpx]">
<view class="w-full rounded-[16rpx] border border-[#eeeeee] bg-[#f5f7fb] overflow-hidden">
<wd-input v-model="baseUrlInput" type="text" clearable :maxlength="200"
placeholder="输入服务端地址，如 https://example.com/xiaozhi"
custom-class="!border-none !bg-transparent h-[88rpx] px-[24rpx] items-center"
input-class="text-[28rpx] text-[#232338]" @input="validateUrl" @blur="validateUrl" />
:placeholder="t('settings.enterServerUrl')"
custom-class="!border-none !bg-transparent h-[64rpx] px-[24rpx] items-center"
input-class="text-[28rpx] text-[#232338]" @input="validateUrl" @blur="validateUrl" />
</view>
<text v-if="urlError" class="mt-[8rpx] block text-[24rpx] text-[#ff4d4f]">
{{ urlError }}
@@ -277,12 +296,12 @@ onMounted(async () => {
<wd-button type="primary"
custom-class="flex-1 h-[88rpx] rounded-[20rpx] text-[28rpx] font-semibold bg-[#336cff] border-none shadow-[0_4rpx_16rpx_rgba(51,108,255,0.3)] active:shadow-[0_2rpx_8rpx_rgba(51,108,255,0.4)] active:scale-98"
@click="saveServerBaseUrl">
保存设置
{{ t('settings.saveSettings') }}
</wd-button>
<wd-button type="default"
custom-class="flex-1 h-[88rpx] rounded-[20rpx] text-[28rpx] font-semibold bg-white border-[#eeeeee] text-[#65686f] active:bg-[#f5f7fb]"
@click="resetServerBaseUrl">
恢复默认
{{ t('settings.resetDefault') }}
</wd-button>
</view>
</view>
@@ -292,7 +311,7 @@ onMounted(async () => {
<view class="mb-[32rpx]">
<view class="mb-[24rpx] flex items-center">
<text class="text-[32rpx] text-[#232338] font-bold">
缓存管理
{{ t('settings.cacheManagement') }}
</text>
</view>
@@ -304,11 +323,11 @@ onMounted(async () => {
class="flex items-center justify-between border border-[#eeeeee] rounded-[16rpx] bg-[#f5f7fb] p-[24rpx] transition-all active:bg-[#eef3ff]">
<view>
<text class="text-[28rpx] text-[#232338] font-medium">
总缓存大小
</text>
<text class="mt-[4rpx] block text-[24rpx] text-[#9d9ea3]">
应用数据总大小
</text>
{{ t('settings.totalCacheSize') }}
</text>
<text class="mt-[4rpx] block text-[24rpx] text-[#9d9ea3]">
{{ t('settings.appDataSize') }}
</text>
</view>
<text class="text-[28rpx] text-[#65686f] font-semibold">
{{ cacheInfo.storageSize }}
@@ -320,16 +339,16 @@ onMounted(async () => {
class="flex items-center justify-between border border-[#eeeeee] rounded-[16rpx] bg-[#f5f7fb] p-[24rpx]">
<view>
<text class="text-[28rpx] text-[#232338] font-medium">
缓存清理
</text>
<text class="mt-[4rpx] block text-[24rpx] text-[#9d9ea3]">
清空所有缓存数据
</text>
{{ t('settings.cacheClear') }}
</text>
<text class="mt-[4rpx] block text-[24rpx] text-[#9d9ea3]">
{{ t('settings.clearAllCache') }}
</text>
</view>
<view
class="cursor-pointer rounded-[24rpx] bg-[rgba(255,107,107,0.1)] px-[28rpx] py-[16rpx] text-[24rpx] text-[#ff6b6b] font-semibold transition-all duration-300 active:scale-95 active:bg-[#ff6b6b] active:text-white"
@click="clearCache">
清除缓存
{{ t('settings.clearCache') }}
</view>
</view>
</view>
@@ -340,8 +359,8 @@ onMounted(async () => {
<view class="mb-[32rpx]">
<view class="mb-[24rpx] flex items-center">
<text class="text-[32rpx] text-[#232338] font-bold">
应用信息
</text>
{{ t('settings.appInfo') }}
</text>
</view>
<view class="border border-[#eeeeee] rounded-[24rpx] bg-[#fbfbfb] p-[32rpx]"
@@ -351,17 +370,68 @@ onMounted(async () => {
@click="showAbout">
<view>
<text class="text-[28rpx] text-[#232338] font-medium">
关于我们
</text>
<text class="mt-[4rpx] block text-[24rpx] text-[#9d9ea3]">
应用版本与团队信息
</text>
{{ t('settings.aboutUs') }}
</text>
<text class="mt-[4rpx] block text-[24rpx] text-[#9d9ea3]">
{{ t('settings.appVersion') }}
</text>
</view>
<wd-icon name="arrow-right" custom-class="text-[32rpx] text-[#9d9ea3]" />
</view>
</view>
</view>
<!-- 语言设置 -->
<view class="mb-[32rpx]">
<view class="mb-[24rpx] flex items-center">
<text class="text-[32rpx] text-[#232338] font-bold">
{{ t('settings.languageSettings') }}
</text>
</view>
<view class="border border-[#eeeeee] rounded-[24rpx] bg-[#fbfbfb] p-[32rpx]"
style="box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.06);">
<view class="flex cursor-pointer items-center justify-between border border-[#eeeeee] rounded-[16rpx] bg-[#f5f7fb] p-[24rpx] transition-all active:bg-[#eef3ff]" @click="showLanguageSheet = true">
<view>
<text class="text-[32rpx] text-[#232338] font-medium">
{{ t('settings.language') }}
</text>
<text class="mt-[4rpx] block text-[24rpx] text-[#9d9ea3]">
{{ t('settings.selectLanguage') }}
</text>
</view>
<view class="flex items-center">
<text class="text-[32rpx] text-[#9d9ea3] font-semibold mr-[16rpx]">
{{ supportedLanguages.find(lang => lang.code === currentLanguage.value)?.name }}
</text>
<wd-icon name="arrow-right" custom-class="text-[32rpx] text-[#9d9ea3]" />
</view>
</view>
</view>
</view>
<!-- 语言选择弹窗 -->
<wd-action-sheet
v-model="showLanguageSheet"
:title="t('settings.selectLanguage')"
:close-on-click-modal="true"
>
<view class="language-sheet">
<scroll-view scroll-y class="language-list">
<view
v-for="lang in supportedLanguages"
:key="lang.code"
class="language-item"
@click="handleLanguageChange(lang.code)"
>
<text class="language-name">
{{ lang.name }}
</text>
</view>
</scroll-view>
</view>
</wd-action-sheet>
<!-- 底部安全距离 -->
<!-- 底部安全距离 -->
<view style="height: env(safe-area-inset-bottom);" />
@@ -370,4 +440,27 @@ onMounted(async () => {
</template>
<style lang="scss" scoped>
// 保持与 edit.vue 一致的风格，样式主要通过类名控制</style>
// 保持与 edit.vue 一致的风格，样式主要通过类名控制
// 语言选择弹窗样式
.language-sheet {
.language-list {
max-height: 50vh;
.language-item {
padding: 30rpx 0;
text-align: center;
border-bottom: 1rpx solid #f0f0f0;
.language-name {
font-size: 28rpx;
color: #333;
}
&:last-child {
border-bottom: none;
}
&:active {
background-color: #f5f7fb;
}
}
}
}
</style>
main/manager-mobile/src/pages/voiceprint/index.vue
+74 -50
View File
@@ -4,6 +4,7 @@ import { computed, onMounted, ref } from 'vue'
import { useMessage } from 'wot-design-uni'
import { useToast } from 'wot-design-uni/components/wd-toast'
import { createVoicePrint, deleteVoicePrint, getChatHistory, getVoicePrintList, updateVoicePrint } from '@/api/voiceprint'
import { t } from '@/i18n'
defineOptions({
name: 'VoicePrintManage',
@@ -81,7 +82,7 @@ async function loadVoicePrintList() {
// 检查是否有当前选中的智能体
if (!currentAgentId.value) {
console.warn('没有选中的智能体')
console.warn(t('voiceprint.noSelectedAgent'))
voicePrintList.value = []
return
}
@@ -117,7 +118,7 @@ async function refresh() {
async function loadChatHistory() {
try {
if (!currentAgentId.value) {
toast.error('请先选择智能体')
toast.error(t('voiceprint.pleaseSelectAgent'))
return
}
@@ -133,24 +134,47 @@ async function loadChatHistory() {
}
catch (error) {
console.error('获取对话记录失败:', error)
toast.error('获取对话记录失败')
toast.error(t('voiceprint.fetchHistoryFailed'))
}
}
// 打开添加弹窗
function openAddDialog() {
if (!currentAgentId.value) {
toast.error('请先选择智能体')
toast.error(t('voiceprint.pleaseSelectAgent'))
return
}
addForm.value = {
agentId: currentAgentId.value,
audioId: '',
sourceName: '',
introduce: '',
// 检查声纹接口是否配置（通过尝试获取声纹列表来检测）
const checkVoicePrintConfig = async () => {
try {
await getVoicePrintList(currentAgentId.value)
// 接口正常，继续打开添加弹窗
addForm.value = {
agentId: currentAgentId.value,
audioId: '',
sourceName: '',
introduce: '',
}
showAddDialog.value = true
} catch (error: any) {
// 捕捉声纹接口未配置错误
if (error.message && error.message.includes('请求错误[10054]')) {
toast.error(t('voiceprint.voiceprintInterfaceNotConfigured'))
} else {
// 其他错误，继续打开弹窗
addForm.value = {
agentId: currentAgentId.value,
audioId: '',
sourceName: '',
introduce: '',
}
showAddDialog.value = true
}
}
}
showAddDialog.value = true
checkVoicePrintConfig()
}
// 打开编辑弹窗
@@ -162,7 +186,7 @@ function openEditDialog(item: VoicePrint) {
// 获取选中音频的显示内容
function getSelectedAudioContent(audioId: string) {
if (!audioId)
return '点击选择声纹向量'
return t('voiceprint.clickToSelectVector')
const chatItem = chatHistoryList.value.find(item => item.audioId === audioId)
return chatItem ? chatItem.content : `已选择: ${audioId.substring(0, 8)}...`
}
@@ -181,34 +205,34 @@ function selectAudioId({ item }: { item: any }) {
// 提交添加说话人
async function submitAdd() {
if (!addForm.value.sourceName.trim()) {
toast.error('请输入姓名')
toast.error(t('voiceprint.pleaseInputName'))
return
}
if (!addForm.value.audioId) {
toast.error('请选择声纹向量')
toast.error(t('voiceprint.pleaseSelectVector'))
return
}
try {
await createVoicePrint(addForm.value)
toast.success('添加成功')
toast.success(t('voiceprint.addSuccess'))
showAddDialog.value = false
await loadVoicePrintList()
}
catch (error) {
console.error('添加说话人失败:', error)
toast.error('添加说话人失败')
toast.error(t('voiceprint.addFailed'))
}
}
// 提交编辑说话人
async function submitEdit() {
if (!editForm.value.sourceName.trim()) {
toast.error('请输入姓名')
toast.error(t('voiceprint.pleaseInputName'))
return
}
if (!editForm.value.audioId) {
toast.error('请选择声纹向量')
toast.error(t('voiceprint.pleaseSelectVector'))
return
}
@@ -220,13 +244,13 @@ async function submitEdit() {
introduce: editForm.value.introduce,
createDate: editForm.value.createDate,
})
toast.success('编辑成功')
toast.success(t('voiceprint.editSuccess'))
showEditDialog.value = false
await loadVoicePrintList()
}
catch (error) {
console.error('编辑说话人失败:', error)
toast.error('编辑说话人失败')
toast.error(t('voiceprint.editFailed'))
}
}
@@ -239,11 +263,11 @@ function handleEdit(item: VoicePrint) {
// 删除声纹
async function handleDelete(id: string) {
message.confirm({
msg: '确定要删除这个说话人吗？',
title: '确认删除',
msg: t('voiceprint.deleteConfirmMsg'),
title: t('voiceprint.deleteConfirmTitle'),
}).then(async () => {
await deleteVoicePrint(id)
toast.success('删除成功')
toast.success(t('voiceprint.deleteSuccess'))
await loadVoicePrintList()
}).catch(() => {
console.log('点击了取消按钮')
@@ -268,7 +292,7 @@ defineExpose({
<view v-if="loading && voicePrintList.length === 0" class="loading-container">
<wd-loading color="#336cff" />
<text class="loading-text">
加载中...
{{ t('voiceprint.loading') }}
</text>
</view>
@@ -302,7 +326,7 @@ defineExpose({
@click="handleDelete(item.id)"
>
<wd-icon name="delete" />
删除
{{ t('voiceprint.delete') }}
</view>
</view>
</template>
@@ -315,11 +339,11 @@ defineExpose({
<view v-else-if="!loading" class="empty-container">
<view class="flex flex-col items-center justify-center p-[100rpx_40rpx] text-center">
<wd-icon name="voice" custom-class="text-[120rpx] text-[#d9d9d9] mb-[32rpx]" />
<text class="mb-[16rpx] text-[32rpx] text-[#666666] font-medium">
暂无声纹数据
<text class="mb-[32rpx] text-[32rpx] text-[#666666] font-medium">
{{ t('voiceprint.emptyTitle') }}
</text>
<text class="text-[26rpx] text-[#999999] leading-[1.5]">
点击右下角 + 号添加您的第一个说话人
{{ t('voiceprint.emptyDesc') }}
</text>
</view>
</view>
@@ -341,7 +365,7 @@ defineExpose({
<view>
<view class="w-full flex items-center justify-between border-b-[2rpx] border-[#eeeeee] p-[32rpx_32rpx_24rpx]">
<text class="w-full text-center text-[32rpx] text-[#232338] font-semibold">
添加说话人
{{ t('voiceprint.addSpeaker') }}
</text>
</view>
@@ -349,7 +373,7 @@ defineExpose({
<!-- 声纹向量选择 -->
<view class="mb-[32rpx]">
<text class="mb-[16rpx] block text-[28rpx] text-[#232338] font-medium">
* 声纹向量
* {{ t('voiceprint.voiceVector') }}
</text>
<view
class="flex cursor-pointer items-center justify-between border-[1rpx] border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[20rpx] transition-all duration-300 active:bg-[#eef3ff]"
@@ -368,22 +392,22 @@ defineExpose({
<!-- 姓名 -->
<view class="mb-[32rpx]">
<text class="mb-[16rpx] block text-[28rpx] text-[#232338] font-medium">
* 姓名
* {{ t('voiceprint.name') }}
</text>
<input
v-model="addForm.sourceName"
class="box-border h-[80rpx] w-full border-[1rpx] border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[16rpx_20rpx] text-[28rpx] text-[#232338] leading-[1.4] outline-none focus:border-[#336cff] focus:bg-white placeholder:text-[#9d9ea3]"
type="text" placeholder="请输入姓名"
type="text" :placeholder="t('voiceprint.pleaseInputName')"
>
</view>
<!-- 描述 -->
<view>
<text class="mb-[16rpx] block text-[28rpx] text-[#232338] font-medium">
* 描述
* {{ t('voiceprint.description') }}
</text>
<textarea
v-model="addForm.introduce" :maxlength="100" placeholder="请输入描述"
v-model="addForm.introduce" :maxlength="100" :placeholder="t('voiceprint.pleaseInputDescription')"
class="box-border h-[200rpx] w-full resize-none border-[1rpx] border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[20rpx] text-[26rpx] text-[#232338] leading-[1.6] outline-none focus:border-[#336cff] focus:bg-white placeholder:text-[#9d9ea3]"
/>
<view class="mt-[8rpx] text-right text-[22rpx] text-[#9d9ea3]">
@@ -394,11 +418,11 @@ defineExpose({
<view class="flex gap-[16rpx] border-t-[2rpx] border-[#eeeeee] p-[24rpx_32rpx_32rpx]">
<wd-button type="info" custom-class="flex-1" @click="showAddDialog = false">
取消
</wd-button>
<wd-button type="primary" custom-class="flex-1" @click="submitAdd">
保存
</wd-button>
{{ t('voiceprint.cancel') }}
</wd-button>
<wd-button type="primary" custom-class="flex-1" @click="submitAdd">
{{ t('voiceprint.save') }}
</wd-button>
</view>
</view>
</wd-popup>
@@ -411,7 +435,7 @@ defineExpose({
<view>
<view class="w-full flex items-center justify-between border-b-[2rpx] border-[#eeeeee] p-[32rpx_32rpx_24rpx]">
<text class="w-full text-center text-[32rpx] text-[#232338] font-semibold">
编辑说话人
{{ t('voiceprint.editSpeaker') }}
</text>
</view>
@@ -419,7 +443,7 @@ defineExpose({
<!-- 声纹向量选择 -->
<view class="mb-[32rpx]">
<text class="mb-[16rpx] block text-[28rpx] text-[#232338] font-medium">
* 声纹向量
* {{ t('voiceprint.voiceVector') }}
</text>
<view
class="flex cursor-pointer items-center justify-between border-[1rpx] border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[20rpx] transition-all duration-300 active:bg-[#eef3ff]"
@@ -438,22 +462,22 @@ defineExpose({
<!-- 姓名 -->
<view class="mb-[32rpx]">
<text class="mb-[16rpx] block text-[28rpx] text-[#232338] font-medium">
* 姓名
* {{ t('voiceprint.name') }}
</text>
<input
v-model="editForm.sourceName"
class="box-border h-[80rpx] w-full border-[1rpx] border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[16rpx_20rpx] text-[28rpx] text-[#232338] leading-[1.4] outline-none focus:border-[#336cff] focus:bg-white placeholder:text-[#9d9ea3]"
type="text" placeholder="请输入姓名"
type="text" :placeholder="t('voiceprint.pleaseInputName')"
>
</view>
<!-- 描述 -->
<view>
<text class="mb-[16rpx] block text-[28rpx] text-[#232338] font-medium">
* 描述
* {{ t('voiceprint.description') }}
</text>
<textarea
v-model="editForm.introduce" :maxlength="100" placeholder="请输入描述"
v-model="editForm.introduce" :maxlength="100" :placeholder="t('voiceprint.pleaseInputDescription')"
class="box-border h-[200rpx] w-full resize-none border-[1rpx] border-[#eeeeee] rounded-[12rpx] bg-[#f5f7fb] p-[20rpx] text-[26rpx] text-[#232338] leading-[1.6] outline-none focus:border-[#336cff] focus:bg-white placeholder:text-[#9d9ea3]"
/>
<view class="mt-[8rpx] text-right text-[22rpx] text-[#9d9ea3]">
@@ -464,18 +488,18 @@ defineExpose({
<view class="flex gap-[16rpx] border-t-[2rpx] border-[#eeeeee] p-[24rpx_32rpx_32rpx]">
<wd-button type="info" custom-class="flex-1" @click="showEditDialog = false">
取消
</wd-button>
<wd-button type="primary" custom-class="flex-1" @click="submitEdit">
保存
</wd-button>
{{ t('voiceprint.cancel') }}
</wd-button>
<wd-button type="primary" custom-class="flex-1" @click="submitEdit">
{{ t('voiceprint.save') }}
</wd-button>
</view>
</view>
</wd-popup>
<!-- 语音对话记录选择动作面板 -->
<wd-action-sheet
v-model="showChatHistoryDialog" :actions="chatHistoryActions" title="选择声纹向量"
v-model="showChatHistoryDialog" :actions="chatHistoryActions" :title="t('voiceprint.selectVector')"
@select="selectAudioId"
/>
</template>