更新

src/views/newuser/singerUser/form.vue

@@ -5,7 +5,7 @@ const formRules = ref({
   status: [{ required: true, message: "请选择状态", trigger: "change" }],
   // remark: [{ required: true, message: "请输入备注", trigger: "blur" }]
 });
-const props = defineProps(["formInline"]);
+const props = defineProps(["formInline", 'songUrl']);
 const newFormInline = ref(
   props.formInline
     ? props.formInline
@@ -23,6 +23,15 @@ defineExpose({ getRef });
 
 <template>
   <el-form ref="ruleFormRef" :model="newFormInline" :rules="formRules" label-width="120px">
+    <!-- {{ songUrl }} -->
+    <el-form-item label="试听音乐" prop="status">
+      <audio controls>
+        <source :src="songUrl" />
+      </audio>
+      <!-- <button @click="playAudio">播放</button>
+      <button @click="pauseAudio">暂停</button>
+      <button @click="stopAudio">停止</button> -->
+    </el-form-item>
     <el-form-item label="状态" prop="status">
       <el-radio-group v-model="newFormInline.status">
         <el-radio label="通过" :value="1" />
@@ -34,3 +43,8 @@ defineExpose({ getRef });
     </el-form-item>
   </el-form>
 </template>
+<style scoped>
+.el-form-item {
+  align-items: center
+}
+</style>

src/views/newuser/singerUser/hook.tsx

@@ -62,10 +62,13 @@ export function useData() {
         <div>{row.sex === 1 ? '男' : '女'}</div>
       )
     },
-    {
-      label: "歌手试音地址",
-      prop: "song"
-    },
+    // {
+    //   label: "歌手试音地址",
+    //   prop: "song",
+    //   cellRenderer: ({ row }) => (
+    //     <el-button type={'text'} >试听歌曲</el-button>
+    //   )
+    // },
     {
       label: "状态",
       prop: "status",
@@ -125,6 +128,18 @@ export function useData() {
       contentRenderer: () => h(detailView)
     });
   }
+  // const openSong = (rowData) => {
+  //   addDialog({
+  //     title: `试听音乐`,
+  //     props: {
+  //       rowData: rowData
+  //     },
+  //     width: "60%",
+  //     hideFooter: true,
+  //     closeOnClickModal: false,
+  //     contentRenderer: () => h(detailView)
+  //   });
+  // }
   const openDialog = (title = "新增", rowData: any) => {
     addDialog({
       title: `${title}歌手认证信息`,
@@ -132,7 +147,8 @@ export function useData() {
         formInline: {
           status: '',
           remark: ''
-        }
+        },
+        songUrl: rowData.song
       },
       width: "40%",
       closeOnClickModal: false,

src/views/newuser/singerUser/index.vue

@@ -41,6 +41,8 @@ defineOptions({
 							color: 'var(--el-text-color-primary)'
 						}" @page-current-change="handleCurrentChange" @page-size-change="handleSizeChange">
 						<template #operation="{ row }">
+							<!-- <el-button v-if="row.status === 0" link type="primary" @click="openSong('试听', row)"
+								:size="size">试听音乐</el-button> -->
 							<el-button v-if="row.status === 0" link type="primary" @click="openDialog('审核', row)"
 								:size="size">审核</el-button>
 							<el-button v-if="row.status === 1" link type="primary" :size="size"