Add selection functionality using vuex

src/components/ThreadPost.vue

@@ -117,11 +117,15 @@
 			toggleSelected () {
 				this.selected = !this.selected
 
-				this.$emit('selected', { state: this.selected, id: post.id })
+				this.$emit('selected', this.post.id)
 			}
 		},
 		watch: {
 			showSelect () {
+				if(this.selected) {
+					this.$emit('selected', this.post.id)
+				}
+
 				this.selected = false
 			}
 		}

src/components/routes/Thread.vue

@@ -1,5 +1,8 @@
 <template>
 	<div class='route_container'>
+		<template v-if='showSelect'>
+			Selected {{$store.state.thread.selectedPosts.length}}
+		</template>
 		<div class='thread_side_bar'>
 			<menu-button
 				v-if='$store.state.admin'
@@ -71,12 +74,16 @@
 				</thread-post-placeholder>
 				<thread-post
 					v-for='(post, index) in posts'
+
 					@reply='replyUser'
 					@goToPost='goToPost'
+					@selected='setSelectedPosts'
+
 					:post='post'
 					:show-reply='!$store.state.thread.locked'
 					:showSelect='showSelect'
 					:highlight='highlightedPostIndex === index'
+
 					:class='{"post--last": index === posts.length-1}'
 					ref='posts'
 				></thread-post>
@@ -144,6 +151,9 @@
 			setThreadSelectState () {
 				this.showSelect = !this.showSelect
 			},
+			setSelectedPosts (postId) {
+				this.$store.commit('setSelectedPosts', postId)
+			},
 			showEditor () {
 				this.$store.commit('setThreadEditorState', true);
 			},

src/store/modules/thread.js

@@ -20,7 +20,8 @@ const state = {
 	previousURL: '',
 	nextPostsCount: 10,
 	previousPostsCount: 0,
-	totalPostsCount: 0
+	totalPostsCount: 0,
+	selectedPosts: []
 }
 
 const getters = {
@@ -241,6 +242,15 @@ const mutations = {
 	},
 	setLocked (state, value) {
 		state.locked = value
+	},
+	setSelectedPosts (state, id ) {
+		let index = state.selectedPosts.indexOf(id)
+
+		if(index > -1) {
+			state.selectedPosts.splice(index, 1)
+		} else {
+			state.selectedPosts.push(id)
+		}
 	}
 }