From 3ae07a10730023cc5b01124502cf1db1e9ae161f Mon Sep 17 00:00:00 2001
From: YunYouJun <me@yunyoujun.cn>
Date: Sun, 17 Apr 2022 17:11:59 +0800
Subject: [PATCH] feat: revert strict mode

---
 src/components/ChooseFood.vue | 5 ++++-
 src/components/Switch.vue     | 6 +++---
 src/stores/recipe.ts          | 2 +-
 3 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/src/components/ChooseFood.vue b/src/components/ChooseFood.vue
index e4e9e28..f7868a7 100644
--- a/src/components/ChooseFood.vue
+++ b/src/components/ChooseFood.vue
@@ -1,6 +1,8 @@
 <script lang="ts" setup>
 import { useGtm } from '@gtm-support/vue-gtm'
 import { isClient } from '@vueuse/core'
+import { storeToRefs } from 'pinia'
+import Switch from './Switch.vue'
 import type { StuffItem } from '~/data/food'
 import { meat, staple, tools, vegetable } from '~/data/food'
 import recipeData from '~/data/recipe.json'
@@ -12,11 +14,11 @@ import { useInvisibleElement } from '~/composables/helper'
 const recipe = ref<Recipe>(recipeData as Recipe)
 
 const rStore = useRecipeStore()
+const { strict } = storeToRefs(rStore)
 const curStuff = computed(() => rStore.selectedStuff)
 const curTools = computed(() => rStore.selectedTools)
 
 // 默认严格模式
-const strict = ref(true)
 const displayedRecipe = computed(() => {
   return recipe.value.filter((item) => {
     if (strict.value) {
@@ -207,6 +209,7 @@ const { isVisible, show } = useInvisibleElement(recipePanel)
     <h2 text="xl" font="bold" p="1">
       🍲 来看看组合出的菜谱吧！
     </h2>
+    <Switch />
     <Transition mode="out-in">
       <div p="2">
         <span v-if="!curStuff.length && !curTools.length" text="sm" p="2">
diff --git a/src/components/Switch.vue b/src/components/Switch.vue
index 27115d3..7509716 100644
--- a/src/components/Switch.vue
+++ b/src/components/Switch.vue
@@ -6,16 +6,16 @@ const { strict } = storeToRefs(rStore)
 </script>
 
 <template>
-  <div class="inline-flex justify-center items-center" m="y-4">
+  <div class="inline-flex justify-center items-center" m="t-2">
     <span :class="!strict && 'text-green-600'" font="bold" m="x-1" @click="strict = false">
-      可做的所有菜
+      模糊匹配
     </span>
     <label m="x-1" class="switch">
       <input v-model="strict" type="checkbox">
       <span class="inline-flex justify-center items-center slider round" />
     </label>
     <span :class="strict && 'text-green-600'" font="bold" m="x-1" @click="strict = true">
-      一起做一道菜
+      精准匹配
     </span>
   </div>
 </template>
diff --git a/src/stores/recipe.ts b/src/stores/recipe.ts
index de3105b..42f1e47 100644
--- a/src/stores/recipe.ts
+++ b/src/stores/recipe.ts
@@ -1,7 +1,7 @@
 import { acceptHMRUpdate, defineStore } from 'pinia'
 
 export const useRecipeStore = defineStore('recipe', () => {
-  const strict = ref(true)
+  const strict = ref(false)
 
   const curStuff = ref(new Set<string>())
   const curTools = ref(new Set<string>())