Added audio type
This commit is contained in:
1 parent
89caa3d3ad
commit
8595411c39
1 file changed
+16
-5
+16
-5
@@ -3,8 +3,9 @@ export type Row = {
|
|||||||
name: string
|
name: string
|
||||||
class?: string
|
class?: string
|
||||||
width?: string
|
width?: string
|
||||||
type?: "image"
|
type?: "image" | "audio"
|
||||||
imagePrefix?: string
|
prefix?: string
|
||||||
|
suffix?: string
|
||||||
displayName?: string
|
displayName?: string
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -34,11 +35,16 @@ const { rows, data } = defineProps<TableProps>()
|
|||||||
<tr v-for="(item, i) in data" :key="i">
|
<tr v-for="(item, i) in data" :key="i">
|
||||||
<td v-for="(row, j) in rows" :key="j">
|
<td v-for="(row, j) in rows" :key="j">
|
||||||
<slot :name="row.name" :item="item" :index="i">
|
<slot :name="row.name" :item="item" :index="i">
|
||||||
<p v-if="row.type != 'image'">{{ item[row.name] }}</p>
|
|
||||||
<nuxt-img
|
<nuxt-img
|
||||||
v-else-if="row.type == 'image'"
|
v-if="row.type == 'image'"
|
||||||
:src="`${row.imagePrefix}${item[row.name]}`"
|
:src="`${row.prefix}${item[row.name]}`"
|
||||||
/>
|
/>
|
||||||
|
<audio
|
||||||
|
v-else-if="row.type == 'audio'"
|
||||||
|
controls
|
||||||
|
:src="`${row.prefix}${item[row.name]}${row.suffix}`"
|
||||||
|
/>
|
||||||
|
<p v-else>{{ item[row.name] }}</p>
|
||||||
</slot>
|
</slot>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
@@ -73,5 +79,10 @@ const { rows, data } = defineProps<TableProps>()
|
|||||||
height: 60px;
|
height: 60px;
|
||||||
border-radius: $border-radius-standard;
|
border-radius: $border-radius-standard;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
& audio {
|
||||||
|
max-width: 200px;
|
||||||
|
padding: 5px 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
Reference in new issue
Block a user