Make log reactive.

Automatically reloads when events have been changed.

lib/www/client/source/src/views/Log.vue

@@ -232,7 +232,7 @@
 </template>
 
 <script>
-import { mapActions, mapGetters } from 'vuex';
+import { mapActions, mapGetters, mapState } from 'vuex';
 import DougalContextMenu from '@/components/context-menu';
 import DougalEventEditDialog from '@/components/event-edit-dialog'
 
@@ -305,7 +305,8 @@ export default {
         items: []
       },
       selectedLabels: [],
-      labelSearch: null
+      labelSearch: null,
+      queuedReload: false
     }
   },
 
@@ -349,7 +350,8 @@ export default {
       }
     },
 
-    ...mapGetters(['loading', 'online', 'sequence', 'line', 'point', 'lineName'])
+    ...mapGetters(['loading', 'online', 'sequence', 'line', 'point', 'lineName', 'serverEvent']),
+    ...mapState({projectSchema: state => state.project.projectSchema})
 
   },
 
@@ -366,7 +368,18 @@ export default {
         // If not online
         this.defaultEventTimestamp = Date.now();
       }
+    },
+
+    async serverEvent (event) {
+      if (event.channel == "event" && event.payload.schema == this.projectSchema) {
+        if (!this.loading && !this.queuedReload) {
+          this.getEvents();
+        } else {
+          this.queuedReload = true;
+        }
+      }
     }
+
   },
 
   methods: {
@@ -401,6 +414,7 @@ export default {
 
       const url = `/project/${this.$route.params.project}/event?${query.toString()}`;
 
+      this.queuedReload = false;
       this.items = await this.api([url]) || [];
 
     },
@@ -446,6 +460,7 @@ export default {
         body: event
       }]);
       this.showSnack(["New event saved", "success"]);
+      this.queuedReload = true;
       this.getEvents();
       console.log("Done");
     },