Merge pull request #2470 from visuddhinanda/development

feat(reader): 阅读页右上角新增分享按钮，二维码分享当前页面

api-v13/resources/js/modules/share.js

@@ -0,0 +1,36 @@
+// resources/js/modules/share.js
+// 阅读页「分享」入口：点击「二维码」弹出 Modal，用 qrcode 生成当前页面 URL 的二维码。
+// 仅在有 #shareQrModal / #shareQrCanvas 的页面（library/book/read）生效。
+
+import QRCode from "qrcode";
+
+function initShare() {
+    const modalEl = document.getElementById("shareQrModal");
+    const canvas = document.getElementById("shareQrCanvas");
+
+    if (!modalEl || !canvas) {
+        return;
+    }
+
+    modalEl.addEventListener("show.bs.modal", async () => {
+        try {
+            await QRCode.toCanvas(canvas, window.location.href, {
+                width: 240,
+                margin: 2,
+                errorCorrectionLevel: "M",
+                color: {
+                    dark: "#1d273b",
+                    light: "#ffffff",
+                },
+            });
+        } catch (err) {
+            console.warn("[WikiPāli] QR code generation failed", err);
+        }
+    });
+}
+
+if (document.readyState === "loading") {
+    document.addEventListener("DOMContentLoaded", initShare);
+} else {
+    initShare();
+}

api-v13/resources/lang/en/library.php

@@ -135,6 +135,10 @@ return [
     'cancel' => 'Cancel',
     'confirm' => 'OK',
     'no_toc' => 'This book has no table of contents',
+    'share' => 'Share',
+    'share_qr' => 'QR Code',
+    'share_qr_title' => 'Share via QR Code',
+    'share_qr_hint' => 'Scan with your phone to open this page',
 
     // course (course/index.blade.php + course/history.blade.php)
     'course' => 'Courses',

api-v13/resources/lang/lo/library.php

@@ -134,6 +134,10 @@ return [
     'cancel' => 'ຍົກເລີກ',
     'confirm' => 'ຕົກລົງ',
     'no_toc' => 'ໜັງສືເຫຼັ້ມນີ້ບໍ່ມີສາລະບານ',
+    'share' => 'ແບ່ງປັນ',
+    'share_qr' => 'QR ລະຫັດ',
+    'share_qr_title' => 'ແບ່ງປັນຜ່ານ QR',
+    'share_qr_hint' => 'ສະແກນດ້ວຍໂທລະສັບເພື່ອເປີດໜ້ານີ້',
 
     // course (course/index.blade.php + course/history.blade.php)
     'course' => 'ຫຼັກສູດ',

api-v13/resources/lang/my/library.php

@@ -134,4 +134,8 @@ return [
     'cancel' => 'မလုပ်တော့',
     'confirm' => 'အတည်ပြုပါ',
     'no_toc' => 'ဤစာအုပ်တွင် မာတိကာမရှိပါ',
+    'share' => 'မျှဝေရန်',
+    'share_qr' => 'QR ကုဒ်',
+    'share_qr_title' => 'QR ကုဒ်ဖြင့် မျှဝေရန်',
+    'share_qr_hint' => 'ဤစာမျက်နှာကို ဖွင့်ရန် ဖုန်းဖြင့် စကင်ဖတ်ပါ',
 ];

api-v13/resources/lang/si/library.php

@@ -134,4 +134,8 @@ return [
     'cancel' => 'අවලංගු කරන්න',
     'confirm' => 'හරි',
     'no_toc' => 'මෙම ග්‍රන්ථයට පටුනයක් නොමැත',
+    'share' => 'බෙදාගන්න',
+    'share_qr' => 'QR කේතය',
+    'share_qr_title' => 'QR කේතයෙන් බෙදාගන්න',
+    'share_qr_hint' => 'මෙම පිටුව විවෘත කිරීමට දුරකථනයෙන් ස්කෑන් කරන්න',
 ];

api-v13/resources/lang/th/library.php

@@ -134,4 +134,8 @@ return [
     'cancel' => 'ยกเลิก',
     'confirm' => 'ตกลง',
     'no_toc' => 'หนังสือเล่มนี้ไม่มีสารบัญ',
+    'share' => 'แชร์',
+    'share_qr' => 'คิวอาร์โค้ด',
+    'share_qr_title' => 'แชร์ผ่านคิวอาร์โค้ด',
+    'share_qr_hint' => 'สแกนด้วยโทรศัพท์เพื่อเปิดหน้านี้',
 ];

api-v13/resources/lang/vi/library.php

@@ -134,6 +134,10 @@ return [
     'cancel' => 'Hủy',
     'confirm' => 'Đồng ý',
     'no_toc' => 'Sách này không có mục lục',
+    'share' => 'Chia sẻ',
+    'share_qr' => 'Mã QR',
+    'share_qr_title' => 'Chia sẻ qua mã QR',
+    'share_qr_hint' => 'Quét bằng điện thoại để mở trang này',
 
     // course (course/index.blade.php + course/history.blade.php)
     'course' => 'Khóa học',

api-v13/resources/lang/zh-Hans/library.php

@@ -135,6 +135,10 @@ return [
     'cancel' => '取消',
     'confirm' => '确定',
     'no_toc' => '此书没有目录',
+    'share' => '分享',
+    'share_qr' => '二维码',
+    'share_qr_title' => '扫码分享',
+    'share_qr_hint' => '使用手机扫码打开本页',
     'pāḷi' => '巴利原典',
     'aṭṭhakathā' => '义注',
     'ṭīkā' => '复注',

api-v13/resources/lang/zh-Hant/library.php

@@ -135,6 +135,10 @@ return [
     'cancel' => '取消',
     'confirm' => '確定',
     'no_toc' => '本書無目錄',
+    'share' => '分享',
+    'share_qr' => 'QR 碼',
+    'share_qr_title' => '掃碼分享',
+    'share_qr_hint' => '使用手機掃碼打開本頁',
 
     // course (course/index.blade.php + course/history.blade.php)
     'course' => '課程',

api-v13/resources/views/library/book/read.blade.php

@@ -10,7 +10,7 @@
 
 {{-- 术语抽屉（所有阅读页统一使用 wiki.term-drawer） --}}
 @push('scripts')
-@vite(['resources/js/modules/term-tooltip.js','resources/js/reader.js'])
+@vite(['resources/js/modules/term-tooltip.js','resources/js/reader.js','resources/js/modules/share.js'])
 @endpush
 
 @section('reader-content')
@@ -42,6 +42,30 @@
 
         <div class="navbar-nav flex-row order-md-last align-items-center">
 
+            {{-- 分享 --}}
+            <div class="nav-item dropdown me-2">
+                <a href="#"
+                    class="nav-link"
+                    role="button"
+                    data-bs-toggle="dropdown"
+                    aria-expanded="false"
+                    aria-label="{{ __('library.share') }}">
+                    <i class="ti ti-share me-1 d-none d-md-inline"></i>
+                    <span class="d-none d-md-inline">{{ __('library.share') }}</span>
+                    <i class="ti ti-share d-md-none"></i>
+                </a>
+                <ul class="dropdown-menu dropdown-menu-end">
+                    <li>
+                        <button type="button"
+                            class="dropdown-item"
+                            data-bs-toggle="modal"
+                            data-bs-target="#shareQrModal">
+                            <i class="ti ti-qrcode me-2"></i>{{ __('library.share_qr') }}
+                        </button>
+                    </li>
+                </ul>
+            </div>
+
             {{-- 编辑器按钮 --}}
             @if(!empty($editor_link))
             <div class="nav-item me-2">
@@ -333,6 +357,24 @@
     </div>
 </div>
 
+{{-- 分享二维码 Modal --}}
+<div class="modal modal-blur fade" id="shareQrModal" tabindex="-1" aria-hidden="true">
+    <div class="modal-dialog modal-dialog-centered modal-sm">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title">{{ __('library.share_qr_title') }}</h5>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="{{ __('library.cancel') }}"></button>
+            </div>
+            <div class="modal-body text-center">
+                <div class="d-inline-block p-3 bg-white rounded-2">
+                    <canvas id="shareQrCanvas" width="240" height="240" class="d-block" aria-label="{{ __('library.share_qr_title') }}"></canvas>
+                </div>
+                <p class="text-muted small mt-3 mb-0">{{ __('library.share_qr_hint') }}</p>
+            </div>
+        </div>
+    </div>
+</div>
+
 @endsection
 
 @push('scripts')

api-v13/vite.config.ts

@@ -21,6 +21,7 @@ export default defineConfig({
                 'resources/js/app.js',
                 'resources/js/reader.js',
                 'resources/js/modules/term-tooltip.js',
+                'resources/js/modules/share.js',
             ],
             refresh: true,
         }),