Browse Source

Replaced TabQueryHandler where it wasnt needed

Owen Diffey 3 years ago
parent
commit
aebd7b8811

+ 1 - 0
frontend/src/components/PlaylistItem.vue

@@ -87,6 +87,7 @@ export default {
 		div {
 			display: flex;
 			align-items: center;
+			line-height: 1;
 
 			button,
 			.button {

+ 8 - 1
frontend/src/components/SongItem.vue

@@ -1,5 +1,8 @@
 <template>
-	<div class="universal-item song-item">
+	<div
+		class="universal-item song-item"
+		:class="{ 'with-duration': duration }"
+	>
 		<div class="thumbnail-and-info">
 			<song-thumbnail :class="{ large: largeThumbnail }" :song="song" />
 			<div class="song-info">
@@ -311,5 +314,9 @@ export default {
 	.edit-icon {
 		color: var(--primary-color);
 	}
+
+	&.with-duration .song-info {
+		width: calc(100% - 150px);
+	}
 }
 </style>

+ 3 - 3
frontend/src/components/modals/ManageStation/Tabs/Blacklist.vue

@@ -72,13 +72,10 @@ import { mapActions, mapState, mapGetters } from "vuex";
 import Toast from "toasters";
 import PlaylistItem from "@/components/PlaylistItem.vue";
 
-import TabQueryHandler from "@/mixins/TabQueryHandler.vue";
-
 export default {
 	components: {
 		PlaylistItem
 	},
-	mixins: [TabQueryHandler],
 	data() {
 		return {
 			tab: "playlists"
@@ -98,6 +95,9 @@ export default {
 		})
 	},
 	methods: {
+		showTab(tab) {
+			this.tab = tab;
+		},
 		showPlaylist(playlistId) {
 			this.editPlaylist(playlistId);
 			this.openModal({ sector: "station", modal: "editPlaylist" });

+ 4 - 2
frontend/src/components/modals/ManageStation/Tabs/Playlists.vue

@@ -192,7 +192,6 @@ import draggable from "vuedraggable";
 import PlaylistItem from "@/components/PlaylistItem.vue";
 import Confirm from "@/components/Confirm.vue";
 
-import TabQueryHandler from "@/mixins/TabQueryHandler.vue";
 import SortablePlaylists from "@/mixins/SortablePlaylists.vue";
 
 export default {
@@ -202,7 +201,7 @@ export default {
 		Confirm
 		// CreatePlaylist: () => import("@/components/modals/CreatePlaylist.vue")
 	},
-	mixins: [TabQueryHandler, SortablePlaylists],
+	mixins: [SortablePlaylists],
 	data() {
 		return {
 			tab: "current"
@@ -326,6 +325,9 @@ export default {
 		);
 	},
 	methods: {
+		showTab(tab) {
+			this.tab = tab;
+		},
 		isOwner() {
 			return this.loggedIn && this.userId === this.station.owner;
 		},

+ 15 - 4
frontend/src/components/modals/ManageStation/index.vue

@@ -1,5 +1,12 @@
 <template>
-	<modal title="Manage Station" class="manage-station-modal">
+	<modal
+		:title="
+			!isOwnerOrAdmin() && station.partyMode
+				? 'Add Song to Queue'
+				: 'Manage Station'
+		"
+		class="manage-station-modal"
+	>
 		<template #body>
 			<div class="custom-modal-body" v-if="station && station._id">
 				<div class="left-section">
@@ -174,7 +181,6 @@
 import { mapState, mapGetters, mapActions } from "vuex";
 
 import Toast from "toasters";
-import TabQueryHandler from "@/mixins/TabQueryHandler.vue";
 
 import Confirm from "@/components/Confirm.vue";
 import Queue from "@/components/Queue.vue";
@@ -197,14 +203,13 @@ export default {
 		Search,
 		Blacklist
 	},
-	mixins: [TabQueryHandler],
 	props: {
 		stationId: { type: String, default: "" },
 		sector: { type: String, default: "admin" }
 	},
 	data() {
 		return {
-			tab: "playlists"
+			tab: "settings"
 		};
 	},
 	computed: {
@@ -230,6 +235,9 @@ export default {
 				const { station } = res.data;
 				this.editStation(station);
 
+				if (!this.isOwnerOrAdmin() && this.station.partyMode)
+					this.tab = "search";
+
 				const currentSong = res.data.station.currentSong
 					? res.data.station.currentSong
 					: {};
@@ -305,6 +313,9 @@ export default {
 		this.clearStation();
 	},
 	methods: {
+		showTab(tab) {
+			this.tab = tab;
+		},
 		isOwner() {
 			return this.loggedIn && this.userId === this.station.owner;
 		},

+ 0 - 16
frontend/src/pages/Station/index.vue

@@ -154,22 +154,6 @@
 								</button>
 
 								<!-- (Admin) Station Settings Button -->
-								<button
-									class="button is-primary"
-									@click="
-										openModal({
-											sector: 'station',
-											modal: 'editStation'
-										})
-									"
-								>
-									<i class="material-icons icon-with-button"
-										>settings</i
-									>
-									<span class="optional-desktop-only-text">
-										Station settings
-									</span>
-								</button>
 								<button
 									class="button is-primary"
 									@click="