修复bug和改进翻译 #22

master
qier222 4 years ago
parent 6ed061eff6
commit 23b68fc401

@ -31,7 +31,7 @@ export default {
components: { components: {
Navbar, Navbar,
Player, Player,
GlobalEvents, GlobalEvents
}, },
methods: { methods: {
play(e) { play(e) {
@ -42,8 +42,8 @@ export default {
if (event.target.tagName === "INPUT") return false; if (event.target.tagName === "INPUT") return false;
if (this.$route.name === "mv") return false; if (this.$route.name === "mv") return false;
return true; return true;
}, }
}, }
}; };
</script> </script>
@ -72,6 +72,7 @@ main {
} }
button { button {
font-family: inherit;
background: none; background: none;
border: none; border: none;
cursor: pointer; cursor: pointer;

@ -35,7 +35,7 @@
/></span> /></span>
<span <span
class="lock-icon" class="lock-icon"
v-if="type === 'playlist' && item.privacy !== 0" v-if="type === 'playlist' && item.privacy === 10"
> >
<svg-icon icon-class="lock" <svg-icon icon-class="lock"
/></span> /></span>

@ -31,8 +31,8 @@
:key="ar.id" :key="ar.id"
@click="goToArtist(ar.id)" @click="goToArtist(ar.id)"
> >
{{ ar.name }} <span class="ar">{{ ar.name }}</span
<span v-if="index !== currentTrack.ar.length - 1">, </span> ><span v-if="index !== currentTrack.ar.length - 1">, </span>
</span> </span>
</div> </div>
</div> </div>
@ -356,7 +356,7 @@ export default {
-webkit-line-clamp: 1; -webkit-line-clamp: 1;
overflow: hidden; overflow: hidden;
word-break: break-all; word-break: break-all;
span { span.ar {
cursor: pointer; cursor: pointer;
&:hover { &:hover {
text-decoration: underline; text-decoration: underline;

@ -182,9 +182,9 @@ button.play-button {
.track { .track {
display: flex; display: flex;
align-items: center; align-items: center;
padding: 8px; padding: 8px;
border-radius: 12px; border-radius: 12px;
user-select: none;
.no { .no {
display: flex; display: flex;

@ -30,7 +30,7 @@ export default {
popularSongs: "Popular Songs", popularSongs: "Popular Songs",
showMore: "SHOW MORE", showMore: "SHOW MORE",
showLess: "SHOW LESS", showLess: "SHOW LESS",
EPSingle: "EPs & Singles", EPsSingles: "EPs & Singles",
albums: "Albums" albums: "Albums"
}, },
album: { album: {
@ -42,7 +42,7 @@ export default {
}, },
login: { login: {
accessToAll: "Access to all data", accessToAll: "Access to all data",
loginText: "Login in Netease", loginText: "Login to Netease",
search: "Search account", search: "Search account",
readonly: "Only access to public data", readonly: "Only access to public data",
usernameLogin: "Username Login", usernameLogin: "Username Login",
@ -58,8 +58,8 @@ export default {
loginWithEmail: "Login with Email", loginWithEmail: "Login with Email",
loginWithPhone: "Login with Phone", loginWithPhone: "Login with Phone",
// TODO // TODO
agreement: `YesPlayMusic promises not to save any of your account information to the cloud. notice: `YesPlayMusic promises not to save any of your account information to the cloud.<br />
Your password will be MD5 encrypted locally and then transmitted to NetEase Cloud API. Your password will be MD5 encrypted locally and then transmitted to NetEase Cloud API.<br />
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.` 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: { mv: {

@ -30,7 +30,7 @@ export default {
popularSongs: "热门歌曲", popularSongs: "热门歌曲",
showMore: "显示更多", showMore: "显示更多",
showLess: "收起", showLess: "收起",
EPSingle: "EP和单曲", EPsSingles: "EP和单曲",
albums: "专辑" albums: "专辑"
}, },
album: { album: {
@ -55,10 +55,11 @@ export default {
email: "邮箱", email: "邮箱",
password: "密码", password: "密码",
login: "登录", login: "登录",
usingEmail: "使用邮箱登录", loginWithEmail: "使用邮箱登录",
usingPhone: "使用手机号登录", loginWithPhone: "使用手机号登录",
// TODO // TODO
agreement: `YesPlayMusic 承诺不会保存你的任何账号信息到云端。<br /> notice: `
YesPlayMusic 承诺不会保存你的任何账号信息到云端<br />
你的密码会在本地进行 MD5 加密后再传输到网易云 API<br /> 你的密码会在本地进行 MD5 加密后再传输到网易云 API<br />
YesPlayMusic 并非网易云官方网站输入账号信息前请慎重考虑 你也可以前往 YesPlayMusic 并非网易云官方网站输入账号信息前请慎重考虑 你也可以前往
<a href="https://github.com/qier222/YesPlayMusic" <a href="https://github.com/qier222/YesPlayMusic"

@ -13,13 +13,13 @@
</div> </div>
<div class="buttons"> <div class="buttons">
<ButtonTwoTone @click.native="playPopularSongs()" :iconClass="`play`"> <ButtonTwoTone @click.native="playPopularSongs()" :iconClass="`play`">
{{ $t('play') }} {{ $t("play") }}
</ButtonTwoTone> </ButtonTwoTone>
</div> </div>
</div> </div>
</div> </div>
<div class="latest-release"> <div class="latest-release">
<div class="section-title">{{ $t('artist.latestRelease') }}</div> <div class="section-title">{{ $t("artist.latestRelease") }}</div>
<div class="release"> <div class="release">
<div class="container"> <div class="container">
<Cover <Cover
@ -53,7 +53,7 @@
</div> </div>
</div> </div>
<div class="popular-tracks"> <div class="popular-tracks">
<div class="section-title">{{ $t('artist.popularSongs') }}</div> <div class="section-title">{{ $t("artist.popularSongs") }}</div>
<TrackList <TrackList
:tracks="popularTracks.slice(0, showMorePopTracks ? 24 : 12)" :tracks="popularTracks.slice(0, showMorePopTracks ? 24 : 12)"
:type="'tracklist'" :type="'tracklist'"
@ -61,13 +61,13 @@
<div class="show-more"> <div class="show-more">
<button @click="showMorePopTracks = !showMorePopTracks"> <button @click="showMorePopTracks = !showMorePopTracks">
<span v-show="!showMorePopTracks">{{ $t('artist.showMore') }}</span> <span v-show="!showMorePopTracks">{{ $t("artist.showMore") }}</span>
<span v-show="showMorePopTracks">{{ $t('artist.showLess') }}</span> <span v-show="showMorePopTracks">{{ $t("artist.showLess") }}</span>
</button> </button>
</div> </div>
</div> </div>
<div class="albums" v-if="albums.length !== 0"> <div class="albums" v-if="albums.length !== 0">
<div class="section-title">{{ $t('artist.album') }}</div> <div class="section-title">{{ $t("artist.albums") }}</div>
<CoverRow <CoverRow
:type="'album'" :type="'album'"
:items="albums" :items="albums"
@ -80,7 +80,7 @@
<MvRow :mvs="mvs" subtitle="publishTime" /> <MvRow :mvs="mvs" subtitle="publishTime" />
</div> </div>
<div class="eps"> <div class="eps">
<div class="section-title">{{ $t('artist.EPSingle') }}</div> <div class="section-title">{{ $t("artist.EPsSingles") }}</div>
<CoverRow <CoverRow
:type="'album'" :type="'album'"
:items="eps" :items="eps"
@ -112,7 +112,7 @@ export default {
show: false, show: false,
artist: { artist: {
img1v1Url: img1v1Url:
"https://p1.music.126.net/VnZiScyynLG7atLIZ2YPkw==/18686200114669622.jpg", "https://p1.music.126.net/VnZiScyynLG7atLIZ2YPkw==/18686200114669622.jpg"
}, },
popularTracks: [], popularTracks: [],
albumsData: [], albumsData: [],
@ -122,28 +122,28 @@ export default {
id: 0, id: 0,
name: "", name: "",
type: "", type: "",
size: "", size: ""
}, },
showMorePopTracks: false, showMorePopTracks: false,
mvs: [], mvs: []
}; };
}, },
computed: { computed: {
...mapState(["player"]), ...mapState(["player"]),
albums() { albums() {
return this.albumsData.filter((a) => a.type === "专辑"); return this.albumsData.filter(a => a.type === "专辑");
}, },
eps() { eps() {
return this.albumsData.filter((a) => return this.albumsData.filter(a =>
["EP/Single", "EP", "Single"].includes(a.type) ["EP/Single", "EP", "Single"].includes(a.type)
); );
}, }
}, },
methods: { methods: {
...mapMutations(["appendTrackToPlayerList"]), ...mapMutations(["appendTrackToPlayerList"]),
...mapActions(["playFirstTrackOnList", "playTrackOnListByID"]), ...mapActions(["playFirstTrackOnList", "playTrackOnListByID"]),
loadData(id, next = undefined) { loadData(id, next = undefined) {
getArtist(id).then((data) => { getArtist(id).then(data => {
this.artist = data.artist; this.artist = data.artist;
this.popularTracks = data.hotSongs; this.popularTracks = data.hotSongs;
this.popularTracks = mapTrackPlayableStatus(this.popularTracks); this.popularTracks = mapTrackPlayableStatus(this.popularTracks);
@ -151,24 +151,24 @@ export default {
NProgress.done(); NProgress.done();
this.show = true; this.show = true;
}); });
getArtistAlbum({ id: id, limit: 200 }).then((data) => { getArtistAlbum({ id: id, limit: 200 }).then(data => {
this.albumsData = data.hotAlbums; this.albumsData = data.hotAlbums;
this.latestRelease = data.hotAlbums[0]; this.latestRelease = data.hotAlbums[0];
}); });
artistMv(id).then((data) => { artistMv(id).then(data => {
this.mvs = data.mvs; this.mvs = data.mvs;
}); });
}, },
goToAlbum(id) { goToAlbum(id) {
this.$router.push({ this.$router.push({
name: "album", name: "album",
params: { id }, params: { id }
}); });
}, },
playPopularSongs(trackID = "first") { playPopularSongs(trackID = "first") {
let trackIDs = this.popularTracks.map((t) => t.id); let trackIDs = this.popularTracks.map(t => t.id);
playAList(trackIDs, this.artist.id, "artist", trackID); playAList(trackIDs, this.artist.id, "artist", trackID);
}, }
}, },
created() { created() {
this.loadData(this.$route.params.id); this.loadData(this.$route.params.id);
@ -187,7 +187,7 @@ export default {
this.artist.img1v1Url = this.artist.img1v1Url =
"https://p1.music.126.net/VnZiScyynLG7atLIZ2YPkw==/18686200114669622.jpg"; "https://p1.music.126.net/VnZiScyynLG7atLIZ2YPkw==/18686200114669622.jpg";
this.loadData(to.params.id, next); this.loadData(to.params.id, next);
}, }
}; };
</script> </script>

@ -11,7 +11,9 @@
<div class="inputs"> <div class="inputs">
<input <input
id="countryCode" id="countryCode"
:placeholder="inputFocus === 'phone' ? '' : $t('login.countrycode')" :placeholder="
inputFocus === 'phone' ? '' : $t('login.countrycode')
"
v-model="countryCode" v-model="countryCode"
@focus="inputFocus = 'phone'" @focus="inputFocus = 'phone'"
@blur="inputFocus = ''" @blur="inputFocus = ''"
@ -48,7 +50,9 @@
<input <input
type="password" type="password"
id="password" id="password"
:placeholder="inputFocus === 'password' ? '' : $t('login.password')" :placeholder="
inputFocus === 'password' ? '' : $t('login.password')
"
v-model="password" v-model="password"
@focus="inputFocus = 'password'" @focus="inputFocus = 'password'"
@blur="inputFocus = ''" @blur="inputFocus = ''"
@ -58,7 +62,9 @@
</div> </div>
</div> </div>
<div class="confirm"> <div class="confirm">
<button @click="login" v-show="!processing">{{ $t('login.login') }}</button> <button @click="login" v-show="!processing">
{{ $t("login.login") }}
</button>
<button v-show="processing" class="loading" disabled> <button v-show="processing" class="loading" disabled>
<span></span> <span></span>
<span></span> <span></span>
@ -66,18 +72,14 @@
</button> </button>
</div> </div>
<div class="other-login"> <div class="other-login">
<a v-show="mode === 'phone'" @click="mode = 'email'">{{ $t('login.usingEmail') }}</a> <a v-show="mode === 'phone'" @click="mode = 'email'">{{
<a v-show="mode === 'email'" @click="mode = 'phone'">{{ $t('login.usingPhone') }}</a> $t("login.loginWithEmail")
</div> }}</a>
<div class="notice"> <a v-show="mode === 'email'" @click="mode = 'phone'">{{
YesPlayMusic 承诺不会保存你的任何账号信息到云端<br /> $t("login.loginWithPhone")
你的密码会在本地进行 MD5 加密后再传输到网易云 API<br /> }}</a>
YesPlayMusic 并非网易云官方网站输入账号信息前请慎重考虑 你也可以前往
<a href="https://github.com/qier222/YesPlayMusic"
>YesPlayMusic GitHub 源代码仓库</a
>
自行构建并使用自托管的网易云 API
</div> </div>
<div class="notice" v-html="$t('login.notice')"></div>
</div> </div>
</template> </template>
@ -100,7 +102,7 @@ export default {
email: "", email: "",
password: "", password: "",
smsCode: "", smsCode: "",
inputFocus: "", inputFocus: ""
}; };
}, },
created() { created() {
@ -116,11 +118,11 @@ export default {
Cookies.set("loginMode", "account", { expires: 3650 }); Cookies.set("loginMode", "account", { expires: 3650 });
userPlaylist({ userPlaylist({
uid: this.$store.state.settings.user.userId, uid: this.$store.state.settings.user.userId,
limit: 1, limit: 1
}).then((data) => { }).then(data => {
this.updateUserInfo({ this.updateUserInfo({
key: "likedSongPlaylistID", key: "likedSongPlaylistID",
value: data.playlist[0].id, value: data.playlist[0].id
}); });
this.$router.push({ path: "/library" }); this.$router.push({ path: "/library" });
}); });
@ -133,44 +135,55 @@ export default {
this.phone === "" || this.phone === "" ||
this.password === "" this.password === ""
) { ) {
alert("请输入完整的信息"); alert("国家区号、手机或密码不正确");
this.processing = false; this.processing = false;
return; return;
} }
loginWithPhone({ loginWithPhone({
countrycode: this.countryCode.replace("+", "").replace(/\s/g, ''), countrycode: this.countryCode.replace("+", "").replace(/\s/g, ""),
phone: this.phoneNumber.replace(/\s/g, ''), phone: this.phoneNumber.replace(/\s/g, ""),
password: "fakePassword", password: "fakePassword",
md5_password: md5(this.password).toString(), md5_password: md5(this.password).toString()
}) })
.then((data) => { .then(data => {
this.updateUser(data.profile); if (data.code !== 502) {
this.afterLogin(); this.updateUser(data.profile);
this.afterLogin();
}
}) })
.catch(() => { .catch(error => {
this.processing = false; this.processing = false;
alert(error);
}); });
} else { } else {
if (this.email === "" || this.password === "") { let emailReg = /^[A-Za-z0-9]+([_][A-Za-z0-9]+)*@([A-Za-z0-9]+\.)+[A-Za-z]{2,6}$/;
alert("请输入完整的信息"); if (
this.email === "" ||
this.password === "" ||
!emailReg.test(this.email)
) {
alert("邮箱或密码不正确");
this.processing = false; this.processing = false;
return; return;
} }
loginWithEmail({ loginWithEmail({
email: this.email.replace(/\s/g, ''), email: this.email.replace(/\s/g, ""),
password: "fakePassword", password: "fakePassword",
md5_password: md5(this.password).toString(), md5_password: md5(this.password).toString()
}) })
.then((data) => { .then(data => {
this.updateUser(data.profile); if (data.code !== 502) {
this.afterLogin(); this.updateUser(data.profile);
this.afterLogin();
}
}) })
.catch(() => { .catch(error => {
this.processing = false; this.processing = false;
alert(error);
}); });
} }
}, }
}, }
}; };
</script> </script>
@ -235,13 +248,14 @@ export default {
.inputs { .inputs {
display: flex; display: flex;
width: 85%;
} }
input { input {
font-size: 20px; font-size: 20px;
border: none; border: none;
background: transparent; background: transparent;
width: 96%; width: 100%;
font-weight: 600; font-weight: 600;
margin-top: -1px; margin-top: -1px;
color: rgba(0, 0, 0, 0.88); color: rgba(0, 0, 0, 0.88);
@ -251,7 +265,7 @@ export default {
flex: 2; flex: 2;
} }
input#phoneNumber { input#phoneNumber {
flex: 14; flex: 12;
} }
.active { .active {

@ -24,11 +24,11 @@ import TrackList from "@/components/TrackList.vue";
export default { export default {
name: "Next", name: "Next",
components: { components: {
TrackList, TrackList
}, },
data() { data() {
return { return {
tracks: [], tracks: []
}; };
}, },
computed: { computed: {
@ -48,50 +48,51 @@ export default {
}; };
} }
return this.tracks return this.tracks
.filter((t) => t.sort > this.player.currentTrack.sort) .filter(t => this.player.list.find(t2 => t2.id === t.id) !== undefined)
.filter(t => t.sort > this.player.currentTrack.sort)
.sort(compare("sort")); .sort(compare("sort"));
}, }
}, },
watch: { watch: {
currentTrack() { currentTrack() {
this.loadTracks(); this.loadTracks();
}, },
playerShuffle() { playerShuffle() {
this.tracks = this.tracks.map((t) => { this.tracks = this.tracks.map(t => {
t.sort = this.player.list.find((t2) => t.id === t2.id).sort; t.sort = this.player.list.find(t2 => t.id === t2.id).sort;
return t; return t;
}); });
}, }
}, },
methods: { methods: {
...mapActions(["playTrackOnListByID"]), ...mapActions(["playTrackOnListByID"]),
loadTracks() { loadTracks() {
console.time("loadTracks"); console.time("loadTracks");
let loadedTrackIDs = this.tracks.map((t) => t.id); let loadedTrackIDs = this.tracks.map(t => t.id);
let basicTracks = this.player.list let basicTracks = this.player.list
.filter( .filter(
(t) => t =>
t.sort > this.player.currentTrack.sort && t.sort > this.player.currentTrack.sort &&
t.sort <= this.player.currentTrack.sort + 100 t.sort <= this.player.currentTrack.sort + 100
) )
.filter((t) => loadedTrackIDs.includes(t.id) === false); .filter(t => loadedTrackIDs.includes(t.id) === false);
let trackIDs = basicTracks.map((t) => t.id); let trackIDs = basicTracks.map(t => t.id);
if (trackIDs.length > 0) { if (trackIDs.length > 0) {
getTrackDetail(trackIDs.join(",")).then((data) => { getTrackDetail(trackIDs.join(",")).then(data => {
let newTracks = data.songs.map((t) => { let newTracks = data.songs.map(t => {
t.sort = this.player.list.find((t2) => t2.id == t.id).sort; t.sort = this.player.list.find(t2 => t2.id == t.id).sort;
return t; return t;
}); });
this.tracks.push(...newTracks); this.tracks.push(...newTracks);
}); });
} }
console.timeEnd("loadTracks"); console.timeEnd("loadTracks");
}, }
}, },
activated() { activated() {
this.loadTracks(); this.loadTracks();
}, }
}; };
</script> </script>

Loading…
Cancel
Save