From f6bd4c62b3779a7fb6d0ebe4a3cf6556f448bf7b Mon Sep 17 00:00:00 2001
From: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Date: Wed, 4 Nov 2020 13:40:09 -0800
Subject: Add documentation for table sort

Create example BmcTable component to eventually showcase all
functionality. For now, it only includes table sort.

Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: Id3f3ac603a58d5dbc8674ec5b2d9d059e935407d
---
 docs/.vuepress/components/BmcTable.vue | 57 ++++++++++++++++++++++++++++++++++
 1 file changed, 57 insertions(+)
 create mode 100644 docs/.vuepress/components/BmcTable.vue

(limited to 'docs/.vuepress')

diff --git a/docs/.vuepress/components/BmcTable.vue b/docs/.vuepress/components/BmcTable.vue
new file mode 100644
index 00000000..9cc7b645
--- /dev/null
+++ b/docs/.vuepress/components/BmcTable.vue
@@ -0,0 +1,57 @@
+<template>
+  <b-table
+    hover
+    show-empty
+    no-sort-reset
+    sort-icon-left
+    responsive="md"
+    head-variant="light"
+    table-variant="light"
+    sort-by="rank"
+    :items="items"
+    :fields="fields"
+  />
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      items: [
+        {
+          name: 'Veracruz All Natural',
+          rank: 1,
+          description: 'Authentic Mexican Food, Smoothies, and Juices'
+        },
+        {
+          name: 'Torchy\'s Tacos',
+          rank: 3,
+          description: 'At Torchy\'s Tacos, we make food that breaks the mold.'
+        },
+        {
+          name: 'Tacodeli',
+          rank: 2,
+          description: 'Tacodeli handcrafts Mexican-inspired, creative tacos with local and organic ingredients topped with award-winning salsas.'
+        },
+      ],
+      fields: [
+        {
+          key: 'name',
+          label: 'Name',
+          sortable: true
+        },
+        {
+          key: 'rank',
+          label: 'Rank',
+          sortable: true
+        },
+        {
+          key: 'description',
+          label: 'Description',
+          sortable: false
+        }
+      ]
+    }
+  }
+}
+</script>
\ No newline at end of file
-- 
cgit v1.2.3