summaryrefslogtreecommitdiff
path: root/iridescence/src/components
diff options
context:
space:
mode:
Diffstat (limited to 'iridescence/src/components')
-rw-r--r--iridescence/src/components/InventoryFilter.vue40
1 files changed, 40 insertions, 0 deletions
diff --git a/iridescence/src/components/InventoryFilter.vue b/iridescence/src/components/InventoryFilter.vue
new file mode 100644
index 0000000..365c1e8
--- /dev/null
+++ b/iridescence/src/components/InventoryFilter.vue
@@ -0,0 +1,40 @@
+<template>
+ <div id="inventoryFilter">
+ <section class="section">
+ <div class="container">
+ <input
+ class="input is-primary is-medium"
+ type="text"
+ placeholder="Find something in particular..."
+ v-model.trim="term"
+ @input="updateFilter"
+ autofocus
+ />
+ </div>
+ <content class="has-text-centered" v-if="noResults">
+ <p>We couldn't find anything like that...</p>
+ </content>
+ </section>
+ </div>
+</template>
+
+<script>
+export default {
+ name: "InventoryFilter",
+ data() {
+ return {
+ term: ""
+ };
+ },
+ computed: {
+ noResults() {
+ return !this.$store.getters.inventory.length;
+ }
+ },
+ methods: {
+ updateFilter() {
+ this.$store.commit("filterTerm", this.term);
+ }
+ }
+};
+</script>