layout complete

ActiveBOWeb/src/components/PolicyPlot.vue

@@ -12,7 +12,7 @@ const store = usePStore();
 let chartHandle;
 
 function buildChart() {
-  const policy = store.getPolicy();
+  const policy = store.getPolicy;
   const policy_labels = Array(policy.length).fill(0).map((_, i) => i);
   const RewardPlot = {
     data: {
@@ -72,8 +72,12 @@ onMounted(() => {
   buildChart();
 });
 
-watch(() => store.getPolicy(), () => {
-  chartHandle.data.dataset[0].data = store.getPolicy();
+watch(() => store.getPolicy, () => {
+  const policy = store.getPolicy;
+  const policy_labels = Array(policy.length).fill(0).map((_, i) => i)
+
+  chartHandle.options.scales.x.labels = policy_labels;
+  chartHandle.data.datasets[0].data = policy;
 
   chartHandle.update();
 });

ActiveBOWeb/src/components/RosBar.vue

@@ -26,15 +26,19 @@
 import * as ROS from 'roslib';
 import { useBWStore } from '@/store/BaseWebsiteStore';
 import { usePStore } from "@/store/PolicyStore";
+import {useCStore} from "@/store/ControlStore";
+
 import {
   reactive,
   ref,
   watch,
 } from 'vue';
+
 import * as ROSLIB from "roslib";
 
 const store =  useBWStore();
 const pstore = usePStore();
+const cstore = useCStore();
 
 const formState = reactive({
   ipaddress: 'localhost',
@@ -98,12 +102,17 @@ const policy_service = new ROSLIB.Service({
   serviceType: 'active_bo_msgs/srv/WeightToPolicy',
 });
 
+watch(() => cstore.getSendWeights, () =>{
+
   const policy_request = new ROSLIB.ServiceRequest({
     weights: pstore.weights,
-  nr_steps: pstore.nr_steps,
+    nr_steps: pstore.max_steps,
   })
 
-
+  policy_service.callService(policy_request, function (result) {
+    pstore.setPolicy(result.policy)
+  });
+});
 
 </script>
 

ActiveBOWeb/src/store/PolicyStore.js

@@ -3,10 +3,10 @@ import { defineStore } from "pinia";
 export const usePStore = defineStore('Policy Store', {
     state: () => {
         return {
-            policy: Array,
+            policy: Array(10).fill(0),
             nr_weights: 5,
             weights: [0, 0, 0, 0, 0],
-            max_steps: 0,
+            max_steps: 10,
         }
     },
     getters: {
@@ -17,6 +17,7 @@ export const usePStore = defineStore('Policy Store', {
     },
     actions: {
         setPolicy(value) {
+            this.policy = null;
             this.policy = value;
         },
         setNrWeights(value) {