commit 8d1bf90ba355800cccfd2c3f3e8278b9f2d20253 Author: zhangjianjun Date: Thu Jul 9 16:17:33 2026 +0800 init diff --git a/.env b/.env new file mode 100644 index 0000000..877b334 --- /dev/null +++ b/.env @@ -0,0 +1,2 @@ +VITE_BASE_URL=http://twin.batiao8.com +VITE_APP_ID=10063 \ No newline at end of file diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..a547bf3 --- /dev/null +++ b/.gitignore @@ -0,0 +1,24 @@ +# Logs +logs +*.log +npm-debug.log* +yarn-debug.log* +yarn-error.log* +pnpm-debug.log* +lerna-debug.log* + +node_modules +dist +dist-ssr +*.local + +# Editor directories and files +.vscode/* +!.vscode/extensions.json +.idea +.DS_Store +*.suo +*.ntvs* +*.njsproj +*.sln +*.sw? diff --git a/.oxlintrc.json b/.oxlintrc.json new file mode 100644 index 0000000..6fa991d --- /dev/null +++ b/.oxlintrc.json @@ -0,0 +1,8 @@ +{ + "$schema": "./node_modules/oxlint/configuration_schema.json", + "plugins": ["react", "typescript", "oxc"], + "rules": { + "react/rules-of-hooks": "error", + "react/only-export-components": ["warn", { "allowConstantExport": true }] + } +} diff --git a/README.md b/README.md new file mode 100644 index 0000000..d6af7e3 --- /dev/null +++ b/README.md @@ -0,0 +1,32 @@ +# React + TypeScript + Vite + +This template provides a minimal setup to get React working in Vite with HMR and some Oxlint rules. + +Currently, two official plugins are available: + +- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Oxc](https://oxc.rs) +- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/) + +## React Compiler + +The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see [this documentation](https://react.dev/learn/react-compiler/installation). + +## Expanding the Oxlint configuration + +If you are developing a production application, we recommend enabling type-aware lint rules by installing `oxlint-tsgolint` and editing `.oxlintrc.json`: + +```json +{ + "$schema": "./node_modules/oxlint/configuration_schema.json", + "plugins": ["react", "typescript", "oxc"], + "options": { + "typeAware": true + }, + "rules": { + "react/rules-of-hooks": "error", + "react/only-export-components": ["warn", { "allowConstantExport": true }] + } +} +``` + +See the [Oxlint rules documentation](https://oxc.rs/docs/guide/usage/linter/rules) for the full list of rules and categories. diff --git a/index.html b/index.html new file mode 100644 index 0000000..ae4f796 --- /dev/null +++ b/index.html @@ -0,0 +1,13 @@ + + + + + + + app-twins + + +
+ + + diff --git a/package.json b/package.json new file mode 100644 index 0000000..a47f6b1 --- /dev/null +++ b/package.json @@ -0,0 +1,27 @@ +{ + "name": "app-twins", + "private": true, + "version": "0.0.0", + "type": "module", + "scripts": { + "dev": "vite", + "build": "tsc -b && vite build", + "lint": "oxlint", + "preview": "vite preview" + }, + "dependencies": { + "bowser": "^2.14.1", + "react": "^19.2.7", + "react-dom": "^19.2.7", + "react-router-dom": "^7.18.1" + }, + "devDependencies": { + "@types/node": "^24.13.2", + "@types/react": "^19.2.17", + "@types/react-dom": "^19.2.3", + "@vitejs/plugin-react": "^6.0.3", + "oxlint": "^1.71.0", + "typescript": "~6.0.2", + "vite": "^8.1.1" + } +} diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml new file mode 100644 index 0000000..763d55d --- /dev/null +++ b/pnpm-lock.yaml @@ -0,0 +1,867 @@ +lockfileVersion: '9.0' + +settings: + autoInstallPeers: true + excludeLinksFromLockfile: false + +importers: + + .: + dependencies: + bowser: + specifier: ^2.14.1 + version: 2.14.1 + react: + specifier: ^19.2.7 + version: 19.2.7 + react-dom: + specifier: ^19.2.7 + version: 19.2.7(react@19.2.7) + react-router-dom: + specifier: ^7.18.1 + version: 7.18.1(react-dom@19.2.7(react@19.2.7))(react@19.2.7) + devDependencies: + '@types/node': + specifier: ^24.13.2 + version: 24.13.2 + '@types/react': + specifier: ^19.2.17 + version: 19.2.17 + '@types/react-dom': + specifier: ^19.2.3 + version: 19.2.3(@types/react@19.2.17) + '@vitejs/plugin-react': + specifier: ^6.0.3 + version: 6.0.3(vite@8.1.2(@types/node@24.13.2)) + oxlint: + specifier: ^1.71.0 + version: 1.72.0 + typescript: + specifier: ~6.0.2 + version: 6.0.3 + vite: + specifier: ^8.1.1 + version: 8.1.2(@types/node@24.13.2) + +packages: + + '@emnapi/core@1.11.1': + resolution: {integrity: sha512-RSvbQmHzdKzNsLYa/wHrbc3KN4sYLKAdPZxqiM2HATqv/SBk2/ENSHpvXGaLOMcsAyz0poEGqkmmKYG3OWiJEQ==} + + '@emnapi/runtime@1.11.1': + resolution: {integrity: sha512-vgj7R3y3Wgx24IQaGPA/R6YFXLHVMOZ0uVEyIQPaWs+rd1AzfEMXlAC22FYwO1XkKR6NPsq7mUandH8oIRdZFw==} + + '@emnapi/wasi-threads@1.2.2': + resolution: {integrity: sha512-c95qOXkHdydNKhscBTebqEC1CVAZpyqOfVfBzQ1qgzyl3gfeldUjIggDbIZgDKsHLgnsM+igH7TJ/eAasaVuMA==} + + '@napi-rs/wasm-runtime@1.1.6': + resolution: {integrity: sha512-ZLv/JdUfkvOy9eCnnBaGfiO+XimbjebAeO+MRQqD/B+FR1tnRN0tpKSJHRbE8sFfS6aqsXZ67TQjfwfsxULVbg==} + peerDependencies: + '@emnapi/core': ^1.7.1 + '@emnapi/runtime': ^1.7.1 + + '@oxc-project/types@0.137.0': + resolution: {integrity: sha512-WT+Gb24i8hmvo85AIv2oEYouEXkRlKAlT9WaCa3TfLgNCN+GhrJOGZuIlMouAh38Qe4QOx26eUOVsq70qXrywA==} + + '@oxlint/binding-android-arm-eabi@1.72.0': + resolution: {integrity: sha512-zhCmvn+1Mj3UchAc/90i99S0t7jJUsHmFVSPg4UWrjO8b8eaSGwscgO6QAUtvHBstkjQwBttQNswEnAF1mIQdA==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [arm] + os: [android] + + '@oxlint/binding-android-arm64@1.72.0': + resolution: {integrity: sha512-mtH+aY/ozv1eZoCUC2owjFAtyNBKHpJHygKeEu9zXXnQGW1Q2/qOpvx+I+Lf23+TvTz66F4iiXUbl2cGvoLPCQ==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [arm64] + os: [android] + + '@oxlint/binding-darwin-arm64@1.72.0': + resolution: {integrity: sha512-EvnajNPDtfknB3ZieeOOyDTwJn9QXDiwfnF4ZDQqART6RG6hjY4WigQcZdGoK2dkB3e1vrmEzN9aYbQCUkh/gQ==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [arm64] + os: [darwin] + + '@oxlint/binding-darwin-x64@1.72.0': + resolution: {integrity: sha512-ZkCdEa/G80A7vEHfeCDz/+L3m33DE73v32mDKhgOIgz8Uwf0DFcK7+uu6qC+7LEhmz5fpOe1osWKyjSNMydFIQ==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [x64] + os: [darwin] + + '@oxlint/binding-freebsd-x64@1.72.0': + resolution: {integrity: sha512-NroXv2vh+sxVY1uya/rM5pjhx1hm8BzlYpx9q67QP0Xhw5MH2bf5GJylpvLEC+781p1Xli/317EoV9AlGwViag==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [x64] + os: [freebsd] + + '@oxlint/binding-linux-arm-gnueabihf@1.72.0': + resolution: {integrity: sha512-0NDywYgfj279Ou/BcQuCYSj7NJwBfmWn5qc5uGO/Ny7fUWmXyIpvawqX/8acQlWG6IXelJsJhj+JAy6sjsKj0A==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [arm] + os: [linux] + + '@oxlint/binding-linux-arm-musleabihf@1.72.0': + resolution: {integrity: sha512-4vpXB06h65Ezsy4hRyrGjGrfa1SkVPii09yaajiYhmVpgsFiLD+KNxIx/BNAY+XiO+i1yqp9HHdwqM8VTqa5XQ==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [arm] + os: [linux] + + '@oxlint/binding-linux-arm64-gnu@1.72.0': + resolution: {integrity: sha512-immaN4g2ZGFiOkKrvRX9LvzZdd2GkQM5wR+UyzYyUuyhUTXGQ4HKUJH18xp4G8OfhCVaVAJfKZxwE1r8+4hhaQ==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [arm64] + os: [linux] + libc: [glibc] + + '@oxlint/binding-linux-arm64-musl@1.72.0': + resolution: {integrity: sha512-JGHS9Mnr7iWyyLDxgCv1MhzVpAckgptg00F2gnxt/GD7lQ2SW1BRcxHqhSTaSdDpjWRrBkBxMMh4+Hn3aVtExg==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [arm64] + os: [linux] + libc: [musl] + + '@oxlint/binding-linux-ppc64-gnu@1.72.0': + resolution: {integrity: sha512-AOYgBZqxNshrg83P9v0RYv+m8s10Cqkj4/PxXFDhcS3k7FqsIG5+CxErshZCIN7G8iy4Y+VGfAsuEdar8AcbBg==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [ppc64] + os: [linux] + libc: [glibc] + + '@oxlint/binding-linux-riscv64-gnu@1.72.0': + resolution: {integrity: sha512-QMybPS5ij3/vrKG67mqzHwW++91sYxK/PPUVi6SBtNCEzW4niS52fVBdXbQ6nou0wWbUPEpx8Sl/ZjtgE3clXA==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [riscv64] + os: [linux] + libc: [glibc] + + '@oxlint/binding-linux-riscv64-musl@1.72.0': + resolution: {integrity: sha512-gOc3W7JV0PXRpIL7stUlLe3Wa9Gp0Kdlup87IT3gHDvPKck2xNgMIl/Gs2lldYY2lyXZDC4rWi3hmoLUobkgbQ==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [riscv64] + os: [linux] + libc: [musl] + + '@oxlint/binding-linux-s390x-gnu@1.72.0': + resolution: {integrity: sha512-rpGxph+FjjHcYI5q6uxB3Az+tnfmEnDbSA8+PK9ZE/VzyUAkvBOMeuY7ZQMhu5mpZH7YQDsTdW6Cx4kV/msc6w==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [s390x] + os: [linux] + libc: [glibc] + + '@oxlint/binding-linux-x64-gnu@1.72.0': + resolution: {integrity: sha512-WND+uhf/Ko13SLqQMWQUgsZuLvYYEvL0ZKgg0tgGYfLqxG7l8Ju123fHDMJyYSDl5E3bUbpFUuii/OvMreFQzw==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [x64] + os: [linux] + libc: [glibc] + + '@oxlint/binding-linux-x64-musl@1.72.0': + resolution: {integrity: sha512-SrpbrUL70nG9vh6zP4/oKHWgLuHquwsr7MW9XOn0olBVgh10Uqr8qscKhQoBGEn6olK/IUpn5GSKcdQ5AjUhGA==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [x64] + os: [linux] + libc: [musl] + + '@oxlint/binding-openharmony-arm64@1.72.0': + resolution: {integrity: sha512-qkrsEn6NmgFKr7U/QnezQMb+q/vzAy0Dd9Y95gQGQTyjzDLN+HRZMuM5u70iyH4nBLCfKBzhjMsYCehKay2jyg==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [arm64] + os: [openharmony] + + '@oxlint/binding-win32-arm64-msvc@1.72.0': + resolution: {integrity: sha512-LWR6ZlFZph+KPjXv8opgZsXRDCdrdQe8VL8Cg9zxCoBS73h6znzZpydVgmdnwj8mB9AuSM5jxEgDJDpQkjboeg==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [arm64] + os: [win32] + + '@oxlint/binding-win32-ia32-msvc@1.72.0': + resolution: {integrity: sha512-yt6HEh7IsHvtjRWtmeZRX134eaXKHq5Gnqlf1xBJdJl1JtdoRUEJw3nAxpZoUDS860cX/foKbztO441anVBtVQ==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [ia32] + os: [win32] + + '@oxlint/binding-win32-x64-msvc@1.72.0': + resolution: {integrity: sha512-b2eKFD2hX7tIwmo/cyH6TDq8vzWRZ2qNHrzoGntUTmq0h3zQh/uX3eTSHCwI8OB/ADQfJCRelLItK8BsxuucDA==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [x64] + os: [win32] + + '@rolldown/binding-android-arm64@1.1.3': + resolution: {integrity: sha512-DT6Z3PhvioeHMvxo+xHc3KtqggrI7CCTXCmC2h/5zUlp5jVitv7XEy+9q5/7v8IolhlioawpMo8Kg0EEBy7J0g==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [arm64] + os: [android] + + '@rolldown/binding-darwin-arm64@1.1.3': + resolution: {integrity: sha512-0NwgwsjM7LrsuVnXMK3koTpagBNOhloc/BNjKqZjv4V5zI5r13qx69uVhRx+o5Z0yy4Hzq+lpy7TAgUG/ocvrw==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [arm64] + os: [darwin] + + '@rolldown/binding-darwin-x64@1.1.3': + resolution: {integrity: sha512-YtiBp4disu6V560loT6PjMdiRaWmVvDNrUunAalbiFx2ggeJwxdAsgZMcoGP17uyAsTwAj5V1niksxlHnVQ1Sw==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [x64] + os: [darwin] + + '@rolldown/binding-freebsd-x64@1.1.3': + resolution: {integrity: sha512-yD3EkEdXk2LypPxnf/kSZHirarsI8gcPzc62SukhR9VJTyvV+F9Q/GxWNuCojc7sXyuVC4DxRGhdDK4X8VSsbw==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [x64] + os: [freebsd] + + '@rolldown/binding-linux-arm-gnueabihf@1.1.3': + resolution: {integrity: sha512-c+8vieQbsD7HNAHKIA34w0GJ9FedFFuJGD+7E6vz7Q3uqAIugL5p45fhlsj4UaAsHpcmlqugBWMhA0/j7o0sIg==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [arm] + os: [linux] + + '@rolldown/binding-linux-arm64-gnu@1.1.3': + resolution: {integrity: sha512-50jD0uUwLvur7Zz9LHz17kaAdTPjn5wN93hEgjvmYFRZwiR7ZJYovTd5ipyWJDAnXKvZ+wgc+/Ika6dwSF5OcA==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [arm64] + os: [linux] + libc: [glibc] + + '@rolldown/binding-linux-arm64-musl@1.1.3': + resolution: {integrity: sha512-BO9+oPL8K9poZJBfYPsXNtYjPE5uM3qeehT3aFcW4LITOl+iSqhp0abzjR2nWBUNjIZeKXjAEWBZ64WjNoHd6w==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [arm64] + os: [linux] + libc: [musl] + + '@rolldown/binding-linux-ppc64-gnu@1.1.3': + resolution: {integrity: sha512-f3VpLB1vQ0Eo6ecr/6cekLnvYMFF4YBFoVGkfkvPLq1bAkbAwHYQPZKoAmG6OJyTcxxoC+AvezGx/S1obNC0Mw==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [ppc64] + os: [linux] + libc: [glibc] + + '@rolldown/binding-linux-s390x-gnu@1.1.3': + resolution: {integrity: sha512-AmurZ26Pqx/RI9N1gzEOCklkKXl927yjfXWUUS0O7Puh8ARM/Ob8qfrD3qnWksScdw6cSrW5PSHE9DyLu7+PtA==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [s390x] + os: [linux] + libc: [glibc] + + '@rolldown/binding-linux-x64-gnu@1.1.3': + resolution: {integrity: sha512-JJpqs8bRGITDOdbkNKnlojzBabbOHrqjSvDr0IVsZObE1lBcPjxItUEY9eWIDbxaJ3cGrXPWGfGkIxFijg/URg==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [x64] + os: [linux] + libc: [glibc] + + '@rolldown/binding-linux-x64-musl@1.1.3': + resolution: {integrity: sha512-rSJcdjPxzA/by/6/rYs+v+bXU7UjvnbUWz8MJb6kh6+knqB1dCrtHg0uu7C/4haqJvqdkYHQ5IGn+tCH9GLW/g==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [x64] + os: [linux] + libc: [musl] + + '@rolldown/binding-openharmony-arm64@1.1.3': + resolution: {integrity: sha512-hQ3/PYkDJICgevvyNcVrihVeqq7k1Pp3VZ9lY+dauAYUJKO+auqApvANhvR1An9BhmqYKvW2Mu1F9u4DXSMLxQ==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [arm64] + os: [openharmony] + + '@rolldown/binding-wasm32-wasi@1.1.3': + resolution: {integrity: sha512-Elcv/BtML9lXrV6JuKITc/grN2kYV9gjsQpW8Jfw4ioK0TOkjBjye0nnyqQNy9STNaI20lXNaQBRrD5gSgR0Yg==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [wasm32] + + '@rolldown/binding-win32-arm64-msvc@1.1.3': + resolution: {integrity: sha512-2DrEfhluH9yhiaFApmsjsjwrSYbNcY1oFTzYSP1a535jDbV98zCFanA/96TBUd0iDFcxGmw9QRExwGCXz3U+/g==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [arm64] + os: [win32] + + '@rolldown/binding-win32-x64-msvc@1.1.3': + resolution: {integrity: sha512-OL4OMk7UPXOeVGGd3qo5zJyPIljf4AFgk5QAkPPS+OoLuOOozhuaQGC18MxVTnw/06q93gShAJzlwnSCY9YtqA==} + engines: {node: ^20.19.0 || >=22.12.0} + cpu: [x64] + os: [win32] + + '@rolldown/pluginutils@1.0.1': + resolution: {integrity: sha512-2j9bGt5Jh8hj+vPtgzPtl72j0yRxHAyumoo6TNfAjsLB04UtpSvPbPcDcBMxz7n+9CYB0c1GxQFxYRg2jimqGw==} + + '@tybys/wasm-util@0.10.3': + resolution: {integrity: sha512-F3fo1MYrRJYL3zER0OUOmkutjr1Vp23m7OsSgp7nq4SP6OqX6C/56XFIPAl5bt3zaBRjmW7SGz3u/6LwFpYcOg==} + + '@types/node@24.13.2': + resolution: {integrity: sha512-fRa09kZTgu8o71KFcDjUFuc7F+dEbZYZmkI0mg5YBTRs0yMKjYHsq/c0urDKeDb+D5qVgXOdFcuu+DZPKOITwA==} + + '@types/react-dom@19.2.3': + resolution: {integrity: sha512-jp2L/eY6fn+KgVVQAOqYItbF0VY/YApe5Mz2F0aykSO8gx31bYCZyvSeYxCHKvzHG5eZjc+zyaS5BrBWya2+kQ==} + peerDependencies: + '@types/react': ^19.2.0 + + '@types/react@19.2.17': + resolution: {integrity: sha512-MXfmqaVPEVgkBT/aY0aGCkRWWtByiYQXo3xdQ8r5RzuFrPiRn8Gar2tQdXSUQ2GKV3bkXckek89V8wQBY2Q/Aw==} + + '@vitejs/plugin-react@6.0.3': + resolution: {integrity: sha512-vmFvco5/QuC2f9Oj+wTk0+9XeDFkHxSamwZKYc7MxYwKICfvUvlMhqKI0VuICPltGqh1neqBKDvO4kes1ya8vg==} + engines: {node: ^20.19.0 || >=22.12.0} + peerDependencies: + '@rolldown/plugin-babel': ^0.1.7 || ^0.2.0 + babel-plugin-react-compiler: ^1.0.0 + vite: ^8.0.0 + peerDependenciesMeta: + '@rolldown/plugin-babel': + optional: true + babel-plugin-react-compiler: + optional: true + + bowser@2.14.1: + resolution: {integrity: sha512-tzPjzCxygAKWFOJP011oxFHs57HzIhOEracIgAePE4pqB3LikALKnSzUyU4MGs9/iCEUuHlAJTjTc5M+u7YEGg==} + + cookie@1.1.1: + resolution: {integrity: sha512-ei8Aos7ja0weRpFzJnEA9UHJ/7XQmqglbRwnf2ATjcB9Wq874VKH9kfjjirM6UhU2/E5fFYadylyhFldcqSidQ==} + engines: {node: '>=18'} + + csstype@3.2.3: + resolution: {integrity: sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==} + + detect-libc@2.1.2: + resolution: {integrity: sha512-Btj2BOOO83o3WyH59e8MgXsxEQVcarkUOpEYrubB0urwnN10yQ364rsiByU11nZlqWYZm05i/of7io4mzihBtQ==} + engines: {node: '>=8'} + + fdir@6.5.0: + resolution: {integrity: sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==} + engines: {node: '>=12.0.0'} + peerDependencies: + picomatch: ^3 || ^4 + peerDependenciesMeta: + picomatch: + optional: true + + fsevents@2.3.3: + resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==} + engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0} + os: [darwin] + + lightningcss-android-arm64@1.32.0: + resolution: {integrity: sha512-YK7/ClTt4kAK0vo6w3X+Pnm0D2cf2vPHbhOXdoNti1Ga0al1P4TBZhwjATvjNwLEBCnKvjJc2jQgHXH0NEwlAg==} + engines: {node: '>= 12.0.0'} + cpu: [arm64] + os: [android] + + lightningcss-darwin-arm64@1.32.0: + resolution: {integrity: sha512-RzeG9Ju5bag2Bv1/lwlVJvBE3q6TtXskdZLLCyfg5pt+HLz9BqlICO7LZM7VHNTTn/5PRhHFBSjk5lc4cmscPQ==} + engines: {node: '>= 12.0.0'} + cpu: [arm64] + os: [darwin] + + lightningcss-darwin-x64@1.32.0: + resolution: {integrity: sha512-U+QsBp2m/s2wqpUYT/6wnlagdZbtZdndSmut/NJqlCcMLTWp5muCrID+K5UJ6jqD2BFshejCYXniPDbNh73V8w==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [darwin] + + lightningcss-freebsd-x64@1.32.0: + resolution: {integrity: sha512-JCTigedEksZk3tHTTthnMdVfGf61Fky8Ji2E4YjUTEQX14xiy/lTzXnu1vwiZe3bYe0q+SpsSH/CTeDXK6WHig==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [freebsd] + + lightningcss-linux-arm-gnueabihf@1.32.0: + resolution: {integrity: sha512-x6rnnpRa2GL0zQOkt6rts3YDPzduLpWvwAF6EMhXFVZXD4tPrBkEFqzGowzCsIWsPjqSK+tyNEODUBXeeVHSkw==} + engines: {node: '>= 12.0.0'} + cpu: [arm] + os: [linux] + + lightningcss-linux-arm64-gnu@1.32.0: + resolution: {integrity: sha512-0nnMyoyOLRJXfbMOilaSRcLH3Jw5z9HDNGfT/gwCPgaDjnx0i8w7vBzFLFR1f6CMLKF8gVbebmkUN3fa/kQJpQ==} + engines: {node: '>= 12.0.0'} + cpu: [arm64] + os: [linux] + libc: [glibc] + + lightningcss-linux-arm64-musl@1.32.0: + resolution: {integrity: sha512-UpQkoenr4UJEzgVIYpI80lDFvRmPVg6oqboNHfoH4CQIfNA+HOrZ7Mo7KZP02dC6LjghPQJeBsvXhJod/wnIBg==} + engines: {node: '>= 12.0.0'} + cpu: [arm64] + os: [linux] + libc: [musl] + + lightningcss-linux-x64-gnu@1.32.0: + resolution: {integrity: sha512-V7Qr52IhZmdKPVr+Vtw8o+WLsQJYCTd8loIfpDaMRWGUZfBOYEJeyJIkqGIDMZPwPx24pUMfwSxxI8phr/MbOA==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [linux] + libc: [glibc] + + lightningcss-linux-x64-musl@1.32.0: + resolution: {integrity: sha512-bYcLp+Vb0awsiXg/80uCRezCYHNg1/l3mt0gzHnWV9XP1W5sKa5/TCdGWaR/zBM2PeF/HbsQv/j2URNOiVuxWg==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [linux] + libc: [musl] + + lightningcss-win32-arm64-msvc@1.32.0: + resolution: {integrity: sha512-8SbC8BR40pS6baCM8sbtYDSwEVQd4JlFTOlaD3gWGHfThTcABnNDBda6eTZeqbofalIJhFx0qKzgHJmcPTnGdw==} + engines: {node: '>= 12.0.0'} + cpu: [arm64] + os: [win32] + + lightningcss-win32-x64-msvc@1.32.0: + resolution: {integrity: sha512-Amq9B/SoZYdDi1kFrojnoqPLxYhQ4Wo5XiL8EVJrVsB8ARoC1PWW6VGtT0WKCemjy8aC+louJnjS7U18x3b06Q==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [win32] + + lightningcss@1.32.0: + resolution: {integrity: sha512-NXYBzinNrblfraPGyrbPoD19C1h9lfI/1mzgWYvXUTe414Gz/X1FD2XBZSZM7rRTrMA8JL3OtAaGifrIKhQ5yQ==} + engines: {node: '>= 12.0.0'} + + nanoid@3.3.15: + resolution: {integrity: sha512-y7Wygv/7mEOvxTuEQDB8StXdMRBWf1kR/tlhAzBRUFkB2jfcLOAxO/SHmOO2zgz1pVgK29/kyupn059/bCHdjA==} + engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1} + hasBin: true + + oxlint@1.72.0: + resolution: {integrity: sha512-1rhdZIP/EvoI91ABIwNU5Q8+bWf8mjrS5UzIOZld4d4bXxJvtlUhlQvaoTogIGin/qdErMOrwaIJvCSIAKTLhA==} + engines: {node: ^20.19.0 || >=22.12.0} + hasBin: true + peerDependencies: + oxlint-tsgolint: '>=0.22.1' + vite-plus: '*' + peerDependenciesMeta: + oxlint-tsgolint: + optional: true + vite-plus: + optional: true + + picocolors@1.1.1: + resolution: {integrity: sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==} + + picomatch@4.0.4: + resolution: {integrity: sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==} + engines: {node: '>=12'} + + postcss@8.5.16: + resolution: {integrity: sha512-vuwillviilfKZsg0VGj5R/YwwcHx4SLsIOI/7K6mQkWx+l5cUHTjj5g0AasTBcyXsbfTgrwsUNmVUb5xVwyPwg==} + engines: {node: ^10 || ^12 || >=14} + + react-dom@19.2.7: + resolution: {integrity: sha512-t0BRVXvbiE/o20Hfw669rLbMCDWtYZLvmJigy2f0MxsXF+71pxhR3xOkspmsO8h3ZlNzyibAmtCa3l4lYKk6gQ==} + peerDependencies: + react: ^19.2.7 + + react-router-dom@7.18.1: + resolution: {integrity: sha512-KaZh+X/6UtEp28x51AUYZDMg9NGoz2ja3dNHa+ta/tk40vCzKhQ/RypCWBMLbmDr6//E24Vv5uPsrqXFozdkAg==} + engines: {node: '>=20.0.0'} + peerDependencies: + react: '>=18' + react-dom: '>=18' + + react-router@7.18.1: + resolution: {integrity: sha512-GDLgg3i3uM0aeJO3Fm+TCS+sDQ7gu12T6x0qdTEzcwqEfleci7JwugVNIF3U//0FWKnJT7ptG+20B2jfDqnZAg==} + engines: {node: '>=20.0.0'} + peerDependencies: + react: '>=18' + react-dom: '>=18' + peerDependenciesMeta: + react-dom: + optional: true + + react@19.2.7: + resolution: {integrity: sha512-HNe9WslTbXmFK8o8cmwgAeJFSBvt1bPdHCVKtaaV+WlAN36mpT4hcRpwbf3fY56ar2oIXzsBpOAiIRHAdY0OlQ==} + engines: {node: '>=0.10.0'} + + rolldown@1.1.3: + resolution: {integrity: sha512-1F1eEtUBtFvcGm1HQ9TiUIUHPQG7mSAODrhIzjxoUEFuo8OcbrGLiVLkevNgj84TE4lnHvnumwFjhJO5Eu135g==} + engines: {node: ^20.19.0 || >=22.12.0} + hasBin: true + + scheduler@0.27.0: + resolution: {integrity: sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q==} + + set-cookie-parser@2.7.2: + resolution: {integrity: sha512-oeM1lpU/UvhTxw+g3cIfxXHyJRc/uidd3yK1P242gzHds0udQBYzs3y8j4gCCW+ZJ7ad0yctld8RYO+bdurlvw==} + + source-map-js@1.2.1: + resolution: {integrity: sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==} + engines: {node: '>=0.10.0'} + + tinyglobby@0.2.17: + resolution: {integrity: sha512-wXR/dYpcqKmfWpEdZjiKJOwCNFndD0DMnrW/cYjVGttEkBfVgcLFHoNrlj47mjOVic9yyNu65alsgF4NQyTa2g==} + engines: {node: '>=12.0.0'} + + tslib@2.8.1: + resolution: {integrity: sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==} + + typescript@6.0.3: + resolution: {integrity: sha512-y2TvuxSZPDyQakkFRPZHKFm+KKVqIisdg9/CZwm9ftvKXLP8NRWj38/ODjNbr43SsoXqNuAisEf1GdCxqWcdBw==} + engines: {node: '>=14.17'} + hasBin: true + + undici-types@7.18.2: + resolution: {integrity: sha512-AsuCzffGHJybSaRrmr5eHr81mwJU3kjw6M+uprWvCXiNeN9SOGwQ3Jn8jb8m3Z6izVgknn1R0FTCEAP2QrLY/w==} + + vite@8.1.2: + resolution: {integrity: sha512-6YYPbRXTxx6bRXmOn7XdnQAy5DQNHhDgtjhDHI13oe4pY93kkcdGJWxpGwOm++/Wh0QpQhDrpIoVMrmrsI5AGQ==} + engines: {node: ^20.19.0 || >=22.12.0} + hasBin: true + peerDependencies: + '@types/node': ^20.19.0 || >=22.12.0 + '@vitejs/devtools': ^0.3.0 + esbuild: ^0.27.0 || ^0.28.0 + jiti: '>=1.21.0' + less: ^4.0.0 + sass: ^1.70.0 + sass-embedded: ^1.70.0 + stylus: '>=0.54.8' + sugarss: ^5.0.0 + terser: ^5.16.0 + tsx: ^4.8.1 + yaml: ^2.4.2 + peerDependenciesMeta: + '@types/node': + optional: true + '@vitejs/devtools': + optional: true + esbuild: + optional: true + jiti: + optional: true + less: + optional: true + sass: + optional: true + sass-embedded: + optional: true + stylus: + optional: true + sugarss: + optional: true + terser: + optional: true + tsx: + optional: true + yaml: + optional: true + +snapshots: + + '@emnapi/core@1.11.1': + dependencies: + '@emnapi/wasi-threads': 1.2.2 + tslib: 2.8.1 + optional: true + + '@emnapi/runtime@1.11.1': + dependencies: + tslib: 2.8.1 + optional: true + + '@emnapi/wasi-threads@1.2.2': + dependencies: + tslib: 2.8.1 + optional: true + + '@napi-rs/wasm-runtime@1.1.6(@emnapi/core@1.11.1)(@emnapi/runtime@1.11.1)': + dependencies: + '@emnapi/core': 1.11.1 + '@emnapi/runtime': 1.11.1 + '@tybys/wasm-util': 0.10.3 + optional: true + + '@oxc-project/types@0.137.0': {} + + '@oxlint/binding-android-arm-eabi@1.72.0': + optional: true + + '@oxlint/binding-android-arm64@1.72.0': + optional: true + + '@oxlint/binding-darwin-arm64@1.72.0': + optional: true + + '@oxlint/binding-darwin-x64@1.72.0': + optional: true + + '@oxlint/binding-freebsd-x64@1.72.0': + optional: true + + '@oxlint/binding-linux-arm-gnueabihf@1.72.0': + optional: true + + '@oxlint/binding-linux-arm-musleabihf@1.72.0': + optional: true + + '@oxlint/binding-linux-arm64-gnu@1.72.0': + optional: true + + '@oxlint/binding-linux-arm64-musl@1.72.0': + optional: true + + '@oxlint/binding-linux-ppc64-gnu@1.72.0': + optional: true + + '@oxlint/binding-linux-riscv64-gnu@1.72.0': + optional: true + + '@oxlint/binding-linux-riscv64-musl@1.72.0': + optional: true + + '@oxlint/binding-linux-s390x-gnu@1.72.0': + optional: true + + '@oxlint/binding-linux-x64-gnu@1.72.0': + optional: true + + '@oxlint/binding-linux-x64-musl@1.72.0': + optional: true + + '@oxlint/binding-openharmony-arm64@1.72.0': + optional: true + + '@oxlint/binding-win32-arm64-msvc@1.72.0': + optional: true + + '@oxlint/binding-win32-ia32-msvc@1.72.0': + optional: true + + '@oxlint/binding-win32-x64-msvc@1.72.0': + optional: true + + '@rolldown/binding-android-arm64@1.1.3': + optional: true + + '@rolldown/binding-darwin-arm64@1.1.3': + optional: true + + '@rolldown/binding-darwin-x64@1.1.3': + optional: true + + '@rolldown/binding-freebsd-x64@1.1.3': + optional: true + + '@rolldown/binding-linux-arm-gnueabihf@1.1.3': + optional: true + + '@rolldown/binding-linux-arm64-gnu@1.1.3': + optional: true + + '@rolldown/binding-linux-arm64-musl@1.1.3': + optional: true + + '@rolldown/binding-linux-ppc64-gnu@1.1.3': + optional: true + + '@rolldown/binding-linux-s390x-gnu@1.1.3': + optional: true + + '@rolldown/binding-linux-x64-gnu@1.1.3': + optional: true + + '@rolldown/binding-linux-x64-musl@1.1.3': + optional: true + + '@rolldown/binding-openharmony-arm64@1.1.3': + optional: true + + '@rolldown/binding-wasm32-wasi@1.1.3': + dependencies: + '@emnapi/core': 1.11.1 + '@emnapi/runtime': 1.11.1 + '@napi-rs/wasm-runtime': 1.1.6(@emnapi/core@1.11.1)(@emnapi/runtime@1.11.1) + optional: true + + '@rolldown/binding-win32-arm64-msvc@1.1.3': + optional: true + + '@rolldown/binding-win32-x64-msvc@1.1.3': + optional: true + + '@rolldown/pluginutils@1.0.1': {} + + '@tybys/wasm-util@0.10.3': + dependencies: + tslib: 2.8.1 + optional: true + + '@types/node@24.13.2': + dependencies: + undici-types: 7.18.2 + + '@types/react-dom@19.2.3(@types/react@19.2.17)': + dependencies: + '@types/react': 19.2.17 + + '@types/react@19.2.17': + dependencies: + csstype: 3.2.3 + + '@vitejs/plugin-react@6.0.3(vite@8.1.2(@types/node@24.13.2))': + dependencies: + '@rolldown/pluginutils': 1.0.1 + vite: 8.1.2(@types/node@24.13.2) + + bowser@2.14.1: {} + + cookie@1.1.1: {} + + csstype@3.2.3: {} + + detect-libc@2.1.2: {} + + fdir@6.5.0(picomatch@4.0.4): + optionalDependencies: + picomatch: 4.0.4 + + fsevents@2.3.3: + optional: true + + lightningcss-android-arm64@1.32.0: + optional: true + + lightningcss-darwin-arm64@1.32.0: + optional: true + + lightningcss-darwin-x64@1.32.0: + optional: true + + lightningcss-freebsd-x64@1.32.0: + optional: true + + lightningcss-linux-arm-gnueabihf@1.32.0: + optional: true + + lightningcss-linux-arm64-gnu@1.32.0: + optional: true + + lightningcss-linux-arm64-musl@1.32.0: + optional: true + + lightningcss-linux-x64-gnu@1.32.0: + optional: true + + lightningcss-linux-x64-musl@1.32.0: + optional: true + + lightningcss-win32-arm64-msvc@1.32.0: + optional: true + + lightningcss-win32-x64-msvc@1.32.0: + optional: true + + lightningcss@1.32.0: + dependencies: + detect-libc: 2.1.2 + optionalDependencies: + lightningcss-android-arm64: 1.32.0 + lightningcss-darwin-arm64: 1.32.0 + lightningcss-darwin-x64: 1.32.0 + lightningcss-freebsd-x64: 1.32.0 + lightningcss-linux-arm-gnueabihf: 1.32.0 + lightningcss-linux-arm64-gnu: 1.32.0 + lightningcss-linux-arm64-musl: 1.32.0 + lightningcss-linux-x64-gnu: 1.32.0 + lightningcss-linux-x64-musl: 1.32.0 + lightningcss-win32-arm64-msvc: 1.32.0 + lightningcss-win32-x64-msvc: 1.32.0 + + nanoid@3.3.15: {} + + oxlint@1.72.0: + optionalDependencies: + '@oxlint/binding-android-arm-eabi': 1.72.0 + '@oxlint/binding-android-arm64': 1.72.0 + '@oxlint/binding-darwin-arm64': 1.72.0 + '@oxlint/binding-darwin-x64': 1.72.0 + '@oxlint/binding-freebsd-x64': 1.72.0 + '@oxlint/binding-linux-arm-gnueabihf': 1.72.0 + '@oxlint/binding-linux-arm-musleabihf': 1.72.0 + '@oxlint/binding-linux-arm64-gnu': 1.72.0 + '@oxlint/binding-linux-arm64-musl': 1.72.0 + '@oxlint/binding-linux-ppc64-gnu': 1.72.0 + '@oxlint/binding-linux-riscv64-gnu': 1.72.0 + '@oxlint/binding-linux-riscv64-musl': 1.72.0 + '@oxlint/binding-linux-s390x-gnu': 1.72.0 + '@oxlint/binding-linux-x64-gnu': 1.72.0 + '@oxlint/binding-linux-x64-musl': 1.72.0 + '@oxlint/binding-openharmony-arm64': 1.72.0 + '@oxlint/binding-win32-arm64-msvc': 1.72.0 + '@oxlint/binding-win32-ia32-msvc': 1.72.0 + '@oxlint/binding-win32-x64-msvc': 1.72.0 + + picocolors@1.1.1: {} + + picomatch@4.0.4: {} + + postcss@8.5.16: + dependencies: + nanoid: 3.3.15 + picocolors: 1.1.1 + source-map-js: 1.2.1 + + react-dom@19.2.7(react@19.2.7): + dependencies: + react: 19.2.7 + scheduler: 0.27.0 + + react-router-dom@7.18.1(react-dom@19.2.7(react@19.2.7))(react@19.2.7): + dependencies: + react: 19.2.7 + react-dom: 19.2.7(react@19.2.7) + react-router: 7.18.1(react-dom@19.2.7(react@19.2.7))(react@19.2.7) + + react-router@7.18.1(react-dom@19.2.7(react@19.2.7))(react@19.2.7): + dependencies: + cookie: 1.1.1 + react: 19.2.7 + set-cookie-parser: 2.7.2 + optionalDependencies: + react-dom: 19.2.7(react@19.2.7) + + react@19.2.7: {} + + rolldown@1.1.3: + dependencies: + '@oxc-project/types': 0.137.0 + '@rolldown/pluginutils': 1.0.1 + optionalDependencies: + '@rolldown/binding-android-arm64': 1.1.3 + '@rolldown/binding-darwin-arm64': 1.1.3 + '@rolldown/binding-darwin-x64': 1.1.3 + '@rolldown/binding-freebsd-x64': 1.1.3 + '@rolldown/binding-linux-arm-gnueabihf': 1.1.3 + '@rolldown/binding-linux-arm64-gnu': 1.1.3 + '@rolldown/binding-linux-arm64-musl': 1.1.3 + '@rolldown/binding-linux-ppc64-gnu': 1.1.3 + '@rolldown/binding-linux-s390x-gnu': 1.1.3 + '@rolldown/binding-linux-x64-gnu': 1.1.3 + '@rolldown/binding-linux-x64-musl': 1.1.3 + '@rolldown/binding-openharmony-arm64': 1.1.3 + '@rolldown/binding-wasm32-wasi': 1.1.3 + '@rolldown/binding-win32-arm64-msvc': 1.1.3 + '@rolldown/binding-win32-x64-msvc': 1.1.3 + + scheduler@0.27.0: {} + + set-cookie-parser@2.7.2: {} + + source-map-js@1.2.1: {} + + tinyglobby@0.2.17: + dependencies: + fdir: 6.5.0(picomatch@4.0.4) + picomatch: 4.0.4 + + tslib@2.8.1: + optional: true + + typescript@6.0.3: {} + + undici-types@7.18.2: {} + + vite@8.1.2(@types/node@24.13.2): + dependencies: + lightningcss: 1.32.0 + picomatch: 4.0.4 + postcss: 8.5.16 + rolldown: 1.1.3 + tinyglobby: 0.2.17 + optionalDependencies: + '@types/node': 24.13.2 + fsevents: 2.3.3 diff --git a/public/favicon.svg b/public/favicon.svg new file mode 100644 index 0000000..6893eb1 --- /dev/null +++ b/public/favicon.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/icons.svg b/public/icons.svg new file mode 100644 index 0000000..e952219 --- /dev/null +++ b/public/icons.svg @@ -0,0 +1,24 @@ + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/images/pay-result/pay-fail.png b/public/images/pay-result/pay-fail.png new file mode 100644 index 0000000..7d5d5c0 Binary files /dev/null and b/public/images/pay-result/pay-fail.png differ diff --git a/public/images/pay-result/pay-success.png b/public/images/pay-result/pay-success.png new file mode 100644 index 0000000..e616e95 Binary files /dev/null and b/public/images/pay-result/pay-success.png differ diff --git a/public/images/pay/header-bg.png b/public/images/pay/header-bg.png new file mode 100644 index 0000000..f2ae1f7 Binary files /dev/null and b/public/images/pay/header-bg.png differ diff --git a/public/images/pay/icon-alipay.png b/public/images/pay/icon-alipay.png new file mode 100644 index 0000000..654ed6f Binary files /dev/null and b/public/images/pay/icon-alipay.png differ diff --git a/public/images/pay/icon-check-footer.png b/public/images/pay/icon-check-footer.png new file mode 100644 index 0000000..00b8fc4 Binary files /dev/null and b/public/images/pay/icon-check-footer.png differ diff --git a/public/images/pay/icon-checked.png b/public/images/pay/icon-checked.png new file mode 100644 index 0000000..b15f092 Binary files /dev/null and b/public/images/pay/icon-checked.png differ diff --git a/public/images/pay/icon-concat.png b/public/images/pay/icon-concat.png new file mode 100644 index 0000000..d3fa31e Binary files /dev/null and b/public/images/pay/icon-concat.png differ diff --git a/public/images/pay/icon-uncheck.png b/public/images/pay/icon-uncheck.png new file mode 100644 index 0000000..a538083 Binary files /dev/null and b/public/images/pay/icon-uncheck.png differ diff --git a/public/images/pay/icon-wechatpay.png b/public/images/pay/icon-wechatpay.png new file mode 100644 index 0000000..455de1b Binary files /dev/null and b/public/images/pay/icon-wechatpay.png differ diff --git a/public/images/wechat-double/bg.png b/public/images/wechat-double/bg.png new file mode 100644 index 0000000..d4acc0e Binary files /dev/null and b/public/images/wechat-double/bg.png differ diff --git a/public/images/wechat-double/icon-concat.png b/public/images/wechat-double/icon-concat.png new file mode 100644 index 0000000..1e032e5 Binary files /dev/null and b/public/images/wechat-double/icon-concat.png differ diff --git a/public/images/wechat-double/icon-minus.png b/public/images/wechat-double/icon-minus.png new file mode 100644 index 0000000..fc47a62 Binary files /dev/null and b/public/images/wechat-double/icon-minus.png differ diff --git a/public/images/wechat-double/icon-safe.png b/public/images/wechat-double/icon-safe.png new file mode 100644 index 0000000..876a786 Binary files /dev/null and b/public/images/wechat-double/icon-safe.png differ diff --git a/public/images/wechat-double/line-left.png b/public/images/wechat-double/line-left.png new file mode 100644 index 0000000..0f95cb3 Binary files /dev/null and b/public/images/wechat-double/line-left.png differ diff --git a/public/images/wechat-double/line-right.png b/public/images/wechat-double/line-right.png new file mode 100644 index 0000000..839ea38 Binary files /dev/null and b/public/images/wechat-double/line-right.png differ diff --git a/public/images/wechat-double/step1-side.png b/public/images/wechat-double/step1-side.png new file mode 100644 index 0000000..12add8e Binary files /dev/null and b/public/images/wechat-double/step1-side.png differ diff --git a/public/images/wechat-double/step2-side.png b/public/images/wechat-double/step2-side.png new file mode 100644 index 0000000..8f1647e Binary files /dev/null and b/public/images/wechat-double/step2-side.png differ diff --git a/src/App.css b/src/App.css new file mode 100644 index 0000000..ea4a2d3 --- /dev/null +++ b/src/App.css @@ -0,0 +1,50 @@ +.page-shell { + min-height: 100svh; + display: flex; + align-items: center; + justify-content: center; + padding: 24px; + box-sizing: border-box; +} + +.placeholder-card { + width: min(100%, 520px); + padding: 32px; + border: 1px solid var(--border); + border-radius: 24px; + background: var(--panel-bg); + box-shadow: var(--shadow); + text-align: left; +} + +.placeholder-path { + display: inline-flex; + margin-bottom: 20px; + padding: 6px 12px; + border-radius: 999px; + border: 1px solid var(--accent-border); + background: var(--accent-bg); + color: var(--text-h); + font-family: var(--mono); + font-size: 14px; +} + +.placeholder-card h1 { + margin: 0 0 12px; +} + +.placeholder-card p { + font-size: 16px; + line-height: 1.7; +} + +@media (max-width: 640px) { + .page-shell { + padding: 16px; + } + + .placeholder-card { + padding: 24px; + border-radius: 20px; + } +} diff --git a/src/App.tsx b/src/App.tsx new file mode 100644 index 0000000..b3a3476 --- /dev/null +++ b/src/App.tsx @@ -0,0 +1,57 @@ +import { Navigate, Route, Routes, useNavigate, useSearchParams } from 'react-router-dom' +import './App.css' +import { useEffect, useState } from 'react' +import PayPage from './pages/PayPage.tsx' +import PayResultPage from './pages/PayResultPage.tsx' +import Twins from './pages/Twins.tsx' +import PlaceholderPage from './components/PlaceholderPage.tsx' + +// http://localhost:5173?token=c3f52a99-c519-427a-af05-364c5f3e59cc +function App() { + const [isConfigReady, setIsConfigReady] = useState(false) + const [searchParams] = useSearchParams() + const navigate = useNavigate() + const [initialToken] = useState(() => searchParams.get('token')) + + useEffect(() => { + let isMounted = true + + async function initConfig() { + if (initialToken) { + window.localStorage.setItem('token', initialToken || '') + } else if(!window.localStorage.getItem('token')) { + navigate('/404', { replace: true }) + } + + if (isMounted) { + setIsConfigReady(true) + } + } + + initConfig() + + return () => { + isMounted = false + } + }, [initialToken, navigate]) + + if (!isConfigReady) { + return null; + } + + return ( + + } /> + } /> + } /> + } /> + } + /> + } /> + + ) +} + +export default App diff --git a/src/api/pay.ts b/src/api/pay.ts new file mode 100644 index 0000000..a0309c4 --- /dev/null +++ b/src/api/pay.ts @@ -0,0 +1,49 @@ +import { get, post, type ApiResponse } from '../utils/request' + +export type GoodsItem = { + checked: boolean + goods_id: string + goods_name: string + origin_price: string + pay_type: string + price: string + sign_value: string + weixinMpOriId: string +} + +export type OrderPayload = Record & { + goods_id: string + pay_type: string + source: string + pay_source: string + extra: Record +} + +export type OrderResult = { + appId?: string + orderId?: string + outTradeNo?: string + payFee?: string + payParam?: string + payType?: string + unifyOrderId?: string +} + +export type OrderStatus = { + status?: string + [key: string]: unknown +} + +// goods +export function getGoods() { + return get>('/api/order/goods') +} + +// order +export function order(payload: OrderPayload) { + return post>('/api/order', payload) +} + +export function checkOrder(orderId: string) { + return get>('/api/order', { order_id: orderId }) +} diff --git a/src/api/user.ts b/src/api/user.ts new file mode 100644 index 0000000..118b88a --- /dev/null +++ b/src/api/user.ts @@ -0,0 +1,11 @@ +import { get, type ApiResponse } from '../utils/request' + +export type UserConfig = { + token?: string + [key: string]: unknown +} + +// goods +export function getConfig() { + return get>('/api/user/config') +} diff --git a/src/assets/hero.png b/src/assets/hero.png new file mode 100644 index 0000000..02251f4 Binary files /dev/null and b/src/assets/hero.png differ diff --git a/src/assets/react.svg b/src/assets/react.svg new file mode 100644 index 0000000..6c87de9 --- /dev/null +++ b/src/assets/react.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/vite.svg b/src/assets/vite.svg new file mode 100644 index 0000000..5101b67 --- /dev/null +++ b/src/assets/vite.svg @@ -0,0 +1 @@ +Vite diff --git a/src/components/PlaceholderPage.tsx b/src/components/PlaceholderPage.tsx new file mode 100644 index 0000000..41e8ec1 --- /dev/null +++ b/src/components/PlaceholderPage.tsx @@ -0,0 +1,19 @@ +type PlaceholderPageProps = { + path: string + title: string + description: string +} + +function PlaceholderPage({ path, title, description }: PlaceholderPageProps) { + return ( +
+
+ {path} +

{title}

+

{description}

+
+
+ ) +} + +export default PlaceholderPage diff --git a/src/index.css b/src/index.css new file mode 100644 index 0000000..5e989ea --- /dev/null +++ b/src/index.css @@ -0,0 +1,710 @@ +:root { + --text: #6b6375; + --text-h: #08060d; + --bg: #fff; + --panel-bg: rgba(255, 255, 255, 0.88); + --border: #e5e4e7; + --code-bg: #f4f3ec; + --accent: #aa3bff; + --accent-bg: rgba(170, 59, 255, 0.1); + --accent-border: rgba(170, 59, 255, 0.5); + --social-bg: rgba(244, 243, 236, 0.5); + --shadow: + rgba(0, 0, 0, 0.1) 0 10px 15px -3px, rgba(0, 0, 0, 0.05) 0 4px 6px -2px; + + --sans: system-ui, 'Segoe UI', Roboto, sans-serif; + --heading: system-ui, 'Segoe UI', Roboto, sans-serif; + --mono: ui-monospace, Consolas, monospace; + + font: 18px/145% var(--sans); + letter-spacing: 0.18px; + color-scheme: light dark; + color: var(--text); + background: var(--bg); + font-synthesis: none; + text-rendering: optimizeLegibility; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + + @media (max-width: 1024px) { + font-size: 16px; + } +} + +* { + box-sizing: border-box; + margin: 0; + padding: 0; +} + +@media (prefers-color-scheme: dark) { + :root { + --text: #9ca3af; + --text-h: #f3f4f6; + --bg: #16171d; + --panel-bg: rgba(31, 32, 40, 0.88); + --border: #2e303a; + --code-bg: #1f2028; + --accent: #c084fc; + --accent-bg: rgba(192, 132, 252, 0.15); + --accent-border: rgba(192, 132, 252, 0.5); + --social-bg: rgba(47, 48, 58, 0.5); + --shadow: + rgba(0, 0, 0, 0.4) 0 10px 15px -3px, rgba(0, 0, 0, 0.25) 0 4px 6px -2px; + } +} + +#root { + min-height: 100svh; +} + +body { + margin: 0; + min-width: 320px; + background: + radial-gradient(circle at top, rgba(170, 59, 255, 0.12), transparent 35%), + var(--bg); +} + +h1, +h2 { + font-family: var(--heading); + font-weight: 500; + color: var(--text-h); +} + +h1 { + font-size: 56px; + letter-spacing: -1.68px; + margin: 32px 0; + + @media (max-width: 1024px) { + font-size: 36px; + margin: 20px 0; + } +} + +h2 { + font-size: 24px; + line-height: 118%; + letter-spacing: -0.24px; + margin: 0 0 8px; + + @media (max-width: 1024px) { + font-size: 20px; + } +} + +p { + margin: 0; +} + + +#PayPage { + min-height: 100svh; + padding-bottom: 84px; + + .header { + width: 100%; + height: 248px; + background: url('./images/pay/header-bg.png') no-repeat; + background-size: 100% 100%; + padding: 0 16px; + display: flex; + flex-direction: column; + + .tips { + padding-top: 44px; + + .tip { + height: 20px; + background: #CDF6E0; + border-radius: 6px 6px 6px 6px; + padding: 3px 10px; + width: 70px; + height: 14px; + font-family: PingFang SC, PingFang SC; + font-weight: 500; + font-size: 10px; + color: #07994D; + line-height: 14px; + text-align: left; + font-style: normal; + text-transform: none; + } + + .date { + margin-left: 6px; + width: 84px; + height: 14px; + font-family: PingFang SC, PingFang SC; + font-weight: 400; + font-size: 10px; + color: #222222; + line-height: 14px; + text-align: left; + font-style: normal; + text-transform: none; + } + } + + .title { + margin-top: 14px; + height: 34px; + font-family: PingFang SC, PingFang SC; + font-weight: 600; + font-size: 26px; + color: #222222; + line-height: 34px; + text-align: left; + font-style: normal; + text-transform: none; + + .lock { + color: #00B85C; + } + } + } + + .plan { + position: relative; + width: 100%; + height: 162px; + margin-top: -62px; + overflow: hidden; + touch-action: pan-y; + user-select: none; + -webkit-user-select: none; + + .plan-track { + position: relative; + width: min(100%, 360px); + height: 100%; + margin: 0 auto; + } + + .plan-item { + position: absolute; + top: 18px; + left: 50%; + width: 98px; + height: 118px; + background: #FFFFFF; + box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.1); + border: 1px solid transparent; + border-radius: 8px 8px 8px 8px; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + gap: 6px; + padding: 0; + appearance: none; + cursor: pointer; + transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1), opacity 320ms ease, box-shadow 320ms ease, background-color 320ms ease, border-color 320ms ease; + transform: translateX(-50%); + opacity: 0.58; + z-index: 1; + + .plan-price-symbol { + font-size: 10px; + transition: color 320ms ease; + } + + .plan-name { + font-family: PingFang SC, PingFang SC; + font-weight: 400; + font-size: 14px; + color: #222222; + line-height: 20px; + text-align: left; + font-style: normal; + text-transform: none; + margin-bottom: 7px; + transition: color 320ms ease, font-size 320ms ease, font-weight 320ms ease, line-height 320ms ease; + } + + .plan-price { + font-family: D-DIN-PRO, D-DIN-PRO; + font-weight: 500; + font-size: 22px; + color: #222222; + line-height: 26px; + text-align: left; + font-style: normal; + text-transform: none; + transition: color 320ms ease, font-size 320ms ease, font-weight 320ms ease, line-height 320ms ease; + } + + .plan-origin-price { + font-family: PingFang SC, PingFang SC; + font-weight: 400; + font-size: 12px; + color: #999999; + line-height: 16px; + text-align: center; + font-style: normal; + text-decoration-line: line-through; + text-transform: none; + transition: color 320ms ease, font-size 320ms ease, line-height 320ms ease; + } + } + + .plan-item.is-left { + transform: translateX(calc(-50% - 122px)); + opacity: 0.74; + z-index: 1; + } + + .plan-item.is-right { + transform: translateX(calc(-50% + 122px)); + opacity: 0.74; + z-index: 1; + } + + .plan-item.selected { + top: 7px; + width: 120px; + height: 140px; + background: #F7FEFA; + box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); + border-color: #00B85C; + transform: translateX(-50%); + opacity: 1; + z-index: 2; + + .plan-price-symbol { + font-size: 10px; + color: #FF2D2D; + + } + + .plan-name { + font-weight: 500; + font-size: 18px; + color: #00B85C; + line-height: 26px; + } + + .plan-price { + font-weight: 600; + font-size: 28px; + color: #FF2D2D; + line-height: 32px; + } + + .plan-origin-price { + font-weight: 400; + font-size: 13px; + color: #A2A2A2; + line-height: 16px; + } + } + } + + .pay-method { + padding: 0 16px; + + .pay-method-title { + font-family: PingFang SC, PingFang SC; + font-weight: 500; + font-size: 14px; + color: #222222; + line-height: 20px; + text-align: left; + font-style: normal; + text-transform: none; + margin-bottom: 16px; + } + + .pay-method-list { + display: flex; + flex-direction: column; + border-radius: 8px; + box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.1); + + .pay-method-item { + height: 60px; + border-radius: 0px 0px 0px 0px; + display: flex; + flex-direction: row; + align-items: center; + justify-content: space-between; + padding: 0 12px; + } + + .pay-method-item:first-child { + border-bottom: 1px solid #E5E4E7; + } + + .pay-method-info { + display: flex; + flex-direction: row; + gap: 10px; + } + + .pay-method-icon { + width: 26px; + height: 26px; + } + + .pay-method-name { + font-family: PingFang SC, PingFang SC; + font-weight: normal; + font-size: 16px; + color: #1A1A1A; + line-height: 22px; + text-align: left; + font-style: normal; + text-transform: none; + } + + .pay-method-selected-icon { + width: 18px; + height: 18px; + } + } + } + + .pay-button { + position: fixed; + left: 16px; + right: 16px; + bottom: 6px; + width: calc(100% - 32px); + max-width: 343px; + height: 52px; + margin: 0 auto; + display: flex; + align-items: center; + justify-content: center; + background: #00B85C; + border: none; + border-radius: 921px 921px 921px 921px; + box-shadow: 0px 10px 24px 0px rgba(0, 184, 92, 0.24); + font-family: PingFang SC, PingFang SC; + font-weight: 500; + font-size: 17px; + color: #FFFFFF; + line-height: 24px; + text-align: center; + font-style: normal; + text-transform: none; + cursor: pointer; + transition: opacity 220ms ease, transform 220ms ease, box-shadow 220ms ease; + } + + .pay-button:active { + transform: scale(0.98); + } + + .pay-button:disabled { + opacity: 0.72; + cursor: not-allowed; + box-shadow: none; + } + + .contact-us { + position: absolute; + right: 15px; + bottom: 95px; + width: 50px; + height: 50px; + background: #FFFFFF; + box-shadow: 0px 0px 11px 0px rgba(0, 150, 75, 0.2); + border: 1px solid #00B85C; + border-radius: 50%; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + + img { + width: 20px; + height: 20px; + } + + span { + font-family: PingFang SC, PingFang SC; + font-weight: 400; + font-size: 10px; + color: #222222; + line-height: 14px; + text-align: justify; + font-style: normal; + text-transform: none; + } + } +} + +#PayResultPage { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + gap: 70px; + + .result { + margin-top: 80px; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + gap: 26px; + + img { + width: 96px; + height: 96px; + } + + .result-title { + font-family: PingFang SC, PingFang SC; + font-weight: 400; + font-size: 18px; + color: #1A1A1A; + line-height: 26px; + text-align: center; + font-style: normal; + text-transform: none; + } + } + + .btn { + border: none; + width: 158px; + height: 52px; + background: #E7E7E7; + border-radius: 921px 921px 921px 921px; + + font-family: PingFang SC, PingFang SC; + font-weight: 400; + font-size: 17px; + color: #666666; + line-height: 24px; + text-align: center; + font-style: normal; + text-transform: none; + } + + .failed-btn { + background: #00B85C; + color: #FFFFFF; + } + +} + +#Twins { + height: 100svh; + .header { + height: 248px; + background: url('./images/app-twins/bg.png') no-repeat; + background-size: 100% 100%; + padding: 30px 16px; + + .row-1 { + font-family: Alimama ShuHeiTi, Alimama ShuHeiTi; + font-weight: 700; + font-size: 26px; + color: #222222; + line-height: 32px; + text-align: left; + font-style: normal; + text-transform: none; + + + } + + .row-2 { + font-family: PingFang SC, PingFang SC; + font-weight: 400; + font-size: 14px; + color: #222222; + line-height: 20px; + text-align: left; + font-style: normal; + text-transform: none; + margin-top: 8px; + margin-bottom: 16px; + } + + .row-3 { + display: flex; + flex-direction: row; + align-items: center; + gap: 16px; + + .item { + display: flex; + flex-direction: row; + align-items: center; + gap: 6px; + } + + img { + width: 18px; + height: 18px; + } + + span { + font-family: PingFang SC, PingFang SC; + font-weight: 400; + font-size: 13px; + color: #46524C; + line-height: 18px; + text-align: left; + font-style: normal; + text-transform: none; + } + } + } + + .card { + height: calc(100dvh - 178px); + padding: 20px 16px; + border-radius: 30px 30px 0px 0px; + background: #FFFFFF; + overflow: hidden; + margin-top: -85px; + + .card-title { + font-family: PingFang SC, PingFang SC; + font-weight: 500; + font-size: 18px; + color: #222222; + line-height: 26px; + text-align: left; + font-style: normal; + text-transform: none; + display: flex; + flex-direction: row; + align-items: center; + gap: 10px; + + img { + width: 56px; + height: 10px; + } + } + + .card-steps { + margin-top: 20px; + display: flex; + flex-direction: column; + gap: 20px; + + .step-item { + height: 210px; + background: #FFFFFF; + border-radius: 12px 12px 12px 12px; + box-shadow: 0px 0px 10px 0px rgba(0, 150, 75, 0.2); + background-size: 100% 100%; + background-repeat: no-repeat; + background-position: center; + padding: 14px 12px; + display: flex; + flex-direction: column; + gap: 10px; + + .step-item-label { + width: 52px; + height: 22px; + border-radius: 3px 3px 3px 3px; + border: 1px solid #00B85C; + display: inline-flex; + align-items: center; + justify-content: center; + + font-family: PingFang SC, PingFang SC; + font-weight: 500; + font-size: 12px; + color: #00B85C; + line-height: 16px; + text-align: left; + font-style: normal; + text-transform: none; + } + + .step-item-title { + font-family: PingFang SC, PingFang SC; + font-weight: 600; + font-size: 16px; + color: #222222; + line-height: 22px; + text-align: left; + font-style: normal; + text-transform: none; + } + + .step-item-desc { + width: 53.29%; + font-family: PingFang SC, PingFang SC; + font-weight: 400; + font-size: 13px; + color: #666666; + line-height: 20px; + text-align: left; + font-style: normal; + text-transform: none; + } + + .step-item-link { + width: 136px; + height: 32px; + background: #00B85C; + border-radius: 117px 117px 117px 117px; + display: inline-flex; + align-items: center; + justify-content: center; + text-decoration: none; + + font-family: PingFang SC, PingFang SC; + font-weight: 500; + font-size: 14px; + color: #FFFFFF; + line-height: 20px; + text-align: left; + font-style: normal; + text-transform: none; + } + } + + } + + .contact-us { + width: 115px; + height: 54px; + background: #FFFFFF; + box-shadow: 0px 0px 10px 0px rgba(0, 150, 75, 0.2); + border-radius: 11px 11px 11px 11px; + border: 1px solid #07994D; + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + gap: 6px; + position: absolute; + right: 10px; + bottom: 17px; + + img { + width: 26px; + height: 26px; + } + + span { + font-family: PingFang SC, PingFang SC; + font-weight: 500; + font-size: 14px; + color: #00B85C; + line-height: 20px; + text-align: center; + font-style: normal; + text-transform: none; + } + } + } +} + +.green { + color: #00B85C; +} \ No newline at end of file diff --git a/src/main.tsx b/src/main.tsx new file mode 100644 index 0000000..ade9d64 --- /dev/null +++ b/src/main.tsx @@ -0,0 +1,13 @@ +import { StrictMode } from 'react' +import { createRoot } from 'react-dom/client' +import { BrowserRouter } from 'react-router-dom' +import './index.css' +import App from './App.tsx' + +createRoot(document.getElementById('root')!).render( + + + + + , +) diff --git a/src/pages/PayPage.tsx b/src/pages/PayPage.tsx new file mode 100644 index 0000000..60a6a79 --- /dev/null +++ b/src/pages/PayPage.tsx @@ -0,0 +1,496 @@ +import { useCallback, useEffect, useMemo, useRef, useState } from 'react' +import { useNavigate } from 'react-router-dom' +import { checkOrder, getGoods, order, type GoodsItem } from '@/api/pay' + +const PAY_METHOD_LIST = [ + { code: 'weixin', icon: '/images/pay/icon-wechatpay.png', name: '微信支付' }, + { code: 'alipay', icon: '/images/pay/icon-alipay.png', name: '支付宝' }, +] + +const ORDER_POLLING_INTERVAL = 2000 +const ORDER_POLLING_MAX_COUNT = 60 + +type PayMethodInfo = (typeof PAY_METHOD_LIST)[number] + +function getSupportedPayMethods(goods?: GoodsItem) { + if (!goods?.pay_type) { + return [] + } + + const supportedPayTypes = new Set( + goods.pay_type + .split(',') + .map((payType) => payType.trim()) + .filter(Boolean), + ) + + return PAY_METHOD_LIST.filter((method) => supportedPayTypes.has(method.code)) +} + +function PayPage() { + const navigate = useNavigate() + const [goodsList, setGoodsList] = useState([]) + const [currentIndex, setCurrentIndex] = useState(0) + const [selectedPayType, setSelectedPayType] = useState('') + const [isPaying, setIsPaying] = useState(false) + const pollingTimerRef = useRef(null) + const pollingCountRef = useRef(0) + const pollingSessionRef = useRef(0) + const paymentAttemptRef = useRef(0) + const previousSelectionRef = useRef({ planId: '', payType: '' }) + const isMountedRef = useRef(true) + const selectedPlan = goodsList[currentIndex] + const selectedPlanId = selectedPlan?.goods_id ?? '' + const supportedPayMethods = useMemo(() => getSupportedPayMethods(selectedPlan), [selectedPlan]) + + const stopOrderPolling = useCallback(() => { + pollingSessionRef.current += 1 + + if (pollingTimerRef.current !== null) { + window.clearTimeout(pollingTimerRef.current) + pollingTimerRef.current = null + } + pollingCountRef.current = 0 + }, []) + + const cancelPaymentFlow = useCallback(() => { + paymentAttemptRef.current += 1 + stopOrderPolling() + + if (isMountedRef.current) { + setIsPaying(false) + } + }, [stopOrderPolling]) + + useEffect(() => { + let isMounted = true + + async function initGoods() { + try { + const { data } = await getGoods() + const nextGoodsList = Array.isArray(data) ? data : [] + const checkedIndex = nextGoodsList.findIndex((goods) => goods.checked) + + if (!isMounted) { + return + } + + setGoodsList(nextGoodsList) + setCurrentIndex(checkedIndex >= 0 ? checkedIndex : 0) + } catch { + if (isMounted) { + setGoodsList([]) + setCurrentIndex(0) + } + } + } + + initGoods() + + return () => { + isMounted = false + } + }, []) + + useEffect(() => { + return () => { + isMountedRef.current = false + stopOrderPolling() + } + }, [stopOrderPolling]) + + useEffect(() => { + setSelectedPayType((currentPayType) => { + if (supportedPayMethods.some((method) => method.code === currentPayType)) { + return currentPayType + } + + return supportedPayMethods[0]?.code ?? '' + }) + }, [supportedPayMethods]) + + useEffect(() => { + const previousSelection = previousSelectionRef.current + const hasSelectionChanged = + previousSelection.planId !== selectedPlanId || previousSelection.payType !== selectedPayType + + if (isPaying && hasSelectionChanged) { + cancelPaymentFlow() + } + + previousSelectionRef.current = { + planId: selectedPlanId, + payType: selectedPayType, + } + }, [cancelPaymentFlow, isPaying, selectedPayType, selectedPlanId]) + + const startOrderPolling = useCallback( + (orderId: string) => { + stopOrderPolling() + const sessionId = pollingSessionRef.current + + const pollOrder = async () => { + if (pollingSessionRef.current !== sessionId) { + return + } + + pollingCountRef.current += 1 + + try { + const { data } = await checkOrder(orderId) + + if (pollingSessionRef.current !== sessionId) { + return + } + + if (data.status === '2') { + stopOrderPolling() + navigate('/pay-result?success=true') + return + } + } catch { + if (pollingSessionRef.current !== sessionId) { + return + } + + stopOrderPolling() + if (isMountedRef.current) { + setIsPaying(false) + } + return + } + + if (pollingCountRef.current >= ORDER_POLLING_MAX_COUNT) { + stopOrderPolling() + if (isMountedRef.current) { + setIsPaying(false) + } + return + } + + if (pollingSessionRef.current !== sessionId) { + return + } + + pollingTimerRef.current = window.setTimeout(pollOrder, ORDER_POLLING_INTERVAL) + } + + pollingTimerRef.current = window.setTimeout(pollOrder, ORDER_POLLING_INTERVAL) + }, + [navigate, stopOrderPolling], + ) + + const handlePay = useCallback(async () => { + if (isPaying || !selectedPlan || !selectedPayType) { + return + } + + const alipayWindow = selectedPayType === 'alipay' ? window.open('', '_blank') : null + const paymentAttemptId = paymentAttemptRef.current + 1 + paymentAttemptRef.current = paymentAttemptId + setIsPaying(true) + + try { + const { data } = await order({ + goods_id: selectedPlan.goods_id, + pay_type: selectedPayType, + source: '', + pay_source: 'h5', + extra: {}, + }) + + if (paymentAttemptRef.current !== paymentAttemptId) { + alipayWindow?.close() + return + } + + if (selectedPayType === 'alipay') { + if (!data.orderId || !data.payParam) { + alipayWindow?.close() + window.alert('支付信息获取失败,请稍后重试') + throw new Error('Missing Alipay orderId or payParam') + } + + if (alipayWindow) { + alipayWindow.location.href = data.payParam + } else if (!window.open(data.payParam, '_blank')) { + window.alert('支付宝页面打开失败,请允许浏览器弹窗后重试') + throw new Error('Failed to open Alipay window') + } + + startOrderPolling(data.orderId) + return + } + + navigate('/pay-result?success=true') + } catch { + alipayWindow?.close() + if (isMountedRef.current && paymentAttemptRef.current === paymentAttemptId) { + setIsPaying(false) + } + } + }, [isPaying, navigate, selectedPayType, selectedPlan, startOrderPolling]) + + const handleCurrentIndexChange = useCallback( + (nextIndex: number | ((prevIndex: number) => number)) => { + cancelPaymentFlow() + setCurrentIndex(nextIndex) + }, + [cancelPaymentFlow], + ) + + const handleSelectPayType = useCallback( + (payType: string) => { + if (payType !== selectedPayType) { + cancelPaymentFlow() + } + + setSelectedPayType(payType) + }, + [cancelPaymentFlow, selectedPayType], + ) + + return ( +
+
+ + + +
+ ) +} + +function Header() { + return ( +
+
+ 安装包即将到期 + 2026-06-26 到期 +
+
+
+ 安装包解锁 +
+
解锁后即可使用
+
+
+ ) +} + +type PlanProps = { + canPay: boolean + currentIndex: number + goodsList: GoodsItem[] + isPaying: boolean + onCurrentIndexChange: (nextIndex: number | ((prevIndex: number) => number)) => void + onPay: () => void + selectedPlan?: GoodsItem +} + +function Plan({ + canPay, + currentIndex, + goodsList, + isPaying, + onCurrentIndexChange, + onPay, + selectedPlan, +}: PlanProps) { + const [isAnimating, setIsAnimating] = useState(false) + const touchStartXRef = useRef(null) + const touchStartYRef = useRef(null) + const touchDeltaXRef = useRef(0) + const animationTimerRef = useRef(null) + const goodsCount = goodsList.length + + useEffect(() => { + return () => { + if (animationTimerRef.current !== null) { + window.clearTimeout(animationTimerRef.current) + } + } + }, []) + + const lockAnimation = () => { + setIsAnimating(true) + if (animationTimerRef.current !== null) { + window.clearTimeout(animationTimerRef.current) + } + animationTimerRef.current = window.setTimeout(() => { + setIsAnimating(false) + animationTimerRef.current = null + }, 320) + } + + const changePlan = (direction: 'prev' | 'next') => { + if (isAnimating || goodsCount === 0) { + return + } + + lockAnimation() + onCurrentIndexChange((prevIndex) => { + if (direction === 'prev') { + return (prevIndex - 1 + goodsCount) % goodsCount + } + + return (prevIndex + 1) % goodsCount + }) + } + + const getPositionClassName = (index: number) => { + if (goodsCount === 0) { + return '' + } + + const distance = (index - currentIndex + goodsCount) % goodsCount + + if (distance === 0) { + return 'is-center selected' + } + + if (distance === 1) { + return 'is-right' + } + + return 'is-left' + } + + const handlePlanClick = (index: number) => { + if (index === currentIndex || isAnimating || goodsCount === 0) { + return + } + + const distance = (index - currentIndex + goodsCount) % goodsCount + changePlan(distance === 1 ? 'next' : 'prev') + } + + const handleTouchStart = (event: React.TouchEvent) => { + const touch = event.touches[0] + touchStartXRef.current = touch.clientX + touchStartYRef.current = touch.clientY + touchDeltaXRef.current = 0 + } + + const handleTouchMove = (event: React.TouchEvent) => { + if (touchStartXRef.current === null || touchStartYRef.current === null) { + return + } + + const touch = event.touches[0] + const deltaX = touch.clientX - touchStartXRef.current + const deltaY = touch.clientY - touchStartYRef.current + + if (Math.abs(deltaX) > Math.abs(deltaY)) { + touchDeltaXRef.current = deltaX + event.preventDefault() + } + } + + const handleTouchEnd = () => { + const swipeThreshold = 36 + const deltaX = touchDeltaXRef.current + + touchStartXRef.current = null + touchStartYRef.current = null + touchDeltaXRef.current = 0 + + if (Math.abs(deltaX) < swipeThreshold || isAnimating || goodsCount === 0) { + return + } + + changePlan(deltaX < 0 ? 'next' : 'prev') + } + + return ( + <> +
+
+ {goodsList.map((plan, index) => ( + + ))} +
+
+ + + ) +} + +type PayMethodProps = { + methods: PayMethodInfo[] + onSelectPayType: (payType: string) => void + selectedPayType: string +} + +function PayMethod({ methods, onSelectPayType, selectedPayType }: PayMethodProps) { + return ( +
+
支付方式
+ {methods.length > 0 && ( +
+ {methods.map((method) => ( +
onSelectPayType(method.code)} + > +
+ {method.name} +
{method.name}
+
+ 选中 +
+ ))} +
+ )} +
+ ) +} + +function ContactUs() { + return ( +
+ + 客服 +
+ ) +} + +export default PayPage diff --git a/src/pages/PayResultPage.tsx b/src/pages/PayResultPage.tsx new file mode 100644 index 0000000..3b938f6 --- /dev/null +++ b/src/pages/PayResultPage.tsx @@ -0,0 +1,24 @@ +import { useMemo } from 'react' +import { useNavigate, useSearchParams } from 'react-router-dom' + +function PayResultPage() { + const navigate = useNavigate() + const [searchParams] = useSearchParams() + const isSuccess = useMemo(() => searchParams.get("success") === "true", [searchParams]) + + return ( +
+
+ +
+ {isSuccess ? "支付成功" : "抱歉,订单支付失败"} +
+
+ +
+ ) +} + +export default PayResultPage diff --git a/src/pages/Twins.tsx b/src/pages/Twins.tsx new file mode 100644 index 0000000..ccf752d --- /dev/null +++ b/src/pages/Twins.tsx @@ -0,0 +1,95 @@ + +function Twins() { + return ( +
+
+ +
+ ) +} + + +function Header() { + return ( +
+
+ iPhone双开微信 +
+
+ 专享 TestFlight 内测试版 | 无
需越狱 | 无封号风险 +
+
+
+ 安全问题 + 安全问题 +
+
+ 无封号风险 + 无封号风险 +
+
+
+ ) +} + +function Card() { + const steps = [ + { + label: '步骤一', + title: "下载 TestFlight 应用", + desc: [ + "· 若已安装,请跳过此步;", + "· 未安装请点击下方按钮前往App Store下载;", + ], + linkName: "前往下载", + linkUrl: "", + sideBg: "./images/app-twins/step1-side.png" + }, + { + label: '步骤二', + title: "安装双开微信", + desc: [ + "· 点击下方按钮,自动跳转安装您的专属微信", + "· 下载完成后,桌重会出现第二个微信围标;", + ], + linkName: "前往安装", + linkUrl: "", + sideBg: "./images/app-twins/step2-side.png" + } + ] + return ( +
+
+ +
+ 仅需两步 · 30秒完成安装 +
+ +
+
+ { + steps.map((step, index) => ( +
+
{step.label}
+
{step.title}
+
+ { + step.desc.map((descItem, descIndex) => ( +
{descItem}
+ )) + } +
+ {step.linkName} +
+ )) + } +
+
+ 客服1对1指导安装 + 客服1对1
指导安装
+
+
+ ) +} + +export default Twins diff --git a/src/utils/request.ts b/src/utils/request.ts new file mode 100644 index 0000000..51d35a9 --- /dev/null +++ b/src/utils/request.ts @@ -0,0 +1,316 @@ +import Bowser from 'bowser' + +type RequestPrimitive = string | number | boolean | null | undefined + +type RequestValue = RequestPrimitive | RequestPrimitive[] + +type RequestParams = Record + +type RequestOptions = Omit & { + body?: BodyInit | Record | null +} + +type ApiResponseLike = { + code?: unknown + message?: unknown +} + +export type ApiResponse = { + code: number + message: string + data: T +} + +type ClientSysInfo = { + version?: RequestPrimitive + platform?: RequestPrimitive + deviceId?: RequestPrimitive + brand?: RequestPrimitive + model?: RequestPrimitive + channel?: RequestPrimitive + bd_vid?: RequestPrimitive +} + +declare global { + interface Window { + sysInfo?: ClientSysInfo + } +} + +const SYS_INFO_STORAGE_KEY = 'sysInfo' + +function isRecord(value: unknown): value is Record { + return Object.prototype.toString.call(value) === '[object Object]' +} + +function readStoredSysInfo(): Partial { + if (typeof window === 'undefined') { + return {} + } + + try { + const rawSysInfo = window.localStorage.getItem(SYS_INFO_STORAGE_KEY) + if (!rawSysInfo) { + return {} + } + + const sysInfo: unknown = JSON.parse(rawSysInfo) + return isRecord(sysInfo) ? sysInfo : {} + } catch { + return {} + } +} + +function writeStoredSysInfo(sysInfo: Partial) { + if (typeof window === 'undefined') { + return + } + + try { + window.localStorage.setItem(SYS_INFO_STORAGE_KEY, JSON.stringify(sysInfo)) + } catch { + // localStorage can be blocked in private mode; headers can still use in-memory values. + } +} + +function createDeviceId() { + if (typeof crypto !== 'undefined' && typeof crypto.randomUUID === 'function') { + return crypto.randomUUID() + } + + if (typeof crypto !== 'undefined' && typeof crypto.getRandomValues === 'function') { + const bytes = crypto.getRandomValues(new Uint8Array(16)) + bytes[6] = (bytes[6] & 0x0f) | 0x40 + bytes[8] = (bytes[8] & 0x3f) | 0x80 + + const hex = Array.from(bytes, (byte) => byte.toString(16).padStart(2, '0')) + return `${hex.slice(0, 4).join('')}-${hex.slice(4, 6).join('')}-${hex.slice(6, 8).join('')}-${hex + .slice(8, 10) + .join('')}-${hex.slice(10, 16).join('')}` + } + + return `${Date.now()}-${Math.random().toString(16).slice(2)}` +} + +function getDeviceId(storedSysInfo: Partial) { + const storedDeviceId = storedSysInfo.deviceId + if (storedDeviceId) { + return String(storedDeviceId) + } + + const deviceId = createDeviceId() + writeStoredSysInfo({ ...storedSysInfo, deviceId }) + return deviceId +} + +function mergeDefinedSysInfo(baseInfo: ClientSysInfo, overrideInfo: ClientSysInfo) { + const mergedInfo = { ...baseInfo } + + Object.entries(overrideInfo).forEach(([key, value]) => { + if (value !== undefined && value !== null && value !== '') { + mergedInfo[key as keyof ClientSysInfo] = value + } + }) + + return mergedInfo +} + +export function getBrowserInfo(): ClientSysInfo { + const storedSysInfo = readStoredSysInfo() + const userAgent = typeof navigator === 'undefined' ? '' : navigator.userAgent + const browserInfo = userAgent ? Bowser.parse(userAgent) : undefined + const brand = browserInfo?.platform.vendor || browserInfo?.browser.name || '' + const model = browserInfo?.platform.model || browserInfo?.browser.version || '' + + return { + version: __APP_VERSION__, + platform: 'web', + channel: 'web', + deviceId: getDeviceId(storedSysInfo), + brand, + model, + bd_vid: storedSysInfo.bd_vid, + } +} + +function getSearchParams() { + if (typeof window === 'undefined') { + return new URLSearchParams() + } + + return new URLSearchParams(window.location.search) +} + +function getClientSysInfo() { + if (typeof window === 'undefined') { + return {} + } + + return window.sysInfo ?? {} +} + +function toHeaderValue(value: RequestPrimitive) { + return value === undefined || value === null ? '' : String(value) +} + +function setCommonHeaders(headers: Headers) { + const params = getSearchParams() + const sysInfo = mergeDefinedSysInfo(getBrowserInfo(), getClientSysInfo()) + + headers.set('x-version', toHeaderValue(sysInfo.version ?? __APP_VERSION__)) + headers.set('x-platform', toHeaderValue(sysInfo.platform)) + headers.set('x-device-id', toHeaderValue(sysInfo.deviceId)) + headers.set('x-mobile-brand', toHeaderValue(sysInfo.brand)) + headers.set('x-mobile-model', toHeaderValue(sysInfo.model)) + headers.set('x-channel', toHeaderValue(sysInfo.channel)) + headers.set('x-click-id', toHeaderValue(params.get('bd_vid') ?? sysInfo.bd_vid ?? '')) + headers.set('x-app-id', toHeaderValue(__APP_ID__)) + const token = window.localStorage.getItem("token") + if(token){ + headers.set('x-token', token) + } +} + +function buildQueryString(params?: RequestParams) { + if (!params) { + return '' + } + + const searchParams = new URLSearchParams() + + Object.entries(params).forEach(([key, value]) => { + if (value === undefined || value === null) { + return + } + + if (Array.isArray(value)) { + value.forEach((item) => { + if (item !== undefined && item !== null) { + searchParams.append(key, String(item)) + } + }) + return + } + + searchParams.append(key, String(value)) + }) + + const queryString = searchParams.toString() + return queryString ? `?${queryString}` : '' +} + +function isPlainObject(value: RequestOptions['body']): value is Record { + return Object.prototype.toString.call(value) === '[object Object]' +} + +function isApiResponseLike(value: unknown): value is ApiResponseLike { + return Object.prototype.toString.call(value) === '[object Object]' && 'code' in (value as Record) +} + +let toastTimer: number | null = null + +function showToast(message: string) { + if (typeof document === 'undefined') { + return + } + + const existingToast = document.getElementById('request-error-toast') + if (existingToast) { + existingToast.remove() + } + + if (toastTimer !== null) { + window.clearTimeout(toastTimer) + } + + const toast = document.createElement('div') + toast.id = 'request-error-toast' + toast.textContent = message + toast.setAttribute('role', 'alert') + toast.style.position = 'fixed' + toast.style.left = '50%' + toast.style.top = '50%' + toast.style.zIndex = '9999' + toast.style.maxWidth = 'calc(100vw - 48px)' + toast.style.padding = '10px 16px' + toast.style.borderRadius = '8px' + toast.style.background = 'rgba(0, 0, 0, 0.78)' + toast.style.color = '#fff' + toast.style.fontSize = '14px' + toast.style.lineHeight = '20px' + toast.style.textAlign = 'center' + toast.style.transform = 'translate(-50%, -50%)' + toast.style.boxShadow = '0 8px 24px rgba(0, 0, 0, 0.18)' + toast.style.pointerEvents = 'none' + + document.body.appendChild(toast) + + toastTimer = window.setTimeout(() => { + toast.remove() + toastTimer = null + }, 2200) +} + +function getBusinessErrorMessage(message: unknown) { + if (typeof message !== 'string') { + return '请求失败' + } + + const errorMessage = message.split(/[,,]/)[0]?.trim() + return errorMessage || message || '请求失败' +} + +async function request(url: string, method: string, options: RequestOptions = {}) { + const { body, headers, ...restOptions } = options + const requestHeaders = new Headers(headers) + setCommonHeaders(requestHeaders) + let requestBody: BodyInit | null | undefined + + if (isPlainObject(body)) { + if (!requestHeaders.has('Content-Type')) { + requestHeaders.set('Content-Type', 'application/json') + } + requestBody = JSON.stringify(body) + } else { + requestBody = body + } + + const response = await fetch(url, { + ...restOptions, + method, + headers: requestHeaders, + body: requestBody, + }) + + if (!response.ok) { + throw new Error(`Request failed with status ${response.status}`) + } + + const responseData: unknown = await response.json() + + if (isApiResponseLike(responseData) && responseData.code !== 0) { + const errorMessage = getBusinessErrorMessage(responseData.message) + showToast(errorMessage) + throw new Error(errorMessage) + } + + return responseData as T +} + +export function get(url: string, params?: RequestParams, options?: Omit) { + return request(`${url}${buildQueryString(params)}`, 'GET', options) +} + +export function post(url: string, body?: RequestOptions['body'], options?: Omit) { + return request(url, 'POST', { ...options, body }) +} + +export function put(url: string, body?: RequestOptions['body'], options?: Omit) { + return request(url, 'PUT', { ...options, body }) +} + +export function del(url: string, body?: RequestOptions['body'], options?: Omit) { + return request(url, 'DELETE', { ...options, body }) +} + +export { del as delete } diff --git a/src/vite-env.d.ts b/src/vite-env.d.ts new file mode 100644 index 0000000..62b2767 --- /dev/null +++ b/src/vite-env.d.ts @@ -0,0 +1,4 @@ +/// + +declare const __APP_ID__: string +declare const __APP_VERSION__: string diff --git a/tsconfig.app.json b/tsconfig.app.json new file mode 100644 index 0000000..32f1723 --- /dev/null +++ b/tsconfig.app.json @@ -0,0 +1,29 @@ +{ + "compilerOptions": { + "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo", + "target": "es2023", + "lib": ["ES2023", "DOM"], + "module": "esnext", + "types": ["vite/client"], + "paths": { + "@/*": ["./src/*"] + }, + "allowArbitraryExtensions": true, + "skipLibCheck": true, + + /* Bundler mode */ + "moduleResolution": "bundler", + "allowImportingTsExtensions": true, + "verbatimModuleSyntax": true, + "moduleDetection": "force", + "noEmit": true, + "jsx": "react-jsx", + + /* Linting */ + "noUnusedLocals": true, + "noUnusedParameters": true, + "erasableSyntaxOnly": true, + "noFallthroughCasesInSwitch": true + }, + "include": ["src"] +} diff --git a/tsconfig.json b/tsconfig.json new file mode 100644 index 0000000..1ffef60 --- /dev/null +++ b/tsconfig.json @@ -0,0 +1,7 @@ +{ + "files": [], + "references": [ + { "path": "./tsconfig.app.json" }, + { "path": "./tsconfig.node.json" } + ] +} diff --git a/tsconfig.node.json b/tsconfig.node.json new file mode 100644 index 0000000..8455dcb --- /dev/null +++ b/tsconfig.node.json @@ -0,0 +1,23 @@ +{ + "compilerOptions": { + "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo", + "target": "es2023", + "lib": ["ES2023"], + "types": ["node"], + "skipLibCheck": true, + + /* Bundler mode */ + "module": "nodenext", + "allowImportingTsExtensions": true, + "verbatimModuleSyntax": true, + "moduleDetection": "force", + "noEmit": true, + + /* Linting */ + "noUnusedLocals": true, + "noUnusedParameters": true, + "erasableSyntaxOnly": true, + "noFallthroughCasesInSwitch": true + }, + "include": ["vite.config.ts"] +} diff --git a/vite.config.ts b/vite.config.ts new file mode 100644 index 0000000..dad031b --- /dev/null +++ b/vite.config.ts @@ -0,0 +1,42 @@ +import { defineConfig, loadEnv } from 'vite' +import react from '@vitejs/plugin-react' +import { readFileSync } from 'node:fs' + +type PackageConfig = { + appId?: string + name?: string + version?: string +} + +const packageConfig = JSON.parse(readFileSync(new URL('./package.json', import.meta.url), 'utf-8')) as PackageConfig + +// https://vite.dev/config/ +export default defineConfig(({ mode }) => { + const env = loadEnv(mode, process.cwd(), '') + const baseURL = env.VITE_BASE_URL?.trim() + const appId = env.VITE_APP_ID?.trim() || packageConfig.appId || packageConfig.name || '' + + return { + plugins: [react()], + define: { + __APP_ID__: JSON.stringify(appId), + __APP_VERSION__: JSON.stringify(packageConfig.version || ''), + }, + server: baseURL + ? { + proxy: { + '/api': { + target: baseURL, + changeOrigin: true, + }, + }, + } + : undefined, + // alias + resolve: { + alias: { + '@': `${process.cwd()}/src`, + }, + }, + } +})