feat: manual (#191)
Some checks failed
Spell Check / Spell Check with Typos (push) Failing after 6s

* feat: add markdown render deps

* feat: add manual route

* feat: example toc

* feat: add highlight js dependency

* feat: add view page

* feat: add translations for property and manual in English and Thai

* feat: enhance drawer menu with internationalization support and manual section

* feat: add conditional internationalization for sub-menu labels

* feat: add video support

* refactor: add stores and type

* fix: wrong path

* feat: improve layout structure and enhance scroll functionality in ViewPage

* fix: scroll not working

* chore: change variable name

* feat: show sub tile of manual

* feat: add translation for 'Table of Contents' in English and Thai

* feat: enhance layout and add conditional rendering for Table of Contents in ViewPage

* chore: clean

* refactor: use expansion

* refactor: show icon

* refactor: spacing

---------

Co-authored-by: Methapon2001 <61303214+Methapon2001@users.noreply.github.com>
Co-authored-by: Thanaphon Frappet <thanaphon@frappet.com>
This commit is contained in:
puriphatt 2025-03-18 09:58:45 +07:00 committed by GitHub
parent 364a0c807d
commit dc9f2b9e75
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
11 changed files with 788 additions and 41 deletions

244
pnpm-lock.yaml generated
View file

@ -8,6 +8,9 @@ importers:
.:
dependencies:
'@peaceroad/markdown-it-figure-with-p-caption':
specifier: ^0.11.0
version: 0.11.0
'@quasar/extras':
specifier: ^1.16.12
version: 1.16.12
@ -26,9 +29,33 @@ importers:
cropperjs:
specifier: ^1.6.2
version: 1.6.2
highlight.js:
specifier: ^11.11.1
version: 11.11.1
keycloak-js:
specifier: ^25.0.4
version: 25.0.4
markdown-it:
specifier: ^14.1.0
version: 14.1.0
markdown-it-anchor:
specifier: ^9.2.0
version: 9.2.0(@types/markdown-it@14.1.2)(markdown-it@14.1.0)
markdown-it-highlightjs:
specifier: ^4.2.0
version: 4.2.0
markdown-it-html5-embed:
specifier: ^1.0.0
version: 1.0.0
markdown-it-html5-media:
specifier: ^0.7.1
version: 0.7.1
markdown-it-image-figures:
specifier: ^2.1.1
version: 2.1.1(markdown-it@14.1.0)
markdown-it-video:
specifier: ^0.6.3
version: 0.6.3
mime:
specifier: ^4.0.4
version: 4.0.4
@ -99,6 +126,12 @@ importers:
'@quasar/app-vite':
specifier: 2.0.0-beta.19
version: 2.0.0-beta.19(@types/node@20.16.1)(eslint@8.57.0)(pinia@2.2.2(typescript@5.5.4)(vue@3.4.38(typescript@5.5.4)))(quasar@2.16.9)(rollup@4.21.0)(terser@5.31.0)(typescript@5.5.4)(vue-router@4.4.3(vue@3.4.38(typescript@5.5.4)))(vue@3.4.38(typescript@5.5.4))
'@types/markdown-it':
specifier: ^14.1.2
version: 14.1.2
'@types/markdown-it-highlightjs':
specifier: ^3.3.4
version: 3.3.4
'@types/node':
specifier: ^20.16.1
version: 20.16.1
@ -582,6 +615,9 @@ packages:
resolution: {integrity: sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==}
engines: {node: '>= 8'}
'@peaceroad/markdown-it-figure-with-p-caption@0.11.0':
resolution: {integrity: sha512-nU9H3KsuNCSNRdTX2TC1zeCrBJACUrkb6dtDAwjJ0SSAFLEVOrFgt3NC8WiiPeDdrCxoWa6Gl5td6gTyRzJzJw==}
'@pkgjs/parseargs@0.11.0':
resolution: {integrity: sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==}
engines: {node: '>=14'}
@ -800,6 +836,18 @@ packages:
'@types/json-schema@7.0.15':
resolution: {integrity: sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==}
'@types/linkify-it@5.0.0':
resolution: {integrity: sha512-sVDA58zAw4eWAffKOaQH5/5j3XeayukzDk+ewSsnv3p4yJEZHCCzMDiZM8e0OUrRvmpGZ85jf4yDHkHsgBNr9Q==}
'@types/markdown-it-highlightjs@3.3.4':
resolution: {integrity: sha512-hERRPIvWifT0006DIjg1IvuoBzlksk97kPmWjynejzTW9AISS92b/mpu3PFkAWlXYNFC52RqdhNKjdJZ6GC4wg==}
'@types/markdown-it@14.1.2':
resolution: {integrity: sha512-promo4eFwuiW+TfGxhi+0x3czqTYJkG8qB17ZUJiVF10Xm7NLVRSLUsfRTU/6h1e24VvRnXCx+hG7li58lkzog==}
'@types/mdurl@2.0.0':
resolution: {integrity: sha512-RGdgjQUZba5p6QEFAVx2OGb8rQDL/cPRG7GiedRzMcJ1tYnUANBncjbSB1NRGwbvjcPeikRABz2nshyPk1bhWg==}
'@types/mime@1.3.5':
resolution: {integrity: sha512-/pyBZWSLD2n0dcHE3hq8s8ZvcETHtEuF+3E7XVt0Ig2nvsVQXdghHVcEkIWjy9A0wKfTn97a/PSDYohKIlnP/w==}
@ -1108,6 +1156,9 @@ packages:
engines: {node: '>=10'}
deprecated: This package is no longer supported.
argparse@1.0.10:
resolution: {integrity: sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==}
argparse@2.0.1:
resolution: {integrity: sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==}
@ -1685,6 +1736,12 @@ packages:
resolution: {integrity: sha512-Nv9m36S/vxpsI+Hc4/ZGRs0n9mXqSWGGq49zxb/cJfPAQMbUtttJAlNPS4AQzaBdw/pKskw5bMbekT/Y7W/Wlg==}
engines: {node: '>=6.9.0'}
entities@1.1.2:
resolution: {integrity: sha512-f2LZMYl1Fzu7YSBKg+RoROelpOaNrcGmE9AZubeDfrCEia483oW4MI4VyFd5VNHIgQ/7qm1I0wUHK1eJnn2y2w==}
entities@2.1.0:
resolution: {integrity: sha512-hCx1oky9PFrJ611mf0ifBLBRW8lUUVRlFolb5gWRfIELabBlbp9xZvrqZLZAs+NxFnbfQoeGd8wDkygjg7U85w==}
entities@4.5.0:
resolution: {integrity: sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==}
engines: {node: '>=0.12'}
@ -2069,6 +2126,13 @@ packages:
resolution: {integrity: sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==}
engines: {node: '>= 0.4'}
highlight.js@10.7.3:
resolution: {integrity: sha512-tzcUFauisWKNHaRkN4Wjl/ZA07gENAjFl3J/c480dprkGTg5EQstgaNFqBfUqCq54kZRIEcreTsAgF/m2quD7A==}
highlight.js@11.11.1:
resolution: {integrity: sha512-Xwwo44whKBVCYoliBQwaPvtd/2tYFkRQtXDWj1nackaV2JPXx3L0+Jvd8/qCJ2p+ML0/XVkJ2q+Mr+UVdpJK5w==}
engines: {node: '>=12.0.0'}
hmac-drbg@1.0.1:
resolution: {integrity: sha512-Tti3gMqLdZfhOQY1Mzf/AanLiqh1WTiJgEj26ZuYQ9fbkLomzGchCws4FyrSd4VkpBfiNhaE1On+lOz894jvXg==}
@ -2347,6 +2411,15 @@ packages:
resolution: {integrity: sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ==}
engines: {node: '>= 0.8.0'}
linkify-it@2.2.0:
resolution: {integrity: sha512-GnAl/knGn+i1U/wjBz3akz2stz+HrHLsxMwHQGofCDfPvlf+gDKN58UtfmUquTY4/MXeE2x7k19KQmeoZi94Iw==}
linkify-it@3.0.3:
resolution: {integrity: sha512-ynTsyrFSdE5oZ/O9GEf00kPngmOfVwazR5GKDq6EYfhlpFug3J2zybX56a2PRRpc9P+FuSoGNAwjlbDs9jJBPQ==}
linkify-it@5.0.0:
resolution: {integrity: sha512-5aHCbzQRADcdP+ATqnDuhhJ/MRIqDkZX5pyjFHRRysS8vZ5AbqGEoFIb6pYHPZ+L/OC2Lc+xT8uHVVR5CAK/wQ==}
loader-runner@2.4.0:
resolution: {integrity: sha512-Jsmr89RcXGIwivFY21FcRrisYZfvLMTWx5kOLc+JTxtpBOG6xML0vzbc6SEQG2FO9/4Fc3wW4LVcB5DmGflaRw==}
engines: {node: '>=4.3.0 <5.0.0 || >=5.10'}
@ -2416,9 +2489,52 @@ packages:
resolution: {integrity: sha512-4y7uGv8bd2WdM9vpQsiQNo41Ln1NvhvDRuVt0k2JZQ+ezN2uaQes7lZeZ+QQUHOLQAtDaBJ+7wCbi+ab/KFs+w==}
engines: {node: '>=0.10.0'}
markdown-it-anchor@9.2.0:
resolution: {integrity: sha512-sa2ErMQ6kKOA4l31gLGYliFQrMKkqSO0ZJgGhDHKijPf0pNFM9vghjAh3gn26pS4JDRs7Iwa9S36gxm3vgZTzg==}
peerDependencies:
'@types/markdown-it': '*'
markdown-it: '*'
markdown-it-highlightjs@4.2.0:
resolution: {integrity: sha512-NC7pXE8KkOl6xWJVRNt8p6wgJVznXKsE0HgYGdk6DD2tn1l4L9f0ALf3VIoGVkotNU1uGQatSxfBF1zZPUMmuQ==}
markdown-it-html5-embed@1.0.0:
resolution: {integrity: sha512-SPgugO/1+/9sZcgxoxijoTHSUpCUgFCNe1MSuTmDxDkV6NQrVzMclhRMFgE/rcHO+2rhIg3U7Oy80XA/E8ytpg==}
markdown-it-html5-media@0.7.1:
resolution: {integrity: sha512-PfKFD+K1Vpw8+OwfV/VO6Y5Sy1xSS/F1BgbW8Q281LylBBoW47fm4k9Zh0IpsPpM3/HObBD6rooMTaMVlC3PqA==}
engines: {node: '>=10.0'}
markdown-it-image-figures@2.1.1:
resolution: {integrity: sha512-mwXSQ2nPeVUzCMIE3HlLvjRioopiqyJLNph0pyx38yf9mpqFDhNGnMpAXF9/A2Xv0oiF2cVyg9xwfF0HNAz05g==}
engines: {node: '>=12.0.0'}
peerDependencies:
markdown-it: '*'
markdown-it-video@0.6.3:
resolution: {integrity: sha512-T4th1kwy0OcvyWSN4u3rqPGxvbDclpucnVSSaH3ZacbGsAts964dxokx9s/I3GYsrDCJs4ogtEeEeVP18DQj0Q==}
markdown-it@12.3.2:
resolution: {integrity: sha512-TchMembfxfNVpHkbtriWltGWc+m3xszaRD0CZup7GFFhzIgQqxIfn3eGj1yZpfuflzPvfkt611B2Q/Bsk1YnGg==}
hasBin: true
markdown-it@14.1.0:
resolution: {integrity: sha512-a54IwgWPaeBCAAsv13YgmALOF1elABB08FxO9i+r4VFk5Vl4pKokRPeX8u5TCgSsPi6ec1otfLjdOpVcgbpshg==}
hasBin: true
markdown-it@8.4.2:
resolution: {integrity: sha512-GcRz3AWTqSUphY3vsUqQSFMbgR38a4Lh3GWlHRh/7MRwz8mcu9n2IO7HOh+bXHrR9kOPDl5RNCaEsrneb+xhHQ==}
hasBin: true
md5.js@1.3.5:
resolution: {integrity: sha512-xitP+WxNPcTTOgnTJcrhM0xvdPepipPSf3I8EIpGKeFLjt3PlJLIDG3u8EX53ZIubkb+5U2+3rELYpEhHhzdkg==}
mdurl@1.0.1:
resolution: {integrity: sha512-/sKlQJCBYVY9Ers9hqzKou4H6V5UWc/M59TH2dvkt+84itfnq7uFOMLpOiOS4ujvHP4etln18fmIxA5R5fll0g==}
mdurl@2.0.0:
resolution: {integrity: sha512-Lf+9+2r+Tdp5wXDXC4PcIBjTDtq4UKjCPMQhKIuzpJNW0b96kVqSwW0bT7FhRSfmAiFYgP+SCRvdrDozfh0U5w==}
media-typer@0.3.0:
resolution: {integrity: sha512-dq+qelQ9akHpcOl/gUVRTxVIOkAJ1wR3QAvb4RsVjS8oVoFjDGTc679wJYmUmknUF5HwMLOgb5O+a3KxfWapPQ==}
engines: {node: '>= 0.6'}
@ -2479,6 +2595,9 @@ packages:
resolution: {integrity: sha512-wXqjST+SLt7R009ySCglWBCFpjUygmCIfD790/kVbiGmUgfYGuB14PiTd5DwVxSV4NcYHjzMkoj5LjQZwTQLEA==}
engines: {node: '>=8'}
mimoza@1.0.0:
resolution: {integrity: sha512-+j7SSye/hablu66K/jjeyPmk6WL8RoXfeZ+MMn37vSNDGuaWY/5wm10LpSpxAHX4kNoEwkTWYHba8ePVip+Hqg==}
minimalistic-assert@1.0.1:
resolution: {integrity: sha512-UtJcAD4yEaGtjPezWuO9wC4nwUnVH/8/Im3yEHQP4b67cXlD/Qr9hdITCU1xDbSEXg2XKNaP8jsReV7vQd00/A==}
@ -2718,6 +2837,9 @@ packages:
resolution: {integrity: sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==}
engines: {node: '>=6'}
p7d-markdown-it-p-captions@0.16.0:
resolution: {integrity: sha512-y9jgjgyBRzgoA+Oj10Pu8eyEcr0PRQIu1Zo6iwesWY31Uc7oK3P4LA90JdVhgwkzKpd1hoC6QHymuswgELqk9w==}
package-json-from-dist@1.0.0:
resolution: {integrity: sha512-dATvCeZN/8wQsGywez1mzHtTlP22H8OEfPrVMLNr4/eGa+ijtLn/6M5f0dY8UKNrC2O9UCU6SSoG3qRKnt7STw==}
@ -2908,6 +3030,10 @@ packages:
pumpify@1.5.1:
resolution: {integrity: sha512-oClZI37HvuUJJxSKKrC17bZ9Cu0ZYhEAGPsPUy9KlMUmv9dKX2o77RUmq7f3XjIxbwyGwYzbzQ1L2Ks8sIradQ==}
punycode.js@2.3.1:
resolution: {integrity: sha512-uxFIHU0YlHYhDQtV4R9J6a52SLx28BCjT+4ieh7IGbgwVJWO+km431c4yRlREUAsAmt/uMjQUyQHNEPf0M39CA==}
engines: {node: '>=6'}
punycode@1.4.1:
resolution: {integrity: sha512-jmYNElW7yvO7TV33CjSmvSiE2yco3bV2czu/OzDKdMNVZQWfxCblURLhf+47syQRBntjfLdd/H0egrzIG+oaFQ==}
@ -3256,6 +3382,9 @@ packages:
resolution: {integrity: sha512-NzNVhJDYpwceVVii8/Hu6DKfD2G+NrQHlS/V/qgv763EYudVwEcMQNxd2lh+0VrUByXN/oJkl5grOhYWvQUYiw==}
engines: {node: '>=0.10.0'}
sprintf-js@1.0.3:
resolution: {integrity: sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g==}
ssri@6.0.2:
resolution: {integrity: sha512-cepbSq/neFK7xB6A50KHN0xHDotYzq58wWCa5LeWqnPrHG8GzfEjO/4O8kpmcGW+oaxkvhEJCWgbgNk4/ZV93Q==}
@ -3451,6 +3580,12 @@ packages:
engines: {node: '>=14.17'}
hasBin: true
uc.micro@1.0.6:
resolution: {integrity: sha512-8Y75pvTYkLJW2hWQHXxoqRgV7qb9B+9vFEtidML+7koHUFapnVJAZ6cKs+Qjz5Aw3aZWHMC6u0wJE3At+nSGwA==}
uc.micro@2.1.0:
resolution: {integrity: sha512-ARDJmphmdvUk6Glw7y9DQ2bFkKBHwQHLi2lsaH6PPmz/Ka9sFOBsBluozhDltWmnv9u/cF6Rt87znRTPV+yp/A==}
udsv@0.6.0:
resolution: {integrity: sha512-na+0EoqqpDeNKZ0HVTtgYtFP9aQgsMwPM77UEK7g4OX2C42w+Qw7QZs9t1ocDGLidtcKJnsPy+o5XrBYaZfzCA==}
@ -4090,6 +4225,10 @@ snapshots:
'@nodelib/fs.scandir': 2.1.5
fastq: 1.17.1
'@peaceroad/markdown-it-figure-with-p-caption@0.11.0':
dependencies:
p7d-markdown-it-p-captions: 0.16.0
'@pkgjs/parseargs@0.11.0':
optional: true
@ -4304,6 +4443,20 @@ snapshots:
'@types/json-schema@7.0.15': {}
'@types/linkify-it@5.0.0': {}
'@types/markdown-it-highlightjs@3.3.4':
dependencies:
'@types/markdown-it': 14.1.2
highlight.js: 10.7.3
'@types/markdown-it@14.1.2':
dependencies:
'@types/linkify-it': 5.0.0
'@types/mdurl': 2.0.0
'@types/mdurl@2.0.0': {}
'@types/mime@1.3.5': {}
'@types/node-forge@1.3.11':
@ -4729,6 +4882,10 @@ snapshots:
readable-stream: 3.6.2
optional: true
argparse@1.0.10:
dependencies:
sprintf-js: 1.0.3
argparse@2.0.1: {}
arr-diff@4.0.0: {}
@ -5418,6 +5575,10 @@ snapshots:
memory-fs: 0.5.0
tapable: 1.1.3
entities@1.1.2: {}
entities@2.1.0: {}
entities@4.5.0: {}
errno@0.1.8:
@ -5957,6 +6118,10 @@ snapshots:
dependencies:
function-bind: 1.1.2
highlight.js@10.7.3: {}
highlight.js@11.11.1: {}
hmac-drbg@1.0.1:
dependencies:
hash.js: 1.1.7
@ -6217,6 +6382,18 @@ snapshots:
prelude-ls: 1.2.1
type-check: 0.4.0
linkify-it@2.2.0:
dependencies:
uc.micro: 1.0.6
linkify-it@3.0.3:
dependencies:
uc.micro: 1.0.6
linkify-it@5.0.0:
dependencies:
uc.micro: 2.1.0
loader-runner@2.4.0: {}
loader-utils@1.4.2:
@ -6289,12 +6466,65 @@ snapshots:
dependencies:
object-visit: 1.0.1
markdown-it-anchor@9.2.0(@types/markdown-it@14.1.2)(markdown-it@14.1.0):
dependencies:
'@types/markdown-it': 14.1.2
markdown-it: 14.1.0
markdown-it-highlightjs@4.2.0:
dependencies:
highlight.js: 11.11.1
markdown-it-html5-embed@1.0.0:
dependencies:
markdown-it: 8.4.2
mimoza: 1.0.0
markdown-it-html5-media@0.7.1:
dependencies:
markdown-it: 12.3.2
markdown-it-image-figures@2.1.1(markdown-it@14.1.0):
dependencies:
markdown-it: 14.1.0
markdown-it-video@0.6.3: {}
markdown-it@12.3.2:
dependencies:
argparse: 2.0.1
entities: 2.1.0
linkify-it: 3.0.3
mdurl: 1.0.1
uc.micro: 1.0.6
markdown-it@14.1.0:
dependencies:
argparse: 2.0.1
entities: 4.5.0
linkify-it: 5.0.0
mdurl: 2.0.0
punycode.js: 2.3.1
uc.micro: 2.1.0
markdown-it@8.4.2:
dependencies:
argparse: 1.0.10
entities: 1.1.2
linkify-it: 2.2.0
mdurl: 1.0.1
uc.micro: 1.0.6
md5.js@1.3.5:
dependencies:
hash-base: 3.1.0
inherits: 2.0.4
safe-buffer: 5.2.1
mdurl@1.0.1: {}
mdurl@2.0.0: {}
media-typer@0.3.0: {}
memory-fs@0.4.1:
@ -6356,6 +6586,10 @@ snapshots:
mimic-response@2.1.0:
optional: true
mimoza@1.0.0:
dependencies:
mime-db: 1.52.0
minimalistic-assert@1.0.1: {}
minimalistic-crypto-utils@1.0.1: {}
@ -6637,6 +6871,8 @@ snapshots:
p-try@2.2.0: {}
p7d-markdown-it-p-captions@0.16.0: {}
package-json-from-dist@1.0.0: {}
pako@1.0.11: {}
@ -6820,6 +7056,8 @@ snapshots:
inherits: 2.0.4
pump: 2.0.1
punycode.js@2.3.1: {}
punycode@1.4.1: {}
punycode@2.3.1: {}
@ -7223,6 +7461,8 @@ snapshots:
dependencies:
extend-shallow: 3.0.2
sprintf-js@1.0.3: {}
ssri@6.0.2:
dependencies:
figgy-pudding: 3.5.2
@ -7448,6 +7688,10 @@ snapshots:
typescript@5.5.4: {}
uc.micro@1.0.6: {}
uc.micro@2.1.0: {}
udsv@0.6.0: {}
ufo@1.5.3: {}