ayanova/src/App.vue

@@ -348,7 +348,7 @@ export default {
     } else {
       //this can be safely called any time, it checks if there is an open object in store and
       //opens it or if not just returns
-     // window.$gz.eventBus.$emit("openobject", null);
+      // window.$gz.eventBus.$emit("openobject", null);
     }
 
     //RELOAD / REFRESH HANDLING

ayanova/src/views/ops-notify-queue.vue

@@ -5,33 +5,21 @@
       <v-btn @click="getDataFromApi">
         <v-icon>fa-sync</v-icon>
       </v-btn>
-      <v-simple-table>
-        <template v-slot:default>
-          <thead>
-            <tr>
-              <th class="text-left">{{ $ay.t("TimeStamp") }}</th>
-              <th class="text-left">{{ $ay.t("DeliverAfter") }}</th>
-              <th class="text-left">{{ $ay.t("NotifyEventType") }}</th>
-              <th class="text-left">{{ $ay.t("AyaType") }}</th>
-              <th class="text-left">{{ $ay.t("Name") }}</th>
-              <th class="text-left">{{ $ay.t("User") }}</th>
-            </tr>
-          </thead>
-          <tbody>
-            <tr v-for="item in obj" :key="item.id">
-              <td>{{ item.created }}</td>
-              <td>{{ item.deliverAfter }}</td>
-              <td>{{ item.eventType }}</td>
-              <td>{{ item.ayaType }}</td>
-              <td>{{ item.name }}</td>
-              <td>{{ item.user }}</td>
-              <td>
-                <v-btn icon><v-icon>fa-trash</v-icon></v-btn>
-              </td>
-            </tr>
-          </tbody>
-        </template>
-      </v-simple-table>
+
+      <v-data-table
+        :headers="headers"
+        :items="obj"
+        class="elevation-1"
+        :disable-pagination="true"
+        :disable-filtering="true"
+        hide-default-footer
+      >
+        <template v-slot:item.actions="{ item }">
+          <v-icon small class="mr-2" @click="deleteItem(item)">
+            fa-trash
+          </v-icon>
+        </template></v-data-table
+      >
       <!-- </v-col> -->
     </v-col>
   </v-row>
@@ -67,6 +55,19 @@ export default {
     return {
       obj: [],
       rawObj: [],
+      headers: [
+        {
+          text: this.$ay.t("TimeStamp"),
+          align: "start",
+          value: "created"
+        },
+        { text: this.$ay.t("DeliverAfter"), value: "deliverAfter" },
+        { text: this.$ay.t("NotifyEventType"), value: "eventType" },
+        { text: this.$ay.t("AyaType"), value: "ayaType" },
+        { text: this.$ay.t("Name"), value: "name" },
+        { text: this.$ay.t("User"), value: "user" },
+        { text: "", value: "actions", sortable: false }
+      ],
       formState: {
         ready: false,
         loading: true,
@@ -86,6 +87,7 @@ export default {
     window.$gz.eventBus.$off("menu-click", clickHandler);
   },
   methods: {
+    deleteItem(item) {},
     async getDataFromApi() {
       let vm = this;
       vm.formState.loading = true;