Compare commits
20 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| c4464e1202 | |||
| eca669d62a | |||
| b1804ae060 | |||
| 78fe779c93 | |||
| 3a6d10c2ec | |||
| 7c46970dfe | |||
| eda629e58d | |||
| 51b20c860f | |||
| 7e0087a7db | |||
| 8ff45e210c | |||
| f60bf907b1 | |||
| f5d3e7ea88 | |||
| eb5b28249f | |||
| 8d248a44ff | |||
| 3778dbe57c | |||
| a942019c81 | |||
| 0088918502 | |||
| 2a02f8f374 | |||
| 50ae8fb2a5 | |||
| 8100fe2a41 |
@ -1,15 +1,31 @@
|
|||||||
name: Node.js CI
|
name: Build
|
||||||
|
|
||||||
on:
|
on:
|
||||||
push:
|
push:
|
||||||
tags:
|
tags:
|
||||||
- 'v*' # 匹配所有 tag（也可改为 v* 等更具体的匹配）
|
- 'v*'
|
||||||
|
|
||||||
jobs:
|
jobs:
|
||||||
build-and-test:
|
build-and-test:
|
||||||
runs-on: ubuntu-latest
|
runs-on: ubuntu-latest
|
||||||
|
|
||||||
steps:
|
steps:
|
||||||
|
- name: 获取 Tag 名称
|
||||||
|
id: extract_tag
|
||||||
|
run: echo "tag=${GITHUB_REF##*/}" >> $GITHUB_OUTPUT
|
||||||
|
|
||||||
|
- name: 通知：开始构建
|
||||||
|
run: |
|
||||||
|
TAG=${{ steps.extract_tag.outputs.tag }}
|
||||||
|
curl -X POST http://10.0.0.3:52222/send \
|
||||||
|
-H "Content-Type: application/json" \
|
||||||
|
-d @- <<EOF
|
||||||
|
{
|
||||||
|
"alias": "ci",
|
||||||
|
"message": "[AO3 Mirror SSR][${TAG}]\n开始构建..."
|
||||||
|
}
|
||||||
|
EOF
|
||||||
|
|
||||||
- name: 检出代码
|
- name: 检出代码
|
||||||
uses: actions/checkout@v3
|
uses: actions/checkout@v3
|
||||||
|
|
||||||
@ -40,6 +56,18 @@ jobs:
|
|||||||
cp server.js index.html package.json build-out/
|
cp server.js index.html package.json build-out/
|
||||||
zip -r output.zip build-out
|
zip -r output.zip build-out
|
||||||
|
|
||||||
|
- name: 通知：构建完成
|
||||||
|
run: |
|
||||||
|
TAG=${{ steps.extract_tag.outputs.tag }}
|
||||||
|
curl -X POST http://10.0.0.3:52222/send \
|
||||||
|
-H "Content-Type: application/json" \
|
||||||
|
-d @- <<EOF
|
||||||
|
{
|
||||||
|
"alias": "ci",
|
||||||
|
"message": "[AO3 Mirror SSR][${TAG}]\n构建完成✅"
|
||||||
|
}
|
||||||
|
EOF
|
||||||
|
|
||||||
- name: 设置 SSH 私钥
|
- name: 设置 SSH 私钥
|
||||||
run: |
|
run: |
|
||||||
mkdir -p ~/.ssh
|
mkdir -p ~/.ssh
|
||||||
@ -49,9 +77,6 @@ jobs:
|
|||||||
echo " StrictHostKeyChecking no" >> ~/.ssh/config
|
echo " StrictHostKeyChecking no" >> ~/.ssh/config
|
||||||
echo " UserKnownHostsFile=/dev/null" >> ~/.ssh/config
|
echo " UserKnownHostsFile=/dev/null" >> ~/.ssh/config
|
||||||
|
|
||||||
- name: 获取 Tag 名称
|
|
||||||
id: extract_tag
|
|
||||||
run: echo "tag=${GITHUB_REF##*/}" >> $GITHUB_OUTPUT
|
|
||||||
|
|
||||||
- name: 上传产物到远程服务器
|
- name: 上传产物到远程服务器
|
||||||
run: |
|
run: |
|
||||||
@ -59,4 +84,14 @@ jobs:
|
|||||||
scp output.zip default@10.0.0.3:/srv/publish/ao3-mirror-ssr/${TAG}.zip
|
scp output.zip default@10.0.0.3:/srv/publish/ao3-mirror-ssr/${TAG}.zip
|
||||||
ssh default@10.0.0.3 sh -c 'cd /srv/publish/ao3-mirror-ssr/; rm -f latest.zip; ln -s ${TAG}.zip latest.zip'
|
ssh default@10.0.0.3 sh -c 'cd /srv/publish/ao3-mirror-ssr/; rm -f latest.zip; ln -s ${TAG}.zip latest.zip'
|
||||||
|
|
||||||
|
- name: 通知：上传完成
|
||||||
|
run: |
|
||||||
|
TAG=${{ steps.extract_tag.outputs.tag }}
|
||||||
|
curl -X POST http://10.0.0.3:52222/send \
|
||||||
|
-H "Content-Type: application/json" \
|
||||||
|
-d @- <<EOF
|
||||||
|
{
|
||||||
|
"alias": "ci",
|
||||||
|
"message": "[AO3 Mirror SSR][${TAG}]\n上传完成✅"
|
||||||
|
}
|
||||||
|
EOF
|
||||||
|
|||||||
@ -1,9 +1,9 @@
|
|||||||
<!doctype html>
|
<!doctype html>
|
||||||
<html>
|
<html lang="zh-CN">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<link rel="icon" type="image/svg" href="/favicon.svg">
|
<link rel="icon" type="image/svg" href="/favicon.svg" />
|
||||||
<!--app-head-->
|
<!--app-head-->
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|||||||
355
package-lock.json
generated
355
package-lock.json
generated
@ -9,13 +9,15 @@
|
|||||||
"version": "0.0.0",
|
"version": "0.0.0",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@mdui/icons": "^1.0.2",
|
"@mdui/icons": "^1.0.2",
|
||||||
|
"@vueuse/core": "^13.3.0",
|
||||||
|
"@vueuse/integrations": "^13.3.0",
|
||||||
"axios": "^1.9.0",
|
"axios": "^1.9.0",
|
||||||
"compress-json": "^3.1.1",
|
"compress-json": "^3.1.1",
|
||||||
"cookie-parser": "^1.4.7",
|
"cookie-parser": "^1.4.7",
|
||||||
"express": "^5.1.0",
|
"express": "^5.1.0",
|
||||||
"mdui": "^2.1.3",
|
"mdui": "^2.1.4",
|
||||||
"pinia": "^3.0.2",
|
"pinia": "^3.0.2",
|
||||||
"vue": "^3.5.13",
|
"vue": "^3.5.15",
|
||||||
"vue-router": "^4.5.1"
|
"vue-router": "^4.5.1"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
@ -24,7 +26,7 @@
|
|||||||
"cross-env": "^7.0.3",
|
"cross-env": "^7.0.3",
|
||||||
"markdown-it-anchor": "^9.2.0",
|
"markdown-it-anchor": "^9.2.0",
|
||||||
"markdown-it-attrs": "^4.3.1",
|
"markdown-it-attrs": "^4.3.1",
|
||||||
"sass": "^1.88.0",
|
"sass": "^1.89.0",
|
||||||
"vite": "^6.3.5",
|
"vite": "^6.3.5",
|
||||||
"vite-plugin-md": "^0.21.5",
|
"vite-plugin-md": "^0.21.5",
|
||||||
"vite-plugin-vue-devtools": "^7.7.6"
|
"vite-plugin-vue-devtools": "^7.7.6"
|
||||||
@ -288,17 +290,17 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@babel/helper-string-parser": {
|
"node_modules/@babel/helper-string-parser": {
|
||||||
"version": "7.25.9",
|
"version": "7.27.1",
|
||||||
"resolved": "https://registry.npmmirror.com/@babel/helper-string-parser/-/helper-string-parser-7.25.9.tgz",
|
"resolved": "https://registry.npmmirror.com/@babel/helper-string-parser/-/helper-string-parser-7.27.1.tgz",
|
||||||
"integrity": "sha512-4A/SCr/2KLd5jrtOMFzaKjVtAei3+2r/NChoBNoZ3EyP/+GlhoaEGoWOZUmFmoITP7zOJyHIMm+DYRd8o3PvHA==",
|
"integrity": "sha512-qMlSxKbpRlAridDExk92nSobyDdpPijUq2DW6oDnUqd0iOGxmQjyqhMIihI9+zv4LPyZdRje2cavWPbCbWm3eA==",
|
||||||
"engines": {
|
"engines": {
|
||||||
"node": ">=6.9.0"
|
"node": ">=6.9.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@babel/helper-validator-identifier": {
|
"node_modules/@babel/helper-validator-identifier": {
|
||||||
"version": "7.25.9",
|
"version": "7.27.1",
|
||||||
"resolved": "https://registry.npmmirror.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.25.9.tgz",
|
"resolved": "https://registry.npmmirror.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.27.1.tgz",
|
||||||
"integrity": "sha512-Ed61U6XJc3CVRfkERJWDz4dJwKe7iLmmJsbOGu9wSloNSFttHV0I8g6UAgb7qnK5ly5bGLPd4oXZlxCdANBOWQ==",
|
"integrity": "sha512-D2hP9eA+Sqx1kBZgzxZh0y1trbuU+JoDkiEwqhQ36nodYqJwyEIhPSdMNd7lOm/4io72luTPWH20Yda0xOuUow==",
|
||||||
"engines": {
|
"engines": {
|
||||||
"node": ">=6.9.0"
|
"node": ">=6.9.0"
|
||||||
}
|
}
|
||||||
@ -326,11 +328,11 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@babel/parser": {
|
"node_modules/@babel/parser": {
|
||||||
"version": "7.26.9",
|
"version": "7.27.3",
|
||||||
"resolved": "https://registry.npmmirror.com/@babel/parser/-/parser-7.26.9.tgz",
|
"resolved": "https://registry.npmmirror.com/@babel/parser/-/parser-7.27.3.tgz",
|
||||||
"integrity": "sha512-81NWa1njQblgZbQHxWHpxxCzNsa3ZwvFqpUg7P+NNUU6f3UU2jBEg4OlF/J6rl8+PQGh1q6/zWScd001YwcA5A==",
|
"integrity": "sha512-xyYxRj6+tLNDTWi0KCBcZ9V7yg3/lwL9DWh9Uwh/RIVlIfFidggcgxKX3GCXwCiswwcGRawBKbEg2LG/Y8eJhw==",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@babel/types": "^7.26.9"
|
"@babel/types": "^7.27.3"
|
||||||
},
|
},
|
||||||
"bin": {
|
"bin": {
|
||||||
"parser": "bin/babel-parser.js"
|
"parser": "bin/babel-parser.js"
|
||||||
@ -503,12 +505,12 @@
|
|||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"node_modules/@babel/types": {
|
"node_modules/@babel/types": {
|
||||||
"version": "7.26.9",
|
"version": "7.27.3",
|
||||||
"resolved": "https://registry.npmmirror.com/@babel/types/-/types-7.26.9.tgz",
|
"resolved": "https://registry.npmmirror.com/@babel/types/-/types-7.27.3.tgz",
|
||||||
"integrity": "sha512-Y3IR1cRnOxOCDvMmNiym7XpXQ93iGDDPHx+Zj+NM+rg0fBaShfQLkg+hKPaZCEvg5N/LeCo4+Rj/i3FuJsIQaw==",
|
"integrity": "sha512-Y1GkI4ktrtvmawoSq+4FCVHNryea6uR+qUQy0AGxLSsjCX0nVmkYQMBLHDkXZuo5hGx7eYdnIaslsdBFm7zbUw==",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@babel/helper-string-parser": "^7.25.9",
|
"@babel/helper-string-parser": "^7.27.1",
|
||||||
"@babel/helper-validator-identifier": "^7.25.9"
|
"@babel/helper-validator-identifier": "^7.27.1"
|
||||||
},
|
},
|
||||||
"engines": {
|
"engines": {
|
||||||
"node": ">=6.9.0"
|
"node": ">=6.9.0"
|
||||||
@ -1007,9 +1009,9 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@lit/reactive-element": {
|
"node_modules/@lit/reactive-element": {
|
||||||
"version": "2.0.4",
|
"version": "2.1.0",
|
||||||
"resolved": "https://registry.npmmirror.com/@lit/reactive-element/-/reactive-element-2.0.4.tgz",
|
"resolved": "https://registry.npmmirror.com/@lit/reactive-element/-/reactive-element-2.1.0.tgz",
|
||||||
"integrity": "sha512-GFn91inaUa2oHLak8awSIigYz0cU0Payr1rcFsrkf5OJ5eSPxElyZfKh0f2p9FsTiZWXQdWGJeXZICEfXXYSXQ==",
|
"integrity": "sha512-L2qyoZSQClcBmq0qajBVbhYEcG6iK0XfLn66ifLe/RfC0/ihpc+pl0Wdn8bJ8o+hj38cG0fGXRgSS20MuXn7qA==",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@lit-labs/ssr-dom-shim": "^1.2.0"
|
"@lit-labs/ssr-dom-shim": "^1.2.0"
|
||||||
}
|
}
|
||||||
@ -1030,24 +1032,24 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@mdui/jq": {
|
"node_modules/@mdui/jq": {
|
||||||
"version": "3.0.2",
|
"version": "3.0.3",
|
||||||
"resolved": "https://registry.npmmirror.com/@mdui/jq/-/jq-3.0.2.tgz",
|
"resolved": "https://registry.npmmirror.com/@mdui/jq/-/jq-3.0.3.tgz",
|
||||||
"integrity": "sha512-Er6cvAgW4RrjWrMBJDnajIiPD99EPYmAWyIgQURhUtO2V1NQQ80oLDo9ILllMoj1idsi1G4EQEqOEdinlH85DQ==",
|
"integrity": "sha512-nI8QK9UPHhiIbECrC1aMdLXNxP6WgUtC9XwRPs/e56FtwduePyxPyloXmgU8VYw85i6TtYdgClHS9tW8JweNZA==",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"ssr-window": "^4.0.2",
|
"ssr-window": "^5.0.0",
|
||||||
"tslib": "^2.6.3"
|
"tslib": "^2.8.1"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@mdui/shared": {
|
"node_modules/@mdui/shared": {
|
||||||
"version": "1.0.7",
|
"version": "1.0.8",
|
||||||
"resolved": "https://registry.npmmirror.com/@mdui/shared/-/shared-1.0.7.tgz",
|
"resolved": "https://registry.npmmirror.com/@mdui/shared/-/shared-1.0.8.tgz",
|
||||||
"integrity": "sha512-rs12tndL8Y4cy8eiGnkWvKMTHOTbwtHpfpFrPvnUm6ajLnAAaHjX7CJkOMjs5sh7cd+ez2Zm77MEgovKAWeeRQ==",
|
"integrity": "sha512-YY863fjHBuk8KtiO4uLDm1YyIVdGrWv4xUxfv8jP32WqIQBkSTbV7HN8jnKXXIej0NFP7pU89yGr4GJYzVszPg==",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@lit/reactive-element": "^2.0.4",
|
"@lit/reactive-element": "^2.1.0",
|
||||||
"@mdui/jq": "^3.0.2",
|
"@mdui/jq": "^3.0.3",
|
||||||
"lit": "^3.1.4",
|
"lit": "^3.3.0",
|
||||||
"ssr-window": "^4.0.2",
|
"ssr-window": "^5.0.0",
|
||||||
"tslib": "^2.6.3"
|
"tslib": "^2.8.1"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@nodelib/fs.scandir": {
|
"node_modules/@nodelib/fs.scandir": {
|
||||||
@ -1731,6 +1733,11 @@
|
|||||||
"resolved": "https://registry.npmmirror.com/@types/trusted-types/-/trusted-types-2.0.7.tgz",
|
"resolved": "https://registry.npmmirror.com/@types/trusted-types/-/trusted-types-2.0.7.tgz",
|
||||||
"integrity": "sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw=="
|
"integrity": "sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw=="
|
||||||
},
|
},
|
||||||
|
"node_modules/@types/web-bluetooth": {
|
||||||
|
"version": "0.0.21",
|
||||||
|
"resolved": "https://registry.npmmirror.com/@types/web-bluetooth/-/web-bluetooth-0.0.21.tgz",
|
||||||
|
"integrity": "sha512-oIQLCGWtcFZy2JW77j9k8nHzAOpqMHLQejDA48XXMWH6tjCQHz5RCFz1bzsmROyL6PUm+LLnUiI4BCn221inxA=="
|
||||||
|
},
|
||||||
"node_modules/@vitejs/plugin-vue": {
|
"node_modules/@vitejs/plugin-vue": {
|
||||||
"version": "5.2.4",
|
"version": "5.2.4",
|
||||||
"resolved": "https://registry.npmmirror.com/@vitejs/plugin-vue/-/plugin-vue-5.2.4.tgz",
|
"resolved": "https://registry.npmmirror.com/@vitejs/plugin-vue/-/plugin-vue-5.2.4.tgz",
|
||||||
@ -1811,49 +1818,49 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@vue/compiler-core": {
|
"node_modules/@vue/compiler-core": {
|
||||||
"version": "3.5.13",
|
"version": "3.5.15",
|
||||||
"resolved": "https://registry.npmmirror.com/@vue/compiler-core/-/compiler-core-3.5.13.tgz",
|
"resolved": "https://registry.npmmirror.com/@vue/compiler-core/-/compiler-core-3.5.15.tgz",
|
||||||
"integrity": "sha512-oOdAkwqUfW1WqpwSYJce06wvt6HljgY3fGeM9NcVA1HaYOij3mZG9Rkysn0OHuyUAGMbEbARIpsG+LPVlBJ5/Q==",
|
"integrity": "sha512-nGRc6YJg/kxNqbv/7Tg4juirPnjHvuVdhcmDvQWVZXlLHjouq7VsKmV1hIxM/8yKM0VUfwT/Uzc0lO510ltZqw==",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@babel/parser": "^7.25.3",
|
"@babel/parser": "^7.27.2",
|
||||||
"@vue/shared": "3.5.13",
|
"@vue/shared": "3.5.15",
|
||||||
"entities": "^4.5.0",
|
"entities": "^4.5.0",
|
||||||
"estree-walker": "^2.0.2",
|
"estree-walker": "^2.0.2",
|
||||||
"source-map-js": "^1.2.0"
|
"source-map-js": "^1.2.1"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@vue/compiler-dom": {
|
"node_modules/@vue/compiler-dom": {
|
||||||
"version": "3.5.13",
|
"version": "3.5.15",
|
||||||
"resolved": "https://registry.npmmirror.com/@vue/compiler-dom/-/compiler-dom-3.5.13.tgz",
|
"resolved": "https://registry.npmmirror.com/@vue/compiler-dom/-/compiler-dom-3.5.15.tgz",
|
||||||
"integrity": "sha512-ZOJ46sMOKUjO3e94wPdCzQ6P1Lx/vhp2RSvfaab88Ajexs0AHeV0uasYhi99WPaogmBlRHNRuly8xV75cNTMDA==",
|
"integrity": "sha512-ZelQd9n+O/UCBdL00rlwCrsArSak+YLZpBVuNDio1hN3+wrCshYZEDUO3khSLAzPbF1oQS2duEoMDUHScUlYjA==",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@vue/compiler-core": "3.5.13",
|
"@vue/compiler-core": "3.5.15",
|
||||||
"@vue/shared": "3.5.13"
|
"@vue/shared": "3.5.15"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@vue/compiler-sfc": {
|
"node_modules/@vue/compiler-sfc": {
|
||||||
"version": "3.5.13",
|
"version": "3.5.15",
|
||||||
"resolved": "https://registry.npmmirror.com/@vue/compiler-sfc/-/compiler-sfc-3.5.13.tgz",
|
"resolved": "https://registry.npmmirror.com/@vue/compiler-sfc/-/compiler-sfc-3.5.15.tgz",
|
||||||
"integrity": "sha512-6VdaljMpD82w6c2749Zhf5T9u5uLBWKnVue6XWxprDobftnletJ8+oel7sexFfM3qIxNmVE7LSFGTpv6obNyaQ==",
|
"integrity": "sha512-3zndKbxMsOU6afQWer75Zot/aydjtxNj0T2KLg033rAFaQUn2PGuE32ZRe4iMhflbTcAxL0yEYsRWFxtPro8RQ==",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@babel/parser": "^7.25.3",
|
"@babel/parser": "^7.27.2",
|
||||||
"@vue/compiler-core": "3.5.13",
|
"@vue/compiler-core": "3.5.15",
|
||||||
"@vue/compiler-dom": "3.5.13",
|
"@vue/compiler-dom": "3.5.15",
|
||||||
"@vue/compiler-ssr": "3.5.13",
|
"@vue/compiler-ssr": "3.5.15",
|
||||||
"@vue/shared": "3.5.13",
|
"@vue/shared": "3.5.15",
|
||||||
"estree-walker": "^2.0.2",
|
"estree-walker": "^2.0.2",
|
||||||
"magic-string": "^0.30.11",
|
"magic-string": "^0.30.17",
|
||||||
"postcss": "^8.4.48",
|
"postcss": "^8.5.3",
|
||||||
"source-map-js": "^1.2.0"
|
"source-map-js": "^1.2.1"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@vue/compiler-ssr": {
|
"node_modules/@vue/compiler-ssr": {
|
||||||
"version": "3.5.13",
|
"version": "3.5.15",
|
||||||
"resolved": "https://registry.npmmirror.com/@vue/compiler-ssr/-/compiler-ssr-3.5.13.tgz",
|
"resolved": "https://registry.npmmirror.com/@vue/compiler-ssr/-/compiler-ssr-3.5.15.tgz",
|
||||||
"integrity": "sha512-wMH6vrYHxQl/IybKJagqbquvxpWCuVYpoUJfCqFZwa/JY1GdATAQ+TgVtgrwwMZ0D07QhA99rs/EAAWfvG6KpA==",
|
"integrity": "sha512-gShn8zRREZbrXqTtmLSCffgZXDWv8nHc/GhsW+mbwBfNZL5pI96e7IWcIq8XGQe1TLtVbu7EV9gFIVSmfyarPg==",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@vue/compiler-dom": "3.5.13",
|
"@vue/compiler-dom": "3.5.15",
|
||||||
"@vue/shared": "3.5.13"
|
"@vue/shared": "3.5.15"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@vue/devtools-api": {
|
"node_modules/@vue/devtools-api": {
|
||||||
@ -1919,49 +1926,149 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@vue/reactivity": {
|
"node_modules/@vue/reactivity": {
|
||||||
"version": "3.5.13",
|
"version": "3.5.15",
|
||||||
"resolved": "https://registry.npmmirror.com/@vue/reactivity/-/reactivity-3.5.13.tgz",
|
"resolved": "https://registry.npmmirror.com/@vue/reactivity/-/reactivity-3.5.15.tgz",
|
||||||
"integrity": "sha512-NaCwtw8o48B9I6L1zl2p41OHo/2Z4wqYGGIK1Khu5T7yxrn+ATOixn/Udn2m+6kZKB/J7cuT9DbWWhRxqixACg==",
|
"integrity": "sha512-GaA5VUm30YWobCwpvcs9nvFKf27EdSLKDo2jA0IXzGS344oNpFNbEQ9z+Pp5ESDaxyS8FcH0vFN/XSe95BZtHQ==",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@vue/shared": "3.5.13"
|
"@vue/shared": "3.5.15"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@vue/runtime-core": {
|
"node_modules/@vue/runtime-core": {
|
||||||
"version": "3.5.13",
|
"version": "3.5.15",
|
||||||
"resolved": "https://registry.npmmirror.com/@vue/runtime-core/-/runtime-core-3.5.13.tgz",
|
"resolved": "https://registry.npmmirror.com/@vue/runtime-core/-/runtime-core-3.5.15.tgz",
|
||||||
"integrity": "sha512-Fj4YRQ3Az0WTZw1sFe+QDb0aXCerigEpw418pw1HBUKFtnQHWzwojaukAs2X/c9DQz4MQ4bsXTGlcpGxU/RCIw==",
|
"integrity": "sha512-CZAlIOQ93nj0OPpWWOx4+QDLCMzBNY85IQR4Voe6vIID149yF8g9WQaWnw042f/6JfvLttK7dnyWlC1EVCRK8Q==",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@vue/reactivity": "3.5.13",
|
"@vue/reactivity": "3.5.15",
|
||||||
"@vue/shared": "3.5.13"
|
"@vue/shared": "3.5.15"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@vue/runtime-dom": {
|
"node_modules/@vue/runtime-dom": {
|
||||||
"version": "3.5.13",
|
"version": "3.5.15",
|
||||||
"resolved": "https://registry.npmmirror.com/@vue/runtime-dom/-/runtime-dom-3.5.13.tgz",
|
"resolved": "https://registry.npmmirror.com/@vue/runtime-dom/-/runtime-dom-3.5.15.tgz",
|
||||||
"integrity": "sha512-dLaj94s93NYLqjLiyFzVs9X6dWhTdAlEAciC3Moq7gzAc13VJUdCnjjRurNM6uTLFATRHexHCTu/Xp3eW6yoog==",
|
"integrity": "sha512-wFplHKzKO/v998up2iCW3RN9TNUeDMhdBcNYZgs5LOokHntrB48dyuZHspcahKZczKKh3v6i164gapMPxBTKNw==",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@vue/reactivity": "3.5.13",
|
"@vue/reactivity": "3.5.15",
|
||||||
"@vue/runtime-core": "3.5.13",
|
"@vue/runtime-core": "3.5.15",
|
||||||
"@vue/shared": "3.5.13",
|
"@vue/shared": "3.5.15",
|
||||||
"csstype": "^3.1.3"
|
"csstype": "^3.1.3"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@vue/server-renderer": {
|
"node_modules/@vue/server-renderer": {
|
||||||
"version": "3.5.13",
|
"version": "3.5.15",
|
||||||
"resolved": "https://registry.npmmirror.com/@vue/server-renderer/-/server-renderer-3.5.13.tgz",
|
"resolved": "https://registry.npmmirror.com/@vue/server-renderer/-/server-renderer-3.5.15.tgz",
|
||||||
"integrity": "sha512-wAi4IRJV/2SAW3htkTlB+dHeRmpTiVIK1OGLWV1yeStVSebSQQOwGwIq0D3ZIoBj2C2qpgz5+vX9iEBkTdk5YA==",
|
"integrity": "sha512-Gehc693kVTYkLt6QSYEjGvqvdK2zZ/gf/D5zkgmvBdeB30dNnVZS8yY7+IlBmHRd1rR/zwaqeu06Ij04ZxBscg==",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@vue/compiler-ssr": "3.5.13",
|
"@vue/compiler-ssr": "3.5.15",
|
||||||
"@vue/shared": "3.5.13"
|
"@vue/shared": "3.5.15"
|
||||||
},
|
},
|
||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
"vue": "3.5.13"
|
"vue": "3.5.15"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@vue/shared": {
|
"node_modules/@vue/shared": {
|
||||||
"version": "3.5.13",
|
"version": "3.5.15",
|
||||||
"resolved": "https://registry.npmmirror.com/@vue/shared/-/shared-3.5.13.tgz",
|
"resolved": "https://registry.npmmirror.com/@vue/shared/-/shared-3.5.15.tgz",
|
||||||
"integrity": "sha512-/hnE/qP5ZoGpol0a5mDi45bOd7t3tjYJBjsgCsivow7D48cJeV5l05RD82lPqi7gRiphZM37rnhW1l6ZoCNNnQ=="
|
"integrity": "sha512-bKvgFJJL1ZX9KxMCTQY6xD9Dhe3nusd1OhyOb1cJYGqvAr0Vg8FIjHPMOEVbJ9GDT9HG+Bjdn4oS8ohKP8EvoA=="
|
||||||
|
},
|
||||||
|
"node_modules/@vueuse/core": {
|
||||||
|
"version": "13.3.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/@vueuse/core/-/core-13.3.0.tgz",
|
||||||
|
"integrity": "sha512-uYRz5oEfebHCoRhK4moXFM3NSCd5vu2XMLOq/Riz5FdqZMy2RvBtazdtL3gEcmDyqkztDe9ZP/zymObMIbiYSg==",
|
||||||
|
"dependencies": {
|
||||||
|
"@types/web-bluetooth": "^0.0.21",
|
||||||
|
"@vueuse/metadata": "13.3.0",
|
||||||
|
"@vueuse/shared": "13.3.0"
|
||||||
|
},
|
||||||
|
"funding": {
|
||||||
|
"url": "https://github.com/sponsors/antfu"
|
||||||
|
},
|
||||||
|
"peerDependencies": {
|
||||||
|
"vue": "^3.5.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/@vueuse/integrations": {
|
||||||
|
"version": "13.3.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/@vueuse/integrations/-/integrations-13.3.0.tgz",
|
||||||
|
"integrity": "sha512-h5mGRYPbiTZTFP/AKELLPGnUDBly7z7Qd1pgEQlT3ItQ0NlZM0vB+8SOQycpSBOBlgg72Zgw+mi2r+4O/G8RuQ==",
|
||||||
|
"dependencies": {
|
||||||
|
"@vueuse/core": "13.3.0",
|
||||||
|
"@vueuse/shared": "13.3.0"
|
||||||
|
},
|
||||||
|
"funding": {
|
||||||
|
"url": "https://github.com/sponsors/antfu"
|
||||||
|
},
|
||||||
|
"peerDependencies": {
|
||||||
|
"async-validator": "^4",
|
||||||
|
"axios": "^1",
|
||||||
|
"change-case": "^5",
|
||||||
|
"drauu": "^0.4",
|
||||||
|
"focus-trap": "^7",
|
||||||
|
"fuse.js": "^7",
|
||||||
|
"idb-keyval": "^6",
|
||||||
|
"jwt-decode": "^4",
|
||||||
|
"nprogress": "^0.2",
|
||||||
|
"qrcode": "^1.5",
|
||||||
|
"sortablejs": "^1",
|
||||||
|
"universal-cookie": "^7",
|
||||||
|
"vue": "^3.5.0"
|
||||||
|
},
|
||||||
|
"peerDependenciesMeta": {
|
||||||
|
"async-validator": {
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"axios": {
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"change-case": {
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"drauu": {
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"focus-trap": {
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"fuse.js": {
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"idb-keyval": {
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"jwt-decode": {
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"nprogress": {
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"qrcode": {
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"sortablejs": {
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"universal-cookie": {
|
||||||
|
"optional": true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/@vueuse/metadata": {
|
||||||
|
"version": "13.3.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/@vueuse/metadata/-/metadata-13.3.0.tgz",
|
||||||
|
"integrity": "sha512-42IzJIOYCKIb0Yjv1JfaKpx8JlCiTmtCWrPxt7Ja6Wzoq0h79+YVXmBV03N966KEmDEESTbp5R/qO3AB5BDnGw==",
|
||||||
|
"funding": {
|
||||||
|
"url": "https://github.com/sponsors/antfu"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/@vueuse/shared": {
|
||||||
|
"version": "13.3.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/@vueuse/shared/-/shared-13.3.0.tgz",
|
||||||
|
"integrity": "sha512-L1QKsF0Eg9tiZSFXTgodYnu0Rsa2P0En2LuLrIs/jgrkyiDuJSsPZK+tx+wU0mMsYHUYEjNsuE41uqqkuR8VhA==",
|
||||||
|
"funding": {
|
||||||
|
"url": "https://github.com/sponsors/antfu"
|
||||||
|
},
|
||||||
|
"peerDependencies": {
|
||||||
|
"vue": "^3.5.0"
|
||||||
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@yankeeinlondon/builder-api": {
|
"node_modules/@yankeeinlondon/builder-api": {
|
||||||
"version": "1.4.1",
|
"version": "1.4.1",
|
||||||
@ -4059,29 +4166,29 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/lit": {
|
"node_modules/lit": {
|
||||||
"version": "3.2.1",
|
"version": "3.3.0",
|
||||||
"resolved": "https://registry.npmmirror.com/lit/-/lit-3.2.1.tgz",
|
"resolved": "https://registry.npmmirror.com/lit/-/lit-3.3.0.tgz",
|
||||||
"integrity": "sha512-1BBa1E/z0O9ye5fZprPtdqnc0BFzxIxTTOO/tQFmyC/hj1O3jL4TfmLBw0WEwjAokdLwpclkvGgDJwTIh0/22w==",
|
"integrity": "sha512-DGVsqsOIHBww2DqnuZzW7QsuCdahp50ojuDaBPC7jUDRpYoH0z7kHBBYZewRzer75FwtrkmkKk7iOAwSaWdBmw==",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@lit/reactive-element": "^2.0.4",
|
"@lit/reactive-element": "^2.1.0",
|
||||||
"lit-element": "^4.1.0",
|
"lit-element": "^4.2.0",
|
||||||
"lit-html": "^3.2.0"
|
"lit-html": "^3.3.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/lit-element": {
|
"node_modules/lit-element": {
|
||||||
"version": "4.1.1",
|
"version": "4.2.0",
|
||||||
"resolved": "https://registry.npmmirror.com/lit-element/-/lit-element-4.1.1.tgz",
|
"resolved": "https://registry.npmmirror.com/lit-element/-/lit-element-4.2.0.tgz",
|
||||||
"integrity": "sha512-HO9Tkkh34QkTeUmEdNYhMT8hzLid7YlMlATSi1q4q17HE5d9mrrEHJ/o8O2D0cMi182zK1F3v7x0PWFjrhXFew==",
|
"integrity": "sha512-MGrXJVAI5x+Bfth/pU9Kst1iWID6GHDLEzFEnyULB/sFiRLgkd8NPK/PeeXxktA3T6EIIaq8U3KcbTU5XFcP2Q==",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@lit-labs/ssr-dom-shim": "^1.2.0",
|
"@lit-labs/ssr-dom-shim": "^1.2.0",
|
||||||
"@lit/reactive-element": "^2.0.4",
|
"@lit/reactive-element": "^2.1.0",
|
||||||
"lit-html": "^3.2.0"
|
"lit-html": "^3.3.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/lit-html": {
|
"node_modules/lit-html": {
|
||||||
"version": "3.2.1",
|
"version": "3.3.0",
|
||||||
"resolved": "https://registry.npmmirror.com/lit-html/-/lit-html-3.2.1.tgz",
|
"resolved": "https://registry.npmmirror.com/lit-html/-/lit-html-3.3.0.tgz",
|
||||||
"integrity": "sha512-qI/3lziaPMSKsrwlxH/xMgikhQ0EGOX2ICU73Bi/YHFvz2j/yMCIrw4+puF2IpQ4+upd3EWbvnHM9+PnJn48YA==",
|
"integrity": "sha512-RHoswrFAxY2d8Cf2mm4OZ1DgzCoBKUKSPvA1fhtSELxUERq2aQQ2h05pO9j81gS1o7RIRJ+CePLogfyahwmynw==",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@types/trusted-types": "^2.0.2"
|
"@types/trusted-types": "^2.0.2"
|
||||||
}
|
}
|
||||||
@ -4183,21 +4290,21 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/mdui": {
|
"node_modules/mdui": {
|
||||||
"version": "2.1.3",
|
"version": "2.1.4",
|
||||||
"resolved": "https://registry.npmmirror.com/mdui/-/mdui-2.1.3.tgz",
|
"resolved": "https://registry.npmmirror.com/mdui/-/mdui-2.1.4.tgz",
|
||||||
"integrity": "sha512-rBaFJYPloaWcHSem9PCD3AT3nyjO072M9HCOGifGxmhVE0QYABtzdiActf9BvgbTMOrIPdlCyPKF+JVW/b6G4Q==",
|
"integrity": "sha512-QtK5xia5HXtVO7yH30QjwvvNruw5JdrJL1MEc1k6S/ZfsbHOj6BxxdYjrdv2HiN5ikkGqt5CIbZdFyq6shaZyw==",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@floating-ui/utils": "^0.2.4",
|
"@floating-ui/utils": "^0.2.9",
|
||||||
"@lit/localize": "^0.12.1",
|
"@lit/localize": "^0.12.2",
|
||||||
"@lit/reactive-element": "^2.0.4",
|
"@lit/reactive-element": "^2.1.0",
|
||||||
"@material/material-color-utilities": "^0.3.0",
|
"@material/material-color-utilities": "^0.3.0",
|
||||||
"@mdui/jq": "^3.0.2",
|
"@mdui/jq": "^3.0.3",
|
||||||
"@mdui/shared": "^1.0.7",
|
"@mdui/shared": "^1.0.8",
|
||||||
"classcat": "^5.0.5",
|
"classcat": "^5.0.5",
|
||||||
"is-promise": "^4.0.0",
|
"is-promise": "^4.0.0",
|
||||||
"lit": "^3.1.4",
|
"lit": "^3.3.0",
|
||||||
"ssr-window": "^4.0.2",
|
"ssr-window": "^5.0.0",
|
||||||
"tslib": "^2.6.3"
|
"tslib": "^2.8.1"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/mdurl": {
|
"node_modules/mdurl": {
|
||||||
@ -4851,9 +4958,9 @@
|
|||||||
"integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
|
"integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
|
||||||
},
|
},
|
||||||
"node_modules/sass": {
|
"node_modules/sass": {
|
||||||
"version": "1.88.0",
|
"version": "1.89.0",
|
||||||
"resolved": "https://registry.npmmirror.com/sass/-/sass-1.88.0.tgz",
|
"resolved": "https://registry.npmmirror.com/sass/-/sass-1.89.0.tgz",
|
||||||
"integrity": "sha512-sF6TWQqjFvr4JILXzG4ucGOLELkESHL+I5QJhh7CNaE+Yge0SI+ehCatsXhJ7ymU1hAFcIS3/PBpjdIbXoyVbg==",
|
"integrity": "sha512-ld+kQU8YTdGNjOLfRWBzewJpU5cwEv/h5yyqlSeJcj6Yh8U4TDA9UA5FPicqDz/xgRPWRSYIQNiFks21TbA9KQ==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"chokidar": "^4.0.0",
|
"chokidar": "^4.0.0",
|
||||||
@ -5114,9 +5221,9 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/ssr-window": {
|
"node_modules/ssr-window": {
|
||||||
"version": "4.0.2",
|
"version": "5.0.0",
|
||||||
"resolved": "https://registry.npmmirror.com/ssr-window/-/ssr-window-4.0.2.tgz",
|
"resolved": "https://registry.npmmirror.com/ssr-window/-/ssr-window-5.0.0.tgz",
|
||||||
"integrity": "sha512-ISv/Ch+ig7SOtw7G2+qkwfVASzazUnvlDTwypdLoPoySv+6MqlOV10VwPSE6EWkGjhW50lUmghPmpYZXMu/+AQ=="
|
"integrity": "sha512-3Iqawoo0DkAaUEScd80SYq3I5clEFDVy//DdzjHXACj/hqcKzsnMzRZ1yHRj+r5dW3UeXNs30ofnhP6YSWg5iA=="
|
||||||
},
|
},
|
||||||
"node_modules/statuses": {
|
"node_modules/statuses": {
|
||||||
"version": "2.0.1",
|
"version": "2.0.1",
|
||||||
@ -6128,15 +6235,15 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/vue": {
|
"node_modules/vue": {
|
||||||
"version": "3.5.13",
|
"version": "3.5.15",
|
||||||
"resolved": "https://registry.npmmirror.com/vue/-/vue-3.5.13.tgz",
|
"resolved": "https://registry.npmmirror.com/vue/-/vue-3.5.15.tgz",
|
||||||
"integrity": "sha512-wmeiSMxkZCSc+PM2w2VRsOYAZC8GdipNFRTsLSfodVqI9mbejKeXEGr8SckuLnrQPGe3oJN5c3K0vpoU9q/wCQ==",
|
"integrity": "sha512-aD9zK4rB43JAMK/5BmS4LdPiEp8Fdh8P1Ve/XNuMF5YRf78fCyPE6FUbQwcaWQ5oZ1R2CD9NKE0FFOVpMR7gEQ==",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@vue/compiler-dom": "3.5.13",
|
"@vue/compiler-dom": "3.5.15",
|
||||||
"@vue/compiler-sfc": "3.5.13",
|
"@vue/compiler-sfc": "3.5.15",
|
||||||
"@vue/runtime-dom": "3.5.13",
|
"@vue/runtime-dom": "3.5.15",
|
||||||
"@vue/server-renderer": "3.5.13",
|
"@vue/server-renderer": "3.5.15",
|
||||||
"@vue/shared": "3.5.13"
|
"@vue/shared": "3.5.15"
|
||||||
},
|
},
|
||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
"typescript": "*"
|
"typescript": "*"
|
||||||
|
|||||||
@ -12,13 +12,15 @@
|
|||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@mdui/icons": "^1.0.2",
|
"@mdui/icons": "^1.0.2",
|
||||||
|
"@vueuse/core": "^13.3.0",
|
||||||
|
"@vueuse/integrations": "^13.3.0",
|
||||||
"axios": "^1.9.0",
|
"axios": "^1.9.0",
|
||||||
"compress-json": "^3.1.1",
|
"compress-json": "^3.1.1",
|
||||||
"cookie-parser": "^1.4.7",
|
"cookie-parser": "^1.4.7",
|
||||||
"express": "^5.1.0",
|
"express": "^5.1.0",
|
||||||
"mdui": "^2.1.3",
|
"mdui": "^2.1.4",
|
||||||
"pinia": "^3.0.2",
|
"pinia": "^3.0.2",
|
||||||
"vue": "^3.5.13",
|
"vue": "^3.5.15",
|
||||||
"vue-router": "^4.5.1"
|
"vue-router": "^4.5.1"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
@ -27,7 +29,7 @@
|
|||||||
"cross-env": "^7.0.3",
|
"cross-env": "^7.0.3",
|
||||||
"markdown-it-anchor": "^9.2.0",
|
"markdown-it-anchor": "^9.2.0",
|
||||||
"markdown-it-attrs": "^4.3.1",
|
"markdown-it-attrs": "^4.3.1",
|
||||||
"sass": "^1.88.0",
|
"sass": "^1.89.0",
|
||||||
"vite": "^6.3.5",
|
"vite": "^6.3.5",
|
||||||
"vite-plugin-md": "^0.21.5",
|
"vite-plugin-md": "^0.21.5",
|
||||||
"vite-plugin-vue-devtools": "^7.7.6"
|
"vite-plugin-vue-devtools": "^7.7.6"
|
||||||
|
|||||||
3
public/robots.txt
Normal file
3
public/robots.txt
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
Sitemap: https://ao3.unknownmp.top/sitemap.xml
|
||||||
|
User-agent: *
|
||||||
|
Disallow: /assets/
|
||||||
163
server.js
163
server.js
@ -2,17 +2,15 @@ import fs from 'node:fs/promises'
|
|||||||
import express from 'express'
|
import express from 'express'
|
||||||
import cookieParser from 'cookie-parser'
|
import cookieParser from 'cookie-parser'
|
||||||
import { compress } from 'compress-json'
|
import { compress } from 'compress-json'
|
||||||
// Constants
|
|
||||||
const isProduction = process.env.NODE_ENV === 'production'
|
const isProduction = process.env.NODE_ENV === 'production'
|
||||||
const port = process.env.PORT || 5173
|
const port = process.env.PORT || 5173
|
||||||
const base = process.env.BASE || '/'
|
const base = process.env.BASE || '/'
|
||||||
|
|
||||||
// Cached production assets
|
|
||||||
const templateHtml = isProduction
|
const templateHtml = isProduction
|
||||||
? await fs.readFile('./dist/client/index.html', 'utf-8')
|
? await fs.readFile('./dist/client/index.html', 'utf-8')
|
||||||
: ''
|
: ''
|
||||||
|
|
||||||
// Create http server
|
|
||||||
const app = express()
|
const app = express()
|
||||||
app.use(cookieParser());
|
app.use(cookieParser());
|
||||||
|
|
||||||
@ -21,73 +19,110 @@ const MESSAGE = {
|
|||||||
0: 'Unknown'
|
0: 'Unknown'
|
||||||
}
|
}
|
||||||
|
|
||||||
// Add Vite or respective production middlewares
|
|
||||||
/** @type {import('vite').ViteDevServer | undefined} */
|
|
||||||
let vite
|
let vite
|
||||||
if (!isProduction) {
|
if (!isProduction) {
|
||||||
const { createServer } = await import('vite')
|
const { createServer } = await import('vite')
|
||||||
vite = await createServer({
|
vite = await createServer({
|
||||||
server: { middlewareMode: true },
|
server: { middlewareMode: true },
|
||||||
appType: 'custom',
|
appType: 'custom',
|
||||||
base,
|
base,
|
||||||
})
|
})
|
||||||
app.use(vite.middlewares)
|
app.use(vite.middlewares)
|
||||||
} else {
|
} else {
|
||||||
//const compression = (await import('compression')).default
|
const sirv = (await import('sirv')).default
|
||||||
const sirv = (await import('sirv')).default
|
app.use(base, sirv('./dist/client', { extensions: [] }))
|
||||||
//app.use(compression())
|
|
||||||
app.use(base, sirv('./dist/client', { extensions: [] }))
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// Serve HTML
|
// Serve HTML
|
||||||
app.use('*all', async (req, res) => {
|
app.use('*all', async (req, res) => {
|
||||||
try {
|
try {
|
||||||
const url = req.originalUrl.replace(base, '')
|
const url = req.originalUrl.replace(base, '')
|
||||||
console.log(`Request ${url}`)
|
console.log(`Request ${url}`)
|
||||||
/** @type {string} */
|
let template
|
||||||
let template
|
let render, getRoute
|
||||||
/** @type {import('./src/entry-server.js').render} */
|
if (!isProduction) {
|
||||||
let render, getRoute
|
// Always read fresh template in development
|
||||||
if (!isProduction) {
|
template = await fs.readFile('./index.html', 'utf-8')
|
||||||
// Always read fresh template in development
|
template = await vite.transformIndexHtml(url, template)
|
||||||
template = await fs.readFile('./index.html', 'utf-8')
|
const module = await vite.ssrLoadModule('/src/entry-server.js')
|
||||||
template = await vite.transformIndexHtml(url, template)
|
render = module.render
|
||||||
const module = await vite.ssrLoadModule('/src/entry-server.js')
|
getRoute = module.getRoute
|
||||||
render = module.render
|
} else {
|
||||||
getRoute = module.getRoute
|
template = templateHtml
|
||||||
} else {
|
const module = await import('./dist/server/entry-server.js')
|
||||||
template = templateHtml
|
render = module.render
|
||||||
const module = await import('./dist/server/entry-server.js')
|
getRoute = module.getRoute
|
||||||
render = module.render
|
}
|
||||||
getRoute = module.getRoute
|
const { router, code, title, metas, meta } = await getRoute(url)
|
||||||
}
|
if (code != 200 && !req.accepts('html')) {
|
||||||
const { router, code } = await getRoute(url)
|
res.status(code).set({ 'Content-Type': 'text/plain' })
|
||||||
if (code != 200 && !req.accepts('html')) {
|
res.write(MESSAGE[code] || MESSAGE[0])
|
||||||
res.status(code).set({ 'Content-Type': 'text/plain' })
|
res.end()
|
||||||
res.write(MESSAGE[code] || MESSAGE[0])
|
return
|
||||||
res.end()
|
}
|
||||||
return
|
const { stream, piniaState, headState } = await render(router, req.cookies, req.headers.host)
|
||||||
}
|
const [htmlStart, htmlEnd] = template.split('<!--app-html-->')
|
||||||
const { stream, piniaState } = await render(router, req.cookies, req.headers.host)
|
if (meta) {
|
||||||
const [htmlStart, htmlEnd] = template.split('<!--app-html-->')
|
const buffer = []
|
||||||
res.status(code).set({ 'Content-Type': 'text/html' })
|
let headReady = false
|
||||||
res.write(htmlStart)
|
for await (const chunk of stream) {
|
||||||
for await (const chunk of stream) {
|
if (res.closed) break
|
||||||
if (res.closed) break
|
if (headReady) res.write(chunk)
|
||||||
res.write(chunk)
|
else {
|
||||||
}
|
if (headState.ready) {
|
||||||
const piniaStateContent = JSON.stringify(compress(piniaState))
|
res.status(headState.code || code).set({ 'Content-Type': 'text/html' })
|
||||||
const stateScript = `<script>window.__PINIA_STATE__=${piniaStateContent}</script>`
|
const heads = [`<title>${ headState.title || title }</title>`]
|
||||||
res.write(htmlEnd.replace('<!--app-state-->', stateScript))
|
for (const item of [ ...metas, ...headState.meta ]) {
|
||||||
res.end()
|
const properties = []
|
||||||
} catch (e) {
|
for (const [key, value] of Object.entries(item)) properties.push(`${key}="${value}"`)
|
||||||
vite?.ssrFixStacktrace(e)
|
heads.push(`<meta ${properties.join(' ')}>`)
|
||||||
console.log(e.stack)
|
}
|
||||||
res.status(500).end(e.stack)
|
res.write(htmlStart.replace('<!--app-head-->',heads.join('')))
|
||||||
}
|
for (const item of buffer) res.write(item)
|
||||||
|
res.write(chunk)
|
||||||
|
headReady = true
|
||||||
|
} else buffer.push(chunk)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (!headState.ready) {
|
||||||
|
console.warn('Page not set meta ready! No stream render at all!')
|
||||||
|
const heads = [`<title>${ title }</title>`]
|
||||||
|
for (const item of metas) {
|
||||||
|
const properties = []
|
||||||
|
for (const [key, value] of Object.entries(item)) properties.push(`${key}="${value}"`)
|
||||||
|
heads.push(`<meta ${properties.join(' ')}>`)
|
||||||
|
}
|
||||||
|
res.write(htmlStart.replace('<!--app-head-->',heads.join('')))
|
||||||
|
for await (const chunk of buffer) {
|
||||||
|
if (res.closed) break
|
||||||
|
res.write(chunk)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
res.status(code).set({ 'Content-Type': 'text/html' })
|
||||||
|
const heads = [`<title>${ title }</title>`]
|
||||||
|
for (const item of metas) {
|
||||||
|
const properties = []
|
||||||
|
for (const [key, value] of Object.entries(item)) properties.push(`${key}="${value}"`)
|
||||||
|
heads.push(`<meta ${properties.join(' ')}>`)
|
||||||
|
}
|
||||||
|
res.write(htmlStart.replace('<!--app-head-->',heads.join('')))
|
||||||
|
for await (const chunk of stream) {
|
||||||
|
if (res.closed) break
|
||||||
|
res.write(chunk)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
const piniaStateContent = JSON.stringify(compress(piniaState))
|
||||||
|
const stateScript = `<script>window.__PINIA_STATE__=${piniaStateContent}</script>`
|
||||||
|
res.write(htmlEnd.replace('<!--app-state-->', stateScript))
|
||||||
|
res.end()
|
||||||
|
} catch (e) {
|
||||||
|
vite?.ssrFixStacktrace(e)
|
||||||
|
console.log(e.stack)
|
||||||
|
res.status(500).end(e.stack)
|
||||||
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
// Start http server
|
|
||||||
app.listen(port, () => {
|
app.listen(port, () => {
|
||||||
console.log(`Server started at http://localhost:${port}`)
|
console.log(`Server started at port ${port}`)
|
||||||
})
|
})
|
||||||
|
|||||||
72
src/App.vue
72
src/App.vue
@ -1,6 +1,8 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { onMounted, onBeforeMount, onServerPrefetch, nextTick, ref, watch } from 'vue'
|
import 'mdui/mdui.css'
|
||||||
import { useRouter, useRoute, RouterView } from 'vue-router'
|
import './main.scss'
|
||||||
|
|
||||||
|
import { onMounted, onBeforeMount, nextTick, ref, watch } from 'vue'
|
||||||
|
|
||||||
import { useApiStore } from '@/stores/api.js'
|
import { useApiStore } from '@/stores/api.js'
|
||||||
|
|
||||||
@ -22,39 +24,27 @@ import '@mdui/icons/arrow-back.js'
|
|||||||
import '@mdui/icons/light-mode.js'
|
import '@mdui/icons/light-mode.js'
|
||||||
import '@mdui/icons/menu.js'
|
import '@mdui/icons/menu.js'
|
||||||
|
|
||||||
const router = useRouter()
|
|
||||||
const route = useRoute()
|
|
||||||
|
|
||||||
const clientOnlyStore = useClientOnlyStore()
|
const clientOnlyStore = useClientOnlyStore()
|
||||||
const api = useApiStore()
|
|
||||||
const themeScheme = useThemeStore()
|
|
||||||
const mobileScreen = useMobileScreen()
|
|
||||||
const routeStore = useRouteStore()
|
const routeStore = useRouteStore()
|
||||||
|
const api = useApiStore()
|
||||||
|
const mobileScreen = useMobileScreen()
|
||||||
|
let themeScheme = null
|
||||||
|
|
||||||
const drawerOpen = ref(false)
|
const drawerOpen = ref(false)
|
||||||
const drawer = ref(null)
|
const drawer = ref(null)
|
||||||
const closeDrawer = ref(true)
|
const closeDrawer = ref(true)
|
||||||
|
|
||||||
let progressTimer = null
|
|
||||||
|
|
||||||
onServerPrefetch(async () => {
|
|
||||||
await api.init()
|
|
||||||
})
|
|
||||||
|
|
||||||
onBeforeMount(() => {
|
onBeforeMount(() => {
|
||||||
|
themeScheme = useThemeStore()
|
||||||
mobileScreen.reCal()
|
mobileScreen.reCal()
|
||||||
if(!mobileScreen.isMobile) drawerOpen.value = true
|
if(!mobileScreen.isMobile) drawerOpen.value = true
|
||||||
})
|
})
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
themeScheme.applyTheme()
|
themeScheme.applyTheme()
|
||||||
await api.init()
|
|
||||||
clientOnlyStore.setClient()
|
clientOnlyStore.setClient()
|
||||||
new MutationObserver(() => {
|
new MutationObserver(() => { if (document.documentElement.style.width.includes('calc')) document.documentElement.style.width = '' })
|
||||||
if (document.documentElement.style.width.includes('calc')) {
|
.observe(document.documentElement, { attributes: true, attributeFilter: ['style'] });
|
||||||
document.documentElement.style.width = '';
|
|
||||||
}
|
|
||||||
}).observe(document.documentElement, { attributes: true, attributeFilter: ['style'] });
|
|
||||||
watch(() => mobileScreen.isMobile, (newV, oldV) => {
|
watch(() => mobileScreen.isMobile, (newV, oldV) => {
|
||||||
if( oldV && !newV ) nextTick(() => drawer.value.open = true)
|
if( oldV && !newV ) nextTick(() => drawer.value.open = true)
|
||||||
if( !oldV && newV ) nextTick(() => drawer.value.open = false)
|
if( !oldV && newV ) nextTick(() => drawer.value.open = false)
|
||||||
@ -63,14 +53,9 @@ onMounted(async () => {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<header><ClientOnly>
|
<header><ClientOnly>
|
||||||
<mdui-top-app-bar style="background-color: rgb(var(--mdui-color-primary-container));" scroll-behavior="shrink elevate">
|
<mdui-top-app-bar style="background-color: rgb(var(--mdui-color-primary-container));" scroll-behavior="shrink elevate">
|
||||||
<mdui-button-icon @click="drawer.open = !drawer.open">
|
<mdui-button-icon @click="drawer.open = !drawer.open"><mdui-icon-menu></mdui-icon-menu></mdui-button-icon>
|
||||||
<mdui-icon-menu></mdui-icon-menu>
|
|
||||||
</mdui-button-icon>
|
|
||||||
<!--<mdui-button-icon @click="$router.back()" v-if="$route.path != '/'">
|
|
||||||
<mdui-icon-arrow-back></mdui-icon-arrow-back>
|
|
||||||
</mdui-button-icon>-->
|
|
||||||
<mdui-top-app-bar-title style="color: rgb(var(--mdui-color-on-surface-variant))">{{ routeStore.title }}</mdui-top-app-bar-title>
|
<mdui-top-app-bar-title style="color: rgb(var(--mdui-color-on-surface-variant))">{{ routeStore.title }}</mdui-top-app-bar-title>
|
||||||
<mdui-circular-progress v-if="routeStore.showProgress" :value='routeStore.progress' :max='routeStore.progressMax'></mdui-circular-progress>
|
<mdui-circular-progress v-if="routeStore.showProgress" :value='routeStore.progress' :max='routeStore.progressMax'></mdui-circular-progress>
|
||||||
<div style="flex-grow: 1"></div>
|
<div style="flex-grow: 1"></div>
|
||||||
@ -78,11 +63,10 @@ onMounted(async () => {
|
|||||||
<mdui-icon-light-mode style="color: rgb(var(--mdui-color-on-surface-variant))"></mdui-icon-light-mode>
|
<mdui-icon-light-mode style="color: rgb(var(--mdui-color-on-surface-variant))"></mdui-icon-light-mode>
|
||||||
</mdui-button-icon>
|
</mdui-button-icon>
|
||||||
</mdui-top-app-bar>
|
</mdui-top-app-bar>
|
||||||
<template #ssr>
|
<template #ssr><h1>{{ routeStore.title }}</h1>
|
||||||
<h1>{{ routeStore.title }}</h1>
|
</template></ClientOnly></header>
|
||||||
</template></ClientOnly></header>
|
<nav><ClientOnly>
|
||||||
<nav><ClientOnly>
|
<mdui-navigation-drawer ref='drawer' :open="drawerOpen" close-on-overlay-click close-on-esc style="margin-top: 64px;">
|
||||||
<mdui-navigation-drawer ref='drawer' :open="drawerOpen" close-on-overlay-click close-on-esc style="margin-top: 64px;">
|
|
||||||
<mdui-list style="height: 100%; background-color: rgb(var(--mdui-color-surface-variant));">
|
<mdui-list style="height: 100%; background-color: rgb(var(--mdui-color-surface-variant));">
|
||||||
<KeepAlive><mdui-list-item
|
<KeepAlive><mdui-list-item
|
||||||
v-for="item in routeStore.allRoutes"
|
v-for="item in routeStore.allRoutes"
|
||||||
@ -94,27 +78,23 @@ onMounted(async () => {
|
|||||||
</mdui-list>
|
</mdui-list>
|
||||||
</mdui-navigation-drawer>
|
</mdui-navigation-drawer>
|
||||||
<template #ssr>
|
<template #ssr>
|
||||||
<ul>
|
<ul><li v-for="item in routeStore.allRoutes"
|
||||||
<li v-for="item in routeStore.allRoutes"
|
|
||||||
:key="item.path"
|
:key="item.path"
|
||||||
:class="{ 'active-item' : item.path == $route.path }"
|
:class="{ 'active-item' : item.path == $route.path }"
|
||||||
><a :href="item.path">{{ item.name }}</a></li>
|
><a :href="item.path">{{ item.name }}</a></li></ul>
|
||||||
</ul>
|
</template></ClientOnly></nav>
|
||||||
</template></ClientOnly>
|
<main :class="{ 'mdui-prose' : clientOnlyStore.isClient , 'content' : clientOnlyStore.isClient }">
|
||||||
</nav>
|
<RouterView />
|
||||||
<main :class="{ 'mdui-prose' : clientOnlyStore.isClient }">
|
</main><footer></footer>
|
||||||
<RouterView v-slot="{ Component }">
|
|
||||||
<component :is="Component" />
|
|
||||||
</RouterView>
|
|
||||||
</main>
|
|
||||||
<footer></footer>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.active-item {
|
.active-item {
|
||||||
background-color: rgb(var(--mdui-color-surface-container-high));
|
background-color: rgb(var(--mdui-color-surface-container-high));
|
||||||
}
|
}
|
||||||
|
.content {
|
||||||
|
margin: 16px;
|
||||||
|
}
|
||||||
.bottom {
|
.bottom {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|||||||
@ -1,42 +0,0 @@
|
|||||||
.typescale-body-large {
|
|
||||||
line-height: var(--mdui-typescale-body-large-line-height);
|
|
||||||
font-size: var(--mdui-typescale-body-large-size);
|
|
||||||
letter-spacing: var(--mdui-typescale-body-large-tracking);
|
|
||||||
font-weight: var(--mdui-typescale-body-large-weight);
|
|
||||||
}
|
|
||||||
|
|
||||||
.typescale-body-small {
|
|
||||||
line-height: var(--mdui-typescale-body-small-line-height);
|
|
||||||
font-size: var(--mdui-typescale-body-small-size);
|
|
||||||
letter-spacing: var(--mdui-typescale-body-small-tracking);
|
|
||||||
font-weight: var(--mdui-typescale-body-small-weight);
|
|
||||||
}
|
|
||||||
|
|
||||||
.typescale-label-small {
|
|
||||||
line-height: var(--mdui-typescale-label-small-line-height);
|
|
||||||
font-size: var(--mdui-typescale-label-small-size);
|
|
||||||
letter-spacing: var(--mdui-typescale-label-small-tracking);
|
|
||||||
font-weight: var(--mdui-typescale-label-small-weight);
|
|
||||||
}
|
|
||||||
|
|
||||||
.typescale-headline-small {
|
|
||||||
line-height: var(--mdui-typescale-headline-small-line-height);
|
|
||||||
font-size: var(--mdui-typescale-headline-small-size);
|
|
||||||
letter-spacing: var(--mdui-typescale-headline-small-tracking);
|
|
||||||
font-weight: var(--mdui-typescale-headline-small-weight);
|
|
||||||
}
|
|
||||||
|
|
||||||
.typescale-headline-large {
|
|
||||||
line-height: var(--mdui-typescale-headline-large-line-height);
|
|
||||||
font-size: var(--mdui-typescale-headline-large-size);
|
|
||||||
letter-spacing: var(--mdui-typescale-headline-large-tracking);
|
|
||||||
font-weight: var(--mdui-typescale-headline-large-weight);
|
|
||||||
}
|
|
||||||
|
|
||||||
.typescale-headline-medium {
|
|
||||||
line-height: var(--mdui-typescale-headline-medium-line-height);
|
|
||||||
font-size: var(--mdui-typescale-headline-medium-size);
|
|
||||||
letter-spacing: var(--mdui-typescale-headline-medium-tracking);
|
|
||||||
font-weight: var(--mdui-typescale-headline-medium-weight);
|
|
||||||
}
|
|
||||||
|
|
||||||
59
src/composables/apiRequest.js
Normal file
59
src/composables/apiRequest.js
Normal file
@ -0,0 +1,59 @@
|
|||||||
|
import { useAxios } from '@vueuse/integrations/useAxios'
|
||||||
|
import axios from 'axios'
|
||||||
|
|
||||||
|
import { objectToQueryString } from '../utils.js'
|
||||||
|
|
||||||
|
function getEndpoint() {
|
||||||
|
const apiMapping = {
|
||||||
|
'': ['http://localhost:28001/', '/api/'],
|
||||||
|
}
|
||||||
|
let host = import.meta.env.SSR ? 'ssr' : window.location.host
|
||||||
|
let entry = apiMapping[host] ?? apiMapping['']
|
||||||
|
return import.meta.env.SSR ? entry[0] : replaceUrl(entry[1])
|
||||||
|
}
|
||||||
|
|
||||||
|
function replaceUrl(url) {
|
||||||
|
return url
|
||||||
|
.replace('{{hostname}}', window.location.hostname)
|
||||||
|
.replace('{{port}}', window.location.port)
|
||||||
|
.replace('{{protocol}}', window.location.protocol)
|
||||||
|
}
|
||||||
|
|
||||||
|
export function useApiRequest(method, url, data, config = {}) {
|
||||||
|
const baseURL = getEndpoint()
|
||||||
|
const fullURL = method === 'GET' && data
|
||||||
|
? `${baseURL}${url}?${objectToQueryString(data)}`
|
||||||
|
: `${baseURL}${url}`
|
||||||
|
const {
|
||||||
|
response,
|
||||||
|
error,
|
||||||
|
isFinished,
|
||||||
|
isLoading,
|
||||||
|
execute,
|
||||||
|
} = useAxios(
|
||||||
|
fullURL,
|
||||||
|
{
|
||||||
|
method,
|
||||||
|
...(method === 'POST' ? { data } : {}),
|
||||||
|
...(config || {})
|
||||||
|
},
|
||||||
|
{
|
||||||
|
immediate: false,
|
||||||
|
axios,
|
||||||
|
}
|
||||||
|
)
|
||||||
|
const exec = async () => {
|
||||||
|
const start = Date.now()
|
||||||
|
try { await execute() }
|
||||||
|
catch (e) {}
|
||||||
|
const stop = Date.now()
|
||||||
|
return {
|
||||||
|
status: response.value?.status || (error.value?.response?.status ?? -1),
|
||||||
|
data: response.value?.data || error.value?.response?.data || null,
|
||||||
|
duration: stop - start,
|
||||||
|
error: error.value,
|
||||||
|
isSSR: import.meta.env.SSR,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return { execute: exec, isFinished, isLoading }
|
||||||
|
}
|
||||||
@ -1,5 +1,4 @@
|
|||||||
import { decompress } from 'compress-json'
|
import { decompress } from 'compress-json'
|
||||||
import './main.scss'
|
|
||||||
|
|
||||||
import { createApp } from './main'
|
import { createApp } from './main'
|
||||||
import { createSSRRouter } from './router.js'
|
import { createSSRRouter } from './router.js'
|
||||||
@ -9,15 +8,7 @@ const router = createSSRRouter()
|
|||||||
|
|
||||||
app.use(router)
|
app.use(router)
|
||||||
|
|
||||||
if (window.__PINIA_STATE__) {
|
if (window.__PINIA_STATE__) pinia.state.value = decompress(window.__PINIA_STATE__)
|
||||||
pinia.state.value = decompress(window.__PINIA_STATE__)
|
|
||||||
}
|
|
||||||
|
|
||||||
if (window.__INITIAL_STATE__) {
|
router.isReady().then(() => app.mount('#app'))
|
||||||
window.__INITIAL_STATE__ = decompress(window.__INITIAL_STATE__)
|
|
||||||
}
|
|
||||||
|
|
||||||
router.isReady().then(() => {
|
|
||||||
app.mount('#app')
|
|
||||||
})
|
|
||||||
|
|
||||||
|
|||||||
@ -1,28 +1,32 @@
|
|||||||
import { renderToWebStream, renderToString } from 'vue/server-renderer'
|
import { renderToWebStream } from 'vue/server-renderer'
|
||||||
import { createApp } from './main'
|
import { createApp } from './main'
|
||||||
|
|
||||||
import { createSSRRouter } from './router.js'
|
import { createSSRRouter, defaultHead } from './router.js'
|
||||||
|
|
||||||
export async function getRoute(_url) {
|
export async function getRoute(_url) {
|
||||||
const router = createSSRRouter()
|
const router = createSSRRouter()
|
||||||
await router.push(_url)
|
await router.push(_url)
|
||||||
await router.isReady()
|
await router.isReady()
|
||||||
const route = router.currentRoute.value.matched[0]
|
const route = router.currentRoute.value.matched[0]
|
||||||
const code = route.meta.code || 200
|
const code = route.meta.code || 200
|
||||||
return { router, code }
|
return { router, code, meta: route.meta.meta || false,
|
||||||
|
title: route.meta.title || route.meta.name || defaultHead.title,
|
||||||
|
metas: [...defaultHead.meta, ...route.meta.metas || []]
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function render(router, cookies, host) {
|
export async function render(router, cookies, host) {
|
||||||
const { app, pinia } = createApp()
|
const { app, pinia } = createApp()
|
||||||
|
app.use(router)
|
||||||
app.use(router)
|
const headState = {
|
||||||
const ctx = {
|
ready: false,
|
||||||
cookies,
|
code: null,
|
||||||
host,
|
title: null,
|
||||||
initialState: {}
|
meta: []
|
||||||
}
|
}
|
||||||
const stream = renderToWebStream(app, ctx)
|
const ctx = { cookies, host, headState }
|
||||||
const piniaState = pinia.state.value
|
const stream = renderToWebStream(app, ctx)
|
||||||
return { stream, piniaState }
|
const piniaState = pinia.state.value
|
||||||
|
return { stream, piniaState, headState }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -16,5 +16,6 @@ export function createApp() {
|
|||||||
.component('Hr', Hr)
|
.component('Hr', Hr)
|
||||||
.component('BetterHr', Hr)
|
.component('BetterHr', Hr)
|
||||||
.component('Form', Form)
|
.component('Form', Form)
|
||||||
|
.component('BetterForm', Form)
|
||||||
return { app, pinia }
|
return { app, pinia }
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,27 +1,27 @@
|
|||||||
@import 'mdui/mdui.css';
|
|
||||||
// @import './assets/typescale.css';
|
|
||||||
|
|
||||||
// 字体配置
|
|
||||||
$font-family: Roboto, Noto Sans SC, PingFang SC, Lantinghei SC,
|
$font-family: Roboto, Noto Sans SC, PingFang SC, Lantinghei SC,
|
||||||
Microsoft Yahei, Hiragino Sans GB, "Microsoft Sans Serif",
|
Microsoft Yahei, Hiragino Sans GB, "Microsoft Sans Serif",
|
||||||
WenQuanYi Micro Hei, sans-serif;
|
WenQuanYi Micro Hei, sans-serif;
|
||||||
|
|
||||||
// MDUI 变量简写
|
|
||||||
$bg-color: rgb(var(--mdui-color-background));
|
$bg-color: rgb(var(--mdui-color-background));
|
||||||
$error-color: rgb(var(--mdui-color-error));
|
$error-color: rgb(var(--mdui-color-error));
|
||||||
$on-error-color: rgb(var(--mdui-color-on-error));
|
$on-error-color: rgb(var(--mdui-color-on-error));
|
||||||
$transition-duration: var(--mdui-motion-duration-short2);
|
|
||||||
$transition-easing: var(--mdui-motion-easing-linear);
|
html {
|
||||||
|
scroll-padding-top: 64px;
|
||||||
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
font-family: $font-family;
|
font-family: $font-family;
|
||||||
background-color: $bg-color;
|
background-color: $bg-color;
|
||||||
transition: opacity $transition-duration $transition-easing;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// MDUI 组件样式
|
pre {
|
||||||
|
overflow-x: auto;
|
||||||
|
overflow-y: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
mdui-card {
|
mdui-card {
|
||||||
width: 98%;
|
width: 100%;
|
||||||
padding: 8px;
|
padding: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -29,7 +29,6 @@ mdui-text-field {
|
|||||||
margin: 8px 0;
|
margin: 8px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
// 警告样式
|
|
||||||
.warn {
|
.warn {
|
||||||
background-color: $error-color;
|
background-color: $error-color;
|
||||||
color: $on-error-color;
|
color: $on-error-color;
|
||||||
@ -39,7 +38,6 @@ mdui-text-field {
|
|||||||
color: $error-color;
|
color: $error-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
// 通用工具类
|
|
||||||
.pre-break {
|
.pre-break {
|
||||||
white-space: pre-line;
|
white-space: pre-line;
|
||||||
}
|
}
|
||||||
@ -47,4 +45,3 @@ mdui-text-field {
|
|||||||
.no-select {
|
.no-select {
|
||||||
user-select: none;
|
user-select: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
163
src/router.js
163
src/router.js
@ -1,70 +1,99 @@
|
|||||||
import { createMemoryHistory, createWebHistory, createRouter } from 'vue-router'
|
import { createMemoryHistory, createWebHistory, createRouter } from 'vue-router'
|
||||||
|
|
||||||
export function createSSRRouter() {
|
export const defaultHead = {
|
||||||
const router = createRouter({
|
title: 'AO3 Mirror',
|
||||||
history: import.meta.env.SSR ? createMemoryHistory() : createWebHistory(),
|
meta: [
|
||||||
scrollBehavior(to, from, savedPosition) {
|
{ name: 'description',
|
||||||
if (savedPosition) {
|
content: 'ArchiveOfOurOwn 镜像站, 使用 Vue 3 与 MDUI 2 重写界面, 优化 UI/UX' },
|
||||||
return savedPosition
|
{ name: 'author',
|
||||||
} else if (to.hash) {
|
content: 'UnknownMp' },
|
||||||
return {
|
{ property: 'og:title',
|
||||||
el: to.hash,
|
content: 'AO3 Mirror' },
|
||||||
behavior: 'smooth',
|
{ property: 'og:description',
|
||||||
}
|
content: 'ArchiveOfOurOwn 重构镜像' },
|
||||||
} else {
|
{ property: 'og:image',
|
||||||
return { top: 0 }
|
content: 'https://cdn.unknownmp.top/website/ao3mirror.svg' },
|
||||||
}
|
{ property: 'og:url',
|
||||||
},
|
content: 'https://ao3.unknownmp.top' },
|
||||||
routes: [{
|
{ property: 'og:type',
|
||||||
path: '/',
|
content: 'website' },
|
||||||
name: '前言',
|
]
|
||||||
component: () => import('./views/Root.vue'),
|
|
||||||
meta: {
|
|
||||||
title: '首页',
|
|
||||||
order: 1
|
|
||||||
},
|
|
||||||
},{
|
|
||||||
path: '/work/:id',
|
|
||||||
name: 'work',
|
|
||||||
component: () => import('./views/Work.vue'),
|
|
||||||
meta: {
|
|
||||||
title: '阅读',
|
|
||||||
hidden: true
|
|
||||||
}
|
|
||||||
},{
|
|
||||||
path: '/work/:id/:cid',
|
|
||||||
name: 'workChapter',
|
|
||||||
component: () => import('./views/Work.vue'),
|
|
||||||
meta: {
|
|
||||||
title: '阅读',
|
|
||||||
hidden: true
|
|
||||||
}
|
|
||||||
},{
|
|
||||||
path: '/about',
|
|
||||||
name: '关于',
|
|
||||||
component: () => import('./views/About.vue'),
|
|
||||||
meta: {
|
|
||||||
title: '',
|
|
||||||
order: 2
|
|
||||||
},
|
|
||||||
},{
|
|
||||||
path: '/developer',
|
|
||||||
name: '开发人员选项',
|
|
||||||
component: () => import('./views/Developer.vue'),
|
|
||||||
meta: {
|
|
||||||
title: '',
|
|
||||||
hidden: true
|
|
||||||
},
|
|
||||||
},{
|
|
||||||
path: '/:catchAll(.*)',
|
|
||||||
name: 'NotFound',
|
|
||||||
component: () => import('./views/fallback/NotFound.vue'),
|
|
||||||
meta: {
|
|
||||||
title: '页面未找到',
|
|
||||||
hidden: true,
|
|
||||||
code: 404
|
|
||||||
}
|
|
||||||
}
|
|
||||||
]})
|
|
||||||
return router
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export const createSSRRouter = () => createRouter({
|
||||||
|
history: import.meta.env.SSR ? createMemoryHistory() : createWebHistory(),
|
||||||
|
scrollBehavior(to, from, savedPosition) {
|
||||||
|
if (savedPosition) return savedPosition
|
||||||
|
else if (to.hash) {
|
||||||
|
return {
|
||||||
|
el: to.hash,
|
||||||
|
behavior: 'smooth',
|
||||||
|
}
|
||||||
|
} else return { top: 0 }
|
||||||
|
},
|
||||||
|
routes: [{
|
||||||
|
path: '/',
|
||||||
|
name: '前言',
|
||||||
|
component: () => import('./views/Root.vue'),
|
||||||
|
meta: {
|
||||||
|
title: '首页',
|
||||||
|
order: 1
|
||||||
|
},
|
||||||
|
},{
|
||||||
|
path: '/work/:id',
|
||||||
|
name: 'work',
|
||||||
|
component: () => import('./views/Work.vue'),
|
||||||
|
meta: {
|
||||||
|
title: '阅读',
|
||||||
|
hidden: true,
|
||||||
|
meta: true
|
||||||
|
}
|
||||||
|
},{
|
||||||
|
path: '/work/:id/:cid',
|
||||||
|
name: 'workChapter',
|
||||||
|
component: () => import('./views/Work.vue'),
|
||||||
|
meta: {
|
||||||
|
title: '阅读',
|
||||||
|
hidden: true,
|
||||||
|
meta: true
|
||||||
|
}
|
||||||
|
},{
|
||||||
|
path: '/search/simple',
|
||||||
|
name: '搜索',
|
||||||
|
component: () => import('./views/SimpleSearch.vue'),
|
||||||
|
meta: {
|
||||||
|
title: '搜索',
|
||||||
|
order: 2
|
||||||
|
}
|
||||||
|
},{
|
||||||
|
path: '/settings',
|
||||||
|
name: '设置',
|
||||||
|
component: () => import('./views/Settings.vue'),
|
||||||
|
meta: {
|
||||||
|
order: 90
|
||||||
|
},
|
||||||
|
},{
|
||||||
|
path: '/about',
|
||||||
|
name: '关于',
|
||||||
|
component: () => import('./views/About.md'),
|
||||||
|
meta: {
|
||||||
|
order: 100
|
||||||
|
},
|
||||||
|
},{
|
||||||
|
path: '/developer',
|
||||||
|
name: '开发人员选项',
|
||||||
|
component: () => import('./views/Developer.vue'),
|
||||||
|
meta: {
|
||||||
|
hidden: true
|
||||||
|
},
|
||||||
|
},{
|
||||||
|
path: '/:catchAll(.*)',
|
||||||
|
name: 'NotFound',
|
||||||
|
component: () => import('./views/fallback/NotFound.vue'),
|
||||||
|
meta: {
|
||||||
|
title: '页面未找到',
|
||||||
|
hidden: true,
|
||||||
|
code: 404
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]})
|
||||||
|
|||||||
@ -2,11 +2,11 @@
|
|||||||
import { useClientOnlyStore } from './clientOnlyStore.js'
|
import { useClientOnlyStore } from './clientOnlyStore.js'
|
||||||
const clientOnlyStore = useClientOnlyStore()
|
const clientOnlyStore = useClientOnlyStore()
|
||||||
</script>
|
</script>
|
||||||
<template data-allow-mismatch>
|
<template>
|
||||||
<template v-if="clientOnlyStore.isClient" data-allow-mismatch>
|
<template v-if="clientOnlyStore.isClient">
|
||||||
<slot></slot>
|
<slot></slot>
|
||||||
</template><template v-else>
|
</template><template v-else>
|
||||||
<slot name="ssr" data-allow-mismatch></slot>
|
<slot name="ssr"></slot>
|
||||||
</template>
|
</template>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|||||||
@ -1,25 +0,0 @@
|
|||||||
<script setup>
|
|
||||||
import { ref, onMounted, useSlots } from 'vue'
|
|
||||||
|
|
||||||
const isClient = ref(false)
|
|
||||||
const slots = useSlots()
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
isClient.value = true
|
|
||||||
})
|
|
||||||
/*
|
|
||||||
USe:
|
|
||||||
<ClientOnly>
|
|
||||||
<template #ssr>
|
|
||||||
SSR Content
|
|
||||||
</template>
|
|
||||||
Real Content
|
|
||||||
</ClientOnly>
|
|
||||||
*/
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template data-allow-mismatch>
|
|
||||||
<template v-if="isClient" data-allow-mismatch><slot></slot></template>
|
|
||||||
<template v-else><slot name="ssr" data-allow-mismatch></slot></template>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
47
src/ssr/headHelper.js
Normal file
47
src/ssr/headHelper.js
Normal file
@ -0,0 +1,47 @@
|
|||||||
|
import { useSSRContext } from 'vue'
|
||||||
|
|
||||||
|
export function useHeadHelper() {
|
||||||
|
if (!import.meta.env.SSR) {
|
||||||
|
return {
|
||||||
|
headReady: () => {},
|
||||||
|
setMeta: () => {},
|
||||||
|
addMeta: () => {},
|
||||||
|
setTitle: () => {},
|
||||||
|
setCode: () => {},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const ssrContext = useSSRContext()
|
||||||
|
|
||||||
|
if (!ssrContext || !ssrContext.headState) {
|
||||||
|
return {
|
||||||
|
headReady: () => {},
|
||||||
|
setMeta: () => {},
|
||||||
|
addMeta: () => {},
|
||||||
|
setTitle: () => {},
|
||||||
|
setCode: () => {},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
headReady: () => {
|
||||||
|
ssrContext.headState.ready = true
|
||||||
|
},
|
||||||
|
setMeta: (metas = []) => {
|
||||||
|
ssrContext.headState.meta = [
|
||||||
|
...ssrContext.headState.meta,
|
||||||
|
...metas
|
||||||
|
]
|
||||||
|
},
|
||||||
|
addMeta: (meta) => {
|
||||||
|
ssrContext.headState.meta.push(meta)
|
||||||
|
},
|
||||||
|
setTitle: (title) => {
|
||||||
|
ssrContext.headState.title = title
|
||||||
|
},
|
||||||
|
setCode: (code) => {
|
||||||
|
ssrContext.headState.code = code
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@ -1,9 +0,0 @@
|
|||||||
export function getInitialState(key) {
|
|
||||||
if (typeof window !== 'undefined' && window.__INITIAL_STATE__) {
|
|
||||||
if (window.__INITIAL_STATE__[key] !== undefined) {
|
|
||||||
let value = window.__INITIAL_STATE__[key]
|
|
||||||
delete window.__INITIAL_STATE__[key]
|
|
||||||
return value
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,114 +1,20 @@
|
|||||||
import { ref, computed, watch } from 'vue'
|
|
||||||
import { defineStore } from 'pinia'
|
import { defineStore } from 'pinia'
|
||||||
import { useSSRContext } from 'vue'
|
import { useApiRequest } from '../composables/apiRequest.js'
|
||||||
import axios from 'axios'
|
|
||||||
|
|
||||||
import { objectToQueryString, getCookie, setCookie } from '@/utils.js'
|
|
||||||
|
|
||||||
const apiMapping = {
|
|
||||||
'': ['http://localhost:28001/','/api/']
|
|
||||||
}
|
|
||||||
|
|
||||||
function replaceUrl(url) {
|
|
||||||
return url
|
|
||||||
.replace('{{hostname}}',window.location.hostname)
|
|
||||||
.replace('{{port}}',window.location.port)
|
|
||||||
.replace('{{protocol}}',window.location.protocol)
|
|
||||||
}
|
|
||||||
|
|
||||||
export const useApiStore = defineStore('api', () => {
|
export const useApiStore = defineStore('api', () => {
|
||||||
let host = import.meta.env.SSR ? useSSRContext().host : window.location.host
|
|
||||||
let entry = apiMapping[host] ? apiMapping[host] : apiMapping['']
|
|
||||||
let endpoint = import.meta.env.SSR ? entry[0] : replaceUrl(entry[1])
|
|
||||||
//console.log('Entry point:', endpoint)
|
|
||||||
var inited = false
|
|
||||||
var initializing = false
|
|
||||||
async function apiGet(url, data) {
|
|
||||||
const realURL = data
|
|
||||||
? `${endpoint}${url}?${objectToQueryString(data)}`
|
|
||||||
: `${endpoint}${url}`
|
|
||||||
try {
|
|
||||||
let start = Date.now()
|
|
||||||
const response = await axios.get(realURL)
|
|
||||||
let stop = Date.now()
|
|
||||||
return {
|
|
||||||
status: response.status,
|
|
||||||
data: response.data,
|
|
||||||
start, stop,
|
|
||||||
duration: stop - start,
|
|
||||||
isSSR: import.meta.env.SSR
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
if (error.response) {
|
|
||||||
return {
|
|
||||||
status: error.response.status,
|
|
||||||
data: error.response.data,
|
|
||||||
isSSR: import.meta.env.SSR
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
return {
|
|
||||||
status: -1,
|
|
||||||
data: null
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
async function apiPost(url, data) {
|
|
||||||
const realURL = `${endpoint}${url}`;
|
|
||||||
try {
|
|
||||||
let start = Date.now()
|
|
||||||
const response = await axios.post(realURL, data, {
|
|
||||||
headers: { 'Content-Type': 'application/json' }
|
|
||||||
})
|
|
||||||
let stop = Date.now()
|
|
||||||
return {
|
|
||||||
status: response.status,
|
|
||||||
data: response.data,
|
|
||||||
start, stop,
|
|
||||||
duration: stop - start,
|
|
||||||
isSSR: import.meta.env.SSR
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
if (error.response) {
|
|
||||||
return {
|
|
||||||
status: error.response.status,
|
|
||||||
data: error.response.data,
|
|
||||||
isSSR: import.meta.env.SSR
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
return {
|
|
||||||
status: -1,
|
|
||||||
data: null
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
async function init() {
|
|
||||||
if (inited) return
|
|
||||||
if (initializing) {
|
|
||||||
while (initializing) {
|
|
||||||
await new Promise((resolve) => setTimeout(resolve, 100))
|
|
||||||
}
|
|
||||||
return
|
|
||||||
}
|
|
||||||
initializing = true
|
|
||||||
inited = true
|
|
||||||
initializing = false
|
|
||||||
if (!import.meta.env.SSR) {
|
|
||||||
console.log(`[API] Inited! endpoint: ${endpoint}`)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
async function reInit(){
|
|
||||||
inited = false
|
|
||||||
await init()
|
|
||||||
}
|
|
||||||
async function getWork(workId, chapterId) {
|
async function getWork(workId, chapterId) {
|
||||||
if (chapterId) return await apiGet(`work/${workId}/${chapterId}`)
|
const path = chapterId ? `work/${workId}/${chapterId}` : `work/${workId}`
|
||||||
return await apiGet(`work/${workId}`)
|
const { execute } = useApiRequest('GET', path)
|
||||||
|
return await execute()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async function workSimpleSearch(keyword, page = 1) {
|
||||||
|
const { execute } = useApiRequest('GET', 'search/simple', { keyword, page })
|
||||||
|
return await execute()
|
||||||
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
init,
|
getWork,
|
||||||
reInit,
|
workSimpleSearch
|
||||||
getWork
|
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|||||||
27
src/stores/appSetting.js
Normal file
27
src/stores/appSetting.js
Normal file
@ -0,0 +1,27 @@
|
|||||||
|
import { defineStore } from 'pinia'
|
||||||
|
import { useStorage } from '@vueuse/core'
|
||||||
|
|
||||||
|
const CURRENT_VERSION = 1
|
||||||
|
|
||||||
|
const DEFAULT_SETTINGS = {
|
||||||
|
version: CURRENT_VERSION,
|
||||||
|
darkTheme: false,
|
||||||
|
autoTheme: true,
|
||||||
|
colorScheme: '#890000'
|
||||||
|
}
|
||||||
|
|
||||||
|
export const useAppSettingStore = defineStore('appSetting', () => {
|
||||||
|
const stored = useStorage('app-settings', DEFAULT_SETTINGS)
|
||||||
|
if (stored.version !== CURRENT_VERSION) {
|
||||||
|
Object.assign(stored, DEFAULT_SETTINGS)
|
||||||
|
}
|
||||||
|
function resetSettings() {
|
||||||
|
Object.assign(stored, DEFAULT_SETTINGS)
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
value: stored,
|
||||||
|
resetSettings,
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
@ -2,6 +2,8 @@ import { ref, computed, watch } from 'vue'
|
|||||||
import { defineStore } from 'pinia'
|
import { defineStore } from 'pinia'
|
||||||
import { useRouter, useRoute } from 'vue-router'
|
import { useRouter, useRoute } from 'vue-router'
|
||||||
|
|
||||||
|
import { useHeadHelper } from '../ssr/headHelper.js'
|
||||||
|
|
||||||
export const useRouteStore = defineStore('route', () => {
|
export const useRouteStore = defineStore('route', () => {
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const route = useRoute()
|
const route = useRoute()
|
||||||
@ -16,14 +18,14 @@ export const useRouteStore = defineStore('route', () => {
|
|||||||
)
|
)
|
||||||
const lastFromDrawer = ref(0)
|
const lastFromDrawer = ref(0)
|
||||||
const customTitle = ref(null)
|
const customTitle = ref(null)
|
||||||
const title = computed(() => customTitle.value || route.meta.title || route.name)
|
const title = import.meta.env.SSR ?
|
||||||
|
computed(() => route.meta.title || route.name) :
|
||||||
|
computed(() => customTitle.value || route.meta.title || route.name)
|
||||||
function drawerPress(target) {
|
function drawerPress(target) {
|
||||||
if (lastFromDrawer.value == 0) {
|
if (lastFromDrawer.value == 0) {
|
||||||
lastFromDrawer.value = 1
|
lastFromDrawer.value = 1
|
||||||
router.push(target)
|
router.push(target)
|
||||||
} else {
|
} else router.replace(target)
|
||||||
router.replace(target)
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
const progress = ref(0)
|
const progress = ref(0)
|
||||||
const progressMax = ref(1)
|
const progressMax = ref(1)
|
||||||
@ -32,11 +34,9 @@ export const useRouteStore = defineStore('route', () => {
|
|||||||
watch(title, title => document.title = title)
|
watch(title, title => document.title = title)
|
||||||
let progressTimer = null
|
let progressTimer = null
|
||||||
router.beforeEach((to, from) => {
|
router.beforeEach((to, from) => {
|
||||||
if (lastFromDrawer.value == 2) {
|
if (showProgress.value) return false
|
||||||
lastFromDrawer.value = 0
|
if (lastFromDrawer.value == 2) lastFromDrawer.value = 0
|
||||||
} else if (lastFromDrawer.value == 1) {
|
else if (lastFromDrawer.value == 1) lastFromDrawer.value = 2
|
||||||
lastFromDrawer.value = 2
|
|
||||||
}
|
|
||||||
progress.value = 0
|
progress.value = 0
|
||||||
progressMax.value = 1
|
progressMax.value = 1
|
||||||
showProgress.value = true
|
showProgress.value = true
|
||||||
|
|||||||
57
src/stores/search.js
Normal file
57
src/stores/search.js
Normal file
@ -0,0 +1,57 @@
|
|||||||
|
import { ref } from 'vue'
|
||||||
|
import { defineStore } from 'pinia'
|
||||||
|
|
||||||
|
import { useApiStore } from '@/stores/api.js'
|
||||||
|
|
||||||
|
export const useSimpleSearchState = defineStore('simpleSearch', () => {
|
||||||
|
const api = useApiStore()
|
||||||
|
const keyword = ref('')
|
||||||
|
const result = ref([])
|
||||||
|
const count = ref(0)
|
||||||
|
const pageCount = ref(0)
|
||||||
|
const currentPage = ref(0)
|
||||||
|
const state = ref(null)
|
||||||
|
async function load() {
|
||||||
|
if (pageCount.value && currentPage.value >= pageCount.value){ state.value = 'finish'; return }
|
||||||
|
state.value = 'loading'
|
||||||
|
let res = await api.workSimpleSearch(keyword.value, currentPage.value)
|
||||||
|
res = res.data
|
||||||
|
if (res.code == 0) {
|
||||||
|
currentPage.value++
|
||||||
|
if( pageCount.value ) {
|
||||||
|
if (currentPage.value > pageCount.value) currentPage.value = pageCount.value
|
||||||
|
} else {
|
||||||
|
pageCount.value = res.pageCount
|
||||||
|
}
|
||||||
|
count.value = res.count
|
||||||
|
state.value = import.meta.env.SSR ? 'ssrready' : 'ready'
|
||||||
|
result.value.push(...res.works)
|
||||||
|
} else if (res.code == 1) {
|
||||||
|
if ( count.value ) {
|
||||||
|
state.value = 'finish'
|
||||||
|
} else {
|
||||||
|
currentPage.value = 0
|
||||||
|
state.value = 'notfound'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
async function start(key) {
|
||||||
|
if (key == keyword.value) return
|
||||||
|
keyword.value = key
|
||||||
|
result.value = []
|
||||||
|
state.value = 'loading'
|
||||||
|
currentPage.value = 1
|
||||||
|
pageCount.value = 0
|
||||||
|
await load()
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
keyword,
|
||||||
|
result,
|
||||||
|
count,
|
||||||
|
pageCount,
|
||||||
|
currentPage,
|
||||||
|
state,
|
||||||
|
load, start
|
||||||
|
}
|
||||||
|
})
|
||||||
@ -1,12 +1,17 @@
|
|||||||
import { ref, computed } from 'vue'
|
import { ref, computed } from 'vue'
|
||||||
import { defineStore } from 'pinia'
|
import { defineStore } from 'pinia'
|
||||||
|
import { useDark } from '@vueuse/core'
|
||||||
|
|
||||||
import { setTheme } from 'mdui/functions/setTheme.js'
|
import { setTheme } from 'mdui/functions/setTheme.js'
|
||||||
import { setColorScheme } from 'mdui/functions/setColorScheme.js'
|
import { setColorScheme } from 'mdui/functions/setColorScheme.js'
|
||||||
|
|
||||||
|
import { useAppSettingStore } from './appSetting.js'
|
||||||
|
|
||||||
export const useThemeStore = defineStore('homePage', () => {
|
export const useThemeStore = defineStore('homePage', () => {
|
||||||
const mode = ref('auto')
|
const isDark = useDark()
|
||||||
const color = ref('#890000')
|
const appSetting = useAppSettingStore()
|
||||||
|
const mode = ref(appSetting.value.autoTheme ? 'auto' : appSetting.value.darkTheme ? 'dark' : 'light')
|
||||||
|
const color = ref(appSetting.value.colorScheme)
|
||||||
function setColor(target) {
|
function setColor(target) {
|
||||||
if (color.value != target) {
|
if (color.value != target) {
|
||||||
color.value = target
|
color.value = target
|
||||||
@ -20,10 +25,10 @@ export const useThemeStore = defineStore('homePage', () => {
|
|||||||
setTheme(mode.value)
|
setTheme(mode.value)
|
||||||
}
|
}
|
||||||
function switchMode(callback) {
|
function switchMode(callback) {
|
||||||
if (mode.value === 'auto' || mode.value === 'light') {
|
if (mode.value === 'auto') {
|
||||||
mode.value = 'dark'
|
mode.value = isDark.value ? 'light' : 'dark'
|
||||||
} else {
|
} else {
|
||||||
mode.value = 'light'
|
mode.value = mode.value === 'dark' ? 'light' : 'dark'
|
||||||
}
|
}
|
||||||
setMode(mode.value)
|
setMode(mode.value)
|
||||||
if (callback) {
|
if (callback) {
|
||||||
|
|||||||
@ -10,58 +10,80 @@ export const useWorkReadState = defineStore('workRead', () => {
|
|||||||
const id = ref(null)
|
const id = ref(null)
|
||||||
const cid = ref(null)
|
const cid = ref(null)
|
||||||
const summary = ref(null)
|
const summary = ref(null)
|
||||||
const pesud = ref(null)
|
const pseud = ref(null)
|
||||||
const title = ref(null)
|
const title = ref(null)
|
||||||
const text = ref(null)
|
const text = ref(null)
|
||||||
const state = ref('')
|
const state = ref('')
|
||||||
const publishedTime = ref(null)
|
const publishedTime = ref(null)
|
||||||
|
const completedTime = ref(null)
|
||||||
|
const updatedTime = ref(null)
|
||||||
const wordCount = ref(0)
|
const wordCount = ref(0)
|
||||||
const kudoCount = ref(0)
|
const kudoCount = ref(0)
|
||||||
const hitCount = ref(0)
|
const hitCount = ref(0)
|
||||||
const category = ref([])
|
const category = ref([])
|
||||||
const fandom = ref([])
|
const fandom = ref([])
|
||||||
const lang = ref(null)
|
const lang = ref(null)
|
||||||
|
const chapters = ref([])
|
||||||
|
const chapterIndex = ref(null)
|
||||||
|
const chapterStat = ref(null)
|
||||||
function setData(data) {
|
function setData(data) {
|
||||||
|
cid.value = data.chapterId
|
||||||
id.value = data.workId
|
id.value = data.workId
|
||||||
title.value = data.title
|
title.value = data.title
|
||||||
summary.value = [escapeAndFormatText(data.summary)]
|
summary.value = data.summary ? escapeAndFormatText(data.summary) : null
|
||||||
pesud.value = data.pesud
|
pseud.value = data.pseud
|
||||||
text.value = data.text
|
text.value = data.text
|
||||||
publishedTime.value = data.stats.publishedTime
|
publishedTime.value = data.stats.publishedTime
|
||||||
|
completedTime.value = data.stats.completedTime
|
||||||
|
updatedTime.value = data.stats.updatedTime
|
||||||
wordCount.value = data.stats.wordCount
|
wordCount.value = data.stats.wordCount
|
||||||
kudoCount.value = data.stats.kudoCount
|
kudoCount.value = data.stats.kudoCount
|
||||||
hitCount.value = data.stats.hitCount
|
hitCount.value = data.stats.hitCount
|
||||||
category.value = data.category
|
category.value = data.category
|
||||||
fandom.value = data.fandom
|
fandom.value = data.fandom
|
||||||
lang.value = data.lang
|
lang.value = data.lang
|
||||||
|
chapters.value = data.chapters || []
|
||||||
|
chapterIndex.value = data.chapterIndex ?? null
|
||||||
|
chapterStat.value = data.stats.chapter
|
||||||
}
|
}
|
||||||
async function loadWork(target, targetc) {
|
async function loadWork(target, targetc) {
|
||||||
if (target == id.value && targetc == cid.value || state.value == 'loading') return
|
const itarget = parseInt(target)
|
||||||
|
if (isNaN(itarget)) {
|
||||||
|
console.log('a')
|
||||||
|
state.value = 'errformat'
|
||||||
|
return
|
||||||
|
}
|
||||||
|
const itargetc = parseInt(targetc)
|
||||||
|
if (
|
||||||
|
itarget === id.value &&
|
||||||
|
(itargetc === cid.value || (isNaN(itargetc) && cid.value === null)) &&
|
||||||
|
state.value !== 'loading'
|
||||||
|
) return
|
||||||
|
id.value = itarget
|
||||||
|
cid.value = isNaN(itargetc) ? null : itargetc
|
||||||
state.value = 'loading'
|
state.value = 'loading'
|
||||||
const result = await api.getWork(target, targetc)
|
const result = await api.getWork(id.value, cid.value)
|
||||||
if (result.status == 200) {
|
if (result.status == 200) {
|
||||||
setData(result.data)
|
setData(result.data)
|
||||||
state.value = 'ready'
|
state.value = 'ready'
|
||||||
} else {
|
} else if (result.status == 404) {
|
||||||
id.value = target
|
|
||||||
state.value = import.meta.env.SSR ? 'ssrnotfound' : 'notfound'
|
state.value = import.meta.env.SSR ? 'ssrnotfound' : 'notfound'
|
||||||
|
} else if (result.status == 401) {
|
||||||
|
state.value = 'unauth'
|
||||||
|
} else if (result.status == 500) {
|
||||||
|
state.value = 'error'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return {
|
return {
|
||||||
id, cid,
|
id, cid,
|
||||||
title,
|
title, summary,
|
||||||
summary,
|
pseud, text, state,
|
||||||
pesud,
|
|
||||||
text,
|
|
||||||
state,
|
|
||||||
publishedTime,
|
publishedTime,
|
||||||
wordCount,
|
completedTime,
|
||||||
kudoCount,
|
updatedTime,
|
||||||
hitCount,
|
wordCount, kudoCount, hitCount,
|
||||||
category,
|
category, fandom, lang,
|
||||||
fandom,
|
chapters, chapterIndex, chapterStat,
|
||||||
lang,
|
setData, loadWork
|
||||||
setData,
|
|
||||||
loadWork
|
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|||||||
@ -1,32 +0,0 @@
|
|||||||
# 关于
|
|
||||||
|
|
||||||
这是什么, 有口舍用 ?
|
|
||||||
|
|
||||||
概述
|
|
||||||
---
|
|
||||||
一个 AO3 镜像站
|
|
||||||
|
|
||||||
## 作者 (1)
|
|
||||||
---
|
|
||||||
- [UnknownMp](https://www.unknownmp.top)
|
|
||||||
<mdui-avatar src="https://cdn.unknownmp.top/website/logo.jpg"></mdui-avatar>
|
|
||||||
|
|
||||||
|
|
||||||
组件库与工具链
|
|
||||||
---
|
|
||||||
- MDUI 2 [mdui.org](https://mdui.org)
|
|
||||||
- Vue 3 [vuejs.org](https://vuejs.org)
|
|
||||||
- Vite 6 [vitejs.dev](https://vite.dev)
|
|
||||||
|
|
||||||
废弃特性
|
|
||||||
---
|
|
||||||
|
|
||||||
### 书签 {#deprecated-feature-bookmark}
|
|
||||||
|
|
||||||
因为底层 IndexedDB 更新困难和作品段落解析困难问题, 所以在 **v1.0.7** 以后的版本废弃了书签机制
|
|
||||||
|
|
||||||
其他
|
|
||||||
---
|
|
||||||
本站支持 "Server Side Rendering" by Vite SSR
|
|
||||||
|
|
||||||
CDN by Cloudflare (赛博佛祖😭)
|
|
||||||
@ -1,14 +1,10 @@
|
|||||||
# 欢迎来到 AO3 Mirror! 👋👋
|
|
||||||
|
|
||||||
一个基于重构渲染的 AO3 镜像站
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 这是什么🤨
|
## 这是什么🤨
|
||||||
|
|
||||||
本网站是对 ArchiveOfOurOwn (AO3) 的一个镜像网站
|
本网站是对 ArchiveOfOurOwn (AO3) 的一个镜像网站
|
||||||
|
|
||||||
但是不同于直接转发所有页面内容, 本站点会先解析原始 AO3 页面内容, 然后重新组合, 这使得我们有更大的操作空间
|
但是不同于直接转发所有页面内容, 本站点会先解析原始 AO3 页面内容, 然后重新渲染
|
||||||
|
|
||||||
|
这使得我们可以重写界面, 采用 **质感设计3** 界面重构, 提供更好的交互界面
|
||||||
|
|
||||||
## 怎么使用🤔
|
## 怎么使用🤔
|
||||||
|
|
||||||
@ -42,5 +38,5 @@
|
|||||||
- ✅ 预览
|
- ✅ 预览
|
||||||
- ✅ 作品详细数据
|
- ✅ 作品详细数据
|
||||||
- 📝 搜索
|
- 📝 搜索
|
||||||
- ❌ 不再支持! [详情](/about#deprecated-feature-bookmark) 书签 (本地)
|
- ❌ 书签 (本地) **不再支持! [详情](/about#deprecated-feature-bookmark)**
|
||||||
|
|
||||||
|
|||||||
@ -1,9 +1,3 @@
|
|||||||
<template>
|
|
||||||
<form @submit="handleSubmit">
|
|
||||||
<slot></slot>
|
|
||||||
</form>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
|
|
||||||
@ -18,3 +12,9 @@ function handleSubmit(event) {
|
|||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<form @submit="handleSubmit">
|
||||||
|
<slot></slot>
|
||||||
|
</form>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
|||||||
111
src/utils.js
111
src/utils.js
@ -1,11 +1,7 @@
|
|||||||
import { snackbar } from 'mdui/functions/snackbar.js'
|
import { snackbar } from 'mdui/functions/snackbar.js'
|
||||||
import { alert } from 'mdui/functions/alert.js'
|
import { alert } from 'mdui/functions/alert.js'
|
||||||
|
|
||||||
export function mduiSnackbar(message) {
|
export const mduiSnackbar = (message) => snackbar({ message })
|
||||||
snackbar({
|
|
||||||
message: message,
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
export function mduiAlert(title,desc,callback = null,confirmText = "OK") {
|
export function mduiAlert(title,desc,callback = null,confirmText = "OK") {
|
||||||
alert({
|
alert({
|
||||||
@ -19,50 +15,44 @@ export function mduiAlert(title,desc,callback = null,confirmText = "OK") {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export function getQueryVariable(variable) {
|
export function getQueryVariable(variable) {
|
||||||
var query = window.location.search.substring(1);
|
var query = window.location.search.substring(1)
|
||||||
var vars = query.split("&")
|
var vars = query.split("&")
|
||||||
for (var i=0;i<vars.length;i++) {
|
for (var i=0;i<vars.length;i++) {
|
||||||
var pair = vars[i].split("=")
|
var pair = vars[i].split("=")
|
||||||
if(pair[0] == variable){return pair[1]}
|
if(pair[0] == variable){return pair[1]}
|
||||||
}
|
}
|
||||||
return(null);
|
return null
|
||||||
}
|
}
|
||||||
|
|
||||||
export const escapeHtml = (text) =>
|
export const escapeHtml = (text) => text
|
||||||
text
|
.replace(/&/g, "&") // 转义 &
|
||||||
.replace(/&/g, "&") // 转义 &
|
.replace(/</g, "<") // 转义 <
|
||||||
.replace(/</g, "<") // 转义 <
|
.replace(/>/g, ">") // 转义 >
|
||||||
.replace(/>/g, ">") // 转义 >
|
.replace(/"/g, """) // 转义 "
|
||||||
.replace(/"/g, """) // 转义 "
|
.replace(/'/g, "'"); // 转义 '
|
||||||
.replace(/'/g, "'"); // 转义 '
|
|
||||||
|
|
||||||
export function escapeAndFormatText(input) {
|
export const escapeAndFormatText = (text) => escapeHtml(text)
|
||||||
let escapedText = escapeHtml(input);
|
.replace(/ /g, " ")
|
||||||
escapedText = escapedText.replace(/ /g, " ");
|
.replace(/\t/g, "  ")
|
||||||
escapedText = escapedText.replace(/\t/g, "  ");
|
.replace(/\n/g, "<br/>")
|
||||||
escapedText = escapedText.replace(/\n/g, "<br/>");
|
|
||||||
return escapedText;
|
|
||||||
}
|
|
||||||
|
|
||||||
export function getCookie(name) {
|
export function getCookie(name) {
|
||||||
const cookieArr = document.cookie.split(";")
|
const cookieArr = document.cookie.split(";")
|
||||||
for (let i = 0; i < cookieArr.length; i++) {
|
for (let i = 0; i < cookieArr.length; i++) {
|
||||||
const cookiePair = cookieArr[i].trim()
|
const cookiePair = cookieArr[i].trim()
|
||||||
if (cookiePair.startsWith(name + "=")) {
|
if (cookiePair.startsWith(name + "=")) return cookiePair.substring(name.length + 1)
|
||||||
return cookiePair.substring(name.length + 1);
|
}
|
||||||
}
|
return null
|
||||||
}
|
|
||||||
return null;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export function setCookie(name, value, days = 3650) {
|
export function setCookie(name, value, days = 3650) {
|
||||||
var expires = ""
|
var expires = ""
|
||||||
if (days) {
|
if (days) {
|
||||||
var date = new Date()
|
var date = new Date()
|
||||||
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
|
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000))
|
||||||
expires = "; expires=" + date.toUTCString()
|
expires = "; expires=" + date.toUTCString()
|
||||||
}
|
}
|
||||||
document.cookie = name + "=" + value + expires + "; path=/";
|
document.cookie = name + "=" + value + expires + "; path=/"
|
||||||
}
|
}
|
||||||
|
|
||||||
export function objectToQueryString(obj, parentKey = '') {
|
export function objectToQueryString(obj, parentKey = '') {
|
||||||
@ -71,42 +61,37 @@ export function objectToQueryString(obj, parentKey = '') {
|
|||||||
if (!Object.prototype.hasOwnProperty.call(obj, key)) continue
|
if (!Object.prototype.hasOwnProperty.call(obj, key)) continue
|
||||||
let value = obj[key]
|
let value = obj[key]
|
||||||
let newKey = parentKey ? `${parentKey}[${key}]` : key
|
let newKey = parentKey ? `${parentKey}[${key}]` : key
|
||||||
if (typeof value === 'object' && value !== null) {
|
if (typeof value === 'object' && value !== null) parts.push(objectToQueryString(value, newKey))
|
||||||
parts.push(objectToQueryString(value, newKey))
|
else parts.push(encodeURIComponent(newKey) + '=' + encodeURIComponent(value))
|
||||||
} else {
|
|
||||||
parts.push(encodeURIComponent(newKey) + '=' + encodeURIComponent(value))
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
return parts.join('&')
|
return parts.join('&')
|
||||||
}
|
}
|
||||||
|
|
||||||
export function formatUnixTimestamp(unixTimestamp, timeZone) {
|
export function formatUnixTimestamp(unixTimestamp, timeZone) {
|
||||||
const date = new Date(unixTimestamp * 1000); // 将 UNIX 时间戳转换为毫秒
|
const date = new Date(unixTimestamp * 1000)
|
||||||
const options = {
|
const options = {
|
||||||
timeZone: timeZone || Intl.DateTimeFormat().resolvedOptions().timeZone, // 使用指定时区或浏览器本地时区
|
timeZone: timeZone || Intl.DateTimeFormat().resolvedOptions().timeZone,
|
||||||
year: 'numeric',
|
year: 'numeric',
|
||||||
month: '2-digit',
|
month: '2-digit',
|
||||||
day: '2-digit',
|
day: '2-digit',
|
||||||
hour: '2-digit',
|
hour: '2-digit',
|
||||||
minute: '2-digit',
|
minute: '2-digit',
|
||||||
second: '2-digit',
|
second: '2-digit',
|
||||||
hour12: false, // 24小时制
|
hour12: false,
|
||||||
};
|
}
|
||||||
const formatter = new Intl.DateTimeFormat('en-US', options);
|
const formatter = new Intl.DateTimeFormat('en-US', options)
|
||||||
const parts = formatter.formatToParts(date);
|
const parts = formatter.formatToParts(date)
|
||||||
const formatMap = {};
|
const formatMap = {}
|
||||||
parts.forEach(({ type, value }) => {
|
parts.forEach(({ type, value }) => { formatMap[type] = value })
|
||||||
formatMap[type] = value;
|
return `${formatMap.year}-${formatMap.month}-${formatMap.day} ${formatMap.hour}:${formatMap.minute}:${formatMap.second}`
|
||||||
});
|
|
||||||
return `${formatMap.year}-${formatMap.month}-${formatMap.day} ${formatMap.hour}:${formatMap.minute}:${formatMap.second}`;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export function isMobileDeviceByUA() {
|
export function isMobileDeviceByUA() {
|
||||||
const ua = navigator.userAgent || navigator.vendor || window.opera;
|
const ua = navigator.userAgent || navigator.vendor || window.opera
|
||||||
return /android/i.test(ua) ||
|
return /android/i.test(ua) ||
|
||||||
/iphone/i.test(ua) ||
|
/iphone/i.test(ua) ||
|
||||||
/ipod/i.test(ua) ||
|
/ipod/i.test(ua) ||
|
||||||
/ipad/i.test(ua) ||
|
/ipad/i.test(ua) ||
|
||||||
/blackberry/i.test(ua) ||
|
/blackberry/i.test(ua) ||
|
||||||
/windows phone/i.test(ua);
|
/windows phone/i.test(ua)
|
||||||
}
|
}
|
||||||
|
|||||||
63
src/views/About.md
Normal file
63
src/views/About.md
Normal file
@ -0,0 +1,63 @@
|
|||||||
|
<script setup>
|
||||||
|
import About from '../texts/about.md'
|
||||||
|
import FunAnimation from '../components/FunAnimation.vue'
|
||||||
|
|
||||||
|
import 'mdui/components/avatar.js'
|
||||||
|
/*import { onBeforeMount, onMounted, onUnmounted, onBeforeUnmount, onActivated, onDeactivated } from 'vue'
|
||||||
|
console.log('Setup')
|
||||||
|
onBeforeMount(() => console.log('Before mount'))
|
||||||
|
onMounted(() => console.log('Mounted'))
|
||||||
|
onDeactivated(() => console.log('Deactivated'))
|
||||||
|
onActivated(() => console.log('Activated'))
|
||||||
|
onBeforeUnmount(() => console.log('Before unmount'))
|
||||||
|
onUnmounted(() => console.log('Unmounted'))*/
|
||||||
|
</script>
|
||||||
|
|
||||||
|
# 关于
|
||||||
|
|
||||||
|
这是什么, 有口舍用 ?
|
||||||
|
|
||||||
|
概述
|
||||||
|
---
|
||||||
|
一个 AO3 镜像站, 优化了 UI/UX
|
||||||
|
|
||||||
|
作者 {#contact}
|
||||||
|
---
|
||||||
|
- [UnknownMp](https://www.unknownmp.top)
|
||||||
|
邮件: unknownmp@unknownmp.top
|
||||||
|
<mdui-avatar src="https://cdn.unknownmp.top/website/logo.jpg"></mdui-avatar>
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
源代码
|
||||||
|
---
|
||||||
|
- 前端 Vue3 + Vite 6 (SSR) + MDUI 2 [Gitea](https://git.unknownmp.top/default/ao3-mirror-ssr)
|
||||||
|
- 后端 FastAPI + HttpX + LXML *(暂无仓库)*
|
||||||
|
|
||||||
|
组件库与工具链
|
||||||
|
---
|
||||||
|
### 前端
|
||||||
|
- MDUI 2 [mdui.org](https://mdui.org)
|
||||||
|
- Vue 3 [vuejs.org](https://vuejs.org)
|
||||||
|
- Vite 6 [vite.dev](https://vite.dev)
|
||||||
|
### 后端
|
||||||
|
- FastAPI [fastapi.tiangolo.com](https://fastapi.tiangolo.com/)
|
||||||
|
- HttpX [python-httpx.org](https://www.python-httpx.org/)
|
||||||
|
- LXML [lxml.de](https://lxml.de/)
|
||||||
|
|
||||||
|
废弃特性 {#deprecated}
|
||||||
|
---
|
||||||
|
|
||||||
|
### 书签 {#deprecated-feature-bookmark}
|
||||||
|
|
||||||
|
因为底层 IndexedDB 更新困难和作品段落解析困难问题, 所以在 [**v1.0.7**](https://git.unknownmp.top/default/ao3-mirror-ssr/releases/tag/v1.0.7) 以后的版本废弃了书签机制
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
其他
|
||||||
|
---
|
||||||
|
本站支持 "Server Side Rendering" by Vite SSR
|
||||||
|
|
||||||
|
CDN by Cloudflare (赛博佛祖😭)
|
||||||
|
|
||||||
|
<FunAnimation />
|
||||||
@ -1,19 +0,0 @@
|
|||||||
<script setup>
|
|
||||||
import About from '../texts/about.md'
|
|
||||||
import FunAnimation from '../components/FunAnimation.vue'
|
|
||||||
|
|
||||||
import 'mdui/components/avatar.js'
|
|
||||||
/*import { onBeforeMount, onMounted, onUnmounted, onBeforeUnmount, onActivated, onDeactivated } from 'vue'
|
|
||||||
console.log('Setup')
|
|
||||||
onBeforeMount(() => console.log('Before mount'))
|
|
||||||
onMounted(() => console.log('Mounted'))
|
|
||||||
onDeactivated(() => console.log('Deactivated'))
|
|
||||||
onActivated(() => console.log('Activated'))
|
|
||||||
onBeforeUnmount(() => console.log('Before unmount'))
|
|
||||||
onUnmounted(() => console.log('Unmounted'))*/
|
|
||||||
</script>
|
|
||||||
<template>
|
|
||||||
<About/>
|
|
||||||
<FunAnimation />
|
|
||||||
</template>
|
|
||||||
|
|
||||||
@ -1,11 +1,9 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { ref, onMounted } from 'vue'
|
import { ref, onMounted } from 'vue'
|
||||||
import { useRouter } from 'vue-router'
|
|
||||||
|
|
||||||
import { useApiStore } from '@/stores/api.js'
|
import { useApiStore } from '@/stores/api.js'
|
||||||
import { useRouteStore } from '../stores/route.js'
|
import { useRouteStore } from '../stores/route.js'
|
||||||
|
|
||||||
const router = useRouter()
|
|
||||||
const api = useApiStore()
|
const api = useApiStore()
|
||||||
const routeStore = useRouteStore()
|
const routeStore = useRouteStore()
|
||||||
|
|
||||||
@ -30,45 +28,33 @@ onMounted(() => {
|
|||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<h1 class="warn-text">注意本页面仅为测试用!</h1>
|
<h1 class="warn-text">注意本页面仅为测试用!</h1>
|
||||||
<blockquote>
|
<blockquote>
|
||||||
当然如果你是乱点那个唐鬼小人进来的, 这就是个彩蛋? (神金
|
当然如果你是乱点那个唐鬼小人进来的, 这就是个彩蛋? (神金
|
||||||
</blockquote>
|
</blockquote><Hr />
|
||||||
<Hr />
|
|
||||||
<section>
|
<section>
|
||||||
<h2>页面信息</h2>
|
<h2>页面信息</h2>
|
||||||
<h3>可见路由信息:</h3>
|
<h3>可见路由信息:</h3>
|
||||||
<pre>{{ routeStore.allRoutes }}</pre>
|
<pre>{{ routeStore.allRoutes }}</pre>
|
||||||
</section>
|
</section><Hr />
|
||||||
<Hr />
|
<ClientOnly><section>
|
||||||
<ClientOnly>
|
<h2>浏览器信息</h2><dl>
|
||||||
<section>
|
<dt>User-Agent:</dt>
|
||||||
<h2>浏览器信息</h2>
|
<dd>{{ ua }}</dd>
|
||||||
<dl>
|
<dt>语言:</dt>
|
||||||
<dt>User-Agent:</dt>
|
<dd>{{ language }}</dd>
|
||||||
<dd>{{ ua }}</dd>
|
<dt>平台:</dt>
|
||||||
<dt>语言:</dt>
|
<dd>{{ platform }}</dd>
|
||||||
<dd>{{ language }}</dd>
|
<dt>屏幕尺寸:</dt>
|
||||||
<dt>平台:</dt>
|
<dd>{{ screenSize }}</dd>
|
||||||
<dd>{{ platform }}</dd>
|
<dt>视口尺寸:</dt>
|
||||||
<dt>屏幕尺寸:</dt>
|
<dd>{{ viewportSize }}</dd>
|
||||||
<dd>{{ screenSize }}</dd>
|
<dt>像素比:</dt>
|
||||||
<dt>视口尺寸:</dt>
|
<dd>{{ pixelRatio }}</dd>
|
||||||
<dd>{{ viewportSize }}</dd>
|
<dt>是否触屏设备:</dt>
|
||||||
<dt>像素比:</dt>
|
<dd>{{ touchSupport ? '是' : '否' }}</dd>
|
||||||
<dd>{{ pixelRatio }}</dd>
|
<dt>页面可见性状态:</dt>
|
||||||
<dt>是否触屏设备:</dt>
|
<dd>{{ visibility }}</dd>
|
||||||
<dd>{{ touchSupport ? '是' : '否' }}</dd>
|
</dl></section><Hr /></ClientOnly>
|
||||||
<dt>页面可见性状态:</dt>
|
|
||||||
<dd>{{ visibility }}</dd>
|
|
||||||
</dl>
|
|
||||||
</section>
|
|
||||||
<Hr />
|
|
||||||
</ClientOnly>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
</style>
|
|
||||||
|
|||||||
@ -1,24 +0,0 @@
|
|||||||
<script setup>
|
|
||||||
import { ref, onMounted, onServerPrefetch, onBeforeMount} from 'vue'
|
|
||||||
import { useRouter, useRoute, RouterView } from 'vue-router'
|
|
||||||
const router = useRouter()
|
|
||||||
import { useApiStore } from '@/stores/api.js'
|
|
||||||
const api = useApiStore()
|
|
||||||
|
|
||||||
onServerPrefetch(async () => {
|
|
||||||
// Load data
|
|
||||||
})
|
|
||||||
onBeforeMount(() => {
|
|
||||||
// Re apply data
|
|
||||||
})
|
|
||||||
onMounted(() => {
|
|
||||||
// Render other
|
|
||||||
})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
Padding! No content cause hydration mismatch!
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
</style>
|
|
||||||
@ -9,73 +9,60 @@ import Intro from '../texts/intro.md'
|
|||||||
|
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
|
|
||||||
const err = ref(false)
|
|
||||||
const srcText = ref(null)
|
|
||||||
|
|
||||||
function convert(from) {
|
function convert(from) {
|
||||||
if( Number(from) ) {
|
if( Number(from) ) {return {
|
||||||
return {
|
type: 's',
|
||||||
type: 's',
|
id: Number(from)
|
||||||
id: Number(from)
|
}} else if (from.includes('https://archiveofourown.org/works/')) {
|
||||||
}
|
|
||||||
} else if (from.includes('https://archiveofourown.org/works/')) {
|
|
||||||
const sid = from.split('https://archiveofourown.org/works/')[1];
|
const sid = from.split('https://archiveofourown.org/works/')[1];
|
||||||
console.log(sid)
|
|
||||||
if ( sid ) {
|
if ( sid ) {
|
||||||
const id = Number(sid)
|
const id = Number(sid)
|
||||||
if (id) {
|
if (id) { return {
|
||||||
return {
|
type: 's',
|
||||||
type: 's',
|
id
|
||||||
id
|
}} else {
|
||||||
}
|
|
||||||
} else {
|
|
||||||
const splited = sid.split('/chapters/')
|
const splited = sid.split('/chapters/')
|
||||||
const id = Number(splited[0])
|
const id = Number(splited[0])
|
||||||
const cid = Number(splited[1])
|
const cid = Number(splited[1])
|
||||||
if (id && cid) {
|
if (id && cid) return {
|
||||||
return {
|
type: 'c',
|
||||||
type: 'c',
|
id, cid
|
||||||
id, cid
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return { type: null }
|
return { type: 'f', key: from }
|
||||||
}
|
}
|
||||||
|
|
||||||
function onConvert(data) {
|
function onConvert(data) {
|
||||||
const { type, id, cid } = convert(data.src)
|
const { type, id, cid, key } = convert(data.src)
|
||||||
if (type == null) {
|
if (type == null) return
|
||||||
err.value = true
|
else if ( type == 'f') router.push(`/search/simple?keyword=${encodeURIComponent(key)}`)
|
||||||
srcText.value?.focus()
|
else {
|
||||||
} else {
|
|
||||||
err.value = false
|
|
||||||
if (cid) router.push(`/work/${id}/${cid}`)
|
if (cid) router.push(`/work/${id}/${cid}`)
|
||||||
else router.push(`/work/${id}`)
|
else router.push(`/work/${id}`)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<img style="display: block; margin: 0px auto 10px;" height="200px" alt="logo" src="/favicon.svg" />
|
<img style="display: block; margin: 0px auto 10px;" height="200px" width="200px" alt="logo" src="/favicon.svg" />
|
||||||
<Intro />
|
<h1>欢迎来到 AO3 Mirror! 👋👋</h1>
|
||||||
<br/><Hr/>
|
<p>一个基于重构渲染的 AO3 镜像站</p><Hr />
|
||||||
<section id="converter">
|
<section id="converter">
|
||||||
<h2>链接转换</h2>
|
<h2>链接转换</h2>
|
||||||
<p>输入完整链接或者 ID</p>
|
<p>AO3 链接 或 关键词搜索</p>
|
||||||
<Form @submit="onConvert"><ClientOnly>
|
<Form @submit="onConvert"><ClientOnly>
|
||||||
<mdui-text-field variant="filled" label="链接" name="src" placeholder="https://archiveofourown.org/works/114514" ref='srcText'>
|
<mdui-text-field variant="filled" label="链接 / 关键词" name="src">
|
||||||
<span v-if='err' slot="helper" class='warn-text'>链接格式错误!</span>
|
|
||||||
</mdui-text-field><br/>
|
</mdui-text-field><br/>
|
||||||
<div style="display: flex">
|
<div style="display: flex">
|
||||||
<div style="flex-grow: 1"></div>
|
<div style="flex-grow: 1"></div>
|
||||||
<mdui-button type="submit">-></mdui-button>
|
<mdui-button type="submit">-></mdui-button>
|
||||||
</div>
|
</div><template #ssr>
|
||||||
<template #ssr>
|
<input type="text" id="src" name="src" />
|
||||||
<input type="text" id="src" name="src" />
|
<input type="submit" />
|
||||||
<input type="submit" />
|
|
||||||
</template></ClientOnly></Form>
|
</template></ClientOnly></Form>
|
||||||
</section>
|
</section><Hr/>
|
||||||
|
<Intro />
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|||||||
36
src/views/Settings.vue
Normal file
36
src/views/Settings.vue
Normal file
@ -0,0 +1,36 @@
|
|||||||
|
<script setup>
|
||||||
|
import { ref, onBeforeMount } from 'vue'
|
||||||
|
|
||||||
|
import 'mdui/components/switch.js'
|
||||||
|
import 'mdui/components/card.js'
|
||||||
|
|
||||||
|
import { useAppSettingStore } from '../stores/appSetting.js'
|
||||||
|
|
||||||
|
let appSetting = null
|
||||||
|
|
||||||
|
onBeforeMount(() => {
|
||||||
|
appSetting = useAppSettingStore()
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<h1>设置</h1><Hr />
|
||||||
|
<ClientOnly><div class="settings"><section><mdui-card>
|
||||||
|
<h2>界面</h2><Hr />
|
||||||
|
<div>自动黑暗模式<div style="flex: 1;"/>
|
||||||
|
<mdui-switch :checked="appSetting.value.autoTheme"
|
||||||
|
@change="e => appSetting.value.autoTheme = e.target.checked">
|
||||||
|
</mdui-switch></div>
|
||||||
|
<div v-if="!appSetting.value.autoTheme">默认黑暗模式<div style="flex: 1;"/>
|
||||||
|
<mdui-switch :checked="appSetting.value.darkTheme"
|
||||||
|
@change="e => appSetting.value.darkTheme = e.target.checked">
|
||||||
|
</mdui-switch></div>
|
||||||
|
</mdui-card></section></div></ClientOnly>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.settings div {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
86
src/views/SimpleSearch.vue
Normal file
86
src/views/SimpleSearch.vue
Normal file
@ -0,0 +1,86 @@
|
|||||||
|
<script setup>
|
||||||
|
import { ref, watch, onMounted, nextTick, onServerPrefetch, onBeforeUnmount } from 'vue'
|
||||||
|
import { useRoute, useRouter } from 'vue-router'
|
||||||
|
|
||||||
|
import 'mdui/components/text-field.js'
|
||||||
|
import 'mdui/components/card.js'
|
||||||
|
|
||||||
|
import { escapeAndFormatText } from '../utils.js'
|
||||||
|
import { useSimpleSearchState } from '../stores/search.js'
|
||||||
|
|
||||||
|
const route = useRoute()
|
||||||
|
const router = useRouter()
|
||||||
|
|
||||||
|
const simpleSearchState = useSimpleSearchState()
|
||||||
|
|
||||||
|
const inputField = ref('')
|
||||||
|
const label = ref(null)
|
||||||
|
const stateLabel = {
|
||||||
|
'loading': '加载中',
|
||||||
|
'finish': '加载完成',
|
||||||
|
'ready': '就绪',
|
||||||
|
'ssrready': '就绪',
|
||||||
|
'notfound': '未找到',
|
||||||
|
'ssrnotfound': '未找到',
|
||||||
|
}
|
||||||
|
|
||||||
|
let isObserver = null
|
||||||
|
|
||||||
|
onServerPrefetch(async () => { if (route.query.keyword) await simpleSearchState.start(route.query.keyword) })
|
||||||
|
|
||||||
|
onMounted(async () => {
|
||||||
|
watch(() => simpleSearchState.keyword, () => document.title = simpleSearchState.keyword)
|
||||||
|
inputField.value = route.query.keyword || ''
|
||||||
|
if (inputField.value && simpleSearchState != 'ssrready') simpleSearchState.start(inputField.value)
|
||||||
|
isObserver = new IntersectionObserver((entries) => {
|
||||||
|
entries.forEach((entry) => {
|
||||||
|
if (entry.isIntersecting) if (simpleSearchState.state == 'ready' || simpleSearchState.state == 'ssrready') setTimeout(simpleSearchState.load,400)
|
||||||
|
})
|
||||||
|
}, { threshold: 1 })
|
||||||
|
await nextTick()
|
||||||
|
isObserver.observe(label.value)
|
||||||
|
})
|
||||||
|
|
||||||
|
onBeforeUnmount(() => isObserver.disconnect())
|
||||||
|
|
||||||
|
function onSubmit(data) {
|
||||||
|
if (simpleSearchState) {
|
||||||
|
simpleSearchState.start(data.src)
|
||||||
|
router.replace(`/search/simple?keyword=${encodeURIComponent(data.src)}`)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<h1>搜索</h1>
|
||||||
|
<Form @submit="onSubmit"><ClientOnly>
|
||||||
|
<mdui-text-field variant="filled" :value="inputField" label="链接 / 关键词" name="src">
|
||||||
|
</mdui-text-field><br/>
|
||||||
|
<div style="display: flex">
|
||||||
|
<div style="flex-grow: 1"></div>
|
||||||
|
<mdui-button type="submit">-></mdui-button>
|
||||||
|
</div>
|
||||||
|
<template #ssr>
|
||||||
|
<input type="text" id="src" name="src" />
|
||||||
|
<input type="submit" />
|
||||||
|
</template></ClientOnly></Form><Hr />
|
||||||
|
<template v-if="simpleSearchState.state == 'ready' || simpleSearchState.state == 'finish' || simpleSearchState.state == 'ssrready'">
|
||||||
|
<p>找到 {{ simpleSearchState.count }}</p><Hr/>
|
||||||
|
</template>
|
||||||
|
<template v-if="simpleSearchState.result" v-for="work in simpleSearchState.result" :key="work.workId">
|
||||||
|
<ClientOnly><mdui-card style="margin: 8px 0px;"><article>
|
||||||
|
<router-link :to="`/work/${work.workId}`"><h3>{{ work.title }}</h3></router-link>
|
||||||
|
<h4>{{ work.pseud }}</h4><Hr />
|
||||||
|
<p v-html="escapeAndFormatText(work.summary)"></p>
|
||||||
|
</article></mdui-card><template #ssr>
|
||||||
|
<router-link :to="`/work/${work.workId}`"><h3>{{ work.title }}</h3></router-link>
|
||||||
|
<h4>{{ work.pseud }}</h4>
|
||||||
|
<p>{{ work.summary }}</p><Hr />
|
||||||
|
</template></ClientOnly>
|
||||||
|
</template>
|
||||||
|
<p style="display: flex;" ref='label'>
|
||||||
|
{{ stateLabel[simpleSearchState.state] }} ({{ simpleSearchState.count }})
|
||||||
|
<span style="flex: 1;"/>
|
||||||
|
{{ simpleSearchState.currentPage }} / {{ simpleSearchState.pageCount }}
|
||||||
|
</p>
|
||||||
|
</template>
|
||||||
@ -1,14 +1,16 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { ref, onMounted, onServerPrefetch, onBeforeUnmount, watch, nextTick } from 'vue'
|
import { ref, onMounted, onBeforeUnmount, onServerPrefetch, watch, nextTick } from 'vue'
|
||||||
import { useRouter, useRoute, RouterView } from 'vue-router'
|
import { useRouter, useRoute } from 'vue-router'
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const route = useRoute()
|
const route = useRoute()
|
||||||
|
|
||||||
import { useWorkReadState } from '@/stores/workRead.js'
|
import { useHeadHelper } from '../ssr/headHelper.js'
|
||||||
const workReadState = useWorkReadState()
|
|
||||||
|
|
||||||
|
import { useWorkReadState } from '@/stores/workRead.js'
|
||||||
import { useRouteStore } from '@/stores/route.js'
|
import { useRouteStore } from '@/stores/route.js'
|
||||||
|
|
||||||
const routeState = useRouteStore()
|
const routeState = useRouteStore()
|
||||||
|
const workReadState = useWorkReadState()
|
||||||
|
|
||||||
import 'mdui/components/list.js'
|
import 'mdui/components/list.js'
|
||||||
import 'mdui/components/list-item.js'
|
import 'mdui/components/list-item.js'
|
||||||
@ -19,16 +21,10 @@ import 'mdui/components/button.js'
|
|||||||
import 'mdui/components/dropdown.js'
|
import 'mdui/components/dropdown.js'
|
||||||
import 'mdui/components/menu.js'
|
import 'mdui/components/menu.js'
|
||||||
import 'mdui/components/menu-item.js'
|
import 'mdui/components/menu-item.js'
|
||||||
import 'mdui/components/collapse.js'
|
|
||||||
import 'mdui/components/collapse-item.js'
|
|
||||||
import 'mdui/components/card.js'
|
import 'mdui/components/card.js'
|
||||||
|
|
||||||
import '@mdui/icons/bookmark.js'
|
import '@mdui/icons/bookmark.js'
|
||||||
|
|
||||||
import { confirm } from 'mdui/functions/confirm.js'
|
|
||||||
import { snackbar } from 'mdui/functions/snackbar.js'
|
|
||||||
import { prompt } from 'mdui/functions/prompt.js'
|
|
||||||
|
|
||||||
import { mduiSnackbar } from '../utils.js'
|
import { mduiSnackbar } from '../utils.js'
|
||||||
|
|
||||||
const fabExtended = ref(false)
|
const fabExtended = ref(false)
|
||||||
@ -41,6 +37,7 @@ let lastCloseTimer = null
|
|||||||
let isObserver = null
|
let isObserver = null
|
||||||
let paragraphs = []
|
let paragraphs = []
|
||||||
let currentParagraph = null
|
let currentParagraph = null
|
||||||
|
const chapterDialog = ref(null)
|
||||||
|
|
||||||
const categoryName = {
|
const categoryName = {
|
||||||
mm: "男/男",
|
mm: "男/男",
|
||||||
@ -48,21 +45,35 @@ const categoryName = {
|
|||||||
fm: '女/男'
|
fm: '女/男'
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
onServerPrefetch(async () => {
|
onServerPrefetch(async () => {
|
||||||
|
const headHelper = useHeadHelper()
|
||||||
await workReadState.loadWork(route.params.id, route.params.cid)
|
await workReadState.loadWork(route.params.id, route.params.cid)
|
||||||
|
if (workReadState.state == 'ready') headHelper.setTitle(workReadState.title)
|
||||||
|
else if (workReadState.state == 'ssrnotfound') {
|
||||||
|
headHelper.setTitle('文章未找到')
|
||||||
|
headHelper.setCode(404)
|
||||||
|
} else if (workReadState.state == 'unauth') {
|
||||||
|
headHelper.setTitle('访问被阻止')
|
||||||
|
headHelper.setCode(401)
|
||||||
|
}
|
||||||
|
headHelper.headReady()
|
||||||
})
|
})
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
if (workReadState.state != 'ssrnotfound') await workReadState.loadWork(route.params.id, route.params.cid)
|
watch(() => workReadState.state, (value) => { if (value == 'ready') routeState.customTitle = workReadState.title })
|
||||||
|
if (workReadState.state != 'ssrnotfound' && workReadState.state != 'ready') await workReadState.loadWork(route.params.id, route.params.cid)
|
||||||
if (workReadState.state == 'ready') {
|
if (workReadState.state == 'ready') {
|
||||||
routeState.customTitle = workReadState.title
|
routeState.customTitle = workReadState.title
|
||||||
|
if (workReadState.cid !== null && parseInt(route.params.cid) != workReadState.cid) {
|
||||||
|
router.replace(`/work/${workReadState.id}/${workReadState.cid}`)
|
||||||
|
return
|
||||||
|
}
|
||||||
const paraCount = workReadState.text.length - 1
|
const paraCount = workReadState.text.length - 1
|
||||||
isObserver = new IntersectionObserver((entries) => {
|
isObserver = new IntersectionObserver((entries) => {
|
||||||
entries.forEach((entry) => {
|
entries.forEach((entry) => {
|
||||||
if (entry.isIntersecting) {
|
if (entry.isIntersecting) {
|
||||||
currentParagraph = entry.target
|
currentParagraph = entry.target
|
||||||
readIndex = entry.target.dataset.index;
|
readIndex = entry.target.dataset.index
|
||||||
readPercent.value = parseInt(readIndex / paraCount * 100)
|
readPercent.value = parseInt(readIndex / paraCount * 100)
|
||||||
if (lastPercent == 0) {
|
if (lastPercent == 0) {
|
||||||
lastPercent = readPercent.value
|
lastPercent = readPercent.value
|
||||||
@ -83,39 +94,64 @@ onMounted(async () => {
|
|||||||
threshold: 0.5
|
threshold: 0.5
|
||||||
})
|
})
|
||||||
await nextTick()
|
await nextTick()
|
||||||
paragraphs = content.value?.querySelectorAll('p');
|
paragraphs = content.value?.querySelectorAll('p')
|
||||||
paragraphs?.forEach(p => isObserver.observe(p));
|
paragraphs?.forEach(p => isObserver.observe(p))
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
onBeforeUnmount(() => {
|
onBeforeUnmount(() => { if(isObserver) isObserver.disconnect() })
|
||||||
isObserver.disconnect();
|
|
||||||
})
|
async function switchWorkWithIndex(target) {
|
||||||
|
workReadState.loadWork(workReadState.id,workReadState.chapters[target].chapterId)
|
||||||
|
router.replace(`/work/${workReadState.id}/${workReadState.cid}`)
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<ClientOnly>
|
<template v-if="workReadState.state == 'notfound' || workReadState.state == 'ssrnotfound'">
|
||||||
|
<h2>文章不存在...</h2>
|
||||||
|
是不是链接没有复制完全?<br/>
|
||||||
|
ID: {{ workReadState.id }}<br/>
|
||||||
|
<template v-if="workReadState.cid">
|
||||||
|
CID: {{ workReadState.cid }}
|
||||||
|
</template>
|
||||||
|
<a @click="$router.back()">返回</a>
|
||||||
|
</template><template v-if="workReadState.state == 'unauth'">
|
||||||
|
<h2>访问被阻止!</h2>
|
||||||
|
上游 AO3 不允许匿名用户访问该作品<br/>
|
||||||
|
ID: {{workReadState.id}}<br/>
|
||||||
|
<template v-if="workReadState.cid">
|
||||||
|
CID: {{ workReadState.cid }}
|
||||||
|
</template><br/>
|
||||||
|
<a @click="$router.back()">返回</a>
|
||||||
|
</template><template v-if="workReadState.state == 'error'">
|
||||||
|
<h2>内部服务器错误</h2>
|
||||||
|
这种情况不是你的问题, 而是我给网站写的屎山代码发力了, 在 <a href="/about#contact">这里</a> 联系我修复此问题<br/>
|
||||||
|
并提供以下信息:<br/>
|
||||||
|
ID: {{workReadState.id}}<br/>
|
||||||
|
<template v-if="workReadState.cid">
|
||||||
|
CID: {{ workReadState.cid }}
|
||||||
|
</template><br/>
|
||||||
|
<a @click="$router.back()">返回</a>
|
||||||
|
</template><template v-if="workReadState.state == 'errformat'">
|
||||||
|
<h2>路径格式错误</h2>
|
||||||
|
ID: {{ $route.params.id }}<br/>
|
||||||
|
<template v-if="$route.params.id">
|
||||||
|
CID: {{ $route.params.id }}
|
||||||
|
</template><br/>
|
||||||
|
<a @click="$router.back()">返回</a>
|
||||||
|
</template><ClientOnly>
|
||||||
<template v-if="workReadState.state == 'loading'">
|
<template v-if="workReadState.state == 'loading'">
|
||||||
加载中...<br/>
|
加载中...<br/>
|
||||||
<mdui-linear-progress></mdui-linear-progress>
|
<mdui-linear-progress></mdui-linear-progress>
|
||||||
</template>
|
</template>
|
||||||
<template v-if="workReadState.state == 'notfound' || workReadState.state == 'ssrnotfound'">
|
|
||||||
<h2>文章不存在...</h2>
|
|
||||||
是不是链接没有复制完全?<br/>
|
|
||||||
ID: {{ workReadState.id }}<br/>
|
|
||||||
<template v-if="workReadState.cid">
|
|
||||||
CID: {{ workReadState.cid }}
|
|
||||||
</template>
|
|
||||||
<a @click="$router.back()">返回</a>
|
|
||||||
</template>
|
|
||||||
<template v-if="workReadState.state == 'ready'">
|
<template v-if="workReadState.state == 'ready'">
|
||||||
<article>
|
<article>
|
||||||
<h1 style="margin: auto">{{ workReadState.title }}</h1>
|
<h1>{{ workReadState.title }}</h1>
|
||||||
<h4>{{ workReadState.pesud }}</h4>
|
<h4>{{ workReadState.pseud }}</h4>
|
||||||
<mdui-card style="margin: 8px; padding: 0px;"><mdui-collapse acc>
|
<a target="_blank" :href="workReadState.cid ? `https://archiveofourown.org/works/${workReadState.id}/chapters/${workReadState.cid}` : `https://archiveofourown.org/works/${workReadState.id}`">原 AO3 链接</a>
|
||||||
<mdui-collapse-item value="info"><mdui-list-item class="infoblockhead" slot="header">
|
<mdui-card style="margin: 8px 0px; padding: 16px;">
|
||||||
作品信息
|
<strong>作品信息</strong><dl>
|
||||||
</mdui-list-item><div class="infoblock"><dl>
|
|
||||||
<template v-if="workReadState.category"><dt>分类</dt><ul>
|
<template v-if="workReadState.category"><dt>分类</dt><ul>
|
||||||
<li v-for="item in workReadState.category" :key="item">
|
<li v-for="item in workReadState.category" :key="item">
|
||||||
{{ categoryName[item] }}</li>
|
{{ categoryName[item] }}</li>
|
||||||
@ -124,87 +160,143 @@ onBeforeUnmount(() => {
|
|||||||
<li v-for="item in workReadState.fandom" :key="item">
|
<li v-for="item in workReadState.fandom" :key="item">
|
||||||
{{ item }}</li>
|
{{ item }}</li>
|
||||||
</ul></template>
|
</ul></template>
|
||||||
|
<template v-if="workReadState.additionalTags"><dt>附加 Tag</dt><ul>
|
||||||
|
<li v-for="item in workReadState.additionalTags" :key="item">
|
||||||
|
{{ item }}</li>
|
||||||
|
</ul></template>
|
||||||
<dt>语言</dt><dd>
|
<dt>语言</dt><dd>
|
||||||
{{ workReadState.lang }}
|
{{ workReadState.lang }}
|
||||||
</dd>
|
</dd>
|
||||||
</dl></div></mdui-collapse-item>
|
</dl><Hr/>
|
||||||
<mdui-collapse-item value="stats"><mdui-list-item class="infoblockhead" slot="header">
|
<strong>作品状态</strong><dl>
|
||||||
作品状态
|
<dt>发布</dt><dd>
|
||||||
</mdui-list-item><div class="infoblock"><dl>
|
|
||||||
<dt>发布时间</dt><dd>
|
|
||||||
{{ workReadState.publishedTime.year }} -
|
{{ workReadState.publishedTime.year }} -
|
||||||
{{ workReadState.publishedTime.month }} -
|
{{ workReadState.publishedTime.month }} -
|
||||||
{{ workReadState.publishedTime.date }}
|
{{ workReadState.publishedTime.date }}
|
||||||
</dd>
|
</dd>
|
||||||
|
<template v-if="workReadState.completedTime"><dt>完成</dt><dd>
|
||||||
|
{{ workReadState.completedTime.year }} -
|
||||||
|
{{ workReadState.completedTime.month }} -
|
||||||
|
{{ workReadState.completedTime.date }}
|
||||||
|
</dd></template>
|
||||||
|
<template v-if="workReadState.updatedTime"><dt>更新</dt><dd>
|
||||||
|
{{ workReadState.updatedTime.year }} -
|
||||||
|
{{ workReadState.updatedTime.month }} -
|
||||||
|
{{ workReadState.updatedTime.date }}
|
||||||
|
</dd></template>
|
||||||
<dt>字数</dt><dd>
|
<dt>字数</dt><dd>
|
||||||
{{ workReadState.wordCount }}
|
{{ workReadState.wordCount }}
|
||||||
</dd>
|
</dd>
|
||||||
<dt>点击</dt><dd>
|
<dt>点击</dt><dd>
|
||||||
{{ workReadState.hitCount }}
|
{{ workReadState.hitCount }}
|
||||||
</dd>
|
</dd>
|
||||||
</dl></div></mdui-collapse-item>
|
<template v-if="workReadState.chapterStat"><dt>
|
||||||
</mdui-collapse></mdui-card>
|
章节
|
||||||
<blockquote>
|
</dt><dd>
|
||||||
<p v-for="para in workReadState.summary" :key="para" v-html='para'></p>
|
{{ workReadState.chapterStat.left }} /
|
||||||
</blockquote>
|
{{ workReadState.chapterStat.right == -1 ? '?' : workReadState.chapterStat.right }}
|
||||||
<Hr />
|
</dd></template>
|
||||||
<div ref='content'>
|
</dl>
|
||||||
|
</mdui-card>
|
||||||
|
<template v-if="workReadState.cid">
|
||||||
|
<h4>第 {{ workReadState.chapterIndex + 1 }} / {{ workReadState.chapters.length }} 章: {{ workReadState.chapters[workReadState.chapterIndex].title }}</h4>
|
||||||
|
<div style="display: flex;">
|
||||||
|
<mdui-button variant="filled" v-if="workReadState.chapterIndex != 0" @click="switchWorkWithIndex(workReadState.chapterIndex - 1)">上一章</mdui-button>
|
||||||
|
<mdui-button variant='elevated' @click="chapterDialog.open = true" style="margin: 0px 16px;">章节列表</mdui-button>
|
||||||
|
<mdui-button variant="filled" v-if="workReadState.chapterIndex != workReadState.chapters.length - 1" @click="switchWorkWithIndex(workReadState.chapterIndex + 1)">下一章</mdui-button>
|
||||||
|
</div><br/>
|
||||||
|
</template>
|
||||||
|
<blockquote v-if="workReadState.summary">
|
||||||
|
<p v-html='workReadState.summary'></p>
|
||||||
|
</blockquote><Hr />
|
||||||
|
<article ref='content'>
|
||||||
<p v-for="(para, index) in workReadState.text" :key="para" :data-index="index">{{ para }}</p>
|
<p v-for="(para, index) in workReadState.text" :key="para" :data-index="index">{{ para }}</p>
|
||||||
</div>
|
</article>
|
||||||
</article>
|
</article><Hr/>
|
||||||
|
<p style="display: flex;" v-if="workReadState.cid">
|
||||||
|
<mdui-button variant="filled" v-if="workReadState.chapterIndex != 0" @click="switchWorkWithIndex(workReadState.chapterIndex - 1)">上一章</mdui-button>
|
||||||
|
<span style="flex: 1;"/>
|
||||||
|
{{ workReadState.chapterIndex + 1 }} / {{ workReadState.chapters.length }}
|
||||||
|
<span style="flex: 1;"/>
|
||||||
|
<mdui-button variant="filled" v-if="workReadState.chapterIndex != workReadState.chapters.length - 1" @click="switchWorkWithIndex(workReadState.chapterIndex + 1)">下一章</mdui-button>
|
||||||
|
</p>
|
||||||
|
<div style="height: 64px" />
|
||||||
<mdui-fab class="mdui-fab" :extended="fabExtended">
|
<mdui-fab class="mdui-fab" :extended="fabExtended">
|
||||||
<mdui-icon-bookmark slot="icon"></mdui-icon-bookmark>
|
<mdui-icon-bookmark slot="icon"></mdui-icon-bookmark>
|
||||||
{{ readPercent }}%
|
{{ readPercent }}%
|
||||||
</mdui-fab>
|
</mdui-fab>
|
||||||
|
<mdui-dialog ref='chapterDialog' close-on-overlay-click>
|
||||||
|
<span slot="headline">章节列表</span>
|
||||||
|
<span slot="description">
|
||||||
|
共 {{ workReadState.chapters.length }} 个
|
||||||
|
<br/>
|
||||||
|
点击跳转
|
||||||
|
</span>
|
||||||
|
<mdui-list><mdui-list-item
|
||||||
|
v-for="(chapter,index) in workReadState.chapters"
|
||||||
|
:key="chapter.chapterId" @click="switchWorkWithIndex(index)"
|
||||||
|
:class="{ 'active-item' : index === workReadState.chapterIndex }"
|
||||||
|
>
|
||||||
|
{{index + 1}}. {{ chapter.title }}
|
||||||
|
</mdui-list-item></mdui-list>
|
||||||
|
</mdui-dialog>
|
||||||
</template>
|
</template>
|
||||||
<template #ssr>
|
<template #ssr>
|
||||||
<template v-if="workReadState.state == 'notfound' || workReadState.state == 'ssrnotfound'">
|
|
||||||
<h2>文章不存在...</h2>
|
|
||||||
是不是链接没有复制完全?<br/>
|
|
||||||
ID: {{workReadState.id}}<br/>
|
|
||||||
<template v-if="workReadState.cid">
|
|
||||||
CID: {{ workReadState.cid }}
|
|
||||||
</template>
|
|
||||||
<a @click="$router.back()">返回</a>
|
|
||||||
</template>
|
|
||||||
<template v-if="workReadState.state == 'ready'">
|
<template v-if="workReadState.state == 'ready'">
|
||||||
<h1>{{ workReadState.title }}</h1>
|
<h2>{{ workReadState.title }}</h2>
|
||||||
<h2>{{ workReadState.pesud }}</h2>
|
<h4>{{ workReadState.pseud }}</h4>
|
||||||
<dl>
|
<dl>
|
||||||
<template v-if="workReadState.category"><dt>作品圈</dt><ul>
|
<template v-if="workReadState.category"><dt>分类</dt><ul>
|
||||||
<li v-for="item in workReadState.category" :key="item">
|
<li v-for="item in workReadState.category" :key="item">
|
||||||
{{ categoryName[item] }}</li>
|
{{ categoryName[item] }}</li>
|
||||||
</ul></template>
|
</ul></template>
|
||||||
<template v-if="workReadState.fandom"><dt>原著</dt><ul>
|
<template v-if="workReadState.fandom"><dt>作品圈</dt><ul>
|
||||||
<li v-for="item in workReadState.fandom" :key="item">
|
<li v-for="item in workReadState.fandom" :key="item">
|
||||||
{{ item }}</li>
|
{{ item }}</li>
|
||||||
</ul></template>
|
</ul></template>
|
||||||
<dt>语言</dt><dd>
|
<dt>语言</dt><dd>
|
||||||
{{ workReadState.lang }}
|
{{ workReadState.lang }}
|
||||||
</dd>
|
</dd>
|
||||||
<dt>发布时间</dt><dd>
|
<dt>发布</dt><dd>
|
||||||
{{ workReadState.publishedTime.year }} -
|
{{ workReadState.publishedTime.year }} -
|
||||||
{{ workReadState.publishedTime.month }} -
|
{{ workReadState.publishedTime.month }} -
|
||||||
{{ workReadState.publishedTime.date }}
|
{{ workReadState.publishedTime.date }}
|
||||||
</dd>
|
</dd>
|
||||||
|
<template v-if="workReadState.completedTime"><dt>完成</dt><dd>
|
||||||
|
{{ workReadState.completedTime.year }} -
|
||||||
|
{{ workReadState.completedTime.month }} -
|
||||||
|
{{ workReadState.completedTime.date }}
|
||||||
|
</dd></template>
|
||||||
|
<template v-if="workReadState.updatedTime"><dt>更新</dt><dd>
|
||||||
|
{{ workReadState.updatedTime.year }} -
|
||||||
|
{{ workReadState.updatedTime.month }} -
|
||||||
|
{{ workReadState.updatedTime.date }}
|
||||||
|
</dd></template>
|
||||||
<dt>字数</dt><dd>
|
<dt>字数</dt><dd>
|
||||||
{{ workReadState.wordCount }}
|
{{ workReadState.wordCount }}
|
||||||
</dd>
|
</dd>
|
||||||
<dt>点击</dt><dd>
|
<dt>点击</dt><dd>
|
||||||
{{ workReadState.hitCount }}
|
{{ workReadState.hitCount }}
|
||||||
</dd>
|
</dd>
|
||||||
</dl>
|
<template v-if="workReadState.chapterStat"><dt>
|
||||||
<Hr />
|
章节
|
||||||
<blockquote>
|
</dt><dd>
|
||||||
<p v-for="para in workReadState.summary" :key="para" v-html='para'></p>
|
{{ workReadState.chapterStat.left }} /
|
||||||
</blockquote>
|
{{ workReadState.chapterStat.right == -1 ? '?' : workReadState.chapterStat.right }}
|
||||||
<Hr/>
|
</dd></template>
|
||||||
<p v-for="para in workReadState.text.slice(0, 10)" :key="para">{{ para }}</p>
|
</dl><Hr />
|
||||||
|
<template v-if="workReadState.summary"><blockquote>
|
||||||
|
<p v-html='workReadState.summary'></p>
|
||||||
|
</blockquote><Hr /></template>
|
||||||
|
<article><p v-for="para in workReadState.text.slice(0, 20)" :key="para">{{ para }}</p></article>
|
||||||
</template>
|
</template>
|
||||||
</template></ClientOnly>
|
</template></ClientOnly>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
.active-item {
|
||||||
|
background-color: rgb(var(--mdui-color-secondary-container));
|
||||||
|
}
|
||||||
.mdui-fab {
|
.mdui-fab {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
bottom: 16px; /* 调整垂直位置 */
|
bottom: 16px; /* 调整垂直位置 */
|
||||||
@ -212,12 +304,4 @@ onBeforeUnmount(() => {
|
|||||||
z-index: 1000; /* 确保悬浮按钮在其他内容上方 */
|
z-index: 1000; /* 确保悬浮按钮在其他内容上方 */
|
||||||
animation: slideInFromRight var(--mdui-motion-duration-medium2) var(--mdui-motion-easing-standard); /* 动画时长和缓动效果 */
|
animation: slideInFromRight var(--mdui-motion-duration-medium2) var(--mdui-motion-easing-standard); /* 动画时长和缓动效果 */
|
||||||
}
|
}
|
||||||
|
|
||||||
.infoblock {
|
|
||||||
margin: 8px 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.infoblockhead {
|
|
||||||
background-color: rgb(var(--mdui-color-primary-container));
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -38,10 +38,7 @@ export default defineConfig({
|
|||||||
.toLowerCase()
|
.toLowerCase()
|
||||||
.replace(/\s+/g, "-")
|
.replace(/\s+/g, "-")
|
||||||
})
|
})
|
||||||
mdit.renderer.rules.hr = () => {
|
mdit.renderer.rules.hr = () => '<div><BetterHr /></div>'
|
||||||
console.log('Custom <hr> rendered 🚀');
|
|
||||||
return '<div><BetterHr /></div>'
|
|
||||||
}
|
|
||||||
const defaultOpen = mdit.renderer.rules.link_open || ((tokens, idx, options, env, self) => {
|
const defaultOpen = mdit.renderer.rules.link_open || ((tokens, idx, options, env, self) => {
|
||||||
return self.renderToken(tokens, idx, options)
|
return self.renderToken(tokens, idx, options)
|
||||||
})
|
})
|
||||||
|
|||||||
Reference in New Issue
Block a user