click to copy

src/components/show_category.vue

@@ -12,6 +12,9 @@
 				axios.get(import.meta.env.VITE_PRACTICE_TRACKER_API_URL+'show-category/'+event.target.value).then((response)=>{
 					this.categorySessions = response.data;
 				})
+			},
+			copy(event){
+				navigator.clipboard.writeText(event.target.innerHTML);
 			}
 		},
 		mounted() {
@@ -36,21 +39,21 @@
 		<thead>
 			<tr>
 				<th>id</th>
-			<th>description</th>
+				<th>description</th>
-			<th>seconds</th>
+				<th>seconds</th>
-			<th>comments</th>
+				<th>comments</th>
-			<th>created at</th>
+				<th>created at</th>
-			<th>category id</th>
+				<th>category id</th>
-			<th>category</th>
+				<th>category</th>
-			<th>instrument</th>
+				<th>instrument</th>
-		</tr>
+			</tr>
 		</thead>
 		<tbody>
 			<tr v-for="session in categorySessions">
 				<td>{{session.id}}</td>
-				<td>{{session.description}}</td>
+				<td @click="copy">{{session.description}}</td>
-				<td>{{session.seconds}}</td>
+				<td @click="copy">{{session.seconds}}</td>
-				<td>{{session.comments}}</td>
+				<td @click="copy">{{session.comments}}</td>
 				<td>{{session.created_at}}</td>
 				<td>{{session.category_id}}</td>
 				<td>{{session.category}}</td>

src/components/songs.vue

@@ -11,7 +11,12 @@
 			axios.get(import.meta.env.VITE_PRACTICE_TRACKER_API_URL+'songs').then((response)=>{
 				this.songs = response.data
 			})
-		}
+		},
+		methods: {
+			copy(event){
+				navigator.clipboard.writeText(event.target.innerHTML);
+			}
+		},
 	}
 </script>
 
@@ -28,7 +33,7 @@
 		<tbody>
 			<tr v-for="song in songs">
 				<td>{{song.id}}</td>
-				<td>{{song.title}}</td>
+				<td @click="copy">{{song.title}}</td>
 				<td>{{song.notes}}</td>
 			</tr>
 		</tbody>