homebox/frontend/components/global/StatCard/StatCard.vue
Hayden 6a8a25e3f8
feat: new dashboard implementation (#168)
* wip: charts.js experimental work

* update lock file

* wip: frontend redesign

* wip: more UI fixes for consistency across themes

* cleanup

* improve UI log

* style updates

* fix lint errors
2022-12-29 16:19:15 -09:00

28 lines
737 B
Vue

<template>
<div class="stats bg-neutral shadow rounded-md">
<div class="stat text-neutral-content text-center space-y-1 p-3">
<div class="stat-title">{{ title }}</div>
<div class="stat-value text-2xl">
<Currency v-if="type === 'currency'" :amount="value" />
<template v-if="type === 'number'">{{ value }}</template>
</div>
<div v-if="subtitle" class="stat-desc">{{ subtitle }}</div>
</div>
</div>
</template>
<script setup lang="ts">
import { StatsFormat } from "./types";
type Props = {
title: string;
value: number;
subtitle?: string;
type?: StatsFormat;
};
withDefaults(defineProps<Props>(), {
type: "number",
subtitle: undefined,
});
</script>