MoeJue/douyin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

save

Browse Source
This commit is contained in:
zyronon 2024-03-04 02:09:13 +08:00
parent a1e4c1db95
commit a3eddfe12d
7 changed files with 316 additions and 407 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
NOTE.md
View File

@ -3,4 +3,8 @@
- 手机端抓包
- 首页无限滚动
- me页面滚动逻辑
- 通话进入和挂起动画
- 通话进入和挂起动画
# TODO
- 双指缩放

2
package.json
View File

@ -34,6 +34,6 @@
"less": "4.1.3",
"mobile-select": "1.1.2",
"unplugin-vue-macros": "^2.7.10",
"vite": "5.1.4"
"vite": "4.5.2"
}
}

448
pnpm-lock.yaml
View File

@ -69,10 +69,10 @@ devDependencies:
version: 4.17.12
'@vitejs/plugin-vue':
specifier: 4.0.0
version: 4.0.0(vite@5.1.4)(vue@3.4.21)
version: 4.0.0(vite@4.5.2)(vue@3.4.21)
'@vitejs/plugin-vue-jsx':
specifier: 3.0.0
version: 3.0.0(vite@5.1.4)(vue@3.4.21)
version: 3.0.0(vite@4.5.2)(vue@3.4.21)
less:
specifier: 4.1.3
version: 4.1.3
@ -81,10 +81,10 @@ devDependencies:
version: 1.1.2
unplugin-vue-macros:
specifier: ^2.7.10
version: 2.7.10(vite@5.1.4)(vue@3.4.21)
version: 2.7.10(vite@4.5.2)(vue@3.4.21)
vite:
specifier: 5.1.4
version: 5.1.4(less@4.1.3)
specifier: 4.5.2
version: 4.5.2(less@4.1.3)
packages:
@ -411,17 +411,8 @@ packages:
to-fast-properties: 2.0.0
dev: true
/@esbuild/aix-ppc64@0.19.12:
resolution: {integrity: sha512-bmoCYyWdEL3wDQIVbcyzRyeKLgk2WtWLTWz1ZIAZF/EGbNOwSA6ew3PftJ1PqMiOOGu0OyFMzG53L0zqIpPeNA==}
engines: {node: '>=12'}
cpu: [ppc64]
os: [aix]
requiresBuild: true
dev: true
optional: true
/@esbuild/android-arm64@0.19.12:
resolution: {integrity: sha512-P0UVNGIienjZv3f5zq0DP3Nt2IE/3plFzuaS96vihvD0Hd6H/q4WXUGpCxD/E8YrSXfNyRPbpTq+T8ZQioSuPA==}
/@esbuild/android-arm64@0.18.20:
resolution: {integrity: sha512-Nz4rJcchGDtENV0eMKUNa6L12zz2zBDXuhj/Vjh18zGqB44Bi7MBMSXjgunJgjRhCmKOjnPuZp4Mb6OKqtMHLQ==}
engines: {node: '>=12'}
cpu: [arm64]
os: [android]
@ -429,8 +420,8 @@ packages:
dev: true
optional: true
/@esbuild/android-arm@0.19.12:
resolution: {integrity: sha512-qg/Lj1mu3CdQlDEEiWrlC4eaPZ1KztwGJ9B6J+/6G+/4ewxJg7gqj8eVYWvao1bXrqGiW2rsBZFSX3q2lcW05w==}
/@esbuild/android-arm@0.18.20:
resolution: {integrity: sha512-fyi7TDI/ijKKNZTUJAQqiG5T7YjJXgnzkURqmGj13C6dCqckZBLdl4h7bkhHt/t0WP+zO9/zwroDvANaOqO5Sw==}
engines: {node: '>=12'}
cpu: [arm]
os: [android]
@ -438,8 +429,8 @@ packages:
dev: true
optional: true
/@esbuild/android-x64@0.19.12:
resolution: {integrity: sha512-3k7ZoUW6Q6YqhdhIaq/WZ7HwBpnFBlW905Fa4s4qWJyiNOgT1dOqDiVAQFwBH7gBRZr17gLrlFCRzF6jFh7Kew==}
/@esbuild/android-x64@0.18.20:
resolution: {integrity: sha512-8GDdlePJA8D6zlZYJV/jnrRAi6rOiNaCC/JclcXpB+KIuvfBN4owLtgzY2bsxnx666XjJx2kDPUmnTtR8qKQUg==}
engines: {node: '>=12'}
cpu: [x64]
os: [android]
@ -447,8 +438,8 @@ packages:
dev: true
optional: true
/@esbuild/darwin-arm64@0.19.12:
resolution: {integrity: sha512-B6IeSgZgtEzGC42jsI+YYu9Z3HKRxp8ZT3cqhvliEHovq8HSX2YX8lNocDn79gCKJXOSaEot9MVYky7AKjCs8g==}
/@esbuild/darwin-arm64@0.18.20:
resolution: {integrity: sha512-bxRHW5kHU38zS2lPTPOyuyTm+S+eobPUnTNkdJEfAddYgEcll4xkT8DB9d2008DtTbl7uJag2HuE5NZAZgnNEA==}
engines: {node: '>=12'}
cpu: [arm64]
os: [darwin]
@ -456,8 +447,8 @@ packages:
dev: true
optional: true
/@esbuild/darwin-x64@0.19.12:
resolution: {integrity: sha512-hKoVkKzFiToTgn+41qGhsUJXFlIjxI/jSYeZf3ugemDYZldIXIxhvwN6erJGlX4t5h417iFuheZ7l+YVn05N3A==}
/@esbuild/darwin-x64@0.18.20:
resolution: {integrity: sha512-pc5gxlMDxzm513qPGbCbDukOdsGtKhfxD1zJKXjCCcU7ju50O7MeAZ8c4krSJcOIJGFR+qx21yMMVYwiQvyTyQ==}
engines: {node: '>=12'}
cpu: [x64]
os: [darwin]
@ -465,8 +456,8 @@ packages:
dev: true
optional: true
/@esbuild/freebsd-arm64@0.19.12:
resolution: {integrity: sha512-4aRvFIXmwAcDBw9AueDQ2YnGmz5L6obe5kmPT8Vd+/+x/JMVKCgdcRwH6APrbpNXsPz+K653Qg8HB/oXvXVukA==}
/@esbuild/freebsd-arm64@0.18.20:
resolution: {integrity: sha512-yqDQHy4QHevpMAaxhhIwYPMv1NECwOvIpGCZkECn8w2WFHXjEwrBn3CeNIYsibZ/iZEUemj++M26W3cNR5h+Tw==}
engines: {node: '>=12'}
cpu: [arm64]
os: [freebsd]
@ -474,8 +465,8 @@ packages:
dev: true
optional: true
/@esbuild/freebsd-x64@0.19.12:
resolution: {integrity: sha512-EYoXZ4d8xtBoVN7CEwWY2IN4ho76xjYXqSXMNccFSx2lgqOG/1TBPW0yPx1bJZk94qu3tX0fycJeeQsKovA8gg==}
/@esbuild/freebsd-x64@0.18.20:
resolution: {integrity: sha512-tgWRPPuQsd3RmBZwarGVHZQvtzfEBOreNuxEMKFcd5DaDn2PbBxfwLcj4+aenoh7ctXcbXmOQIn8HI6mCSw5MQ==}
engines: {node: '>=12'}
cpu: [x64]
os: [freebsd]
@ -483,8 +474,8 @@ packages:
dev: true
optional: true
/@esbuild/linux-arm64@0.19.12:
resolution: {integrity: sha512-EoTjyYyLuVPfdPLsGVVVC8a0p1BFFvtpQDB/YLEhaXyf/5bczaGeN15QkR+O4S5LeJ92Tqotve7i1jn35qwvdA==}
/@esbuild/linux-arm64@0.18.20:
resolution: {integrity: sha512-2YbscF+UL7SQAVIpnWvYwM+3LskyDmPhe31pE7/aoTMFKKzIc9lLbyGUpmmb8a8AixOL61sQ/mFh3jEjHYFvdA==}
engines: {node: '>=12'}
cpu: [arm64]
os: [linux]
@ -492,8 +483,8 @@ packages:
dev: true
optional: true
/@esbuild/linux-arm@0.19.12:
resolution: {integrity: sha512-J5jPms//KhSNv+LO1S1TX1UWp1ucM6N6XuL6ITdKWElCu8wXP72l9MM0zDTzzeikVyqFE6U8YAV9/tFyj0ti+w==}
/@esbuild/linux-arm@0.18.20:
resolution: {integrity: sha512-/5bHkMWnq1EgKr1V+Ybz3s1hWXok7mDFUMQ4cG10AfW3wL02PSZi5kFpYKrptDsgb2WAJIvRcDm+qIvXf/apvg==}
engines: {node: '>=12'}
cpu: [arm]
os: [linux]
@ -501,8 +492,8 @@ packages:
dev: true
optional: true
/@esbuild/linux-ia32@0.19.12:
resolution: {integrity: sha512-Thsa42rrP1+UIGaWz47uydHSBOgTUnwBwNq59khgIwktK6x60Hivfbux9iNR0eHCHzOLjLMLfUMLCypBkZXMHA==}
/@esbuild/linux-ia32@0.18.20:
resolution: {integrity: sha512-P4etWwq6IsReT0E1KHU40bOnzMHoH73aXp96Fs8TIT6z9Hu8G6+0SHSw9i2isWrD2nbx2qo5yUqACgdfVGx7TA==}
engines: {node: '>=12'}
cpu: [ia32]
os: [linux]
@ -510,8 +501,8 @@ packages:
dev: true
optional: true
/@esbuild/linux-loong64@0.19.12:
resolution: {integrity: sha512-LiXdXA0s3IqRRjm6rV6XaWATScKAXjI4R4LoDlvO7+yQqFdlr1Bax62sRwkVvRIrwXxvtYEHHI4dm50jAXkuAA==}
/@esbuild/linux-loong64@0.18.20:
resolution: {integrity: sha512-nXW8nqBTrOpDLPgPY9uV+/1DjxoQ7DoB2N8eocyq8I9XuqJ7BiAMDMf9n1xZM9TgW0J8zrquIb/A7s3BJv7rjg==}
engines: {node: '>=12'}
cpu: [loong64]
os: [linux]
@ -519,8 +510,8 @@ packages:
dev: true
optional: true
/@esbuild/linux-mips64el@0.19.12:
resolution: {integrity: sha512-fEnAuj5VGTanfJ07ff0gOA6IPsvrVHLVb6Lyd1g2/ed67oU1eFzL0r9WL7ZzscD+/N6i3dWumGE1Un4f7Amf+w==}
/@esbuild/linux-mips64el@0.18.20:
resolution: {integrity: sha512-d5NeaXZcHp8PzYy5VnXV3VSd2D328Zb+9dEq5HE6bw6+N86JVPExrA6O68OPwobntbNJ0pzCpUFZTo3w0GyetQ==}
engines: {node: '>=12'}
cpu: [mips64el]
os: [linux]
@ -528,8 +519,8 @@ packages:
dev: true
optional: true
/@esbuild/linux-ppc64@0.19.12:
resolution: {integrity: sha512-nYJA2/QPimDQOh1rKWedNOe3Gfc8PabU7HT3iXWtNUbRzXS9+vgB0Fjaqr//XNbd82mCxHzik2qotuI89cfixg==}
/@esbuild/linux-ppc64@0.18.20:
resolution: {integrity: sha512-WHPyeScRNcmANnLQkq6AfyXRFr5D6N2sKgkFo2FqguP44Nw2eyDlbTdZwd9GYk98DZG9QItIiTlFLHJHjxP3FA==}
engines: {node: '>=12'}
cpu: [ppc64]
os: [linux]
@ -537,8 +528,8 @@ packages:
dev: true
optional: true
/@esbuild/linux-riscv64@0.19.12:
resolution: {integrity: sha512-2MueBrlPQCw5dVJJpQdUYgeqIzDQgw3QtiAHUC4RBz9FXPrskyyU3VI1hw7C0BSKB9OduwSJ79FTCqtGMWqJHg==}
/@esbuild/linux-riscv64@0.18.20:
resolution: {integrity: sha512-WSxo6h5ecI5XH34KC7w5veNnKkju3zBRLEQNY7mv5mtBmrP/MjNBCAlsM2u5hDBlS3NGcTQpoBvRzqBcRtpq1A==}
engines: {node: '>=12'}
cpu: [riscv64]
os: [linux]
@ -546,8 +537,8 @@ packages:
dev: true
optional: true
/@esbuild/linux-s390x@0.19.12:
resolution: {integrity: sha512-+Pil1Nv3Umes4m3AZKqA2anfhJiVmNCYkPchwFJNEJN5QxmTs1uzyy4TvmDrCRNT2ApwSari7ZIgrPeUx4UZDg==}
/@esbuild/linux-s390x@0.18.20:
resolution: {integrity: sha512-+8231GMs3mAEth6Ja1iK0a1sQ3ohfcpzpRLH8uuc5/KVDFneH6jtAJLFGafpzpMRO6DzJ6AvXKze9LfFMrIHVQ==}
engines: {node: '>=12'}
cpu: [s390x]
os: [linux]
@ -555,8 +546,8 @@ packages:
dev: true
optional: true
/@esbuild/linux-x64@0.19.12:
resolution: {integrity: sha512-B71g1QpxfwBvNrfyJdVDexenDIt1CiDN1TIXLbhOw0KhJzE78KIFGX6OJ9MrtC0oOqMWf+0xop4qEU8JrJTwCg==}
/@esbuild/linux-x64@0.18.20:
resolution: {integrity: sha512-UYqiqemphJcNsFEskc73jQ7B9jgwjWrSayxawS6UVFZGWrAAtkzjxSqnoclCXxWtfwLdzU+vTpcNYhpn43uP1w==}
engines: {node: '>=12'}
cpu: [x64]
os: [linux]
@ -564,8 +555,8 @@ packages:
dev: true
optional: true
/@esbuild/netbsd-x64@0.19.12:
resolution: {integrity: sha512-3ltjQ7n1owJgFbuC61Oj++XhtzmymoCihNFgT84UAmJnxJfm4sYCiSLTXZtE00VWYpPMYc+ZQmB6xbSdVh0JWA==}
/@esbuild/netbsd-x64@0.18.20:
resolution: {integrity: sha512-iO1c++VP6xUBUmltHZoMtCUdPlnPGdBom6IrO4gyKPFFVBKioIImVooR5I83nTew5UOYrk3gIJhbZh8X44y06A==}
engines: {node: '>=12'}
cpu: [x64]
os: [netbsd]
@ -573,8 +564,8 @@ packages:
dev: true
optional: true
/@esbuild/openbsd-x64@0.19.12:
resolution: {integrity: sha512-RbrfTB9SWsr0kWmb9srfF+L933uMDdu9BIzdA7os2t0TXhCRjrQyCeOt6wVxr79CKD4c+p+YhCj31HBkYcXebw==}
/@esbuild/openbsd-x64@0.18.20:
resolution: {integrity: sha512-e5e4YSsuQfX4cxcygw/UCPIEP6wbIL+se3sxPdCiMbFLBWu0eiZOJ7WoD+ptCLrmjZBK1Wk7I6D/I3NglUGOxg==}
engines: {node: '>=12'}
cpu: [x64]
os: [openbsd]
@ -582,8 +573,8 @@ packages:
dev: true
optional: true
/@esbuild/sunos-x64@0.19.12:
resolution: {integrity: sha512-HKjJwRrW8uWtCQnQOz9qcU3mUZhTUQvi56Q8DPTLLB+DawoiQdjsYq+j+D3s9I8VFtDr+F9CjgXKKC4ss89IeA==}
/@esbuild/sunos-x64@0.18.20:
resolution: {integrity: sha512-kDbFRFp0YpTQVVrqUd5FTYmWo45zGaXe0X8E1G/LKFC0v8x0vWrhOWSLITcCn63lmZIxfOMXtCfti/RxN/0wnQ==}
engines: {node: '>=12'}
cpu: [x64]
os: [sunos]
@ -591,8 +582,8 @@ packages:
dev: true
optional: true
/@esbuild/win32-arm64@0.19.12:
resolution: {integrity: sha512-URgtR1dJnmGvX864pn1B2YUYNzjmXkuJOIqG2HdU62MVS4EHpU2946OZoTMnRUHklGtJdJZ33QfzdjGACXhn1A==}
/@esbuild/win32-arm64@0.18.20:
resolution: {integrity: sha512-ddYFR6ItYgoaq4v4JmQQaAI5s7npztfV4Ag6NrhiaW0RrnOXqBkgwZLofVTlq1daVTQNhtI5oieTvkRPfZrePg==}
engines: {node: '>=12'}
cpu: [arm64]
os: [win32]
@ -600,8 +591,8 @@ packages:
dev: true
optional: true
/@esbuild/win32-ia32@0.19.12:
resolution: {integrity: sha512-+ZOE6pUkMOJfmxmBZElNOx72NKpIa/HFOMGzu8fqzQJ5kgf6aTGrcJaFsNiVMH4JKpMipyK+7k0n2UXN7a8YKQ==}
/@esbuild/win32-ia32@0.18.20:
resolution: {integrity: sha512-Wv7QBi3ID/rROT08SABTS7eV4hX26sVduqDOTe1MvGMjNd3EjOz4b7zeexIR62GTIEKrfJXKL9LFxTYgkyeu7g==}
engines: {node: '>=12'}
cpu: [ia32]
os: [win32]
@ -609,8 +600,8 @@ packages:
dev: true
optional: true
/@esbuild/win32-x64@0.19.12:
resolution: {integrity: sha512-T1QyPSDCyMXaO3pzBkF96E8xMkiRYbUEZADd29SyPGabqxMViNoii+NcK7eWJAEoU6RZyEm5lVSIjTmcdoB9HA==}
/@esbuild/win32-x64@0.18.20:
resolution: {integrity: sha512-kTdfRcSiDfQca/y9QIkng02avJ+NCaQvrMejlsB3RRv5sE9rRoeBPISaZpKxHELzRxZyLvNts1P27W3wV+8geQ==}
engines: {node: '>=12'}
cpu: [x64]
os: [win32]
@ -707,115 +698,6 @@ packages:
picomatch: 2.3.1
dev: true
/@rollup/rollup-android-arm-eabi@4.12.0:
resolution: {integrity: sha512-+ac02NL/2TCKRrJu2wffk1kZ+RyqxVUlbjSagNgPm94frxtr+XDL12E5Ll1enWskLrtrZ2r8L3wED1orIibV/w==}
cpu: [arm]
os: [android]
requiresBuild: true
dev: true
optional: true
/@rollup/rollup-android-arm64@4.12.0:
resolution: {integrity: sha512-OBqcX2BMe6nvjQ0Nyp7cC90cnumt8PXmO7Dp3gfAju/6YwG0Tj74z1vKrfRz7qAv23nBcYM8BCbhrsWqO7PzQQ==}
cpu: [arm64]
os: [android]
requiresBuild: true
dev: true
optional: true
/@rollup/rollup-darwin-arm64@4.12.0:
resolution: {integrity: sha512-X64tZd8dRE/QTrBIEs63kaOBG0b5GVEd3ccoLtyf6IdXtHdh8h+I56C2yC3PtC9Ucnv0CpNFJLqKFVgCYe0lOQ==}
cpu: [arm64]
os: [darwin]
requiresBuild: true
dev: true
optional: true
/@rollup/rollup-darwin-x64@4.12.0:
resolution: {integrity: sha512-cc71KUZoVbUJmGP2cOuiZ9HSOP14AzBAThn3OU+9LcA1+IUqswJyR1cAJj3Mg55HbjZP6OLAIscbQsQLrpgTOg==}
cpu: [x64]
os: [darwin]
requiresBuild: true
dev: true
optional: true
/@rollup/rollup-linux-arm-gnueabihf@4.12.0:
resolution: {integrity: sha512-a6w/Y3hyyO6GlpKL2xJ4IOh/7d+APaqLYdMf86xnczU3nurFTaVN9s9jOXQg97BE4nYm/7Ga51rjec5nfRdrvA==}
cpu: [arm]
os: [linux]
requiresBuild: true
dev: true
optional: true
/@rollup/rollup-linux-arm64-gnu@4.12.0:
resolution: {integrity: sha512-0fZBq27b+D7Ar5CQMofVN8sggOVhEtzFUwOwPppQt0k+VR+7UHMZZY4y+64WJ06XOhBTKXtQB/Sv0NwQMXyNAA==}
cpu: [arm64]
os: [linux]
libc: [glibc]
requiresBuild: true
dev: true
optional: true
/@rollup/rollup-linux-arm64-musl@4.12.0:
resolution: {integrity: sha512-eTvzUS3hhhlgeAv6bfigekzWZjaEX9xP9HhxB0Dvrdbkk5w/b+1Sxct2ZuDxNJKzsRStSq1EaEkVSEe7A7ipgQ==}
cpu: [arm64]
os: [linux]
libc: [musl]
requiresBuild: true
dev: true
optional: true
/@rollup/rollup-linux-riscv64-gnu@4.12.0:
resolution: {integrity: sha512-ix+qAB9qmrCRiaO71VFfY8rkiAZJL8zQRXveS27HS+pKdjwUfEhqo2+YF2oI+H/22Xsiski+qqwIBxVewLK7sw==}
cpu: [riscv64]
os: [linux]
libc: [glibc]
requiresBuild: true
dev: true
optional: true
/@rollup/rollup-linux-x64-gnu@4.12.0:
resolution: {integrity: sha512-TenQhZVOtw/3qKOPa7d+QgkeM6xY0LtwzR8OplmyL5LrgTWIXpTQg2Q2ycBf8jm+SFW2Wt/DTn1gf7nFp3ssVA==}
cpu: [x64]
os: [linux]
libc: [glibc]
requiresBuild: true
dev: true
optional: true
/@rollup/rollup-linux-x64-musl@4.12.0:
resolution: {integrity: sha512-LfFdRhNnW0zdMvdCb5FNuWlls2WbbSridJvxOvYWgSBOYZtgBfW9UGNJG//rwMqTX1xQE9BAodvMH9tAusKDUw==}
cpu: [x64]
os: [linux]
libc: [musl]
requiresBuild: true
dev: true
optional: true
/@rollup/rollup-win32-arm64-msvc@4.12.0:
resolution: {integrity: sha512-JPDxovheWNp6d7AHCgsUlkuCKvtu3RB55iNEkaQcf0ttsDU/JZF+iQnYcQJSk/7PtT4mjjVG8N1kpwnI9SLYaw==}
cpu: [arm64]
os: [win32]
requiresBuild: true
dev: true
optional: true
/@rollup/rollup-win32-ia32-msvc@4.12.0:
resolution: {integrity: sha512-fjtuvMWRGJn1oZacG8IPnzIV6GF2/XG+h71FKn76OYFqySXInJtseAqdprVTDTyqPxQOG9Exak5/E9Z3+EJ8ZA==}
cpu: [ia32]
os: [win32]
requiresBuild: true
dev: true
optional: true
/@rollup/rollup-win32-x64-msvc@4.12.0:
resolution: {integrity: sha512-ZYmr5mS2wd4Dew/JjT0Fqi2NPB/ZhZ2VvPp7SmvPZb4Y1CG/LRcS6tcRo2cYU7zLK5A7cdbhWnnWmUjoI4qapg==}
cpu: [x64]
os: [win32]
requiresBuild: true
dev: true
optional: true
/@types/estree@1.0.5:
resolution: {integrity: sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==}
dev: true
@ -830,7 +712,7 @@ packages:
resolution: {integrity: sha512-OvlIYQK9tNneDlS0VN54LLd5uiPCBOp7gS5Z0f1mjoJYBrtStzgmJBxONW3U6OZqdtNzZPmn9BS/7WI7BFFcFQ==}
dev: true
/@vitejs/plugin-vue-jsx@3.0.0(vite@5.1.4)(vue@3.4.21):
/@vitejs/plugin-vue-jsx@3.0.0(vite@4.5.2)(vue@3.4.21):
resolution: {integrity: sha512-vurkuzgac5SYuxd2HUZqAFAWGTF10diKBwJNbCvnWijNZfXd+7jMtqjPFbGt7idOJUn584fP1Ar9j/GN2jQ3Ew==}
engines: {node: ^14.18.0 || >=16.0.0}
peerDependencies:
@ -840,20 +722,20 @@ packages:
'@babel/core': 7.23.2
'@babel/plugin-transform-typescript': 7.22.15(@babel/core@7.23.2)
'@vue/babel-plugin-jsx': 1.1.5(@babel/core@7.23.2)
vite: 5.1.4(less@4.1.3)
vite: 4.5.2(less@4.1.3)
vue: 3.4.21
transitivePeerDependencies:
- supports-color
dev: true
/@vitejs/plugin-vue@4.0.0(vite@5.1.4)(vue@3.4.21):
/@vitejs/plugin-vue@4.0.0(vite@4.5.2)(vue@3.4.21):
resolution: {integrity: sha512-e0X4jErIxAB5oLtDqbHvHpJe/uWNkdpYV83AOG2xo2tEVSzCzewgJMtREZM30wXnM5ls90hxiOtAuVU6H5JgbA==}
engines: {node: ^14.18.0 || >=16.0.0}
peerDependencies:
vite: ^4.0.0
vue: ^3.2.25
dependencies:
vite: 5.1.4(less@4.1.3)
vite: 4.5.2(less@4.1.3)
vue: 3.4.21
dev: true
@ -1022,7 +904,7 @@ packages:
- rollup
dev: true
/@vue-macros/devtools@0.2.0(vite@5.1.4):
/@vue-macros/devtools@0.2.0(vite@4.5.2):
resolution: {integrity: sha512-jHjvY1bFgQLe/2+5pBOG4fgmL5MPhsqQDj7Barhj8YN+Oe7U2hBImvfAyOGpqd2uucLOWQTP1cWrp3q9b1svsg==}
engines: {node: '>=16.14.0'}
peerDependencies:
@ -1032,7 +914,7 @@ packages:
optional: true
dependencies:
sirv: 2.0.4
vite: 5.1.4(less@4.1.3)
vite: 4.5.2(less@4.1.3)
vue: 3.4.21
transitivePeerDependencies:
- typescript
@ -1627,44 +1509,34 @@ packages:
resolution: {integrity: sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==}
engines: {node: '>=0.12'}
/errno@0.1.8:
resolution: {integrity: sha512-dJ6oBr5SQ1VSd9qkk7ByRgb/1SH4JZjCHSW/mr63/QcXO9zLVxvJ6Oy13nio03rxpSnVDDjFor75SjVeZWPW/A==}
hasBin: true
requiresBuild: true
dependencies:
prr: 1.0.1
dev: true
optional: true
/esbuild@0.19.12:
resolution: {integrity: sha512-aARqgq8roFBj054KvQr5f1sFu0D65G+miZRCuJyJ0G13Zwx7vRar5Zhn2tkQNzIXcBrNVsv/8stehpj+GAjgbg==}
/esbuild@0.18.20:
resolution: {integrity: sha512-ceqxoedUrcayh7Y7ZX6NdbbDzGROiyVBgC4PriJThBKSVPWnnFHZAkfI1lJT8QFkOwH4qOS2SJkS4wvpGl8BpA==}
engines: {node: '>=12'}
hasBin: true
requiresBuild: true
optionalDependencies:
'@esbuild/aix-ppc64': 0.19.12
'@esbuild/android-arm': 0.19.12
'@esbuild/android-arm64': 0.19.12
'@esbuild/android-x64': 0.19.12
'@esbuild/darwin-arm64': 0.19.12
'@esbuild/darwin-x64': 0.19.12
'@esbuild/freebsd-arm64': 0.19.12
'@esbuild/freebsd-x64': 0.19.12
'@esbuild/linux-arm': 0.19.12
'@esbuild/linux-arm64': 0.19.12
'@esbuild/linux-ia32': 0.19.12
'@esbuild/linux-loong64': 0.19.12
'@esbuild/linux-mips64el': 0.19.12
'@esbuild/linux-ppc64': 0.19.12
'@esbuild/linux-riscv64': 0.19.12
'@esbuild/linux-s390x': 0.19.12
'@esbuild/linux-x64': 0.19.12
'@esbuild/netbsd-x64': 0.19.12
'@esbuild/openbsd-x64': 0.19.12
'@esbuild/sunos-x64': 0.19.12
'@esbuild/win32-arm64': 0.19.12
'@esbuild/win32-ia32': 0.19.12
'@esbuild/win32-x64': 0.19.12
'@esbuild/android-arm': 0.18.20
'@esbuild/android-arm64': 0.18.20
'@esbuild/android-x64': 0.18.20
'@esbuild/darwin-arm64': 0.18.20
'@esbuild/darwin-x64': 0.18.20
'@esbuild/freebsd-arm64': 0.18.20
'@esbuild/freebsd-x64': 0.18.20
'@esbuild/linux-arm': 0.18.20
'@esbuild/linux-arm64': 0.18.20
'@esbuild/linux-ia32': 0.18.20
'@esbuild/linux-loong64': 0.18.20
'@esbuild/linux-mips64el': 0.18.20
'@esbuild/linux-ppc64': 0.18.20
'@esbuild/linux-riscv64': 0.18.20
'@esbuild/linux-s390x': 0.18.20
'@esbuild/linux-x64': 0.18.20
'@esbuild/netbsd-x64': 0.18.20
'@esbuild/openbsd-x64': 0.18.20
'@esbuild/sunos-x64': 0.18.20
'@esbuild/win32-arm64': 0.18.20
'@esbuild/win32-ia32': 0.18.20
'@esbuild/win32-x64': 0.18.20
dev: true
/escalade@3.1.1:
@ -1837,14 +1709,6 @@ packages:
dev: true
optional: true
/image-size@0.5.5:
resolution: {integrity: sha512-6TDAlDPZxUFCv+fuOkIoXT/V/f3Qbq8e37p+YOiYrUv3v9cc3/6x78VdfPgFVaB9dZYeLUfKgHRebpkm/oP2VQ==}
engines: {node: '>=0.10.0'}
hasBin: true
requiresBuild: true
dev: true
optional: true
/imagesloaded@4.1.4:
resolution: {integrity: sha512-ltiBVcYpc/TYTF5nolkMNsnREHW+ICvfQ3Yla2Sgr71YFwQ86bDwV9hgpFhFtrGPuwEx5+LqOHIrdXBdoWwwsA==}
dependencies:
@ -1934,13 +1798,13 @@ packages:
parse-node-version: 1.0.1
tslib: 2.6.2
optionalDependencies:
errno: 0.1.8
errno: r2.cnpmjs.org/errno@0.1.8
graceful-fs: 4.2.11
image-size: 0.5.5
make-dir: 2.1.0
mime: 1.6.0
image-size: r2.cnpmjs.org/image-size@0.5.5
make-dir: r2.cnpmjs.org/make-dir@2.1.0
mime: r2.cnpmjs.org/mime@1.6.0
needle: 3.2.0
source-map: 0.6.1
source-map: r2.cnpmjs.org/source-map@0.6.1
transitivePeerDependencies:
- supports-color
dev: true
@ -1989,16 +1853,6 @@ packages:
dependencies:
'@jridgewell/sourcemap-codec': 1.4.15
/make-dir@2.1.0:
resolution: {integrity: sha512-LS9X+dc8KLxXCb8dni79fLIIUA5VyZoyjSMCwTluaXA0o27cCK0bhXkpgw+sTXVpPy/lSO57ilRixqk0vDmtRA==}
engines: {node: '>=6'}
requiresBuild: true
dependencies:
pify: 4.0.1
semver: 5.7.2
dev: true
optional: true
/make-dir@3.1.0:
resolution: {integrity: sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw==}
engines: {node: '>=8'}
@ -2027,14 +1881,6 @@ packages:
mime-db: 1.52.0
dev: false
/mime@1.6.0:
resolution: {integrity: sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==}
engines: {node: '>=4'}
hasBin: true
requiresBuild: true
dev: true
optional: true
/minimatch@3.1.2:
resolution: {integrity: sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==}
requiresBuild: true
@ -2168,19 +2014,6 @@ packages:
resolution: {integrity: sha512-uYr7J37ae/ORWdZeQ1xxMJe3NtdmqMC/JZK+geofDrkLUApKRHPd18/TxtBOJ4A0/+uUIliorNrfYV6s1b02eQ==}
dev: true
/nodejieba@2.5.2:
resolution: {integrity: sha512-ByskJvaBrQ2eV+5M0OeD80S5NKoGaHc9zi3Z/PTKl/95eac2YF8RmWduq9AknLpkQLrLAIcqurrtC6BzjpKwwg==}
engines: {node: '>= 10.20.0'}
requiresBuild: true
dependencies:
'@mapbox/node-pre-gyp': 1.0.11
node-addon-api: 3.2.1
transitivePeerDependencies:
- encoding
- supports-color
dev: false
optional: true
/nopt@5.0.0:
resolution: {integrity: sha512-Tbj67rffqceeLpcRXrT7vKAN8CwfPeIBgM7E6iBkmKLV7bEMwpGgYLGv0jACUsECaa/vuxP0IjEont6umdMgtQ==}
engines: {node: '>=6'}
@ -2283,7 +2116,7 @@ packages:
commander: 1.1.1
object-assign: 4.1.1
optionalDependencies:
nodejieba: 2.5.2
nodejieba: r2.cnpmjs.org/nodejieba@2.5.2
transitivePeerDependencies:
- encoding
- supports-color
@ -2360,26 +2193,11 @@ packages:
dev: false
optional: true
/rollup@4.12.0:
resolution: {integrity: sha512-wz66wn4t1OHIJw3+XU7mJJQV/2NAfw5OAk6G6Hoo3zcvz/XOfQ52Vgi+AN4Uxoxi0KBBwk2g8zPrTDA4btSB/Q==}
engines: {node: '>=18.0.0', npm: '>=8.0.0'}
/rollup@3.29.4:
resolution: {integrity: sha512-oWzmBZwvYrU0iJHtDmhsm662rC15FRXmcjCk1xD771dFDx5jJ02ufAQQTn0etB2emNk4J9EZg/yWKpsn9BWGRw==}
engines: {node: '>=14.18.0', npm: '>=8.0.0'}
hasBin: true
dependencies:
'@types/estree': 1.0.5
optionalDependencies:
'@rollup/rollup-android-arm-eabi': 4.12.0
'@rollup/rollup-android-arm64': 4.12.0
'@rollup/rollup-darwin-arm64': 4.12.0
'@rollup/rollup-darwin-x64': 4.12.0
'@rollup/rollup-linux-arm-gnueabihf': 4.12.0
'@rollup/rollup-linux-arm64-gnu': 4.12.0
'@rollup/rollup-linux-arm64-musl': 4.12.0
'@rollup/rollup-linux-riscv64-gnu': 4.12.0
'@rollup/rollup-linux-x64-gnu': 4.12.0
'@rollup/rollup-linux-x64-musl': 4.12.0
'@rollup/rollup-win32-arm64-msvc': 4.12.0
'@rollup/rollup-win32-ia32-msvc': 4.12.0
'@rollup/rollup-win32-x64-msvc': 4.12.0
fsevents: 2.3.3
dev: true
@ -2450,6 +2268,7 @@ packages:
/source-map@0.6.1:
resolution: {integrity: sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==}
engines: {node: '>=0.10.0'}
dev: false
/ssr-window@4.0.2:
resolution: {integrity: sha512-ISv/Ch+ig7SOtw7G2+qkwfVASzazUnvlDTwypdLoPoySv+6MqlOV10VwPSE6EWkGjhW50lUmghPmpYZXMu/+AQ==}
@ -2547,7 +2366,7 @@ packages:
resolution: {integrity: sha512-Hhy+BhRBleFjpJ2vchUNN40qgkh0366FWJGqVLYBHev0vpHTrXSA0ryT+74UiW6KWsldNurQMKGqCm1M2zBciQ==}
dev: true
/unplugin-combine@0.8.1(vite@5.1.4):
/unplugin-combine@0.8.1(vite@4.5.2):
resolution: {integrity: sha512-m2OSmXXRwCPZx8Ct8eF8WbjgTo8bydim2W1ofu2hDabGdr2pgDAoFjOP1J4MOIwa0OByqk1JX8IGlSdeE6uxVQ==}
engines: {node: '>=16.14.0'}
peerDependencies:
@ -2567,7 +2386,7 @@ packages:
dependencies:
'@antfu/utils': 0.7.7
unplugin: 1.7.1
vite: 5.1.4(less@4.1.3)
vite: 4.5.2(less@4.1.3)
dev: true
/unplugin-vue-define-options@1.4.2(vue@3.4.21):
@ -2582,7 +2401,7 @@ packages:
- vue
dev: true
/unplugin-vue-macros@2.7.10(vite@5.1.4)(vue@3.4.21):
/unplugin-vue-macros@2.7.10(vite@4.5.2)(vue@3.4.21):
resolution: {integrity: sha512-4saYre3PEX2yL7CTAf4yvQ5Aq/qygTDxRXGnIoe4Lvg2IabMRlx4QiaKLNRuMY3kYLYKhXhxOcJKGy2O/iOfBg==}
engines: {node: '>=16.14.0'}
peerDependencies:
@ -2599,7 +2418,7 @@ packages:
'@vue-macros/define-props-refs': 1.2.2(vue@3.4.21)
'@vue-macros/define-render': 1.5.2(vue@3.4.21)
'@vue-macros/define-slots': 1.1.2(vue@3.4.21)
'@vue-macros/devtools': 0.2.0(vite@5.1.4)
'@vue-macros/devtools': 0.2.0(vite@4.5.2)
'@vue-macros/export-expose': 0.1.2(vue@3.4.21)
'@vue-macros/export-props': 0.4.2(vue@3.4.21)
'@vue-macros/export-render': 0.2.2(vue@3.4.21)
@ -2614,7 +2433,7 @@ packages:
'@vue-macros/short-emits': 1.5.2(vue@3.4.21)
'@vue-macros/short-vmodel': 1.4.2(vue@3.4.21)
unplugin: 1.7.1
unplugin-combine: 0.8.1(vite@5.1.4)
unplugin-combine: 0.8.1(vite@4.5.2)
unplugin-vue-define-options: 1.4.2(vue@3.4.21)
vue: 3.4.21
transitivePeerDependencies:
@ -2661,12 +2480,12 @@ packages:
mutation-observer: 1.0.3
dev: false
/vite@5.1.4(less@4.1.3):
resolution: {integrity: sha512-n+MPqzq+d9nMVTKyewqw6kSt+R3CkvF9QAKY8obiQn8g1fwTscKxyfaYnC632HtBXAQGc1Yjomphwn1dtwGAHg==}
engines: {node: ^18.0.0 || >=20.0.0}
/vite@4.5.2(less@4.1.3):
resolution: {integrity: sha512-tBCZBNSBbHQkaGyhGCDUGqeo2ph8Fstyp6FMSvTtsXeZSPpSMGlviAOav2hxVTqFcx8Hj/twtWKsMJXNY0xI8w==}
engines: {node: ^14.18.0 || >=16.0.0}
hasBin: true
peerDependencies:
'@types/node': ^18.0.0 || >=20.0.0
'@types/node': '>= 14'
less: '*'
lightningcss: ^1.21.0
sass: '*'
@ -2689,10 +2508,10 @@ packages:
terser:
optional: true
dependencies:
esbuild: 0.19.12
esbuild: 0.18.20
less: 4.1.3
postcss: 8.4.35
rollup: 4.12.0
rollup: 3.29.4
optionalDependencies:
fsevents: 2.3.3
dev: true
@ -2836,3 +2655,70 @@ packages:
requiresBuild: true
dev: false
optional: true
r2.cnpmjs.org/errno@0.1.8:
resolution: {integrity: sha512-dJ6oBr5SQ1VSd9qkk7ByRgb/1SH4JZjCHSW/mr63/QcXO9zLVxvJ6Oy13nio03rxpSnVDDjFor75SjVeZWPW/A==, registry: https://r.cnpmjs.org/, tarball: https://r2.cnpmjs.org/errno/-/errno-0.1.8.tgz}
name: errno
version: 0.1.8
hasBin: true
requiresBuild: true
dependencies:
prr: 1.0.1
dev: true
optional: true
r2.cnpmjs.org/image-size@0.5.5:
resolution: {integrity: sha512-6TDAlDPZxUFCv+fuOkIoXT/V/f3Qbq8e37p+YOiYrUv3v9cc3/6x78VdfPgFVaB9dZYeLUfKgHRebpkm/oP2VQ==, registry: https://r.cnpmjs.org/, tarball: https://r2.cnpmjs.org/image-size/-/image-size-0.5.5.tgz}
name: image-size
version: 0.5.5
engines: {node: '>=0.10.0'}
hasBin: true
requiresBuild: true
dev: true
optional: true
r2.cnpmjs.org/make-dir@2.1.0:
resolution: {integrity: sha512-LS9X+dc8KLxXCb8dni79fLIIUA5VyZoyjSMCwTluaXA0o27cCK0bhXkpgw+sTXVpPy/lSO57ilRixqk0vDmtRA==, registry: https://r.cnpmjs.org/, tarball: https://r2.cnpmjs.org/make-dir/-/make-dir-2.1.0.tgz}
name: make-dir
version: 2.1.0
engines: {node: '>=6'}
requiresBuild: true
dependencies:
pify: 4.0.1
semver: 5.7.2
dev: true
optional: true
r2.cnpmjs.org/mime@1.6.0:
resolution: {integrity: sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==, registry: https://r.cnpmjs.org/, tarball: https://r2.cnpmjs.org/mime/-/mime-1.6.0.tgz}
name: mime
version: 1.6.0
engines: {node: '>=4'}
hasBin: true
requiresBuild: true
dev: true
optional: true
r2.cnpmjs.org/nodejieba@2.5.2:
resolution: {integrity: sha512-ByskJvaBrQ2eV+5M0OeD80S5NKoGaHc9zi3Z/PTKl/95eac2YF8RmWduq9AknLpkQLrLAIcqurrtC6BzjpKwwg==, registry: https://r.cnpmjs.org/, tarball: https://r2.cnpmjs.org/nodejieba/-/nodejieba-2.5.2.tgz}
name: nodejieba
version: 2.5.2
engines: {node: '>= 10.20.0'}
requiresBuild: true
dependencies:
'@mapbox/node-pre-gyp': 1.0.11
node-addon-api: 3.2.1
transitivePeerDependencies:
- encoding
- supports-color
dev: false
optional: true
r2.cnpmjs.org/source-map@0.6.1:
resolution: {integrity: sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==, registry: https://r.cnpmjs.org/, tarball: https://r2.cnpmjs.org/source-map/-/source-map-0.6.1.tgz}
name: source-map
version: 0.6.1
engines: {node: '>=0.10.0'}
requiresBuild: true
dev: true
optional: true

2
src/assets/less/variables.less
View File

@ -1,4 +1,4 @@
@footer-height: 50rem;
@footer-height: 56rem;
@header-height: 50rem;
@indicator-height: 50rem;

10
src/components/slide/ItemDesc.vue
View File

@ -32,8 +32,8 @@ const state = reactive({
</script>
<template>
<div class="item-desc">
<div class="content ml1r mb1r" v-if="!props.isMy">
<div class="item-desc ml1r mb1r">
<div class="content" v-if="!props.isMy">
<div class="location-wrapper" v-if=" props.item.city || item.address">
<div class="location">
<img src="../../assets/img/icon/location.webp" alt="">
@ -80,12 +80,12 @@ const state = reactive({
@import "../../assets/less/color";
.item-desc {
position: absolute;
bottom: 0;
.content {
color: #fff;
position: absolute;
bottom: 0;
width: 75%;
width: 75vw;
//display: flex;
//flex-direction: column;

249
src/components/slide/SlideAlbum.vue
View File

@ -13,11 +13,14 @@
</div>
</div>
<template v-if=" state.operationStatus === SlideAlbumOperationStatus.Normal">
<ItemToolbar v-model:item="state.localItem"
:position="position"
v-bind="$attrs"
<ItemToolbar
class="mb3r"
v-model:item="state.localItem"
:position="position"
v-bind="$attrs"
/>
<ItemDesc
class="mb3r"
v-model:item="state.localItem"
:position="position"
/>
@ -32,7 +35,7 @@
>
<div class="bar" v-for="(img,index) in item.imgs">
<div class="progress"
:style="getProgressWidth(index)"></div>
:style="getWidth(index)"></div>
</div>
</div>
<Teleport to="#home-index" v-if="state.isPreview">
@ -49,13 +52,15 @@
</div>
</div>
</Teleport>
<Teleport to="#home-index" v-if="state.operationStatus === SlideAlbumOperationStatus.Detail">
<Teleport to="#home-index" v-if="state.operationStatus !== SlideAlbumOperationStatus.Normal">
<div class="album-toolbar">
<div class="left">关闭</div>
<div class="left">
<Icon icon="iconamoon:close" @click="state.operationStatus = SlideAlbumOperationStatus.Normal"/>
</div>
<div class="right">
<div class="option">评论</div>
<div class="option">切换</div>
<div class="option">下载</div>
<Icon icon="heroicons-outline:menu-alt-1" @click="Utils.$no"/>
<Icon icon="fluent:play-28-filled" class="pause" @click="Utils.$no"/>
<Icon icon="system-uicons:push-down" @click="Utils.$no"/>
</div>
</div>
</Teleport>
@ -66,6 +71,7 @@
import enums from "../../utils/enums";
import Utils from '../../utils'
import {mat4} from 'gl-matrix'
import {Icon} from "@iconify/vue";
import {onMounted, onBeforeUpdate, reactive, ref, watch, computed, provide, nextTick} from "vue";
import {
getSlideDistance,
@ -80,7 +86,7 @@ import ItemToolbar from "./ItemToolbar";
import ItemDesc from "./ItemDesc";
import GM from "../../utils";
import {cloneDeep} from "lodash";
import bus from "../../utils/bus";
import bus, {EVENT_KEY} from "../../utils/bus";
let out = new Float32Array([
0, 0, 0, 0,
@ -234,27 +240,35 @@ const state = reactive({
itemRefs: [],
previewImgs: [],
status: 'play',//stop,custom
progress: 0,
cycleFn: 0,
cycleFn: -1,
isAutoPlay: true,
localItem: props.item,
})
function start() {
state.cycleFn = setTimeout(() => {
if (state.status !== 'play') return clearTimeout(state.cycleFn)
function stopPlay() {
clearInterval(state.cycleFn)
state.cycleFn = -1
}
function startPlay() {
if (state.cycleFn !== -1) return
if (!state.isAutoPlay) return
state.cycleFn = setInterval(() => {
if (state.localIndex < props.item.imgs.length - 1) {
state.localIndex++
} else {
state.localIndex = 0
}
start()
}, 1500)
}
onMounted(async () => {
await nextTick();
slideInit(wrapperEl.value, state, SlideType.HORIZONTAL)
start()
// startPlay()
setTimeout(() => {
state.operationStatus = SlideAlbumOperationStatus.Zooming
}, 1000)
})
// 确保在每次更新之前重置ref
@ -268,17 +282,16 @@ watch(
(newVal) => {
GM.$setCss(wrapperEl.value, 'transition-duration', `300ms`)
GM.$setCss(wrapperEl.value, 'transform', `translate3d(${getSlideDistance(state, SlideType.HORIZONTAL)}px, 0, 0)`)
// state.progress = (state.localIndex + 1) * 100
}
)
watch(
() => state.operationStatus,
(newVal) => {
if (newVal === SlideAlbumOperationStatus.Zooming) {
bus.emit('enterFullscreen')
if (newVal !== SlideAlbumOperationStatus.Normal) {
bus.emit(EVENT_KEY.ENTER_FULLSCREEN)
} else {
bus.emit('exitFullscreen')
bus.emit(EVENT_KEY.EXIT_FULLSCREEN)
}
}
)
@ -320,8 +333,10 @@ function progressBarTouchMEnd(e) {
}
function touchStart(e) {
// Utils.$showNoticeDialog('start'+e.touches.length)
// console.log('start', e.touches.length)
if (e.touches.length === 1) {
isZooming.value = false
slideTouchStart(e, wrapperEl.value, state)
} else {
if (isZooming.value) return
@ -334,123 +349,126 @@ function touchStart(e) {
}
function touchMove(e) {
// Utils.$showNoticeDialog('move'+e.touches.length)
// console.log('move', e.touches.length,)
let current1 = {x: e.touches[0].pageX, y: e.touches[0].pageY}
if (isZooming.value && e.touches.length === 1) {
// console.log('m1')
state.status = 'pause'
Utils.$stopPropagation(e)
stopPlay()
// console.log('单手移动',)
let movementX = current1.x - state.last.point1.x
let movementY = current1.y - state.last.point1.y
// console.log(movementX, movementY)
const t = new Float32Array([1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, movementX, movementY, 0, 1,]);
ov = mat4.multiply(out, t, ov);
state.itemRefs[state.localIndex].style.transform = `matrix3d(${ov.toString()})`;
state.last.point1 = current1
} else {
if (e.touches.length === 1) {
//单手移动
if (e.touches.length === 1) {
if (isZooming.value) {
// console.log('m1')
Utils.$stopPropagation(e)
// console.log('单手移动',)
let movementX = current1.x - state.last.point1.x
let movementY = current1.y - state.last.point1.y
// console.log(movementX, movementY)
const t = new Float32Array([1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, movementX, movementY, 0, 1,]);
ov = mat4.multiply(out, t, ov);
state.itemRefs[state.localIndex].style.transform = `matrix3d(${ov.toString()})`;
state.last.point1 = current1
} else {
// console.log('m2')
state.isAutoPlay = false
slideTouchMove(e, wrapperEl.value, state, judgeValue, canNext,
() => {
state.status = 'pause'
}, SlideType.HORIZONTAL,
() => {
if (state.operationStatus === SlideAlbumOperationStatus.Detail) {
Utils.$stopPropagation(e)
}
})
} else {
// console.log('m3')
state.operationStatus = SlideAlbumOperationStatus.Zooming
Utils.$stopPropagation(e)
state.status = 'pause'
let rect = {x: 0, y: 0}
if (rectMap.has(state.localIndex)) {
rect = rectMap.get(state.localIndex)
} else {
//getBoundingClientRect在手机上获取不到值
let offset = $(state.itemRefs[state.localIndex]).offset()
rect = {x: offset.left, y: offset.top}
rectMap.set(state.localIndex, rect)
}
let current2 = {x: e.touches[1].pageX, y: e.touches[1].pageY}
// 双指缩放比例，就是对应的放大倍数
let currentRatio = Utils.getDistance(current1, current2) / Utils.getDistance(state.start.point1, state.start.point2);
let center = Utils.getCenter(current1, current2)
center.x -= rect.x
center.y -= rect.y
//用最新的放大倍数ratio除以之前的放大ov[0]倍数，算出本次要累加放大的倍数
let zoom = currentRatio / ov[0]
const x = center.x * (1 - zoom);
const y = center.y * (1 - zoom);
const t = new Float32Array([zoom, 0, 0, 0, 0, zoom, 0, 0, 0, 0, 1, 0, x, y, 0, 1,]);
//如果zoom是每次都是最后放大倍数，第三个参数用原值（即，矩阵x乘时，都是乘以单位矩阵）
//如果zoom是累加放大（比如每次都是0.15），第三个参数用ov。这里还是采用累加计算
ov = mat4.multiply(out, t, ov);
let movementRatio = currentRatio - ov[0]
//如果本次比例和上次的不超过0.02。那么判定为平移
if (Math.abs(movementRatio) <= 0.02) {
let movementX = current1.x - state.last.point1.x
let movementY = current1.y - state.last.point1.y
let movement2X = current2.x - state.last.point2.x
let movement2Y = current2.y - state.last.point2.y
let minX = Math.min(movementX, movement2X)
let minY = Math.min(movementY, movement2Y)
const t1 = new Float32Array([1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, minX, minY, 0, 1,]);
ov = mat4.multiply(out, t1, ov);
}
state.itemRefs[state.localIndex].style.transform = `matrix3d(${ov.toString()})`;
state.last.point1 = current1
state.last.point2 = current2
}
} else {
// console.log('m3')
state.operationStatus = SlideAlbumOperationStatus.Zooming
Utils.$stopPropagation(e)
let rect = {x: 0, y: 0}
if (rectMap.has(state.localIndex)) {
rect = rectMap.get(state.localIndex)
} else {
//getBoundingClientRect在手机上获取不到值
let offset = $(state.itemRefs[state.localIndex]).offset()
rect = {x: offset.left, y: offset.top}
rectMap.set(state.localIndex, rect)
}
let current2 = {x: e.touches[1].pageX, y: e.touches[1].pageY}
// 双指缩放比例，就是对应的放大倍数
let currentRatio = Utils.getDistance(current1, current2) / Utils.getDistance(state.start.point1, state.start.point2);
let center = Utils.getCenter(current1, current2)
center.x -= rect.x
center.y -= rect.y
//用最新的放大倍数ratio除以之前的放大ov[0]倍数，算出本次要累加放大的倍数
let zoom = currentRatio / ov[0]
const x = center.x * (1 - zoom);
const y = center.y * (1 - zoom);
const t = new Float32Array([zoom, 0, 0, 0, 0, zoom, 0, 0, 0, 0, 1, 0, x, y, 0, 1,]);
//如果zoom是每次都是最后放大倍数，第三个参数用原值（即，矩阵x乘时，都是乘以单位矩阵）
//如果zoom是累加放大（比如每次都是0.15），第三个参数用ov。这里还是采用累加计算
ov = mat4.multiply(out, t, ov);
let movementRatio = currentRatio - ov[0]
//如果本次比例和上次的不超过0.02。那么判定为平移
if (Math.abs(movementRatio) <= 0.02) {
let movementX = current1.x - state.last.point1.x
let movementY = current1.y - state.last.point1.y
let movement2X = current2.x - state.last.point2.x
let movement2Y = current2.y - state.last.point2.y
let minX = Math.min(movementX, movement2X)
let minY = Math.min(movementY, movement2Y)
const t1 = new Float32Array([1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, minX, minY, 0, 1,]);
ov = mat4.multiply(out, t1, ov);
}
state.itemRefs[state.localIndex].style.transform = `matrix3d(${ov.toString()})`;
state.last.point1 = current1
state.last.point2 = current2
}
}
function touchEnd(e) {
state.isPreview = false
console.log('end', e.touches.length, state.operationStatus)
//双指缩放，但只松开了一只手
if (isZooming.value && e.touches.length === 1) {
Utils.$stopPropagation(e)
state.last.point1 = {x: e.touches[0].pageX, y: e.touches[0].pageY}
} else {
//这里获取到的手指数一直为0，所以用之前的变量来判断
// console.log('end', e.touches.length, state.operationStatus)
// Utils.$showNoticeDialog('1' + e.touches.length)
if (e.touches.length === 1) {
//双指缩放状态下，但只松开了一只手
if (isZooming.value) {
state.operationStatus = SlideAlbumOperationStatus.Detail
ov = origin
Utils.$stopPropagation(e)
state.itemRefs[state.localIndex].style['transition-duration'] = '300ms';
state.itemRefs[state.localIndex].style.transform = `matrix3d(${origin.toString()})`;
state.last.point1 = {x: e.touches[0].pageX, y: e.touches[0].pageY}
startPlay()
} else {
slideTouchEnd(e, state, canNext,
() => {
state.status = 'custom'
state.progress = (state.localIndex + 1) * 100
console.log('nextCb')
},
() => {
console.log('notNextCb')
console.log('doNotNextCb')
state.operationStatus = SlideAlbumOperationStatus.Normal
if (state.status !== 'custom') {
state.status = 'play'
requestAnimationFrame(state.cycleFn)
}
startPlay()
}
)
slideReset(wrapperEl.value, state, SlideType.HORIZONTAL, null)
}
} else {
state.operationStatus = SlideAlbumOperationStatus.Detail
ov = origin
Utils.$stopPropagation(e)
state.itemRefs[state.localIndex].style['transition-duration'] = '300ms';
state.itemRefs[state.localIndex].style.transform = `matrix3d(${origin.toString()})`;
startPlay()
}
}
function getProgressWidth(index) {
function getWidth(index) {
if (state.localIndex >= index) return {width: '100%'}
}
@ -510,7 +528,7 @@ function canNext(isNext, e) {
.progress-bar {
position: absolute;
width: 100%;
bottom: 8rem;
bottom: 10rem;
display: flex;
box-sizing: border-box;
padding: 0 5rem;
@ -562,9 +580,9 @@ function canNext(isNext, e) {
width: 30rem;
height: 50rem;
background-color: black;
object-fit: contain;
border-radius: 3rem;
overflow: hidden;
object-fit: cover;
&.preview-img {
width: 40rem;
@ -590,6 +608,8 @@ function canNext(isNext, e) {
.album-toolbar {
position: absolute;
bottom: 0;
color: white;
font-size: 24rem;
background: @footer-color;
width: 100%;
box-sizing: border-box;
@ -599,12 +619,12 @@ function canNext(isNext, e) {
justify-content: space-between;
padding: 0 10rem;
@padding: 12rem;
@padding: 18rem;
.left {
height: 34rem;
background-color: gray;
border-radius: 6rem;
height: 40rem;
background-color: rgba(71, 71, 86, 0.53);
border-radius: 10rem;
padding: 0 @padding;
display: flex;
align-items: center;
@ -614,11 +634,10 @@ function canNext(isNext, e) {
.right {
.left;
.option {
margin: 0 5rem;
}
display: flex;
align-items: center;
gap: 20rem;
}
}
</style>

6
src/components/slide/common.js
View File

@ -71,11 +71,11 @@ export function slideTouchMove(e, el, state, judgeValue, canNextCb, nextCb, type
}
}
export function slideTouchEnd(e, state, canNextCb, nextCb, notNextCb, type = SlideType.HORIZONTAL) {
export function slideTouchEnd(e, state, canNextCb, nextCb, doNotNextCb, type = SlideType.HORIZONTAL) {
let isHorizontal = type === SlideType.HORIZONTAL;
let isNext = isHorizontal ? state.move.x < 0 : state.move.y < 0
if (!canNextCb?.(isNext)) return notNextCb?.()
if (!canNextCb?.(isNext)) return doNotNextCb?.()
if (state.next) {
Utils.$stopPropagation(e)
let endTime = Date.now()
@ -93,7 +93,7 @@ export function slideTouchEnd(e, state, canNextCb, nextCb, notNextCb, type = Sli
return nextCb?.(isNext)
}
}
notNextCb?.()
doNotNextCb?.()
}
export function slideReset(el, state, type, emit) {