Tried setting backdrop too fast, tries after mount & api response #78
@@ -5,7 +5,7 @@
|
|||||||
:key="_route.route"
|
:key="_route.route"
|
||||||
:route="_route"
|
:route="_route"
|
||||||
:active="activeRoute"
|
:active="activeRoute"
|
||||||
:useStroke="_route?.useStroke"
|
:use-stroke="_route?.useStroke"
|
||||||
/>
|
/>
|
||||||
<slot></slot>
|
<slot></slot>
|
||||||
</ul>
|
</ul>
|
||||||
|
|||||||
@@ -165,7 +165,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, computed, defineProps } from "vue";
|
import { ref, computed, defineProps, onMounted } from "vue";
|
||||||
import { useStore } from "vuex";
|
import { useStore } from "vuex";
|
||||||
|
|
||||||
// import img from "@/directives/v-image";
|
// import img from "@/directives/v-image";
|
||||||
@@ -245,6 +245,18 @@
|
|||||||
requested.value = status;
|
requested.value = status;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function setBackdrop(): void {
|
||||||
|
if (
|
||||||
|
!media.value?.backdrop ||
|
||||||
|
!backdropElement.value?.style ||
|
||||||
|
backdropElement.value?.style?.backgroundImage !== ""
|
||||||
|
)
|
||||||
|
return;
|
||||||
|
|
||||||
|
const backdropURL = `${ASSET_URL}${ASSET_SIZES[1]}${media.value.backdrop}`;
|
||||||
|
backdropElement.value.style.backgroundImage = `url(${backdropURL})`;
|
||||||
|
}
|
||||||
|
|
||||||
function getCredits(
|
function getCredits(
|
||||||
type: MediaTypes.Movie | MediaTypes.Show
|
type: MediaTypes.Movie | MediaTypes.Show
|
||||||
): Promise<IMediaCredits> {
|
): Promise<IMediaCredits> {
|
||||||
@@ -289,14 +301,8 @@
|
|||||||
.then(() => getCredits(props.type))
|
.then(() => getCredits(props.type))
|
||||||
.then(credits => setCast(credits?.cast || []))
|
.then(credits => setCast(credits?.cast || []))
|
||||||
.then(() => getRequestStatus(props.id, props.type))
|
.then(() => getRequestStatus(props.id, props.type))
|
||||||
.then(requestStatus => setRequested(requestStatus || false));
|
.then(requestStatus => setRequested(requestStatus || false))
|
||||||
}
|
.then(setBackdrop);
|
||||||
|
|
||||||
function setBackdrop(): void {
|
|
||||||
if (!media.value?.backdrop || !backdropElement.value?.style) return;
|
|
||||||
|
|
||||||
const backdropURL = `${ASSET_URL}${ASSET_SIZES[1]}${media.value.backdrop}`;
|
|
||||||
backdropElement.value.style.backgroundImage = `url(${backdropURL})`;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function sendRequest() {
|
function sendRequest() {
|
||||||
@@ -318,9 +324,10 @@
|
|||||||
|
|
||||||
// On created functions
|
// On created functions
|
||||||
fetchMedia();
|
fetchMedia();
|
||||||
setBackdrop();
|
|
||||||
store.dispatch("torrentModule/setResultCount", null);
|
store.dispatch("torrentModule/setResultCount", null);
|
||||||
// End on create functions
|
// End on create functions
|
||||||
|
|
||||||
|
onMounted(setBackdrop);
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|||||||
Reference in New Issue
Block a user