1解绑或版绑定时 失败增加 提示音效果

zhmes-agecal-web/src/main.js

@@ -21,6 +21,10 @@ import Pagination from "@/components/Pagination";
 // 自定义表格工具扩展
 import RightToolbar from "@/components/RightToolbar"
 
+// 挂载到Vue原型，组件内可通过 this.$sound 调用
+Vue.prototype.$sound = soundPlayer
+// 引入音效播放器
+import soundPlayer from '@/utils/sound'
 // 引入 datav
 import DataV from '@jiaminghi/data-view'
 Vue.use(DataV)

zhmes-agecal-web/src/utils/sound.js

+// src/utils/sound.js
+class SoundPlayer {
+  constructor() {
+    // 预加载音效。这里以失败音效为例
+    this.errorSound = new Audio(require('@/assets/sound/error-sound.mp3'));
+    this.errorSound.load();
+  }
+
+  // 播放扫描失败音效
+  playScanError() {
+    // 每次播放前重置到开头，确保短促音效能立即重复播放
+    this.errorSound.currentTime = 0;
+    const playPromise = this.errorSound.play();
+    // 处理可能因浏览器策略导致的自动播放错误
+    if (playPromise !== undefined) {
+      playPromise.catch(e => {
+        console.log('音效自动播放被阻止:', e);
+      });
+    }
+  }
+}
+
+// 导出单例
+export default new SoundPlayer();

zhmes-agecal-web/src/views/screen/components/TrayBinding.vue

@@ -482,6 +482,8 @@ export default {
             // 调整点5: 在标定完成状态下，只有异常设备才允许解绑
             const device = this.devices[deviceIndex];
             if (!this.isDeviceError(device)) {
+              // 网络请求失败或业务逻辑失败时，播放失败音效
+              this.$sound.playScanError();
               // 正常设备不允许解绑
               this.$message.warning(`设备 ${this.deviceInput} 状态正常，不能解绑`);
               this.deviceInput = '';
@@ -491,6 +493,8 @@ export default {
             // 找到设备，直接解绑（不弹确认对话框）
             this.executeUnbind(deviceIndex);
           } else {
+            // 网络请求失败或业务逻辑失败时，播放失败音效
+            this.$sound.playScanError();
             // 设备不存在提示
             this.$message.warning(`设备 ${this.deviceInput} 不存在或未绑定`);
           }
@@ -504,6 +508,8 @@ export default {
           );
 
           if (existingIndex !== -1) {
+            // 网络请求失败或业务逻辑失败时，播放失败音效
+            this.$sound.playScanError();
             // 发现重复设备号
             this.$message.error({
               message: `设备 ${trimmedInput} 已存在于位置 ${existingIndex + 1} 中，请勿重复添加`,