From 6647099ba099093c7824dfdc9e8dbeb4b96c8de8 Mon Sep 17 00:00:00 2001 From: PikachuEXE Date: Wed, 20 Dec 2023 14:28:09 +0800 Subject: [PATCH] ! Fix playlist link in watch view --- .../watch-video-playlist.js | 34 +++++++++++++++---- .../watch-video-playlist.vue | 2 +- src/renderer/views/Watch/Watch.vue | 1 + 3 files changed, 29 insertions(+), 8 deletions(-) diff --git a/src/renderer/components/watch-video-playlist/watch-video-playlist.js b/src/renderer/components/watch-video-playlist/watch-video-playlist.js index 859775d7f8d2d..5e74cb10ea55f 100644 --- a/src/renderer/components/watch-video-playlist/watch-video-playlist.js +++ b/src/renderer/components/watch-video-playlist/watch-video-playlist.js @@ -23,6 +23,10 @@ export default defineComponent({ type: String, required: true, }, + playlistType: { + type: String, + default: null + }, videoId: { type: String, required: true, @@ -48,6 +52,8 @@ export default defineComponent({ playlistTitle: '', playlistItems: [], randomizedPlaylistItems: [], + + getPlaylistInfoRun: false, } }, computed: { @@ -59,6 +65,9 @@ export default defineComponent({ return this.$store.getters.getBackendFallback }, + isUserPlaylist: function () { + return this.playlistType === 'user' + }, userPlaylistsReady: function () { return this.$store.getters.getPlaylistsReady }, @@ -73,11 +82,6 @@ export default defineComponent({ selectedUserPlaylistLastUpdatedAt () { return this.selectedUserPlaylist?.lastUpdatedAt }, - playlistType() { - if (this.selectedUserPlaylist != null) { return 'user' } - - return '' - }, currentVideoIndexZeroBased: function () { return this.playlistItems.findIndex((item) => { @@ -138,6 +142,16 @@ export default defineComponent({ videoIsNotPlaylistItem: function () { return this.videoIndexInPlaylistItems === -1 }, + + playlistPageLinkTo() { + // For `router-link` attribute `to` + return { + path: `/playlist/${this.playlistId}`, + query: { + playlistType: this.isUserPlaylist ? 'user' : '', + }, + } + }, }, watch: { userPlaylistsReady: function() { @@ -202,7 +216,7 @@ export default defineComponent({ this.getPlaylistInformationLocal() } } - } + }, }, mounted: function () { const cachedPlaylist = this.$store.getters.getCachedPlaylist @@ -225,8 +239,13 @@ export default defineComponent({ }, methods: { getPlaylistInfoWithDelay: function () { + if (this.getPlaylistInfoRun) { return } + this.isLoading = true - if (!this.userPlaylistsReady) { return } + // `selectedUserPlaylist` result accuracy relies on data being ready + if (this.isUserPlaylist && !this.userPlaylistsReady) { return } + + this.getPlaylistInfoRun = true if (this.selectedUserPlaylist != null) { this.parseUserPlaylist(this.selectedUserPlaylist) @@ -358,6 +377,7 @@ export default defineComponent({ loadCachedPlaylistInformation: async function (cachedPlaylist) { this.isLoading = true + this.getPlaylistInfoRun = true this.setCachedPlaylist(null) this.playlistTitle = cachedPlaylist.title diff --git a/src/renderer/components/watch-video-playlist/watch-video-playlist.vue b/src/renderer/components/watch-video-playlist/watch-video-playlist.vue index a718bd8c44c3c..7380d033fcf30 100644 --- a/src/renderer/components/watch-video-playlist/watch-video-playlist.vue +++ b/src/renderer/components/watch-video-playlist/watch-video-playlist.vue @@ -12,7 +12,7 @@ > {{ playlistTitle }} diff --git a/src/renderer/views/Watch/Watch.vue b/src/renderer/views/Watch/Watch.vue index b905411938262..707090c04dc24 100644 --- a/src/renderer/views/Watch/Watch.vue +++ b/src/renderer/views/Watch/Watch.vue @@ -172,6 +172,7 @@ ref="watchVideoPlaylist" :watch-view-loading="isLoading" :playlist-id="playlistId" + :playlist-type="playlistType" :video-id="videoId" :playlist-item-id="playlistItemId" class="watchVideoSideBar watchVideoPlaylist"