feat: build UI

app/components/inventory/Inventory.vue

@@ -1,5 +1,43 @@
 <script setup>
+import InventoryHighlightCard from '@/components/inventory/InventoryHighlightCard.vue';
+
+const inventoryHighlights = [
+  {
+    name: 'Tổng số SKU',
+    value: 12,
+    icon: 'material-symbols:deployed-code-outline',
+    color: 'blue',
+  },
+  {
+    name: 'Tổng tồn kho',
+    value: '1,120',
+    icon: 'material-symbols:box-outline-rounded',
+    color: 'green',
+    unit: 'đơn vị'
+  },
+  {
+    name: 'Giá trị tồn kho',
+    value: '294.5M',
+    icon: 'material-symbols:attach-money-rounded',
+    color: 'purple',
+  },
+  {
+    name: 'Sắp hết hàng',
+    value: 3,
+    icon: 'material-symbols:warning-outline-rounded',
+    color: 'red',
+    unit: 'sản phẩm'
+  },
+];
 </script>
 <template>
-  Inventory
+  <div class="fixed-grid has-2-cols-mobile has-4-cols">
+    <div class="grid">
+      <InventoryHighlightCard
+        v-for="highlight in inventoryHighlights"
+        :key="highlight.name"
+        v-bind="highlight"
+      />
+    </div>
+  </div>
 </template>