beginning implement add station modal functionality

src/views/Categories.vue

@@ -103,7 +103,6 @@ export default {
 	},
 	mounted() {
 		this.onRoute()
-		this.scroll()
 	},
 	methods: {
 		...mapActions([

src/views/Favorites.vue

@@ -26,8 +26,8 @@
 			:station-data="stations" />
 		<AppContent>
 			<div class="controls">
-				<Breadcrumbs @dropped="dropped">
+				<Breadcrumbs>
-					<Breadcrumb title="Home" href="#/" @dropped="droppedOnCrumb" />
+					<Breadcrumb title="Home" href="#/" />
 					<Breadcrumb title="Favorites" href="#/favorites" />
 				</Breadcrumbs>
 				<Actions>
@@ -66,21 +66,33 @@
 			<Modal v-if="modal" @close="closeModal">
 				<div class="modalContent">
 					<h2 class="oc-dialog-title">
-						Add custom station
+						{{ t('radio', 'Add custom station') }}
 					</h2>
 					<form>
-						<label for="stationName">Name:</label>
+						<label for="stationName">{{ t('radio', 'Name') }}:</label>
-						<input id="stationName" type="text">
+						<input
-						<label for="streamUrl">Stream url:</label>
+							id="stationName"
-						<input id="streamUrl" type="text">
+							v-model="station.name"
-						<label for="faviconUrl">Favicon url:</label>
+							type="text"
-						<input id="faviconUrl" type="text">
+							required>
+						<label for="streamUrl">{{ t('radio', 'Stream url') }}:</label>
+						<input
+							id="streamUrl"
+							v-model="station.streamUrl"
+							type="url"
+							required>
+						<label for="faviconUrl">{{ t('radio', 'Favicon url') }}:</label>
+						<input
+							id="faviconUrl"
+							v-model="station.faviconUrl"
+							type="url"
+							required>
 					</form>
 					<div class="formControls">
 						<!-- FIXME: Use nextcloud-vue button component -->
 						<button class="icon-add-white primary button new-button"
 							@click="addCustomStation()">
-							Add station
+							{{ t('radio', 'Add station') }}
 						</button>
 					</div>
 				</div>
@@ -132,6 +144,7 @@ export default {
 		sidebarStation: {},
 		tableData: [],
 		modal: true,
+		station: {},
 	}),
 	computed: {
 		...mapGetters([
@@ -156,7 +169,6 @@ export default {
 	},
 	mounted() {
 		this.onRoute()
-		this.scroll()
 	},
 	methods: {
 		...mapActions([
@@ -230,7 +242,7 @@ export default {
 		},
 
 		addCustomStation() {
-			console.log('Add custom station')
+			console.log('Add custom station', this.station.name)
 			// this.addFavorite(station)
 		},