From c2b1ffdd9e41c388ae2ac35211f2d62a9226cb93 Mon Sep 17 00:00:00 2001 From: YunYouJun Date: Sun, 30 Jul 2023 18:25:54 +0800 Subject: [PATCH] feat: use indexDB instead of array filter --- app.vue | 7 +-- components/BasketButton.vue | 9 ++-- components/ChooseFood.vue | 94 ++++++++++++++++++---------------- components/RecipePanel.vue | 4 +- components/SearchFoodInput.vue | 2 +- composables/db.ts | 18 +++++++ composables/store/recipe.ts | 53 ++++++++++++------- constants/index.ts | 3 ++ data/README.md | 6 +++ data/recipe.csv | 1 - data/recipe.json | 2 +- package.json | 1 + pages/index.vue | 28 +++++----- pnpm-lock.yaml | 8 +++ types/recipe.ts | 2 +- utils/db.ts | 31 +++++++++++ 16 files changed, 181 insertions(+), 88 deletions(-) create mode 100644 composables/db.ts create mode 100644 utils/db.ts diff --git a/app.vue b/app.vue index 1c18baf..1e0b447 100644 --- a/app.vue +++ b/app.vue @@ -2,9 +2,7 @@ import { installPrompt } from './utils/pwa' import { appName } from '~/constants' -// https://github.com/vueuse/head -// you can use this to manipulate the document head in any components, -// they will be rendered correctly in the html results with vite-ssg +// https://nuxt.com/docs/api/composables/use-head useHead({ title: appName, meta: [ @@ -15,8 +13,11 @@ useHead({ ], }) +const indexedDB = useIndexedDB() + onMounted(() => { installPrompt() + indexedDB.init() }) diff --git a/components/BasketButton.vue b/components/BasketButton.vue index bec09be..8c9d54d 100644 --- a/components/BasketButton.vue +++ b/components/BasketButton.vue @@ -1,18 +1,21 @@