|
|
|
@ -3,7 +3,7 @@
|
|
|
|
<h1>
|
|
|
|
<h1>
|
|
|
|
<img class="head" :src="user.profile.avatarUrl | resizeImage" />{{
|
|
|
|
<img class="head" :src="user.profile.avatarUrl | resizeImage" />{{
|
|
|
|
user.profile.nickname
|
|
|
|
user.profile.nickname
|
|
|
|
}}{{ $t("is") }} {{ $t("library") }}
|
|
|
|
}}{{ $t("library.sLibrary") }}
|
|
|
|
</h1>
|
|
|
|
</h1>
|
|
|
|
<div class="section-one">
|
|
|
|
<div class="section-one">
|
|
|
|
<div class="liked-songs" @click="goToLikedSongsList">
|
|
|
|
<div class="liked-songs" @click="goToLikedSongsList">
|
|
|
|
@ -19,7 +19,7 @@
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="bottom">
|
|
|
|
<div class="bottom">
|
|
|
|
<div class="titles">
|
|
|
|
<div class="titles">
|
|
|
|
<div class="title">{{ $t("likedSong") }}</div>
|
|
|
|
<div class="title">{{ $t("library.likedSongs") }}</div>
|
|
|
|
<div class="sub-title">
|
|
|
|
<div class="sub-title">
|
|
|
|
{{ likedSongsPlaylist.trackCount }} songs
|
|
|
|
{{ likedSongsPlaylist.trackCount }} songs
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
@ -41,7 +41,7 @@
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="playlists" v-if="playlists.length > 1">
|
|
|
|
<div class="playlists" v-if="playlists.length > 1">
|
|
|
|
<div class="title">{{ $t("playlist") }}</div>
|
|
|
|
<div class="title">{{ $t("playlist.playlist") }}</div>
|
|
|
|
<div>
|
|
|
|
<div>
|
|
|
|
<CoverRow
|
|
|
|
<CoverRow
|
|
|
|
:items="playlists.slice(1)"
|
|
|
|
:items="playlists.slice(1)"
|
|
|
|
@ -76,23 +76,23 @@ export default {
|
|
|
|
user: {
|
|
|
|
user: {
|
|
|
|
profile: {
|
|
|
|
profile: {
|
|
|
|
avatarUrl: "",
|
|
|
|
avatarUrl: "",
|
|
|
|
nickname: "",
|
|
|
|
nickname: ""
|
|
|
|
},
|
|
|
|
}
|
|
|
|
},
|
|
|
|
},
|
|
|
|
playlists: [],
|
|
|
|
playlists: [],
|
|
|
|
hasMorePlaylists: true,
|
|
|
|
hasMorePlaylists: true,
|
|
|
|
likedSongsPlaylist: {
|
|
|
|
likedSongsPlaylist: {
|
|
|
|
id: 0,
|
|
|
|
id: 0,
|
|
|
|
trackCount: 0,
|
|
|
|
trackCount: 0
|
|
|
|
},
|
|
|
|
},
|
|
|
|
likedSongs: [],
|
|
|
|
likedSongs: [],
|
|
|
|
likedSongIDs: [],
|
|
|
|
likedSongIDs: [],
|
|
|
|
lyric: undefined,
|
|
|
|
lyric: undefined
|
|
|
|
};
|
|
|
|
};
|
|
|
|
},
|
|
|
|
},
|
|
|
|
created() {
|
|
|
|
created() {
|
|
|
|
NProgress.start();
|
|
|
|
NProgress.start();
|
|
|
|
userDetail(this.settings.user.userId).then((data) => {
|
|
|
|
userDetail(this.settings.user.userId).then(data => {
|
|
|
|
this.user = data;
|
|
|
|
this.user = data;
|
|
|
|
});
|
|
|
|
});
|
|
|
|
},
|
|
|
|
},
|
|
|
|
@ -107,7 +107,7 @@ export default {
|
|
|
|
pickedLyric() {
|
|
|
|
pickedLyric() {
|
|
|
|
if (this.lyric === undefined) return "";
|
|
|
|
if (this.lyric === undefined) return "";
|
|
|
|
let lyric = this.lyric.split("\n");
|
|
|
|
let lyric = this.lyric.split("\n");
|
|
|
|
lyric = lyric.filter((l) => {
|
|
|
|
lyric = lyric.filter(l => {
|
|
|
|
if (l.includes("作词") || l.includes("作曲")) {
|
|
|
|
if (l.includes("作词") || l.includes("作曲")) {
|
|
|
|
return false;
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
@ -120,9 +120,9 @@ export default {
|
|
|
|
return [
|
|
|
|
return [
|
|
|
|
lyric[lineIndex].split("]")[1],
|
|
|
|
lyric[lineIndex].split("]")[1],
|
|
|
|
lyric[lineIndex + 1].split("]")[1],
|
|
|
|
lyric[lineIndex + 1].split("]")[1],
|
|
|
|
lyric[lineIndex + 2].split("]")[1],
|
|
|
|
lyric[lineIndex + 2].split("]")[1]
|
|
|
|
];
|
|
|
|
];
|
|
|
|
},
|
|
|
|
}
|
|
|
|
},
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
methods: {
|
|
|
|
playLikedSongs() {
|
|
|
|
playLikedSongs() {
|
|
|
|
@ -133,24 +133,31 @@ export default {
|
|
|
|
},
|
|
|
|
},
|
|
|
|
loadData() {
|
|
|
|
loadData() {
|
|
|
|
if (this.hasMorePlaylists) {
|
|
|
|
if (this.hasMorePlaylists) {
|
|
|
|
userPlaylist({
|
|
|
|
this.getUserPlaylists();
|
|
|
|
uid: this.settings.user.userId,
|
|
|
|
|
|
|
|
offset: this.playlists.length,
|
|
|
|
|
|
|
|
timestamp: new Date().getTime(),
|
|
|
|
|
|
|
|
}).then((data) => {
|
|
|
|
|
|
|
|
this.playlists.push(...data.playlist);
|
|
|
|
|
|
|
|
this.hasMorePlaylists = data.more;
|
|
|
|
|
|
|
|
this.likedSongsPlaylist = data.playlist[0];
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
this.getLikedSongs();
|
|
|
|
this.getLikedSongs();
|
|
|
|
},
|
|
|
|
},
|
|
|
|
|
|
|
|
getUserPlaylists(replace = false) {
|
|
|
|
|
|
|
|
userPlaylist({
|
|
|
|
|
|
|
|
uid: this.settings.user.userId,
|
|
|
|
|
|
|
|
offset: this.playlists.length === 0 ? 0 : this.playlists.length - 1,
|
|
|
|
|
|
|
|
timestamp: new Date().getTime()
|
|
|
|
|
|
|
|
}).then(data => {
|
|
|
|
|
|
|
|
if (replace) {
|
|
|
|
|
|
|
|
this.playlists = data.playlist;
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
this.playlists.push(...data.playlist);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
this.hasMorePlaylists = data.more;
|
|
|
|
|
|
|
|
this.likedSongsPlaylist = data.playlist[0];
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
},
|
|
|
|
getLikedSongs(getLyric = true) {
|
|
|
|
getLikedSongs(getLyric = true) {
|
|
|
|
getPlaylistDetail(this.settings.user.likedSongPlaylistID, true).then(
|
|
|
|
getPlaylistDetail(this.settings.user.likedSongPlaylistID, true).then(
|
|
|
|
(data) => {
|
|
|
|
data => {
|
|
|
|
let TrackIDs = data.playlist.trackIds.slice(0, 20).map((t) => t.id);
|
|
|
|
let TrackIDs = data.playlist.trackIds.slice(0, 20).map(t => t.id);
|
|
|
|
this.likedSongIDs = TrackIDs;
|
|
|
|
this.likedSongIDs = TrackIDs;
|
|
|
|
getTrackDetail(this.likedSongIDs.join(",")).then((data) => {
|
|
|
|
getTrackDetail(this.likedSongIDs.join(",")).then(data => {
|
|
|
|
this.likedSongs = data.songs;
|
|
|
|
this.likedSongs = data.songs;
|
|
|
|
this.likedSongs = mapTrackPlayableStatus(this.likedSongs);
|
|
|
|
this.likedSongs = mapTrackPlayableStatus(this.likedSongs);
|
|
|
|
NProgress.done();
|
|
|
|
NProgress.done();
|
|
|
|
@ -163,16 +170,16 @@ export default {
|
|
|
|
getRandomLyric() {
|
|
|
|
getRandomLyric() {
|
|
|
|
getLyric(
|
|
|
|
getLyric(
|
|
|
|
this.likedSongIDs[randomNum(0, this.likedSongIDs.length - 1)]
|
|
|
|
this.likedSongIDs[randomNum(0, this.likedSongIDs.length - 1)]
|
|
|
|
).then((data) => {
|
|
|
|
).then(data => {
|
|
|
|
if (data.lrc !== undefined) this.lyric = data.lrc.lyric;
|
|
|
|
if (data.lrc !== undefined) this.lyric = data.lrc.lyric;
|
|
|
|
});
|
|
|
|
});
|
|
|
|
},
|
|
|
|
}
|
|
|
|
},
|
|
|
|
},
|
|
|
|
watch: {
|
|
|
|
watch: {
|
|
|
|
likedSongsInState() {
|
|
|
|
likedSongsInState() {
|
|
|
|
this.getLikedSongs(false);
|
|
|
|
this.getLikedSongs(false);
|
|
|
|
},
|
|
|
|
}
|
|
|
|
},
|
|
|
|
}
|
|
|
|
};
|
|
|
|
};
|
|
|
|
</script>
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|
|
kunkka
4 years ago