Added LaserControl and Gasflow sensors

frontend/components.d.ts

@@ -15,9 +15,11 @@ declare module 'vue' {
     Atmo: typeof import('./src/components/Atmo.vue')['default']
     ControlButton: typeof import('./src/components/BaseComponents/ControlButton.vue')['default']
     Gasflow: typeof import('./src/components/Gasflow.vue')['default']
+    LaserControl: typeof import('./src/components/LaserControl.vue')['default']
     ManualMode: typeof import('./src/components/ManualMode.vue')['default']
     MotorControl: typeof import('./src/components/BaseComponents/MotorControl.vue')['default']
     ProcessValue: typeof import('./src/components/BaseComponents/ProcessValue.vue')['default']
+    PVCard: typeof import('./src/components/BaseComponents/PVCard.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
     ValveControl: typeof import('./src/components/BaseComponents/ValveControl.vue')['default']

frontend/package.json

@@ -27,6 +27,7 @@
     "unplugin-vue-components": "^29.0.0",
     "unplugin-vue-router": "^0.15.0",
     "vite": "^7.1.5",
+    "vite-plugin-vue-devtools": "^8.0.5",
     "vite-plugin-vuetify": "^2.1.2"
   }
 }

frontend/src/components/BaseComponents/ControlButton.vue

@@ -2,6 +2,7 @@
   <v-btn
     :disabled="!this.opcuaStore.values[this.cbReleaseNodeId]"
     :class="{ 'bg-primary': isActive }"
+    :prepend-icon="prependIcon"
     @click="onClick"
   >
     <slot></slot>
@@ -34,6 +35,7 @@ export default {
       type: String,
       required: true,
     },
+    prependIcon: String,
   },
   methods: {
     onClick() {

frontend/src/components/BaseComponents/PVCard.vue

@@ -0,0 +1,51 @@
+<template>
+<v-sheet
+    class="d-flex flex-column pa-4 ga-4"
+    border="solid md"
+    rounded="lg"
+    width="200"
+  >
+    <h3 class="text-center">{{ pvTitle }}</h3>
+    <v-divider></v-divider>
+    <h2 class="text-right">{{ formattedString }}</h2>
+  </v-sheet>
+</template>
+
+<script>
+    import { mapStores } from 'pinia'
+    import { useOpcuaStore } from '@/stores/opcua'
+
+    export default {
+        name: "PVCard",
+        props: {
+            nodeId : {
+                type: String,
+                required : true,
+            },
+            pvTitle: String,
+            numDecimals: {
+                type: Number,
+                default: 1,
+            },
+        },
+        computed: {
+            ...mapStores(useOpcuaStore),
+            formattedString() {
+            const value = Number(this.opcuaStore.values[this.valueNodeId]).toFixed(this.numDecimals)
+            const unit = this.opcuaStore.values[this.unitNodeId]
+            return `${value} ${unit}`
+            },
+            valueNodeId() {
+            return `${this.nodeId}.rValue`
+            },
+            unitNodeId() {
+            return `${this.nodeId}.sUnit`
+            },
+        },
+        methods: {
+            mounted() {
+                this.opcuaStore.subscribe([this.valueNodeId, this.unitNodeId])
+            }
+        }
+    }
+</script>

frontend/src/components/BaseComponents/ProcessValue.vue

@@ -11,14 +11,14 @@ export default {
   computed: {
     ...mapStores(useOpcuaStore),
     formattedString() {
-      const value = Number(this.opcuaStore.values[this.pvValueNModeId]).toFixed(this.numDecimals)
+      const value = Number(this.opcuaStore.values[this.pvValueNodeId]).toFixed(this.numDecimals)
       const unit = this.opcuaStore.values[this.pvUnitNModeId]
       return `${value} ${unit}`
     },
-    pvValueNModeId() {
+    pvValueNodeId() {
       return `${this.nodeId}.rValue`
     },
-    pvUnitNModeId() {
+    pvUnitNodeId() {
       return `${this.nodeId}.sUnit`
     },
   },
@@ -33,7 +33,7 @@ export default {
     },
   },
   mounted() {
-    this.opcuaStore.subscribe([this.pvValueNModeId, this.pvUnitNModeId])
+    this.opcuaStore.subscribe([this.pvValueNodeId, this.pvUnitNodeId])
   },
   // unmounted() {
   //   console.log("Unsubscribed");

frontend/src/components/LaserControl.vue

@@ -0,0 +1,64 @@
+<template>
+    <v-sheet
+    class="d-flex flex-column pa-4 ga-4"
+    border="solid md"
+    rounded="lg"
+    width="300"
+  >
+    <v-btn @click.prevent="" variant="flat" size="x-large">Laser control</v-btn>
+    <v-divider></v-divider>
+    <!-- mdi-close-circle-outline -->
+     <!-- mdi-check-circle-outline -->
+    <control-button :nodeId="enableLasers" block>Enable Lasers</control-button>
+    <v-divider></v-divider>
+    <v-sheet class="d-flex flex-column">
+      <v-row>
+        <v-col cols="6"><control-button :nodeId="toggleButton" block>Toggle</control-button></v-col>
+        <v-col cols="6"><control-button :nodeId="oneShotButton" block>Oneshot</control-button></v-col>
+      </v-row>
+    </v-sheet>
+  </v-sheet>
+</template>
+
+<script>
+    import { mapStores } from 'pinia'
+    import { useOpcuaStore } from '@/stores/opcua'
+    import ControlButton from './BaseComponents/ControlButton.vue'
+
+    export default {
+        name: "Lasercontrol",
+        components: {
+            ControlButton,
+        },
+        props: {
+            nodeId : {
+                type: String,
+                required : true,
+            },
+            detailsLink : {
+                type: String,
+            },
+        },
+
+        computed: {
+            ...mapStores(useOpcuaStore),
+            enableLasers() {
+                return `${this.nodeId}.stEnableLaser`
+            },
+            toggleButton() {
+                return `${this.nodeId}.stToggleButton`
+            },
+            oneShotButton() {
+                return `${this.nodeId}.stOneShotButton`
+            },
+            interlocksOk() {
+                return `${this.nodeId}.xIntlksOk`
+            },
+        },
+        methods: {
+            mounted() {
+                this.opcuaStore.subscribe([this.toggleButton, this.oneShotButton,this.enableLasers, this.interlocksOk])
+            }
+        }
+    }
+</script>

frontend/src/plugins/vuetify.js

@@ -14,6 +14,6 @@ import { createVuetify } from 'vuetify'
 // https://vuetifyjs.com/en/introduction/why-vuetify/#feature-guides
 export default createVuetify({
   theme: {
-    defaultTheme: 'system',
+    defaultTheme: 'dark',
   },
 })

frontend/src/views/GasflowManualView.vue

@@ -1,30 +1,87 @@
 <template>
-  <v-container class="d-flex ga-6">
+  <v-container class="ga-6">
+    <v-row>
+      <v-col cols="12">
+        <motor-control motorName="Blower" nodeId="ns=4;s=GVL_SCADA.stPolarisHMIInterface.stGasFlow.stHMIBlower"/>
+      </v-col>
+      </v-row>
       <v-row>
       <v-col cols="3">
-        <v-sheet class="d-flex flex-column">
+        <p-v-card pvTitle="Gasflow" nodeId="ns=4;s=GVL_SCADA.stPolarisHMIInterface.stGasFlow.stFlowrateSensor"/>
-          <v-row>
-            <v-col cols="6"><h4 class="text-right">Flow:</h4></v-col>
-            <v-col cols="6"><process-value nodeId="ns=4;s=GVL_SCADA.stPolarisHMIInterface.stGasFlow.stFlowrateSensor"/></v-col>
-          </v-row>
-        </v-sheet>
       </v-col>
       <v-col cols="3">
-        <motor-control nodeId="ns=4;s=GVL_SCADA.stPolarisHMIInterface.stGasFlow.stHMIBlower"/>
+        <p-v-card pvTitle="Temp PC" nodeId="ns=4;s=GVL_SCADA.stPolarisHMIInterface.stGasFlow.stGasTempProcessChamber"/>
+      </v-col>
+    </v-row>
+    <v-row>
+      <v-col cols="12">
+        <v-divider />
+      </v-col>
+    </v-row>
+    <v-row>
+      <v-col cols="3">
+        <p-v-card pvTitle="P Blower inlet" nodeId="ns=4;s=GVL_SCADA.stPolarisHMIInterface.stGasFlow.stGasPressureBlowerInlet"/>
+      </v-col>
+      <v-col cols="3">
+        <p-v-card pvTitle="P Police filter" nodeId="ns=4;s=GVL_SCADA.stPolarisHMIInterface.stGasFlow.stGasPressurePoliceFilterInlet"/>
+      </v-col>
+      <v-col cols="3">
+        <p-v-card pvTitle="P 2nd HEX" nodeId="ns=4;s=GVL_SCADA.stPolarisHMIInterface.stGasFlow.stGasPressureSecondHeatExchanger"/>
+      </v-col>
+      <v-col cols="3">
+        <p-v-card pvTitle="P PC inlet" nodeId="ns=4;s=GVL_SCADA.stPolarisHMIInterface.stGasFlow.stGasPressurePCInlet"/>
+      </v-col>
+    </v-row>
+    <v-row>
+      <v-col cols="3">
+        <p-v-card pvTitle="P PF inlet" nodeId="ns=4;s=GVL_SCADA.stPolarisHMIInterface.stGasFlow.stGasPressureProcessFilterInlet"/>
+      </v-col>
+      <v-col cols="3">
+        <p-v-card pvTitle="P 1st HEX" nodeId="ns=4;s=GVL_SCADA.stPolarisHMIInterface.stGasFlow.stGasPressureFirstHeatExchanger"/>
+      </v-col>
+      <v-col cols="3">
+        <p-v-card pvTitle="P Blower inlet" nodeId="ns=4;s=GVL_SCADA.stPolarisHMIInterface.stGasFlow.stGasPressureBlowerInlet"/>
+      </v-col>
+    </v-row>
+    <v-row>
+      <v-col cols="12">
+        <v-divider />
+      </v-col>
+    </v-row>
+    <v-row>
+      <v-col cols="3">
+        <p-v-card pvTitle="T Blower inlet" nodeId="ns=4;s=GVL_SCADA.stPolarisHMIInterface.stGasFlow.stGasTempBlowerInlet"/>
+      </v-col>
+      <v-col cols="3">
+        <p-v-card pvTitle="T Police filter" nodeId="ns=4;s=GVL_SCADA.stPolarisHMIInterface.stGasFlow.stGasTempPoliceFilterInlet"/>
+      </v-col>
+      <v-col cols="3">
+        <p-v-card pvTitle="T 2nd HEX" nodeId="ns=4;s=GVL_SCADA.stPolarisHMIInterface.stGasFlow.stGasTempSecondHeatExchangerInlet"/>
+      </v-col>
+      <v-col cols="3">
+        <p-v-card pvTitle="T PC inlet" nodeId="ns=4;s=GVL_SCADA.stPolarisHMIInterface.stGasFlow.stGasTempProcessChamberInlet"/>
+      </v-col>
+    </v-row>
+    <v-row>
+      <v-col cols="3">
+        <p-v-card pvTitle="T PF inlet" nodeId="ns=4;s=GVL_SCADA.stPolarisHMIInterface.stGasFlow.stGasTempProcessFilterInlet"/>
+      </v-col>
+      <v-col cols="3">
+        <p-v-card pvTitle="T 1st HEX" nodeId="ns=4;s=GVL_SCADA.stPolarisHMIInterface.stGasFlow.stGasTempFirstHeatExchangerInlet"/>
       </v-col>
     </v-row>
   </v-container>
 </template>
 
 <script>
-  import ValveControl from '@/components/BaseComponents/ValveControl.vue'
   import MotorControl from '@/components/BaseComponents/MotorControl.vue'
+  import PVCard from '@/components/BaseComponents/PVCard.vue';
 
   export default {
     name: 'GFManualView',
     components: {
       MotorControl,
-      ValveControl,
+      PVCard,
     },
   }
 </script>

frontend/src/views/HomeView.vue

@@ -1,7 +1,16 @@
 <template>
-  <v-container class="d-flex ga-6">
+  <v-container>
+    <v-row>
+      <v-col cols="4">
         <gasflow detailsLink="/manual/gf" nodeId="ns=4;s=GVL_SCADA.stPolarisHMIInterface.stGasFlow" />
+      </v-col>
+      <v-col cols="4">
         <atmo detailsLink="/manual/atmo" nodeId="ns=4;s=GVL_SCADA.stPolarisHMIInterface.stAtmoTemp" />
+      </v-col>
+      <v-col cols="4">
+        <laser-control nodeId="ns=4;s=GVL_SCADA.stLaserHMIInterface" />
+      </v-col>
+    </v-row>
   </v-container>
 </template>
 
@@ -9,12 +18,14 @@
 <script>
   import Gasflow from '@/components/Gasflow.vue';
   import Atmo from '@/components/Atmo.vue';
+  import LaserControl from '@/components/LaserControl.vue';
 
     export default {
         name: 'ManualView',
         components: {
             Gasflow,
             Atmo,
+            LaserControl,
         },
     }
 </script>