循环泵的音频波形图

src/views/AIStation/RecyclePumpPage/RecyclePumpHistoryPage.vue

@@ -40,6 +40,7 @@ function selectRow(row) {
   const index = RecyclePumpData.value.indexOf(row)
   selectedRow.value = row;
   selectedRowIndex.value = index;
+  // playAudio()
 }
 
 const audioPlayer = ref(null);
@@ -142,7 +143,6 @@ function playAudio() {
     loading.value = false
   })
 }
-playAudio()
 // 初始化时选中第一行
 watch(
     ()=>RecyclePumpData.value,
@@ -172,8 +172,9 @@ watch(
     }
 )
 
-getData()
+// getData()
 function getData() {
+  console.log('历史datadata')
   const item = reactive({
     page: Page.page,
     size: Page.rows,
@@ -274,7 +275,8 @@ const handleSortChange = (data) => {
 };
 
 defineExpose({
-  getData
+  getData,
+  playAudio
 });
 </script>
 

src/views/AIStation/RecyclePumpPage/RecyclePumpNewDataPage.vue

@@ -44,6 +44,8 @@ function selectRow(row) {
   const index = RecyclePumpData.value.indexOf(row)
   selectedRow.value = row;
   selectedRowIndex.value = index;
+  console.log('aaaaaaaaaaaaaaaaaa')
+  // playAudio()
 }
 
 const audioPlayer = ref(null);
@@ -85,6 +87,7 @@ function zoom(zoomLevel) {
 function playAudio() {
   loading.value = true
   // 如果有波形图，则摧毁现有波形图，渲染新的波形图
+  console.log('wavesurfer.value',wavesurfer.value)
   if (wavesurfer.value) {
     wavesurfer.value.destroy();
   }
@@ -147,9 +150,6 @@ function playAudio() {
   })
 }
 
-playAudio()
-
-
 // 初始化时选中第一行
 watch(
     ()=>RecyclePumpData.value,
@@ -179,11 +179,13 @@ watch(
     }
 )
 
-// getData()
-if(localStorage.getItem('AIToken')){
-  getData()
-}
+// if(localStorage.getItem('AIToken')){
+//   getData()
+//   playAudio()
+// }
+
 function getData(){
+  console.log('getData')
   const item = reactive({
     page: Page.page,
     size: Page.rows,
@@ -285,7 +287,8 @@ const handleSortChange = (data) => {
 };
 
 defineExpose({
-  getData
+  getData,
+  playAudio
 });
 </script>
 

src/views/AIStation/RecyclePumpPage/index.vue

@@ -40,8 +40,11 @@ const handleTabClick = (tab, event) => {
   if (selectedItem) {
     selectedComponent.value = selectedItem.component;
     selectedBtn.value = selectedItem.id;
-    resetSearch();
-    search()
+    setTimeout(function () {
+      resetSearch();
+      search()
+      playAudio()
+    }, 1000)
   }
 };
 
@@ -199,6 +202,11 @@ const getData = () => {
     childComponentRef.value.getData(); // 调用子组件的 getData 方法
   }
 };
+const playAudio = () => {
+  if (childComponentRef.value && childComponentRef.value.playAudio) {
+    childComponentRef.value.playAudio(); // 调用子组件的 playAudio 方法
+  }
+};
 const route = useRoute()
 watch(
     () => route.path,  // 只监听路径变化
@@ -214,6 +222,7 @@ watch(
           if (localStorage.getItem('AIToken')) {
             clearInterval(checkAIToken);  // 停止轮询
             getNumber();
+            playAudio();
             // getData();
             resetSearch()
           }
@@ -287,7 +296,6 @@ function getSupplys() {
 }
 
 getSupplys();
-
 </script>
 <template>
   <div class="app-content">