Added extra status info

src/components/controlComponents/paneStatus.vue

@@ -2,11 +2,32 @@
 <div class="host-input">
 
   <div v-if="$store.getters.ready">
-    <p><b>Host:</b> {{ $store.state.host }}</p>
+    <div v-if="$store.state.apiConfig.name"><b>Device name:</b> <br> {{ $store.state.apiConfig.name }}</div>
-    <p><b>Base URI:</b> {{ $store.getters.uri }}</p>
+    <hr>
-    <p v-if="$store.state.apiConfig.name"><b>Device name:</b> {{ $store.state.apiConfig.name }}</p>
+    <div class="uk-margin-small-bottom">
+      <b>Host:</b>
+      <br>
+      {{ $store.state.host }}
+    </div>
+    <div><b>Server version:</b> <br> {{ $store.state.apiState.version }}</div>
+    <hr>
+    <div class="uk-margin-small-bottom">
+      <b>Camera:</b>
+      <br>
+      <div v-if="$store.state.apiState.camera.board">{{ $store.state.apiState.camera.board }}</div>
+      <div v-else class="uk-text-danger"><b>No camera connected</b></div>
+    </div>
+    <div>
+      <b>Stage:</b>
+      <br>
+      <div v-if="$store.state.apiState.stage.board">{{ $store.state.apiState.stage.board }}</div>
+      <div v-else class="uk-text-danger"><b>No stage connected</b></div>
+    </div>
+    
+  </div>
+  <div v-else-if="$store.state.waiting">
+    <progressBar></progressBar>
   </div>
-  <div v-else-if="$store.state.waiting"><div uk-spinner></div></div>
   <div v-else-if="$store.state.error"><b>Error:</b> {{ $store.state.error }}</div>
   <div v-else>No active connection</div>
 
@@ -14,10 +35,16 @@
 </template>
 
 <script>
+import progressBar from "../genericComponents/progressBar"
+
 
 export default {
   name: 'paneStatus',
 
+  components: {
+    progressBar
+  },
+
   data: function () {
     return {
     }  
@@ -26,7 +53,6 @@ export default {
   mounted() {
   },
 
-  // When savedHosts changes, serialise to JSON and save to localStorage
   watch: {
   },