Merge pull request #15 from BitTheCat/fix/no-fields

Fixed no fields for table

Author: BitTheCat

dev/TableShow.vue

@@ -1,5 +1,10 @@
 <template>
     <div>
+        <div class="mb-3">
+            <TVTable />
+        </div>
+        
+
         <div class="mb-3">
             <TVTable
                 ref="tvtTableSimple"
@@ -69,13 +74,14 @@
                 :items="filterItems"
                 :fields="fields"
                 multiple-sortable
+                multiple-selection
                 :total-rows="items.length"
                 :per-page="perPage"
                 :row-select-class="'bg-red-500'"
                 enable-check
                 @change-page="changePage"
-                @check-row="checkRow"
-                @row-clicked="checkRow"
+                @check-row="checkRowMultiple"
+                @row-clicked="checkRowMultiple"
             >
                 <template #header-row>
                     <tr>

package-lock.json

@@ -1,6 +1,6 @@
 {
     "name": "@bitthecat/tailwind-vue-data-table",
-    "version": "0.2.4",
+    "version": "0.2.5",
     "keywords": [
         "tailwindcss",
         "customisable",

package.json

@@ -5,7 +5,14 @@
 
     <div class="overflow-auto">
         <TTable ref="TVTABLE">
-            <TThead>
+            <!-- No fields set -->
+            <TThead v-if="fields.length == 0">
+                <TTr class="divide-x divide-y">
+                    <TTh />
+                </TTr>
+            </TThead>
+
+            <TThead v-if="fields.length !== 0">
                 <slot v-if="slots['header-row']" name="header-row" />
                 <TTr class="divide-x divide-y">
                     <TTh 
@@ -52,7 +59,15 @@
                     </TTh>
                 </TTr>
             </TThead>
-            <TTbody>
+            <!-- No fields set -->
+            <TTbody v-if="fields.length == 0">
+                <TTr class="divide-x divide-y">
+                    <TTd>
+                        <span class="font-light flex justify-center mb-3 mt-3">No fields set</span>
+                    </TTd>
+                </TTr>
+            </TTbody>
+            <TTbody v-else>
                 <TTr v-if="busy">
                     <!-- Spinner -->
                     <TTd :colspan="enableCheck ? fields.length + 1 : fields.length">
@@ -155,7 +170,7 @@ const slots = useSlots();
 const props = defineProps({
     items: {
         type: [Object, Array],
-        default: () => {}
+        default: () => []
     },
     fields: {
         type: Array,