合并网友提交优化

合并网友提交优化

.gitignore

@@ -155,6 +155,9 @@ main/manager-web/node_modules
 main/xiaozhi-server/models/SenseVoiceSmall/model.pt
 main/xiaozhi-server/models/sherpa-onnx*
 my_wakeup_words.mp3
+!main/xiaozhi-server/config/assets/bind_code.wav
+!main/xiaozhi-server/config/assets/bind_not_found.wav
+!main/xiaozhi-server/config/assets/bind_code/*.wav
 main/manager-api/.vscode
 
 # Ignore webpack cache directory

README.md

@@ -160,7 +160,7 @@ server:
 
 ```
 智控台地址: https://2662r3426b.vicp.fun
-OTA接口地址: htts://2662r3426b.vicp.fun/xiaozhi/ota/
+OTA接口地址: https://2662r3426b.vicp.fun/xiaozhi/ota/
 Websocket接口地址: wss://2662r3426b.vicp.fun/xiaozhi/v1/
 ```
 ---

docs/Deployment_all.md

@@ -138,12 +138,12 @@ manager-api:
   secret: 你的server.secret值
 ```
 1、把你刚才从`智控台`复制过来的`server.secret`的`参数值`复制到`.config.yaml`文件里的`secret`里。
-2、注意，把`url`改成下面的`http://xiaozhi-esp32-server-web/xiaozhi`
+2、注意，把`url`改成下面的`http://xiaozhi-esp32-server-web:8002/xiaozhi`
 
 类似这样的效果
 ```
 manager-api:
-  url: http://xiaozhi-esp32-server-web/xiaozhi
+  url: http://xiaozhi-esp32-server-web:8002/xiaozhi
   secret: 12345678-xxxx-xxxx-xxxx-123456789000
 ```
 

docs/firmware-build.md

@@ -42,7 +42,7 @@ config WEBSOCKET_URL
 如果你是全模块部署本项目，就修改OTA接口，如果你只是部署了8000端口的xiaozhi-server，可以继续沿用虾哥团队的OTA接口。如果你不修改OTA接口，请直接忽略本第4步，直接看第5步
 
 找到`OTA_VERSION_URL`的`default`的内容，把`https://api.tenclass.net/xiaozhi/ota/`
-   改成你自己的地址，例如，我的接口地址是`http://192.168.1.25:8000/xiaozhi/ota/`，就把内容改成这个。
+   改成你自己的地址，例如，我的接口地址是`http://192.168.1.25:8002/xiaozhi/ota/`，就把内容改成这个。
 
 修改前：
 ```
@@ -56,7 +56,7 @@ config OTA_VERSION_URL
 ```
 config OTA_VERSION_URL
     string "OTA Version URL"
-    default "http://192.168.1.25:8000/xiaozhi/ota/"
+    default "http://192.168.1.25:8002/xiaozhi/ota/"
     help
         The application will access this URL to check for updates.
 ```

main/manager-api/src/main/java/xiaozhi/common/constant/Constant.java

@@ -84,6 +84,16 @@ public interface Constant {
      */
     String SERVER_SECRET = "server.secret";
 
+    /**
+     * 是否允许用户注册
+     */
+    String SERVER_ALLOW_USER_REGISTER = "server.allow_user_register";
+
+    /**
+     * 下发六位验证码时显示的控制面板地址
+     */
+    String SERVER_FRONTED_URL = "server.fronted_url";
+
     /**
      * 路径分割符
      */

main/manager-api/src/main/java/xiaozhi/common/exception/ErrorCode.java

@@ -52,4 +52,7 @@ public interface ErrorCode {
     int PARAM_BOOLEAN_INVALID = 10038;
     int PARAM_ARRAY_INVALID = 10039;
     int PARAM_JSON_INVALID = 10040;
+
+    int OTA_DEVICE_NOT_FOUND = 10041;
+    int OTA_DEVICE_NEED_BIND = 10042;
 }

main/manager-api/src/main/java/xiaozhi/modules/agent/service/impl/AgentTemplateServiceImpl.java

@@ -3,6 +3,7 @@ package xiaozhi.modules.agent.service.impl;
 import org.springframework.stereotype.Service;
 
 import com.baomidou.mybatisplus.core.conditions.query.LambdaQueryWrapper;
+import com.baomidou.mybatisplus.core.conditions.update.UpdateWrapper;
 import com.baomidou.mybatisplus.extension.service.impl.ServiceImpl;
 
 import xiaozhi.modules.agent.dao.AgentTemplateDao;
@@ -39,29 +40,30 @@ public class AgentTemplateServiceImpl extends ServiceImpl<AgentTemplateDao, Agen
     @Override
     public void updateDefaultTemplateModelId(String modelType, String modelId) {
         modelType = modelType.toUpperCase();
-        AgentTemplateEntity defaultTemplate = getDefaultTemplate();
+
-        if (defaultTemplate != null) {
+        UpdateWrapper<AgentTemplateEntity> wrapper = new UpdateWrapper<>();
-            switch (modelType) {
+        switch (modelType) {
-                case "ASR":
+            case "ASR":
-                    defaultTemplate.setAsrModelId(modelId);
+                wrapper.set("asr_model_id", modelId);
-                    break;
+                break;
-                case "VAD":
+            case "VAD":
-                    defaultTemplate.setVadModelId(modelId);
+                wrapper.set("vad_model_id", modelId);
-                    break;
+                break;
-                case "LLM":
+            case "LLM":
-                    defaultTemplate.setLlmModelId(modelId);
+                wrapper.set("llm_model_id", modelId);
-                    break;
+                break;
-                case "TTS":
+            case "TTS":
-                    defaultTemplate.setTtsModelId(modelId);
+                wrapper.set("tts_model_id", modelId);
-                    break;
+                wrapper.set("tts_voice_id", null);
-                case "Memory":
+                break;
-                    defaultTemplate.setMemModelId(modelId);
+            case "MEMORY":
-                    break;
+                wrapper.set("mem_model_id", modelId);
-                case "Intent":
+                break;
-                    defaultTemplate.setIntentModelId(modelId);
+            case "INTENT":
-                    break;
+                wrapper.set("intent_model_id", modelId);
-            }
+                break;
-            this.updateById(defaultTemplate);
         }
+        wrapper.ge("sort", 0);
+        update(wrapper);
     }
 }

main/manager-api/src/main/java/xiaozhi/modules/config/service/impl/ConfigServiceImpl.java

@@ -9,6 +9,7 @@ import org.apache.commons.lang3.StringUtils;
 import org.springframework.stereotype.Service;
 
 import lombok.AllArgsConstructor;
+import xiaozhi.common.exception.ErrorCode;
 import xiaozhi.common.exception.RenException;
 import xiaozhi.common.redis.RedisKeys;
 import xiaozhi.common.redis.RedisUtils;
@@ -83,7 +84,12 @@ public class ConfigServiceImpl implements ConfigService {
         // 根据MAC地址查找设备
         DeviceEntity device = deviceService.getDeviceByMacAddress(macAddress);
         if (device == null) {
-            throw new RenException("设备未找到");
+            // 如果设备，去redis里看看有没有需要连接的设备
+            String cachedCode = deviceService.geCodeByDeviceId(macAddress);
+            if (StringUtils.isNotBlank(cachedCode)) {
+                throw new RenException(ErrorCode.OTA_DEVICE_NEED_BIND, cachedCode);
+            }
+            throw new RenException(ErrorCode.OTA_DEVICE_NOT_FOUND, "not found device");
         }
         // 获取智能体信息
         AgentEntity agent = agentService.getAgentById(device.getAgentId());

main/manager-api/src/main/java/xiaozhi/modules/device/controller/OTAController.java

@@ -37,9 +37,7 @@ public class OTAController {
     @PostMapping
     public ResponseEntity<String> checkOTAVersion(
             @RequestBody DeviceReportReqDTO deviceReportReqDTO,
-
             @Parameter(name = "Device-Id", description = "设备唯一标识", required = true, in = ParameterIn.HEADER) @RequestHeader("Device-Id") String deviceId,
-
             @Parameter(name = "Client-Id", description = "客户端标识", required = true, in = ParameterIn.HEADER) @RequestHeader("Client-Id") String clientId) {
         if (StringUtils.isAnyBlank(deviceId, clientId)) {
             return createResponse(DeviceReportRespDTO.createError("Device ID is required"));
@@ -50,10 +48,9 @@ public class OTAController {
         if (!deviceId.equals(macAddress) || !macAddressValid || deviceReportReqDTO.getApplication() == null) {
             return createResponse(DeviceReportRespDTO.createError("Invalid OTA request"));
         }
-        return createResponse(deviceService.checkDeviceActive(macAddress, deviceId, clientId, deviceReportReqDTO));
+        return createResponse(deviceService.checkDeviceActive(macAddress, clientId, deviceReportReqDTO));
     }
 
-    @Operation(summary = "获取 OTA 提示信息")
     @GetMapping
     public ResponseEntity<String> getOTAPrompt() {
         return createResponse(DeviceReportRespDTO.createError("请提交正确的ota参数"));

main/manager-api/src/main/java/xiaozhi/modules/device/service/DeviceService.java

@@ -19,7 +19,7 @@ public interface DeviceService {
     /**
      * 检查设备是否激活
      */
-    DeviceReportRespDTO checkDeviceActive(String macAddress, String deviceId, String clientId,
+    DeviceReportRespDTO checkDeviceActive(String macAddress, String clientId,
             DeviceReportReqDTO deviceReport);
 
     /**
@@ -74,4 +74,12 @@ public interface DeviceService {
      * @return 设备信息
      */
     DeviceEntity getDeviceByMacAddress(String macAddress);
+
+    /**
+     * 根据设备ID获取激活码
+     * 
+     * @param deviceId 设备ID
+     * @return 激活码
+     */
+    String geCodeByDeviceId(String deviceId);
 }

main/manager-api/src/main/java/xiaozhi/modules/device/service/impl/DeviceServiceImpl.java

@@ -9,7 +9,6 @@ import java.util.TimeZone;
 import java.util.concurrent.TimeUnit;
 
 import org.apache.commons.lang3.StringUtils;
-import org.springframework.beans.factory.annotation.Value;
 import org.springframework.data.redis.core.RedisTemplate;
 import org.springframework.stereotype.Service;
 
@@ -34,6 +33,7 @@ import xiaozhi.modules.device.entity.DeviceEntity;
 import xiaozhi.modules.device.service.DeviceService;
 import xiaozhi.modules.device.vo.UserShowDeviceListVO;
 import xiaozhi.modules.security.user.SecurityUser;
+import xiaozhi.modules.sys.service.SysParamsService;
 import xiaozhi.modules.sys.service.SysUserUtilService;
 
 @Service
@@ -49,11 +49,11 @@ public class DeviceServiceImpl extends BaseServiceImpl<DeviceDao, DeviceEntity>
 
     // 添加构造函数来初始化 deviceMapper
     public DeviceServiceImpl(DeviceDao deviceDao, SysUserUtilService sysUserUtilService,
-            @Value("${app.fronted-url:http://localhost:8001}") String frontedUrl,
+            SysParamsService sysParamsService,
             RedisTemplate<String, Object> redisTemplate) {
         this.deviceDao = deviceDao;
         this.sysUserUtilService = sysUserUtilService;
-        this.frontedUrl = frontedUrl;
+        this.frontedUrl = sysParamsService.getValue(Constant.SERVER_FRONTED_URL, true);
         this.redisTemplate = redisTemplate;
     }
 
@@ -120,7 +120,7 @@ public class DeviceServiceImpl extends BaseServiceImpl<DeviceDao, DeviceEntity>
     }
 
     @Override
-    public DeviceReportRespDTO checkDeviceActive(String macAddress, String deviceId, String clientId,
+    public DeviceReportRespDTO checkDeviceActive(String macAddress, String clientId,
             DeviceReportReqDTO deviceReport) {
         DeviceReportRespDTO response = new DeviceReportRespDTO();
         response.setServer_time(buildServerTime());
@@ -132,46 +132,12 @@ public class DeviceServiceImpl extends BaseServiceImpl<DeviceDao, DeviceEntity>
         firmware.setUrl("http://localhost:8002/xiaozhi/ota/download");
         response.setFirmware(firmware);
 
-        DeviceEntity deviceById = getDeviceById(deviceId);
+        DeviceEntity deviceById = getDeviceById(macAddress);
         if (deviceById != null) { // 如果设备存在，则更新上次连接时间
             deviceById.setLastConnectedAt(new Date());
             deviceDao.updateById(deviceById);
         } else { // 如果设备不存在，则生成激活码
-            String safeDeviceId = deviceId.replace(":", "_").toLowerCase();
+            DeviceReportRespDTO.Activation code = buildActivation(macAddress, deviceReport);
-            String dataKey = String.format("ota:activation:data:%s", safeDeviceId);
-
-            Map<Object, Object> cacheMap = redisTemplate.opsForHash().entries(dataKey);
-            DeviceReportRespDTO.Activation code = new DeviceReportRespDTO.Activation();
-
-            if (cacheMap != null && cacheMap.containsKey("activation_code")) {
-                String cachedCode = (String) cacheMap.get("activation_code");
-                code.setCode(cachedCode);
-                code.setMessage(frontedUrl + "\n" + cachedCode);
-            } else {
-                String newCode = RandomUtil.randomNumbers(6);
-                code.setCode(newCode);
-                code.setMessage(frontedUrl + "\n" + newCode);
-
-                Map<String, Object> dataMap = new HashMap<>();
-                dataMap.put("id", deviceId);
-                dataMap.put("mac_address", macAddress);
-                dataMap.put("board", (deviceReport.getChipModelName() != null) ? deviceReport.getChipModelName()
-                        : (deviceReport.getBoard() != null ? deviceReport.getBoard().getType() : "unknown"));
-                dataMap.put("app_version", (deviceReport.getApplication() != null)
-                        ? deviceReport.getApplication().getVersion()
-                        : null);
-                dataMap.put("deviceId", deviceId);
-                dataMap.put("activation_code", newCode);
-
-                // 写入主数据 key
-                redisTemplate.opsForHash().putAll(dataKey, dataMap);
-                redisTemplate.expire(dataKey, 24, TimeUnit.HOURS);
-
-                // 写入反查激活码 key
-                String codeKey = "ota:activation:code:" + newCode;
-                redisTemplate.opsForValue().set(codeKey, deviceId, 24, TimeUnit.HOURS);
-            }
-
             response.setActivation(code);
         }
 
@@ -258,4 +224,60 @@ public class DeviceServiceImpl extends BaseServiceImpl<DeviceDao, DeviceEntity>
         serverTime.setTimezone_offset(tz.getOffset(System.currentTimeMillis()) / (60 * 1000));
         return serverTime;
     }
+
+    @Override
+    public String geCodeByDeviceId(String deviceId) {
+        String dataKey = getDeviceCacheKey(deviceId);
+
+        Map<Object, Object> cacheMap = redisTemplate.opsForHash().entries(dataKey);
+        if (cacheMap != null && cacheMap.containsKey("activation_code")) {
+            String cachedCode = (String) cacheMap.get("activation_code");
+            return cachedCode;
+        }
+        return null;
+    }
+
+    private String getDeviceCacheKey(String deviceId) {
+        String safeDeviceId = deviceId.replace(":", "_").toLowerCase();
+        String dataKey = String.format("ota:activation:data:%s", safeDeviceId);
+        return dataKey;
+    }
+
+    public DeviceReportRespDTO.Activation buildActivation(String deviceId, DeviceReportReqDTO deviceReport) {
+        DeviceReportRespDTO.Activation code = new DeviceReportRespDTO.Activation();
+
+        String cachedCode = geCodeByDeviceId(deviceId);
+
+        if (StringUtils.isNotBlank(cachedCode)) {
+            code.setCode(cachedCode);
+            code.setMessage(frontedUrl + "\n" + cachedCode);
+        } else {
+            String newCode = RandomUtil.randomNumbers(6);
+            code.setCode(newCode);
+            code.setMessage(frontedUrl + "\n" + newCode);
+
+            Map<String, Object> dataMap = new HashMap<>();
+            dataMap.put("id", deviceId);
+            dataMap.put("mac_address", deviceId);
+
+            dataMap.put("board", (deviceReport.getChipModelName() != null) ? deviceReport.getChipModelName()
+                    : (deviceReport.getBoard() != null ? deviceReport.getBoard().getType() : "unknown"));
+            dataMap.put("app_version", (deviceReport.getApplication() != null)
+                    ? deviceReport.getApplication().getVersion()
+                    : null);
+
+            dataMap.put("deviceId", deviceId);
+            dataMap.put("activation_code", newCode);
+
+            // 写入主数据 key
+            String dataKey = getDeviceCacheKey(deviceId);
+            redisTemplate.opsForHash().putAll(dataKey, dataMap);
+            redisTemplate.expire(dataKey, 24, TimeUnit.HOURS);
+
+            // 写入反查激活码 key
+            String codeKey = "ota:activation:code:" + newCode;
+            redisTemplate.opsForValue().set(codeKey, deviceId, 24, TimeUnit.HOURS);
+        }
+        return code;
+    }
 }

main/manager-api/src/main/java/xiaozhi/modules/model/controller/ModelController.java

@@ -135,6 +135,7 @@ public class ModelController {
         }
         // 将其他模型设置为非默认
         modelConfigService.setDefaultModel(entity.getModelType(), 0);
+        entity.setIsEnabled(1);
         entity.setIsDefault(1);
         modelConfigService.updateById(entity);
 

main/manager-api/src/main/java/xiaozhi/modules/model/service/impl/ModelConfigServiceImpl.java

@@ -42,6 +42,7 @@ public class ModelConfigServiceImpl extends BaseServiceImpl<ModelConfigDao, Mode
         List<ModelConfigEntity> entities = modelConfigDao.selectList(
                 new QueryWrapper<ModelConfigEntity>()
                         .eq("model_type", modelType)
+                        .eq("is_enabled", 1)
                         .like(StringUtils.isNotBlank(modelName), "model_name", "%" + modelName + "%")
                         .select("id", "model_name"));
         return ConvertUtils.sourceToTarget(entities, ModelBasicInfoDTO.class);

main/manager-api/src/main/java/xiaozhi/modules/security/controller/LoginController.java

@@ -77,6 +77,9 @@ public class LoginController {
     @PostMapping("/register")
     @Operation(summary = "注册")
     public Result<Void> register(@RequestBody LoginDTO login) {
+        if (!sysUserService.getAllowUserRegister()) {
+            throw new RenException("当前不允许普通用户注册");
+        }
         // 验证是否正确输入验证码
         boolean validate = captchaService.validate(login.getCaptchaId(), login.getCaptcha());
         if (!validate) {
@@ -118,7 +121,8 @@ public class LoginController {
     @Operation(summary = "公共配置")
     public Result<Map<String, Object>> pubConfig() {
         Map<String, Object> config = new HashMap<>();
-        config.put("version", "0.3.3");
+        config.put("version", "0.3.4");
+        config.put("allowUserRegister", sysUserService.getAllowUserRegister());
         return new Result<Map<String, Object>>().ok(config);
     }
 }

main/manager-api/src/main/java/xiaozhi/modules/sys/controller/SysParamsController.java

@@ -27,6 +27,7 @@ import xiaozhi.common.validator.ValidatorUtils;
 import xiaozhi.common.validator.group.AddGroup;
 import xiaozhi.common.validator.group.DefaultGroup;
 import xiaozhi.common.validator.group.UpdateGroup;
+import xiaozhi.modules.config.service.ConfigService;
 import xiaozhi.modules.sys.dto.SysParamsDTO;
 import xiaozhi.modules.sys.service.SysParamsService;
 
@@ -42,6 +43,7 @@ import xiaozhi.modules.sys.service.SysParamsService;
 @AllArgsConstructor
 public class SysParamsController {
     private final SysParamsService sysParamsService;
+    private final ConfigService configService;
 
     @GetMapping("page")
     @Operation(summary = "分页")
@@ -77,7 +79,7 @@ public class SysParamsController {
         ValidatorUtils.validateEntity(dto, AddGroup.class, DefaultGroup.class);
 
         sysParamsService.save(dto);
-
+        configService.getConfig(false);
         return new Result<Void>();
     }
 
@@ -90,7 +92,7 @@ public class SysParamsController {
         ValidatorUtils.validateEntity(dto, UpdateGroup.class, DefaultGroup.class);
 
         sysParamsService.update(dto);
-
+        configService.getConfig(false);
         return new Result<Void>();
     }
 
@@ -103,7 +105,7 @@ public class SysParamsController {
         AssertUtils.isArrayEmpty(ids, "id");
 
         sysParamsService.delete(ids);
-
+        configService.getConfig(false);
         return new Result<Void>();
     }
 }

main/manager-api/src/main/java/xiaozhi/modules/sys/service/SysUserService.java

@@ -65,4 +65,11 @@ public interface SysUserService extends BaseService<SysUserEntity> {
      * @param userIds 用户ID数组
      */
     void changeStatus(Integer status, String[] userIds);
+
+    /**
+     * 获取是否允许用户注册
+     * 
+     * @return 是否允许用户注册
+     */
+    boolean getAllowUserRegister();
 }

main/manager-api/src/main/java/xiaozhi/modules/sys/service/impl/SysUserServiceImpl.java

@@ -30,6 +30,7 @@ import xiaozhi.modules.sys.dto.PasswordDTO;
 import xiaozhi.modules.sys.dto.SysUserDTO;
 import xiaozhi.modules.sys.entity.SysUserEntity;
 import xiaozhi.modules.sys.enums.SuperAdminEnum;
+import xiaozhi.modules.sys.service.SysParamsService;
 import xiaozhi.modules.sys.service.SysUserService;
 import xiaozhi.modules.sys.vo.AdminPageUserVO;
 
@@ -45,6 +46,8 @@ public class SysUserServiceImpl extends BaseServiceImpl<SysUserDao, SysUserEntit
 
     private final AgentService agentService;
 
+    private final SysParamsService sysParamsService;
+
     @Override
     public SysUserDTO getByUsername(String username) {
         QueryWrapper<SysUserEntity> queryWrapper = new QueryWrapper<>();
@@ -205,4 +208,17 @@ public class SysUserServiceImpl extends BaseServiceImpl<SysUserDao, SysUserEntit
             updateById(entity);
         }
     }
+
+    @Override
+    public boolean getAllowUserRegister() {
+        String allowUserRegister = sysParamsService.getValue(Constant.SERVER_ALLOW_USER_REGISTER, true);
+        if (allowUserRegister.equals("true")) {
+            return true;
+        }
+        Long userCount = baseDao.selectCount(new QueryWrapper<SysUserEntity>());
+        if (userCount == 0) {
+            return true;
+        }
+        return false;
+    }
 }

main/manager-api/src/main/resources/application.yml

@@ -63,7 +63,4 @@ mybatis-plus:
   configuration-properties:
     prefix:
     blobType: BLOB
-    boolValue: TRUE
+    boolValue: TRUE
-
-app:
-  fronted-url: http://localhost:8001

main/manager-api/src/main/resources/db/changelog/202504151206.sql

@@ -15,4 +15,14 @@ INSERT INTO `ai_tts_voice` VALUES
 ('TTS_EdgeTTS0008', 'TTS_EdgeTTS', 'EdgeTTS女声-陕西小妮', 'zh-CN-shaanxi-XiaoniNeural', '陕西', NULL, NULL, 1, NULL, NULL, NULL, NULL),
 ('TTS_EdgeTTS0009', 'TTS_EdgeTTS', 'EdgeTTS女声-香港海佳', 'zh-HK-HiuGaaiNeural', '粤语', 'General', 'Friendly, Positive', 1, NULL, NULL, NULL, NULL),
 ('TTS_EdgeTTS0010', 'TTS_EdgeTTS', 'EdgeTTS女声-香港海曼', 'zh-HK-HiuMaanNeural', '粤语', 'General', 'Friendly, Positive', 1, NULL, NULL, NULL, NULL),
-('TTS_EdgeTTS0011', 'TTS_EdgeTTS', 'EdgeTTS男声-香港万龙', 'zh-HK-WanLungNeural', '粤语', 'General', 'Friendly, Positive', 1, NULL, NULL, NULL, NULL);
+('TTS_EdgeTTS0011', 'TTS_EdgeTTS', 'EdgeTTS男声-香港万龙', 'zh-HK-WanLungNeural', '粤语', 'General', 'Friendly, Positive', 1, NULL, NULL, NULL, NULL);
+
+-- 增加是否允许用户注册参数
+delete from `sys_params` where  id in (103,104);
+INSERT INTO `sys_params` (id, param_code, param_value, value_type, param_type, remark) VALUES (103, 'server.allow_user_register', 'false', 'boolean', 1, '是否运行管理员以外的人注册');
+INSERT INTO `sys_params` (id, param_code, param_value, value_type, param_type, remark) VALUES (104, 'server.fronted_url', 'http://xiaozhi.server.com', 'string', 1, '下发六位验证码时显示的控制面板地址');
+
+-- 修正CosyVoiceSiliconflow音色
+delete from `ai_tts_voice` where tts_model_id = 'TTS_CosyVoiceSiliconflow';
+INSERT INTO `ai_tts_voice` VALUES ('TTS_CosyVoiceSiliconflow0001', 'TTS_CosyVoiceSiliconflow', 'CosyVoice男声', 'FunAudioLLM/CosyVoice2-0.5B:alex', '中文', 'https://example.com/cosyvoice/alex.mp3', NULL, 6, NULL, NULL, NULL, NULL);
+INSERT INTO `ai_tts_voice` VALUES ('TTS_CosyVoiceSiliconflow0002', 'TTS_CosyVoiceSiliconflow', 'CosyVoice女声', 'FunAudioLLM/CosyVoice2-0.5B:bella', '中文', 'https://example.com/cosyvoice/bella.mp3', NULL, 6, NULL, NULL, NULL, NULL);

main/manager-api/src/main/resources/db/changelog/db.changelog-master.yaml

@@ -52,9 +52,9 @@ databaseChangeLog:
             encoding: utf8
             path: classpath:db/changelog/202504112058.sql
   - changeSet:
-      id: 202504131543
+      id: 202504151206
       author: John
       changes:
         - sqlFile:
             encoding: utf8
-            path: classpath:db/changelog/202504131543.sql
+            path: classpath:db/changelog/202504151206.sql

main/manager-api/src/main/resources/i18n/messages.properties

@@ -41,3 +41,6 @@
 10038=\u53C2\u6570\u503C\u5FC5\u987B\u662Ftrue\u6216false
 10039=\u53C2\u6570\u503C\u5FC5\u987B\u662F\u6709\u6548\u7684JSON\u6570\u7EC4\u683C\u5F0F
 10040=\u53C2\u6570\u503C\u5FC5\u987B\u662F\u6709\u6548\u7684JSON\u683C\u5F0F
+
+10041=\u8BBE\u5907\u672A\u627E\u5230
+10042={0}

main/manager-api/src/main/resources/i18n/messages_en_US.properties

@@ -40,4 +40,7 @@
 10037=Parameter value must be a valid number
 10038=Parameter value must be true or false
 10039=Parameter value must be a valid JSON array format
-10040=Parameter value must be a valid JSON format
+10040=Parameter value must be a valid JSON format
+
+10041=Device not found
+10042={0}

main/manager-api/src/main/resources/i18n/messages_zh_CN.properties

@@ -40,4 +40,7 @@
 10037=\u53C2\u6570\u503C\u5FC5\u987B\u662F\u6709\u6548\u7684\u6570\u5B57
 10038=\u53C2\u6570\u503C\u5FC5\u987B\u662Ftrue\u6216false
 10039=\u53C2\u6570\u503C\u5FC5\u987B\u662F\u6709\u6548\u7684JSON\u6570\u7EC4\u683C\u5F0F
-10040=\u53C2\u6570\u503C\u5FC5\u987B\u662F\u6709\u6548\u7684JSON\u683C\u5F0F
+10040=\u53C2\u6570\u503C\u5FC5\u987B\u662F\u6709\u6548\u7684JSON\u683C\u5F0F
+
+10041=\u8BBE\u5907\u672A\u627E\u5230
+10042={0}

main/manager-api/src/main/resources/i18n/messages_zh_TW.properties

@@ -40,4 +40,7 @@
 10037=\u53C3\u6578\u503C\u5FC5\u9808\u662F\u6709\u6548\u7684\u6578\u5B57
 10038=\u53C3\u6578\u503C\u5FC5\u9808\u662Ftrue\u6216false
 10039=\u53C3\u6578\u503C\u5FC5\u9808\u662F\u6709\u6548\u7684JSON\u6578\u7D44\u683C\u5F0F
-10040=\u53C3\u6578\u503C\u5FC5\u9808\u662F\u6709\u6548\u7684JSON\u683C\u5F0F
+10040=\u53C3\u6578\u503C\u5FC5\u9808\u662F\u6709\u6548\u7684JSON\u683C\u5F0F
+
+10041=\u8A2D\u5099\u672A\u627E\u5230
+10042={0}

main/manager-api/src/main/resources/i18n/validation.properties

@@ -33,3 +33,5 @@ timbre.ttsModelId.require=\u97F3\u8272\u7684tts\u4E3B\u952E\u4E0D\u53EF\u4EE5\u4
 timbre.ttsVoice.require=\u97F3\u8272\u7684\u7F16\u7801\u4E0D\u53EF\u4EE5\u4E3A\u7A7A
 timbre.voiceDemo.require=\u97F3\u8272\u7684\u64AD\u653EDemo\u4E0D\u53EF\u4EE5\u4E3A\u7A7A
 
+ota.device.not.found=\u8BBE\u5907\u672A\u627E\u5230
+ota.device.need.bind={0}

main/manager-api/src/main/resources/i18n/validation_en_US.properties

@@ -32,3 +32,5 @@ timbre.ttsModelId.require=The TTS model ID of the timbre cannot be empty
 timbre.ttsVoice.require=The TTS voice of the timbre cannot be empty
 timbre.voiceDemo.require=The voice demo of the timbre cannot be empty
 
+ota.device.not.found=Device not found
+ota.device.need.bind={0}

main/manager-api/src/main/resources/i18n/validation_zh_CN.properties

@@ -32,3 +32,5 @@ timbre.ttsModelId.require=\u97F3\u8272\u7684tts\u4E3B\u9375\u4E0D\u53EF\u4EE5\u7
 timbre.ttsVoice.require=\u97F3\u8272\u7684\u7DE8\u78BC\u4E0D\u53EF\u4EE5\u70BA\u7A7A
 timbre.voiceDemo.require=\u97F3\u8272\u7684\u64AD\u653E\u5730\u5740\u4E0D\u53EF\u4EE5\u70BA\u7A7A
 
+ota.device.not.found=\u8A2D\u5099\u672A\u627E\u5230
+ota.device.need.bind={0}

main/manager-api/src/main/resources/i18n/validation_zh_TW.properties

@@ -31,3 +31,6 @@ timbre.remark.require=\u97F3\u8272\u7684\u5907\u6CE8\u4E0D\u53EF\u4EE5\u4E3A\u7A
 timbre.ttsModelId.require=\u97F3\u8272\u7684tts\u4E3B\u952E\u4E0D\u53EF\u4EE5\u4E3A\u7A7A
 timbre.ttsVoice.require=\u97F3\u8272\u7684\u7F16\u7801\u4E0D\u53EF\u4EE5\u4E3A\u7A7A
 timbre.voiceDemo.require=\u97F3\u8272\u7684\u64AD\u653EDemo\u4E0D\u53EF\u4EE5\u4E3A\u7A7A
+
+ota.device.not.found=\u8A2D\u5099\u672A\u627E\u5230
+ota.device.need.bind={0}

main/manager-web/.env.production

@@ -1 +1,3 @@
-VUE_APP_API_BASE_URL=/xiaozhi
+VUE_APP_API_BASE_URL=/xiaozhi
+# 是否开启CDN
+VUE_APP_USE_CDN=false

main/manager-web/package.json

@@ -31,7 +31,8 @@
     "sass": "^1.32.7",
     "sass-loader": "^12.0.0",
     "vue-template-compiler": "^2.6.14",
-    "webpack-bundle-analyzer": "^4.10.2"
+    "webpack-bundle-analyzer": "^4.10.2",
+    "workbox-webpack-plugin": "^7.3.0"
   },
   "browserslist": [
     "> 1%",
@@ -43,4 +44,4 @@
     "*.scss",
     "*.vue"
   ]
-}
+}

main/manager-web/public/index.html

@@ -9,7 +9,7 @@
   <title>
     <%= process.env.VUE_APP_TITLE %>
   </title>
-  <% if (htmlWebpackPlugin.options.cdn) { %>
+  <% if (htmlWebpackPlugin.options.cdn && htmlWebpackPlugin.options.cdn.css) { %>
     <% for (var i in htmlWebpackPlugin.options.cdn.css) { %>
       <link rel="stylesheet" href="<%= htmlWebpackPlugin.options.cdn.css[i] %>">
       <% } %>
@@ -23,7 +23,7 @@
   </noscript>
   <div id="app"></div>
   <!-- built files will be auto injected -->
-  <% if (htmlWebpackPlugin.options.cdn) { %>
+  <% if (htmlWebpackPlugin.options.cdn && htmlWebpackPlugin.options.cdn.js) { %>
     <% for (var i in htmlWebpackPlugin.options.cdn.js) { %>
       <script src="<%= htmlWebpackPlugin.options.cdn.js[i] %>"></script>
       <% } %>

main/manager-web/public/offline.html

@@ -0,0 +1,70 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>离线模式 - 小智控制台</title>
+  <style>
+    body {
+      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      height: 100vh;
+      margin: 0;
+      background-color: #f5f7fa;
+      color: #333;
+    }
+    .container {
+      text-align: center;
+      padding: 2rem;
+      background: white;
+      border-radius: 10px;
+      box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
+      max-width: 80%;
+    }
+    h1 {
+      margin-bottom: 1rem;
+      color: #409EFF;
+    }
+    p {
+      margin-bottom: 1.5rem;
+      line-height: 1.6;
+    }
+    .btn {
+      background-color: #409EFF;
+      color: white;
+      border: none;
+      padding: 0.8rem 1.5rem;
+      border-radius: 4px;
+      font-size: 1rem;
+      cursor: pointer;
+      transition: background-color 0.3s;
+    }
+    .btn:hover {
+      background-color: #337ecc;
+    }
+    .icon {
+      font-size: 4rem;
+      margin-bottom: 1rem;
+      color: #409EFF;
+    }
+  </style>
+</head>
+<body>
+  <div class="container">
+    <div class="icon">📶</div>
+    <h1>您当前处于离线模式</h1>
+    <p>看起来您的网络连接有问题，无法连接到小智控制台服务器。</p>
+    <p>部分已缓存的内容和静态资源可能仍然可用，但功能可能受到限制。</p>
+    <button class="btn" onclick="window.location.reload()">重新尝试连接</button>
+  </div>
+
+  <script>
+    // 检测网络状态变化
+    window.addEventListener('online', () => {
+      window.location.reload();
+    });
+  </script>
+</body>
+</html> 

main/manager-web/src/App.vue

@@ -1,6 +1,7 @@
 <template>
   <div id="app">
     <router-view />
+    <cache-viewer v-if="isCDNEnabled" :visible.sync="showCacheViewer" />
   </div>
 </template>
 
@@ -45,4 +46,118 @@ nav {
 }
 </style>
 <script>
+import CacheViewer from '@/components/CacheViewer.vue';
+import { logCacheStatus } from '@/utils/cacheViewer';
+
+export default {
+  components: {
+    CacheViewer
+  },
+  data() {
+    return {
+      showCacheViewer: false,
+      isCDNEnabled: process.env.VUE_APP_USE_CDN === 'true'
+    };
+  },
+  mounted() {
+    // 只有在启用CDN时才添加相关事件和功能
+    if (this.isCDNEnabled) {
+      // 添加全局快捷键Alt+C用于显示缓存查看器
+      document.addEventListener('keydown', this.handleKeyDown);
+      
+      // 在全局对象上添加缓存检查方法，便于调试
+      window.checkCDNCacheStatus = () => {
+        this.showCacheViewer = true;
+      };
+      
+      // 在控制台输出提示信息
+      console.info(
+        '%c[小智服务] CDN缓存检查工具已加载', 
+        'color: #409EFF; font-weight: bold;'
+      );
+      console.info(
+        '按下 Alt+C 组合键或在控制台运行 checkCDNCacheStatus() 可以查看CDN缓存状态'
+      );
+      
+      // 检查Service Worker状态
+      this.checkServiceWorkerStatus();
+    } else {
+      console.info(
+        '%c[小智服务] CDN模式已禁用，使用本地打包资源', 
+        'color: #67C23A; font-weight: bold;'
+      );
+    }
+  },
+  beforeDestroy() {
+    // 只有在启用CDN时才需要移除事件监听
+    if (this.isCDNEnabled) {
+      document.removeEventListener('keydown', this.handleKeyDown);
+    }
+  },
+  methods: {
+    handleKeyDown(e) {
+      // Alt+C 快捷键
+      if (e.altKey && e.key === 'c') {
+        this.showCacheViewer = true;
+      }
+    },
+    async checkServiceWorkerStatus() {
+      // 检查Service Worker是否已注册
+      if ('serviceWorker' in navigator) {
+        try {
+          const registrations = await navigator.serviceWorker.getRegistrations();
+          if (registrations.length > 0) {
+            console.info(
+              '%c[小智服务] Service Worker已注册', 
+              'color: #67C23A; font-weight: bold;'
+            );
+            
+            // 输出缓存状态到控制台
+            setTimeout(async () => {
+              const hasCaches = await logCacheStatus();
+              if (!hasCaches) {
+                console.info(
+                  '%c[小智服务] 还未检测到缓存，请刷新页面或等待缓存建立', 
+                  'color: #E6A23C; font-weight: bold;'
+                );
+                
+                // 开发环境下提供额外提示
+                if (process.env.NODE_ENV === 'development') {
+                  console.info(
+                    '%c[小智服务] 在开发环境中，Service Worker可能无法正常初始化缓存',
+                    'color: #E6A23C; font-weight: bold;'
+                  );
+                  console.info('请尝试以下方法检查Service Worker是否生效:');
+                  console.info('1. 在开发者工具的Application/Application标签页中查看Service Worker状态');
+                  console.info('2. 在开发者工具的Application/Cache/Cache Storage中查看缓存内容');
+                  console.info('3. 使用生产构建(npm run build)并通过HTTP服务器访问以测试完整功能');
+                }
+              }
+            }, 2000);
+          } else {
+            console.info(
+              '%c[小智服务] Service Worker未注册，CDN资源可能无法缓存', 
+              'color: #F56C6C; font-weight: bold;'
+            );
+            
+            if (process.env.NODE_ENV === 'development') {
+              console.info(
+                '%c[小智服务] 在开发环境中，这是正常现象',
+                'color: #E6A23C; font-weight: bold;'
+              );
+              console.info('Service Worker通常只在生产环境中生效');
+              console.info('要测试Service Worker功能:');
+              console.info('1. 运行npm run build构建生产版本');
+              console.info('2. 通过HTTP服务器访问构建后的页面');
+            }
+          }
+        } catch (error) {
+          console.error('检查Service Worker状态失败:', error);
+        }
+      } else {
+        console.warn('当前浏览器不支持Service Worker，CDN资源缓存功能不可用');
+      }
+    }
+  }
+};
 </script>

main/manager-web/src/components/AddModelDialog.vue

@@ -1,12 +1,11 @@
 <template>
-  <el-dialog :visible="dialogVisible" @update:visible="handleVisibleChange" width="975px" center custom-class="custom-dialog" :show-close="false"
+  <el-dialog :visible="dialogVisible" @update:visible="handleVisibleChange" width="975px" center
-    class="center-dialog">
+    custom-class="custom-dialog" :show-close="false" class="center-dialog">
     <div style="margin: 0 18px; text-align: left; padding: 10px; border-radius: 10px;">
       <div style="font-size: 30px; color: #3d4566; margin-top: -10px; margin-bottom: 10px; text-align: center;">
         添加模型
       </div>
 
-
       <button class="custom-close-btn" @click="handleClose">
         ×
       </button>
@@ -19,7 +18,7 @@
             <span style="margin-right: 8px;">是否启用</span>
             <el-switch v-model="formData.isEnabled" class="custom-switch"></el-switch>
           </div>
-          <div style="display: flex; align-items: center;">
+          <div style="display: none; align-items: center;">
             <span style="margin-right: 8px;">设为默认</span>
             <el-switch v-model="formData.isDefault" class="custom-switch"></el-switch>
           </div>
@@ -66,18 +65,10 @@
       <el-form :model="formData.configJson" label-width="auto" label-position="left" class="custom-form">
         <template v-for="(row, rowIndex) in chunkedCallInfoFields">
           <div :key="rowIndex" style="display: flex; gap: 20px; margin-bottom: 0;">
-            <el-form-item
+            <el-form-item v-for="field in row" :key="field.prop" :label="field.label" :prop="field.prop"
-              v-for="field in row"
-              :key="field.prop"
-              :label="field.label"
-              :prop="field.prop"
               style="flex: 1;">
-              <el-input
+              <el-input v-model="formData.configJson[field.prop]" :placeholder="field.placeholder"
-                v-model="formData.configJson[field.prop]"
+                :type="field.type || 'text'" class="custom-input-bg" :show-password="field.type === 'password'">
-                :placeholder="field.placeholder"
-                :type="field.type || 'text'"
-                class="custom-input-bg"
-                :show-password="field.type === 'password'">
               </el-input>
             </el-form-item>
           </div>
@@ -124,7 +115,7 @@ export default {
   watch: {
     visible(val) {
       this.dialogVisible = val;
-      if(val) {
+      if (val) {
         this.initConfigJson();
       } else {
         this.resetForm();

main/manager-web/src/components/CacheViewer.vue

@@ -0,0 +1,207 @@
+<template>
+  <el-dialog
+    title="CDN资源缓存状态"
+    :visible.sync="visible"
+    width="70%"
+    :before-close="handleClose"
+  >
+    <div v-if="isLoading" class="loading-container">
+      <p>正在加载缓存信息...</p>
+    </div>
+    
+    <div v-else>
+      <div v-if="!cacheAvailable" class="no-cache-message">
+        <i class="el-icon-warning-outline"></i>
+        <p>您的浏览器不支持Cache API或Service Worker未安装</p>
+        <el-button type="primary" @click="refreshPage">刷新页面</el-button>
+      </div>
+      
+      <div v-else>
+        <el-alert
+          v-if="cacheData.totalCached === 0"
+          title="未发现缓存的CDN资源"
+          type="warning"
+          :closable="false"
+          show-icon
+        >
+          <p>Service Worker可能尚未完成初始化或缓存尚未建立。请刷新页面或等待一会后再试。</p>
+        </el-alert>
+        
+        <div v-else>
+          <el-alert
+            title="CDN资源缓存状态"
+            type="success"
+            :closable="false"
+            show-icon
+          >
+            共发现 {{ cacheData.totalCached }} 个缓存资源
+          </el-alert>
+          
+          <h3>JavaScript 资源 ({{ cacheData.js.length }})</h3>
+          <el-table :data="cacheData.js" stripe style="width: 100%">
+            <el-table-column prop="url" label="URL" width="auto" show-overflow-tooltip />
+            <el-table-column prop="cached" label="状态" width="100">
+              <template slot-scope="scope">
+                <el-tag type="success" v-if="scope.row.cached">已缓存</el-tag>
+                <el-tag type="danger" v-else>未缓存</el-tag>
+              </template>
+            </el-table-column>
+          </el-table>
+          
+          <h3>CSS 资源 ({{ cacheData.css.length }})</h3>
+          <el-table :data="cacheData.css" stripe style="width: 100%">
+            <el-table-column prop="url" label="URL" width="auto" show-overflow-tooltip />
+            <el-table-column prop="cached" label="状态" width="100">
+              <template slot-scope="scope">
+                <el-tag type="success" v-if="scope.row.cached">已缓存</el-tag>
+                <el-tag type="danger" v-else>未缓存</el-tag>
+              </template>
+            </el-table-column>
+          </el-table>
+        </div>
+      </div>
+    </div>
+    
+    <span slot="footer" class="dialog-footer">
+      <el-button @click="handleClose">关闭</el-button>
+      <el-button type="primary" @click="refreshCache">刷新缓存状态</el-button>
+      <el-button type="danger" @click="clearCache">清除缓存</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+import {
+  getCacheNames,
+  checkCdnCacheStatus,
+  clearAllCaches,
+  logCacheStatus
+} from '../utils/cacheViewer';
+
+export default {
+  name: 'CacheViewer',
+  props: {
+    visible: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+      isLoading: true,
+      cacheAvailable: false,
+      cacheData: {
+        css: [],
+        js: [],
+        totalCached: 0,
+        totalNotCached: 0
+      }
+    };
+  },
+  watch: {
+    visible(newVal) {
+      if (newVal) {
+        this.loadCacheData();
+      }
+    }
+  },
+  methods: {
+    async loadCacheData() {
+      this.isLoading = true;
+      
+      try {
+        // 先检查是否支持缓存API
+        if (!('caches' in window)) {
+          this.cacheAvailable = false;
+          this.isLoading = false;
+          return;
+        }
+        
+        // 检查是否有Service Worker缓存
+        const cacheNames = await getCacheNames();
+        this.cacheAvailable = cacheNames.length > 0;
+        
+        if (this.cacheAvailable) {
+          // 获取CDN缓存状态
+          this.cacheData = await checkCdnCacheStatus();
+          
+          // 在控制台输出完整缓存状态
+          await logCacheStatus();
+        }
+      } catch (error) {
+        console.error('加载缓存数据失败:', error);
+        this.$message.error('加载缓存数据失败');
+      } finally {
+        this.isLoading = false;
+      }
+    },
+    
+    async refreshCache() {
+      this.loadCacheData();
+      this.$message.success('正在刷新缓存状态');
+    },
+    
+    async clearCache() {
+      this.$confirm('确定要清除所有缓存吗?', '警告', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(async () => {
+        try {
+          const success = await clearAllCaches();
+          if (success) {
+            this.$message.success('缓存已清除');
+            await this.loadCacheData();
+          } else {
+            this.$message.error('清除缓存失败');
+          }
+        } catch (error) {
+          console.error('清除缓存失败:', error);
+          this.$message.error('清除缓存失败');
+        }
+      }).catch(() => {
+        this.$message.info('已取消清除');
+      });
+    },
+    
+    refreshPage() {
+      window.location.reload();
+    },
+    
+    handleClose() {
+      this.$emit('update:visible', false);
+    }
+  }
+};
+</script>
+
+<style scoped>
+.loading-container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 20px;
+}
+
+.loading-spinner {
+  margin-bottom: 10px;
+}
+
+.no-cache-message {
+  text-align: center;
+  padding: 20px;
+}
+
+.no-cache-message i {
+  font-size: 48px;
+  color: #E6A23C;
+  margin-bottom: 10px;
+}
+
+h3 {
+  margin-top: 20px;
+  margin-bottom: 10px;
+  font-weight: 500;
+}
+</style> 

main/manager-web/src/components/ModelEditDialog.vue

@@ -17,7 +17,7 @@
             <span style="margin-right: 8px;">是否启用</span>
             <el-switch v-model="form.isEnabled" :active-value="1" :inactive-value="0" class="custom-switch"></el-switch>
           </div>
-          <div style="display: flex; align-items: center;">
+          <div style="display: none; align-items: center;">
             <span style="margin-right: 8px;">设为默认</span>
             <el-switch v-model="form.isDefault" :active-value="1" :inactive-value="0" class="custom-switch"></el-switch>
           </div>
@@ -64,18 +64,10 @@
       <el-form :model="form.configJson" ref="callInfoForm" label-width="auto" class="custom-form">
         <template v-for="(row, rowIndex) in chunkedCallInfoFields">
           <div :key="rowIndex" style="display: flex; gap: 20px; margin-bottom: 0;">
-            <el-form-item
+            <el-form-item v-for="field in row" :key="field.prop" :label="field.label" :prop="field.prop"
-              v-for="field in row"
-              :key="field.prop"
-              :label="field.label"
-              :prop="field.prop"
               style="flex: 1;">
-              <el-input
+              <el-input v-model="form.configJson[field.prop]" :placeholder="field.placeholder" :type="field.type"
-                v-model="form.configJson[field.prop]"
+                class="custom-input-bg" :show-password="field.type === 'password'">
-                :placeholder="field.placeholder"
-                :type="field.type"
-                class="custom-input-bg"
-                :show-password="field.type === 'password'">
               </el-input>
             </el-form-item>
           </div>
@@ -165,57 +157,57 @@ export default {
   },
   methods: {
     resetForm() {
-        this.form = {
+      this.form = {
-            id: "",
+        id: "",
-            modelType: "",
+        modelType: "",
-            modelCode: "",
+        modelCode: "",
-            modelName: "",
+        modelName: "",
-            isDefault: false,
+        isDefault: false,
-            isEnabled: false,
+        isEnabled: false,
-            docLink: "",
+        docLink: "",
-            remark: "",
+        remark: "",
-            sort: 0,
+        sort: 0,
-            configJson: {}
+        configJson: {}
-        };
+      };
-        this.dynamicCallInfoFields.forEach(field => {
+      this.dynamicCallInfoFields.forEach(field => {
-          this.$set(this.form.configJson, field.prop, '');
+        this.$set(this.form.configJson, field.prop, '');
-        });
+      });
     },
     resetProviders() {
       this.providers = [];
       this.providersLoaded = false;
     },
     loadModelData() {
-        if (this.modelData.id) {
+      if (this.modelData.id) {
-            Api.model.getModelConfig(this.modelData.id, ({ data }) => {
+        Api.model.getModelConfig(this.modelData.id, ({ data }) => {
-                if (data.code === 0 && data.data) {
+          if (data.code === 0 && data.data) {
-                    const model = data.data;
+            const model = data.data;
-                    this.pendingProviderType = model.configJson.type;
+            this.pendingProviderType = model.configJson.type;
-                    this.pendingModelData = model;
+            this.pendingModelData = model;
 
-                    if (this.providersLoaded) {
+            if (this.providersLoaded) {
-                      this.loadProviderFields(model.configJson.type);
+              this.loadProviderFields(model.configJson.type);
-                    } else {
+            } else {
-                      this.loadProviders();
+              this.loadProviders();
-                    }
+            }
-                }
+          }
-            });
+        });
-        }
+      }
     },
     handleSave() {
-        const provideCode = this.form.configJson.type;
+      const provideCode = this.form.configJson.type;
-        const formData = {
+      const formData = {
-            id: this.modelData.id,
+        id: this.modelData.id,
-            modelCode: this.form.modelCode,
+        modelCode: this.form.modelCode,
-            modelName: this.form.modelName,
+        modelName: this.form.modelName,
-            isDefault: this.form.isDefault ? 1 : 0,
+        isDefault: this.form.isDefault ? 1 : 0,
-            isEnabled: this.form.isEnabled ? 1 : 0,
+        isEnabled: this.form.isEnabled ? 1 : 0,
-            docLink: this.form.docLink,
+        docLink: this.form.docLink,
-            remark: this.form.remark,
+        remark: this.form.remark,
-            sort: this.form.sort || 0,
+        sort: this.form.sort || 0,
-            configJson: {
+        configJson: {
-              ...this.form.configJson,
+          ...this.form.configJson,
-          }
+        }
       };
       this.$emit("save", { provideCode, formData });
       this.dialogVisible = false;

main/manager-web/src/components/TtsModel.vue

@@ -582,7 +582,7 @@ export default {
 
 .table-container {
   flex: 1;
-  overflow-y: scroll;
+  overflow: auto;
   scrollbar-width: none;
   padding-right: 15px;
   width: calc(100% - 16px);
@@ -641,8 +641,8 @@ export default {
 
 /* 音频播放器容器样式 */
 .custom-audio-container {
-  width: 280px;
+  width: 90%;
-  margin: auto;
+  margin: 0 auto;
 }
 
 /* 新增按钮组样式 */
@@ -668,4 +668,40 @@ export default {
 .save-btn {
   color: #5cca8e !important;
 }
+
+/* 表格单元格自适应 */
+::v-deep .el-table__body-wrapper {
+  overflow-x: hidden !important;
+}
+
+::v-deep .el-table td {
+  white-space: pre-wrap !important;
+  word-break: break-all !important;
+}
+/* 按钮组定位调整 */
+.action-buttons {
+  position: static;
+  padding: 15px 0;
+  background: white;
+  box-shadow: 0 -2px 12px rgba(0,0,0,0.05);
+}
+
+/* 输入框自适应 */
+::v-deep .el-input__inner,
+::v-deep .el-textarea__inner {
+  width: 100% !important;
+  min-width: 120px;
+}
+
+/* 音频输入框特殊处理 */
+.audio-input ::v-deep .el-input__inner {
+  min-width: 200px;
+}
+
+/* 操作按钮弹性布局 */
+::v-deep .el-table__row .el-button {
+  flex-shrink: 0;
+  margin: 2px !important;
+}
+
 </style>

main/manager-web/src/components/VersionFooter.vue

@@ -5,33 +5,17 @@
 </template>
 
 <script>
-import Api from '@/apis/api';
+import { mapState } from 'vuex';
 
 export default {
     name: 'VersionFooter',
-    data() {
+    computed: {
-        return {
+        ...mapState({
-            version: ''
+            version: state => state.pubConfig.version
-        }
+        })
     },
     mounted() {
-        this.getSystemVersion();
+        this.$store.dispatch('fetchPubConfig');
-    },
-    methods: {
-        getSystemVersion() {
-            const storedVersion = sessionStorage.getItem('systemVersion');
-            if (storedVersion) {
-                this.version = storedVersion;
-                return;
-            }
-
-            Api.user.getPubConfig(({ data }) => {
-                if (data.code === 0 && data.data.version) {
-                    this.version = data.data.version;
-                    sessionStorage.setItem('systemVersion', data.data.version);
-                }
-            });
-        }
     }
 }
 </script>

main/manager-web/src/main.js

@@ -6,11 +6,16 @@ import App from './App.vue';
 import router from './router';
 import store from './store';
 import './styles/global.scss';
+import { register as registerServiceWorker } from './registerServiceWorker';
 
 Vue.use(ElementUI);
 
 Vue.config.productionTip = false
 
+// 注册Service Worker
+registerServiceWorker();
+
+// 创建Vue实例
 new Vue({
   router,
   store,

main/manager-web/src/registerServiceWorker.js

@@ -0,0 +1,113 @@
+/* eslint-disable no-console */
+
+export const register = () => {
+  if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
+    window.addEventListener('load', () => {
+      const swUrl = `${process.env.BASE_URL}service-worker.js`;
+      
+      console.info(`[小智服务] 正在尝试注册Service Worker，URL: ${swUrl}`);
+      
+      // 先检查Service Worker是否已注册
+      navigator.serviceWorker.getRegistrations().then(registrations => {
+        if (registrations.length > 0) {
+          console.info('[小智服务] 发现已有Service Worker注册，正在检查更新');
+        }
+        
+        // 继续注册Service Worker
+        navigator.serviceWorker
+          .register(swUrl)
+          .then(registration => {
+            console.info('[小智服务] Service Worker注册成功');
+            
+            // 更新处理
+            registration.onupdatefound = () => {
+              const installingWorker = registration.installing;
+              if (installingWorker == null) {
+                return;
+              }
+              installingWorker.onstatechange = () => {
+                if (installingWorker.state === 'installed') {
+                  if (navigator.serviceWorker.controller) {
+                    // 内容已缓存更新，通知用户刷新
+                    console.log('[小智服务] 新内容可用，请刷新页面');
+                    // 可以在这里展示更新提示
+                    const updateNotification = document.createElement('div');
+                    updateNotification.style.cssText = `
+                      position: fixed;
+                      bottom: 20px;
+                      right: 20px;
+                      background: #409EFF;
+                      color: white;
+                      padding: 12px 20px;
+                      border-radius: 4px;
+                      box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
+                      z-index: 9999;
+                    `;
+                    updateNotification.innerHTML = `
+                      <div style="display: flex; align-items: center;">
+                        <span style="margin-right: 10px;">发现新版本，点击刷新应用</span>
+                        <button style="background: white; color: #409EFF; border: none; padding: 5px 10px; border-radius: 3px; cursor: pointer;">刷新</button>
+                      </div>
+                    `;
+                    document.body.appendChild(updateNotification);
+                    updateNotification.querySelector('button').addEventListener('click', () => {
+                      window.location.reload();
+                    });
+                  } else {
+                    // 一切正常，Service Worker已成功安装
+                    console.log('[小智服务] 内容已缓存供离线使用');
+                    
+                    // 可以在这里初始化缓存
+                    setTimeout(() => {
+                      // 预热CDN缓存
+                      const cdnUrls = [
+                        'https://unpkg.com/element-ui@2.15.14/lib/theme-chalk/index.css',
+                        'https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css',
+                        'https://unpkg.com/vue@2.6.14/dist/vue.min.js',
+                        'https://unpkg.com/vue-router@3.6.5/dist/vue-router.min.js',
+                        'https://unpkg.com/vuex@3.6.2/dist/vuex.min.js',
+                        'https://unpkg.com/element-ui@2.15.14/lib/index.js',
+                        'https://unpkg.com/axios@0.27.2/dist/axios.min.js',
+                        'https://unpkg.com/opus-decoder@0.7.7/dist/opus-decoder.min.js'
+                      ];
+                      
+                      // 预热缓存
+                      cdnUrls.forEach(url => {
+                        fetch(url, { mode: 'no-cors' }).catch(err => {
+                          console.log(`预热缓存 ${url} 失败`, err);
+                        });
+                      });
+                    }, 2000);
+                  }
+                }
+              };
+            };
+          })
+          .catch(error => {
+            console.error('Service Worker 注册失败:', error);
+            
+            if (error.name === 'TypeError' && error.message.includes('Failed to register a ServiceWorker')) {
+              console.warn('[小智服务] 注册Service Worker时出现网络错误，CDN资源可能无法缓存');
+              if (process.env.NODE_ENV === 'production') {
+                console.info(
+                  '可能原因：1. 服务器未配置正确的MIME类型 2. 服务器SSL证书问题 3. 服务器未返回service-worker.js文件'
+                );
+              }
+            }
+          });
+      });
+    });
+  }
+};
+
+export const unregister = () => {
+  if ('serviceWorker' in navigator) {
+    navigator.serviceWorker.ready
+      .then(registration => {
+        registration.unregister();
+      })
+      .catch(error => {
+        console.error(error.message);
+      });
+  }
+}; 

main/manager-web/src/service-worker.js

@@ -0,0 +1,174 @@
+/* global self, workbox */
+
+// 自定义Service Worker安装和激活的处理逻辑
+self.addEventListener('message', (event) => {
+  if (event.data && event.data.type === 'SKIP_WAITING') {
+    self.skipWaiting();
+  }
+});
+
+// CDN资源列表
+const CDN_CSS = [
+  'https://unpkg.com/element-ui@2.15.14/lib/theme-chalk/index.css',
+  'https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css'
+];
+
+const CDN_JS = [
+  'https://unpkg.com/vue@2.6.14/dist/vue.min.js',
+  'https://unpkg.com/vue-router@3.6.5/dist/vue-router.min.js',
+  'https://unpkg.com/vuex@3.6.2/dist/vuex.min.js',
+  'https://unpkg.com/element-ui@2.15.14/lib/index.js',
+  'https://unpkg.com/axios@0.27.2/dist/axios.min.js',
+  'https://unpkg.com/opus-decoder@0.7.7/dist/opus-decoder.min.js'
+];
+
+// 当Service Worker被注入manifest后会自动执行
+const manifest = self.__WB_MANIFEST || [];
+
+// 检查是否启用CDN模式
+const isCDNEnabled = manifest.some(entry => 
+  entry.url === 'cdn-mode' && entry.revision === 'enabled'
+);
+
+console.log(`Service Worker 已初始化, CDN模式: ${isCDNEnabled ? '启用' : '禁用'}`);
+
+// 注入workbox相关代码
+importScripts('https://storage.googleapis.com/workbox-cdn/releases/7.0.0/workbox-sw.js');
+workbox.setConfig({ debug: false });
+
+// 开启workbox
+workbox.core.skipWaiting();
+workbox.core.clientsClaim();
+
+// 预缓存离线页面
+const OFFLINE_URL = '/offline.html';
+workbox.precaching.precacheAndRoute([
+  { url: OFFLINE_URL, revision: null }
+]);
+
+// 添加安装完成事件处理器，在控制台显示安装消息
+self.addEventListener('install', event => {
+  if (isCDNEnabled) {
+    console.log('Service Worker 已安装，开始缓存CDN资源');
+  } else {
+    console.log('Service Worker 已安装，CDN模式禁用，仅缓存本地资源');
+  }
+  
+  // 确保离线页面被缓存
+  event.waitUntil(
+    caches.open('offline-cache').then((cache) => {
+      return cache.add(OFFLINE_URL);
+    })
+  );
+});
+
+// 添加激活事件处理器
+self.addEventListener('activate', event => {
+  console.log('Service Worker 已激活，现在控制着页面');
+  
+  // 清理旧版本缓存
+  event.waitUntil(
+    caches.keys().then(cacheNames => {
+      return Promise.all(
+        cacheNames.filter(cacheName => {
+          // 清理除当前版本外的缓存
+          return cacheName.startsWith('workbox-') && !workbox.core.cacheNames.runtime.includes(cacheName);
+        }).map(cacheName => {
+          return caches.delete(cacheName);
+        })
+      );
+    })
+  );
+});
+
+// 添加fetch事件拦截器，用于查看CDN资源是否命中缓存
+self.addEventListener('fetch', event => {
+  // 只有启用CDN模式时才进行CDN资源缓存监控
+  if (isCDNEnabled) {
+    const url = new URL(event.request.url);
+    
+    // 针对CDN资源，输出是否命中缓存的信息
+    if ([...CDN_CSS, ...CDN_JS].includes(url.href)) {
+      // 不干扰正常的fetch流程，只添加日志
+      console.log(`请求CDN资源: ${url.href}`);
+    }
+  }
+});
+
+// 仅在CDN模式下缓存CDN资源
+if (isCDNEnabled) {
+  // 缓存CDN的CSS资源
+  workbox.routing.registerRoute(
+    ({ url }) => CDN_CSS.includes(url.href),
+    new workbox.strategies.CacheFirst({
+      cacheName: 'cdn-stylesheets',
+      plugins: [
+        new workbox.expiration.ExpirationPlugin({
+          maxAgeSeconds: 365 * 24 * 60 * 60, // 增加到1年缓存
+          maxEntries: 10, // 最多缓存10个CSS文件
+        }),
+        new workbox.cacheableResponse.CacheableResponsePlugin({
+          statuses: [0, 200], // 缓存成功响应
+        }),
+      ],
+    })
+  );
+
+  // 缓存CDN的JS资源
+  workbox.routing.registerRoute(
+    ({ url }) => CDN_JS.includes(url.href),
+    new workbox.strategies.CacheFirst({
+      cacheName: 'cdn-scripts',
+      plugins: [
+        new workbox.expiration.ExpirationPlugin({
+          maxAgeSeconds: 365 * 24 * 60 * 60, // 增加到1年缓存
+          maxEntries: 20, // 最多缓存20个JS文件
+        }),
+        new workbox.cacheableResponse.CacheableResponsePlugin({
+          statuses: [0, 200], // 缓存成功响应
+        }),
+      ],
+    })
+  );
+}
+
+// 无论是否启用CDN模式，都缓存本地静态资源
+workbox.routing.registerRoute(
+  /\.(?:js|css|png|jpg|jpeg|svg|gif|ico|woff|woff2|eot|ttf|otf)$/,
+  new workbox.strategies.StaleWhileRevalidate({
+    cacheName: 'static-resources',
+    plugins: [
+      new workbox.expiration.ExpirationPlugin({
+        maxAgeSeconds: 7 * 24 * 60 * 60, // 7天缓存
+        maxEntries: 50, // 最多缓存50个文件
+      }),
+    ],
+  })
+);
+
+// 缓存HTML页面
+workbox.routing.registerRoute(
+  /\.html$/,
+  new workbox.strategies.NetworkFirst({
+    cacheName: 'html-cache',
+    plugins: [
+      new workbox.expiration.ExpirationPlugin({
+        maxAgeSeconds: 1 * 24 * 60 * 60, // 1天缓存
+        maxEntries: 10, // 最多缓存10个HTML文件
+      }),
+    ],
+  })
+);
+
+// 离线页面 - 使用更可靠的处理方式
+workbox.routing.setCatchHandler(async ({ event }) => {
+  // 根据请求类型返回适当的默认页面
+  switch (event.request.destination) {
+    case 'document':
+      // 如果是网页请求，返回离线页面
+      return caches.match(OFFLINE_URL);
+    default:
+      // 所有其他请求返回错误
+      return Response.error();
+  }
+}); 

main/manager-web/src/store/index.js

@@ -1,6 +1,7 @@
 import { goToPage } from "@/utils";
 import Vue from 'vue';
 import Vuex from 'vuex';
+import Api from '../apis/api';
 import Constant from '../utils/constant';
 
 Vue.use(Vuex)
@@ -9,7 +10,11 @@ export default new Vuex.Store({
   state: {
     token: '',
     userInfo: {}, // 添加用户信息存储
-    isSuperAdmin: false // 添加superAdmin状态
+    isSuperAdmin: false, // 添加superAdmin状态
+    pubConfig: { // 添加公共配置存储
+      version: '',
+      allowUserRegister: false
+    }
   },
   getters: {
     getToken(state) {
@@ -26,6 +31,9 @@ export default new Vuex.Store({
         return state.isSuperAdmin
       }
       return localStorage.getItem('isSuperAdmin') === 'true'
+    },
+    getPubConfig(state) {
+      return state.pubConfig
     }
   },
   mutations: {
@@ -39,6 +47,9 @@ export default new Vuex.Store({
       state.isSuperAdmin = isSuperAdmin
       localStorage.setItem('isSuperAdmin', isSuperAdmin)
     },
+    setPubConfig(state, config) {
+      state.pubConfig = config
+    },
     clearAuth(state) {
       state.token = ''
       state.userInfo = {}
@@ -55,6 +66,17 @@ export default new Vuex.Store({
         goToPage(Constant.PAGE.LOGIN, true);
         window.location.reload(); // 彻底重置状态
       })
+    },
+    // 添加获取公共配置的 action
+    fetchPubConfig({ commit }) {
+      return new Promise((resolve) => {
+        Api.user.getPubConfig(({ data }) => {
+          if (data.code === 0) {
+            commit('setPubConfig', data.data);
+          }
+          resolve();
+        });
+      });
     }
   },
   modules: {

main/manager-web/src/utils/cacheViewer.js

@@ -0,0 +1,142 @@
+/**
+ * 缓存查看工具 - 用于检查CDN资源是否已被Service Worker缓存
+ */
+
+/**
+ * 获取所有Service Worker缓存的名称
+ * @returns {Promise<string[]>} 缓存名称列表
+ */
+export const getCacheNames = async () => {
+  if (!('caches' in window)) {
+    return [];
+  }
+  
+  try {
+    return await caches.keys();
+  } catch (error) {
+    console.error('获取缓存名称失败:', error);
+    return [];
+  }
+};
+
+/**
+ * 获取指定缓存中的所有URL
+ * @param {string} cacheName 缓存名称
+ * @returns {Promise<string[]>} 缓存的URL列表
+ */
+export const getCacheUrls = async (cacheName) => {
+  if (!('caches' in window)) {
+    return [];
+  }
+  
+  try {
+    const cache = await caches.open(cacheName);
+    const requests = await cache.keys();
+    return requests.map(request => request.url);
+  } catch (error) {
+    console.error(`获取缓存 ${cacheName} 的URL失败:`, error);
+    return [];
+  }
+};
+
+/**
+ * 检查特定URL是否已被缓存
+ * @param {string} url 要检查的URL
+ * @returns {Promise<boolean>} 是否已缓存
+ */
+export const isUrlCached = async (url) => {
+  if (!('caches' in window)) {
+    return false;
+  }
+  
+  try {
+    const cacheNames = await getCacheNames();
+    for (const cacheName of cacheNames) {
+      const cache = await caches.open(cacheName);
+      const match = await cache.match(url);
+      if (match) {
+        return true;
+      }
+    }
+    return false;
+  } catch (error) {
+    console.error(`检查URL ${url} 是否缓存失败:`, error);
+    return false;
+  }
+};
+
+/**
+ * 获取当前页面所有CDN资源的缓存状态
+ * @returns {Promise<Object>} 缓存状态对象
+ */
+export const checkCdnCacheStatus = async () => {
+  // 从CDN缓存中查找资源
+  const cdnCaches = ['cdn-stylesheets', 'cdn-scripts'];
+  const results = {
+    css: [],
+    js: [],
+    totalCached: 0,
+    totalNotCached: 0
+  };
+  
+  for (const cacheName of cdnCaches) {
+    try {
+      const urls = await getCacheUrls(cacheName);
+      
+      // 区分CSS和JS资源
+      for (const url of urls) {
+        if (url.endsWith('.css')) {
+          results.css.push({ url, cached: true });
+        } else if (url.endsWith('.js')) {
+          results.js.push({ url, cached: true });
+        }
+        results.totalCached++;
+      }
+    } catch (error) {
+      console.error(`获取 ${cacheName} 缓存信息失败:`, error);
+    }
+  }
+  
+  return results;
+};
+
+/**
+ * 清除所有Service Worker缓存
+ * @returns {Promise<boolean>} 是否成功清除
+ */
+export const clearAllCaches = async () => {
+  if (!('caches' in window)) {
+    return false;
+  }
+  
+  try {
+    const cacheNames = await getCacheNames();
+    for (const cacheName of cacheNames) {
+      await caches.delete(cacheName);
+    }
+    return true;
+  } catch (error) {
+    console.error('清除所有缓存失败:', error);
+    return false;
+  }
+};
+
+/**
+ * 将缓存状态输出到控制台
+ */
+export const logCacheStatus = async () => {
+  console.group('Service Worker 缓存状态');
+  
+  const cacheNames = await getCacheNames();
+  console.log('已发现的缓存:', cacheNames);
+  
+  for (const cacheName of cacheNames) {
+    const urls = await getCacheUrls(cacheName);
+    console.group(`缓存: ${cacheName} (${urls.length} 项)`);
+    urls.forEach(url => console.log(url));
+    console.groupEnd();
+  }
+  
+  console.groupEnd();
+  return cacheNames.length > 0;
+}; 

main/manager-web/src/views/DeviceManagement.vue

@@ -1,67 +1,101 @@
 <template>
   <div class="welcome">
     <HeaderBar />
-    <el-main style="padding: 20px; display: flex; flex-direction: column;">
+
-      <div class="table-container">
+    <div class="operation-bar">
-        <h3 class="device-list-title">设备列表</h3>
+      <h2 class="page-title">设备管理</h2>
-        <el-table ref="deviceTable" :data="paginatedDeviceList" @selection-change="handleSelectionChange"
+      <div class="right-operations">
-          style="width: 100%; margin-top: 20px" border stripe>
+        <el-input placeholder="请输入设备型号或Mac地址查询" v-model="searchKeyword"
-          <el-table-column type="selection" align="center" width="60"></el-table-column>
+                 class="search-input" @keyup.enter.native="handleSearch" clearable />
-          <el-table-column label="设备型号" prop="model" flex></el-table-column>
+        <el-button class="btn-search" @click="handleSearch">搜索</el-button>
-          <el-table-column label="固件版本" prop="firmwareVersion" width="120"></el-table-column>
+      </div>
-          <el-table-column label="Mac地址" prop="macAddress"></el-table-column>
+    </div>
-          <el-table-column label="绑定时间" prop="bindTime" width="200"></el-table-column>
+
-          <el-table-column label="最近对话" prop="lastConversation" width="140"></el-table-column>
+    <div class="main-wrapper">
-          <el-table-column label="备注" width="180">
+      <div class="content-panel">
-            <template slot-scope="scope">
+        <div class="content-area">
-              <el-input v-if="scope.row.isEdit" v-model="scope.row.remark" size="mini"
+          <el-card class="device-card" shadow="never">
-                @blur="stopEditRemark(scope.$index)"></el-input>
+            <el-table
-              <span v-else>
+              ref="deviceTable"
-                <i v-if="!scope.row.remark" class="el-icon-edit" @click="startEditRemark(scope.$index, scope.row)"></i>
+              :data="paginatedDeviceList"
-                <span v-else @click="startEditRemark(scope.$index, scope.row)">
+              @selection-change="handleSelectionChange"
-                  {{ scope.row.remark }}
+              class="transparent-table"
-                </span>
+              :header-cell-class-name="headerCellClassName">
-              </span>
+              <el-table-column type="selection" align="center" width="120"></el-table-column>
-            </template>
+              <el-table-column label="设备型号" prop="model" align="center"></el-table-column>
-          </el-table-column>
+              <el-table-column label="固件版本" prop="firmwareVersion" align="center" ></el-table-column>
-          <el-table-column label="OTA升级" width="120">
+              <el-table-column label="Mac地址" prop="macAddress" align="center"></el-table-column>
-            <template slot-scope="scope">
+              <el-table-column label="绑定时间" prop="bindTime" align="center"></el-table-column>
-              <el-switch v-model="scope.row.otaSwitch" size="mini" active-color="#13ce66"
+              <el-table-column label="最近对话" prop="lastConversation" align="center"></el-table-column>
-                inactive-color="#ff4949"></el-switch>
+              <el-table-column label="备注" align="center">
-            </template>
+                <template slot-scope="scope">
-          </el-table-column>
+                  <el-input v-if="scope.row.isEdit" v-model="scope.row.remark" size="mini"
-          <el-table-column label="操作" width="80">
+                    @blur="stopEditRemark(scope.$index)"></el-input>
-            <template slot-scope="scope">
+                  <span v-else>
-              <el-button size="mini" type="text" @click="handleUnbind(scope.row.device_id)" style="color: #ff4949">
+                    <i v-if="!scope.row.remark" class="el-icon-edit" @click="startEditRemark(scope.$index, scope.row)"></i>
-                解绑
+                    <span v-else @click="startEditRemark(scope.$index, scope.row)">
-              </el-button>
+                      {{ scope.row.remark }}
-            </template>
+                    </span>
-          </el-table-column>
+                  </span>
-        </el-table>
+                </template>
-        <div class="table_bottom">
+              </el-table-column>
-          <div class="ctrl_btn">
+              <el-table-column label="OTA升级" align="center">
-            <el-button size="mini" type="primary" class="select-all-btn" @click="toggleAllSelection">
+                <template slot-scope="scope">
-              {{ isAllSelected ? '取消全选' : '全选' }}
+                  <el-switch v-model="scope.row.otaSwitch" size="mini" active-color="#13ce66"
-            </el-button>
+                    inactive-color="#ff4949"></el-switch>
-            <el-button type="primary" size="mini" class="add-device-btn" @click="handleAddDevice">
+                </template>
-              新增
+              </el-table-column>
-            </el-button>
+              <el-table-column label="操作" align="center">
-          </div>
+                <template slot-scope="scope">
-          <div class="custom-pagination">
+                  <el-button size="mini" type="text" @click="handleUnbind(scope.row.device_id)">
-            <button class="pagination-btn" :disabled="currentPage === 1" @click="goFirst">首页</button>
+                    解绑
-            <button class="pagination-btn" :disabled="currentPage === 1" @click="goPrev">上一页</button>
+                  </el-button>
-            <button v-for="page in visiblePages" :key="page" class="pagination-btn"
+                </template>
-              :class="{ active: page === currentPage }" @click="goToPage(page)">
+              </el-table-column>
-              {{ page }}
+            </el-table>
-            </button>
+
-            <button class="pagination-btn" :disabled="currentPage === pageCount" @click="goNext">下一页</button>
+            <div class="table_bottom">
-            <span class="total-text">共{{ deviceList.length }}条记录</span>
+              <div class="ctrl_btn">
-          </div>
+                <el-button size="mini" type="primary" class="select-all-btn" @click="toggleAllSelection">
+                  {{ isAllSelected ? '取消全选' : '全选' }}
+                </el-button>
+                <el-button type="success" size="mini" class="add-device-btn" @click="handleAddDevice">
+                  新增
+                </el-button>
+                <el-button size="mini" type="danger" icon="el-icon-delete"
+                  @click="deleteSelected">解绑</el-button>
+              </div>
+              <div class="custom-pagination">
+                <el-select v-model="pageSize" @change="handlePageSizeChange" class="page-size-select">
+                    <el-option
+                        v-for="item in pageSizeOptions"
+                        :key="item"
+                        :label="`${item}条/页`"
+                        :value="item">
+                    </el-option>
+                </el-select>
+                <button class="pagination-btn" :disabled="currentPage === 1" @click="goFirst">首页</button>
+                <button class="pagination-btn" :disabled="currentPage === 1" @click="goPrev">上一页</button>
+                <button
+                  v-for="page in visiblePages"
+                  :key="page"
+                  class="pagination-btn"
+                  :class="{ active: page === currentPage }"
+                  @click="goToPage(page)">
+                  {{ page }}
+                </button>
+                <button class="pagination-btn" :disabled="currentPage === pageCount" @click="goNext">下一页</button>
+                <span class="total-text">共{{ deviceList.length }}条记录</span>
+              </div>
+            </div>
+          </el-card>
         </div>
       </div>
-      <AddDeviceDialog :visible.sync="addDeviceDialogVisible" :agent-id="currentAgentId"
+    </div>
-        @refresh="fetchBindDevices(currentAgentId)" />
+
-    </el-main>
+    <AddDeviceDialog :visible.sync="addDeviceDialogVisible" :agent-id="currentAgentId"
+      @refresh="fetchBindDevices(currentAgentId)" />
+
   </div>
 </template>
 
@@ -77,22 +111,35 @@ export default {
       addDeviceDialogVisible: false,
       selectedDevices: [],
       isAllSelected: false,
+      searchKeyword: "",
+      activeSearchKeyword: "",
       currentAgentId: this.$route.query.agentId || '',
       currentPage: 1,
       pageSize: 5,
+      pageSizeOptions: [5, 10, 20, 50, 100],
       deviceList: [],
       loading: false,
       userApi: null,
+
     };
   },
   computed: {
+    filteredDeviceList() {
+      const keyword = this.activeSearchKeyword.toLowerCase();
+      if (!keyword) return this.deviceList;
+      return this.deviceList.filter(device =>
+        (device.model && device.model.toLowerCase().includes(keyword)) ||
+        (device.macAddress && device.macAddress.toLowerCase().includes(keyword))
+      );
+    },
+
     paginatedDeviceList() {
       const start = (this.currentPage - 1) * this.pageSize;
       const end = start + this.pageSize;
-      return this.deviceList.slice(start, end);
+      return this.filteredDeviceList.slice(start, end);
     },
     pageCount() {
-      return Math.ceil(this.deviceList.length / this.pageSize);
+      return Math.ceil(this.filteredDeviceList.length / this.pageSize);
     },
     visiblePages() {
       const pages = [];
@@ -117,6 +164,14 @@ export default {
     }
   },
   methods: {
+    handlePageSizeChange(val) {
+      this.pageSize = val;
+      this.currentPage = 1;
+    },
+    handleSearch() {
+      this.activeSearchKeyword = this.searchKeyword;
+      this.currentPage = 1;
+    },
 
     handleSelectionChange(val) {
       this.selectedDevices = val;
@@ -126,6 +181,55 @@ export default {
       this.$refs.deviceTable.toggleAllSelection();
     },
 
+    deleteSelected() {
+      if (this.selectedDevices.length === 0) {
+        this.$message.warning({
+          message: '请至少选择一条记录',
+          showClose: true
+        });
+        return;
+      }
+
+      this.$confirm(`确认要解绑选中的 ${this.selectedDevices.length} 台设备吗？`, '警告', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        const deviceIds = this.selectedDevices.map(device => device.device_id);
+        this.batchUnbindDevices(deviceIds);
+      });
+    },
+
+    batchUnbindDevices(deviceIds) {
+      const promises = deviceIds.map(id => {
+        return new Promise((resolve, reject) => {
+          Api.device.unbindDevice(id, ({ data }) => {
+            if (data.code === 0) {
+              resolve();
+            } else {
+              reject(data.msg || '解绑失败');
+            }
+          });
+        });
+      });
+
+      Promise.all(promises)
+        .then(() => {
+          this.$message.success({
+            message: `成功解绑 ${deviceIds.length} 台设备`,
+            showClose: true
+          });
+          this.fetchBindDevices(this.currentAgentId);
+          this.selectedDevices = [];
+          this.isAllSelected = false;
+        })
+        .catch(error => {
+          this.$message.error({
+            message: error || '批量解绑过程中出现错误',
+            showClose: true
+          });
+        });
+    },
 
     handleAddDevice() {
       this.addDeviceDialogVisible = true;
@@ -176,9 +280,7 @@ export default {
       Api.device.getAgentBindDevices(agentId, ({ data }) => {
         this.loading = false;
         if (data.code === 0) {
-          // 格式化日期并按照绑定时间降序排列
           this.deviceList = data.data.map(device => {
-            // 格式化绑定时间
             const bindDate = new Date(device.createDate);
             const formattedBindTime = `${bindDate.getFullYear()}-${(bindDate.getMonth() + 1).toString().padStart(2, '0')}-${bindDate.getDate().toString().padStart(2, '0')} ${bindDate.getHours().toString().padStart(2, '0')}:${bindDate.getMinutes().toString().padStart(2, '0')}:${bindDate.getSeconds().toString().padStart(2, '0')}`;
             return {
@@ -186,25 +288,30 @@ export default {
               model: device.board,
               firmwareVersion: device.appVersion,
               macAddress: device.macAddress,
-              bindTime: formattedBindTime, // 使用格式化后的时间
+              bindTime: formattedBindTime,
               lastConversation: device.lastConnectedAt,
               remark: device.alias,
               isEdit: false,
               otaSwitch: device.autoUpdate === 1,
-              // 添加原始时间用于排序
               rawBindTime: new Date(device.createDate).getTime()
             };
           })
-            // 按照绑定时间降序排序
+              .sort((a, b) => a.rawBindTime - b.rawBindTime);
-            .sort((a, b) => a.rawBindTime - b.rawBindTime);
+          this.activeSearchKeyword = "";
+          this.searchKeyword = "";
         } else {
           this.$message.error(data.msg || '获取设备列表失败');
         }
       });
     },
+    headerCellClassName({columnIndex}) {
+      if (columnIndex === 0) {
+        return "custom-selection-header";
+      }
+      return "";
+    }
   }
 };
-
 </script>
 
 <style scoped>
@@ -213,62 +320,203 @@ export default {
   min-height: 506px;
   height: 100vh;
   display: flex;
+  position: relative;
   flex-direction: column;
-  background: linear-gradient(145deg, #e6eeff, #eff0ff);
+  background: linear-gradient(to bottom right, #dce8ff, #e4eeff, #e6cbfd);
   background-size: cover;
-  background-position: center;
   -webkit-background-size: cover;
   -o-background-size: cover;
 }
 
-.table-container {
+.main-wrapper {
-  background: #f9fafc;
+  margin: 5px 22px;
-  padding: 20px;
+  border-radius: 15px;
-  border-radius: 20px;
+  min-height: calc(100vh - 200px);
+  height: auto;
+  max-height: 80vh;
   box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
-  margin-top: 15px;
+  position: relative;
+  background: rgba(237, 242, 255, 0.5);
+  display: flex;
+  flex-direction: column;
 }
 
-.add-device-btn {
+.operation-bar {
-  background: linear-gradient(135deg, #6b8cff, #a966ff) !important;
+  display: flex;
-  border: none !important;
+  justify-content: space-between;
-  color: white !important;
+  align-items: center;
-  margin-left: 10px;
+  padding: 16px 24px;
-  height: 32px;
-  padding: 7px 12px;
-  border-radius: 4px !important;
-  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
-
-  &:hover {
-    transform: translateY(-1px);
-    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
-  }
 }
 
-.device-list-title {
+.page-title {
-  float: left;
+  font-size: 24px;
-  font-size: 18px;
+  margin: 0;
-  font-weight: 700;
-  margin: 5px;
   color: #2c3e50;
 }
 
-.el-icon-edit {
+.right-operations {
-  color: #409eff;
+  display: flex;
-  cursor: pointer;
+  gap: 10px;
+  margin-left: auto;
+}
+
+.search-input {
+  width: 280px;
+  border-radius: 4px;
+}
+
+.btn-search {
+  background: linear-gradient(135deg, #6b8cff, #a966ff);
+  border: none;
+  color: white;
+}
+
+::v-deep .search-input .el-input__inner {
+  border-radius: 4px;
+  border: 1px solid #DCDFE6;
+  background-color: white;
+  transition: border-color 0.2s;
+}
+
+::v-deep .page-size-select{
+  width: 100px;
+  margin-right: 8px;
+}
+
+::v-deep .page-size-select .el-input__inner{
+  height: 32px;
+  line-height: 32px;
+  border-radius: 4px;
+  border: 1px solid #e4e7ed;
+  background: #dee7ff;
+  color: #606266;
   font-size: 14px;
-  vertical-align: middle;
+}
+::v-deep .page-size-select .el-input__suffix{
+  right: 6px;
+  width: 15px;
+  height: 20px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  top: 6px;
+  border-radius: 4px;
+}
+
+::v-deep .page-size-select .el-input__suffix-inner{
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+}
+::v-deep .page-size-select .el-icon-arrow-up:before{
+  content: "";
+  display: inline-block;
+  border-left: 6px solid transparent;
+  border-right: 6px solid transparent;
+  border-top: 9px solid #606266;
+  position: relative;
+  transform: rotate(0deg);
+  transition: transform 0.3s;
+}
+
+::v-deep .search-input .el-input__inner:focus {
+  border-color: #6b8cff;
+  outline: none;
+}
+
+.content-panel {
+  flex: 1;
+  display: flex;
+  overflow: hidden;
+  height: 100%;
+  border-radius: 15px;
+  background: transparent;
+  border: 1px solid #fff;
+}
+
+.content-area {
+  flex: 1;
+  height: 100%;
+  min-width: 600px;
+  overflow: auto;
+  background-color: white;
+  display: flex;
+  flex-direction: column;
+}
+
+.device-card {
+  background: white;
+  border: none;
+  box-shadow: none;
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  overflow: hidden;
+}
+
+.table_bottom {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-top: 10px;
+  padding-bottom: 10px;
+}
+
+.ctrl_btn {
+  display: flex;
+  gap: 8px;
+  padding-left: 26px;
+}
+
+.ctrl_btn .el-button {
+  min-width: 72px;
+  height: 32px;
+  padding: 7px 12px 7px 10px;
+  font-size: 12px;
+  border-radius: 4px;
+  line-height: 1;
+  font-weight: 500;
+  border: none;
+  transition: all 0.3s ease;
+  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
+}
+
+.ctrl_btn .el-button:hover {
+  transform: translateY(-1px);
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
+}
+
+.ctrl_btn .el-button--primary {
+  background: #5f70f3;
+  color: white;
+}
+
+.ctrl_btn .el-button--success {
+  background: #5bc98c;
+  color: white;
+}
+
+.ctrl_btn .el-button--danger {
+  background: #fd5b63;
+  color: white;
 }
 
 .custom-pagination {
   display: flex;
   align-items: center;
-  gap: 8px;
+  gap: 10px;
-  margin-top: 15px;
 }
 
-.pagination-btn {
+.custom-pagination .el-select {
-  min-width: 28px;
+  margin-right: 8px;
+}
+
+.custom-pagination .pagination-btn:first-child,
+.custom-pagination .pagination-btn:nth-child(2),
+.custom-pagination .pagination-btn:nth-last-child(2),
+.custom-pagination .pagination-btn:nth-child(3) {
+  min-width: 60px;
   height: 32px;
   padding: 0 12px;
   border-radius: 4px;
@@ -280,63 +528,127 @@ export default {
   transition: all 0.3s ease;
 }
 
-.pagination-btn:first-child,
+.custom-pagination .pagination-btn:first-child:hover,
-.pagination-btn:nth-child(2),
+.custom-pagination .pagination-btn:nth-child(2):hover,
-.pagination-btn:nth-last-child(2) {
+.custom-pagination .pagination-btn:nth-last-child(2):hover,
-  min-width: 60px;
+.custom-pagination .pagination-btn:nth-child(3):hover {
-}
-
-.pagination-btn:hover {
   background: #d7dce6;
 }
 
-.pagination-btn:disabled {
+.custom-pagination .pagination-btn:disabled {
   opacity: 0.6;
   cursor: not-allowed;
 }
 
-.pagination-btn.active {
+.custom-pagination .pagination-btn:not(:first-child):not(:nth-child(3)):not(:nth-child(2)):not(:nth-last-child(2)) {
+  min-width: 28px;
+  height: 32px;
+  padding: 0;
+  border-radius: 4px;
+  border: 1px solid transparent;
+  background: transparent;
+  color: #606266;
+  font-size: 14px;
+  cursor: pointer;
+  transition: all 0.3s ease;
+}
+
+.custom-pagination .pagination-btn:not(:first-child):not(:nth-child(3)):not(:nth-child(2)):not(:nth-last-child(2)):hover {
+  background: rgba(245, 247, 250, 0.3);
+}
+
+.custom-pagination .pagination-btn.active {
   background: #5f70f3 !important;
   color: #ffffff !important;
   border-color: #5f70f3 !important;
 }
 
-.total-text {
+.custom-pagination .pagination-btn.active:hover {
+  background: #6d7cf5 !important;
+}
+
+.custom-pagination .total-text {
   color: #909399;
   font-size: 14px;
   margin-left: 10px;
 }
 
-.table_bottom {
+:deep(.transparent-table) {
-  display: flex;
+  background: white;
-  justify-content: space-between;
+  border: none;
-  align-items: center;
-  margin-top: 20px;
 }
 
-.ctrl_btn {
+:deep(.transparent-table .el-table__header th) {
+  background: white !important;
+  color: black;
+  border-right: none !important;
+}
+
+:deep(.transparent-table .el-table__body tr td) {
+  border-top: 1px solid rgba(0, 0, 0, 0.04);
+  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
+  border-right: none !important;
+}
+
+:deep(.transparent-table .el-table__header tr th:first-child .cell),
+:deep(.transparent-table .el-table__body tr td:first-child .cell) {
+  padding-left: 10px;
+}
+
+:deep(.el-icon-edit) {
+  color: #7079aa;
+  cursor: pointer;
+}
+
+:deep(.el-icon-edit:hover) {
+  color: #5a64b5;
+}
+
+:deep(.custom-selection-header .el-checkbox) {
+  display: none !important;
+}
+
+:deep(.custom-selection-header::after) {
+  content: "选择";
+  display: inline-block;
+  color: black;
+  font-weight: bold;
+  padding-bottom: 18px;
+}
+
+:deep(.el-table .el-button--text) {
+  color: #7079aa;
+}
+
+:deep(.el-table .el-button--text:hover) {
+  color: #5a64b5;
+}
+
+:deep(.transparent-table) {
+  flex: 1;
   display: flex;
-  gap: 8px;
+  flex-direction: column;
-  padding-left: 26px;
+  max-height: calc(100vh - 330px);
+}
 
-  .el-button {
+:deep(.el-table__body-wrapper) {
-    min-width: 72px;
+  flex: 1;
-    height: 32px;
+  overflow: auto;
-    padding: 7px 12px;
+  max-height: none !important;
-    border-radius: 4px;
+}
-    border: none;
-    transition: all 0.3s;
-    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
 
-    &:hover {
+:deep(.el-table__header-wrapper) {
-      transform: translateY(-1px);
+  flex-shrink: 0;
-      box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
+}
-    }
+
+@media (min-width: 1144px) {
+  .table_bottom {
+    margin-top: 40px;
   }
 
-  .el-button--primary {
+  :deep(.transparent-table) .el-table__body tr td {
-    background: #5f70f3;
+    padding-top: 16px;
-    color: white;
+    padding-bottom: 16px;
   }
 }
 </style>

main/manager-web/src/views/ModelConfig.vue

@@ -43,49 +43,49 @@
 
         <!-- 右侧内容 -->
         <div class="content-area">
-          <el-table ref="modelTable" style="width: 100%" :header-cell-style="{ background: 'transparent' }"
+          <el-card class="model-card" shadow="never">
-            :data="modelList" class="data-table" header-row-class-name="table-header"
+            <el-table ref="modelTable" style="width: 100%" :header-cell-style="{ background: 'transparent' }"
-            :header-cell-class-name="headerCellClassName" @selection-change="handleSelectionChange">
+              :data="modelList" class="data-table" header-row-class-name="table-header"
-            <el-table-column type="selection" width="55" align="center"></el-table-column>
+              :header-cell-class-name="headerCellClassName" @selection-change="handleSelectionChange">
-            <el-table-column label="模型名称" prop="modelName" align="center"></el-table-column>
+              <el-table-column type="selection" width="55" align="center"></el-table-column>
-            <el-table-column label="模型编码" prop="modelCode" align="center"></el-table-column>
+              <el-table-column label="模型名称" prop="modelName" align="center"></el-table-column>
-            <el-table-column label="提供商" align="center">
+              <el-table-column label="模型编码" prop="modelCode" align="center"></el-table-column>
-              <template slot-scope="scope">
+              <el-table-column label="提供商" align="center">
-                {{ scope.row.configJson.type || '未知' }}
+                <template slot-scope="scope">
-              </template>
+                  {{ scope.row.configJson.type || '未知' }}
-            </el-table-column>
+                </template>
-            <el-table-column label="是否启用" align="center">
+              </el-table-column>
-              <template slot-scope="scope">
+              <el-table-column label="是否启用" align="center">
-                <el-switch v-model="scope.row.isEnabled" class="custom-switch" :active-value="1" :inactive-value="0"
+                <template slot-scope="scope">
-                  @change="handleStatusChange(scope.row)" />
+                  <el-switch v-model="scope.row.isEnabled" class="custom-switch" :active-value="1" :inactive-value="0"
-              </template>
+                    @change="handleStatusChange(scope.row)" />
-            </el-table-column>
+                </template>
-            <el-table-column label="是否默认" align="center">
+              </el-table-column>
-              <template slot-scope="scope">
+              <el-table-column label="是否默认" align="center">
-                <el-switch v-model="scope.row.isDefault" class="custom-switch" :active-value="1" :inactive-value="0"
+                <template slot-scope="scope">
-                  @change="handleDefaultChange(scope.row)" />
+                  <el-switch v-model="scope.row.isDefault" class="custom-switch" :active-value="1" :inactive-value="0"
-              </template>
+                    @change="handleDefaultChange(scope.row)" />
-            </el-table-column>
+                </template>
-            <el-table-column v-if="activeTab === 'tts'" label="音色管理" align="center">
+              </el-table-column>
-              <template slot-scope="scope">
+              <el-table-column v-if="activeTab === 'tts'" label="音色管理" align="center">
-                <el-button type="text" size="mini" @click="openTtsDialog(scope.row)" class="voice-management-btn">
+                <template slot-scope="scope">
-                  音色管理
+                  <el-button type="text" size="mini" @click="openTtsDialog(scope.row)" class="voice-management-btn">
-                </el-button>
+                    音色管理
-              </template>
+                  </el-button>
-            </el-table-column>
+                </template>
-            <el-table-column label="操作" align="center" width="150px">
+              </el-table-column>
-              <template slot-scope="scope">
+              <el-table-column label="操作" align="center" width="150px">
-                <el-button type="text" size="mini" @click="editModel(scope.row)" class="edit-btn">
+                <template slot-scope="scope">
-                  修改
+                  <el-button type="text" size="mini" @click="editModel(scope.row)" class="edit-btn">
-                </el-button>
+                    修改
-                <el-button type="text" size="mini" @click="deleteModel(scope.row)" class="delete-btn">
+                  </el-button>
-                  删除
+                  <el-button type="text" size="mini" @click="deleteModel(scope.row)" class="delete-btn">
-                </el-button>
+                    删除
-              </template>
+                  </el-button>
-            </el-table-column>
+                </template>
-          </el-table>
+              </el-table-column>
-
+            </el-table>
-          <div class="table-footer">
+            <div class="table-footer">
             <div class="batch-actions">
               <el-button size="mini" type="primary" @click="selectAll">
                 {{ isAllSelected ?
@@ -99,6 +99,16 @@
               </el-button>
             </div>
             <div class="custom-pagination">
+
+              <el-select v-model="pageSize" @change="handlePageSizeChange" class="page-size-select">
+                  <el-option
+                    v-for="item in pageSizeOptions"
+                    :key="item"
+                    :label="`${item}条/页`"
+                    :value="item">
+                  </el-option>
+              </el-select>
+
               <button class="pagination-btn" :disabled="currentPage === 1" @click="goFirst">首页</button>
               <button class="pagination-btn" :disabled="currentPage === 1" @click="goPrev">上一页</button>
 
@@ -111,6 +121,7 @@
               <span class="total-text">共{{ total }}条记录</span>
             </div>
           </div>
+          </el-card>
         </div>
       </div>
 
@@ -141,8 +152,9 @@ export default {
       ttsDialogVisible: false,
       selectedTtsModelId: '',
       modelList: [],
+      pageSizeOptions: [5, 10, 20, 50, 100],
       currentPage: 1,
-      pageSize: 5,
+      pageSize: 10,
       total: 0,
       selectedModels: [],
       isAllSelected: false
@@ -154,7 +166,6 @@ export default {
   },
 
   computed: {
-
     modelTypeText() {
       const map = {
         vad: '语言活动检测模型(VAD)',
@@ -166,8 +177,6 @@ export default {
       }
       return map[this.activeTab] || '模型配置'
     },
-
-
     pageCount() {
       return Math.ceil(this.total / this.pageSize);
     },
@@ -189,6 +198,11 @@ export default {
   },
 
   methods: {
+    handlePageSizeChange(val) {
+      this.pageSize = val;
+      this.currentPage = 1;
+      this.loadData();
+    },
     openTtsDialog(row) {
       this.selectedTtsModelId = row.id;
       this.ttsDialogVisible = true;
@@ -201,7 +215,8 @@ export default {
     },
     handleMenuSelect(index) {
       this.activeTab = index;
-      this.currentPage = 1;
+      this.currentPage = 1;  // 重置到第一页
+      this.pageSize = 10;     // 可选：重置每页条数
       this.loadData();
     },
     handleSearch() {
@@ -446,7 +461,9 @@ export default {
 .main-wrapper {
   margin: 5px 22px;
   border-radius: 15px;
-  min-height: 600px;
+  min-height: calc(100vh - 235px);
+  height: auto;
+  max-height: 80vh;
   box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
   position: relative;
   background: rgba(237, 242, 255, 0.5);
@@ -464,12 +481,6 @@ export default {
   margin: 0;
 }
 
-.right-operations {
-  display: flex;
-  gap: 10px;
-  margin-left: auto;
-}
-
 .content-panel {
   flex: 1;
   display: flex;
@@ -542,17 +553,10 @@ export default {
   padding: 24px;
   height: 100%;
   min-width: 600px;
-  overflow-x: auto;
+  overflow: hidden;
   background-color: white;
-
-}
-
-.title-bar {
   display: flex;
-  justify-content: space-between;
+  flex-direction: column;
-  align-items: center;
-  margin-bottom: 24px;
-  flex-wrap: nowrap;
 }
 
 .action-group {
@@ -576,6 +580,11 @@ export default {
   color: white;
 }
 
+.btn-search:hover {
+  opacity: 0.9;
+  transform: translateY(-1px);
+}
+
 ::v-deep .search-input .el-input__inner {
   border-radius: 4px;
   border: 1px solid #DCDFE6;
@@ -583,22 +592,53 @@ export default {
   transition: border-color 0.2s;
 }
 
+::v-deep .page-size-select{
+  width: 100px;
+  margin-right: 8px;
+}
+
+::v-deep .page-size-select .el-input__inner{
+  height: 32px;
+  line-height: 32px;
+  border-radius: 4px;
+  border: 1px solid #e4e7ed;
+  background: #dee7ff;
+  color: #606266;
+  font-size: 14px;
+}
+::v-deep .page-size-select .el-input__suffix{
+  right: 6px;
+  width: 15px;
+  height: 20px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  top: 6px;
+  border-radius: 4px;
+}
+
+::v-deep .page-size-select .el-input__suffix-inner{
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+}
+::v-deep .page-size-select .el-icon-arrow-up:before{
+  content: "";
+  display: inline-block;
+  border-left: 6px solid transparent;
+  border-right: 6px solid transparent;
+  border-top: 9px solid #606266;
+  position: relative;
+  transform: rotate(0deg);
+  transition: transform 0.3s;
+}
+
 ::v-deep .search-input .el-input__inner:focus {
   border-color: #6b8cff;
   outline: none;
 }
 
-.btn-search {
-  background: linear-gradient(135deg, #6b8cff, #a966ff);
-  border: none;
-  color: white;
-}
-
-.btn-search:hover {
-  opacity: 0.9;
-  transform: translateY(-1px);
-}
-
 .data-table {
   border-radius: 6px;
   overflow: hidden;
@@ -622,6 +662,9 @@ export default {
   align-items: center;
   padding: 16px 0;
   width: 100%;
+  flex-shrink: 0;
+  min-height: 60px;
+  background: white;
 }
 
 .batch-actions {
@@ -629,12 +672,6 @@ export default {
   gap: 8px;
 }
 
-.title-wrapper {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-
 .batch-actions .el-button {
   min-width: 72px;
   height: 32px;
@@ -686,11 +723,6 @@ export default {
   background-color: transparent !important;
 }
 
-.pagination-container {
-  display: flex;
-  justify-content: flex-end;
-}
-
 ::v-deep .el-table .custom-selection-header .cell .el-checkbox__inner {
   display: none !important;
 }
@@ -791,11 +823,11 @@ export default {
   display: flex;
   align-items: center;
   gap: 8px;
-  margin-top: 15px;
 
   /* 导航按钮样式 (首页、上一页、下一页) */
   .pagination-btn:first-child,
   .pagination-btn:nth-child(2),
+  .pagination-btn:nth-child(3),
   .pagination-btn:nth-last-child(2) {
     min-width: 60px;
     height: 32px;
@@ -819,7 +851,7 @@ export default {
   }
 
   /* 数字按钮样式 */
-  .pagination-btn:not(:first-child):not(:nth-child(2)):not(:nth-last-child(2)) {
+  .pagination-btn:not(:first-child):not(:nth-child(2)):not(:nth-child(3)):not(:nth-last-child(2)) {
     min-width: 28px;
     height: 32px;
     padding: 0;
@@ -852,4 +884,33 @@ export default {
     margin-left: 10px;
   }
 }
+
+.model-card{
+  background: white;
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  border: none;
+  box-shadow: none;
+  overflow: hidden;
+}
+
+.model-card ::v-deep .el-card__body{
+  padding: 0;
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  overflow: hidden;
+}
+
+.data-table {
+  --table-max-height: calc(100vh - 450px);
+  max-height: var(--table-max-height);
+}
+
+.data-table ::v-deep .el-table__body-wrapper {
+  max-height: calc(var(--table-max-height) - 80px);
+  overflow-y: auto;
+}
+
 </style>

main/manager-web/src/views/ParamsManagement.vue

@@ -17,7 +17,11 @@
                     <el-card class="params-card" shadow="never">
                         <el-table ref="paramsTable" :data="paramsList" class="transparent-table"
                             :header-cell-class-name="headerCellClassName">
-                            <el-table-column label="选择" type="selection" align="center" width="120"></el-table-column>
+                            <el-table-column label="选择" align="center" width="120">
+                                <template slot-scope="scope">
+                                    <el-checkbox v-model="scope.row.selected"></el-checkbox>
+                                </template>
+                            </el-table-column>
                             <el-table-column label="参数编码" prop="paramCode" align="center"></el-table-column>
                             <el-table-column label="参数值" prop="paramValue" align="center"
                                 show-overflow-tooltip></el-table-column>
@@ -37,9 +41,17 @@
                                 </el-button>
                                 <el-button size="mini" type="success" @click="showAddDialog">新增</el-button>
                                 <el-button size="mini" type="danger" icon="el-icon-delete"
-                                    @click="deleteParam($refs.paramsTable.selection)">删除</el-button>
+                                     @click="deleteSelectedParams">删除</el-button>
                             </div>
                             <div class="custom-pagination">
+                                <el-select v-model="pageSize" @change="handlePageSizeChange" class="page-size-select">
+                                    <el-option
+                                        v-for="item in pageSizeOptions"
+                                        :key="item"
+                                        :label="`${item}条/页`"
+                                        :value="item">
+                                    </el-option>
+                                </el-select>
                                 <button class="pagination-btn" :disabled="currentPage === 1" @click="goFirst">
                                     首页
                                 </button>
@@ -64,6 +76,7 @@
         <!-- 新增/编辑参数对话框 -->
         <param-dialog :title="dialogTitle" :visible.sync="dialogVisible" :form="paramForm" @submit="handleSubmit"
             @cancel="dialogVisible = false" />
+
     </div>
 </template>
 
@@ -80,6 +93,7 @@ export default {
             paramsList: [],
             currentPage: 1,
             pageSize: 5,
+            pageSizeOptions: [5, 10, 20, 50, 100],
             total: 0,
             dialogVisible: false,
             dialogTitle: "新增参数",
@@ -94,7 +108,9 @@ export default {
     },
     created() {
         this.fetchParams();
+
     },
+
     computed: {
         pageCount() {
             return Math.ceil(this.total / this.pageSize);
@@ -116,6 +132,11 @@ export default {
         },
     },
     methods: {
+        handlePageSizeChange(val) {
+            this.pageSize = val;
+            this.currentPage = 1;
+            this.fetchParams();
+        },
         fetchParams() {
             Api.admin.getParamsList(
                 {
@@ -125,10 +146,16 @@ export default {
                 },
                 ({ data }) => {
                     if (data.code === 0) {
-                        this.paramsList = data.data.list;
+                        this.paramsList = data.data.list.map(item => ({
+                            ...item,
+                            selected: false
+                        }));
                         this.total = data.data.total;
                     } else {
-                        this.$message.error(data.msg || '获取参数列表失败');
+                        this.$message.error({
+                            message: data.msg || '获取参数列表失败',
+                            showClose: true
+                        });
                     }
                 }
             );
@@ -138,12 +165,10 @@ export default {
             this.fetchParams();
         },
         handleSelectAll() {
-            if (this.isAllSelected) {
-                this.$refs.paramsTable.clearSelection();
-            } else {
-                this.$refs.paramsTable.toggleAllSelection();
-            }
             this.isAllSelected = !this.isAllSelected;
+            this.paramsList.forEach(row => {
+                row.selected = this.isAllSelected;
+            });
         },
         showAddDialog() {
             this.dialogTitle = "新增参数";
@@ -165,7 +190,10 @@ export default {
                 // 编辑
                 Api.admin.updateParam(form, ({ data }) => {
                     if (data.code === 0) {
-                        this.$message.success("修改成功");
+                        this.$message.success({
+                          message:"修改成功",
+                          showClose:true
+                        });
                         this.dialogVisible = false;
                         this.fetchParams();
                     }
@@ -174,23 +202,40 @@ export default {
                 // 新增
                 Api.admin.addParam(form, ({ data }) => {
                     if (data.code === 0) {
-                        this.$message.success("新增成功");
+                        this.$message.success({
+                          message:"新增成功",
+                          showClose:true
+                        });
                         this.dialogVisible = false;
                         this.fetchParams();
                     }
                 });
             }
         },
+
+        deleteSelectedParams() {
+            const selectedRows = this.paramsList.filter(row => row.selected);
+            if (selectedRows.length === 0) {
+                this.$message.warning({
+                    message: "请先选择需要删除的参数",
+                    showClose: true
+                });
+                return;
+            }
+            this.deleteParam(selectedRows);
+        },
         deleteParam(row) {
             // 处理单个参数或参数数组
             const params = Array.isArray(row) ? row : [row];
 
             if (Array.isArray(row) && row.length === 0) {
-                this.$message.warning("请先选择需要删除的参数");
+                this.$message.warning({
+                  message:"请先选择需要删除的参数",
+                  showClose:true
+                });
                 return;
             }
 
-
             const paramCount = params.length;
             this.$confirm(`确定要删除选中的${paramCount}个参数吗？`, '警告', {
                 confirmButtonText: '确定',
@@ -200,7 +245,10 @@ export default {
             }).then(() => {
                 const ids = params.map(param => param.id);
                 if (ids.some(id => isNaN(id))) {
-                    this.$message.error('存在无效的参数ID');
+                    this.$message.error({
+                      message:'存在无效的参数ID',
+                      showClose: true
+                    });
                     return;
                 }
 
@@ -210,7 +258,7 @@ export default {
                             message: `成功删除${paramCount}个参数`,
                             showClose: true
                         });
-                        this.fetchParams(); // 刷新参数列表
+                        this.fetchParams();
                     } else {
                         this.$message.error({
                             message: data.msg || '删除失败，请重试',
@@ -276,15 +324,20 @@ export default {
     background: linear-gradient(to bottom right, #dce8ff, #e4eeff, #e6cbfd) center;
     -webkit-background-size: cover;
     -o-background-size: cover;
+    overflow: hidden;
 }
 
 .main-wrapper {
-    margin: 5px 22px;
+  margin: 5px 22px;
-    border-radius: 15px;
+  border-radius: 15px;
-    min-height: 600px;
+  min-height: calc(100vh - 350px);
-    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
+  height: auto;
-    position: relative;
+  max-height: 80vh;
-    background: rgba(237, 242, 255, 0.5);
+  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
+  position: relative;
+  background: rgba(237, 242, 255, 0.5);
+  display: flex;
+  flex-direction: column;
 }
 
 .operation-bar {
@@ -329,14 +382,20 @@ export default {
     flex: 1;
     height: 100%;
     min-width: 600px;
-    overflow-x: auto;
+    overflow: auto;
     background-color: white;
+    display: flex;
+    flex-direction: column;
 }
 
 .params-card {
     background: white;
     border: none;
     box-shadow: none;
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+    overflow: hidden;
 }
 
 .table_bottom {
@@ -344,6 +403,7 @@ export default {
     justify-content: space-between;
     align-items: center;
     margin-top: 10px;
+    padding-bottom: 10px;
 }
 
 .ctrl_btn {
@@ -383,12 +443,16 @@ export default {
 .custom-pagination {
     display: flex;
     align-items: center;
-    gap: 8px;
+    gap: 10px;
-    margin-top: 15px;
+
+    .el-select {
+      margin-right: 8px;
+    }
 
     .pagination-btn:first-child,
     .pagination-btn:nth-child(2),
-    .pagination-btn:nth-last-child(2) {
+    .pagination-btn:nth-last-child(2),
+    .pagination-btn:nth-child(3) {
         min-width: 60px;
         height: 32px;
         padding: 0 12px;
@@ -410,7 +474,7 @@ export default {
         }
     }
 
-    .pagination-btn:not(:first-child):not(:nth-child(2)):not(:nth-last-child(2)) {
+    .pagination-btn:not(:first-child):not(:nth-child(3)):not(:nth-child(2)):not(:nth-last-child(2)) {
         min-width: 28px;
         height: 32px;
         padding: 0;
@@ -446,7 +510,19 @@ export default {
 
 :deep(.transparent-table) {
     background: white;
+    flex: 1;
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    .el-table__body-wrapper {
+      flex: 1;
+      overflow: auto;
+      max-height: none !important;
+    }
 
+    .el-table__header-wrapper {
+      flex-shrink: 0;
+    }
     .el-table__header th {
         background: white !important;
         color: black;
@@ -466,19 +542,6 @@ export default {
     }
 }
 
-:deep(.custom-selection-header) {
-    .el-checkbox {
-        display: none !important;
-    }
-
-    &::after {
-        content: "选择";
-        display: inline-block;
-        color: black;
-        font-weight: bold;
-        padding-bottom: 18px;
-    }
-}
 
 :deep(.el-checkbox__inner) {
     background-color: #eeeeee !important;
@@ -534,4 +597,63 @@ export default {
     overflow: hidden;
     text-overflow: ellipsis;
 }
+
+.page-size-select {
+    width: 100px;
+    margin-right: 10px;
+
+    :deep(.el-input__inner) {
+        height: 32px;
+        line-height: 32px;
+        border-radius: 4px;
+        border: 1px solid #e4e7ed;
+        background: #dee7ff;
+        color: #606266;
+        font-size: 14px;
+    }
+
+    :deep(.el-input__suffix) {
+        right: 6px;
+        width: 15px;
+        height: 20px;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        top: 6px;
+        border-radius: 4px;
+    }
+
+    :deep(.el-input__suffix-inner) {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        width: 100%;
+    }
+
+    :deep(.el-icon-arrow-up:before) {
+        content: "";
+        display: inline-block;
+        border-left: 6px solid transparent;
+        border-right: 6px solid transparent;
+        border-top: 9px solid #606266;
+        position: relative;
+        transform: rotate(0deg);
+        transition: transform 0.3s;
+    }
+}
+
+:deep(.el-table) {
+    .el-table__body-wrapper {
+        transition: height 0.3s ease;
+    }
+}
+
+.el-table {
+  --table-max-height: calc(100vh - 400px);
+  max-height: var(--table-max-height);
+
+  .el-table__body-wrapper {
+    max-height: calc(var(--table-max-height) - 40px);
+  }
+}
 </style>

main/manager-web/src/views/UserManagement.vue

@@ -15,9 +15,12 @@
       <div class="content-panel">
         <div class="content-area">
           <el-card class="user-card" shadow="never">
-            <el-table ref="userTable" :data="userList" class="transparent-table"
+            <el-table ref="userTable" :data="userList" class="transparent-table">
-              :header-cell-class-name="headerCellClassName">
+              <el-table-column label="选择" align="center" width="120">
-              <el-table-column label="选择" type="selection" align="center" width="120"></el-table-column>
+                  <template slot-scope="scope">
+                      <el-checkbox v-model="scope.row.selected"></el-checkbox>
+                  </template>
+              </el-table-column>
               <el-table-column label="用户Id" prop="userid" align="center"></el-table-column>
               <el-table-column label="手机号码" prop="mobile" align="center"></el-table-column>
               <el-table-column label="设备数量" prop="deviceCount" align="center"></el-table-column>
@@ -50,6 +53,15 @@
                 <el-button size="mini" type="danger" icon="el-icon-delete" @click="batchDelete">删除</el-button>
               </div>
               <div class="custom-pagination">
+                <el-select v-model="pageSize" @change="handlePageSizeChange" class="page-size-select">
+                  <el-option
+                    v-for="item in pageSizeOptions"
+                    :key="item"
+                    :label="`${item}条/页`"
+                    :value="item">
+                  </el-option>
+                </el-select>
+
                 <button class="pagination-btn" :disabled="currentPage === 1" @click="goFirst">
                   首页
                 </button>
@@ -69,6 +81,7 @@
         </div>
       </div>
     </div>
+
     <view-password-dialog :visible.sync="showViewPassword" :password="currentPassword" />
   </div>
 </template>
@@ -86,6 +99,7 @@ export default {
       currentPassword: "",
       searchPhone: "",
       userList: [],
+      pageSizeOptions: [5, 10, 20, 50, 100],
       currentPage: 1,
       pageSize: 5,
       total: 0,
@@ -116,35 +130,42 @@ export default {
     },
   },
   methods: {
+     handlePageSizeChange(val) {
+      this.pageSize = val;
+      this.currentPage = 1;
+      this.fetchUsers();
+    },
+
     fetchUsers() {
-      Api.admin.getUserList(
+        Api.admin.getUserList(
-        {
+            {
-          page: this.currentPage,
+                page: this.currentPage,
-          limit: this.pageSize,
+                limit: this.pageSize,
-          mobile: this.searchPhone,
+                mobile: this.searchPhone,
-        },
+            },
-        ({ data }) => {
+            ({ data }) => {
-          if (data.code === 0) {
+                if (data.code === 0) {
-            this.userList = data.data.list
+                    this.userList = data.data.list.map(item => ({
-            this.total = data.data.total;
+                        ...item,
-          }
+                        selected: false
-        }
+                    }));
-      );
+                    this.total = data.data.total;
+                }
+            }
+        );
     },
     handleSearch() {
       this.currentPage = 1;
       this.fetchUsers();
     },
     handleSelectAll() {
-      if (this.isAllSelected) {
+        this.isAllSelected = !this.isAllSelected;
-        this.$refs.userTable.clearSelection();
+        this.userList.forEach(row => {
-      } else {
+            row.selected = this.isAllSelected;
-        this.$refs.userTable.toggleAllSelection();
+        });
-      }
-      this.isAllSelected = !this.isAllSelected;
     },
     batchDelete() {
-      const selectedUsers = this.$refs.userTable.selection;
+      const selectedUsers = this.userList.filter(user => user.selected);
       if (selectedUsers.length === 0) {
         this.$message.warning("请先选择需要删除的用户");
         return;
@@ -209,20 +230,12 @@ export default {
         });
     },
     batchEnable() {
-      const selectedUsers = this.$refs.userTable.selection;
+        const selectedUsers = this.userList.filter(user => user.selected);
-      if (selectedUsers.length === 0) {
+        this.handleChangeStatus(selectedUsers, 1);
-        this.$message.warning("请先选择需要启用的用户");
-        return;
-      }
-      this.handleChangeStatus(selectedUsers, 1);
     },
     batchDisable() {
-      const selectedUsers = this.$refs.userTable.selection;
+        const selectedUsers = this.userList.filter(user => user.selected);
-      if (selectedUsers.length === 0) {
+        this.handleChangeStatus(selectedUsers, 0);
-        this.$message.warning("请先选择需要禁用的用户");
-        return;
-      }
-      this.handleChangeStatus(selectedUsers, 0);
     },
     resetPassword(row) {
       this.$confirm("重置后将会生成新密码，是否继续？", "提示", {
@@ -265,12 +278,6 @@ export default {
         })
         .catch(() => { });
     },
-    headerCellClassName({ columnIndex }) {
-      if (columnIndex === 0) {
-        return "custom-selection-header";
-      }
-      return "";
-    },
     goFirst() {
       this.currentPage = 1;
       this.fetchUsers();
@@ -342,15 +349,20 @@ export default {
   background: linear-gradient(to bottom right, #dce8ff, #e4eeff, #e6cbfd) center;
   -webkit-background-size: cover;
   -o-background-size: cover;
+  overflow: hidden;
 }
 
 .main-wrapper {
   margin: 5px 22px;
   border-radius: 15px;
-  min-height: 600px;
+  min-height: calc(100vh - 350px);
+  height: auto;
+  max-height: 80vh;
   box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
   position: relative;
   background: rgba(237, 242, 255, 0.5);
+  display: flex;
+  flex-direction: column;
 }
 
 .operation-bar {
@@ -397,12 +409,18 @@ export default {
   min-width: 600px;
   overflow-x: auto;
   background-color: white;
+  display: flex;
+  flex-direction: column;
 }
 
 .user-card {
   background: white;
   border: none;
   box-shadow: none;
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  overflow: hidden;
 }
 
 .table_bottom {
@@ -467,10 +485,14 @@ export default {
   display: flex;
   align-items: center;
   gap: 8px;
-  margin-top: 15px;
+
+  .el-select {
+    margin-right: 8px;
+  }
 
   .pagination-btn:first-child,
   .pagination-btn:nth-child(2),
+  .pagination-btn:nth-child(3),
   .pagination-btn:nth-last-child(2) {
     min-width: 60px;
     height: 32px;
@@ -493,7 +515,7 @@ export default {
     }
   }
 
-  .pagination-btn:not(:first-child):not(:nth-child(2)):not(:nth-last-child(2)) {
+  .pagination-btn:not(:first-child):not(:nth-child(2)):not(:nth-child(3)):not(:nth-last-child(2)) {
     min-width: 28px;
     height: 32px;
     padding: 0;
@@ -529,6 +551,19 @@ export default {
 
 :deep(.transparent-table) {
   background: white;
+  flex: 1;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  .el-table__body-wrapper {
+    flex: 1;
+    overflow: auto;
+    max-height: none !important;
+  }
+
+  .el-table__header-wrapper {
+    flex-shrink: 0;
+  }
 
   .el-table__header th {
     background: white !important;
@@ -557,19 +592,6 @@ export default {
   color: #5a64b5 !important;
 }
 
-:deep(.custom-selection-header) {
-  .el-checkbox {
-    display: none !important;
-  }
-
-  &::after {
-    content: "选择";
-    display: inline-block;
-    color: black;
-    font-weight: bold;
-    padding-bottom: 18px;
-  }
-}
 
 :deep(.el-checkbox__inner) {
   background-color: #eeeeee !important;
@@ -606,4 +628,59 @@ export default {
     }
   }
 }
+
+.page-size-select {
+    width: 100px;
+    margin-right: 10px;
+
+    :deep(.el-input__inner) {
+        height: 32px;
+        line-height: 32px;
+        border-radius: 4px;
+        border: 1px solid #e4e7ed;
+        background: #dee7ff;
+        color: #606266;
+        font-size: 14px;
+    }
+
+    :deep(.el-input__suffix) {
+        right: 6px;
+        width: 15px;
+        height: 20px;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        top: 6px;
+        border-radius: 4px;
+    }
+
+    :deep(.el-input__suffix-inner) {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        width: 100%;
+    }
+
+    :deep(.el-icon-arrow-up:before) {
+        content: "";
+        display: inline-block;
+        border-left: 6px solid transparent;
+        border-right: 6px solid transparent;
+        border-top: 9px solid #606266;
+        position: relative;
+        transform: rotate(0deg);
+        transition: transform 0.3s;
+    }
+}
+
+.el-table {
+  --table-max-height: calc(100vh - 400px);
+  max-height: var(--table-max-height);
+
+  .el-table__body-wrapper {
+    max-height: calc(var(--table-max-height) - 40px);
+  }
+}
+
+
 </style>

main/manager-web/src/views/home.vue

@@ -19,13 +19,13 @@
             <div class="hi-hint">
               Hello, Let's have a wonderful day!
             </div>
-            <div class="add-device-btn" @click="showAddDialog">
+            <div class="add-device-btn">
-              <div class="left-add">
+              <div class="left-add" @click="showAddDialog">
                 添加智能体
               </div>
               <div style="width: 23px;height: 13px;background: #5778ff;margin-left: -10px;" />
               <div class="right-add">
-                <i class="el-icon-right" style="font-size: 20px;color: #fff;" />
+                <i class="el-icon-right" @click="showAddDialog" style="font-size: 20px;color: #fff;" />
               </div>
             </div>
           </div>
@@ -261,4 +261,7 @@ export default {
   text-align: center;
   /* 居中显示 */
 }
+
+
+
 </style>

main/manager-web/src/views/login.vue

@@ -38,7 +38,7 @@
             </div>
             <div
               style="font-weight: 400;font-size: 14px;text-align: left;color: #5778ff;display: flex;justify-content: space-between;margin-top: 20px;">
-              <div style="cursor: pointer;" @click="goToRegister">新用户注册</div>
+              <div v-if="allowUserRegister" style="cursor: pointer;" @click="goToRegister">新用户注册</div>
             </div>
           </div>
           <div class="login-btn" @click="login">登录</div>
@@ -61,12 +61,18 @@
 import Api from '@/apis/api';
 import VersionFooter from '@/components/VersionFooter.vue';
 import { getUUID, goToPage, showDanger, showSuccess } from '@/utils';
+import { mapState } from 'vuex';
 
 export default {
   name: 'login',
   components: {
     VersionFooter
   },
+  computed: {
+    ...mapState({
+      allowUserRegister: state => state.pubConfig.allowUserRegister
+    })
+  },
   data() {
     return {
       activeName: "username",
@@ -77,13 +83,12 @@ export default {
         captchaId: ''
       },
       captchaUuid: '',
-      captchaUrl: '',
+      captchaUrl: ''
-      version: ''
     }
   },
   mounted() {
     this.fetchCaptcha();
-    this.getSystemVersion();
+    this.$store.dispatch('fetchPubConfig');
   },
   methods: {
     fetchCaptcha() {
@@ -148,21 +153,6 @@ export default {
     goToRegister() {
       goToPage('/register')
     },
-
-    getSystemVersion() {
-      const storedVersion = sessionStorage.getItem('systemVersion');
-      if (storedVersion) {
-        this.version = storedVersion;
-        return;
-      }
-
-      Api.user.getPubConfig(({ data }) => {
-        if (data.code === 0 && data.data.version) {
-          this.version = data.data.version;
-          sessionStorage.setItem('systemVersion', data.data.version);
-        }
-      });
-    }
   }
 }
 </script>

main/manager-web/src/views/register.vue

@@ -82,12 +82,18 @@
 import Api from '@/apis/api';
 import VersionFooter from '@/components/VersionFooter.vue';
 import { getUUID, goToPage, showDanger, showSuccess } from '@/utils';
+import { mapState } from 'vuex';
 
 export default {
   name: 'register',
   components: {
     VersionFooter
   },
+  computed: {
+    ...mapState({
+      allowUserRegister: state => state.pubConfig.allowUserRegister
+    })
+  },
   data() {
     return {
       form: {
@@ -101,6 +107,14 @@ export default {
     }
   },
   mounted() {
+    this.$store.dispatch('fetchPubConfig').then(() => {
+      if (!this.allowUserRegister) {
+        showDanger('当前不允许普通用户注册');
+        setTimeout(() => {
+          goToPage('/login');
+        }, 1500);
+      }
+    });
     this.fetchCaptcha();
   },
   methods: {

main/manager-web/src/views/roleConfig.vue

@@ -81,6 +81,7 @@
           </div>
         </div>
       </div>
+
     </el-main>
   </div>
 </template>

main/manager-web/vue.config.js

@@ -6,10 +6,38 @@ const TerserPlugin = require('terser-webpack-plugin');
 const CompressionPlugin = require('compression-webpack-plugin')
 // BundleAnalyzerPlugin 用于分析打包后的文件
 const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
+// WorkboxPlugin 用于生成Service Worker
+const { InjectManifest } = require('workbox-webpack-plugin');
 // 引入 path 模块
-const path = require('path');
+
+const path = require('path')
+ 
+function resolve(dir) {
+  return path.join(__dirname, dir)
+}
+
 // 确保加载 .env 文件
 dotenv.config();
+
+// 定义CDN资源列表，确保Service Worker也能访问
+const cdnResources = {
+  css: [
+    'https://unpkg.com/element-ui@2.15.14/lib/theme-chalk/index.css',
+    'https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css'
+  ],
+  js: [
+    'https://unpkg.com/vue@2.6.14/dist/vue.min.js',
+    'https://unpkg.com/vue-router@3.6.5/dist/vue-router.min.js',
+    'https://unpkg.com/vuex@3.6.2/dist/vuex.min.js',
+    'https://unpkg.com/element-ui@2.15.14/lib/index.js',
+    'https://unpkg.com/axios@0.27.2/dist/axios.min.js',
+    'https://unpkg.com/opus-decoder@0.7.7/dist/opus-decoder.min.js'
+  ]
+};
+
+// 判断是否使用CDN
+const useCDN = process.env.VUE_APP_USE_CDN === 'true';
+
 module.exports = defineConfig({
   productionSourceMap: process.env.NODE_ENV === 'production' ? false : true, // 生产环境不生成 source map
   devServer: {
@@ -29,21 +57,9 @@ module.exports = defineConfig({
     // 修改 HTML 插件配置，动态插入 CDN 链接
     config.plugin('html')
       .tap(args => {
-        if (process.env.NODE_ENV === 'production') {
+        // 根据配置决定是否使用CDN
-          args[0].cdn = {
+        if (process.env.NODE_ENV === 'production' && useCDN) {
-            css: [
+          args[0].cdn = cdnResources;
-              'https://cdn.jsdelivr.net/npm/element-ui@2.15.14/lib/theme-chalk/index.css',
-              'https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css'
-            ],
-            js: [
-              'https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.min.js',
-              'https://cdn.jsdelivr.net/npm/vue-router@3.6.5/dist/vue-router.min.js',
-              'https://cdn.jsdelivr.net/npm/vuex@3.6.2/dist/vuex.min.js',
-              'https://cdn.jsdelivr.net/npm/element-ui@2.15.14/lib/index.js',
-              'https://cdn.jsdelivr.net/npm/axios@0.27.2/dist/axios.min.js',
-              'https://cdn.jsdelivr.net/npm/opus-decoder@0.7.7/dist/opus-decoder.min.js'
-            ]
-          };
         }
         return args;
       });
@@ -101,14 +117,38 @@ module.exports = defineConfig({
           minRatio: 0.8
         })
       );
-      config.externals = {
+
-        'vue': 'Vue',
+      // 根据是否使用CDN来决定是否添加Service Worker
-        'vue-router': 'VueRouter',
+      config.plugins.push(
-        'vuex': 'Vuex',
+        new InjectManifest({
-        'element-ui': 'ELEMENT',
+          swSrc: path.resolve(__dirname, 'src/service-worker.js'),
-        'axios': 'axios',
+          swDest: 'service-worker.js',
-        'opus-decoder': 'OpusDecoder'
+          exclude: [/\.map$/, /asset-manifest\.json$/],
-      };
+          maximumFileSizeToCacheInBytes: 5 * 1024 * 1024, // 5MB
+          // 自定义Service Worker注入点
+          injectionPoint: 'self.__WB_MANIFEST',
+          // 添加额外信息传递给Service Worker
+          additionalManifestEntries: useCDN ?
+            [{ url: 'cdn-mode', revision: 'enabled' }] :
+            [{ url: 'cdn-mode', revision: 'disabled' }]
+        })
+      );
+
+      // 如果使用CDN，则配置externals排除依赖包
+      if (useCDN) {
+        config.externals = {
+          'vue': 'Vue',
+          'vue-router': 'VueRouter',
+          'vuex': 'Vuex',
+          'element-ui': 'ELEMENT',
+          'axios': 'axios',
+          'opus-decoder': 'OpusDecoder'
+        };
+      } else {
+        // 确保不使用CDN时不设置externals，让webpack打包所有依赖
+        config.externals = {};
+      }
+
       if (process.env.ANALYZE === 'true') {  // 通过环境变量控制
         config.plugins.push(
           new BundleAnalyzerPlugin({
@@ -128,13 +168,13 @@ module.exports = defineConfig({
           config: [__filename]  // 每次配置文件修改时缓存失效
         }
       };
-      config.resolve.alias = {
-        '@': path.resolve(__dirname, 'src'),  // 让 '@' 代表 'src' 目录
-        '@assets': path.resolve(__dirname, 'src/assets'), // 设置 '@assets' 为 'src/assets' 目录
-        '@components': path.resolve(__dirname, 'src/components'), // 设置 '@components' 为 'src/components' 目录
-        '@views': path.resolve(__dirname, 'src/views'), // 设置 '@views' 为 'src/views' 目录
-      }
     }
   },
-
+  // 将CDN资源信息暴露给service-worker.js
+  pwa: {
+    workboxOptions: {
+      skipWaiting: true,
+      clientsClaim: true
+    }
+  }
 });

main/xiaozhi-server/config/config_loader.py

@@ -4,6 +4,17 @@ import requests
 import yaml
 import time
 
+
+class DeviceNotFoundException(Exception):
+    pass
+
+
+class DeviceBindException(Exception):
+    def __init__(self, bind_code):
+        self.bind_code = bind_code
+        super().__init__(f"设备绑定异常，绑定码: {bind_code}")
+
+
 # 添加全局配置缓存
 _config_cache = None
 
@@ -83,7 +94,11 @@ def _make_api_request(api_url, secret, endpoint, json_data=None):
             response = requests.post(f"{api_url}{endpoint}", json=json_data)
             if response.status_code == 200:
                 result = response.json()
-                if result.get("code") != 0:
+                if result.get("code") == 10041:
+                    raise DeviceNotFoundException(result.get("msg"))
+                elif result.get("code") == 10042:
+                    raise DeviceBindException(result.get("msg"))
+                elif result.get("code") != 0:
                     raise Exception(f"API返回错误: {result.get('msg', '未知错误')}")
                 return result.get("data")
 

main/xiaozhi-server/config/logger.py

@@ -3,7 +3,7 @@ import sys
 from loguru import logger
 from config.config_loader import load_config
 
-SERVER_VERSION = "0.3.3"
+SERVER_VERSION = "0.3.4"
 
 
 def get_module_abbreviation(module_name, module_dict):

main/xiaozhi-server/core/connection.py

@@ -27,7 +27,11 @@ from core.handle.functionHandler import FunctionHandler
 from plugins_func.register import Action, ActionResponse
 from core.auth import AuthMiddleware, AuthenticationError
 from core.mcp.manager import MCPManager
-from config.config_loader import get_private_config_from_api
+from config.config_loader import (
+    get_private_config_from_api,
+    DeviceNotFoundException,
+    DeviceBindException,
+)
 
 TAG = __name__
 
@@ -46,6 +50,9 @@ class ConnectionHandler:
         self.logger = setup_logging()
         self.auth = AuthMiddleware(config)
 
+        self.need_bind = False
+        self.bind_code = None
+
         self.websocket = None
         self.headers = None
         self.client_ip = None
@@ -206,7 +213,15 @@ class ConnectionHandler:
             )
             private_config["delete_audio"] = bool(self.config.get("delete_audio", True))
             self.logger.bind(tag=TAG).info(f"获取差异化配置成功: {private_config}")
+        except DeviceNotFoundException as e:
+            self.need_bind = True
+            private_config = {}
+        except DeviceBindException as e:
+            self.need_bind = True
+            self.bind_code = e.bind_code
+            private_config = {}
         except Exception as e:
+            self.need_bind = True
             self.logger.bind(tag=TAG).error(f"获取差异化配置失败: {e}")
             private_config = {}
 
@@ -254,8 +269,6 @@ class ConnectionHandler:
             self.config["selected_module"]["Intent"] = private_config[
                 "selected_module"
             ]["Intent"]
-        if private_config.get("prompt", None) is not None:
-            self.config["prompt"] = private_config["prompt"]
         try:
             modules = initialize_modules(
                 self.logger,
@@ -270,6 +283,10 @@ class ConnectionHandler:
         except Exception as e:
             self.logger.bind(tag=TAG).error(f"初始化组件失败: {e}")
             modules = {}
+        if modules.get("vad", None) is not None:
+            self.vad = modules["vad"]
+        if modules.get("asr", None) is not None:
+            self.asr = modules["asr"]
         if modules.get("tts", None) is not None:
             self.tts = modules["tts"]
         if modules.get("llm", None) is not None:
@@ -278,6 +295,8 @@ class ConnectionHandler:
             self.intent = modules["intent"]
         if modules.get("memory", None) is not None:
             self.memory = modules["memory"]
+        if modules.get("prompt", None) is not None:
+            self.change_system_prompt(modules["prompt"])
 
     def _initialize_memory(self):
         """初始化记忆模块"""
@@ -345,7 +364,6 @@ class ConnectionHandler:
         response_message = []
         processed_chars = 0  # 跟踪已处理的字符位置
         try:
-            start_time = time.time()
             # 使用带记忆的对话
             future = asyncio.run_coroutine_threadsafe(
                 self.memory.query_memory(query), self.loop
@@ -367,9 +385,6 @@ class ConnectionHandler:
             if self.client_abort:
                 break
 
-            end_time = time.time()
-            # self.logger.bind(tag=TAG).debug(f"大模型返回时间: {end_time - start_time} 秒, 生成token={content}")
-
             # 合并当前全部文本并处理未分割部分
             full_text = "".join(response_message)
             current_text = full_text[processed_chars:]  # 从未处理的位置开始

main/xiaozhi-server/core/handle/receiveAudioHandle.py

@@ -1,5 +1,6 @@
 from config.logger import setup_logging
 import time
+import asyncio
 from core.utils.util import remove_punctuation_and_length
 from core.handle.sendAudioHandle import send_stt_message
 from core.handle.intentHandler import handle_user_intent
@@ -35,9 +36,7 @@ async def handleAudioMessage(conn, audio):
         if len(conn.asr_audio) < 15:
             conn.asr_server_receive = True
         else:
-            text, file_path = await conn.asr.speech_to_text(
+            text, _ = await conn.asr.speech_to_text(conn.asr_audio, conn.session_id)
-                conn.asr_audio, conn.session_id
-            )
             logger.bind(tag=TAG).info(f"识别文本: {text}")
             text_len, _ = remove_punctuation_and_length(text)
             if text_len > 0:
@@ -49,6 +48,9 @@ async def handleAudioMessage(conn, audio):
 
 
 async def startToChat(conn, text):
+    if conn.need_bind:
+        await check_bind_device(conn)
+        return
     # 首先进行意图分析
     intent_handled = await handle_user_intent(conn, text)
 
@@ -85,3 +87,44 @@ async def no_voice_close_connect(conn):
                 "请你以“时间过得真快”未来头，用富有感情、依依不舍的话来结束这场对话吧。"
             )
             await startToChat(conn, prompt)
+
+
+async def check_bind_device(conn):
+    if conn.bind_code:
+        # 确保bind_code是6位数字
+        if len(conn.bind_code) != 6:
+            logger.bind(tag=TAG).error(f"无效的绑定码格式: {conn.bind_code}")
+            text = "绑定码格式错误，请检查配置。"
+            await send_stt_message(conn, text)
+            return
+
+        text = f"请登录控制面板，输入{conn.bind_code}，绑定设备。"
+        await send_stt_message(conn, text)
+        conn.tts_first_text_index = 0
+        conn.tts_last_text_index = 6
+        conn.llm_finish_task = True
+
+        # 播放提示音
+        music_path = "config/assets/bind_code.wav"
+        opus_packets, _ = conn.tts.audio_to_opus_data(music_path)
+        conn.audio_play_queue.put((opus_packets, text, 0))
+
+        # 逐个播放数字
+        for i in range(6):  # 确保只播放6位数字
+            try:
+                digit = conn.bind_code[i]
+                num_path = f"config/assets/bind_code/{digit}.wav"
+                num_packets, _ = conn.tts.audio_to_opus_data(num_path)
+                conn.audio_play_queue.put((num_packets, text, i + 1))
+            except Exception as e:
+                logger.bind(tag=TAG).error(f"播放数字音频失败: {e}")
+                continue
+    else:
+        text = f"没有找到该设备的版本信息，请正确配置 OTA地址，然后重新编译固件。"
+        await send_stt_message(conn, text)
+        conn.tts_first_text_index = 0
+        conn.tts_last_text_index = 0
+        conn.llm_finish_task = True
+        music_path = "config/assets/bind_not_found.wav"
+        opus_packets, _ = conn.tts.audio_to_opus_data(music_path)
+        conn.audio_play_queue.put((opus_packets, text, 0))

main/xiaozhi-server/core/providers/tts/siliconflow.py

@@ -16,7 +16,7 @@ class TTSProvider(TTSProviderBase):
             self.voice = config.get("voice")
         self.response_format = config.get("response_format")
         self.sample_rate = config.get("sample_rate")
-        self.speed = float(config.get("speed"))
+        self.speed = float(config.get("speed", 1.0))
         self.gain = config.get("gain")
 
         self.host = "api.siliconflow.cn"

main/xiaozhi-server/core/utils/util.py

@@ -222,80 +222,93 @@ def initialize_modules(
 
     # 初始化TTS模块
     if init_tts:
+        select_tts_module = config["selected_module"]["TTS"]
         tts_type = (
-            config["selected_module"]["TTS"]
+            select_tts_module
-            if "type" not in config["TTS"][config["selected_module"]["TTS"]]
+            if "type" not in config["TTS"][select_tts_module]
-            else config["TTS"][config["selected_module"]["TTS"]]["type"]
+            else config["TTS"][select_tts_module]["type"]
         )
         modules["tts"] = tts.create_instance(
             tts_type,
-            config["TTS"][config["selected_module"]["TTS"]],
+            config["TTS"][select_tts_module],
             bool(config.get("delete_audio", True)),
         )
-        logger.bind(tag=TAG).info(f"初始化组件: tts成功")
+        logger.bind(tag=TAG).info(f"初始化组件: tts成功 {select_tts_module}")
 
     # 初始化LLM模块
     if init_llm:
+        select_llm_module = config["selected_module"]["LLM"]
         llm_type = (
-            config["selected_module"]["LLM"]
+            select_llm_module
-            if "type" not in config["LLM"][config["selected_module"]["LLM"]]
+            if "type" not in config["LLM"][select_llm_module]
-            else config["LLM"][config["selected_module"]["LLM"]]["type"]
+            else config["LLM"][select_llm_module]["type"]
         )
         modules["llm"] = llm.create_instance(
             llm_type,
-            config["LLM"][config["selected_module"]["LLM"]],
+            config["LLM"][select_llm_module],
         )
-        logger.bind(tag=TAG).info(f"初始化组件: llm成功")
+        logger.bind(tag=TAG).info(f"初始化组件: llm成功 {select_llm_module}")
 
     # 初始化Intent模块
     if init_intent:
+        select_intent_module = config["selected_module"]["Intent"]
         intent_type = (
-            config["selected_module"]["Intent"]
+            select_intent_module
-            if "type" not in config["Intent"][config["selected_module"]["Intent"]]
+            if "type" not in config["Intent"][select_intent_module]
-            else config["Intent"][config["selected_module"]["Intent"]]["type"]
+            else config["Intent"][select_intent_module]["type"]
         )
         modules["intent"] = intent.create_instance(
             intent_type,
-            config["Intent"][config["selected_module"]["Intent"]],
+            config["Intent"][select_intent_module],
         )
-        logger.bind(tag=TAG).info(f"初始化组件: intent成功")
+        logger.bind(tag=TAG).info(f"初始化组件: intent成功 {select_intent_module}")
+
     # 初始化Memory模块
     if init_memory:
+        select_memory_module = config["selected_module"]["Memory"]
         memory_type = (
-            config["selected_module"]["Memory"]
+            select_memory_module
-            if "type" not in config["Memory"][config["selected_module"]["Memory"]]
+            if "type" not in config["Memory"][select_memory_module]
-            else config["Memory"][config["selected_module"]["Memory"]]["type"]
+            else config["Memory"][select_memory_module]["type"]
         )
         modules["memory"] = memory.create_instance(
             memory_type,
-            config["Memory"][config["selected_module"]["Memory"]],
+            config["Memory"][select_memory_module],
         )
-        logger.bind(tag=TAG).info(f"初始化组件: memory成功")
+        logger.bind(tag=TAG).info(f"初始化组件: memory成功 {select_memory_module}")
 
     # 初始化VAD模块
     if init_vad:
+        select_vad_module = config["selected_module"]["VAD"]
         vad_type = (
-            config["selected_module"]["VAD"]
+            select_vad_module
-            if "type" not in config["VAD"][config["selected_module"]["VAD"]]
+            if "type" not in config["VAD"][select_vad_module]
-            else config["VAD"][config["selected_module"]["VAD"]]["type"]
+            else config["VAD"][select_vad_module]["type"]
         )
         modules["vad"] = vad.create_instance(
             vad_type,
-            config["VAD"][config["selected_module"]["VAD"]],
+            config["VAD"][select_vad_module],
         )
-        logger.bind(tag=TAG).info(f"初始化组件: vad成功")
+        logger.bind(tag=TAG).info(f"初始化组件: vad成功 {select_vad_module}")
+
     # 初始化ASR模块
     if init_asr:
+        select_asr_module = config["selected_module"]["ASR"]
         asr_type = (
-            config["selected_module"]["ASR"]
+            select_asr_module
-            if "type" not in config["ASR"][config["selected_module"]["ASR"]]
+            if "type" not in config["ASR"][select_asr_module]
-            else config["ASR"][config["selected_module"]["ASR"]]["type"]
+            else config["ASR"][select_asr_module]["type"]
         )
         modules["asr"] = asr.create_instance(
             asr_type,
-            config["ASR"][config["selected_module"]["ASR"]],
+            config["ASR"][select_asr_module],
             bool(config.get("delete_audio", True)),
         )
-        logger.bind(tag=TAG).info(f"初始化组件: asr成功")
+        logger.bind(tag=TAG).info(f"初始化组件: asr成功 {select_asr_module}")
+
+    # 初始化自定义prompt
+    if config.get("prompt", None) is not None:
+        modules["prompt"] = config["prompt"]
+        logger.bind(tag=TAG).info(f"初始化组件: prompt成功 {modules['prompt'][:50]}...")
 
     return modules

main/xiaozhi-server/test/abbreviated_version/app.js

@@ -992,7 +992,9 @@ function connectToServer() {
 
             if(connectButton.id === "connectButton") {
                 connectButton.textContent = '断开';
-                connectButton.onclick = disconnectFromServer;
+                // connectButton.onclick = disconnectFromServer;
+                connectButton.removeEventListener("click", connectToServer);
+                connectButton.addEventListener("click", disconnectFromServer);
             }
             
             if(messageInput.id === "messageInput") {
@@ -1011,7 +1013,9 @@ function connectToServer() {
 
             if(connectButton.id === "connectButton") {
                 connectButton.textContent = '连接';
-                connectButton.onclick = connectToServer;
+                // connectButton.onclick = connectToServer;
+                connectButton.removeEventListener("click", disconnectFromServer);
+                connectButton.addEventListener("click", connectToServer);
             }
             
             if(messageInput.id === "messageInput") {
@@ -1175,7 +1179,7 @@ function updateStatus(message, type = 'info') {
 // 处理文本消息
 function handleTextMessage(message) {
     if (message.type === 'hello') {
-        console.log(`服务器回应：${message.message}`);
+        console.log(`服务器回应：${JSON.stringify(message, null, 2)}`);
     } else if (message.type === 'tts') {
         // TTS状态消息
         if (message.state === 'start') {

main/xiaozhi-server/test/test_page.html

@@ -475,22 +475,36 @@
 
         // 日志函数
         function log(message, type = 'info') {
-            const logEntry = document.createElement('div');
+            // 将消息按换行符分割成多行
-            logEntry.className = `log-entry log-${type}`;
+            const lines = message.split('\n');
-            logEntry.textContent = `[${new Date().toLocaleTimeString()}] ${message}`;
+            const now = new Date();
-            if (type === 'error') {
+            // const timestamp = `[${now.toLocaleTimeString()}] `;
-                logEntry.style.color = 'red';
+            const timestamp = `[${now.toLocaleTimeString()}.${now.getMilliseconds().toString().padStart(3, '0')}] `;
-            } else if (type === 'debug') {
+            // 为每一行创建日志条目
-                logEntry.style.color = 'gray';
+            lines.forEach((line, index) => {
-                return;
+                const logEntry = document.createElement('div');
-            } else if (type === 'warning') {
+                logEntry.className = `log-entry log-${type}`;
-                logEntry.style.color = 'orange';
+                // 如果是第一条日志，显示时间戳
-            } else if (type === 'success') {
+                const prefix = index === 0 ? timestamp : ' '.repeat(timestamp.length);
-                logEntry.style.color = 'green';
+                logEntry.textContent = `${prefix}${line}`;
-            } else {
+                // logEntry.textContent = `[${new Date().toLocaleTimeString()}] ${message}`;
-                logEntry.style.color = 'black';
+                // logEntry.style 保留起始的空格
-            }
+                logEntry.style.whiteSpace = 'pre';
-            logContainer.appendChild(logEntry);
+                if (type === 'error') {
+                    logEntry.style.color = 'red';
+                } else if (type === 'debug') {
+                    logEntry.style.color = 'gray';
+                    return;
+                } else if (type === 'warning') {
+                    logEntry.style.color = 'orange';
+                } else if (type === 'success') {
+                    logEntry.style.color = 'green';
+                } else {
+                    logEntry.style.color = 'black';
+                }
+                logContainer.appendChild(logEntry);
+            });
+
             logContainer.scrollTop = logContainer.scrollHeight;
         }
 
@@ -1153,7 +1167,9 @@
                     await sendHelloMessage();
 
                     connectButton.textContent = '断开';
-                    connectButton.onclick = disconnectFromServer;
+                    connectButton.removeEventListener('click', connectToServer);
+                    connectButton.addEventListener('click', disconnectFromServer);
+                    // connectButton.onclick = disconnectFromServer;
                     messageInput.disabled = false;
                     sendTextButton.disabled = false;
 
@@ -1169,7 +1185,9 @@
                     connectionStatus.style.color = 'red';
 
                     connectButton.textContent = '连接';
-                    connectButton.onclick = connectToServer;
+                    connectButton.removeEventListener('click', disconnectFromServer);
+                    connectButton.addEventListener('click', connectToServer);
+                    // connectButton.onclick = connectToServer;
                     messageInput.disabled = true;
                     sendTextButton.disabled = true;
                     recordButton.disabled = true;
@@ -1189,7 +1207,7 @@
                             const message = JSON.parse(event.data);
 
                             if (message.type === 'hello') {
-                                log(`服务器回应：${message.message}`, 'info');
+                                log(`服务器回应：${JSON.stringify(message, null, 2)}`, 'success');
                             } else if (message.type === 'tts') {
                                 // TTS状态消息
                                 if (message.state === 'start') {