fix: 修复设备配网成功没有自动退出配网模式

This commit is contained in:
zhuoqinglian
2026-04-24 14:35:34 +08:00
parent f5ce755fea
commit a92d6ccdfb
2 changed files with 94 additions and 89 deletions
@@ -1,7 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
import { computed, ref } from 'vue' import { computed, ref } from 'vue'
import { useToast } from 'wot-design-uni'
import { t } from '@/i18n' import { t } from '@/i18n'
import { toast } from '@/utils/toast'
// 类型定义 // 类型定义
interface WiFiNetwork { interface WiFiNetwork {
@@ -19,9 +19,6 @@ interface Props {
const props = defineProps<Props>() const props = defineProps<Props>()
// Toast 实例
const toast = useToast()
// 响应式数据 // 响应式数据
const configuring = ref(false) const configuring = ref(false)
@@ -45,7 +42,7 @@ async function checkESP32Connection() {
return response.statusCode === 200 return response.statusCode === 200
} }
catch (error) { catch (error) {
console.log(t('deviceConfig.esp32ConnectionCheckFailed') + ':', error) console.log(`${t('deviceConfig.esp32ConnectionCheckFailed')}:`, error)
return false return false
} }
} }
@@ -58,12 +55,12 @@ async function submitConfig() {
// 检查ESP32连接 // 检查ESP32连接
const connected = await checkESP32Connection() const connected = await checkESP32Connection()
if (!connected) { if (!connected) {
toast.error(t('deviceConfig.connectXiaozhiHotspot')) toast.error(t('deviceConfig.connectXiaozhiHotspot'))
return return
} }
configuring.value = true configuring.value = true
console.log(t('deviceConfig.startWifiConfig') + ':', props.selectedNetwork.ssid) console.log(`${t('deviceConfig.startWifiConfig')}:`, props.selectedNetwork.ssid)
try { try {
const response = await uni.request({ const response = await uni.request({
@@ -83,6 +80,14 @@ async function submitConfig() {
if (response.statusCode === 200 && (response.data as any)?.success) { if (response.statusCode === 200 && (response.data as any)?.success) {
toast.success(`${t('deviceConfig.configSuccess')}${t('deviceConfig.deviceWillConnectTo')} ${props.selectedNetwork.ssid}${t('deviceConfig.deviceWillRestart')}${t('deviceConfig.pleaseDisconnectXiaozhiHotspot')}`) toast.success(`${t('deviceConfig.configSuccess')}${t('deviceConfig.deviceWillConnectTo')} ${props.selectedNetwork.ssid}${t('deviceConfig.deviceWillRestart')}${t('deviceConfig.pleaseDisconnectXiaozhiHotspot')}`)
// 设备退出配网模式
setTimeout(() => {
uni.request({
url: 'http://192.168.4.1/exit',
method: 'POST',
timeout: 15000,
})
}, 1500)
} }
else { else {
const errorMsg = (response.data as any)?.error || t('deviceConfig.configFailed') const errorMsg = (response.data as any)?.error || t('deviceConfig.configFailed')
@@ -90,8 +95,8 @@ async function submitConfig() {
} }
} }
catch (error) { catch (error) {
console.error(t('deviceConfig.wifiConfigFailed') + ':', error) console.error(`${t('deviceConfig.wifiConfigFailed')}:`, error)
toast.error(`${t('deviceConfig.configFailed')}${t('deviceConfig.pleaseCheckNetworkConnection')}`) toast.error(`${t('deviceConfig.configFailed')}${t('deviceConfig.pleaseCheckNetworkConnection')}`)
} }
finally { finally {
configuring.value = false configuring.value = false
@@ -134,9 +139,9 @@ async function submitConfig() {
<!-- 使用说明 --> <!-- 使用说明 -->
<view class="help-section"> <view class="help-section">
<view class="help-title"> <view class="help-title">
{{ t('deviceConfig.wifiConfigInstructions') }} {{ t('deviceConfig.wifiConfigInstructions') }}
</view> </view>
<view class="help-content"> <view class="help-content">
<text class="help-item"> <text class="help-item">
1. {{ t('deviceConfig.phoneConnectXiaozhiHotspot') }} (xiaozhi-XXXXXX) 1. {{ t('deviceConfig.phoneConnectXiaozhiHotspot') }} (xiaozhi-XXXXXX)
@@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import { computed, defineEmits, defineExpose, onMounted, ref } from 'vue' import { computed, onMounted, ref } from 'vue'
import { useToast } from 'wot-design-uni' import { useToast } from 'wot-design-uni'
import { t } from '@/i18n' import { t } from '@/i18n'
@@ -71,9 +71,9 @@ async function checkESP32Connection() {
// 扫描WiFi网络 // 扫描WiFi网络
async function scanWifi() { async function scanWifi() {
if (!isConnectedToESP32.value) { if (!isConnectedToESP32.value) {
toast.error(t('deviceConfig.connectXiaozhiHotspot')) toast.error(t('deviceConfig.connectXiaozhiHotspot'))
return return
} }
scanning.value = true scanning.value = true
console.log('开始扫描WiFi网络') console.log('开始扫描WiFi网络')
@@ -85,7 +85,7 @@ async function scanWifi() {
timeout: 10000, timeout: 10000,
}) })
console.log(t('deviceConfig.wifiScanResponse') + ':', response) console.log(`${t('deviceConfig.wifiScanResponse')}:`, response)
if (response.statusCode === 200 && response.data) { if (response.statusCode === 200 && response.data) {
const data = response.data as any const data = response.data as any
@@ -121,8 +121,8 @@ async function scanWifi() {
} }
} }
catch (error) { catch (error) {
console.error(t('deviceConfig.wifiScanFailed') + ':', error) console.error(`${t('deviceConfig.wifiScanFailed')}:`, error)
toast.error(t('deviceConfig.scanFailedCheckConnection')) toast.error(t('deviceConfig.scanFailedCheckConnection'))
} }
finally { finally {
scanning.value = false scanning.value = false
@@ -135,9 +135,9 @@ async function showNetworkSelector() {
await checkESP32Connection() await checkESP32Connection()
if (!isConnectedToESP32.value) { if (!isConnectedToESP32.value) {
toast.error(t('deviceConfig.connectXiaozhiHotspot')) toast.error(t('deviceConfig.connectXiaozhiHotspot'))
return return
} }
selectorExpanded.value = true selectorExpanded.value = true
@@ -223,73 +223,73 @@ onMounted(() => {
<!-- Xiaozhi连接状态 --> <!-- Xiaozhi连接状态 -->
<view v-if="props.autoConnect" class="connection-status"> <view v-if="props.autoConnect" class="connection-status">
<view v-if="!isConnectedToESP32" class="status-warning"> <view v-if="!isConnectedToESP32" class="status-warning">
<view class="status-content"> <view class="status-content">
<text class="warning-text"> <text class="warning-text">
{{ t('deviceConfig.connectXiaozhiHotspot') }} (xiaozhi-XXXXXX) {{ t('deviceConfig.connectXiaozhiHotspot') }} (xiaozhi-XXXXXX)
</text> </text>
<wd-button <wd-button
size="small" size="small"
type="primary" type="primary"
:loading="checkingConnection" :loading="checkingConnection"
@click="checkESP32Connection" @click="checkESP32Connection"
> >
{{ checkingConnection ? t('deviceConfig.checking') : t('deviceConfig.reCheck') }} {{ checkingConnection ? t('deviceConfig.checking') : t('deviceConfig.reCheck') }}
</wd-button> </wd-button>
</view>
</view> </view>
</view>
<view v-else class="status-success"> <view v-else class="status-success">
<view class="status-content"> <view class="status-content">
<text class="success-text"> <text class="success-text">
{{ t('deviceConfig.connectedXiaozhiHotspot') }} {{ t('deviceConfig.connectedXiaozhiHotspot') }}
</text> </text>
<wd-button <wd-button
size="small" size="small"
:loading="checkingConnection" :loading="checkingConnection"
@click="checkESP32Connection" @click="checkESP32Connection"
> >
{{ checkingConnection ? t('deviceConfig.checking') : t('deviceConfig.refreshStatus') }} {{ checkingConnection ? t('deviceConfig.checking') : t('deviceConfig.refreshStatus') }}
</wd-button> </wd-button>
</view>
</view> </view>
</view>
</view> </view>
<!-- WiFi网络选择器 --> <!-- WiFi网络选择器 -->
<view class="network-selector"> <view class="network-selector">
<view class="selector-item" @click="showNetworkSelector"> <view class="selector-item" @click="showNetworkSelector">
<text class="selector-label"> <text class="selector-label">
{{ t('deviceConfig.wifiNetwork') }} {{ t('deviceConfig.wifiNetwork') }}
</text> </text>
<text class="selector-value"> <text class="selector-value">
{{ networkDisplayText }} {{ networkDisplayText }}
</text> </text>
<wd-icon name="arrow-right" custom-class="arrow-icon" /> <wd-icon name="arrow-right" custom-class="arrow-icon" />
</view>
</view> </view>
</view>
<!-- 展开的网络列表 --> <!-- 展开的网络列表 -->
<view v-if="selectorExpanded" class="network-list-overlay"> <view v-if="selectorExpanded" class="network-list-overlay">
<view class="network-list-container"> <view class="network-list-container">
<view class="list-header"> <view class="list-header">
<text class="list-title"> <text class="list-title">
{{ t('deviceConfig.selectWifiNetwork') }} {{ t('deviceConfig.selectWifiNetwork') }}
</text> </text>
<view class="list-actions"> <view class="list-actions">
<wd-button <wd-button
type="primary" type="primary"
size="small" size="small"
:loading="scanning" :loading="scanning"
@click="scanWifi" @click="scanWifi"
> >
{{ scanning ? t('deviceConfig.scanning') : t('deviceConfig.refreshScan') }} {{ scanning ? t('deviceConfig.scanning') : t('deviceConfig.refreshScan') }}
</wd-button> </wd-button>
<wd-button <wd-button
size="small" size="small"
@click="selectorExpanded = false" @click="selectorExpanded = false"
> >
{{ t('deviceConfig.cancel') }} {{ t('deviceConfig.cancel') }}
</wd-button> </wd-button>
</view>
</view> </view>
</view>
<view class="network-list"> <view class="network-list">
<view v-if="wifiNetworks.length === 0 && !scanning" class="empty-state"> <view v-if="wifiNetworks.length === 0 && !scanning" class="empty-state">
@@ -323,7 +323,7 @@ onMounted(() => {
</view> </view>
<view class="wifi-security"> <view class="wifi-security">
<text class="security-icon"> <text class="security-icon">
{{ network.authmode === 0 ? t('deviceConfig.open') : t('deviceConfig.encrypted') }} {{ network.authmode === 0 ? t('deviceConfig.open') : t('deviceConfig.encryptedNetwork') }}
</text> </text>
</view> </view>
</view> </view>
@@ -335,17 +335,17 @@ onMounted(() => {
<!-- 密码输入 --> <!-- 密码输入 -->
<view v-if="selectedNetwork && selectedNetwork.authmode > 0" class="password-section"> <view v-if="selectedNetwork && selectedNetwork.authmode > 0" class="password-section">
<view class="password-item"> <view class="password-item">
<text class="password-label"> <text class="password-label">
{{ t('deviceConfig.wifiPassword') }} {{ t('deviceConfig.wifiPassword') }}
</text> </text>
<wd-input <wd-input
v-model="password" v-model="password"
:placeholder="t('deviceConfig.enterWifiPassword')" :placeholder="t('deviceConfig.enterWifiPassword')"
show-password show-password
clearable clearable
@input="onPasswordChange" @input="onPasswordChange"
/> />
</view> </view>
</view> </view>
</view> </view>
</template> </template>