Samir Boulahtit
b7bf505a61
Major improvements to shop URL routing and vendor landing page system:
## Landing Page System
- Add template field to ContentPage model for flexible landing page designs
- Create 4 landing page templates: default, minimal, modern, and full
- Implement smart root handler to serve landing pages or redirect to shop
- Add create_landing_page.py script for easy landing page management
- Support both domain/subdomain and path-based vendor access
- Add comprehensive landing page documentation
## Route Fixes
- Fix duplicate /shop prefix in shop_pages.py routes
- Correct product detail page routing (was /shop/shop/products/{id})
- Update all shop routes to work with router prefix mounting
- Remove unused public vendor endpoints (/api/v1/public/vendors)
## Template Link Corrections
- Fix all shop template links to include /shop/ prefix
- Update breadcrumb 'Home' links to point to vendor root (landing page)
- Update header navigation 'Home' link to point to vendor root
- Correct CMS page links in footer navigation
- Fix account, cart, and error page navigation links
## Navigation Architecture
- Establish two-tier navigation: landing page (/) and shop (/shop/)
- Document complete navigation flow and URL hierarchy
- Support for vendors with or without landing pages (auto-redirect fallback)
- Consistent breadcrumb and header navigation behavior
## Documentation
- Add vendor-landing-pages.md feature documentation
- Add navigation-flow.md with complete URL hierarchy
- Update shop architecture docs with error handling section
- Add orphaned docs to mkdocs.yml navigation
- Document multi-access routing patterns
## Database
- Migration f68d8da5315a: add template field to content_pages table
- Support template values: default, minimal, modern, full
This establishes a complete landing page system allowing vendors to have
custom marketing homepages separate from their e-commerce shop, with
flexible template options and proper navigation hierarchy.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
249 lines
8.9 KiB
HTML
249 lines
8.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title><!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Login - {{ vendor.name }}</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 class="auth-page">
|
|
<div class="login-container"
|
|
x-data="customerLogin()"
|
|
x-init="checkRegistrationSuccess()"
|
|
data-vendor-id="{{ vendor.id }}"
|
|
data-vendor-name="{{ vendor.name }}"
|
|
>
|
|
<!-- Header -->
|
|
<div class="login-header">
|
|
{% if vendor.logo_url %}
|
|
<img src="{{ vendor.logo_url }}" alt="{{ vendor.name }}" class="auth-logo">
|
|
{% else %}
|
|
<div class="auth-logo">🛒</div>
|
|
{% endif %}
|
|
<h1>Welcome Back</h1>
|
|
<p>Sign in to {{ vendor.name }}</p>
|
|
</div>
|
|
|
|
<!-- Alert Box -->
|
|
<div x-show="alert.show"
|
|
x-transition
|
|
:class="'alert alert-' + alert.type"
|
|
x-text="alert.message"
|
|
></div>
|
|
|
|
<!-- Login Form -->
|
|
<form @submit.prevent="handleLogin">
|
|
<!-- Email -->
|
|
<div class="form-group">
|
|
<label for="email">Email Address</label>
|
|
<input
|
|
type="email"
|
|
id="email"
|
|
x-model="credentials.email"
|
|
required
|
|
placeholder="your@email.com"
|
|
:class="{ 'error': errors.email }"
|
|
@input="clearAllErrors()"
|
|
>
|
|
<div x-show="errors.email"
|
|
x-text="errors.email"
|
|
class="error-message show"
|
|
></div>
|
|
</div>
|
|
|
|
<!-- Password -->
|
|
<div class="form-group">
|
|
<label for="password">Password</label>
|
|
<div class="password-group">
|
|
<input
|
|
:type="showPassword ? 'text' : 'password'"
|
|
id="password"
|
|
x-model="credentials.password"
|
|
required
|
|
placeholder="Enter your password"
|
|
:class="{ 'error': errors.password }"
|
|
@input="clearAllErrors()"
|
|
>
|
|
<button
|
|
type="button"
|
|
class="password-toggle"
|
|
@click="showPassword = !showPassword"
|
|
>
|
|
<span x-text="showPassword ? '👁️' : '👁️🗨️'"></span>
|
|
</button>
|
|
</div>
|
|
<div x-show="errors.password"
|
|
x-text="errors.password"
|
|
class="error-message show"
|
|
></div>
|
|
</div>
|
|
|
|
<!-- Remember Me & Forgot Password -->
|
|
<div class="form-options">
|
|
<div class="remember-me">
|
|
<input
|
|
type="checkbox"
|
|
id="rememberMe"
|
|
x-model="rememberMe"
|
|
>
|
|
<label for="rememberMe">Remember me</label>
|
|
</div>
|
|
<a href="{{ base_url }}shop/account/forgot-password" class="forgot-password">
|
|
Forgot password?
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Submit Button -->
|
|
<button
|
|
type="submit"
|
|
class="btn-login"
|
|
:disabled="loading"
|
|
>
|
|
<span x-show="loading" class="loading-spinner"></span>
|
|
<span x-text="loading ? 'Signing in...' : 'Sign In'"></span>
|
|
</button>
|
|
</form>
|
|
|
|
<!-- Register Link -->
|
|
<div class="login-footer">
|
|
<div class="auth-footer-text">Don't have an account?</div>
|
|
<a href="{{ base_url }}shop/account/register">Create an account</a>
|
|
</div>
|
|
|
|
<!-- Back to Shop -->
|
|
<div class="login-footer" style="border-top: none; padding-top: 0;">
|
|
<a href="{{ base_url }}shop/">← Continue shopping</a>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
function customerLogin() {
|
|
return {
|
|
// Data
|
|
credentials: {
|
|
email: '',
|
|
password: ''
|
|
},
|
|
rememberMe: false,
|
|
showPassword: false,
|
|
loading: false,
|
|
errors: {},
|
|
alert: {
|
|
show: false,
|
|
type: 'error',
|
|
message: ''
|
|
},
|
|
|
|
// Get vendor data
|
|
get vendorId() {
|
|
return this.$el.dataset.vendorId;
|
|
},
|
|
|
|
get vendorName() {
|
|
return this.$el.dataset.vendorName;
|
|
},
|
|
|
|
// Check if redirected after registration
|
|
checkRegistrationSuccess() {
|
|
const urlParams = new URLSearchParams(window.location.search);
|
|
if (urlParams.get('registered') === 'true') {
|
|
this.showAlert(
|
|
'Account created successfully! Please sign in.',
|
|
'success'
|
|
);
|
|
}
|
|
},
|
|
|
|
// Clear errors
|
|
clearAllErrors() {
|
|
this.errors = {};
|
|
this.alert.show = false;
|
|
},
|
|
|
|
// Show alert
|
|
showAlert(message, type = 'error') {
|
|
this.alert = {
|
|
show: true,
|
|
type: type,
|
|
message: message
|
|
};
|
|
|
|
window.scrollTo({ top: 0, behavior: 'smooth' });
|
|
},
|
|
|
|
// Handle login
|
|
async handleLogin() {
|
|
this.clearAllErrors();
|
|
|
|
// Basic validation
|
|
if (!this.credentials.email) {
|
|
this.errors.email = 'Email is required';
|
|
return;
|
|
}
|
|
|
|
if (!this.credentials.password) {
|
|
this.errors.password = 'Password is required';
|
|
return;
|
|
}
|
|
|
|
this.loading = true;
|
|
|
|
try {
|
|
const response = await fetch(
|
|
`/api/v1/shop/auth/login`,
|
|
{
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json'
|
|
},
|
|
body: JSON.stringify({
|
|
email_or_username: this.credentials.email,
|
|
password: this.credentials.password
|
|
})
|
|
}
|
|
);
|
|
|
|
const data = await response.json();
|
|
|
|
if (!response.ok) {
|
|
throw new Error(data.detail || 'Login failed');
|
|
}
|
|
|
|
// Store token and user data
|
|
localStorage.setItem('customer_token', data.access_token);
|
|
localStorage.setItem('customer_user', JSON.stringify(data.user));
|
|
|
|
// Store vendor context
|
|
localStorage.setItem('customer_vendor_id', this.vendorId);
|
|
|
|
this.showAlert('Login successful! Redirecting...', 'success');
|
|
|
|
// Redirect to account page or cart
|
|
setTimeout(() => {
|
|
const returnUrl = new URLSearchParams(window.location.search).get('return') || '/shop/account';
|
|
window.location.href = returnUrl;
|
|
}, 1000);
|
|
|
|
} catch (error) {
|
|
console.error('Login error:', error);
|
|
this.showAlert(error.message || 'Invalid email or password');
|
|
} finally {
|
|
this.loading = false;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
</body>
|
|
</html></title>
|
|
</head>
|
|
<body>
|
|
|
|
</body>
|
|
</html> |