feat: certificate template management and generation (Fasa 7)

- CertificateService: Intervention Image v3 text overlay on template
- GenerateCertificateJob: queued generation with retry logic
- SendCertificateEmailJob: stub (implemented in Fasa 8)
- CertificateTemplateController: upload, config editor, preview, test generate
- Admin/CertificateController: list, generate-all, email-all
- Public/CertificateController: show with questionnaire gate, download
- DejaVuSans fonts bundled under resources/fonts
- Views: admin template/certificate management, public certificate download

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

app/Http/Controllers/Admin/CertificateController.php

@@ -3,9 +3,104 @@
 namespace App\Http\Controllers\Admin;
 
 use App\Http\Controllers\Controller;
+use App\Jobs\GenerateCertificateJob;
+use App\Models\Certificate;
+use App\Models\Program;
+use Illuminate\Http\RedirectResponse;
 use Illuminate\Http\Request;
+use Illuminate\View\View;
 
 class CertificateController extends Controller
 {
-    //
+    public function index(Program $program): View
+    {
+        $certificates = $program->certificates()
+            ->with('participant')
+            ->latest()
+            ->paginate(50);
+
+        $stats = [
+            'total'     => $program->certificates()->count(),
+            'generated' => $program->certificates()->whereIn('status', ['generated', 'emailed', 'downloaded'])->count(),
+            'pending'   => $program->certificates()->where('status', 'pending')->count(),
+            'failed'    => $program->certificates()->where('status', 'failed')->count(),
+            'emailed'   => $program->certificates()->where('status', 'emailed')->count(),
+        ];
+
+        return view('admin.programs.certificates.index', compact('program', 'certificates', 'stats'));
+    }
+
+    public function generateAll(Request $request, Program $program): RedirectResponse
+    {
+        $template = $program->certificateTemplate;
+        if (! $template) {
+            return back()->with('error', 'Template sijil belum ditetapkan untuk program ini.');
+        }
+
+        // Find all attended participants without certificates
+        $existingIds = $program->certificates()->pluck('participant_id')->toArray();
+
+        $attended = $program->attendances()
+            ->whereNotIn('participant_id', $existingIds)
+            ->get();
+
+        if ($attended->isEmpty() && $program->certificates()->count() === 0) {
+            return back()->with('error', 'Tiada peserta yang hadir untuk dijana sijil.');
+        }
+
+        $sequence = $program->certificates()->count();
+        $created  = 0;
+
+        foreach ($attended as $attendance) {
+            $sequence++;
+            $cert = Certificate::firstOrCreate(
+                ['program_id' => $program->id, 'participant_id' => $attendance->participant_id],
+                [
+                    'certificate_template_id' => $template->id,
+                    'certificate_no'          => $this->buildCertNo($program, $sequence),
+                    'status'                  => 'pending',
+                ]
+            );
+
+            if ($cert->wasRecentlyCreated || $cert->status === 'failed') {
+                $cert->update(['certificate_template_id' => $template->id, 'status' => 'pending']);
+                GenerateCertificateJob::dispatch($cert);
+                $created++;
+            }
+        }
+
+        // Re-queue failed certificates
+        $failed = $program->certificates()->where('status', 'failed')->get();
+        foreach ($failed as $cert) {
+            $cert->update(['status' => 'pending', 'error_message' => null]);
+            GenerateCertificateJob::dispatch($cert);
+            $created++;
+        }
+
+        return back()->with('success', "Penjanaan sijil telah diantri untuk {$created} peserta.");
+    }
+
+    public function emailAll(Program $program): RedirectResponse
+    {
+        $toEmail = $program->certificates()
+            ->whereIn('status', ['generated'])
+            ->whereNull('emailed_at')
+            ->count();
+
+        if ($toEmail === 0) {
+            return back()->with('error', 'Tiada sijil yang sedia untuk dihantar emel.');
+        }
+
+        // Dispatch email blast job — implemented in Fasa 8
+        \App\Jobs\SendCertificateEmailJob::dispatchBatch($program);
+
+        return back()->with('success', "Penghantaran emel sijil dijadualkan untuk {$toEmail} peserta.");
+    }
+
+    private function buildCertNo(Program $program, int $seq): string
+    {
+        $year   = now()->format('Y');
+        $prefix = strtoupper(substr(preg_replace('/[^A-Za-z]/', '', $program->title), 0, 4));
+        return sprintf('%s/%s/%04d', $prefix ?: 'ECT', $year, $seq);
+    }
 }

app/Http/Controllers/Admin/CertificateTemplateController.php

@@ -3,9 +3,134 @@
 namespace App\Http\Controllers\Admin;
 
 use App\Http\Controllers\Controller;
+use App\Models\CertificateTemplate;
+use App\Models\Program;
+use App\Services\CertificateService;
+use Illuminate\Http\RedirectResponse;
 use Illuminate\Http\Request;
+use Illuminate\Http\Response;
+use Illuminate\Support\Facades\Storage;
+use Illuminate\View\View;
 
 class CertificateTemplateController extends Controller
 {
-    //
+    public function show(Program $program): View
+    {
+        $template = $program->certificateTemplate;
+        return view('admin.programs.template.show', compact('program', 'template'));
+    }
+
+    public function store(Request $request, Program $program): RedirectResponse
+    {
+        $request->validate([
+            'template_image' => 'required|image|mimes:jpg,jpeg,png|max:10240',
+        ]);
+
+        $file     = $request->file('template_image');
+        $filename = $file->getClientOriginalName();
+        $path     = $file->store('templates/' . $program->id, 'local');
+
+        // Deactivate previous templates
+        $program->certificateTemplates()->update(['is_active' => false]);
+
+        $program->certificateTemplates()->create([
+            'original_filename' => $filename,
+            'image_path'        => $path,
+            'is_active'         => true,
+            'uploaded_by'       => auth()->id(),
+            'config_json'       => $this->defaultConfig($file->getPath() . '/' . $file->getFilename()),
+        ]);
+
+        return redirect()->route('admin.programs.template.show', $program)
+            ->with('success', 'Template sijil berjaya dimuat naik. Konfigurasi kedudukan teks di bawah.');
+    }
+
+    public function updateConfig(Request $request, Program $program): RedirectResponse
+    {
+        $template = $program->certificateTemplate;
+        abort_if(! $template, 404);
+
+        $request->validate([
+            'fields'                  => 'required|array',
+            'fields.*.x'              => 'required|integer|min:0',
+            'fields.*.y'              => 'required|integer|min:0',
+            'fields.*.font_size'      => 'required|integer|min:8|max:200',
+            'fields.*.font_color'     => 'required|string|max:20',
+            'fields.*.align'          => 'required|in:left,center,right',
+        ]);
+
+        $config = $template->config_json ?? [];
+        $config['fields'] = array_merge($config['fields'] ?? [], $request->fields);
+
+        $template->update(['config_json' => $config]);
+
+        return redirect()->route('admin.programs.template.show', $program)
+            ->with('success', 'Konfigurasi template berjaya dikemaskini.');
+    }
+
+    public function destroy(Program $program): RedirectResponse
+    {
+        $template = $program->certificateTemplate;
+        abort_if(! $template, 404);
+
+        Storage::disk('local')->delete($template->image_path);
+        $template->delete();
+
+        return redirect()->route('admin.programs.template.show', $program)
+            ->with('success', 'Template sijil dipadam.');
+    }
+
+    public function preview(Program $program): Response
+    {
+        $template = $program->certificateTemplate;
+        abort_if(! $template, 404);
+
+        $content = Storage::disk('local')->get($template->image_path);
+
+        return response($content, 200, [
+            'Content-Type'        => 'image/jpeg',
+            'Content-Disposition' => 'inline',
+            'Cache-Control'       => 'private, max-age=3600',
+        ]);
+    }
+
+    public function testGenerate(Request $request, Program $program, CertificateService $service): Response
+    {
+        $template = $program->certificateTemplate;
+        abort_if(! $template, 404);
+
+        $sampleName = $request->input('sample_name', 'NAMA PESERTA CONTOH');
+        $sampleNo   = $request->input('sample_no', 'ECT/2025/0001');
+
+        $imageData = $service->generatePreview($template, $sampleName, $sampleNo);
+
+        return response($imageData, 200, [
+            'Content-Type'        => 'image/jpeg',
+            'Content-Disposition' => 'inline; filename="preview.jpg"',
+        ]);
+    }
+
+    private function defaultConfig(string $imagePath): array
+    {
+        [$width, $height] = getimagesize($imagePath) + [0, 0, 0, 0];
+
+        $cx = (int) round(($width ?: 1600) / 2);
+        $cy = (int) round(($height ?: 1100) * 0.52);
+
+        return [
+            'width'  => $width  ?: 1600,
+            'height' => $height ?: 1100,
+            'fields' => [
+                'name' => [
+                    'x'          => $cx,
+                    'y'          => $cy,
+                    'font_size'  => 52,
+                    'font_color' => '#1a3a6b',
+                    'font_file'  => 'DejaVuSans-Bold.ttf',
+                    'align'      => 'center',
+                    'valign'     => 'top',
+                ],
+            ],
+        ];
+    }
 }

app/Http/Controllers/Public/CertificateController.php

@@ -3,9 +3,86 @@
 namespace App\Http\Controllers\Public;
 
 use App\Http\Controllers\Controller;
+use App\Models\Certificate;
+use App\Models\QuestionnaireResponse;
+use Illuminate\Http\RedirectResponse;
 use Illuminate\Http\Request;
+use Illuminate\Http\Response;
+use Illuminate\Support\Facades\Storage;
+use Illuminate\View\View;
 
 class CertificateController extends Controller
 {
-    //
+    public function show(string $cert_token): View|RedirectResponse
+    {
+        $certificate = Certificate::where('token', $cert_token)
+            ->with(['participant', 'program', 'template'])
+            ->firstOrFail();
+
+        $program     = $certificate->program;
+        $participant = $certificate->participant;
+
+        // Check questionnaire gate
+        $pq = $program->questionnaire()->first();
+        $needsQuestionnaire = $pq && $pq->is_confirmed;
+        $hasAnswered = false;
+
+        if ($needsQuestionnaire) {
+            $hasAnswered = QuestionnaireResponse::where('program_id', $program->id)
+                ->where('participant_id', $participant->id)
+                ->exists();
+        }
+
+        // Find active QR code for questionnaire redirect
+        $qrCode = $program->qrCode;
+
+        return view('public.certificate.show', compact(
+            'certificate', 'program', 'participant', 'pq',
+            'needsQuestionnaire', 'hasAnswered', 'qrCode'
+        ));
+    }
+
+    public function download(string $cert_token): Response|RedirectResponse
+    {
+        $certificate = Certificate::where('token', $cert_token)
+            ->with(['participant', 'program'])
+            ->firstOrFail();
+
+        if (! $certificate->isGenerated()) {
+            return back()->with('error', 'Sijil belum sedia untuk dimuat turun.');
+        }
+
+        if (! $certificate->file_path || ! Storage::disk('local')->exists($certificate->file_path)) {
+            return back()->with('error', 'Fail sijil tidak dijumpai. Sila hubungi penganjur.');
+        }
+
+        // Check questionnaire gate
+        $program = $certificate->program;
+        $pq = $program->questionnaire()->first();
+
+        if ($pq && $pq->is_confirmed) {
+            $hasAnswered = QuestionnaireResponse::where('program_id', $program->id)
+                ->where('participant_id', $certificate->participant_id)
+                ->exists();
+
+            if (! $hasAnswered) {
+                $qrCode = $program->qrCode;
+                $redirectTo = $qrCode
+                    ? route('public.questionnaire.show', [$qrCode->token, $certificate->participant->uuid])
+                    : back();
+                return redirect($redirectTo)->with('info', 'Sila jawab borang penilaian terlebih dahulu.');
+            }
+        }
+
+        $certificate->recordDownload();
+
+        $content  = Storage::disk('local')->get($certificate->file_path);
+        $filename = 'Sijil-' . str($certificate->participant->name)->slug() . '.jpg';
+
+        return response($content, 200, [
+            'Content-Type'        => 'image/jpeg',
+            'Content-Disposition' => 'attachment; filename="' . $filename . '"',
+            'Content-Length'      => strlen($content),
+        ]);
+    }
 }

app/Jobs/GenerateCertificateJob.php

@@ -0,0 +1,32 @@
+<?php
+
+namespace App\Jobs;
+
+use App\Models\Certificate;
+use App\Services\CertificateService;
+use Illuminate\Bus\Queueable;
+use Illuminate\Contracts\Queue\ShouldQueue;
+use Illuminate\Foundation\Bus\Dispatchable;
+use Illuminate\Queue\InteractsWithQueue;
+use Illuminate\Queue\SerializesModels;
+
+class GenerateCertificateJob implements ShouldQueue
+{
+    use Dispatchable, InteractsWithQueue, Queueable, SerializesModels;
+
+    public int $tries = 3;
+    public int $backoff = 30;
+
+    public function __construct(public readonly Certificate $certificate) {}
+
+    public function handle(CertificateService $service): void
+    {
+        $this->certificate->refresh();
+
+        if ($this->certificate->status === 'generated') {
+            return;
+        }
+
+        $service->generate($this->certificate);
+    }
+}

app/Jobs/SendCertificateEmailJob.php

@@ -0,0 +1,34 @@
+<?php
+
+namespace App\Jobs;
+
+use App\Models\Certificate;
+use App\Models\Program;
+use Illuminate\Bus\Queueable;
+use Illuminate\Contracts\Queue\ShouldQueue;
+use Illuminate\Foundation\Bus\Dispatchable;
+use Illuminate\Queue\InteractsWithQueue;
+use Illuminate\Queue\SerializesModels;
+
+class SendCertificateEmailJob implements ShouldQueue
+{
+    use Dispatchable, InteractsWithQueue, Queueable, SerializesModels;
+
+    public int $tries = 3;
+    public int $backoff = 60;
+
+    public function __construct(public readonly Certificate $certificate) {}
+
+    public function handle(): void
+    {
+        // Implemented in Fasa 8 — email blast
+    }
+
+    public static function dispatchBatch(Program $program): void
+    {
+        $program->certificates()
+            ->whereIn('status', ['generated'])
+            ->whereNull('emailed_at')
+            ->each(fn($cert) => static::dispatch($cert));
+    }
+}

app/Services/CertificateService.php

@@ -0,0 +1,126 @@
+<?php
+
+namespace App\Services;
+
+use App\Models\Certificate;
+use App\Models\Program;
+use App\Models\Participant;
+use App\Models\CertificateTemplate;
+use Illuminate\Support\Facades\Storage;
+use Intervention\Image\ImageManager;
+use Intervention\Image\Drivers\Gd\Driver;
+use Intervention\Image\Typography\FontFactory;
+
+class CertificateService
+{
+    private ImageManager $manager;
+
+    public function __construct()
+    {
+        $this->manager = new ImageManager(new Driver());
+    }
+
+    public function generate(Certificate $certificate): void
+    {
+        $certificate->update(['status' => 'generating']);
+
+        try {
+            $certificate->load(['participant', 'template', 'program']);
+
+            $template = $certificate->template;
+            if (! $template) {
+                throw new \RuntimeException('Template sijil tidak dijumpai.');
+            }
+
+            $templatePath = Storage::path($template->image_path);
+            if (! file_exists($templatePath)) {
+                throw new \RuntimeException('Fail template sijil tidak dijumpai di storage.');
+            }
+
+            $image = $this->manager->read($templatePath);
+            $config = $template->config_json ?? [];
+            $fields = $config['fields'] ?? [];
+
+            // Overlay name
+            if (isset($fields['name'])) {
+                $this->writeText($image, $certificate->participant->name, $fields['name']);
+            }
+
+            // Overlay certificate number if configured
+            if (isset($fields['certificate_no']) && $certificate->certificate_no) {
+                $this->writeText($image, $certificate->certificate_no, $fields['certificate_no']);
+            }
+
+            $outputDir  = 'certificates/' . $certificate->program_id;
+            $outputFile = $outputDir . '/' . $certificate->uuid . '.jpg';
+
+            Storage::makeDirectory($outputDir);
+            $image->toJpeg(90)->save(Storage::path($outputFile));
+
+            $certificate->update([
+                'file_path'    => $outputFile,
+                'status'       => 'generated',
+                'generated_at' => now(),
+                'error_message'=> null,
+            ]);
+        } catch (\Throwable $e) {
+            $certificate->update([
+                'status'        => 'failed',
+                'error_message' => $e->getMessage(),
+            ]);
+        }
+    }
+
+    public function generatePreview(CertificateTemplate $template, string $sampleName, string $sampleNo = ''): string
+    {
+        $templatePath = Storage::path($template->image_path);
+        $image = $this->manager->read($templatePath);
+        $config = $template->config_json ?? [];
+        $fields = $config['fields'] ?? [];
+
+        if (isset($fields['name'])) {
+            $this->writeText($image, $sampleName, $fields['name']);
+        }
+
+        if (isset($fields['certificate_no']) && $sampleNo) {
+            $this->writeText($image, $sampleNo, $fields['certificate_no']);
+        }
+
+        return $image->toJpeg(85)->toString();
+    }
+
+    private function writeText(\Intervention\Image\Image $image, string $text, array $cfg): void
+    {
+        $fontFile  = $this->resolveFontPath($cfg['font_file'] ?? 'DejaVuSans-Bold.ttf');
+        $fontSize  = (int)   ($cfg['font_size']   ?? 48);
+        $fontColor = (string)($cfg['font_color']  ?? '#000000');
+        $align     = (string)($cfg['align']       ?? 'center');
+        $valign    = (string)($cfg['valign']      ?? 'top');
+        $x         = (int)   ($cfg['x']           ?? 0);
+        $y         = (int)   ($cfg['y']            ?? 0);
+
+        $image->text($text, $x, $y, function (FontFactory $font) use ($fontFile, $fontSize, $fontColor, $align, $valign) {
+            $font->filename($fontFile);
+            $font->size($fontSize);
+            $font->color($fontColor);
+            $font->align($align);
+            $font->valign($valign);
+        });
+    }
+
+    private function resolveFontPath(string $filename): string
+    {
+        $custom = resource_path('fonts/' . $filename);
+        if (file_exists($custom)) {
+            return $custom;
+        }
+        return resource_path('fonts/DejaVuSans-Bold.ttf');
+    }
+
+    public function buildCertificateNo(Program $program, Participant $participant, int $sequence): string
+    {
+        $year   = now()->format('Y');
+        $prefix = strtoupper(substr(preg_replace('/[^A-Za-z]/', '', $program->title), 0, 4));
+        return sprintf('%s/%s/%04d', $prefix, $year, $sequence);
+    }
+}

resources/views/admin/programs/certificates/index.blade.php

@@ -0,0 +1,135 @@
+@extends('layouts.admin')
+
+@section('title', 'Sijil — ' . $program->title)
+@section('header', 'Pengurusan Sijil')
+
+@section('breadcrumb')
+<li class="breadcrumb-item"><a href="{{ route('admin.programs.index') }}">Program</a></li>
+<li class="breadcrumb-item"><a href="{{ route('admin.programs.show', $program) }}">{{ Str::limit($program->title, 30) }}</a></li>
+<li class="breadcrumb-item active">Sijil</li>
+@endsection
+
+@section('content')
+
+{{-- Stats --}}
+<div class="row g-3 mb-4">
+    <div class="col-6 col-md-3">
+        <div class="card border-0 bg-secondary bg-opacity-10 text-center p-3">
+            <div class="fs-3 fw-bold">{{ $stats['total'] }}</div>
+            <div class="small text-muted">Jumlah</div>
+        </div>
+    </div>
+    <div class="col-6 col-md-3">
+        <div class="card border-0 bg-success bg-opacity-10 text-center p-3">
+            <div class="fs-3 fw-bold text-success">{{ $stats['generated'] }}</div>
+            <div class="small text-muted">Dijana</div>
+        </div>
+    </div>
+    <div class="col-6 col-md-3">
+        <div class="card border-0 bg-warning bg-opacity-10 text-center p-3">
+            <div class="fs-3 fw-bold text-warning">{{ $stats['pending'] }}</div>
+            <div class="small text-muted">Menunggu</div>
+        </div>
+    </div>
+    <div class="col-6 col-md-3">
+        <div class="card border-0 bg-danger bg-opacity-10 text-center p-3">
+            <div class="fs-3 fw-bold text-danger">{{ $stats['failed'] }}</div>
+            <div class="small text-muted">Gagal</div>
+        </div>
+    </div>
+</div>
+
+{{-- Actions --}}
+<div class="d-flex gap-2 mb-4 flex-wrap">
+    <form method="POST" action="{{ route('admin.programs.certificates.generate-all', $program) }}">
+        @csrf
+        <button class="btn btn-primary"
+                onclick="return confirm('Jana sijil untuk semua peserta hadir?')">
+            <i class="bi bi-gear me-1"></i> Jana Semua Sijil
+        </button>
+    </form>
+
+    @if($stats['generated'] > 0)
+    <form method="POST" action="{{ route('admin.programs.certificates.email-all', $program) }}">
+        @csrf
+        <button class="btn btn-outline-success"
+                onclick="return confirm('Hantar emel sijil kepada semua peserta yang sijilnya sudah sedia?')">
+            <i class="bi bi-envelope me-1"></i> Hantar Emel Sijil
+        </button>
+    </form>
+    @endif
+
+    @if(! $program->certificateTemplate)
+    <div class="alert alert-warning mb-0 py-2 px-3 small">
+        <i class="bi bi-exclamation-triangle me-1"></i>
+        <a href="{{ route('admin.programs.template.show', $program) }}">Upload template sijil</a> dahulu sebelum jana sijil.
+    </div>
+    @endif
+</div>
+
+{{-- Certificate List --}}
+<div class="card border-0 shadow-sm">
+    <div class="table-responsive">
+        <table class="table table-hover align-middle mb-0">
+            <thead class="table-light">
+                <tr>
+                    <th>Peserta</th>
+                    <th>No. Sijil</th>
+                    <th>Status</th>
+                    <th>Dijana</th>
+                    <th>Muat Turun</th>
+                    <th></th>
+                </tr>
+            </thead>
+            <tbody>
+            @forelse($certificates as $cert)
+                <tr>
+                    <td>
+                        <div class="fw-medium small">{{ $cert->participant->name }}</div>
+                        <div class="text-muted" style="font-size:0.75rem;">{{ $cert->participant->agency ?: '—' }}</div>
+                    </td>
+                    <td class="small text-muted">{{ $cert->certificate_no ?? '—' }}</td>
+                    <td>
+                        @if($cert->status === 'generated' || $cert->status === 'downloaded')
+                            <span class="badge bg-success">Sedia</span>
+                        @elseif($cert->status === 'emailed')
+                            <span class="badge bg-info">Diemailkan</span>
+                        @elseif($cert->status === 'pending')
+                            <span class="badge bg-warning text-dark">Menunggu</span>
+                        @elseif($cert->status === 'generating')
+                            <span class="badge bg-secondary">Menjana...</span>
+                        @elseif($cert->status === 'failed')
+                            <span class="badge bg-danger" title="{{ $cert->error_message }}">Gagal</span>
+                        @endif
+                    </td>
+                    <td class="small text-muted">{{ $cert->generated_at?->format('d/m H:i') ?? '—' }}</td>
+                    <td class="small text-muted text-center">{{ $cert->download_count ?: '—' }}</td>
+                    <td>
+                        @if($cert->isGenerated())
+                        <a href="{{ route('public.certificate.show', $cert->token) }}" target="_blank"
+                           class="btn btn-sm btn-outline-primary">
+                            <i class="bi bi-eye"></i>
+                        </a>
+                        @endif
+                    </td>
+                </tr>
+            @empty
+                <tr>
+                    <td colspan="6" class="text-center py-5 text-muted">
+                        <i class="bi bi-award d-block fs-1 mb-3 opacity-25"></i>
+                        Belum ada sijil dijana. Klik "Jana Semua Sijil" untuk mula.
+                    </td>
+                </tr>
+            @endforelse
+            </tbody>
+        </table>
+    </div>
+
+    @if($certificates->hasPages())
+    <div class="card-footer bg-white">
+        {{ $certificates->links() }}
+    </div>
+    @endif
+</div>
+
+@endsection

resources/views/admin/programs/template/show.blade.php

@@ -0,0 +1,265 @@
+@extends('layouts.admin')
+
+@section('title', 'Template Sijil — ' . $program->title)
+@section('header', 'Template Sijil')
+
+@section('breadcrumb')
+<li class="breadcrumb-item"><a href="{{ route('admin.programs.index') }}">Program</a></li>
+<li class="breadcrumb-item"><a href="{{ route('admin.programs.show', $program) }}">{{ Str::limit($program->title, 30) }}</a></li>
+<li class="breadcrumb-item active">Template Sijil</li>
+@endsection
+
+@section('header-actions')
+<a href="{{ route('admin.programs.show', $program) }}#tab-template" class="btn btn-sm btn-outline-secondary">
+    <i class="bi bi-arrow-left me-1"></i> Kembali
+</a>
+@endsection
+
+@section('content')
+
+<div class="row g-4">
+    {{-- Left: Current template --}}
+    <div class="col-md-7">
+
+        @if($template)
+        <div class="card border-0 shadow-sm mb-4">
+            <div class="card-header bg-white py-3 d-flex justify-content-between align-items-center">
+                <h6 class="mb-0 fw-semibold"><i class="bi bi-image me-2 text-primary"></i>Template Aktif</h6>
+                <form method="POST" action="{{ route('admin.programs.template.destroy', $program) }}"
+                      onsubmit="return confirm('Padam template sijil ini? Tindakan ini tidak boleh diundur.')">
+                    @csrf @method('DELETE')
+                    <button class="btn btn-sm btn-outline-danger">
+                        <i class="bi bi-trash me-1"></i> Padam
+                    </button>
+                </form>
+            </div>
+            <div class="card-body">
+                <div class="text-center mb-3">
+                    <div class="cert-preview-wrapper border rounded overflow-hidden" style="max-height:380px;">
+                        <img src="{{ route('admin.programs.template.preview', $program) }}"
+                             id="templatePreview"
+                             alt="Template Preview"
+                             class="img-fluid w-100"
+                             style="object-fit:contain;">
+                    </div>
+                    <div class="mt-2 text-muted small">{{ $template->original_filename }}</div>
+                </div>
+
+                {{-- Test Generate --}}
+                <div class="border rounded p-3 bg-light">
+                    <label class="form-label small fw-medium">Jana Pratonton</label>
+                    <div class="row g-2">
+                        <div class="col-8">
+                            <input type="text" id="sampleName" class="form-control form-control-sm"
+                                   value="NAMA PESERTA CONTOH" placeholder="Nama untuk pratonton">
+                        </div>
+                        <div class="col-4">
+                            <button type="button" class="btn btn-sm btn-primary w-100" onclick="loadPreview()">
+                                <i class="bi bi-eye me-1"></i> Pratonton
+                            </button>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        {{-- Config Editor --}}
+        <div class="card border-0 shadow-sm">
+            <div class="card-header bg-white py-3">
+                <h6 class="mb-0 fw-semibold"><i class="bi bi-sliders me-2 text-warning"></i>Konfigurasi Kedudukan Teks</h6>
+            </div>
+            <div class="card-body">
+                @php $config = $template->config_json ?? []; $fields = $config['fields'] ?? []; @endphp
+                <form method="POST" action="{{ route('admin.programs.template.config', $program) }}">
+                    @csrf @method('PUT')
+
+                    <p class="text-muted small mb-3">
+                        Koordinat X dan Y dikira dari sudut kiri atas imej (piksel).
+                        Imej template: <strong>{{ $config['width'] ?? '—' }} × {{ $config['height'] ?? '—' }}</strong> piksel.
+                    </p>
+
+                    {{-- Name field --}}
+                    <div class="card border mb-3">
+                        <div class="card-header py-2 bg-light">
+                            <span class="fw-medium small">Nama Peserta</span>
+                        </div>
+                        <div class="card-body py-3">
+                            <div class="row g-2">
+                                <div class="col-4">
+                                    <label class="form-label small">X (Piksel)</label>
+                                    <input type="number" name="fields[name][x]" class="form-control form-control-sm"
+                                           value="{{ $fields['name']['x'] ?? 800 }}">
+                                </div>
+                                <div class="col-4">
+                                    <label class="form-label small">Y (Piksel)</label>
+                                    <input type="number" name="fields[name][y]" class="form-control form-control-sm"
+                                           value="{{ $fields['name']['y'] ?? 400 }}">
+                                </div>
+                                <div class="col-4">
+                                    <label class="form-label small">Saiz Font</label>
+                                    <input type="number" name="fields[name][font_size]" class="form-control form-control-sm"
+                                           value="{{ $fields['name']['font_size'] ?? 52 }}">
+                                </div>
+                                <div class="col-4">
+                                    <label class="form-label small">Warna</label>
+                                    <input type="color" name="fields[name][font_color]" class="form-control form-control-color form-control-sm"
+                                           value="{{ $fields['name']['font_color'] ?? '#1a3a6b' }}">
+                                </div>
+                                <div class="col-4">
+                                    <label class="form-label small">Align</label>
+                                    <select name="fields[name][align]" class="form-select form-select-sm">
+                                        <option value="left"   {{ ($fields['name']['align'] ?? 'center') === 'left'   ? 'selected' : '' }}>Kiri</option>
+                                        <option value="center" {{ ($fields['name']['align'] ?? 'center') === 'center' ? 'selected' : '' }}>Tengah</option>
+                                        <option value="right"  {{ ($fields['name']['align'] ?? 'center') === 'right'  ? 'selected' : '' }}>Kanan</option>
+                                    </select>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    {{-- Certificate No (optional) --}}
+                    <div class="card border mb-4">
+                        <div class="card-header py-2 bg-light d-flex justify-content-between">
+                            <span class="fw-medium small">No. Sijil <span class="text-muted">(Pilihan)</span></span>
+                            <div class="form-check form-switch mb-0">
+                                <input class="form-check-input" type="checkbox" id="showCertNo"
+                                       onchange="toggleCertNo(this)"
+                                       {{ isset($fields['certificate_no']) ? 'checked' : '' }}>
+                                <label class="form-check-label small" for="showCertNo">Papar</label>
+                            </div>
+                        </div>
+                        <div class="card-body py-3" id="certNoFields" {{ isset($fields['certificate_no']) ? '' : 'style=display:none' }}>
+                            <div class="row g-2">
+                                <div class="col-4">
+                                    <label class="form-label small">X</label>
+                                    <input type="number" name="fields[certificate_no][x]" class="form-control form-control-sm"
+                                           value="{{ $fields['certificate_no']['x'] ?? 800 }}">
+                                </div>
+                                <div class="col-4">
+                                    <label class="form-label small">Y</label>
+                                    <input type="number" name="fields[certificate_no][y]" class="form-control form-control-sm"
+                                           value="{{ $fields['certificate_no']['y'] ?? 460 }}">
+                                </div>
+                                <div class="col-4">
+                                    <label class="form-label small">Saiz Font</label>
+                                    <input type="number" name="fields[certificate_no][font_size]" class="form-control form-control-sm"
+                                           value="{{ $fields['certificate_no']['font_size'] ?? 28 }}">
+                                </div>
+                                <div class="col-4">
+                                    <label class="form-label small">Warna</label>
+                                    <input type="color" name="fields[certificate_no][font_color]" class="form-control form-control-color form-control-sm"
+                                           value="{{ $fields['certificate_no']['font_color'] ?? '#555555' }}">
+                                </div>
+                                <div class="col-4">
+                                    <label class="form-label small">Align</label>
+                                    <select name="fields[certificate_no][align]" class="form-select form-select-sm">
+                                        <option value="left"   {{ ($fields['certificate_no']['align'] ?? 'center') === 'left'   ? 'selected' : '' }}>Kiri</option>
+                                        <option value="center" {{ ($fields['certificate_no']['align'] ?? 'center') === 'center' ? 'selected' : '' }}>Tengah</option>
+                                        <option value="right"  {{ ($fields['certificate_no']['align'] ?? 'center') === 'right'  ? 'selected' : '' }}>Kanan</option>
+                                    </select>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <button type="submit" class="btn btn-primary">
+                        <i class="bi bi-save me-1"></i> Simpan Konfigurasi
+                    </button>
+                </form>
+            </div>
+        </div>
+
+        @else
+        {{-- Upload Form --}}
+        <div class="card border-0 shadow-sm">
+            <div class="card-header bg-white py-3">
+                <h6 class="mb-0 fw-semibold"><i class="bi bi-upload me-2 text-primary"></i>Muat Naik Template Sijil</h6>
+            </div>
+            <div class="card-body">
+                <div class="alert alert-info small mb-4">
+                    <i class="bi bi-lightbulb me-1"></i>
+                    Muat naik imej template sijil dalam format <strong>JPG atau PNG</strong>.
+                    Saiz maksimum: <strong>10MB</strong>. Resolusi disyorkan: <strong>1754 × 1240px</strong> (A4 landscape 150dpi).
+                </div>
+
+                <form method="POST" action="{{ route('admin.programs.template.store', $program) }}" enctype="multipart/form-data">
+                    @csrf
+                    <div class="mb-4">
+                        <label class="form-label fw-medium">Fail Template <span class="text-danger">*</span></label>
+                        <input type="file" name="template_image" accept="image/jpeg,image/png"
+                               class="form-control @error('template_image') is-invalid @enderror"
+                               onchange="previewImage(this)">
+                        @error('template_image')<div class="invalid-feedback">{{ $message }}</div>@enderror
+                        <div class="form-text">Format: JPG, PNG — Maksimum 10MB</div>
+                    </div>
+
+                    <div id="imagePreviewBox" class="mb-4 d-none">
+                        <label class="form-label small text-muted">Pratonton:</label>
+                        <div class="border rounded overflow-hidden">
+                            <img id="imagePreviewEl" src="" alt="preview" class="img-fluid w-100">
+                        </div>
+                    </div>
+
+                    <button type="submit" class="btn btn-primary">
+                        <i class="bi bi-upload me-1"></i> Muat Naik
+                    </button>
+                </form>
+            </div>
+        </div>
+        @endif
+
+    </div>
+
+    {{-- Right: Tips --}}
+    <div class="col-md-5">
+        <div class="card border-0 bg-light">
+            <div class="card-body p-4">
+                <h6 class="fw-semibold mb-3"><i class="bi bi-info-circle me-2 text-primary"></i>Panduan Template</h6>
+                <ul class="small text-muted mb-0">
+                    <li class="mb-2">Gunakan imej resolusi tinggi (≥1600px lebar) untuk hasil cetak berkualiti.</li>
+                    <li class="mb-2">Pastikan ruang untuk nama peserta tidak dihalang oleh grafik template.</li>
+                    <li class="mb-2">Koordinat (0,0) adalah sudut <strong>kiri atas</strong> imej.</li>
+                    <li class="mb-2">Gunakan butang <strong>Pratonton</strong> untuk menyemak kedudukan teks sebelum jana sijil sebenar.</li>
+                    <li class="mb-0">Sijil dijana dalam format JPG.</li>
+                </ul>
+            </div>
+        </div>
+    </div>
+</div>
+
+@endsection
+
+@push('scripts')
+<script>
+function previewImage(input) {
+    if (input.files && input.files[0]) {
+        const reader = new FileReader();
+        reader.onload = e => {
+            document.getElementById('imagePreviewEl').src = e.target.result;
+            document.getElementById('imagePreviewBox').classList.remove('d-none');
+        };
+        reader.readAsDataURL(input.files[0]);
+    }
+}
+
+function toggleCertNo(cb) {
+    document.getElementById('certNoFields').style.display = cb.checked ? '' : 'none';
+}
+
+function loadPreview() {
+    const name = document.getElementById('sampleName').value || 'NAMA PESERTA CONTOH';
+    const img  = document.getElementById('templatePreview');
+    const url  = "{{ route('admin.programs.template.test', $program) }}";
+
+    const form = new FormData();
+    form.append('_token', '{{ csrf_token() }}');
+    form.append('sample_name', name);
+
+    fetch(url, { method: 'POST', body: form })
+        .then(r => r.blob())
+        .then(blob => {
+            img.src = URL.createObjectURL(blob);
+        });
+}
+</script>
+@endpush

resources/views/public/certificate/show.blade.php

@@ -0,0 +1,101 @@
+@extends('layouts.public')
+
+@section('title', 'Sijil Digital — ' . $program->title)
+
+@section('hero')
+<h4 class="mb-1">{{ $program->title }}</h4>
+<div class="opacity-75 small">
+    <i class="bi bi-award me-1"></i>Sijil Digital (eCert)
+</div>
+@endsection
+
+@section('content')
+
+@if(! $certificate->isGenerated())
+{{-- Not ready yet --}}
+<div class="checkin-card card p-4 text-center">
+    <div class="rounded-circle bg-warning bg-opacity-10 d-inline-flex align-items-center justify-content-center mx-auto mb-3"
+         style="width:70px; height:70px;">
+        <i class="bi bi-hourglass-split text-warning" style="font-size:2rem;"></i>
+    </div>
+    <h5 class="fw-bold mb-2">Sijil Belum Sedia</h5>
+    <p class="text-muted small mb-3">
+        Sijil anda sedang disediakan. Sila semak semula sebentar atau tunggu emel dari penganjur program.
+    </p>
+    @if($certificate->status === 'failed')
+    <div class="alert alert-danger text-start small">
+        <i class="bi bi-exclamation-circle me-1"></i>
+        Penjanaan sijil gagal. Sila hubungi penganjur program untuk bantuan.
+    </div>
+    @endif
+</div>
+
+@else
+
+{{-- Questionnaire gate --}}
+@if($needsQuestionnaire && ! $hasAnswered)
+<div class="checkin-card card p-4 text-center">
+    <div class="rounded-circle bg-primary bg-opacity-10 d-inline-flex align-items-center justify-content-center mx-auto mb-3"
+         style="width:70px; height:70px;">
+        <i class="bi bi-clipboard2-check-fill text-primary" style="font-size:2rem;"></i>
+    </div>
+    <h5 class="fw-bold mb-2">Jawab Borang Penilaian Dahulu</h5>
+    <p class="text-muted small mb-4">
+        Sebelum memuat turun sijil, anda perlu melengkapkan borang penilaian program.
+    </p>
+    @if($qrCode)
+    <a href="{{ route('public.questionnaire.show', [$qrCode->token, $participant->uuid]) }}"
+       class="btn btn-primary btn-checkin w-100">
+        <i class="bi bi-clipboard2 me-2"></i>Isi Borang Penilaian
+    </a>
+    @else
+    <div class="alert alert-warning small">
+        Sila dapatkan pautan borang penilaian dari penganjur program.
+    </div>
+    @endif
+</div>
+
+@else
+{{-- Certificate ready to download --}}
+<div class="checkin-card card p-4 text-center">
+    <div class="rounded-circle bg-success bg-opacity-10 d-inline-flex align-items-center justify-content-center mx-auto mb-3"
+         style="width:70px; height:70px;">
+        <i class="bi bi-award-fill text-success" style="font-size:2rem;"></i>
+    </div>
+    <h5 class="fw-bold text-success mb-1">Sijil Sedia Dimuat Turun</h5>
+    <p class="text-muted small mb-3">
+        Tahniah, <strong>{{ $participant->name }}</strong>! Sijil digital anda untuk program ini telah sedia.
+    </p>
+
+    <div class="bg-light rounded p-3 text-start mb-4">
+        <div class="row g-2">
+            <div class="col-5 text-muted small">Program</div>
+            <div class="col-7 small fw-medium">{{ $program->title }}</div>
+            @if($certificate->certificate_no)
+            <div class="col-5 text-muted small">No. Sijil</div>
+            <div class="col-7 small">{{ $certificate->certificate_no }}</div>
+            @endif
+            <div class="col-5 text-muted small">Tarikh Jana</div>
+            <div class="col-7 small">{{ $certificate->generated_at?->format('d M Y') ?? '—' }}</div>
+            @if($certificate->download_count > 0)
+            <div class="col-5 text-muted small">Dimuat Turun</div>
+            <div class="col-7 small">{{ $certificate->download_count }} kali</div>
+            @endif
+        </div>
+    </div>
+
+    <form method="POST" action="{{ route('public.certificate.download', $certificate->token) }}">
+        @csrf
+        <button type="submit" class="btn btn-success btn-checkin w-100 mb-2">
+            <i class="bi bi-download me-2"></i>Muat Turun Sijil (JPG)
+        </button>
+    </form>
+    <div class="text-muted" style="font-size:0.75rem;">
+        <i class="bi bi-info-circle me-1"></i>Sijil dalam format JPEG. Boleh dimuat turun berulang kali.
+    </div>
+</div>
+@endif
+
+@endif
+
+@endsection