ayanova/src/components/gz-data-table.vue

@@ -104,7 +104,9 @@
                 v-for="c in item.columns"
                 :key="c.key"
               >
-                <div class="v-data-table__mobile-row__header">HEADER</div>
+                <div class="v-data-table__mobile-row__header">
+                  {{ getHeaderText(c.key) }}
+                </div>
                 <div class="v-data-table__mobile-row__cell">
                   <!-- Handle all plain text types right up to and including enums -->
                   <!--TODO when get to coloured stuff will need to add that as a prop to column data but leaving out for now-->
@@ -204,6 +206,16 @@ export default {
     // }
   },
   methods: {
+    //Used by narrow view to get the "header" text for a column based on the column key
+    getHeaderText(key) {
+      //key format is row-column e.g."500-2"
+      var columnIndex = key.split("-")[1];
+      var header = this.headers[columnIndex - 1];
+      if (header && header.text) {
+        return header.text;
+      }
+      return "";
+    },
     handleSelectChange() {
       //due to making own template for items need to handle singleselect which only affects if select all checkbox at top is visible when making own item template
       if (this.singleSelect) {