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

@@ -98,7 +98,7 @@
               md="4"
               lg="3"
             >
-              <v-card>
+              <v-card tile>
                 <v-card-title class="subheading font-weight-bold">{{
                   item.columns.c1.v
                 }}</v-card-title>
@@ -106,11 +106,38 @@
                 <v-divider></v-divider>
 
                 <v-list dense>
-                  <v-list-item>
-                    <v-list-item-content>Calories:</v-list-item-content>
-                    <v-list-item-content class="align-end">{{
-                      item.calories
-                    }}</v-list-item-content>
+                  <v-list-item two-line v-for="c in item.columns" :key="c.key">
+                    <v-list-item-content>
+                      <v-list-item-title>
+                        {{ getHeaderText(c.key) }}</v-list-item-title
+                      >
+                      <v-list-item-subtitle>
+                        <!-- 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-->
+                        <template v-if="c.t < 11">
+                          <template v-if="c.i">
+                            <!-- openable object with an ID -->
+                            <!-- <a @click="btnClick(c.key, c.i)" href="#">{{ c.v }}</a> -->
+                            <!-- <v-btn @click="btnClick(c.key, c.i)">{{ c.v }}</v-btn> -->
+                            <span
+                              @click="btnClick(c.key, c.i)"
+                              class="secondary--text subtitle-2 font-weight-bold"
+                              >{{ c.v }}</span
+                            >
+                          </template>
+                          <template v-else>
+                            {{ c.v }}
+                          </template>
+                        </template>
+                        <template v-if="c.t == 11">
+                          <a :href="'mailto:' + c.v">{{ c.v }}</a>
+                        </template>
+                        <template v-if="c.t == 12">
+                          <!-- Expects full url with protocol etc in c.v so might need to add to record builder -->
+                          <a :href="c.v" target="_blank">{{ c.v }}</a>
+                        </template>
+                      </v-list-item-subtitle>
+                    </v-list-item-content>
                   </v-list-item>
                 </v-list>
               </v-card>
@@ -119,12 +146,12 @@
         </template>
       </v-data-iterator>
     </template>
-    <hr />
+    <!--   <hr />
     <div>Records: {{ records }}</div>
     <div>Selected: {{ selected }}</div>
     <div>Headers: {{ headers }}</div>
 
-    <!--  <div>TotalRecords: {{ totalRecords }}</div>
+      <div>TotalRecords: {{ totalRecords }}</div>
      <div>caption: {{ caption }}</div>
     <div>apiBaseUrl: {{ apiBaseUrl }}</div>
     <div>formKey: {{ formKey }}</div>

ayanova/src/views/test-widgets.vue

@@ -3,7 +3,7 @@
     formKey="test-widgets"
     dataListKey="TestWidgetDataList"
     :dataFilterId="currentDataFilterId"
-    :showSelect="false"
+    :showSelect="true"
     :singleSelect="false"
     v-on:update:selected="handleSelected"
   >