feat: build UI

app/components/dashboard/TopProduct.vue

@@ -0,0 +1,29 @@
+<script setup>
+const props = defineProps({
+  name: String,
+  sold_count: Number,
+  revenue: Number,
+  topRevenue: Number,
+});
+
+const { $shortenCurrency } = useNuxtApp();
+</script>
+<template>
+  <div>
+    <div class="is-flex is-gap-1 is-justify-content-space-between mb-2">
+      <div>
+        <p>{{ name }}</p>
+        <p class="fs-13 has-text-grey-60">Đã bán {{ sold_count }} sản phẩm</p>
+      </div>
+      <p class="font-semibold">{{ $shortenCurrency(revenue) }}</p>
+    </div>
+    <progress class="progress is-small is-primary" :value="revenue" :max="topRevenue">
+      15%
+    </progress>
+  </div>
+</template>
+<style scoped>
+.progress {
+  --bulma-size-small: 0.5rem;
+}
+</style>