no message

src/views/content/list/index.vue

@@ -87,6 +87,7 @@
 <script setup>
 import { list, detail, submit, change } from '@/api/content/list'
 import { useAudioClass } from '@/hooks/index.js'
+import { onUnmounted } from 'vue';
 
 const { proxy } = getCurrentInstance();
 const { sys_change_status } = proxy.useDict("sys_change_status")
@@ -247,15 +248,17 @@ function getDelete(row) {
 
 // 播放
 const audio = new Audio()
+const lastId = ref('')
 const getPlay = (e) => {
   data.tableData.map(i => i.play = false)
   audio.pause()
-  if (e.play) {
-    e.play = false
-  } else {
-    audio.src = e.playsrc
+  if (lastId.value !== e.id && !e.play) {
+    audio.src = e.playUrl
     audio.play()
     e.play = true
+    lastId.value = e.id
+  }else{
+    lastId.value = ''
   }
 }
 
@@ -264,4 +267,8 @@ function sceneFormatter(row) {
   let e = audioClassData.options.find(i => i.id === row.sceneId)
   return e ? e.name : '无'
 }
+
+onUnmounted(() => {
+  audio.pause()
+})
 </script>

src/views/review/list/index.vue

@@ -16,7 +16,8 @@
       <el-form-item>
         <el-button type="primary" icon="Search" @click="getSearch">搜索</el-button>
         <el-button icon="Refresh" @click="getRefresh">重置</el-button>
-        <el-button type="danger" icon="delete" :disabled="disabled()" @click="getDelete()" v-hasPermi="['review:list:delete']">批量删除</el-button>
+        <el-button type="danger" icon="delete" :disabled="disabled()" @click="getDelete()"
+          v-hasPermi="['review:list:delete']">批量删除</el-button>
       </el-form-item>
     </el-form>
 
@@ -31,8 +32,12 @@
       <el-table-column label="当前状态" prop="auditStatus" align="center" :formatter="statusFormatter" />
       <el-table-column label="操作" align="center">
         <template #default="scope">
-          <el-button v-if="scope.row.auditStatus === 0" type="primary" link @click="getDialog(scope.row)" v-hasPermi="['review:list:check']">审核</el-button>
-          <el-button type="danger" link @click="getDelete(scope.row.id)" v-hasPermi="['review:list:delete']">删除</el-button>
+          <el-button type="primary" link :icon="scope.row.play ? 'VideoPause' : 'VideoPlay'"
+            @click="getPlay(scope.row)" />
+          <el-button v-if="scope.row.auditStatus === 0" type="primary" link @click="getDialog(scope.row)"
+            v-hasPermi="['review:list:check']">审核</el-button>
+          <el-button type="danger" link @click="getDelete(scope.row.id)"
+            v-hasPermi="['review:list:delete']">删除</el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -178,6 +183,22 @@ const getClose = () => {
   proxy.$refs.dialogForm.resetFields()
 }
 
+// 播放
+const audio = new Audio()
+const lastId = ref('')
+const getPlay = (e) => {
+  data.tableData.map(i => i.play = false)
+  audio.pause()
+  if (lastId.value !== e.id && !e.play) {
+    audio.src = e.playUrl
+    audio.play()
+    e.play = true
+    lastId.value = e.id
+  } else {
+    lastId.value = ''
+  }
+}
+
 const statusFormatter = (row) => {
   return proxy.selectDictLabel(data.statusOptions, row.auditStatus)
 }