Refactor template preview data handling in Footer, Header, and Section templates: Updated the viewData method in FooterTemplateForm, HeaderTemplateForm, and SectionTemplateForm schemas to use a closure for dynamic record ID retrieval. Enhanced the template-preview Blade component to accept the record ID, improving data handling and ensuring accurate template previews based on the current record context.

This commit is contained in:
Ümit Tunç
2025-11-03 03:15:31 -03:00
parent 49bff7f2a7
commit 9629652d0a
4 changed files with 59 additions and 17 deletions
@@ -43,10 +43,13 @@ class FooterTemplateForm
// Preview Component - placed after editor
View::make('components.template-preview')
->viewData([
->viewData(function ($record) {
return [
'type' => 'footer',
'fieldName' => 'html_content',
])
'recordId' => $record?->id,
];
})
->columnSpanFull(),
Toggle::make('is_active')
@@ -42,10 +42,13 @@ class HeaderTemplateForm
// Preview Component - placed after editor
View::make('components.template-preview')
->viewData([
->viewData(function ($record) {
return [
'type' => 'header',
'fieldName' => 'html_content',
])
'recordId' => $record?->id,
];
})
->columnSpanFull(),
Toggle::make('is_active')
@@ -42,10 +42,13 @@ class SectionTemplateForm
// Preview Component - placed after editor
View::make('components.template-preview')
->viewData([
->viewData(function ($record) {
return [
'type' => 'section',
'fieldName' => 'html_content',
])
'recordId' => $record?->id,
];
})
->columnSpanFull(),
Toggle::make('is_active')
@@ -2,9 +2,10 @@
$previewUrl = route('template.preview');
$type = $type ?? 'section';
$fieldName = $fieldName ?? 'html_content';
$recordId = $recordId ?? null;
@endphp
<div
x-data="templatePreview(@js($previewUrl), @js($type), @js($fieldName))"
x-data="templatePreview(@js($previewUrl), @js($type), @js($fieldName), @js($recordId))"
class="template-preview-wrapper w-full"
style="width: 100%;"
wire:ignore.self>
@@ -68,20 +69,52 @@
@push('scripts')
<script>
function templatePreview(previewUrl, type, fieldName) {
function templatePreview(previewUrl, type, fieldName, recordIdFromView = null) {
return {
previewUrl: previewUrl,
type: type,
fieldName: fieldName,
iframeSrc: '',
isLoading: false,
recordId: null,
recordId: recordIdFromView,
init() {
// URL'den ID'yi al
const urlMatch = window.location.pathname.match(/\/(\d+)\/(edit|view)$/);
// Önce viewData'dan gelen ID'yi kullan
if (this.recordId) {
return;
}
// Yoksa URL'den ID'yi al (çeşitli formatları dene)
let urlMatch = window.location.pathname.match(/\/(\d+)\/(edit|view)$/);
if (urlMatch && urlMatch[1]) {
this.recordId = urlMatch[1];
return;
}
// Alternatif format: /admin/resource/{id}/edit
urlMatch = window.location.pathname.match(/\/(\d+)\/edit$/);
if (urlMatch && urlMatch[1]) {
this.recordId = urlMatch[1];
return;
}
// Alternatif format: /admin/resource/{id}
urlMatch = window.location.pathname.match(/\/(\d+)$/);
if (urlMatch && urlMatch[1]) {
this.recordId = urlMatch[1];
return;
}
// Filament Livewire component'inden ID almayı dene
try {
const livewireComponent = window.Livewire?.find(
document.querySelector('[wire\\:id]')?.getAttribute('wire:id')
);
if (livewireComponent?.mounted?.id) {
this.recordId = livewireComponent.mounted.id;
}
} catch (e) {
console.log('[Preview] Could not get ID from Livewire');
}
},