save keyword

Author: ITJesse

web/src/components/PlayerList.vue

@@ -8,7 +8,7 @@
     </b-alert>
     <b-progress v-show="loading" :value="100" :max="100" animated class="mb-3"></b-progress>
     <b-row class="searchbox">
-      <b-col sm="12"><b-form-input id="input-none" type="text" v-model="keyword" placeholder="Search User Name"></b-form-input></b-col>
+      <b-col sm="12"><b-form-input id="input-none" type="text" :value="keyword" @input="updateKeyword" placeholder="Search user by Name/UUID"></b-form-input></b-col>
     </b-row>
     <lazy-component class="row">
       <playerblock v-for="(player, key, index) in playerList" :key="index" :player="player" v-show="search(player)"></playerblock>
@@ -31,7 +31,6 @@ export default {
   data() {
     return {
       showNetworkErrorAlert: false,
-      keyword: '',
       searchTimer: null,
       loading: true,
       timer: null,
@@ -60,11 +59,13 @@ export default {
     'playerList',
     'scrollOffset',
     'info',
+    'keyword',
   ]),
   methods: {
     ...mapMutations([
       'setPlayerList',
       'setScrollOffset',
+      'setKeyword',
     ]),
     lazyload() {
       clearTimeout(this.timer);
@@ -90,6 +91,9 @@ export default {
         return false;
       });
     },
+    updateKeyword(e) {
+      this.setKeyword(e);
+    },
   },
   beforeRouteLeave(to, from, next) {
     const uuid = to.params.uuid;

web/src/main.js

@@ -53,6 +53,9 @@ export const store = new Vuex.Store({
     setScrollOffset(state, payload) {
       state.scrollOffset = payload.uuid;
     },
+    setKeyword(state, keyword) {
+      state.keyword = keyword;
+    },
   },
 });