44 lines
989 B
Vue
44 lines
989 B
Vue
<template>
|
|
<v-list-item :lines="lines" :to="{ name: 'StreamDetailView', params: { id: item.id }}" prepend-icon="mdi-video" v-if="item">
|
|
<v-list-item-title>
|
|
{{ item.name }}
|
|
</v-list-item-title>
|
|
<v-list-item-subtitle>
|
|
<StreamPublishCounterChip :count="item.publish_counter" size="x-small" v-if="showCounter" />
|
|
{{ item.id }}
|
|
</v-list-item-subtitle>
|
|
</v-list-item>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { computed, defineProps, toRaw } from 'vue'
|
|
import { useQuery } from '@tanstack/vue-query'
|
|
import { listStreams } from '@/client/client'
|
|
|
|
const props = defineProps({
|
|
id: Number,
|
|
lines: {
|
|
type: String,
|
|
default: 'one',
|
|
},
|
|
showCounter: {
|
|
type: Boolean,
|
|
default: false,
|
|
},
|
|
})
|
|
|
|
const { data, error} = useQuery({
|
|
queryKey: ['streams'],
|
|
queryFn: listStreams,
|
|
refetchInterval: 1000,
|
|
})
|
|
|
|
const item = computed(() => {
|
|
if (!data) {
|
|
return null
|
|
}
|
|
|
|
return toRaw(data.value).find((item) => item.id === props.id)
|
|
})
|
|
|
|
</script> |