<?php
// Get all products with user access status
$products = getAllProductsWithUserAccess($currentUser['id']);
// Handle search
$search = $_GET['search'] ?? '';
if ($search) {
$products = array_filter($products, function($product) use ($search) {
return stripos($product['name'], $search) !== false ||
stripos($product['description'], $search) !== false;
});
}
// Handle filter
$filter = $_GET['filter'] ?? 'all';
if ($filter !== 'all') {
$products = array_filter($products, function($product) use ($filter) {
if ($filter === 'accessible') {
return $product['has_access'] == 1;
} elseif ($filter === 'not_accessible') {
return $product['has_access'] == 0;
}
return true;
});
}
$totalProducts = count($products);
?>
<div class="bg-white rounded-lg shadow-sm border border-gray-200 p-6">
<div class="flex flex-col lg:flex-row lg:items-center lg:justify-between mb-6">
<div>
<h2 class="text-2xl font-bold text-gray-800 mb-2">Katalog Produk</h2>
<p class="text-gray-600">Lihat semua produk yang tersedia dan status akses Anda</p>
</div>
<div class="mt-4 lg:mt-0">
<span class="inline-flex items-center px-3 py-1 rounded-full text-sm font-medium bg-blue-100 text-blue-800">
<i class="fas fa-box mr-1"></i>
<?php echo $totalProducts; ?> Produk
</span>
</div>
</div>
<!-- Search and Filter -->
<div class="flex flex-col md:flex-row gap-4 mb-6">
<div class="flex-1">
<form method="GET" class="relative">
<input type="hidden" name="page" value="catalog">
<?php if (isset($_GET['filter'])): ?>
<input type="hidden" name="filter" value="<?php echo htmlspecialchars($_GET['filter']); ?>">
<?php endif; ?>
<input type="text"
name="search"
value="<?php echo htmlspecialchars($search); ?>"
placeholder="Cari produk..."
class="w-full pl-10 pr-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent">
<i class="fas fa-search absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400"></i>
</form>
</div>
<div class="flex gap-2">
<a href="?page=catalog<?php echo $search ? '&search=' . urlencode($search) : ''; ?>"
class="px-4 py-2 rounded-lg border <?php echo $filter === 'all' ? 'bg-blue-primary text-white border-blue-primary' : 'bg-white text-gray-700 border-gray-300 hover:bg-gray-50'; ?> transition-colors">
Semua
</a>
<a href="?page=catalog&filter=accessible<?php echo $search ? '&search=' . urlencode($search) : ''; ?>"
class="px-4 py-2 rounded-lg border <?php echo $filter === 'accessible' ? 'bg-green-600 text-white border-green-600' : 'bg-white text-gray-700 border-gray-300 hover:bg-gray-50'; ?> transition-colors">
Dapat Diakses
</a>
<a href="?page=catalog&filter=not_accessible<?php echo $search ? '&search=' . urlencode($search) : ''; ?>"
class="px-4 py-2 rounded-lg border <?php echo $filter === 'not_accessible' ? 'bg-red-600 text-white border-red-600' : 'bg-white text-gray-700 border-gray-300 hover:bg-gray-50'; ?> transition-colors">
Belum Dapat Diakses
</a>
</div>
</div>
<?php if (empty($products)): ?>
<div class="text-center py-12">
<i class="fas fa-box-open text-6xl text-gray-300 mb-4"></i>
<h3 class="text-xl font-semibold text-gray-600 mb-2">Tidak Ada Produk</h3>
<p class="text-gray-500">
<?php if ($search): ?>
Tidak ditemukan produk dengan kata kunci "<?php echo htmlspecialchars($search); ?>"
<?php else: ?>
Belum ada produk yang tersedia saat ini.
<?php endif; ?>
</p>
</div>
<?php else: ?>
<!-- Products Grid -->
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
<?php foreach ($products as $product): ?>
<div class="bg-white border border-gray-200 rounded-lg overflow-hidden hover:shadow-lg transition-shadow duration-300">
<!-- Product Image -->
<div class="relative h-48 bg-gradient-to-br from-blue-50 to-indigo-100">
<?php if (isset($product['image']) && $product['image']): ?>
<img src="../uploads/products/<?php echo htmlspecialchars($product['image']); ?>"
alt="<?php echo htmlspecialchars($product['name']); ?>"
class="w-full h-full object-cover">
<?php else: ?>
<div class="flex items-center justify-center h-full">
<i class="fas fa-box text-4xl text-gray-400"></i>
</div>
<?php endif; ?>
<!-- Access Status Badge -->
<div class="absolute top-3 right-3">
<?php if ($product['has_access']): ?>
<span class="inline-flex items-center px-2 py-1 rounded-full text-xs font-medium bg-green-100 text-green-800">
<i class="fas fa-check-circle mr-1"></i>
Dapat Diakses
</span>
<?php else: ?>
<span class="inline-flex items-center px-2 py-1 rounded-full text-xs font-medium bg-red-100 text-red-800">
<i class="fas fa-lock mr-1"></i>
Terkunci
</span>
<?php endif; ?>
</div>
</div>
<!-- Product Info -->
<div class="p-4">
<div class="flex items-start justify-between mb-2">
<h3 class="text-lg font-semibold text-gray-800 line-clamp-2">
<?php echo htmlspecialchars($product['name']); ?>
</h3>
</div>
<p class="text-gray-600 text-sm mb-3 line-clamp-2">
<?php echo htmlspecialchars($product['description']); ?>
</p>
<!-- Provider Info -->
<div class="flex items-center justify-between mb-3">
<div class="flex items-center text-sm text-gray-500">
<i class="fas fa-user-circle mr-1"></i>
<span><?php echo htmlspecialchars($product['provider_name']); ?></span>
</div>
<div class="text-lg font-bold text-blue-primary">
<?php echo $product['price'] > 0 ? 'Rp ' . number_format($product['price'], 0, ',', '.') : 'Gratis'; ?>
</div>
</div>
<!-- Action Button -->
<div class="mt-4">
<?php if ($product['has_access']): ?>
<a href="?page=products"
class="w-full bg-green-600 hover:bg-green-700 text-white font-medium py-2 px-4 rounded-lg transition-colors duration-200 flex items-center justify-center">
<i class="fas fa-box mr-2"></i>
Lihat di Produk Saya
</a>
<?php if ($product['user_access_granted']): ?>
<p class="text-xs text-gray-500 mt-2 text-center">
Akses diberikan: <?php echo date('d M Y', strtotime($product['user_access_granted'])); ?>
</p>
<?php endif; ?>
<?php else: ?>
<button class="w-full bg-gray-300 text-gray-500 font-medium py-2 px-4 rounded-lg cursor-not-allowed flex items-center justify-center" disabled>
<i class="fas fa-lock mr-2"></i>
Akses Diperlukan
</button>
<p class="text-xs text-gray-500 mt-2 text-center">
Hubungi admin atau reseller untuk mendapatkan akses
</p>
<?php endif; ?>
</div>
</div>
</div>
<?php endforeach; ?>
</div>
<?php endif; ?>
</div>
<style>
.line-clamp-2 {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
</style>