Database & Migrations: - Add application_logs table migration for hybrid cloud logging - Add companies table migration and restructure vendor relationships Logging System: - Implement hybrid logging system (database + file) - Add log_service for centralized log management - Create admin logs page with filtering and viewing capabilities - Add init_log_settings.py script for log configuration - Enhance core logging with database integration Marketplace Integration: - Add marketplace admin page with product management - Create marketplace vendor page with product listings - Implement marketplace.js for both admin and vendor interfaces - Add marketplace integration documentation Admin Enhancements: - Add imports management page and functionality - Create settings page for admin configuration - Add vendor themes management page - Enhance vendor detail and edit pages - Improve code quality dashboard and violation details - Add logs viewing and management - Update icons guide and shared icon system Architecture & Documentation: - Document frontend structure and component architecture - Document models structure and relationships - Add vendor-in-token architecture documentation - Add vendor RBAC (role-based access control) documentation - Document marketplace integration patterns - Update architecture patterns documentation Infrastructure: - Add platform static files structure (css, img, js) - Move architecture_scan.py to proper models location - Update model imports and registrations - Enhance exception handling - Update dependency injection patterns UI/UX: - Improve vendor edit interface - Update admin user interface - Enhance page templates documentation - Add vendor marketplace interface
100 lines
4.0 KiB
HTML
100 lines
4.0 KiB
HTML
{# app/templates/admin/vendor-themes.html #}
|
|
{% extends "admin/base.html" %}
|
|
|
|
{% block title %}Vendor Themes{% endblock %}
|
|
|
|
{% block alpine_data %}adminVendorThemes(){% endblock %}
|
|
|
|
{% block content %}
|
|
<!-- Page Header -->
|
|
<div class="flex items-center justify-between my-6">
|
|
<div>
|
|
<h2 class="text-2xl font-semibold text-gray-700 dark:text-gray-200">
|
|
Vendor Themes
|
|
</h2>
|
|
<p class="text-sm text-gray-600 dark:text-gray-400 mt-1">
|
|
Customize vendor theme colors and branding
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Vendor Selection -->
|
|
<div class="px-4 py-6 mb-6 bg-white rounded-lg shadow-md dark:bg-gray-800">
|
|
<h3 class="mb-4 text-lg font-semibold text-gray-700 dark:text-gray-200">
|
|
Select Vendor
|
|
</h3>
|
|
<p class="text-sm text-gray-600 dark:text-gray-400 mb-4">
|
|
Choose a vendor to customize their theme
|
|
</p>
|
|
|
|
<div class="max-w-md">
|
|
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
|
|
Vendor
|
|
</label>
|
|
<select
|
|
x-model="selectedVendorCode"
|
|
@change="navigateToTheme()"
|
|
class="block w-full px-3 py-2 text-gray-700 dark:text-gray-300 bg-white dark:bg-gray-700 border border-gray-300 dark:border-gray-600 rounded-lg focus:outline-none focus:ring-2 focus:ring-purple-600"
|
|
>
|
|
<option value="">Select a vendor...</option>
|
|
<template x-for="vendor in vendors" :key="vendor.vendor_code">
|
|
<option :value="vendor.vendor_code" x-text="`${vendor.name} (${vendor.vendor_code})`"></option>
|
|
</template>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Loading State -->
|
|
<div x-show="loading" class="text-center py-12">
|
|
<span x-html="$icon('spinner', 'inline w-8 h-8 text-purple-600')"></span>
|
|
<p class="mt-2 text-gray-600 dark:text-gray-400">Loading vendors...</p>
|
|
</div>
|
|
|
|
<!-- Error State -->
|
|
<div x-show="error && !loading" class="mb-6 p-4 bg-red-100 border border-red-400 text-red-700 rounded-lg flex items-start">
|
|
<span x-html="$icon('exclamation', 'w-5 h-5 mr-3 mt-0.5 flex-shrink-0')"></span>
|
|
<div>
|
|
<p class="font-semibold">Error loading vendors</p>
|
|
<p class="text-sm" x-text="error"></p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Vendors List -->
|
|
<div x-show="!loading && vendors.length > 0">
|
|
<div class="px-4 py-3 bg-white rounded-lg shadow-md dark:bg-gray-800">
|
|
<h3 class="mb-4 text-lg font-semibold text-gray-700 dark:text-gray-200">
|
|
All Vendors
|
|
</h3>
|
|
<div class="grid gap-4 md:grid-cols-2 lg:grid-cols-3">
|
|
<template x-for="vendor in vendors" :key="vendor.vendor_code">
|
|
<a
|
|
:href="`/admin/vendors/${vendor.vendor_code}/theme`"
|
|
class="block p-4 border border-gray-200 dark:border-gray-700 rounded-lg hover:border-purple-500 dark:hover:border-purple-500 hover:shadow-md transition-all"
|
|
>
|
|
<div class="flex items-center justify-between mb-2">
|
|
<h4 class="font-semibold text-gray-700 dark:text-gray-200" x-text="vendor.name"></h4>
|
|
<span x-html="$icon('color-swatch', 'w-5 h-5 text-purple-600')"></span>
|
|
</div>
|
|
<p class="text-sm text-gray-600 dark:text-gray-400" x-text="vendor.vendor_code"></p>
|
|
<div class="mt-3 flex items-center text-xs text-purple-600 dark:text-purple-400">
|
|
<span>Customize theme</span>
|
|
<span x-html="$icon('chevron-right', 'w-4 h-4 ml-1')"></span>
|
|
</div>
|
|
</a>
|
|
</template>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Empty State -->
|
|
<div x-show="!loading && vendors.length === 0" class="text-center py-12">
|
|
<span x-html="$icon('shopping-bag', 'inline w-12 h-12 text-gray-400 mb-4')"></span>
|
|
<p class="text-gray-600 dark:text-gray-400">No vendors found</p>
|
|
</div>
|
|
|
|
{% endblock %}
|
|
|
|
{% block extra_scripts %}
|
|
<script src="{{ url_for('static', path='admin/js/vendor-themes.js') }}"></script>
|
|
{% endblock %}
|