迁移节日活动后台事件

This commit is contained in:
2026-04-25 13:29:22 +08:00
parent a62e7ff41f
commit 90d2fcc14a
3 changed files with 135 additions and 81 deletions
@@ -178,7 +178,7 @@
</div>
<button type="button"
onclick="toggleHoliday({{ $event->id }}, this)"
data-holiday-event-toggle-url="{{ route('admin.holiday-events.toggle', $event) }}"
class="inline-flex items-center gap-2 rounded-lg px-3 py-2 text-xs font-bold transition {{ $event->enabled ? 'bg-emerald-500 text-white hover:bg-emerald-600' : 'bg-slate-200 text-slate-600 hover:bg-slate-300' }}"
data-enabled="{{ $event->enabled ? '1' : '0' }}">
<span data-role="toggle-dot"
@@ -200,7 +200,7 @@
<div class="flex flex-wrap justify-end gap-2">
@if ($event->status === 'pending')
<form action="{{ route('admin.holiday-events.trigger-now', $event) }}"
method="POST" onsubmit="return confirm('确定立即触发此活动吗?')">
method="POST" data-holiday-event-confirm="确定立即触发此活动吗?">
@csrf
<button type="submit"
class="inline-flex items-center justify-center rounded-lg bg-amber-500 px-3 py-2 text-xs font-bold text-white transition hover:bg-amber-600">
@@ -215,7 +215,7 @@
</a>
<form action="{{ route('admin.holiday-events.destroy', $event) }}" method="POST"
onsubmit="return confirm('确定删除此活动吗?')">
data-holiday-event-confirm="确定删除此活动吗?">
@csrf
@method('DELETE')
<button type="submit"
@@ -245,82 +245,4 @@
@endif
</div>
</div>
<script>
/**
* 根据启用状态返回开关按钮类名。
*/
function holidayToggleButtonClasses(enabled) {
return enabled ?
'inline-flex items-center gap-2 rounded-lg px-3 py-2 text-xs font-bold transition bg-emerald-500 text-white hover:bg-emerald-600' :
'inline-flex items-center gap-2 rounded-lg px-3 py-2 text-xs font-bold transition bg-slate-200 text-slate-600 hover:bg-slate-300';
}
/**
* 根据启用状态返回开关文案。
*/
function holidayToggleButtonLabel(enabled) {
return enabled ? '切换为停用' : '重新启用模板';
}
/**
* 根据启用状态返回状态徽标类名。
*/
function holidayEnabledBadgeClasses(enabled) {
return enabled ? 'inline-flex rounded-full px-2.5 py-1 text-xs font-bold bg-emerald-100 text-emerald-700' :
'inline-flex rounded-full px-2.5 py-1 text-xs font-bold bg-slate-100 text-slate-500';
}
/**
* 根据启用状态返回状态徽标文案。
*/
function holidayEnabledBadgeLabel(enabled) {
return enabled ? '已启用' : '已停用';
}
/**
* 切换节日活动启用/禁用状态,并同步刷新当前行文案与样式。
*/
function toggleHoliday(id, btn) {
fetch(`/admin/holiday-events/${id}/toggle`, {
method: 'POST',
headers: {
'X-CSRF-TOKEN': '{{ csrf_token() }}',
'Accept': 'application/json',
},
})
.then(r => r.json())
.then(data => {
if (!data.ok) {
return;
}
const enabled = Boolean(data.enabled);
const row = btn.closest('tr');
const dot = btn.querySelector('[data-role="toggle-dot"]');
const label = btn.querySelector('[data-role="toggle-label"]');
const enabledBadge = row?.querySelector('[data-role="enabled-badge"]');
btn.dataset.enabled = enabled ? '1' : '0';
btn.className = holidayToggleButtonClasses(enabled);
if (dot) {
dot.className = enabled ? 'h-2 w-2 rounded-full bg-white' : 'h-2 w-2 rounded-full bg-slate-500';
}
if (label) {
label.textContent = holidayToggleButtonLabel(enabled);
}
if (enabledBadge) {
enabledBadge.className = holidayEnabledBadgeClasses(enabled);
enabledBadge.textContent = holidayEnabledBadgeLabel(enabled);
}
if (row) {
row.classList.toggle('opacity-60', !enabled);
}
});
}
</script>
@endsection