refactor: use nuxt compatiable 4 folder

This commit is contained in:
YunYouJun
2024-09-15 18:07:50 +08:00
parent 7a52b024dd
commit 41bdc3346f
96 changed files with 2577 additions and 2673 deletions

17
app/pages/404.vue Normal file
View File

@@ -0,0 +1,17 @@
<script setup lang="ts">
// const router = useRouter()
</script>
<template>
<main p="x4 y10" text="center green-700 dark:gray-200">
<div text-4xl>
<div i-ri-error-warning-line inline-block />
</div>
<div>菜谱消失了</div>
<div>
<NuxtLink text-sm btn m="3 t8" to="/">
返回主页
</NuxtLink>
</div>
</main>
</template>

5
app/pages/about.vue Normal file
View File

@@ -0,0 +1,5 @@
<template>
<div>
关于
</div>
</template>

View File

@@ -0,0 +1,22 @@
<script lang="ts" setup>
definePageMeta({
layout: 'child',
title: '自定义菜谱',
})
</script>
<template>
<div>
<h3>
开发中敬请期待
</h3>
<div grid="~ cols-3" gap="4" p="4">
<CookbookCard :cookbook="defaultCookbook">
默认菜谱
</CookbookCard>
<NewCookbookCard />
</div>
</div>
</template>

View File

@@ -0,0 +1,5 @@
<template>
<div>
新建 Cookbook
</div>
</template>

165
app/pages/help.vue Normal file
View File

@@ -0,0 +1,165 @@
<template>
<div class="w-full">
<CommonHeader>
帮助
</CommonHeader>
<InstallPwa />
<FeedbackActions />
<div class="mx-auto max-w-md w-full rounded-2xl p-2" text-left>
<FAQItem title="未来计划?">
计划增加新功能如自定义菜谱与使用其他用户分享的菜谱
</FAQItem>
<FAQItem title="什么是模式?">
<ul>
<li><b>模糊匹配</b>展示所有含当前选中任意食材的菜谱</li>
<li><b>精准匹配</b>展示所有含当前选中所有食材的菜谱</li>
<li><b>生存模式</b>展示当前选中食材即可制作的所有菜谱</li>
</ul>
</FAQItem>
<FAQItem title="如何快速清空所选食材和工具?">
<div inline-flex items-center justify-center>
点击顶部 <div i-mdi-pot-steam-outline mx-1 inline-block /> 图标即可
</div>
</FAQItem>
<FAQItem title="是否有微信小程序?">
因不可抗力小程序因跳转 B 站视频而被判定为导流违规下架
将不再提供小程序版本
<br>
<br>
搜索微信公众号<b>云游君</b>并发送<b>做菜</b>也可以快速找到本网站
</FAQItem>
<FAQItem title="是否有 APP?">
<b>暂时没有开发 APP 的计划</b>
<br>
但我们正在优化 <b>PWA</b> 的体验以便您可以直接将本站添加到桌面并享受<b>类似 APP 的体验</b>
<br>
你可以使用浏览器打开点击上方的<b>安装到桌面</b>或在菜单中点击<b>添加到主屏幕</b>
</FAQItem>
<FAQItem title="未来是否会收费?">
该项目将以免费开源的形式运营
<br>
您可以考虑赞助本项目以支持我们的开发
我会将其投入在周边的服务器域名CDN 等费用上
<ul mt-1>
<li>
<a href="https://afdian.net/a/yunyoujun" target="_blank">爱发电赞助</a>
</li>
<li>
<a href="https://sponsors.yunyoujun.cn/" target="_blank">我要直接打钱</a>
</li>
</ul>
</FAQItem>
<FAQItem title="页面无法点击、资源加载失败?">
<blockquote>
试试无痕模式是否正常
</blockquote>
<br>
<ol>
<li>
<b>清除 Cookie</b>
<ol>
<li>
点击浏览器网址前方的 🔒 图标
</li>
<li>
点击Cookie并清除
</li>
</ol>
</li>
<li>
<b>强制刷新缓存</b>
<ul>
<li>Windows: <code>Ctrl + F5</code></li>
<li>macOS: <code>Cmd + Shift + R</code></li>
</ul>
</li>
</ol>
</FAQItem>
<hr h="1" my="4" bg-black>
<FAQItem :default-open="true" title="关于">
<div text-left>
<ul>
<li>
它诞生于 2022 4 时值疫情风控期间希望能帮助期间的伙伴根据现有食材寻找到合适的菜谱故原名隔离食用手册
</li>
<li>
如今那个时期已离我们远去故去掉隔离二字但也很高兴能在这里继续与你相遇希望它能继续发光发热在日常生活中帮助到大家
</li>
<li>
<div class="inline-flex items-center justify-center">
代码仓库<a class="inline-flex items-center justify-center" href="https://github.com/YunYouJun/cook" target="_blank">
<div m="r-1" i-ri-github-line inline-flex />YunYouJun/cook</a>
</div>
</li>
<li>
<div class="inline-flex items-center justify-center">
菜谱视频来源
<a class="inline-flex items-center text-sm text-blue-600 dark:text-blue-400" href="https://docs.qq.com/sheet/DQk1vdkhFV0twQVNS" target="_blank">
<div m="r-1" i-ri-bilibili-line inline-flex />
<span class="inline-flex">隔离食用手册大全</span>
</a>
</div>
</li>
</ul>
</div>
</FAQItem>
<FAQItem title="关于我">
<div text-left>
我的个人微信公众号云游君会分享一些生活和写的<a href="https://sponsors.yunyoujun.cn/projects" target="_blank">
小玩具们
</a>
<a inline-flex py-4 href="https://cdn.yunyoujun.cn/img/about/white-qrcode-and-search.jpg" target="_blank">
<img src="https://cdn.yunyoujun.cn/img/about/white-qrcode-and-search.jpg">
</a>
</div>
<AboutMe />
</FAQItem>
<FAQItem title="致谢">
<p>
感谢以下小伙伴为本项目提供的数据支持和 QA
</p>
<ul mt-2 text-left text-sm>
<li>
<a href="https://weibo.com/runny" target="_blank">Runny</a>
</li>
<li>
麒麟
</li>
<li>
晴方啾
</li>
<li>
课代表阿伟
</li>
</ul>
</FAQItem>
<FAQItem title="赞助者们">
<div>
感谢至今以来所有的<a href="https://afdian.net/a/yunyoujun" class="text-purple" target="_blank">赞助者</a>你们的支持是我持续维护和开发新项目的动力
</div>
<div pt-2>
<a href="https://sponsors.yunyoujun.cn" target="_blank">
<img src="https://sponsors.yunyoujun.cn/sponsors.svg">
</a>
</div>
</FAQItem>
</div>
</div>
<BaseFooter mt-4 />
</template>

22
app/pages/index.vue Normal file
View File

@@ -0,0 +1,22 @@
<script lang="ts" setup>
const rStore = useRecipeStore()
</script>
<template>
<div text-4xl>
<button
class="cursor-pointer transition active:text-green-800 hover:(text-green-600)"
title="重置"
@click="rStore.reset"
>
<div v-if="rStore.selectedStuff.length" i-mdi-pot-steam-outline />
<div v-else i-mdi-pot-mix-outline />
</button>
</div>
<p text="sm" m="b-4">
好的今天我们来做菜
</p>
<ChooseFood />
<SimpleCopyright />
</template>

10
app/pages/random.vue Normal file
View File

@@ -0,0 +1,10 @@
<template>
<div flex flex-col>
<CommonHeader>
今天吃什么
</CommonHeader>
<div flex flex-grow flex-col items-center justify-center>
<RandomRecipe />
</div>
</div>
</template>

View File

@@ -0,0 +1,12 @@
<script lang="ts" setup>
definePageMeta({
layout: 'child',
title: '我的收藏',
})
</script>
<template>
<div>
施工中...
</div>
</template>

View File

@@ -0,0 +1,38 @@
<script lang="ts" setup>
import dayjs from 'dayjs'
import { recipeHistories } from '~/composables/store/history'
definePageMeta({
layout: 'child',
title: '历史记录',
})
// todo
// clear one history
function clearAllHistory() {
recipeHistories.value = []
}
</script>
<template>
<div pt-2>
<div
text="blue-900 dark:blue-200"
bg="blue-300 op-20 hover:(blue-800 op-20) dark:hover:(blue-200 op-20)"
class="inline-flex items-center justify-center border border-transparent rounded-md px-4 py-2 text-sm font-medium focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-blue-500"
@click="clearAllHistory"
>
<div i-ri-eraser-line />
<span class="ml-1">清空记录</span>
</div>
<div flex="~ col">
<div v-for="history in recipeHistories" :key="history.recipe.name" mt-2>
<StapleTag :active="false">
{{ dayjs(history.time).format('YYYY-MM-DD HH:mm:ss') }}
</StapleTag>
<DishTag :dish="history.recipe" />
</div>
</div>
</div>
</template>

View File

@@ -0,0 +1,12 @@
<script lang="ts" setup>
definePageMeta({
layout: 'child',
title: '菜谱 - ?',
})
</script>
<template>
<div>
asd
</div>
</template>

View File

@@ -0,0 +1,5 @@
<template>
<div>
新建 Recipe
</div>
</template>

28
app/pages/settings.vue Normal file
View File

@@ -0,0 +1,28 @@
<script lang="ts" setup>
const app = useAppStore()
definePageMeta({
layout: 'child',
})
</script>
<template>
<div>
<CommonHeader>
设置
</CommonHeader>
<div
class="mx-auto max-w-md w-full"
px-2
text-left
>
<YlfForm>
<YlfFormItem label="离开网页后保留选中数据">
<YlfSwitch v-model="app.settings.keepLocalData" />
</YlfFormItem>
<YlfFormItem label="更多设置,敬请期待" />
</YlfForm>
</div>
</div>
</template>

43
app/pages/user.vue Normal file
View File

@@ -0,0 +1,43 @@
<script lang="ts" setup>
import { links } from '~/constants'
</script>
<template>
<div>
<CommonHeader>
我的
</CommonHeader>
<div
class="mx-auto max-w-md w-full"
px-2
text-left
>
<div mt-2 gap="3" grid="~ cols-3">
<YlfIconItem to="/recipes/history" icon="i-ri-history-line" label="历史记录" />
<YlfIconItem to="/recipes/collect" icon="i-ri-star-line" label="我的收藏" />
<YlfIconItem to="/cookbooks" icon="i-ri-article-line" label="自定义菜谱" />
</div>
<YlfForm>
<YlfFormItem icon="i-ri-feedback-line" label="立即反馈" :to="links.feedback" target="_blank" />
<YlfFormItem icon="i-ri-mail-send-line" label="立即投稿" :to="links.contribute" target="_blank" />
</YlfForm>
<YlfForm>
<YlfFormItem icon="i-ri-settings-line" label="设置" to="/settings" />
</YlfForm>
<!-- <YlfForm>
<YlfFormItem icon="i-ri-article-line" label="自定义菜谱 TODO" to="/cookbooks/" />
</YlfForm> -->
<YlfForm>
<YlfFormItem icon="i-ri-question-line" label="帮助" to="/help" />
<YlfFormItem icon="i-ri-information-line" label="关于" to="/help" />
</YlfForm>
</div>
<BaseFooter mt-4 />
</div>
</template>