sboulahtit/orion
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

migrating vendor frontend to new architecture

Browse Source
This commit is contained in:
Samir Boulahtit
2025-10-28 22:58:55 +01:00
parent b0cc0385f8
commit cd5097fc04
28 changed files with 312 additions and 228 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/templates/admin/login.html
View File

@@ -103,7 +103,7 @@
<!-- Scripts - ORDER MATTERS! -->
<!-- 1. Log Configuration -->
<script src="{{ url_for('static', path='admin/js/log-config.js') }}"></script>
<script src="{{ url_for('static', path='shared/js/log-config.js') }}"></script>
<!-- 2. Icons -->
<script src="{{ url_for('static', path='shared/js/icons.js') }}"></script>

4
app/templates/admin/vendors.html
View File

@@ -69,7 +69,7 @@
<!-- Card: Pending Verification -->
<div class="flex items-center p-4 bg-white rounded-lg shadow-xs dark:bg-gray-800">
<div class="p-3 mr-4 text-yellow-500 bg-yellow-100 rounded-full dark:text-yellow-100 dark:bg-yellow-500">
<div class="p-3 mr-4 text-blue-500 bg-blue-100 rounded-full dark:text-blue-100 dark:bg-blue-500">
<span x-html="$icon('clock', 'w-5 h-5')"></span>
</div>
<div>
@@ -84,7 +84,7 @@
<!-- Card: Inactive Vendors -->
<div class="flex items-center p-4 bg-white rounded-lg shadow-xs dark:bg-gray-800">
<div class="p-3 mr-4 text-red-500 bg-red-100 rounded-full dark:text-red-100 dark:bg-red-500">
<div class="p-3 mr-4 text-teal-500 bg-teal-100 rounded-full dark:text-teal-100 dark:bg-teal-500">
<span x-html="$icon('x-circle', 'w-5 h-5')"></span>
</div>
<div>

11
app/templates/vendor/admin/customers.html vendored Normal file
View File

@@ -0,0 +1,11 @@
<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>

11
app/templates/vendor/admin/inventory.html vendored Normal file
View File

@@ -0,0 +1,11 @@
<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>

11
app/templates/vendor/admin/marketplace/browse.html vendored Normal file
View File

@@ -0,0 +1,11 @@
<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>

11
app/templates/vendor/admin/marketplace/config.html vendored Normal file
View File

@@ -0,0 +1,11 @@
<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>

11
app/templates/vendor/admin/marketplace/imports.html vendored Normal file
View File

@@ -0,0 +1,11 @@
<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>

11
app/templates/vendor/admin/marketplace/selected.html vendored Normal file
View File

@@ -0,0 +1,11 @@
<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 Normal file
View File

@@ -0,0 +1,11 @@
<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 Normal file
View File

@@ -0,0 +1,11 @@
<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 Normal file
View File

@@ -0,0 +1,11 @@
<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 Normal file
View File

@@ -0,0 +1,11 @@
<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 Normal file
View File

@@ -0,0 +1,11 @@
<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 Normal file
View File

@@ -0,0 +1,11 @@
<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 Normal file
View File

@@ -0,0 +1,11 @@
<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>

160
app/templates/vendor/dashboard.html vendored Normal file
View File

@@ -0,0 +1,160 @@
<!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>
<link rel="stylesheet" href="/static/css/shared/base.css">
<link rel="stylesheet" href="/static/css/admin/admin.css">
<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/js/vendor/dashboard.js"></script>
</body>
</html>

121
app/templates/vendor/login.html vendored Normal file
View File

@@ -0,0 +1,121 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Vendor Login - Multi-Tenant Ecommerce Platform</title>
<link rel="stylesheet" href="/static/css/shared/base.css">
<link rel="stylesheet" href="/static/css/shared/auth.css">
<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script>
</head>
<body>
<div class="auth-page" x-data="vendorLogin()" x-init="init()" x-cloak>
<div class="login-container">
<!-- Vendor Info -->
<template x-if="vendor">
<div class="vendor-info" style="margin-bottom: 24px;">
<h2 x-text="vendor.name" style="margin: 0; color: var(--primary-color);"></h2>
<p class="text-muted" style="margin: 4px 0 0 0; font-size: var(--font-sm);">
<strong x-text="vendor.vendor_code"></strong>
</p>
</div>
</template>
<div class="login-header">
<div class="auth-logo">🏪</div>
<h1>Vendor Portal</h1>
<p>Sign in to manage your store</p>
</div>
<!-- Alert Messages -->
<div x-show="error"
x-text="error"
class="alert alert-error"
x-transition></div>
<div x-show="success"
x-text="success"
class="alert alert-success"
x-transition></div>
<!-- Login Form (only show if vendor found) -->
<template x-if="vendor">
<form @submit.prevent="handleLogin">
<div class="form-group">
<label for="username">Username</label>
<input
type="text"
id="username"
x-model="credentials.username"
:class="{ 'error': errors.username }"
required
autocomplete="username"
placeholder="Enter your username"
:disabled="loading"
@input="clearErrors"
>
<div x-show="errors.username"
x-text="errors.username"
class="error-message show"
x-transition></div>
</div>
<div class="form-group">
<label for="password">Password</label>
<input
type="password"
id="password"
x-model="credentials.password"
:class="{ 'error': errors.password }"
required
autocomplete="current-password"
placeholder="Enter your password"
:disabled="loading"
@input="clearErrors"
>
<div x-show="errors.password"
x-text="errors.password"
class="error-message show"
x-transition></div>
</div>
<button type="submit"
class="btn-login"
:disabled="loading">
<template x-if="!loading">
<span>Sign In</span>
</template>
<template x-if="loading">
<span>
<span class="loading-spinner"></span>
Signing in...
</span>
</template>
</button>
</form>
</template>
<!-- Vendor Not Found -->
<template x-if="!vendor && !loading && checked">
<div class="empty-state">
<div class="empty-state-icon">🏪</div>
<h3>Vendor Not Found</h3>
<p>The vendor you're trying to access doesn't exist or is inactive.</p>
<a href="/admin/login.html" class="btn btn-primary" style="margin-top: 16px;">
Go to Admin Login
</a>
</div>
</template>
<!-- Loading State -->
<div x-show="loading && !vendor" class="loading">
<span class="loading-spinner loading-spinner-lg"></span>
<p class="loading-text">Loading vendor information...</p>
</div>
</div>
</div>
<script src="/static/shared/js/api-client.js"></script>
<script src="/static/js/vendor/login.js"></script>
</body>
</html>