20 lines
534 B
Vue
20 lines
534 B
Vue
<template>
|
|
<div v-for="(item, index) in foodRankList.slice(0, MAX_RANK_COUNT)"
|
|
:key="index" class="rank-item">
|
|
<span class="rank-index">{{ index+1 }}.</span>
|
|
<span class="rank-content">{{ item.name }}</span>
|
|
<span class="rank-amount">{{ item.value }} 次</span>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { useFoodStore } from '@/store/food'
|
|
import { computed } from 'vue'
|
|
|
|
const foodStore = useFoodStore()
|
|
|
|
const MAX_RANK_COUNT = 10
|
|
|
|
const foodRankList = computed(() => foodStore.rankStats)
|
|
</script>
|