@@ -35,7 +35,7 @@
v-model="isUserMusic"
type="toggle"
label="Включить мою музыку"
- :disabled="!user?.id"
+ :disabled="!user?.id || userSongList.length === 0"
/>
@@ -71,7 +71,6 @@ export default {
components: {},
data() {
return {
- audioUrl: 'http://82.97.242.49:18000/radio.mp3',
isFavorites: false,
isPlayRadio: false,
connection: null,
@@ -108,7 +107,7 @@ export default {
if (this.isUserMusic === this.currentPlay.live) {
this.isUserMusic = !this.currentPlay.live;
}
- if (to.id !== from.id && this.user?.id) {
+ if (this.user?.id && to.id !== from.id) {
this.checkSongIsFavorite();
}
if (!this.currentPlay.live && to.id !== from.id) {
@@ -116,6 +115,14 @@ export default {
}
},
},
+ 'userSongList': {
+ immediate: false,
+ handler(to, from) {
+ if (this.user?.id && to.length !== from.length) {
+ this.checkSongIsFavorite();
+ }
+ },
+ },
'isUserMusic': {
immediate: false,
handler() {
@@ -133,16 +140,19 @@ export default {
this.$store.dispatch('initPlayer');
if (this.user?.id) {
this.checkSongIsFavorite();
+ this.getSongList();
}
this.playerInfo.progress = this.currentPlay.live ? 100 : 0;
- console.log(this.currentPlay)
if (!this.currentPlay.live && this.userSongList?.length > 0) {
- this.$store.dispatch('setCurrentPlay', {...this.userSongList[0], live: false});
- this.getAudio(this.userSongList[0]?.azura_id);
+ this.$store.dispatch('setCurrentPlay', {...this.userSongList[this.currentPlay.currentIndex || 0], live: false});
+ this.getAudio(this.userSongList[this.currentPlay.currentIndex || 0]?.azura_id);
if (this.player.target) {
this.player.target.addEventListener('timeupdate', this.updateProgress)
}
}
+ if (!this.user?.id){
+ this.$store.dispatch('setCurrentPlay', {...this.currentPlay, live: true, isLoader: true, currentIndex: null});
+ }
},
methods: {
connectionPlayer() {
@@ -154,7 +164,6 @@ export default {
this.connection.onHandler(this.getPlaying);
},
checkSongIsFavorite() {
- console.debug(this.currentPlay.azura_id || this.currentPlay.id, this.currentPlay.title)
app.getCheckFavoriteSong(this.currentPlay.azura_id || this.currentPlay.id).then(res => {
this.isFavorites = res.is_favorite;
}).catch(err => {
@@ -177,16 +186,17 @@ export default {
if (data.np.station.listen_url !== this.player.target.src) {
console.log('data.np.station.listen_url', data.np.station.listen_url)
this.$store.dispatch('changePlayer', data.np.station.listen_url);
+ const params = {
+ ...this.currentPlay,
+ ...data.np.now_playing.song,
+ azura_id: data.np.now_playing.song.id,
+ isLoader: false,
+ live: true,
+ currentIndex: null
+ }
+ delete params.unique_id;
+ this.$store.dispatch('setCurrentPlay', params);
}
- const params = {
- ...this.currentPlay,
- ...data.np.now_playing.song,
- azura_id: data.np.now_playing.song.id,
- isLoader: false,
- live: true,
- }
- delete params.unique_id;
- this.$store.dispatch('setCurrentPlay', params);
}
}
},
@@ -197,10 +207,16 @@ export default {
currentTime: this.player.target.currentTime
}
if (this.player.target.currentTime === this.player.target.duration){
- this.getAudio(this.userSongList[1]?.azura_id);
+ let currentIndex = this.currentPlay.currentIndex + 1;
+ if (!this.userSongList[currentIndex]?.azura_id || currentIndex === null){
+ currentIndex = 0;
+ }
+ this.$store.dispatch('setCurrentPlay', {...this.currentPlay, ...this.userSongList[currentIndex], currentIndex})
}
},
handlerPlay() {
+ console.log(this.currentPlay)
+ console.log(this.player)
this.$store.dispatch('handlerPlayer', {play: true});
},
handlerPause() {
@@ -209,13 +225,17 @@ export default {
getSongList() {
app.getFavoriteList().then(res => {
this.$store.dispatch('setUserFavorite', {songs: res})
+ console.log('res.length' ,res.length)
+ if (res.length === 0){
+ this.$store.dispatch('setCurrentPlay', {...this.currentPlay, live: true, isLoader: true});
+ }
}).catch(err => {
console.error(err)
})
},
handlerFavorites() {
if (this.user?.id) {
- const params = {...this.currentPlay, azura_id: this.currentPlay.id};
+ const params = {...this.currentPlay, azura_id: Number(this.currentPlay.id)?this.currentPlay.azura_id:this.currentPlay.id};
if (!this.isFavorites) {
delete params.id;
app.createFavoriteForUser(params).then(() => {
@@ -252,7 +272,6 @@ export default {
app.getAudio(id).then(res => {
const blob = new Blob([res], {type: 'application/audio'});
const audioUrl = URL.createObjectURL(blob);
- this.$store.dispatch('setCurrentPlay', {...this.currentPlay, isLoader: false})
this.$store.dispatch('changePlayer', audioUrl);
this.player.target.addEventListener('timeupdate', this.updateProgress);
@@ -263,6 +282,7 @@ export default {
this.playerInfo.duration = decodedData.duration;
});
});
+ this.$store.dispatch('setCurrentPlay', {...this.currentPlay, isLoader: false})
}).catch(err => {
this.$store.dispatch('setCurrentPlay', {...this.currentPlay, isLoader: false})
console.debug(err)
@@ -271,9 +291,10 @@ export default {
changeLive() {
if (this.currentPlay.live) {
console.log('избранное')
- this.getAudio(this.userSongList[0].azura_id);
this.playerInfo.progress = 0;
- this.$store.dispatch('setCurrentPlay', {...this.userSongList[0], live: false, isLoader: true});
+ const params = {...this.userSongList[this.currentPlay.currentIndex || 0], live: false, isLoader: true};
+ if (!this.currentPlay.currentIndex) params.currentIndex = 0;
+ this.$store.dispatch('setCurrentPlay', params);
} else {
this.playerInfo.progress = 100;
this.$store.dispatch('setCurrentPlay', {...this.currentPlay, live: true, isLoader: true});
diff --git a/client/src/components/playlist-item.vue b/client/src/components/playlist-item.vue
new file mode 100644
index 0000000..5f08a74
--- /dev/null
+++ b/client/src/components/playlist-item.vue
@@ -0,0 +1,23 @@
+
+
+
+
+
diff --git a/client/src/components/playlist-roster.vue b/client/src/components/playlist-roster.vue
new file mode 100644
index 0000000..75ffe9a
--- /dev/null
+++ b/client/src/components/playlist-roster.vue
@@ -0,0 +1,37 @@
+
+
+
+
+
diff --git a/client/src/components/rubric-block.vue b/client/src/components/rubric-block.vue
index 800c443..4844d5f 100644
--- a/client/src/components/rubric-block.vue
+++ b/client/src/components/rubric-block.vue
@@ -27,7 +27,7 @@
diff --git a/client/src/views/playlist.vue b/client/src/views/playlist.vue
new file mode 100644
index 0000000..f80ec46
--- /dev/null
+++ b/client/src/views/playlist.vue
@@ -0,0 +1,11 @@
+
+
+
+
+
+
+
diff --git a/client/src/views/profile.vue b/client/src/views/profile.vue
index c245c8b..2e3a1f8 100644
--- a/client/src/views/profile.vue
+++ b/client/src/views/profile.vue
@@ -1,33 +1,51 @@
-
+
- {{ user.email }}
-
-
-
-
-
-
-
-
-
+ />
+ {{ user.email }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
@@ -35,10 +53,11 @@
import AppBreadcrumbs from "@/components/app-breadcrumbs.vue";
import SongList from "@/components/song-list.vue";
import {app} from "@/services";
+import PlaylistRoster from "@/components/playlist-roster.vue";
export default {
name: 'profile',
- components: {SongList, AppBreadcrumbs},
+ components: {PlaylistRoster, SongList, AppBreadcrumbs},
data() {
return {
currentTabsItem: 'music',
@@ -56,15 +75,16 @@ export default {
name: 'playlists'
},
],
- songList: [],
- showLoader: true,
+ showLoaderSong: false,
+ showLoaderPlaylist: false,
+ showLoaderPodcast: true,
}
},
computed: {
user() {
return this.$store.state.user;
},
- userFavorite(){
+ userFavorite() {
return this.$store.state.userFavorite
}
},
@@ -78,31 +98,66 @@ export default {
this.currentTabsItem = 'music';
}
},
- }
+ },
+ '$route.name': {
+ immediate: false,
+ handler(to) {
+ if (to === 'playlist') {
+ this.currentTabsItem = 'playlists'
+ }
+ },
+ },
},
created() {
this.getSongList();
+ this.getPlaylists();
},
methods: {
getSongList() {
- this.showLoader = true;
+ this.showLoaderSong = true;
app.getFavoriteList().then(res => {
- this.showLoader = false;
- this.$store.dispatch('setUserFavorite', {songs: res})
+ this.showLoaderSong = false;
+ this.$store.dispatch('setUserFavorite', {songs: res});
}).catch(err => {
- this.showLoader = false;
+ this.showLoaderSong = false;
console.error(err)
})
},
changeTab(tab) {
this.currentTabsItem = tab;
- this.$router.push({name: this.$route.name, hash: `#${tab}`});
+ if (this.$route.name === 'profile') {
+ this.$router.push({name: this.$route.name, hash: `#${tab}`});
+ } else {
+ this.$router.push({name: 'profile', hash: `#${tab}`});
+ }
},
- removeFavorites(song){
+ removeFavorites(song) {
+ this.showLoaderSong = true;
app.removeFavorites(song).then(() => {
+ this.showLoaderSong = false;
this.getSongList();
}).catch(err => {
- this.showLoader = false;
+ this.showLoaderSong = false;
+ console.error(err)
+ })
+ },
+ showRecovery() {
+ this.$store.dispatch('setModal', {changingUser: true});
+ },
+ getPlaylists() {
+ this.showLoaderPlaylist = true;
+ app.getPlaylists().then(res => {
+ this.showLoaderPlaylist = false;
+ this.$store.dispatch('setUserFavorite', {playlist: res});
+ }).catch(err => {
+ this.showLoaderPlaylist = false;
+ console.error(err)
+ })
+ },
+ createPlayList() {
+ app.createPlaylists().then(res=>{
+ this.$router.push({name: 'playlist-edit'});
+ }).catch(err=>{
console.error(err)
})
}