Fixing vendor dashboard area
This commit is contained in:
11
app/templates/vendor/admin/customers.html
vendored
11
app/templates/vendor/admin/customers.html
vendored
@@ -1,11 +0,0 @@
|
||||
<DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Customer management</title>
|
||||
</head>
|
||||
<body>
|
||||
<-- Customer management -->
|
||||
</body>
|
||||
</html>
|
||||
158
app/templates/vendor/admin/dashboard.html
vendored
158
app/templates/vendor/admin/dashboard.html
vendored
@@ -1,158 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Vendor Dashboard - Multi-Tenant Ecommerce Platform</title>
|
||||
<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script>
|
||||
</head>
|
||||
<body x-data="vendorDashboard()" x-init="init()" x-cloak>
|
||||
<!-- Header -->
|
||||
<header class="admin-header">
|
||||
<div class="header-left">
|
||||
<h1>🏪 <span x-text="vendor?.name || 'Vendor Dashboard'"></span></h1>
|
||||
</div>
|
||||
<div class="header-right">
|
||||
<span class="user-info">
|
||||
Welcome, <strong x-text="currentUser.username"></strong>
|
||||
<span class="badge badge-primary" x-text="vendorRole" style="margin-left: 8px;"></span>
|
||||
</span>
|
||||
<button class="btn-logout" @click="handleLogout">Logout</button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<!-- Main Container -->
|
||||
<div class="admin-container">
|
||||
<!-- Sidebar -->
|
||||
<aside class="admin-sidebar">
|
||||
<nav>
|
||||
<ul class="nav-menu">
|
||||
<li class="nav-item">
|
||||
<a href="#"
|
||||
class="nav-link active"
|
||||
@click.prevent="currentSection = 'dashboard'">
|
||||
📊 Dashboard
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#"
|
||||
class="nav-link"
|
||||
@click.prevent="currentSection = 'products'">
|
||||
📦 Products
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#"
|
||||
class="nav-link"
|
||||
@click.prevent="currentSection = 'orders'">
|
||||
🛒 Orders
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#"
|
||||
class="nav-link"
|
||||
@click.prevent="currentSection = 'customers'">
|
||||
👥 Customers
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="#"
|
||||
class="nav-link"
|
||||
@click.prevent="currentSection = 'marketplace'">
|
||||
🌐 Marketplace
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
</aside>
|
||||
|
||||
<!-- Main Content -->
|
||||
<main class="admin-content">
|
||||
<!-- Dashboard View -->
|
||||
<div x-show="currentSection === 'dashboard'">
|
||||
<!-- Vendor Info Card -->
|
||||
<div class="content-section" style="margin-bottom: 24px;">
|
||||
<div style="display: flex; justify-content: space-between; align-items: center;">
|
||||
<div>
|
||||
<h2 style="margin: 0;" x-text="vendor?.name"></h2>
|
||||
<p style="margin: 4px 0 0 0; color: var(--text-secondary);">
|
||||
<strong x-text="vendor?.vendor_code"></strong> •
|
||||
<span x-text="vendor?.subdomain"></span>
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<span class="badge"
|
||||
:class="vendor?.is_verified ? 'badge-success' : 'badge-warning'"
|
||||
x-text="vendor?.is_verified ? 'Verified' : 'Pending Verification'"></span>
|
||||
<span class="badge"
|
||||
:class="vendor?.is_active ? 'badge-success' : 'badge-danger'"
|
||||
x-text="vendor?.is_active ? 'Active' : 'Inactive'"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Stats Grid -->
|
||||
<div class="stats-grid">
|
||||
<div class="stat-card">
|
||||
<div class="stat-header">
|
||||
<div class="stat-title">Products</div>
|
||||
<div class="stat-icon">📦</div>
|
||||
</div>
|
||||
<div class="stat-value" x-text="stats.products_count || 0"></div>
|
||||
<div class="stat-subtitle">in catalog</div>
|
||||
</div>
|
||||
|
||||
<div class="stat-card">
|
||||
<div class="stat-header">
|
||||
<div class="stat-title">Orders</div>
|
||||
<div class="stat-icon">🛒</div>
|
||||
</div>
|
||||
<div class="stat-value" x-text="stats.orders_count || 0"></div>
|
||||
<div class="stat-subtitle">total orders</div>
|
||||
</div>
|
||||
|
||||
<div class="stat-card">
|
||||
<div class="stat-header">
|
||||
<div class="stat-title">Customers</div>
|
||||
<div class="stat-icon">👥</div>
|
||||
</div>
|
||||
<div class="stat-value" x-text="stats.customers_count || 0"></div>
|
||||
<div class="stat-subtitle">registered</div>
|
||||
</div>
|
||||
|
||||
<div class="stat-card">
|
||||
<div class="stat-header">
|
||||
<div class="stat-title">Revenue</div>
|
||||
<div class="stat-icon">💰</div>
|
||||
</div>
|
||||
<div class="stat-value">€<span x-text="stats.revenue || 0"></span></div>
|
||||
<div class="stat-subtitle">total revenue</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Coming Soon Notice -->
|
||||
<div class="content-section" style="text-align: center; padding: 48px;">
|
||||
<h3>🚀 Getting Started</h3>
|
||||
<p class="text-muted" style="margin: 16px 0;">
|
||||
Welcome to your vendor dashboard! Start by importing products from the marketplace.
|
||||
</p>
|
||||
<button class="btn btn-primary" @click="currentSection = 'marketplace'">
|
||||
Go to Marketplace Import
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Other sections -->
|
||||
<div x-show="currentSection !== 'dashboard'">
|
||||
<div class="content-section">
|
||||
<h2 x-text="currentSection.charAt(0).toUpperCase() + currentSection.slice(1)"></h2>
|
||||
<p class="text-muted">This section is coming soon in the next development slice.</p>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
|
||||
<script src="/static/shared/js/api-client.js"></script>
|
||||
<script src="/static/vendor/js/dashboard.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
11
app/templates/vendor/admin/inventory.html
vendored
11
app/templates/vendor/admin/inventory.html
vendored
@@ -1,11 +0,0 @@
|
||||
<DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Inventory management - catalog products</title>
|
||||
</head>
|
||||
<body>
|
||||
<-- Inventory management - catalog products -->
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,11 +0,0 @@
|
||||
<DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Browse marketplace products - staging</title>
|
||||
</head>
|
||||
<body>
|
||||
<-- Browse marketplace products - staging -->
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,11 +0,0 @@
|
||||
<DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Marketplace configuration</title>
|
||||
</head>
|
||||
<body>
|
||||
<-- Marketplace configuration -->
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,11 +0,0 @@
|
||||
<DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Import jobs and history</title>
|
||||
</head>
|
||||
<body>
|
||||
<-- Import jobs and history -->
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,11 +0,0 @@
|
||||
<DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Selected products - pre-publish</title>
|
||||
</head>
|
||||
<body>
|
||||
<-- Selected products - pre-publish -->
|
||||
</body>
|
||||
</html>
|
||||
11
app/templates/vendor/admin/media.html
vendored
11
app/templates/vendor/admin/media.html
vendored
@@ -1,11 +0,0 @@
|
||||
<DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Media library</title>
|
||||
</head>
|
||||
<body>
|
||||
<-- Media library -->
|
||||
</body>
|
||||
</html>
|
||||
11
app/templates/vendor/admin/notifications.html
vendored
11
app/templates/vendor/admin/notifications.html
vendored
@@ -1,11 +0,0 @@
|
||||
<DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Notification templates and logs</title>
|
||||
</head>
|
||||
<body>
|
||||
<-- Notification templates and logs -->
|
||||
</body>
|
||||
</html>
|
||||
11
app/templates/vendor/admin/orders.html
vendored
11
app/templates/vendor/admin/orders.html
vendored
@@ -1,11 +0,0 @@
|
||||
<DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Order management</title>
|
||||
</head>
|
||||
<body>
|
||||
<-- Order management -->
|
||||
</body>
|
||||
</html>
|
||||
11
app/templates/vendor/admin/payments.html
vendored
11
app/templates/vendor/admin/payments.html
vendored
@@ -1,11 +0,0 @@
|
||||
<DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Payment configuration</title>
|
||||
</head>
|
||||
<body>
|
||||
<-- Payment configuration -->
|
||||
</body>
|
||||
</html>
|
||||
11
app/templates/vendor/admin/products.html
vendored
11
app/templates/vendor/admin/products.html
vendored
@@ -1,11 +0,0 @@
|
||||
<DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Catalog management - Product table</title>
|
||||
</head>
|
||||
<body>
|
||||
<-- Catalog management - Product table -->
|
||||
</body>
|
||||
</html>
|
||||
11
app/templates/vendor/admin/settings.html
vendored
11
app/templates/vendor/admin/settings.html
vendored
@@ -1,11 +0,0 @@
|
||||
<DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Vendor settings</title>
|
||||
</head>
|
||||
<body>
|
||||
<-- Vendor settings -->
|
||||
</body>
|
||||
</html>
|
||||
11
app/templates/vendor/admin/teams.html
vendored
11
app/templates/vendor/admin/teams.html
vendored
@@ -1,11 +0,0 @@
|
||||
<DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Team management</title>
|
||||
</head>
|
||||
<body>
|
||||
<-- Team management -->
|
||||
</body>
|
||||
</html>
|
||||
64
app/templates/vendor/partials/header.html
vendored
64
app/templates/vendor/partials/header.html
vendored
@@ -67,10 +67,10 @@
|
||||
</li>
|
||||
|
||||
<!-- Profile menu -->
|
||||
<li class="relative">
|
||||
<li class="relative" x-data="{ profileOpen: false }">
|
||||
<button class="align-middle rounded-full focus:shadow-outline-purple focus:outline-none"
|
||||
@click="toggleProfileMenu"
|
||||
@keydown.escape="closeProfileMenu"
|
||||
@click="profileOpen = !profileOpen"
|
||||
@keydown.escape="profileOpen = false"
|
||||
aria-label="Account"
|
||||
aria-haspopup="true">
|
||||
<div class="w-8 h-8 rounded-full bg-purple-600 flex items-center justify-center text-white font-semibold">
|
||||
@@ -78,30 +78,40 @@
|
||||
</div>
|
||||
</button>
|
||||
|
||||
<template x-if="isProfileMenuOpen">
|
||||
<ul x-transition:leave="transition ease-in duration-150"
|
||||
x-transition:leave-start="opacity-100"
|
||||
x-transition:leave-end="opacity-0"
|
||||
@click.away="closeProfileMenu"
|
||||
@keydown.escape="closeProfileMenu"
|
||||
class="absolute right-0 w-56 p-2 mt-2 space-y-2 text-gray-600 bg-white border border-gray-100 rounded-md shadow-md dark:border-gray-700 dark:text-gray-300 dark:bg-gray-700">
|
||||
<li class="flex">
|
||||
<a class="inline-flex items-center w-full px-2 py-1 text-sm font-semibold transition-colors duration-150 rounded-md hover:bg-gray-100 hover:text-gray-800 dark:hover:bg-gray-800 dark:hover:text-gray-200"
|
||||
href="/vendor/{{ vendor_code }}/settings">
|
||||
<span x-html="$icon('cog', 'w-4 h-4 mr-3')"></span>
|
||||
<span>Settings</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="flex">
|
||||
<a class="inline-flex items-center w-full px-2 py-1 text-sm font-semibold transition-colors duration-150 rounded-md hover:bg-gray-100 hover:text-gray-800 dark:hover:bg-gray-800 dark:hover:text-gray-200"
|
||||
@click.prevent="handleLogout"
|
||||
href="#">
|
||||
<span x-html="$icon('logout', 'w-4 h-4 mr-3')"></span>
|
||||
<span>Log out</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</template>
|
||||
<!-- Use x-show instead of x-if for reliability -->
|
||||
<ul x-show="profileOpen"
|
||||
x-cloak
|
||||
x-transition:leave="transition ease-in duration-150"
|
||||
x-transition:leave-start="opacity-100"
|
||||
x-transition:leave-end="opacity-0"
|
||||
@click.away="profileOpen = false"
|
||||
@keydown.escape="profileOpen = false"
|
||||
class="absolute right-0 w-56 p-2 mt-2 space-y-2 text-gray-600 bg-white border border-gray-100 rounded-md shadow-md dark:border-gray-700 dark:text-gray-300 dark:bg-gray-700 z-50"
|
||||
style="display: none;"
|
||||
aria-label="submenu">
|
||||
<li class="flex">
|
||||
<a class="inline-flex items-center w-full px-2 py-1 text-sm font-semibold transition-colors duration-150 rounded-md hover:bg-gray-100 hover:text-gray-800 dark:hover:bg-gray-800 dark:hover:text-gray-200"
|
||||
:href="`/vendor/${vendorCode}/profile`">
|
||||
<span x-html="$icon('user', 'w-4 h-4 mr-3')"></span>
|
||||
<span>Profile</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="flex">
|
||||
<a class="inline-flex items-center w-full px-2 py-1 text-sm font-semibold transition-colors duration-150 rounded-md hover:bg-gray-100 hover:text-gray-800 dark:hover:bg-gray-800 dark:hover:text-gray-200"
|
||||
:href="`/vendor/${vendorCode}/settings`">
|
||||
<span x-html="$icon('cog', 'w-4 h-4 mr-3')"></span>
|
||||
<span>Settings</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="flex">
|
||||
<button
|
||||
@click="handleLogout()"
|
||||
class="inline-flex items-center w-full px-2 py-1 text-sm font-semibold transition-colors duration-150 rounded-md hover:bg-gray-100 hover:text-gray-800 dark:hover:bg-gray-800 dark:hover:text-gray-200 text-left">
|
||||
<span x-html="$icon('logout', 'w-4 h-4 mr-3')"></span>
|
||||
<span>Log out</span>
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
11
app/templates/vendor/partials/sidebar.html
vendored
11
app/templates/vendor/partials/sidebar.html
vendored
@@ -129,6 +129,17 @@ Follows same pattern as admin sidebar
|
||||
<span class="ml-4">Team</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="relative px-6 py-3">
|
||||
<span x-show="currentPage === 'profile'"
|
||||
class="absolute inset-y-0 left-0 w-1 bg-purple-600 rounded-tr-lg rounded-br-lg"
|
||||
aria-hidden="true"></span>
|
||||
<a class="inline-flex items-center w-full text-sm font-semibold transition-colors duration-150 hover:text-gray-800 dark:hover:text-gray-200"
|
||||
:class="currentPage === 'profile' ? 'text-gray-800 dark:text-gray-100' : ''"
|
||||
:href="`/vendor/${vendorCode}/profile`">
|
||||
<span x-html="$icon('user', 'w-5 h-5')"></span>
|
||||
<span class="ml-4">Profile</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="relative px-6 py-3">
|
||||
<span x-show="currentPage === 'settings'"
|
||||
class="absolute inset-y-0 left-0 w-1 bg-purple-600 rounded-tr-lg rounded-br-lg"
|
||||
|
||||
Reference in New Issue
Block a user