From 7a90e8c6debe972313447e5daf0a304808636fc2 Mon Sep 17 00:00:00 2001
From: sky121113 <sky121113@gmail.com>
Date: Tue, 16 Jun 2026 14:32:43 +0800
Subject: [PATCH] =?UTF-8?q?[STYLE]=20=E7=99=BC=E7=A5=A8=E6=93=8D=E4=BD=9C?=
 =?UTF-8?q?=E6=8C=89=E9=88=95=E9=85=8D=E7=BD=AE=E8=AA=BF=E6=95=B4=E8=88=87?=
 =?UTF-8?q?=E4=BD=9C=E5=BB=A2=E7=A2=BA=E8=AA=8D=E6=A1=86=E6=94=B9=E7=94=A8?=
 =?UTF-8?q?=E8=87=AA=E8=A3=BD=20UI?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

1. 發票列表「操作」欄：查詢、補開改為 icon 按鈕呈現，與檢視 icon 風格一致；補開改用自製確認框 UI（取代瀏覽器原生 confirm）。
2. 訂單詳情發票區塊：列印、作廢維持文字按鈕樣式（不改 icon）；作廢改接自製確認框 UI，捐贈發票維持隱藏列印並顯示提示。

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 .../partials/order-detail-panel.blade.php     | 68 ++++++-------------
 .../sales/partials/tab-invoices.blade.php     | 22 +++---
 2 files changed, 34 insertions(+), 56 deletions(-)

diff --git a/resources/views/admin/sales/partials/order-detail-panel.blade.php b/resources/views/admin/sales/partials/order-detail-panel.blade.php
index c244e02..1eeec53 100644
--- a/resources/views/admin/sales/partials/order-detail-panel.blade.php
+++ b/resources/views/admin/sales/partials/order-detail-panel.blade.php
@@ -309,57 +309,29 @@
                     </div>
                 </div>
 
-                <div class="flex items-center gap-2">
-                    @if($invStatus === 'issued')
-                        {{-- 列印（捐贈發票無紙本，僅非捐贈可列印） --}}
-                        @if($invPrintable)
-                        <form method="POST" action="{{ route('admin.sales.invoices.print', $order->invoice) }}" target="_blank">
-                            @csrf
-                            <button type="submit" title="{{ __('Print Invoice') }}"
-                                class="p-3 rounded-xl bg-white dark:bg-slate-800 text-slate-500 dark:text-slate-400 border border-slate-200 dark:border-slate-700 hover:bg-indigo-500 hover:text-white hover:border-indigo-500 transition-all duration-300 shadow-sm">
-                                <svg class="w-4 h-4 stroke-[2.2]" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                                    <path stroke-linecap="round" stroke-linejoin="round" d="M6.72 13.829c-.24.03-.48.062-.72.096m.72-.096a42.415 42.415 0 0 1 10.56 0m-10.56 0L6.34 18m10.94-4.171c.24.03.48.062.72.096m-.72-.096L17.66 18m0 0 .229 2.523a1.125 1.125 0 0 1-1.12 1.227H7.231c-.662 0-1.18-.568-1.12-1.227L6.34 18m11.318 0h1.091A2.25 2.25 0 0 0 21 15.75V9.456c0-1.081-.768-2.015-1.837-2.175a48.055 48.055 0 0 0-1.913-.247M6.34 18H5.25A2.25 2.25 0 0 1 3 15.75V9.456c0-1.081.768-2.015 1.837-2.175a48.041 48.041 0 0 1 1.913-.247m10.5 0a48.536 48.536 0 0 0-10.5 0m10.5 0V3.375c0-.621-.504-1.125-1.125-1.125h-8.25c-.621 0-1.125.504-1.125 1.125v3.659M18 10.5h.008v.008H18V10.5Z" />
-                                </svg>
-                            </button>
-                        </form>
-                        @else
-                        <span class="text-[11px] font-bold text-slate-400 dark:text-slate-500 px-2">{{ __('Donation invoices cannot be printed') }}</span>
-                        @endif
-                        {{-- 作廢：使用自製確認框 UI（不用瀏覽器原生 confirm） --}}
-                        <form id="invoice-void-form-{{ $order->invoice->id }}" method="POST" action="{{ route('admin.sales.invoices.void', $order->invoice) }}" class="hidden">
-                            @csrf
-                        </form>
-                        <button type="button" title="{{ __('Void Invoice') }}"
-                            @click="confirmVoidInvoice('invoice-void-form-{{ $order->invoice->id }}')"
-                            class="p-3 rounded-xl bg-white dark:bg-slate-800 text-slate-500 dark:text-slate-400 border border-slate-200 dark:border-slate-700 hover:bg-rose-500 hover:text-white hover:border-rose-500 transition-all duration-300 shadow-sm">
-                            <svg class="w-4 h-4 stroke-[2.2]" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                                <path stroke-linecap="round" stroke-linejoin="round" d="m9.75 9.75 4.5 4.5m0-4.5-4.5 4.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
-                            </svg>
-                        </button>
-                    @elseif(in_array($invStatus, ['pending', 'failed']))
-                        {{-- 查詢（對帳） --}}
-                        <form method="POST" action="{{ route('admin.sales.invoices.reconcile', $order->invoice) }}">
-                            @csrf
-                            <button type="submit" title="{{ __('Query') }}"
-                                class="p-3 rounded-xl bg-white dark:bg-slate-800 text-slate-500 dark:text-slate-400 border border-slate-200 dark:border-slate-700 hover:bg-amber-500 hover:text-white hover:border-amber-500 transition-all duration-300 shadow-sm">
-                                <svg class="w-4 h-4 stroke-[2.2]" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                                    <path stroke-linecap="round" stroke-linejoin="round" d="m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z" />
-                                </svg>
-                            </button>
-                        </form>
-                        {{-- 補開 --}}
-                        <form id="invoice-reissue-form-{{ $order->invoice->id }}" method="POST" action="{{ route('admin.sales.invoices.reissue', $order->invoice) }}" class="hidden">
-                            @csrf
-                        </form>
-                        <button type="button" title="{{ __('Re-issue') }}"
-                            @click="confirmReissueInvoice('invoice-reissue-form-{{ $order->invoice->id }}')"
-                            class="p-3 rounded-xl bg-white dark:bg-slate-800 text-slate-500 dark:text-slate-400 border border-slate-200 dark:border-slate-700 hover:bg-cyan-500 hover:text-white hover:border-cyan-500 transition-all duration-300 shadow-sm">
-                            <svg class="w-4 h-4 stroke-[2.2]" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                                <path stroke-linecap="round" stroke-linejoin="round" d="M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0 3.181 3.183a8.25 8.25 0 0 0 13.803-3.7M4.031 9.865a8.25 8.25 0 0 1 13.803-3.7l3.181 3.182m0-4.991v4.99" />
-                            </svg>
+                @if($invStatus === 'issued')
+                <div class="flex items-center gap-3">
+                    {{-- 列印（捐贈發票無紙本，僅非捐贈可列印） --}}
+                    @if($invPrintable)
+                    <form method="POST" action="{{ route('admin.sales.invoices.print', $order->invoice) }}" target="_blank">
+                        @csrf
+                        <button type="submit" class="flex-1 sm:flex-none px-6 py-3 rounded-xl bg-white dark:bg-slate-800 text-slate-600 dark:text-slate-300 font-bold text-xs border border-slate-200 dark:border-slate-700 hover:bg-indigo-500 hover:text-white hover:border-indigo-500 transition-all duration-300 shadow-sm">
+                            {{ __('Print Invoice') }}
                         </button>
+                    </form>
+                    @else
+                    <span class="text-[11px] font-bold text-slate-400 dark:text-slate-500 px-2">{{ __('Donation invoices cannot be printed') }}</span>
                     @endif
+                    {{-- 作廢：使用自製確認框 UI（不用瀏覽器原生 confirm） --}}
+                    <form id="invoice-void-form-{{ $order->invoice->id }}" method="POST" action="{{ route('admin.sales.invoices.void', $order->invoice) }}" class="hidden">
+                        @csrf
+                    </form>
+                    <button type="button" @click="confirmVoidInvoice('invoice-void-form-{{ $order->invoice->id }}')"
+                        class="flex-1 sm:flex-none px-6 py-3 rounded-xl bg-white dark:bg-slate-800 text-slate-600 dark:text-slate-300 font-bold text-xs border border-slate-200 dark:border-slate-700 hover:bg-rose-500 hover:text-white hover:border-rose-500 transition-all duration-300 shadow-sm">
+                        {{ __('Void Invoice') }}
+                    </button>
                 </div>
+                @endif
             </div>
         </div>
     </section>
diff --git a/resources/views/admin/sales/partials/tab-invoices.blade.php b/resources/views/admin/sales/partials/tab-invoices.blade.php
index 8219e52..f8bd0af 100644
--- a/resources/views/admin/sales/partials/tab-invoices.blade.php
+++ b/resources/views/admin/sales/partials/tab-invoices.blade.php
@@ -238,21 +238,27 @@
                 <td class="px-6 py-6 text-right" @click.stop>
                     <div class="flex items-center justify-end gap-1.5">
                         @if(in_array($st, ['pending', 'failed']))
+                        {{-- 查詢（對帳） --}}
                         <form method="POST" action="{{ route('admin.sales.invoices.reconcile', $invoice) }}">
                             @csrf
                             <button type="submit" title="{{ __('Query ECPay') }}"
-                                class="px-2.5 py-1.5 rounded-lg text-[11px] font-bold text-amber-600 dark:text-amber-400 bg-amber-500/5 hover:bg-amber-500/10 border border-amber-500/20 transition-all">
-                                {{ __('Query') }}
+                                class="p-2 rounded-xl text-slate-400 hover:text-amber-500 hover:bg-amber-500/5 dark:hover:bg-amber-500/10 border border-transparent hover:border-amber-500/20 transition-all">
+                                <svg class="w-4 h-4 stroke-[2.5]" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                    <path stroke-linecap="round" stroke-linejoin="round" d="m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z" />
+                                </svg>
                             </button>
                         </form>
-                        <form method="POST" action="{{ route('admin.sales.invoices.reissue', $invoice) }}"
-                            onsubmit="return confirm('{{ __('Re-issue this invoice?') }}')">
+                        {{-- 補開：使用自製確認框 UI --}}
+                        <form id="invoice-reissue-form-{{ $invoice->id }}" method="POST" action="{{ route('admin.sales.invoices.reissue', $invoice) }}" class="hidden">
                             @csrf
-                            <button type="submit" title="{{ __('Re-issue') }}"
-                                class="px-2.5 py-1.5 rounded-lg text-[11px] font-bold text-cyan-600 dark:text-cyan-400 bg-cyan-500/5 hover:bg-cyan-500/10 border border-cyan-500/20 transition-all">
-                                {{ __('Re-issue') }}
-                            </button>
                         </form>
+                        <button type="button" title="{{ __('Re-issue') }}"
+                            @click="confirmReissueInvoice('invoice-reissue-form-{{ $invoice->id }}')"
+                            class="p-2 rounded-xl text-slate-400 hover:text-cyan-500 hover:bg-cyan-500/5 dark:hover:bg-cyan-500/10 border border-transparent hover:border-cyan-500/20 transition-all">
+                            <svg class="w-4 h-4 stroke-[2.5]" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                <path stroke-linecap="round" stroke-linejoin="round" d="M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0 3.181 3.183a8.25 8.25 0 0 0 13.803-3.7M4.031 9.865a8.25 8.25 0 0 1 13.803-3.7l3.181 3.182m0-4.991v4.99" />
+                            </svg>
+                        </button>
                         @endif
                         {{-- 作廢按鈕僅在「訂單詳情」提供，列表操作欄不再顯示 --}}
                         <button @click="openDetail({{ $invoice->order_id }})"