feat: add tool icon for dish

This commit is contained in:
YunYouJun
2022-04-16 09:35:16 +08:00
parent bff0d9eada
commit 579aa1489f
4 changed files with 11 additions and 8 deletions

View File

@@ -3,6 +3,7 @@ import fs from 'fs'
import path from 'path'
import consola from 'consola'
import type { Recipe, RecipeItem } from '~/types'
import { generateEmojisFromStuff } from '~/utils'
const recipeCsvFile = path.resolve(__dirname, '../src/data/recipe.csv')
const recipeJsonFile = path.resolve(__dirname, '../src/data/recipe.json')
@@ -22,9 +23,11 @@ function run() {
lines.slice(1).forEach((line) => {
if (line) {
const attrs = line.split(',')
const stuff = attrs[1].trim().split(sep)
recipeJson.push({
name: attrs[0].trim(),
stuff: attrs[1].trim().split(sep),
stuff,
emojis: generateEmojisFromStuff(stuff),
link: attrs[2].trim(),
difficulty: attrs[3] && attrs[3].trim() as RecipeItem['difficulty'],
tags: attrs[4] ? attrs[4].trim().split(sep) : [],

View File

@@ -8,11 +8,7 @@ import { meat, staple, tools, vegetable } from '~/data/food'
import recipeData from '~/data/recipe.json'
import type { Recipe } from '~/types'
import { useRecipeStore } from '~/stores/recipe'
import { generateEmojisFromStuff } from '~/utils'
(recipeData as Recipe).forEach((recipe) => {
recipe.emojis = generateEmojisFromStuff(recipe.stuff)
})
const recipe = ref<Recipe>(recipeData as Recipe)
const rStore = useRecipeStore()

View File

@@ -1,5 +1,6 @@
<script lang="ts" setup>
import { useGtm } from '@gtm-support/vue-gtm'
import { tools } from '~/data/food'
import type { RecipeItem } from '~/types'
defineProps<{
dish: RecipeItem
@@ -15,6 +16,7 @@ const triggerGtm = (val: string) => {
label: '跳转菜谱',
})
}
</script>
<template>
@@ -24,6 +26,9 @@ const triggerGtm = (val: string) => {
bg="blue-300 opacity-20"
@click="triggerGtm(dish.name)"
>
<span text="sm blue-700 dark:blue-200">{{ dish.emojis.join(' ') + ' ' + dish.name }}</span>
<span m="r-1" class="inline-flex justify-center items-center" text="sm blue-700 dark:blue-200">{{ dish.emojis.join(' ') + ' ' + dish.name }}</span>
<span v-for="tool, i in tools" :key="i" inline-flex>
<div v-if="dish.tools?.includes(tool.name)" :class="tool.icon" />
</span>
</a>
</template>

View File

@@ -25,8 +25,7 @@ title: 关于
</a>
</div>
<br/>
<br/>
如果您有任何建议或反馈可前往 [Issues](https://github.com/YunYouJun/cook/issues) / [Discussions](https://github.com/YunYouJun/cook/issues)。
<div class="flex justify-center items-center">
Made by