feat: 完成進貨單自動拋轉應付帳款流程與AP介面優化

1. 新增 AccountPayable (應付帳款) 模組，包含 Migration、Model、Service 與 Controller
2. 修改 GoodsReceipt (進貨單) 流程，在確認進貨時自動產生對應的應付帳款單 (AP-YYYYMMDD-XX)
3. 實作應付帳款詳細頁面 (Show.tsx)，包含發票登記與標記付款功能
4. 修正應付帳款 Show 頁面的排版，將發票資訊套用標準的綠色背景區塊，並調整按鈕位置
5. 更新相關的 Service Provider 與 Routes

resources/js/Layouts/AuthenticatedLayout.tsx

@@ -225,15 +225,22 @@ export default function AuthenticatedLayout({
             id: "finance-management",
             label: "財務管理",
             icon: <Wallet className="h-5 w-5" />,
-            permission: "utility_fees.view",
+            permission: ["utility_fees.view", "account_payables.view"],
             children: [
                 {
                     id: "utility-fee-list",
                     label: "公共事業費",
                     icon: <FileText className="h-4 w-4" />,
-                    route: "/utility-fees",
+                    route: '/utility-fees',
                     permission: "utility_fees.view",
                 },
+                {
+                    id: "account-payable-list",
+                    label: "應付帳款",
+                    icon: <FileText className="h-4 w-4" />,
+                    route: '/finance/account-payables',
+                    permission: "account_payables.view", // 假設這為該功能的權限
+                },
             ],
         },
         {
@@ -246,14 +253,14 @@ export default function AuthenticatedLayout({
                     id: "accounting-report",
                     label: "會計報表",
                     icon: <FileSpreadsheet className="h-4 w-4" />,
-                    route: "/accounting-report",
+                    route: '/accounting-report',
                     permission: "accounting.view",
                 },
                 {
                     id: "inventory-report",
                     label: "庫存報表",
                     icon: <BarChart3 className="h-4 w-4" />,
-                    route: "/inventory/report",
+                    route: '/inventory/report',
                     permission: "inventory_report.view",
                 },
                 {
@@ -612,7 +619,7 @@ export default function AuthenticatedLayout({
                         {isCollapsed ? <PanelLeftOpen className="h-5 w-5" /> : <PanelLeftClose className="h-5 w-5" />}
                     </button>
                 </div>
-            </aside >
+            </aside>
 
             {/* Mobile Sidebar Overlay */}
             {
@@ -650,9 +657,10 @@ export default function AuthenticatedLayout({
                 "flex-1 flex flex-col transition-all duration-300 min-h-screen",
                 "lg:ml-64",
                 isCollapsed && "lg:ml-20",
-                "pt-16" // 始終為頁首保留空間
+                "pt-16",
+                "w-full min-w-0 overflow-x-hidden"
             )}>
-                <div className="relative flex-1 flex flex-col min-h-0">
+                <div className="relative flex-1 flex flex-col min-w-0 w-full">
                     <div className="container mx-auto px-6 pt-6 max-w-7xl shrink-0">
                         {breadcrumbs && breadcrumbs.length > 1 && (
                             <BreadcrumbNav items={breadcrumbs} className="mb-2" />
@@ -665,6 +673,6 @@ export default function AuthenticatedLayout({
                 </footer>
                 <Toaster richColors closeButton position="top-center" />
             </main>
-        </div >
+        </div>
     );
 }