feat: build UI

app/components/dashboard/TopCustomer.vue

@@ -0,0 +1,23 @@
+<script setup>
+import AvatarBox from '@/components/dashboard/AvatarBox.vue';
+
+const props = defineProps({
+  name: String,
+  order_count: Number,
+  paid: Number,
+})
+
+const { $shortenCurrency } = useNuxtApp();
+</script>
+<template>
+  <div class="is-flex is-gap-1 is-justify-content-space-between">
+    <div class="is-flex is-gap-1">
+      <AvatarBox :text="name.slice(0, 2)" />
+      <div>
+        <p>{{ name }}</p>
+        <p class="fs-13 has-text-grey">{{ order_count }} đơn hàng</p>
+      </div>
+    </div>
+    <p class="font-semibold">{{ $shortenCurrency(paid) }}</p>
+  </div>
+</template>