new filter: unassigned cards

src/components/Controls.vue

@@ -74,6 +74,17 @@
 							</div>
 
 							<h3>{{ t('deck', 'Filter by assigned user') }}</h3>
+							<div class="filter--item">
+								<input
+									id="unassigned"
+									v-model="filter.unassigned"
+									type="checkbox"
+									class="checkbox"
+									value="unassigned"
+									@change="setFilter"
+									@click="beforeSetFilter">
+								<label for="unassigned">{{ t('deck', 'Unassigned') }}</label>
+							</div>
 							<div v-for="user in board.users" :key="user.uid" class="filter--item">
 								<input
 									:id="user.uid"
@@ -200,7 +211,7 @@ export default {
 			stack: '',
 			showArchived: false,
 			isAddStackVisible: false,
-			filter: { tags: [], users: [], due: '' },
+			filter: { tags: [], users: [], due: '', unassigned: false },
 		}
 	},
 
@@ -244,6 +255,9 @@ export default {
 				this.filter.due = ''
 				this.$store.dispatch('setFilter', { ...this.filter })
 			}
+			if (e.target.value === 'unassigned') {
+				this.filter.users = []
+			}
 		},
 		setFilter() {
 			this.$nextTick(() => this.$store.dispatch('setFilter', { ...this.filter }))

src/store/card.js

@@ -32,9 +32,10 @@ export default {
 	getters: {
 		cardsByStack: (state, getters, rootState) => (id) => {
 			return state.cards.filter((card) => {
-				const { tags, users, due } = rootState.filter
+				const { tags, users, due, unassigned } = rootState.filter
 				let allTagsMatch = true
 				let allUsersMatch = true
+				let allUnassigned = true
 
 				if (tags.length > 0) {
 					tags.forEach((tag) => {
@@ -58,6 +59,16 @@ export default {
 					}
 				}
 
+				if (unassigned) {
+					if (card.assignedUsers.length > 0) {
+						allUnassigned = false
+					}
+
+					if (!allUnassigned) {
+						return false
+					}
+				}
+
 				if (due !== '') {
 					const datediffHour = ((new Date(card.duedate) - new Date()) / 3600 / 1000)
 					switch (due) {