mirror of
https://github.com/jxxghp/MoviePilot-Frontend.git
synced 2026-05-11 10:00:08 +08:00
51 lines
980 B
Vue
51 lines
980 B
Vue
<script setup lang="ts">
|
|
import api from '@/api'
|
|
import type { MediaServerPlayItem } from '@/api/types'
|
|
import LibraryCard from '@/components/cards/LibraryCard.vue'
|
|
|
|
// 媒体库列表
|
|
const libraryList = ref<MediaServerPlayItem[]>([])
|
|
|
|
// 调用API查询
|
|
async function loadLibrary() {
|
|
try {
|
|
libraryList.value = await api.get('mediaserver/library')
|
|
}
|
|
catch (e) {
|
|
console.log(e)
|
|
}
|
|
}
|
|
|
|
onMounted(() => {
|
|
loadLibrary()
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<VCard>
|
|
<VCardItem>
|
|
<VCardTitle>我的媒体库</VCardTitle>
|
|
</VCardItem>
|
|
|
|
<div
|
|
v-if="libraryList.length > 0"
|
|
class="grid gap-4 grid-backdrop-card mx-3"
|
|
tabindex="0"
|
|
>
|
|
<LibraryCard
|
|
v-for="data in libraryList"
|
|
:key="data.id"
|
|
:media="data"
|
|
height="10rem"
|
|
/>
|
|
</div>
|
|
</VCard>
|
|
</template>
|
|
|
|
<style lang="scss">
|
|
.grid-backdrop-card {
|
|
grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
|
|
padding-block-end: 1rem;
|
|
}
|
|
</style>
|