]>
Commit | Line | Data |
---|---|---|
58584439 | 1 | <template> |
2 | <Generic :item="item"> | |
3 | <template #content> | |
4 | <p class="title is-4">{{ item.name }}</p> | |
5 | <p class="subtitle is-6"> | |
6 | <template v-if="item.subtitle"> | |
7 | {{ item.subtitle }} | |
8 | </template> | |
9 | <template v-else> | |
abfe72b9 | 10 | {{ embyCount }} |
58584439 | 11 | </template> |
12 | </p> | |
13 | </template> | |
14 | <template #indicator> | |
15 | <div v-if="status" class="status" :class="status"> | |
16 | {{ status }} | |
17 | </div> | |
18 | </template> | |
19 | </Generic> | |
20 | </template> | |
21 | ||
22 | <script> | |
23 | import service from "@/mixins/service.js"; | |
24 | import Generic from "./Generic.vue"; | |
25 | ||
26 | export default { | |
27 | name: "Emby", | |
28 | mixins: [service], | |
29 | props: { | |
30 | item: Object, | |
31 | }, | |
32 | components: { | |
33 | Generic, | |
34 | }, | |
35 | data: () => ({ | |
36 | status: "", | |
37 | albumCount: 0, | |
38 | songCount: 0, | |
39 | movieCount: 0, | |
40 | seriesCount: 0, | |
41 | episodeCount: 0, | |
42 | }), | |
43 | computed: { | |
44 | embyCount: function () { | |
abfe72b9 | 45 | if (this.item.libraryType === "music") |
46 | return `${this.songCount} songs, ${this.albumCount} albums`; | |
47 | else if (this.item.libraryType === "movies") | |
48 | return `${this.movieCount} movies`; | |
49 | else if (this.item.libraryType === "series") | |
50 | return `${this.episodeCount} eps, ${this.seriesCount} series`; | |
51 | else return `wrong library type 💀`; | |
58584439 | 52 | }, |
53 | }, | |
54 | created() { | |
55 | this.fetchServerStatus(); | |
56 | ||
abfe72b9 | 57 | if (!this.item.subtitle && this.status !== "dead") |
58584439 | 58 | this.fetchServerMediaStats(); |
59 | }, | |
60 | methods: { | |
61 | fetchServerStatus: async function () { | |
cd1fc28f | 62 | this.fetch("/System/info/public") |
abfe72b9 | 63 | .then((response) => { |
64 | if (response.Id) this.status = "running"; | |
4f56c2c1 | 65 | else throw new Error(); |
abfe72b9 | 66 | }) |
67 | .catch((e) => { | |
68 | console.log(e); | |
69 | this.status = "dead"; | |
70 | }); | |
58584439 | 71 | }, |
72 | fetchServerMediaStats: async function () { | |
73 | const headers = { | |
74 | "X-Emby-Token": this.item.apikey, | |
75 | }; | |
76 | ||
abfe72b9 | 77 | var data = await this.fetch("/items/counts", { headers }).catch((e) => { |
78 | console.log(e); | |
79 | }); | |
58584439 | 80 | |
81 | this.albumCount = data.AlbumCount; | |
82 | this.songCount = data.SongCount; | |
83 | this.movieCount = data.MovieCount; | |
84 | this.seriesCount = data.SeriesCount; | |
85 | this.episodeCount = data.EpisodeCount; | |
86 | }, | |
87 | }, | |
88 | }; | |
89 | </script> | |
90 | ||
91 | <style scoped lang="scss"> | |
92 | .status { | |
93 | font-size: 0.8rem; | |
94 | color: var(--text-title); | |
95 | ||
96 | &.running:before { | |
97 | background-color: #94e185; | |
98 | border-color: #78d965; | |
99 | box-shadow: 0 0 5px 1px #94e185; | |
100 | } | |
101 | ||
102 | &.dead:before { | |
103 | background-color: #c9404d; | |
104 | border-color: #c42c3b; | |
105 | box-shadow: 0 0 5px 1px #c9404d; | |
106 | } | |
107 | ||
108 | &:before { | |
109 | content: " "; | |
110 | display: inline-block; | |
111 | width: 7px; | |
112 | height: 7px; | |
113 | margin-right: 10px; | |
114 | border: 1px solid #000; | |
115 | border-radius: 7px; | |
116 | } | |
117 | } | |
118 | </style> |