I added the features for users to use promotion code and for promoters to create on their events. May be rewrite to discount code?
176 lines
8.3 KiB
Plaintext
176 lines
8.3 KiB
Plaintext
<% content_for(:title, "Codes de réduction - #{@event.name}") %>
|
|
|
|
<div class="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
|
|
|
|
<!-- Breadcrumb -->
|
|
<%= render 'components/breadcrumb', crumbs: [
|
|
{ name: 'Accueil', path: root_path },
|
|
{ name: 'Tableau de bord', path: dashboard_path },
|
|
{ name: 'Mes événements', path: promoter_events_path },
|
|
{ name: @event.name, path: promoter_event_path(@event) },
|
|
{ name: 'Codes de réduction' }
|
|
] %>
|
|
|
|
<div class="mb-8">
|
|
<div class="flex items-center space-x-4 mb-4">
|
|
<%= link_to promoter_event_path(@event), class: "text-gray-400 hover:text-gray-600 transition-colors" do %>
|
|
<i data-lucide="arrow-left" class="w-5 h-5"></i>
|
|
<% end %>
|
|
<div class="flex-1">
|
|
<h1 class="text-3xl font-bold text-gray-900 mb-2">Codes de réduction</h1>
|
|
<p class="text-gray-600">
|
|
<%= link_to @event.name, promoter_event_path(@event), class: "text-purple-600 hover:text-purple-800" %>
|
|
</p>
|
|
</div>
|
|
<%= link_to new_promoter_event_promotion_code_path(@event), class: "inline-flex items-center px-6 py-3 bg-gray-900 text-white font-medium rounded-lg hover:bg-gray-800 transition-colors duration-200" do %>
|
|
<i data-lucide="plus" class="w-4 h-4 mr-2"></i>
|
|
Nouveau code
|
|
<% end %>
|
|
</div>
|
|
|
|
<!-- Event status info -->
|
|
<% if @event.draft? %>
|
|
<div class="bg-gray-50 border border-gray-200 rounded-2xl p-4 mb-6">
|
|
<div class="flex items-center">
|
|
<i data-lucide="info" class="w-5 h-5 text-gray-400 mr-3"></i>
|
|
<p class="text-sm text-gray-600">
|
|
Cet événement est en brouillon. Les codes de réduction ne seront actifs qu'une fois l'événement publié.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
|
|
<% if @promotion_codes.any? %>
|
|
<div class="grid gap-6">
|
|
<% @promotion_codes.each do |promotion_code| %>
|
|
<div class="bg-white rounded-2xl border border-gray-200 p-6 hover:shadow-md transition-shadow duration-200">
|
|
<div class="flex items-start justify-between">
|
|
<!-- Promotion code info -->
|
|
<div class="flex-1">
|
|
<div class="flex items-start justify-between mb-4">
|
|
<div>
|
|
<h3 class="text-xl font-semibold text-gray-900 mb-2">
|
|
<%= promotion_code.code %>
|
|
</h3>
|
|
<p class="text-gray-600 mb-3">Réduction de <%= number_to_currency(promotion_code.discount_amount_cents / 100.0, unit: "€") %></p>
|
|
</div>
|
|
|
|
<!-- Status badge -->
|
|
<div class="ml-4">
|
|
<% if promotion_code.active? && (promotion_code.expires_at.nil? || promotion_code.expires_at > Time.current) %>
|
|
<span class="inline-flex px-3 py-1 text-sm font-semibold rounded-full bg-green-100 text-green-800">
|
|
<i data-lucide="check-circle" class="w-4 h-4 mr-1"></i>
|
|
Actif
|
|
</span>
|
|
<% elsif promotion_code.expires_at && promotion_code.expires_at <= Time.current %>
|
|
<span class="inline-flex px-3 py-1 text-sm font-semibold rounded-full bg-red-100 text-red-800">
|
|
<i data-lucide="x-circle" class="w-4 h-4 mr-1"></i>
|
|
Expiré
|
|
</span>
|
|
<% else %>
|
|
<span class="inline-flex px-3 py-1 text-sm font-semibold rounded-full bg-gray-100 text-gray-800">
|
|
<i data-lucide="pause-circle" class="w-4 h-4 mr-1"></i>
|
|
Inactif
|
|
</span>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Promotion code details grid -->
|
|
<div class="grid grid-cols-2 md:grid-cols-4 gap-4 mb-4">
|
|
<div class="text-center p-3 bg-gray-50 rounded-lg">
|
|
<div class="text-2xl font-bold text-green-600">
|
|
<%= number_to_currency(promotion_code.discount_amount_cents / 100.0, unit: "€") %>
|
|
</div>
|
|
<div class="text-sm text-gray-500">Réduction</div>
|
|
</div>
|
|
|
|
<div class="text-center p-3 bg-gray-50 rounded-lg">
|
|
<div class="text-2xl font-bold text-gray-900">
|
|
<% if promotion_code.usage_limit %>
|
|
<%= promotion_code.usage_limit - promotion_code.uses_count %>
|
|
<% else %>
|
|
∞
|
|
<% end %>
|
|
</div>
|
|
<div class="text-sm text-gray-500">Restants</div>
|
|
</div>
|
|
|
|
<div class="text-center p-3 bg-gray-50 rounded-lg">
|
|
<div class="text-2xl font-bold text-gray-900">
|
|
<%= promotion_code.uses_count %>
|
|
</div>
|
|
<div class="text-sm text-gray-500">Utilisés</div>
|
|
</div>
|
|
|
|
<div class="text-center p-3 bg-gray-50 rounded-lg">
|
|
<div class="text-2xl font-bold text-blue-600">
|
|
<%= promotion_code.orders.count %>
|
|
</div>
|
|
<div class="text-sm text-gray-500">Commandes</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Additional info -->
|
|
<div class="flex flex-wrap items-center gap-4 text-sm text-gray-500 mb-4">
|
|
<% if promotion_code.expires_at %>
|
|
<span class="flex items-center">
|
|
<i data-lucide="clock" class="w-4 h-4 mr-1"></i>
|
|
Expire le : <%= l(promotion_code.expires_at, format: :short) %>
|
|
</span>
|
|
<% else %>
|
|
<span class="flex items-center">
|
|
<i data-lucide="infinity" class="w-4 h-4 mr-1"></i>
|
|
Pas d'expiration
|
|
</span>
|
|
<% end %>
|
|
<span class="flex items-center">
|
|
<i data-lucide="user" class="w-4 h-4 mr-1"></i>
|
|
<% if promotion_code.user.first_name && promotion_code.user.last_name %>
|
|
Créé par : <%= promotion_code.user.first_name %> <%= promotion_code.user.last_name %>
|
|
<% else %>
|
|
Créé par : <%= promotion_code.user.email %>
|
|
<% end %>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Actions -->
|
|
<div class="flex items-center justify-between pt-4 border-t border-gray-200">
|
|
<div class="flex items-center space-x-3">
|
|
<%= link_to edit_promoter_event_promotion_code_path(@event, promotion_code), class: "text-gray-400 hover:text-blue-600 transition-colors", title: "Modifier" do %>
|
|
<i data-lucide="edit" class="w-5 h-5"></i>
|
|
<% end %>
|
|
<% if promotion_code.orders.empty? %>
|
|
<%= button_to promoter_event_promotion_code_path(@event, promotion_code), method: :delete,
|
|
data: { confirm: "Êtes-vous sûr de vouloir supprimer ce code de réduction ?" },
|
|
class: "text-gray-400 hover:text-red-600 transition-colors", title: "Supprimer" do %>
|
|
<i data-lucide="trash-2" class="w-5 h-5"></i>
|
|
<% end %>
|
|
<% end %>
|
|
</div>
|
|
|
|
<div class="text-sm text-gray-500">
|
|
Créé il y a <%= time_ago_in_words(promotion_code.created_at) %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
<% else %>
|
|
<div class="bg-white rounded-2xl border-2 border-dashed border-gray-300 p-12 text-center">
|
|
<div class="mx-auto h-24 w-24 rounded-full bg-gray-100 flex items-center justify-center mb-6">
|
|
<i data-lucide="tag" class="w-12 h-12 text-gray-400"></i>
|
|
</div>
|
|
<h3 class="text-xl font-semibold text-gray-900 mb-2">Aucun code de réduction</h3>
|
|
<p class="text-gray-500 mb-6">Créez des codes de réduction pour offrir des remises spéciales à vos clients.</p>
|
|
<%= link_to new_promoter_event_promotion_code_path(@event), class: "inline-flex items-center px-6 py-3 bg-gray-900 text-white font-medium rounded-lg hover:bg-gray-800 transition-colors duration-200" do %>
|
|
<i data-lucide="plus" class="w-4 h-4 mr-2"></i>
|
|
Créer mon premier code de réduction
|
|
<% end %>
|
|
</div>
|
|
<% end %>
|
|
</div>
|