diff --git a/Step/wwwroot/src/@types/scada.d.ts b/Step/wwwroot/src/@types/scada.d.ts
new file mode 100644
index 00000000..3accc70f
--- /dev/null
+++ b/Step/wwwroot/src/@types/scada.d.ts
@@ -0,0 +1,71 @@
+declare module scada {
+
+   interface ScadaInterface {
+    name: string,
+    id: number,
+    backgroundImage: string,
+    isInProductionPage: boolean,
+
+    layers: Layer[],
+  }
+
+   interface Layer {
+    id: number,
+    buttons: buttonControl[],
+    images: imageControl[],
+    progressBars: progressControl[],
+    inputs: inputControl[],
+  }
+
+   interface status {
+    type: string,
+    action: string,
+  }
+
+   interface size {
+    x: number,
+    y: number
+  }
+
+   interface position {
+    x: number,
+    y: number
+  }
+
+   interface label {
+    backgroundColor: string,
+    textAlign: string,
+    textColor: string,
+    textContent: string,
+    textSize: number
+  }
+
+   interface baseControl {
+    type: string,
+    id: number,
+    position: position,
+    size: size,
+  }
+
+   interface inputControl extends baseControl {
+    status: status,
+    label: label
+  }
+
+   interface labelControl extends baseControl {
+    label: label,
+  }
+
+   interface buttonControl extends baseControl {
+    status: status
+    label: label,
+  }
+
+   interface imageControl extends baseControl {
+    status: status
+  }
+
+   interface progressControl extends baseControl {
+    status: status
+  }
+}
diff --git a/Step/wwwroot/src/services/scadaService.ts b/Step/wwwroot/src/services/scadaService.ts
index e69de29b..678c5297 100644
--- a/Step/wwwroot/src/services/scadaService.ts
+++ b/Step/wwwroot/src/services/scadaService.ts
@@ -0,0 +1,16 @@
+import { baseRestService } from "../_base/baseRestService";
+import { scadaActions } from "../store/scada";
+import { store } from "../store";
+
+export class ScadaService extends baseRestService {
+
+  async ListScada(): Promise<scada.ScadaInterface[]> {
+    let result = await this.Get<scada.ScadaInterface[]>('/api/scada/list');
+
+    scadaActions.setScada(store, result);
+
+    return result;
+  }
+}
+
+export const scadaService = new ScadaService();
diff --git a/Step/wwwroot/src/store/scada.ts b/Step/wwwroot/src/store/scada.ts
index ad010927..294c6eb6 100644
--- a/Step/wwwroot/src/store/scada.ts
+++ b/Step/wwwroot/src/store/scada.ts
@@ -4,26 +4,67 @@ import { Factory, MessageService } from "src/_base";
 declare let cmsClient: any;
 
 export interface ScadaModel {
-
+  scadaItems: { id: number, backgroundImage: string, name: string, isInProductionPage: boolean }[],
+  layerItems: { scadaId: number, layerId: number, id: number, item: scada.baseControl }[],
 }
 
 export interface ScadaActions {
-
+  setScada(store, value: scada.ScadaInterface[]);
 }
 
 export const scadaStore = {
   state: {
-
-
+    scadaItems: [],
+    layerItems: []
   } as ScadaModel,
   getters: {
 
   },
   mutations: {
 
+    // Set scada items
+    setScadaItems(state: ScadaModel, data: scada.ScadaInterface[]) {
+      for (const key in data) {
+        const element = data[key];
+        state.scadaItems.push({ id: element.id, backgroundImage: element.backgroundImage, isInProductionPage: element.isInProductionPage, name: element.name });
+
+        // navigate layers and insert data for layers
+        for (const lkey in element.layers) {
+          const layer = element.layers[lkey];
+
+          // navigo tutti i bottoni
+          for (const idx in layer.buttons) {
+            const button = layer.buttons[idx];
+            button.type = "buttonControl";
+            state.layerItems.push({ scadaId: element.id, layerId: layer.id, id: button.id, item: button });
+          }
+
+          // navigo tutti gli imports
+          for (const idx in layer.inputs) {
+            const input = layer.inputs[idx];
+            input.type = "inputControl";
+            state.layerItems.push({ scadaId: element.id, layerId: layer.id, id: input.id, item: input });
+          }
+
+          for (const idx in layer.images) {
+            const img = layer.images[idx];
+            img.type = "imageControl";
+            state.layerItems.push({ scadaId: element.id, layerId: layer.id, id: img.id, item: img });
+          }
+
+          for (const idx in layer.progressBars) {
+            const progress = layer.progressBars[idx];
+            progress.type = "progressControl";
+            state.layerItems.push({ scadaId: element.id, layerId: layer.id, id: progress.id, item: progress });
+          }
+        }
+      }
+    }
   },
   actions: {
-
+    setScada(context, data: scada.ScadaInterface[]) {
+      context.commit("setScadaItems", data);
+    }
   } as ScadaActions
 }
 export const scadaActions = scadaStore.actions as ScadaActions;