Did something that looks like some design or something

src/components/GlobalDeviceBuzgerator.vue

@@ -0,0 +1,26 @@
+<template>
+  <b-overlay :show="false" rounded="sm">
+    <b-card
+        title="All devices"
+        tag="all-devices"
+        class="m-2"
+    >
+      <b-card-text>
+        Control all devices
+      </b-card-text>
+
+      <b-button variant="success" class="mr-1">Bring online</b-button>
+      <b-button variant="danger" class="mr-1">Bring offline</b-button>
+    </b-card>
+  </b-overlay>
+</template>
+
+<script>
+export default {
+  name: "GlobalDeviceBuzgerator"
+}
+</script>
+
+<style scoped>
+
+</style>

src/components/SingleDeviceBuzgerator.vue

@@ -0,0 +1,36 @@
+<template>
+  <b-overlay :show="false" rounded="sm">
+    <b-card
+        :title="cardTitle"
+        class="m-2"
+    >
+      <b-card-text>
+        Could not read device data!
+      </b-card-text>
+
+      <b-button variant="success" class="mr-1">Bring online</b-button>
+      <b-button variant="danger" class="mr-1">Bring offline</b-button>
+      <b-button variant="warning" class="mr-1">Manual alert</b-button>
+    </b-card>
+  </b-overlay>
+</template>
+
+<script>
+export default {
+  name: "SingleDeviceBuzgerator",
+  props: {
+    'device_id': {
+      type: String
+    }
+  },
+  computed: {
+    cardTitle() {
+      return `Device: ${this.device_id}`
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/views/Devices.vue

@@ -1,11 +1,39 @@
 <template>
   <div class="devices">
+    <b-row>
+      <b-col>
+        <global-device-buzgerator/>
+      </b-col>
+    </b-row>
+    <b-row>
+      <b-col v-for="device in devices" :key="device" cols="12" md="6">
+        <single-device-buzgerator :device_id="device"/>
+      </b-col>
+    </b-row>
   </div>
 </template>
 
 <script>
+import SingleDeviceBuzgerator from "../components/SingleDeviceBuzgerator";
+import GlobalDeviceBuzgerator from "../components/GlobalDeviceBuzgerator";
+
 export default {
-  name: "Devices"
+  name: "Devices",
+  data() {
+    return {
+      devices: [
+        '1'
+      ]
+    }
+  },
+  components: {
+    SingleDeviceBuzgerator, GlobalDeviceBuzgerator
+  }
+  ,
+  comments: {
+    GlobalDeviceBuzgerator,
+    SingleDeviceBuzgerator
+  }
 }
 </script>