feat: comprehensive vendor settings overhaul with Company inheritance
- Add structured API response with business_info, localization, letzshop, invoice_settings, theme_settings, domains, and stripe_info sections - Add PUT /vendor/settings/business-info with reset_to_company capability - Add PUT /vendor/settings/letzshop with validation for tax rates, delivery - Add 9 settings sections: General, Business Info, Localization, Marketplace, Invoices, Branding, Domains, API & Payments, Notifications - Business Info shows "Inherited" badges and Reset buttons for company fields - Marketplace section includes Letzshop CSV URLs and feed options - Read-only sections for Invoices, Branding, Domains, API with contact support - Add globe-alt icon for Domains section - Document email templates architecture for future implementation 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
803
app/templates/vendor/settings.html
vendored
803
app/templates/vendor/settings.html
vendored
@@ -18,15 +18,15 @@
|
||||
|
||||
<!-- Settings Content -->
|
||||
<div x-show="!loading && !error" class="w-full mb-8">
|
||||
<div class="flex flex-col md:flex-row gap-6">
|
||||
<!-- Settings Navigation -->
|
||||
<div class="w-full md:w-64 flex-shrink-0">
|
||||
<div class="bg-white rounded-lg shadow-xs dark:bg-gray-800 p-2">
|
||||
<div class="flex flex-col lg:flex-row gap-6">
|
||||
<!-- Settings Navigation (Sidebar) -->
|
||||
<div class="w-full lg:w-56 flex-shrink-0">
|
||||
<div class="bg-white rounded-lg shadow-xs dark:bg-gray-800 p-2 lg:sticky lg:top-4">
|
||||
<template x-for="section in sections" :key="section.id">
|
||||
<button
|
||||
@click="setSection(section.id)"
|
||||
:class="{
|
||||
'w-full flex items-center px-4 py-3 text-sm font-medium rounded-lg transition-colors': true,
|
||||
'w-full flex items-center px-3 py-2.5 text-sm font-medium rounded-lg transition-colors': true,
|
||||
'text-purple-600 bg-purple-50 dark:bg-purple-900/20 dark:text-purple-400': activeSection === section.id,
|
||||
'text-gray-600 hover:bg-gray-50 dark:text-gray-400 dark:hover:bg-gray-700': activeSection !== section.id
|
||||
}"
|
||||
@@ -38,8 +38,8 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Settings Panels -->
|
||||
<div class="flex-1">
|
||||
<!-- Settings Panels (Main Content) -->
|
||||
<div class="flex-1 min-w-0">
|
||||
<!-- General Settings -->
|
||||
<div x-show="activeSection === 'general'" class="bg-white rounded-lg shadow-xs dark:bg-gray-800">
|
||||
<div class="p-4 border-b dark:border-gray-700">
|
||||
@@ -61,7 +61,7 @@
|
||||
class="flex-1 px-4 py-2 text-sm text-gray-500 bg-gray-100 border border-gray-200 rounded-l-lg dark:text-gray-400 dark:bg-gray-700 dark:border-gray-600"
|
||||
/>
|
||||
<span class="px-4 py-2 text-sm text-gray-500 bg-gray-50 border border-l-0 border-gray-200 rounded-r-lg dark:text-gray-400 dark:bg-gray-600 dark:border-gray-600">
|
||||
.yourplatform.com
|
||||
.letzshop.lu
|
||||
</span>
|
||||
</div>
|
||||
<p class="mt-1 text-xs text-gray-500 dark:text-gray-400">Contact support to change your subdomain</p>
|
||||
@@ -98,14 +98,386 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Business Info Settings -->
|
||||
<div x-show="activeSection === 'business'" class="bg-white rounded-lg shadow-xs dark:bg-gray-800">
|
||||
<div class="p-4 border-b dark:border-gray-700">
|
||||
<h3 class="text-lg font-semibold text-gray-800 dark:text-gray-200">Business Information</h3>
|
||||
<p class="text-sm text-gray-500 dark:text-gray-400">
|
||||
Store details and contact information
|
||||
<template x-if="companyName">
|
||||
<span class="text-purple-600 dark:text-purple-400"> (inheriting from <span x-text="companyName"></span>)</span>
|
||||
</template>
|
||||
</p>
|
||||
</div>
|
||||
<div class="p-4">
|
||||
<div class="space-y-6">
|
||||
<!-- Store Name -->
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
|
||||
Store Name
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
x-model="businessForm.name"
|
||||
@input="markBusinessChanged()"
|
||||
class="w-full px-4 py-2 text-sm text-gray-700 bg-white border border-gray-200 rounded-lg dark:text-gray-300 dark:bg-gray-800 dark:border-gray-600 focus:border-purple-400 focus:outline-none focus:ring-1 focus:ring-purple-400"
|
||||
placeholder="Your store name"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- Description -->
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
|
||||
Store Description
|
||||
</label>
|
||||
<textarea
|
||||
x-model="businessForm.description"
|
||||
@input="markBusinessChanged()"
|
||||
rows="3"
|
||||
class="w-full px-4 py-2 text-sm text-gray-700 bg-white border border-gray-200 rounded-lg dark:text-gray-300 dark:bg-gray-800 dark:border-gray-600 focus:border-purple-400 focus:outline-none focus:ring-1 focus:ring-purple-400"
|
||||
placeholder="Describe your store..."
|
||||
></textarea>
|
||||
</div>
|
||||
|
||||
<!-- Contact Email (inheritable) -->
|
||||
<div>
|
||||
<label class="flex items-center text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
|
||||
Contact Email
|
||||
<template x-if="isFieldInherited('contact_email')">
|
||||
<span class="ml-2 px-2 py-0.5 text-xs font-medium text-purple-600 bg-purple-100 rounded dark:bg-purple-900/30 dark:text-purple-400">
|
||||
Inherited
|
||||
</span>
|
||||
</template>
|
||||
</label>
|
||||
<div class="flex gap-2">
|
||||
<input
|
||||
type="email"
|
||||
x-model="businessForm.contact_email"
|
||||
@input="markBusinessChanged()"
|
||||
:placeholder="getEffectiveBusinessValue('contact_email') || 'contact@example.com'"
|
||||
class="flex-1 px-4 py-2 text-sm text-gray-700 bg-white border border-gray-200 rounded-lg dark:text-gray-300 dark:bg-gray-800 dark:border-gray-600 focus:border-purple-400 focus:outline-none focus:ring-1 focus:ring-purple-400"
|
||||
/>
|
||||
<template x-if="businessForm.contact_email">
|
||||
<button
|
||||
@click="resetToCompany('contact_email')"
|
||||
class="px-3 py-2 text-xs text-gray-600 bg-gray-100 rounded-lg hover:bg-gray-200 dark:text-gray-400 dark:bg-gray-700 dark:hover:bg-gray-600"
|
||||
title="Reset to company value"
|
||||
>
|
||||
Reset
|
||||
</button>
|
||||
</template>
|
||||
</div>
|
||||
<p class="mt-1 text-xs text-gray-500 dark:text-gray-400">
|
||||
Leave empty to use company default
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Contact Phone (inheritable) -->
|
||||
<div>
|
||||
<label class="flex items-center text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
|
||||
Contact Phone
|
||||
<template x-if="isFieldInherited('contact_phone')">
|
||||
<span class="ml-2 px-2 py-0.5 text-xs font-medium text-purple-600 bg-purple-100 rounded dark:bg-purple-900/30 dark:text-purple-400">
|
||||
Inherited
|
||||
</span>
|
||||
</template>
|
||||
</label>
|
||||
<div class="flex gap-2">
|
||||
<input
|
||||
type="tel"
|
||||
x-model="businessForm.contact_phone"
|
||||
@input="markBusinessChanged()"
|
||||
:placeholder="getEffectiveBusinessValue('contact_phone') || '+352 123 456'"
|
||||
class="flex-1 px-4 py-2 text-sm text-gray-700 bg-white border border-gray-200 rounded-lg dark:text-gray-300 dark:bg-gray-800 dark:border-gray-600 focus:border-purple-400 focus:outline-none focus:ring-1 focus:ring-purple-400"
|
||||
/>
|
||||
<template x-if="businessForm.contact_phone">
|
||||
<button
|
||||
@click="resetToCompany('contact_phone')"
|
||||
class="px-3 py-2 text-xs text-gray-600 bg-gray-100 rounded-lg hover:bg-gray-200 dark:text-gray-400 dark:bg-gray-700 dark:hover:bg-gray-600"
|
||||
title="Reset to company value"
|
||||
>
|
||||
Reset
|
||||
</button>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Website (inheritable) -->
|
||||
<div>
|
||||
<label class="flex items-center text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
|
||||
Website
|
||||
<template x-if="isFieldInherited('website')">
|
||||
<span class="ml-2 px-2 py-0.5 text-xs font-medium text-purple-600 bg-purple-100 rounded dark:bg-purple-900/30 dark:text-purple-400">
|
||||
Inherited
|
||||
</span>
|
||||
</template>
|
||||
</label>
|
||||
<div class="flex gap-2">
|
||||
<input
|
||||
type="url"
|
||||
x-model="businessForm.website"
|
||||
@input="markBusinessChanged()"
|
||||
:placeholder="getEffectiveBusinessValue('website') || 'https://'"
|
||||
class="flex-1 px-4 py-2 text-sm text-gray-700 bg-white border border-gray-200 rounded-lg dark:text-gray-300 dark:bg-gray-800 dark:border-gray-600 focus:border-purple-400 focus:outline-none focus:ring-1 focus:ring-purple-400"
|
||||
/>
|
||||
<template x-if="businessForm.website">
|
||||
<button
|
||||
@click="resetToCompany('website')"
|
||||
class="px-3 py-2 text-xs text-gray-600 bg-gray-100 rounded-lg hover:bg-gray-200 dark:text-gray-400 dark:bg-gray-700 dark:hover:bg-gray-600"
|
||||
title="Reset to company value"
|
||||
>
|
||||
Reset
|
||||
</button>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Business Address (inheritable) -->
|
||||
<div>
|
||||
<label class="flex items-center text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
|
||||
Business Address
|
||||
<template x-if="isFieldInherited('business_address')">
|
||||
<span class="ml-2 px-2 py-0.5 text-xs font-medium text-purple-600 bg-purple-100 rounded dark:bg-purple-900/30 dark:text-purple-400">
|
||||
Inherited
|
||||
</span>
|
||||
</template>
|
||||
</label>
|
||||
<div class="flex gap-2">
|
||||
<textarea
|
||||
x-model="businessForm.business_address"
|
||||
@input="markBusinessChanged()"
|
||||
rows="2"
|
||||
:placeholder="getEffectiveBusinessValue('business_address') || 'Street, City, Country'"
|
||||
class="flex-1 px-4 py-2 text-sm text-gray-700 bg-white border border-gray-200 rounded-lg dark:text-gray-300 dark:bg-gray-800 dark:border-gray-600 focus:border-purple-400 focus:outline-none focus:ring-1 focus:ring-purple-400"
|
||||
></textarea>
|
||||
<template x-if="businessForm.business_address">
|
||||
<button
|
||||
@click="resetToCompany('business_address')"
|
||||
class="px-3 py-2 text-xs text-gray-600 bg-gray-100 rounded-lg hover:bg-gray-200 dark:text-gray-400 dark:bg-gray-700 dark:hover:bg-gray-600"
|
||||
title="Reset to company value"
|
||||
>
|
||||
Reset
|
||||
</button>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Tax Number (inheritable) -->
|
||||
<div>
|
||||
<label class="flex items-center text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
|
||||
Tax / VAT Number
|
||||
<template x-if="isFieldInherited('tax_number')">
|
||||
<span class="ml-2 px-2 py-0.5 text-xs font-medium text-purple-600 bg-purple-100 rounded dark:bg-purple-900/30 dark:text-purple-400">
|
||||
Inherited
|
||||
</span>
|
||||
</template>
|
||||
</label>
|
||||
<div class="flex gap-2">
|
||||
<input
|
||||
type="text"
|
||||
x-model="businessForm.tax_number"
|
||||
@input="markBusinessChanged()"
|
||||
:placeholder="getEffectiveBusinessValue('tax_number') || 'LU12345678'"
|
||||
class="flex-1 px-4 py-2 text-sm text-gray-700 bg-white border border-gray-200 rounded-lg dark:text-gray-300 dark:bg-gray-800 dark:border-gray-600 focus:border-purple-400 focus:outline-none focus:ring-1 focus:ring-purple-400"
|
||||
/>
|
||||
<template x-if="businessForm.tax_number">
|
||||
<button
|
||||
@click="resetToCompany('tax_number')"
|
||||
class="px-3 py-2 text-xs text-gray-600 bg-gray-100 rounded-lg hover:bg-gray-200 dark:text-gray-400 dark:bg-gray-700 dark:hover:bg-gray-600"
|
||||
title="Reset to company value"
|
||||
>
|
||||
Reset
|
||||
</button>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Save Button -->
|
||||
<div class="flex justify-end pt-4 border-t dark:border-gray-600">
|
||||
<button
|
||||
@click="saveBusinessInfo()"
|
||||
:disabled="saving || !hasBusinessChanges"
|
||||
class="px-4 py-2 text-sm font-medium text-white bg-purple-600 rounded-lg hover:bg-purple-700 disabled:opacity-50"
|
||||
>
|
||||
<span x-show="!saving">Save Business Info</span>
|
||||
<span x-show="saving">Saving...</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Localization Settings -->
|
||||
<div x-show="activeSection === 'localization'" class="bg-white rounded-lg shadow-xs dark:bg-gray-800">
|
||||
<div class="p-4 border-b dark:border-gray-700">
|
||||
<h3 class="text-lg font-semibold text-gray-800 dark:text-gray-200">Localization</h3>
|
||||
<p class="text-sm text-gray-500 dark:text-gray-400">Configure language and regional settings</p>
|
||||
</div>
|
||||
<div class="p-4">
|
||||
<div class="space-y-6">
|
||||
<!-- Currency (Read-only) -->
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
|
||||
Currency
|
||||
</label>
|
||||
<div class="flex items-center gap-3">
|
||||
<input
|
||||
type="text"
|
||||
:value="settings?.localization?.platform_currency || 'EUR'"
|
||||
disabled
|
||||
class="w-32 px-4 py-2 text-sm text-gray-500 bg-gray-100 border border-gray-200 rounded-lg dark:text-gray-400 dark:bg-gray-700 dark:border-gray-600"
|
||||
/>
|
||||
<span class="text-sm text-gray-500 dark:text-gray-400">
|
||||
Platform-wide currency (contact admin to change)
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Storefront Locale -->
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
|
||||
Number & Currency Format
|
||||
</label>
|
||||
<select
|
||||
x-model="localizationForm.storefront_locale"
|
||||
@change="markLocalizationChanged()"
|
||||
class="w-full px-4 py-2 text-sm text-gray-700 bg-white border border-gray-200 rounded-lg dark:text-gray-300 dark:bg-gray-800 dark:border-gray-600 focus:border-purple-400 focus:outline-none focus:ring-1 focus:ring-purple-400"
|
||||
>
|
||||
<option value="">Use platform default (<span x-text="settings?.localization?.platform_default_locale"></span>)</option>
|
||||
<template x-for="locale in settings?.options?.supported_locales || []" :key="locale.code">
|
||||
<option :value="locale.code" x-text="`${locale.name} (${locale.example})`"></option>
|
||||
</template>
|
||||
</select>
|
||||
<p class="mt-1 text-xs text-gray-500 dark:text-gray-400">
|
||||
Controls how prices and numbers are displayed (e.g., "29,99 EUR" vs "EUR29.99")
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Dashboard Language -->
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
|
||||
Dashboard Language
|
||||
</label>
|
||||
<select
|
||||
x-model="localizationForm.dashboard_language"
|
||||
@change="markLocalizationChanged()"
|
||||
class="w-full px-4 py-2 text-sm text-gray-700 bg-white border border-gray-200 rounded-lg dark:text-gray-300 dark:bg-gray-800 dark:border-gray-600 focus:border-purple-400 focus:outline-none focus:ring-1 focus:ring-purple-400"
|
||||
>
|
||||
<template x-for="lang in settings?.options?.supported_languages || []" :key="lang.code">
|
||||
<option :value="lang.code" x-text="lang.name"></option>
|
||||
</template>
|
||||
</select>
|
||||
<p class="mt-1 text-xs text-gray-500 dark:text-gray-400">
|
||||
Language for the vendor dashboard interface
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Default Content Language -->
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
|
||||
Default Content Language
|
||||
</label>
|
||||
<select
|
||||
x-model="localizationForm.default_language"
|
||||
@change="markLocalizationChanged()"
|
||||
class="w-full px-4 py-2 text-sm text-gray-700 bg-white border border-gray-200 rounded-lg dark:text-gray-300 dark:bg-gray-800 dark:border-gray-600 focus:border-purple-400 focus:outline-none focus:ring-1 focus:ring-purple-400"
|
||||
>
|
||||
<template x-for="lang in settings?.options?.supported_languages || []" :key="lang.code">
|
||||
<option :value="lang.code" x-text="lang.name"></option>
|
||||
</template>
|
||||
</select>
|
||||
<p class="mt-1 text-xs text-gray-500 dark:text-gray-400">
|
||||
Primary language for products, emails, and other content
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Storefront Default Language -->
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
|
||||
Storefront Default Language
|
||||
</label>
|
||||
<select
|
||||
x-model="localizationForm.storefront_language"
|
||||
@change="markLocalizationChanged()"
|
||||
class="w-full px-4 py-2 text-sm text-gray-700 bg-white border border-gray-200 rounded-lg dark:text-gray-300 dark:bg-gray-800 dark:border-gray-600 focus:border-purple-400 focus:outline-none focus:ring-1 focus:ring-purple-400"
|
||||
>
|
||||
<template x-for="lang in settings?.options?.supported_languages || []" :key="lang.code">
|
||||
<option :value="lang.code" x-text="lang.name"></option>
|
||||
</template>
|
||||
</select>
|
||||
<p class="mt-1 text-xs text-gray-500 dark:text-gray-400">
|
||||
Default language shown to customers visiting your shop
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Enabled Storefront Languages -->
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
|
||||
Enabled Storefront Languages
|
||||
</label>
|
||||
<div class="flex flex-wrap gap-3">
|
||||
<template x-for="lang in settings?.options?.supported_languages || []" :key="lang.code">
|
||||
<label class="inline-flex items-center cursor-pointer">
|
||||
<input
|
||||
type="checkbox"
|
||||
:value="lang.code"
|
||||
:checked="localizationForm.storefront_languages?.includes(lang.code)"
|
||||
@change="toggleStorefrontLanguage(lang.code)"
|
||||
class="w-4 h-4 text-purple-600 bg-gray-100 border-gray-300 rounded focus:ring-purple-500 dark:focus:ring-purple-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"
|
||||
/>
|
||||
<span class="ml-2 text-sm text-gray-700 dark:text-gray-300" x-text="lang.name"></span>
|
||||
</label>
|
||||
</template>
|
||||
</div>
|
||||
<p class="mt-1 text-xs text-gray-500 dark:text-gray-400">
|
||||
Languages available in the storefront language selector
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Save Button -->
|
||||
<div class="flex justify-end pt-4 border-t dark:border-gray-600">
|
||||
<button
|
||||
@click="saveLocalizationSettings()"
|
||||
:disabled="saving || !hasLocalizationChanges"
|
||||
class="px-4 py-2 text-sm font-medium text-white bg-purple-600 rounded-lg hover:bg-purple-700 disabled:opacity-50"
|
||||
>
|
||||
<span x-show="!saving">Save Localization Settings</span>
|
||||
<span x-show="saving">Saving...</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Marketplace Settings -->
|
||||
<div x-show="activeSection === 'marketplace'" class="bg-white rounded-lg shadow-xs dark:bg-gray-800">
|
||||
<div class="p-4 border-b dark:border-gray-700">
|
||||
<h3 class="text-lg font-semibold text-gray-800 dark:text-gray-200">Marketplace Integration</h3>
|
||||
<p class="text-sm text-gray-500 dark:text-gray-400">Configure external marketplace feeds</p>
|
||||
<p class="text-sm text-gray-500 dark:text-gray-400">Configure Letzshop marketplace feed settings</p>
|
||||
</div>
|
||||
<div class="p-4">
|
||||
<div class="space-y-6">
|
||||
<!-- Letzshop Vendor Info (read-only) -->
|
||||
<template x-if="settings?.letzshop?.vendor_id">
|
||||
<div class="p-4 bg-green-50 dark:bg-green-900/20 rounded-lg border border-green-200 dark:border-green-800">
|
||||
<div class="flex items-center gap-2 mb-2">
|
||||
<span x-html="$icon('check-circle', 'w-5 h-5 text-green-600 dark:text-green-400')"></span>
|
||||
<span class="font-medium text-green-800 dark:text-green-300">Connected to Letzshop</span>
|
||||
</div>
|
||||
<p class="text-sm text-green-700 dark:text-green-400">
|
||||
Vendor ID: <span x-text="settings?.letzshop?.vendor_id"></span>
|
||||
<template x-if="settings?.letzshop?.vendor_slug">
|
||||
<span> (<span x-text="settings?.letzshop?.vendor_slug"></span>)</span>
|
||||
</template>
|
||||
</p>
|
||||
<template x-if="settings?.letzshop?.auto_sync_enabled">
|
||||
<p class="text-sm text-green-700 dark:text-green-400 mt-1">
|
||||
Auto-sync is enabled
|
||||
</p>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<!-- Letzshop CSV URLs -->
|
||||
<div class="p-4 bg-gray-50 dark:bg-gray-700 rounded-lg">
|
||||
<h4 class="font-medium text-gray-700 dark:text-gray-300 mb-4">Letzshop CSV Feed URLs</h4>
|
||||
@@ -122,7 +494,7 @@
|
||||
<input
|
||||
type="url"
|
||||
x-model="marketplaceForm.letzshop_csv_url_fr"
|
||||
@input="markChanged()"
|
||||
@input="markMarketplaceChanged()"
|
||||
class="flex-1 px-4 py-2 text-sm text-gray-700 bg-white border border-gray-200 rounded-lg dark:text-gray-300 dark:bg-gray-800 dark:border-gray-600 focus:border-purple-400 focus:outline-none focus:ring-1 focus:ring-purple-400"
|
||||
placeholder="https://..."
|
||||
/>
|
||||
@@ -145,7 +517,7 @@
|
||||
<input
|
||||
type="url"
|
||||
x-model="marketplaceForm.letzshop_csv_url_en"
|
||||
@input="markChanged()"
|
||||
@input="markMarketplaceChanged()"
|
||||
class="flex-1 px-4 py-2 text-sm text-gray-700 bg-white border border-gray-200 rounded-lg dark:text-gray-300 dark:bg-gray-800 dark:border-gray-600 focus:border-purple-400 focus:outline-none focus:ring-1 focus:ring-purple-400"
|
||||
placeholder="https://..."
|
||||
/>
|
||||
@@ -168,7 +540,7 @@
|
||||
<input
|
||||
type="url"
|
||||
x-model="marketplaceForm.letzshop_csv_url_de"
|
||||
@input="markChanged()"
|
||||
@input="markMarketplaceChanged()"
|
||||
class="flex-1 px-4 py-2 text-sm text-gray-700 bg-white border border-gray-200 rounded-lg dark:text-gray-300 dark:bg-gray-800 dark:border-gray-600 focus:border-purple-400 focus:outline-none focus:ring-1 focus:ring-purple-400"
|
||||
placeholder="https://..."
|
||||
/>
|
||||
@@ -181,17 +553,406 @@
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Save Button -->
|
||||
<div class="flex justify-end mt-4 pt-4 border-t dark:border-gray-600">
|
||||
<button
|
||||
@click="saveMarketplaceSettings()"
|
||||
:disabled="saving || !hasChanges"
|
||||
class="px-4 py-2 text-sm font-medium text-white bg-purple-600 rounded-lg hover:bg-purple-700 disabled:opacity-50"
|
||||
<!-- Letzshop Feed Options -->
|
||||
<div class="p-4 bg-gray-50 dark:bg-gray-700 rounded-lg">
|
||||
<h4 class="font-medium text-gray-700 dark:text-gray-300 mb-4">Feed Options</h4>
|
||||
|
||||
<!-- Default Tax Rate -->
|
||||
<div class="mb-4">
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
|
||||
Default VAT Rate
|
||||
</label>
|
||||
<select
|
||||
x-model="marketplaceForm.letzshop_default_tax_rate"
|
||||
@change="markMarketplaceChanged()"
|
||||
class="w-full px-4 py-2 text-sm text-gray-700 bg-white border border-gray-200 rounded-lg dark:text-gray-300 dark:bg-gray-800 dark:border-gray-600 focus:border-purple-400 focus:outline-none focus:ring-1 focus:ring-purple-400"
|
||||
>
|
||||
<span x-show="!saving">Save Marketplace Settings</span>
|
||||
<span x-show="saving">Saving...</span>
|
||||
</button>
|
||||
<option :value="null">Not set</option>
|
||||
<template x-for="rate in settings?.options?.tax_rates || []" :key="rate.value">
|
||||
<option :value="rate.value" x-text="rate.label"></option>
|
||||
</template>
|
||||
</select>
|
||||
<p class="mt-1 text-xs text-gray-500 dark:text-gray-400">
|
||||
Default VAT rate for products without explicit rate
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Delivery Method -->
|
||||
<div class="mb-4">
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
|
||||
Delivery Method
|
||||
</label>
|
||||
<select
|
||||
x-model="marketplaceForm.letzshop_delivery_method"
|
||||
@change="markMarketplaceChanged()"
|
||||
class="w-full px-4 py-2 text-sm text-gray-700 bg-white border border-gray-200 rounded-lg dark:text-gray-300 dark:bg-gray-800 dark:border-gray-600 focus:border-purple-400 focus:outline-none focus:ring-1 focus:ring-purple-400"
|
||||
>
|
||||
<option value="">Not set</option>
|
||||
<template x-for="method in settings?.options?.delivery_methods || []" :key="method.value">
|
||||
<option :value="method.value" x-text="method.label"></option>
|
||||
</template>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<!-- Boost Sort -->
|
||||
<div class="mb-4">
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
|
||||
Boost Sort Priority
|
||||
</label>
|
||||
<input
|
||||
type="number"
|
||||
step="0.1"
|
||||
min="0"
|
||||
max="10"
|
||||
x-model="marketplaceForm.letzshop_boost_sort"
|
||||
@input="markMarketplaceChanged()"
|
||||
class="w-full px-4 py-2 text-sm text-gray-700 bg-white border border-gray-200 rounded-lg dark:text-gray-300 dark:bg-gray-800 dark:border-gray-600 focus:border-purple-400 focus:outline-none focus:ring-1 focus:ring-purple-400"
|
||||
placeholder="0.0 - 10.0"
|
||||
/>
|
||||
<p class="mt-1 text-xs text-gray-500 dark:text-gray-400">
|
||||
Higher values boost product visibility (0.0 - 10.0)
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Preorder Days -->
|
||||
<div class="mb-4">
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
|
||||
Pre-order Lead Time (days)
|
||||
</label>
|
||||
<input
|
||||
type="number"
|
||||
min="0"
|
||||
x-model="marketplaceForm.letzshop_preorder_days"
|
||||
@input="markMarketplaceChanged()"
|
||||
class="w-full px-4 py-2 text-sm text-gray-700 bg-white border border-gray-200 rounded-lg dark:text-gray-300 dark:bg-gray-800 dark:border-gray-600 focus:border-purple-400 focus:outline-none focus:ring-1 focus:ring-purple-400"
|
||||
placeholder="0"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Save Button -->
|
||||
<div class="flex justify-end pt-4 border-t dark:border-gray-600">
|
||||
<button
|
||||
@click="saveMarketplaceSettings()"
|
||||
:disabled="saving || !hasMarketplaceChanges"
|
||||
class="px-4 py-2 text-sm font-medium text-white bg-purple-600 rounded-lg hover:bg-purple-700 disabled:opacity-50"
|
||||
>
|
||||
<span x-show="!saving">Save Marketplace Settings</span>
|
||||
<span x-show="saving">Saving...</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Invoice Settings -->
|
||||
<div x-show="activeSection === 'invoices'" class="bg-white rounded-lg shadow-xs dark:bg-gray-800">
|
||||
<div class="p-4 border-b dark:border-gray-700">
|
||||
<h3 class="text-lg font-semibold text-gray-800 dark:text-gray-200">Invoice Settings</h3>
|
||||
<p class="text-sm text-gray-500 dark:text-gray-400">Configure invoice generation and billing details</p>
|
||||
</div>
|
||||
<div class="p-4">
|
||||
<template x-if="settings?.invoice_settings">
|
||||
<div class="space-y-6">
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<!-- Company Name -->
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Company Name</label>
|
||||
<p class="text-sm text-gray-600 dark:text-gray-400" x-text="settings?.invoice_settings?.company_name || '-'"></p>
|
||||
</div>
|
||||
<!-- VAT Number -->
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">VAT Number</label>
|
||||
<p class="text-sm text-gray-600 dark:text-gray-400" x-text="settings?.invoice_settings?.vat_number || '-'"></p>
|
||||
</div>
|
||||
<!-- Address -->
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Address</label>
|
||||
<p class="text-sm text-gray-600 dark:text-gray-400">
|
||||
<span x-text="settings?.invoice_settings?.company_address || '-'"></span>
|
||||
<template x-if="settings?.invoice_settings?.company_postal_code || settings?.invoice_settings?.company_city">
|
||||
<br/><span x-text="`${settings?.invoice_settings?.company_postal_code || ''} ${settings?.invoice_settings?.company_city || ''}`"></span>
|
||||
</template>
|
||||
</p>
|
||||
</div>
|
||||
<!-- Invoice Prefix -->
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Invoice Prefix</label>
|
||||
<p class="text-sm text-gray-600 dark:text-gray-400" x-text="settings?.invoice_settings?.invoice_prefix || '-'"></p>
|
||||
</div>
|
||||
<!-- Default VAT Rate -->
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Default VAT Rate</label>
|
||||
<p class="text-sm text-gray-600 dark:text-gray-400" x-text="settings?.invoice_settings?.default_vat_rate ? settings.invoice_settings.default_vat_rate + '%' : '-'"></p>
|
||||
</div>
|
||||
<!-- Payment Terms -->
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Payment Terms</label>
|
||||
<p class="text-sm text-gray-600 dark:text-gray-400" x-text="settings?.invoice_settings?.payment_terms || '-'"></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Bank Details -->
|
||||
<div class="p-4 bg-gray-50 dark:bg-gray-700 rounded-lg">
|
||||
<h4 class="font-medium text-gray-700 dark:text-gray-300 mb-3">Bank Details</h4>
|
||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-600 dark:text-gray-400 mb-1">Bank</label>
|
||||
<p class="text-sm text-gray-800 dark:text-gray-200" x-text="settings?.invoice_settings?.bank_name || '-'"></p>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-600 dark:text-gray-400 mb-1">IBAN</label>
|
||||
<p class="text-sm text-gray-800 dark:text-gray-200" x-text="settings?.invoice_settings?.bank_iban || '-'"></p>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-600 dark:text-gray-400 mb-1">BIC</label>
|
||||
<p class="text-sm text-gray-800 dark:text-gray-200" x-text="settings?.invoice_settings?.bank_bic || '-'"></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p class="text-sm text-gray-500 dark:text-gray-400 italic">
|
||||
Contact support to update invoice settings.
|
||||
</p>
|
||||
</div>
|
||||
</template>
|
||||
<template x-if="!settings?.invoice_settings">
|
||||
<div class="text-center py-8">
|
||||
<span x-html="$icon('document-text', 'w-12 h-12 mx-auto text-gray-400 dark:text-gray-500')"></span>
|
||||
<p class="mt-2 text-gray-500 dark:text-gray-400">No invoice settings configured</p>
|
||||
<p class="text-sm text-gray-400 dark:text-gray-500">Contact support to set up invoicing.</p>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Branding Settings -->
|
||||
<div x-show="activeSection === 'branding'" class="bg-white rounded-lg shadow-xs dark:bg-gray-800">
|
||||
<div class="p-4 border-b dark:border-gray-700">
|
||||
<h3 class="text-lg font-semibold text-gray-800 dark:text-gray-200">Branding & Theme</h3>
|
||||
<p class="text-sm text-gray-500 dark:text-gray-400">Customize your storefront appearance</p>
|
||||
</div>
|
||||
<div class="p-4">
|
||||
<template x-if="settings?.theme_settings">
|
||||
<div class="space-y-6">
|
||||
<!-- Theme Name -->
|
||||
<div class="flex items-center justify-between p-4 bg-gray-50 dark:bg-gray-700 rounded-lg">
|
||||
<div>
|
||||
<p class="font-medium text-gray-700 dark:text-gray-300">Active Theme</p>
|
||||
<p class="text-sm text-gray-500 dark:text-gray-400" x-text="settings?.theme_settings?.theme_name || 'Default'"></p>
|
||||
</div>
|
||||
<span class="px-3 py-1 text-sm font-semibold text-green-700 bg-green-100 rounded-full dark:bg-green-700 dark:text-green-100">
|
||||
Active
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- Logos -->
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<template x-if="settings?.theme_settings?.logo_url">
|
||||
<div class="p-4 bg-gray-50 dark:bg-gray-700 rounded-lg">
|
||||
<p class="text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Logo</p>
|
||||
<img :src="settings?.theme_settings?.logo_url" alt="Logo" class="max-h-16 object-contain" />
|
||||
</div>
|
||||
</template>
|
||||
<template x-if="settings?.theme_settings?.favicon_url">
|
||||
<div class="p-4 bg-gray-50 dark:bg-gray-700 rounded-lg">
|
||||
<p class="text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Favicon</p>
|
||||
<img :src="settings?.theme_settings?.favicon_url" alt="Favicon" class="max-h-8 object-contain" />
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
<!-- Layout Style -->
|
||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Layout Style</label>
|
||||
<p class="text-sm text-gray-600 dark:text-gray-400" x-text="settings?.theme_settings?.layout_style || 'Default'"></p>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Header Style</label>
|
||||
<p class="text-sm text-gray-600 dark:text-gray-400" x-text="settings?.theme_settings?.header_style || 'Default'"></p>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Product Card Style</label>
|
||||
<p class="text-sm text-gray-600 dark:text-gray-400" x-text="settings?.theme_settings?.product_card_style || 'Default'"></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Social Links -->
|
||||
<template x-if="settings?.theme_settings?.social_links && Object.keys(settings.theme_settings.social_links).length > 0">
|
||||
<div class="p-4 bg-gray-50 dark:bg-gray-700 rounded-lg">
|
||||
<p class="text-sm font-medium text-gray-700 dark:text-gray-300 mb-3">Social Links</p>
|
||||
<div class="flex flex-wrap gap-3">
|
||||
<template x-for="(url, platform) in settings?.theme_settings?.social_links || {}" :key="platform">
|
||||
<a :href="url" target="_blank" class="px-3 py-1 text-sm bg-white dark:bg-gray-600 rounded border dark:border-gray-500 hover:bg-gray-100 dark:hover:bg-gray-500">
|
||||
<span x-text="platform"></span>
|
||||
</a>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<p class="text-sm text-gray-500 dark:text-gray-400 italic">
|
||||
Theme customization coming soon. Contact support for custom branding requests.
|
||||
</p>
|
||||
</div>
|
||||
</template>
|
||||
<template x-if="!settings?.theme_settings">
|
||||
<div class="text-center py-8">
|
||||
<span x-html="$icon('color-swatch', 'w-12 h-12 mx-auto text-gray-400 dark:text-gray-500')"></span>
|
||||
<p class="mt-2 text-gray-500 dark:text-gray-400">Using default theme</p>
|
||||
<p class="text-sm text-gray-400 dark:text-gray-500">Contact support for custom branding.</p>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Domains Settings -->
|
||||
<div x-show="activeSection === 'domains'" class="bg-white rounded-lg shadow-xs dark:bg-gray-800">
|
||||
<div class="p-4 border-b dark:border-gray-700">
|
||||
<h3 class="text-lg font-semibold text-gray-800 dark:text-gray-200">Domains</h3>
|
||||
<p class="text-sm text-gray-500 dark:text-gray-400">Manage your storefront domains</p>
|
||||
</div>
|
||||
<div class="p-4">
|
||||
<div class="space-y-4">
|
||||
<!-- Default Subdomain -->
|
||||
<div class="flex items-center justify-between p-4 bg-gray-50 dark:bg-gray-700 rounded-lg">
|
||||
<div>
|
||||
<p class="font-medium text-gray-700 dark:text-gray-300">Default Subdomain</p>
|
||||
<p class="text-sm text-purple-600 dark:text-purple-400" x-text="settings?.default_subdomain"></p>
|
||||
</div>
|
||||
<span class="px-3 py-1 text-sm font-semibold text-green-700 bg-green-100 rounded-full dark:bg-green-700 dark:text-green-100">
|
||||
Active
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- Custom Domains -->
|
||||
<template x-if="settings?.domains?.length > 0">
|
||||
<div class="space-y-3">
|
||||
<h4 class="font-medium text-gray-700 dark:text-gray-300">Custom Domains</h4>
|
||||
<template x-for="domain in settings?.domains" :key="domain.id">
|
||||
<div class="flex items-center justify-between p-4 bg-gray-50 dark:bg-gray-700 rounded-lg">
|
||||
<div>
|
||||
<p class="font-medium text-gray-700 dark:text-gray-300" x-text="domain.domain"></p>
|
||||
<div class="flex items-center gap-2 mt-1">
|
||||
<span
|
||||
:class="domain.is_verified
|
||||
? 'text-green-600 dark:text-green-400'
|
||||
: 'text-yellow-600 dark:text-yellow-400'"
|
||||
class="text-xs"
|
||||
x-text="domain.is_verified ? 'Verified' : 'Pending verification'"
|
||||
></span>
|
||||
<span class="text-gray-300 dark:text-gray-600">|</span>
|
||||
<span
|
||||
:class="domain.ssl_status === 'active'
|
||||
? 'text-green-600 dark:text-green-400'
|
||||
: 'text-yellow-600 dark:text-yellow-400'"
|
||||
class="text-xs"
|
||||
x-text="domain.ssl_status === 'active' ? 'SSL Active' : 'SSL ' + (domain.ssl_status || 'pending')"
|
||||
></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center gap-2">
|
||||
<template x-if="domain.is_primary">
|
||||
<span class="px-2 py-1 text-xs font-medium text-purple-600 bg-purple-100 rounded dark:bg-purple-900/30 dark:text-purple-400">
|
||||
Primary
|
||||
</span>
|
||||
</template>
|
||||
<span
|
||||
:class="domain.is_active
|
||||
? 'px-3 py-1 text-sm font-semibold text-green-700 bg-green-100 rounded-full dark:bg-green-700 dark:text-green-100'
|
||||
: 'px-3 py-1 text-sm font-semibold text-gray-700 bg-gray-200 rounded-full dark:bg-gray-600 dark:text-gray-100'"
|
||||
x-text="domain.is_active ? 'Active' : 'Inactive'"
|
||||
></span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<div class="mt-4 p-4 bg-blue-50 dark:bg-blue-900/20 rounded-lg border border-blue-200 dark:border-blue-800">
|
||||
<div class="flex items-start gap-2">
|
||||
<span x-html="$icon('information-circle', 'w-5 h-5 text-blue-600 dark:text-blue-400 flex-shrink-0 mt-0.5')"></span>
|
||||
<div>
|
||||
<p class="text-sm text-blue-800 dark:text-blue-300">
|
||||
Need a custom domain? Contact support to set up your own domain with SSL.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- API & Payments Settings -->
|
||||
<div x-show="activeSection === 'api'" class="bg-white rounded-lg shadow-xs dark:bg-gray-800">
|
||||
<div class="p-4 border-b dark:border-gray-700">
|
||||
<h3 class="text-lg font-semibold text-gray-800 dark:text-gray-200">API & Payments</h3>
|
||||
<p class="text-sm text-gray-500 dark:text-gray-400">Payment integrations and API access</p>
|
||||
</div>
|
||||
<div class="p-4">
|
||||
<div class="space-y-6">
|
||||
<!-- Stripe Integration -->
|
||||
<div class="p-4 bg-gray-50 dark:bg-gray-700 rounded-lg">
|
||||
<div class="flex items-center gap-3 mb-4">
|
||||
<div class="w-10 h-10 bg-purple-100 dark:bg-purple-900/30 rounded-lg flex items-center justify-center">
|
||||
<span x-html="$icon('credit-card', 'w-6 h-6 text-purple-600 dark:text-purple-400')"></span>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="font-medium text-gray-700 dark:text-gray-300">Stripe</h4>
|
||||
<p class="text-sm text-gray-500 dark:text-gray-400">Payment processing</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<template x-if="settings?.stripe_info?.has_stripe_customer">
|
||||
<div class="space-y-3">
|
||||
<div class="flex items-center gap-2">
|
||||
<span x-html="$icon('check-circle', 'w-5 h-5 text-green-600 dark:text-green-400')"></span>
|
||||
<span class="text-sm text-green-700 dark:text-green-300">Connected</span>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-xs font-medium text-gray-500 dark:text-gray-400 mb-1">Customer ID</label>
|
||||
<p class="text-sm font-mono text-gray-700 dark:text-gray-300" x-text="settings?.stripe_info?.customer_id_masked"></p>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template x-if="!settings?.stripe_info?.has_stripe_customer">
|
||||
<div class="flex items-center gap-2">
|
||||
<span x-html="$icon('x-circle', 'w-5 h-5 text-gray-400 dark:text-gray-500')"></span>
|
||||
<span class="text-sm text-gray-500 dark:text-gray-400">Not connected</span>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
<!-- Letzshop API (if credentials exist) -->
|
||||
<template x-if="settings?.letzshop?.has_credentials">
|
||||
<div class="p-4 bg-gray-50 dark:bg-gray-700 rounded-lg">
|
||||
<div class="flex items-center gap-3 mb-4">
|
||||
<div class="w-10 h-10 bg-orange-100 dark:bg-orange-900/30 rounded-lg flex items-center justify-center">
|
||||
<span x-html="$icon('shopping-cart', 'w-6 h-6 text-orange-600 dark:text-orange-400')"></span>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="font-medium text-gray-700 dark:text-gray-300">Letzshop API</h4>
|
||||
<p class="text-sm text-gray-500 dark:text-gray-400">Marketplace integration</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center gap-2">
|
||||
<span x-html="$icon('check-circle', 'w-5 h-5 text-green-600 dark:text-green-400')"></span>
|
||||
<span class="text-sm text-green-700 dark:text-green-300">Credentials configured</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<div class="mt-4 p-4 bg-blue-50 dark:bg-blue-900/20 rounded-lg border border-blue-200 dark:border-blue-800">
|
||||
<div class="flex items-start gap-2">
|
||||
<span x-html="$icon('information-circle', 'w-5 h-5 text-blue-600 dark:text-blue-400 flex-shrink-0 mt-0.5')"></span>
|
||||
<div>
|
||||
<p class="text-sm text-blue-800 dark:text-blue-300">
|
||||
API keys and payment credentials are managed securely. Contact support for changes.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user