added swipe handler

src/layouts/Qlayout.vue

@@ -4,22 +4,38 @@
     <QSidebar ref="sidebar" />
 
     <q-page-container>
-      <router-view />
+      <div v-touch-swipe.mouse.right="onSwipe">
+        <router-view />
+      </div>
     </q-page-container>
   </q-layout>
 </template>
 
 <script lang="ts">
+import { useMainStore } from '../store/mainStore'
 import QSidebar from '../components/QSidebar.vue'
 import Toolbar from '../components/CashierToolbar.vue'
 
+const mainStore = useMainStore()
+
 export default {
   name: 'LayoutDefault',
 
   components: {
     QSidebar,
     Toolbar,
   },
+
+  methods: {
+    onSwipe(evt: any): void {
+      // console.log('open drawer', evt.direction, evt.duration, evt.distance)
+      // apply min. swipe distance before toggling the drawer.
+      if (evt.distance > 30) {
+        mainStore.toggleDrawer()
+      }
+
+    }
+  }
 }
 </script>
 

src/pages/Home.vue

@@ -109,7 +109,13 @@ onMounted(async () => {
     dataCreationDialogVisible.value = true
   }
 
-  visibleCards.value = await settings.get(SettingKeys.visibleCards)
+  // show only selected cards.
+  var visibleCardsSetting = await settings.get(SettingKeys.visibleCards)
+  if (visibleCardsSetting == null) {
+    visibleCards.value = Object.values(CardNames)
+  } else {
+    visibleCards.value = visibleCardsSetting
+  }
 })
 
 function menuClicked() {