Move 47 JS files from static/{admin,vendor,shared}/js/ to their
respective module directories app/modules/*/static/*/js/:
- Orders: orders.js, order-detail.js
- Catalog: products.js (renamed from vendor-products.js), product-*.js
- Inventory: inventory.js (admin & vendor)
- Customers: customers.js, users.js, user-*.js
- Billing: billing-history.js, subscriptions.js, subscription-tiers.js,
billing.js, invoices.js, feature-store.js, upgrade-prompts.js
- Messaging: messages.js, notifications.js, email-templates.js
- Marketplace: marketplace*.js, letzshop*.js, onboarding.js
- Monitoring: monitoring.js, background-tasks.js, imports.js, logs.js
- Dev Tools: testing-*.js, code-quality-*.js
Update 39 templates to reference new module static paths using
url_for('{module}_static', path='...') pattern.
Files staying in static/ (platform core):
- admin: dashboard, login, platforms, vendors, companies, admin-users,
settings, components, init-alpine, module-config
- vendor: dashboard, login, profile, settings, team, media, init-alpine
- shared: api-client, utils, money, icons, log-config, vendor-selector,
media-picker
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
175 lines
7.9 KiB
HTML
175 lines
7.9 KiB
HTML
{# app/templates/vendor/product-create.html #}
|
|
{% extends "vendor/base.html" %}
|
|
{% from 'shared/macros/headers.html' import detail_page_header %}
|
|
|
|
{% block title %}Create Product{% endblock %}
|
|
|
|
{% block alpine_data %}vendorProductCreate(){% endblock %}
|
|
|
|
{% block content %}
|
|
{% call detail_page_header("'Create Product'", backUrl) %}
|
|
<span>Add a new product to your catalog</span>
|
|
{% endcall %}
|
|
|
|
<!-- Create Form -->
|
|
<form @submit.prevent="createProduct()">
|
|
<!-- Basic Information -->
|
|
<div class="px-4 py-5 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">
|
|
Basic Information
|
|
</h3>
|
|
<div class="grid gap-4 md:grid-cols-2">
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700 dark:text-gray-400 mb-1">Title *</label>
|
|
<input
|
|
type="text"
|
|
x-model="form.title"
|
|
required
|
|
class="w-full px-3 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300"
|
|
placeholder="Product title"
|
|
/>
|
|
</div>
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700 dark:text-gray-400 mb-1">Brand</label>
|
|
<input
|
|
type="text"
|
|
x-model="form.brand"
|
|
class="w-full px-3 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300"
|
|
placeholder="Brand name"
|
|
/>
|
|
</div>
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700 dark:text-gray-400 mb-1">SKU</label>
|
|
<input
|
|
type="text"
|
|
x-model="form.vendor_sku"
|
|
class="w-full px-3 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300"
|
|
placeholder="SKU"
|
|
/>
|
|
</div>
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700 dark:text-gray-400 mb-1">GTIN/EAN</label>
|
|
<input
|
|
type="text"
|
|
x-model="form.gtin"
|
|
class="w-full px-3 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300"
|
|
placeholder="GTIN/EAN"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Pricing -->
|
|
<div class="px-4 py-5 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">
|
|
Pricing
|
|
</h3>
|
|
<div class="grid gap-4 md:grid-cols-3">
|
|
{# noqa: FE-008 - Using raw number input for price field #}
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700 dark:text-gray-400 mb-1">Price *</label>
|
|
<input
|
|
type="number"
|
|
step="0.01"
|
|
x-model="form.price"
|
|
required
|
|
class="w-full px-3 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300"
|
|
placeholder="0.00"
|
|
/>
|
|
</div>
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700 dark:text-gray-400 mb-1">Currency</label>
|
|
<select
|
|
x-model="form.currency"
|
|
class="w-full px-3 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300"
|
|
>
|
|
<option value="EUR">EUR</option>
|
|
<option value="USD">USD</option>
|
|
<option value="GBP">GBP</option>
|
|
</select>
|
|
</div>
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700 dark:text-gray-400 mb-1">Availability</label>
|
|
<select
|
|
x-model="form.availability"
|
|
class="w-full px-3 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300"
|
|
>
|
|
<option value="in_stock">In Stock</option>
|
|
<option value="out_of_stock">Out of Stock</option>
|
|
<option value="preorder">Preorder</option>
|
|
<option value="backorder">Backorder</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Status -->
|
|
<div class="px-4 py-5 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">
|
|
Status
|
|
</h3>
|
|
<div class="flex flex-wrap gap-6">
|
|
<label class="flex items-center">
|
|
<input
|
|
type="checkbox"
|
|
x-model="form.is_active"
|
|
class="w-4 h-4 text-purple-600 border-gray-300 rounded focus:ring-purple-500"
|
|
/>
|
|
<span class="ml-2 text-sm text-gray-700 dark:text-gray-300">Active</span>
|
|
</label>
|
|
<label class="flex items-center">
|
|
<input
|
|
type="checkbox"
|
|
x-model="form.is_featured"
|
|
class="w-4 h-4 text-purple-600 border-gray-300 rounded focus:ring-purple-500"
|
|
/>
|
|
<span class="ml-2 text-sm text-gray-700 dark:text-gray-300">Featured</span>
|
|
</label>
|
|
<label class="flex items-center">
|
|
<input
|
|
type="checkbox"
|
|
x-model="form.is_digital"
|
|
class="w-4 h-4 text-purple-600 border-gray-300 rounded focus:ring-purple-500"
|
|
/>
|
|
<span class="ml-2 text-sm text-gray-700 dark:text-gray-300">Digital Product</span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Description -->
|
|
<div class="px-4 py-5 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">
|
|
Description
|
|
</h3>
|
|
<textarea
|
|
x-model="form.description"
|
|
rows="6"
|
|
class="w-full px-3 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300"
|
|
placeholder="Product description"
|
|
></textarea>
|
|
</div>
|
|
|
|
<!-- Actions -->
|
|
<div class="flex items-center justify-between px-4 py-4 bg-white rounded-lg shadow-md dark:bg-gray-800">
|
|
<a
|
|
:href="backUrl"
|
|
class="px-4 py-2 text-sm font-medium text-gray-700 dark:text-gray-300 bg-white dark:bg-gray-700 border border-gray-300 dark:border-gray-600 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-600 transition-colors"
|
|
>
|
|
Cancel
|
|
</a>
|
|
<button
|
|
type="submit"
|
|
:disabled="saving || !form.title"
|
|
class="flex items-center px-4 py-2 text-sm font-medium text-white bg-purple-600 rounded-lg hover:bg-purple-700 transition-colors disabled:opacity-50"
|
|
>
|
|
<span x-show="saving" x-html="$icon('spinner', 'w-4 h-4 mr-2 animate-spin')"></span>
|
|
<span x-text="saving ? 'Creating...' : 'Create Product'"></span>
|
|
</button>
|
|
</div>
|
|
</form>
|
|
{% endblock %}
|
|
|
|
{% block extra_scripts %}
|
|
<script src="{{ url_for('catalog_static', path='vendor/js/product-create.js') }}"></script>
|
|
{% endblock %}
|