added pages and most of projector control to UI

frontend/vju_display/src/App.vue

@@ -4,11 +4,17 @@
 import {ref, onMounted } from 'vue'
 //import { $mqtt } from 'vue-paho-mqtt'
 import Projektor from './Projektor.vue'
-
+import Platno from './Platno.vue'
+import MainPage from './MainPage.vue';
+import ProjManualPage from './ProjManualPage.vue';
 
 const _p1_room = ref('p1')
-const _glavni_position = ref('glavni')
-const _stranski_position = ref('stranski')
+
+
+const pageNum = ref(0) // TODO spremen na 0
+
+
+
 </script>
 
 <template>
@@ -18,19 +24,23 @@ const _stranski_position = ref('stranski')
     <div class="wrapper">
       <!-- <HelloWorld msg="You did it!" /> -->
        <h2>turbo odličen super mega kontrol panel</h2>
+       <h3>Predavalnica {{ _p1_room }}</h3>
+    </div>
+    <div>
+      <button @click="pageNum = 0">Page 1</button>
+      <button @click="pageNum = 1">Page 2</button>
+      <button @click="pageNum = 2">Page 3</button>
     </div>
   </header>
 
   <main>
-    <div>
-      <h3>{{ _p1_room }}</h3>
-      <!-- <h4>Glavni</h4> -->
-      <Projektor :room="_p1_room" :position="_glavni_position" />
+    <div v-if="pageNum == 0">
+      <MainPage />
     </div>
-    <div>
-      <!-- <h4>Stranski</h4> -->
-      <Projektor :room="_p1_room" :position="_stranski_position" />
+    <div v-else-if="pageNum == 1">
+      <ProjManualPage :room="_p1_room" />
     </div>
+    <div v-else-if="pageNum == 2">temp</div>
   </main>
 </template>