parfum/docs/PRODUCT_BADGE_SYSTEM.md

Product Badge System

Overview

Sistem badge produk yang menampilkan label dinamis pada setiap produk berdasarkan kondisi tertentu. Hanya 1 badge yang ditampilkan per produk sesuai dengan prioritas yang telah ditentukan.

Prioritas Badge

Badge ditampilkan berdasarkan prioritas berikut (dari tertinggi ke terendah):

1. Terlaris (Prioritas Tertinggi)

• Kondisi: Produk memiliki penjualan ≥ 500 unit dalam 1 bulan terakhir
• Warna: Merah (bg-red-500 text-white)
• Label: "Terlaris"

2. Baru

• Kondisi: Produk dibuat dalam 1 bulan terakhir
• Warna: Primary (bg-home-primary text-white)
• Label: "Baru"

3. Hot (Prioritas Terendah)

• Kondisi: Produk memiliki views > 100
• Warna: Oranye (bg-orange-500 text-white)
• Label: "Hot"

Implementasi

Database Migration

Kolom view telah ditambahkan ke tabel:

• perfumes
• bottles
• products

File migration: 2025_12_26_001500_add_view_column_to_product_tables.php

Backend Logic

File: app/Livewire/Home/Product/Index.php

Method render()

• Menambahkan withCount untuk menghitung total penjualan dalam 1 bulan terakhir
• Memanggil method determineBadge() untuk setiap produk

Method determineBadge()

private function determineBadge($product): ?array
{
    // Priority 1: Baru (created within last month)
    if ($product->created_at && $product->created_at->isAfter(now()->subMonth())) {
        return [
            'label' => 'Baru',
            'class' => 'bg-blue-500 text-white',
        ];
    }

    // Priority 2: Terlaris (sales >= 500 in last month)
    if (isset($product->total_sales) && $product->total_sales >= 500) {
        return [
            'label' => 'Terlaris',
            'class' => 'bg-red-500 text-white',
        ];
    }

    // Priority 3: Hot (high views - > 100 views)
    if (isset($product->view) && $product->view > 100) {
        return [
            'label' => 'Hot',
            'class' => 'bg-orange-500 text-white',
        ];
    }

    return null;
}

Frontend Display

File: resources/views/livewire/home/product/index.blade.php

Badge ditampilkan secara kondisional:

@if (isset($product->badge) && $product->badge)
    <span class="absolute top-4 left-4 {{ $product->badge['class'] }} text-[10px] uppercase tracking-wider font-bold px-3 py-1 rounded-full z-10 shadow-md">
        {{ $product->badge['label'] }}
    </span>
@endif

Kustomisasi

Mengubah Threshold

Anda dapat mengubah nilai threshold di method determineBadge():

• Baru: Ubah now()->subMonth() menjadi periode lain (misal: now()->subWeeks(2))
• Terlaris: Ubah >= 500 menjadi nilai lain
• Hot: Ubah > 100 menjadi nilai lain

Menambah Badge Baru

Tambahkan kondisi baru di method determineBadge() dengan memperhatikan prioritas:

// Priority 4: Diskon (contoh)
if (isset($product->discount) && $product->discount > 0) {
    return [
        'label' => 'Diskon',
        'class' => 'bg-green-500 text-white',
    ];
}

Mengubah Warna Badge

Ubah class Tailwind di array return:

return [
    'label' => 'Baru',
    'class' => 'bg-purple-500 text-white', // Ganti warna di sini
];

Tracking View Count

Untuk meningkatkan view count produk, tambahkan logika di halaman detail produk:

// Di controller/livewire detail produk
$product->increment('view');

Notes

• Badge hanya ditampilkan jika kondisi terpenuhi
• Jika tidak ada kondisi yang terpenuhi, tidak ada badge yang ditampilkan
• Sistem menggunakan prioritas, jadi jika produk memenuhi multiple kondisi, hanya badge dengan prioritas tertinggi yang ditampilkan