Move payment QR download and share actions back to the page header.
Deploy Ladill Mini / deploy (push) Successful in 26s

Remove the till/counter helper copy and drop duplicate download buttons from the preview card.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
isaacclad
2026-06-07 20:02:42 +00:00
co-authored by Cursor
parent 7eaa0ab23a
commit 05ca584016
2 changed files with 59 additions and 17 deletions
@@ -0,0 +1,37 @@
@php
$shareUrl = $qrCode->publicUrl();
$shareEnc = urlencode($shareUrl);
$shareText = urlencode($qrCode->label . ' — pay with QR');
@endphp
<div class="flex flex-wrap items-center gap-2">
<a href="{{ route('mini.payment-qrs.download', [$qrCode, 'png']) }}"
class="rounded-lg border border-slate-200 px-3 py-1.5 text-sm font-medium text-slate-700 hover:bg-slate-50">PNG</a>
<a href="{{ route('mini.payment-qrs.download', [$qrCode, 'svg']) }}"
class="rounded-lg border border-slate-200 px-3 py-1.5 text-sm font-medium text-slate-700 hover:bg-slate-50">SVG</a>
<a href="{{ route('mini.payment-qrs.download', [$qrCode, 'pdf']) }}"
class="rounded-lg border border-slate-200 px-3 py-1.5 text-sm font-medium text-slate-700 hover:bg-slate-50">PDF</a>
<div class="relative" x-data="{ open: false, copied: false }" @click.outside="open = false">
<button type="button"
@click="if(navigator.share){navigator.share({title:@js($qrCode->label),url:@js($shareUrl)}).catch(()=>{open=!open})}else{open=!open}"
class="rounded-lg border border-slate-200 px-3 py-1.5 text-sm font-medium text-slate-700 hover:bg-slate-50">
Share
</button>
<div x-show="open" x-cloak
x-transition:enter="transition ease-out duration-100"
x-transition:enter-start="opacity-0 scale-95"
x-transition:enter-end="opacity-100 scale-100"
class="absolute right-0 z-50 mt-2 w-52 origin-top-right rounded-xl border border-slate-200 bg-white p-1.5 shadow-xl">
<a href="https://wa.me/?text={{ $shareText }}%20{{ $shareEnc }}" target="_blank" rel="noopener"
@click="open = false"
class="flex items-center gap-2.5 rounded-lg px-3 py-2 text-sm text-slate-700 transition hover:bg-slate-50">
WhatsApp
</a>
<button type="button"
@click="navigator.clipboard.writeText(@js($shareUrl)).then(() => { copied = true; setTimeout(() => { copied = false; open = false }, 1500) })"
class="flex w-full items-center gap-2.5 rounded-lg px-3 py-2 text-sm transition hover:bg-slate-50"
:class="copied ? 'text-emerald-600' : 'text-slate-700'">
<span x-text="copied ? 'Copied!' : 'Copy link'">Copy link</span>
</button>
</div>
</div>
</div>
+22 -17
View File
@@ -2,22 +2,28 @@
<x-slot name="title">{{ $qrCode->label }}</x-slot> <x-slot name="title">{{ $qrCode->label }}</x-slot>
@php $c = $qrCode->content(); @endphp @php $c = $qrCode->content(); @endphp
<div class="mx-auto max-w-6xl space-y-6"> <div class="mx-auto max-w-6xl space-y-6">
<div class="flex items-center gap-3 py-1 lg:hidden"> <div class="flex flex-wrap items-start justify-between gap-4">
<a href="{{ route('mini.payment-qrs.index') }}" <div class="min-w-0 flex-1">
class="flex h-9 w-9 shrink-0 items-center justify-center rounded-xl border border-slate-200 bg-white text-slate-500 shadow-sm transition hover:text-slate-900"> <div class="flex items-center gap-3 py-1 lg:hidden">
<svg class="h-4 w-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"> <a href="{{ route('mini.payment-qrs.index') }}"
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12"/> class="flex h-9 w-9 shrink-0 items-center justify-center rounded-xl border border-slate-200 bg-white text-slate-500 shadow-sm transition hover:text-slate-900">
</svg> <svg class="h-4 w-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24">
</a> <path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12"/>
<img src="{{ asset('images/logo/ladillmini-logo.svg') }}?v={{ @filemtime(public_path('images/logo/ladillmini-logo.svg')) ?: '1' }}" </svg>
alt="Ladill Mini" class="h-5 w-auto shrink-0"> </a>
<span class="min-w-0 flex-1 truncate text-sm font-semibold text-slate-900">{{ $qrCode->label }}</span> <img src="{{ asset('images/logo/ladillmini-logo.svg') }}?v={{ @filemtime(public_path('images/logo/ladillmini-logo.svg')) ?: '1' }}"
</div> alt="Ladill Mini" class="h-5 w-auto shrink-0">
<span class="min-w-0 flex-1 truncate text-sm font-semibold text-slate-900">{{ $qrCode->label }}</span>
</div>
<div class="hidden lg:block"> <div class="hidden lg:block">
<a href="{{ route('mini.payment-qrs.index') }}" class="text-sm text-slate-500 hover:text-slate-700"> All payment QRs</a> <a href="{{ route('mini.payment-qrs.index') }}" class="text-sm text-slate-500 hover:text-slate-700"> All payment QRs</a>
<h1 class="mt-2 text-xl font-semibold text-slate-900">{{ $qrCode->label }}</h1> <h1 class="mt-2 text-xl font-semibold text-slate-900">{{ $qrCode->label }}</h1>
<p class="mt-1 text-sm text-slate-500">{{ $c['business_name'] ?? '' }}@if(!empty($c['branch_label'])) · {{ $c['branch_label'] }}@endif</p> <p class="mt-1 text-sm text-slate-500">{{ $c['business_name'] ?? '' }}@if(!empty($c['branch_label'])) · {{ $c['branch_label'] }}@endif</p>
</div>
</div>
@include('mini.payment-qrs.partials.header-actions', ['qrCode' => $qrCode])
</div> </div>
@if(session('success')) @if(session('success'))
@@ -29,10 +35,9 @@
@include('mini.payment-qrs.partials.preview-card', [ @include('mini.payment-qrs.partials.preview-card', [
'qrCode' => $qrCode, 'qrCode' => $qrCode,
'previewDataUri' => $previewDataUri, 'previewDataUri' => $previewDataUri,
'showDownloads' => true, 'showDownloads' => false,
]) ])
<p class="mt-4 break-all text-center text-sm text-indigo-600">{{ $qrCode->publicUrl() }}</p> <p class="mt-4 break-all text-center text-sm text-indigo-600">{{ $qrCode->publicUrl() }}</p>
<p class="mt-2 text-center text-xs text-slate-500">Standard black-and-white QR ready to print at your till or counter.</p>
</div> </div>
<form method="post" action="{{ route('mini.payment-qrs.update', $qrCode) }}" enctype="multipart/form-data" class="space-y-4 rounded-2xl border border-slate-200 bg-white p-6"> <form method="post" action="{{ route('mini.payment-qrs.update', $qrCode) }}" enctype="multipart/form-data" class="space-y-4 rounded-2xl border border-slate-200 bg-white p-6">