修改翻译以及locale结构

master
qier222 4 years ago
parent ecee495a18
commit 1657935ba1

@ -37,7 +37,10 @@
</div> </div>
</div> </div>
<div class="like-button" v-show="isLoggedIn"> <div class="like-button" v-show="isLoggedIn">
<button-icon @click.native="likeCurrentSong"> <button-icon
@click.native="likeCurrentSong"
:title="$t('player.like')"
>
<svg-icon <svg-icon
icon-class="heart" icon-class="heart"
v-show="!liked.songs.includes(currentTrack.id)" v-show="!liked.songs.includes(currentTrack.id)"
@ -50,29 +53,29 @@
</div> </div>
</div> </div>
<div class="middle-control-buttons"> <div class="middle-control-buttons">
<button-icon @click.native="previous" title="Previous Song" <button-icon @click.native="previous" :title="$t('player.previous')"
><svg-icon icon-class="previous" ><svg-icon icon-class="previous"
/></button-icon> /></button-icon>
<button-icon <button-icon
class="play" class="play"
@click.native="play" @click.native="play"
:title="playing ? 'Pause' : 'Play'" :title="$t(playing ? 'player.pause' : 'player.play')"
> >
<svg-icon :iconClass="playing ? 'pause' : 'play'" <svg-icon :iconClass="playing ? 'pause' : 'play'"
/></button-icon> /></button-icon>
<button-icon @click.native="next" title="Next Song" <button-icon @click.native="next" :title="$t('player.next')"
><svg-icon icon-class="next" ><svg-icon icon-class="next"
/></button-icon> /></button-icon>
</div> </div>
<div class="right-control-buttons"> <div class="right-control-buttons">
<button-icon <button-icon
@click.native="goToNextTracksPage" @click.native="goToNextTracksPage"
title="Next Up" :title="$t('player.nextUp')"
:class="{ active: this.$route.name === 'next' }" :class="{ active: this.$route.name === 'next' }"
><svg-icon icon-class="list" ><svg-icon icon-class="list"
/></button-icon> /></button-icon>
<button-icon <button-icon
title="Repeat" :title="$t('player.repeat')"
@click.native="repeat" @click.native="repeat"
:class="{ active: player.repeat !== 'off' }" :class="{ active: player.repeat !== 'off' }"
> >
@ -82,11 +85,11 @@
<button-icon <button-icon
@click.native="shuffle" @click.native="shuffle"
:class="{ active: player.shuffle }" :class="{ active: player.shuffle }"
title="Shuffle" :title="$t('player.shuffle')"
><svg-icon icon-class="shuffle" ><svg-icon icon-class="shuffle"
/></button-icon> /></button-icon>
<div class="volume-control"> <div class="volume-control">
<button-icon title="Mute" @click.native="mute"> <button-icon :title="$t('player.mute')" @click.native="mute">
<svg-icon icon-class="volume" v-show="volume > 0.5" /> <svg-icon icon-class="volume" v-show="volume > 0.5" />
<svg-icon icon-class="volume-mute" v-show="volume === 0" /> <svg-icon icon-class="volume-mute" v-show="volume === 0" />
<svg-icon <svg-icon

@ -1,12 +1,17 @@
import Vue from 'vue'; import Vue from "vue";
import VueI18n from 'vue-i18n' import VueI18n from "vue-i18n";
import messages from './messages';
Vue.use(VueI18n) import en from "./lang/en.js";
import zhCN from "./lang/zh-CN.js";
Vue.use(VueI18n);
const i18n = new VueI18n({ const i18n = new VueI18n({
locale: 'zh-CN', locale: "en",
messages messages: {
en,
"zh-CN": zhCN
}
}); });
export default i18n; export default i18n;

@ -0,0 +1,83 @@
export default {
play: "PLAY",
nav: {
home: "Home",
explore: "Explore",
library: "Library",
search: "Search"
},
footer: {
settings: "Settings"
},
home: {
recommendPlaylist: "Recommended Playlists",
recommendArtist: "Recommended Artists",
newAlbum: "Latest Albums",
seeMore: "SEE MORE",
charts: "Charts"
},
library: {
sLibrary: "'s Library",
likedSongs: "Liked Songs",
sLikedSongs: "'s LikedSongs"
},
explore: {
explore: "Explore",
loadMore: "Load More"
},
artist: {
latestRelease: "Latest Releases",
popularSongs: "Popular Songs",
showMore: "SHOW MORE",
showLess: "SHOW LESS",
EPSingle: "EPs & Singles",
albums: "Albums"
},
album: {
released: "Released"
},
playlist: {
playlist: "Playlists",
updatedAt: "Updated at"
},
login: {
accessToAll: "Access to all data",
loginText: "Login in Netease",
search: "Search account",
readonly: "Only access to public data",
usernameLogin: "Username Login",
searchHolder: "Your account username",
enterTip: "Press 'enter' to search",
choose: "Choose your account",
confirm: "Confirm",
countryCode: "Country code",
phone: "Phone",
email: "Email address",
password: "Password",
login: "Login",
loginWithEmail: "Login with Email",
loginWithPhone: "Login with Phone",
// TODO
agreement: `YesPlayMusic promises not to save any of your account information to the cloud.
Your password will be MD5 encrypted locally and then transmitted to NetEase Cloud API.
YesPlayMusic is not the official website of NetEase Cloud Music, please consider carefully before entering account information. You can also go to <a href="https://github.com/qier222/YesPlayMusic">YesPlayMusic's GitHub repository</a> to build and use the self-hosted NetEase Cloud Music API.`
},
mv: {
moreVideo: "More Videos"
},
next: {
nowPlaying: "Now Playing",
nextUp: "Next Up"
},
player: {
like: "Like",
previous: "Previous Song",
next: "Next Song",
repeat: "Repeat",
shuffle: "Shuffle",
play: "Play",
pause: "Pause",
mute: "Mute",
nextUp: "Next Up"
}
};

@ -0,0 +1,87 @@
export default {
play: "播放",
nav: {
home: "首页",
explore: "发现",
library: "资料库",
search: "搜索"
},
footer: {
settings: "设置"
},
home: {
recommendPlaylist: "推荐歌单",
recommendArtist: "推荐歌手",
newAlbum: "新专速递",
seeMore: "更多",
charts: "排行榜"
},
library: {
sLibrary: "的资料库",
likedSongs: "我喜欢的歌",
sLikedSongs: "喜欢的歌"
},
explore: {
explore: "发现",
loadMore: "加载更多"
},
artist: {
latestRelease: "最新发布",
popularSongs: "热门歌曲",
showMore: "显示更多",
showLess: "收起",
EPSingle: "EP和单曲",
albums: "专辑"
},
album: {
released: "发行于"
},
playlist: {
playlist: "歌单",
updatedAt: "最后更新于"
},
login: {
accessToAll: "可访问全部数据",
loginText: "登录网易云账号",
search: "搜索网易云账号",
readonly: "只能读取账号公开数据",
usernameLogin: "用户名登录",
searchHolder: "请输入你的网易云用户名",
enterTip: "按 Enter 搜索",
choose: "在列表中选中你的账号",
confirm: "确认",
countryCode: "国际区号",
phone: "手机号",
email: "邮箱",
password: "密码",
login: "登录",
usingEmail: "使用邮箱登录",
usingPhone: "使用手机号登录",
// TODO
agreement: `YesPlayMusic 承诺不会保存你的任何账号信息到云端。<br />
你的密码会在本地进行 MD5 加密后再传输到网易云 API<br />
YesPlayMusic 并非网易云官方网站输入账号信息前请慎重考虑 你也可以前往
<a href="https://github.com/qier222/YesPlayMusic"
>YesPlayMusic GitHub 源代码仓库</a
>
自行构建并使用自托管的网易云 API`
},
mv: {
moreVideo: "更多视频"
},
next: {
nowPlaying: "正在播放",
nextUp: "即将播放"
},
player: {
like: "喜欢",
previous: "上一首",
next: "下一首",
repeat: "单曲循环",
shuffle: "随机播放",
play: "播放",
pause: "暂停",
mute: "静音",
nextUp: "播放列表"
}
};

@ -1,144 +0,0 @@
export default {
en: {
nav: {
home: "Home",
explore: "Explore",
library: "Library",
search: "Search"
},
footer: {
settings: 'Settings',
},
home: {
recommendPlaylist: "Recommended Playlist",
recommendArtist: "Recommended Artist",
newAlbum: "Lastest Album",
leaderboard: "Leaderboard",
seeMore: "SEE MORE",
},
library: "Library",
explore: {
explore: "Explore",
loadMore: "Load More",
},
artist: {
latestRelease: "Latest Release",
popularSongs: "Popular Songs",
showMore: "SHOW MORE",
showLess: "SHOW LESS",
EPSingle: "EPs & Singles",
albums: "Albums"
},
album: {
released: "Released",
},
login: {
accessToAll: "Access to all data",
loginText: "Login in Netease",
search: "Search account",
readonly: "Only access to public data",
usernameLogin: "Username Login",
searchHolder: "Your account username",
enterTip: "Press 'enter' to search",
choose: "Choose your account",
confirm: "confirm",
countrycode: 'countrycode',
phone: 'phone',
email: 'email',
password: 'password',
login: 'Login',
usingEmail: 'Using email',
usingPhone: 'Using phone',
// TODO
agreement: `YesPlayMusic promises not to save any of your account information to the cloud.
Your password will be MD5 encrypted locally and then transmitted to NetEase Cloud API.
YesPlayMusic is not the official website of NetEase Cloud, please consider carefully before entering account information. You can also go to <a href="https://github.com/qier222/YesPlayMusic">YesPlayMusic's GitHub repository</a> to build and use the self-hosted NetEase Cloud API.`
},
mv: {
moreVideo: 'More Videos'
},
next: {
nowPlaying: 'Now Playing',
nextUp: 'Next Up'
},
playlist: "Playlists",
play: "PLAY",
likedSong: "Liked Songs",
shortIs: "'s",
is: "'s",
updatedAt: "Updated at",
},
"zh-CN": {
nav: {
home: "首页",
explore: "发现",
library: "歌单",
search: "搜索"
},
footer: {
settings: '设置',
},
home: {
recommendPlaylist: "推荐歌单",
recommendArtist: "推荐歌手",
newAlbum: "新专速递",
leaderboard: "排行榜",
seeMore: "更多",
},
library: "歌单",
explore: {
explore: "发现",
loadMore: "加载更多",
},
artist: {
latestRelease: "最新发布",
popularSongs: "热门歌曲",
showMore: "显示更多",
showLess: "收起",
EPSingle: "专辑及单曲",
albums: "专辑"
},
album: {
released: "发布于",
},
login: {
accessToAll: "可访问全部数据",
loginText: "登录网易云账号",
search: "搜索网易云账号",
readonly: "只能读取账号公开数据",
usernameLogin: '用户名登录',
searchHolder: "请输入你的网易云用户名",
enterTip: "按 Enter 搜索",
choose: "在列表中选中你的账号",
confirm: "确认",
countrycode: '国际区号',
phone: '手机号',
email: '邮箱',
password: '密码',
login: '登录',
usingEmail: '使用邮箱登录',
usingPhone: '使用手机号登录',
// TODO
agreement: `YesPlayMusic 承诺不会保存你的任何账号信息到云端。<br />
你的密码会在本地进行 MD5 加密后再传输到网易云 API<br />
YesPlayMusic 并非网易云官方网站输入账号信息前请慎重考虑 你也可以前往
<a href="https://github.com/qier222/YesPlayMusic"
>YesPlayMusic GitHub 源代码仓库</a
>
自行构建并使用自托管的网易云 API`
},
mv: {
moreVideo: '更多视频'
},
next: {
nowPlaying: '正在播放',
nextUp: '即将播放'
},
playlist: "播放列表",
play: "播放",
likedSong: "我喜欢的音乐",
shortIs: "",
is: "的",
updatedAt: "更新于"
}
};

@ -2,6 +2,7 @@ import Vue from "vue";
import dayjs from "dayjs"; import dayjs from "dayjs";
import duration from "dayjs/plugin/duration"; import duration from "dayjs/plugin/duration";
import relativeTime from "dayjs/plugin/relativeTime"; import relativeTime from "dayjs/plugin/relativeTime";
import locale from "@/locale";
Vue.filter("formatTime", (Milliseconds, format = "HH:MM:SS") => { Vue.filter("formatTime", (Milliseconds, format = "HH:MM:SS") => {
if (!Milliseconds) return ""; if (!Milliseconds) return "";
@ -27,6 +28,7 @@ Vue.filter("formatTime", (Milliseconds, format = "HH:MM:SS") => {
Vue.filter("formatDate", (timestamp, format = "MMM D, YYYY") => { Vue.filter("formatDate", (timestamp, format = "MMM D, YYYY") => {
if (!timestamp) return ""; if (!timestamp) return "";
if (locale.locale === "zh-CN") format = "YYYY年MM月DD日";
return dayjs(timestamp).format(format); return dayjs(timestamp).format(format);
}); });
@ -52,26 +54,34 @@ Vue.filter("resizeImage", (imgUrl, size = 512) => {
return `${httpsImgUrl}?param=${size}y${size}`; return `${httpsImgUrl}?param=${size}y${size}`;
}); });
Vue.filter("formatPlayCount", (count) => { Vue.filter("formatPlayCount", count => {
if (!count) return ""; if (!count) return "";
if (count > 100000000) { if (locale.locale === "zh-CN") {
return `${~~(count / 100000000)}亿`; if (count > 100000000) {
} return `${Math.floor((count / 100000000) * 100) / 100}亿`; // 2.32 亿
if (count > 10000) { }
return `${~~(count / 10000)}`; if (count > 100000) {
return `${Math.floor((count / 10000) * 10) / 10}`; // 232.1 万
}
if (count > 10000) {
return `${Math.floor((count / 10000) * 100) / 100}`; // 2.3 万
}
return count;
} else {
if (count > 10000000) {
return `${Math.floor((count / 1000000) * 10) / 10}M`; // 233.2M
}
if (count > 1000000) {
return `${Math.floor((count / 1000000) * 100) / 100}M`; // 2.3M
}
if (count > 1000) {
return `${Math.floor((count / 1000) * 100) / 100}K`; // 233.23K
}
return count;
} }
return count;
// if (count > 1000000) {
// return `${Math.floor((count / 1000000) * 100) / 100}M`;
// }
// if (count > 1000) {
// return `${~~(count / 1000)}K`;
// }
// return count;
}); });
Vue.filter("toHttps", (url) => { Vue.filter("toHttps", url => {
if (!url) return ""; if (!url) return "";
return url.replace(/^http:/, "https:"); return url.replace(/^http:/, "https:");
}); });

@ -38,7 +38,7 @@
@click.native="playAlbumByID(album.id)" @click.native="playAlbumByID(album.id)"
:iconClass="`play`" :iconClass="`play`"
> >
{{ $t('play') }} {{ $t("play") }}
</ButtonTwoTone> </ButtonTwoTone>
</div> </div>
</div> </div>
@ -47,7 +47,8 @@
<div class="extra-info"> <div class="extra-info">
<div class="album-time"></div> <div class="album-time"></div>
<div class="release-date"> <div class="release-date">
{{ $t("album.released") }} {{ album.publishTime | formatDate("MMMM D, YYYY") }} {{ $t("album.released") }}
{{ album.publishTime | formatDate("MMMM D, YYYY") }}
</div> </div>
<div class="copyright" v-if="album.company !== null"> <div class="copyright" v-if="album.company !== null">
© {{ album.company }} © {{ album.company }}
@ -86,7 +87,7 @@ export default {
Cover, Cover,
ButtonTwoTone, ButtonTwoTone,
TrackList, TrackList,
ExplicitSymbol, ExplicitSymbol
}, },
data() { data() {
return { return {
@ -94,27 +95,27 @@ export default {
id: 0, id: 0,
picUrl: "", picUrl: "",
artist: { artist: {
id: 0, id: 0
}, }
}, },
tracks: [], tracks: [],
showFullDescription: false, showFullDescription: false,
show: false, show: false
}; };
}, },
created() { created() {
getAlbum(this.$route.params.id) getAlbum(this.$route.params.id)
.then((data) => { .then(data => {
this.album = data.album; this.album = data.album;
this.tracks = data.songs; this.tracks = data.songs;
NProgress.done(); NProgress.done();
this.show = true; this.show = true;
return this.tracks; return this.tracks;
}) })
.then((tracks) => { .then(tracks => {
// to get explicit mark // to get explicit mark
let trackIDs = tracks.map((t) => t.id); let trackIDs = tracks.map(t => t.id);
getTrackDetail(trackIDs.join(",")).then((data) => { getTrackDetail(trackIDs.join(",")).then(data => {
this.tracks = data.songs; this.tracks = data.songs;
}); });
}); });
@ -123,20 +124,20 @@ export default {
...mapState(["player"]), ...mapState(["player"]),
albumTime() { albumTime() {
let time = 0; let time = 0;
this.tracks.map((t) => (time = time + t.dt)); this.tracks.map(t => (time = time + t.dt));
return time; return time;
}, }
}, },
methods: { methods: {
...mapMutations(["appendTrackToPlayerList"]), ...mapMutations(["appendTrackToPlayerList"]),
...mapActions(["playFirstTrackOnList", "playTrackOnListByID"]), ...mapActions(["playFirstTrackOnList", "playTrackOnListByID"]),
playAlbumByID(id, trackID = "first") { playAlbumByID(id, trackID = "first") {
if (this.tracks.find((t) => t.playable !== false) === undefined) { if (this.tracks.find(t => t.playable !== false) === undefined) {
return; return;
} }
playAlbumByID(id, trackID); playAlbumByID(id, trackID);
}, }
}, }
}; };
</script> </script>

@ -14,7 +14,9 @@
<div class="index-row"> <div class="index-row">
<div class="title"> <div class="title">
{{ $t("home.recommendPlaylist") }} {{ $t("home.recommendPlaylist") }}
<router-link to="/explore?category=推荐歌单">{{ $t("home.seeMore") }}</router-link> <router-link to="/explore?category=推荐歌单">{{
$t("home.seeMore")
}}</router-link>
</div> </div>
<CoverRow <CoverRow
:type="'playlist'" :type="'playlist'"
@ -35,8 +37,10 @@
</div> </div>
<div class="index-row"> <div class="index-row">
<div class="title"> <div class="title">
{{ $t("home.leaderboard") }} {{ $t("home.charts") }}
<router-link to="/explore?category=排行榜">{{ $t("home.seeMore") }}</router-link> <router-link to="/explore?category=排行榜">{{
$t("home.seeMore")
}}</router-link>
</div> </div>
<CoverRow <CoverRow
:type="'chart'" :type="'chart'"
@ -66,36 +70,36 @@ export default {
newReleasesAlbum: { items: [] }, newReleasesAlbum: { items: [] },
topList: { topList: {
items: [], items: [],
ids: [19723756, 180106, 60198, 3812895, 60131], ids: [19723756, 180106, 60198, 3812895, 60131]
}, },
recommendArtists: { recommendArtists: {
items: [], items: [],
indexs: [], indexs: []
}, }
}; };
}, },
computed: { computed: {
byAppleMusic() { byAppleMusic() {
return byAppleMusic; return byAppleMusic;
}, }
}, },
methods: { methods: {
loadData() { loadData() {
if (!this.show) NProgress.start(); if (!this.show) NProgress.start();
recommendPlaylist({ recommendPlaylist({
limit: 10, limit: 10
}).then((data) => { }).then(data => {
this.recommendPlaylist.items = data.result; this.recommendPlaylist.items = data.result;
NProgress.done(); NProgress.done();
this.show = true; this.show = true;
}); });
newAlbums({ newAlbums({
area: "EA", area: "EA",
limit: 10, limit: 10
}).then((data) => { }).then(data => {
this.newReleasesAlbum.items = data.albums; this.newReleasesAlbum.items = data.albums;
}); });
toplistOfArtists(2).then((data) => { toplistOfArtists(2).then(data => {
let indexs = []; let indexs = [];
while (indexs.length < 5) { while (indexs.length < 5) {
let tmp = ~~(Math.random() * 100); let tmp = ~~(Math.random() * 100);
@ -106,16 +110,16 @@ export default {
indexs.includes(index) indexs.includes(index)
); );
}); });
toplists().then((data) => { toplists().then(data => {
this.topList.items = data.list.filter((l) => this.topList.items = data.list.filter(l =>
this.topList.ids.includes(l.id) this.topList.ids.includes(l.id)
); );
}); });
}, }
}, },
activated() { activated() {
this.loadData(); this.loadData();
}, }
}; };
</script> </script>

@ -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>

@ -20,7 +20,7 @@
5277965913, 5277965913,
5277969451, 5277969451,
5277778542, 5277778542,
5278068783, 5278068783
].includes(playlist.id) ].includes(playlist.id)
" "
>Apple Music</span >Apple Music</span
@ -35,7 +35,8 @@
> >
</div> </div>
<div class="date-and-count"> <div class="date-and-count">
{{ $t("updatedAt") }} {{ playlist.updateTime | formatDate }} · {{ $t("playlist.updatedAt") }}
{{ playlist.updateTime | formatDate }} ·
{{ playlist.trackCount }} Songs {{ playlist.trackCount }} Songs
</div> </div>
<div class="description" @click="showFullDescription = true"> <div class="description" @click="showFullDescription = true">
@ -64,7 +65,7 @@
<h1> <h1>
<img class="avatar" :src="settings.user.avatarUrl | resizeImage" />{{ <img class="avatar" :src="settings.user.avatarUrl | resizeImage" />{{
settings.user.nickname settings.user.nickname
}}{{ $t("is") }} {{ $t("likedSong") }} }}{{ $t("library.sLikedSongs") }}
</h1> </h1>
</div> </div>
@ -103,7 +104,7 @@ export default {
components: { components: {
Cover, Cover,
ButtonTwoTone, ButtonTwoTone,
TrackList, TrackList
}, },
data() { data() {
return { return {
@ -111,14 +112,14 @@ export default {
playlist: { playlist: {
coverImgUrl: "", coverImgUrl: "",
creator: { creator: {
userId: "", userId: ""
}, },
trackIds: [], trackIds: []
}, },
showFullDescription: false, showFullDescription: false,
tracks: [], tracks: [],
loadingMore: false, loadingMore: false,
lastLoadedTrackIndex: 9, lastLoadedTrackIndex: 9
}; };
}, },
created() { created() {
@ -138,23 +139,23 @@ export default {
}, },
isLikeSongsPage() { isLikeSongsPage() {
return this.$route.name === "likedSongs"; return this.$route.name === "likedSongs";
}, }
}, },
methods: { methods: {
...mapMutations(["appendTrackToPlayerList"]), ...mapMutations(["appendTrackToPlayerList"]),
...mapActions(["playFirstTrackOnList", "playTrackOnListByID"]), ...mapActions(["playFirstTrackOnList", "playTrackOnListByID"]),
playPlaylistByID(trackID = "first") { playPlaylistByID(trackID = "first") {
let trackIDs = this.playlist.trackIds.map((t) => t.id); let trackIDs = this.playlist.trackIds.map(t => t.id);
playAList(trackIDs, this.playlist.id, "playlist", trackID); playAList(trackIDs, this.playlist.id, "playlist", trackID);
}, },
likePlaylist() { likePlaylist() {
subscribePlaylist({ subscribePlaylist({
id: this.playlist.id, id: this.playlist.id,
t: this.playlist.subscribed ? 2 : 1, t: this.playlist.subscribed ? 2 : 1
}).then((data) => { }).then(data => {
if (data.code === 200) if (data.code === 200)
this.playlist.subscribed = !this.playlist.subscribed; this.playlist.subscribed = !this.playlist.subscribed;
getPlaylistDetail(this.id, true).then((data) => { getPlaylistDetail(this.id, true).then(data => {
this.playlist = data.playlist; this.playlist = data.playlist;
}); });
}); });
@ -162,7 +163,7 @@ export default {
loadData(id, next = undefined) { loadData(id, next = undefined) {
this.id = id; this.id = id;
getPlaylistDetail(this.id, true) getPlaylistDetail(this.id, true)
.then((data) => { .then(data => {
this.playlist = data.playlist; this.playlist = data.playlist;
this.tracks = data.playlist.tracks; this.tracks = data.playlist.tracks;
this.tracks = mapTrackPlayableStatus(this.tracks); this.tracks = mapTrackPlayableStatus(this.tracks);
@ -190,8 +191,8 @@ export default {
) )
return t; return t;
}); });
trackIDs = trackIDs.map((t) => t.id); trackIDs = trackIDs.map(t => t.id);
getTrackDetail(trackIDs.join(",")).then((data) => { getTrackDetail(trackIDs.join(",")).then(data => {
this.tracks.push(...data.songs); this.tracks.push(...data.songs);
this.tracks = mapTrackPlayableStatus(this.tracks); this.tracks = mapTrackPlayableStatus(this.tracks);
this.lastLoadedTrackIndex += trackIDs.length; this.lastLoadedTrackIndex += trackIDs.length;
@ -213,8 +214,8 @@ export default {
this.loadingMore = true; this.loadingMore = true;
this.loadMore(); this.loadMore();
} }
}, }
}, }
}; };
</script> </script>

@ -79,7 +79,7 @@
</div> </div>
<div class="playlists" v-if="result.hasOwnProperty('playList')"> <div class="playlists" v-if="result.hasOwnProperty('playList')">
<div class="section-title">{{ $t("playlist") }}</div> <div class="section-title">{{ $t("playlist.playlist") }}</div>
<div class="albums-list"> <div class="albums-list">
<div <div
class="album" class="album"
@ -130,7 +130,7 @@ export default {
components: { components: {
Cover, Cover,
TrackList, TrackList,
MvRow, MvRow
}, },
data() { data() {
return { return {
@ -139,7 +139,7 @@ export default {
mvs: [], mvs: [],
type: 1, type: 1,
limit: 30, limit: 30,
offset: 0, offset: 0
}; };
}, },
computed: { computed: {
@ -150,26 +150,26 @@ export default {
tracks() { tracks() {
let tracks = this.result.song.songs.slice(0, 12); let tracks = this.result.song.songs.slice(0, 12);
return tracks; return tracks;
}, }
}, },
methods: { methods: {
goToAlbum(id) { goToAlbum(id) {
this.$router.push({ name: "album", params: { id } }); this.$router.push({ name: "album", params: { id } });
}, },
playTrackInSearchResult(id) { playTrackInSearchResult(id) {
let track = this.tracks.find((t) => t.id === id); let track = this.tracks.find(t => t.id === id);
appendTrackToPlayerList(track, true); appendTrackToPlayerList(track, true);
}, },
getData(keywords) { getData(keywords) {
search({ keywords: keywords, type: 1018 }).then((data) => { search({ keywords: keywords, type: 1018 }).then(data => {
this.result = data.result; this.result = data.result;
NProgress.done(); NProgress.done();
this.show = true; this.show = true;
}); });
search({ keywords: keywords, type: 1004 }).then((data) => { search({ keywords: keywords, type: 1004 }).then(data => {
this.mvs = data.result.mvs; this.mvs = data.result.mvs;
}); });
}, }
}, },
created() { created() {
this.getData(this.$route.query.keywords); this.getData(this.$route.query.keywords);
@ -179,7 +179,7 @@ export default {
next(); next();
NProgress.start(); NProgress.start();
this.getData(to.query.keywords); this.getData(to.query.keywords);
}, }
}; };
</script> </script>

Loading…
Cancel
Save