├── .editorconfig ├── .env ├── .eslintrc.json ├── .gitignore ├── .prettierrc ├── LICENSE ├── README.md ├── app ├── components │ ├── background.tsx │ ├── buttons.tsx │ ├── home.tsx │ ├── icons.tsx │ ├── infomation.tsx │ ├── modal.tsx │ ├── qrcode.tsx │ └── utils.tsx ├── dom-to-image-more.d.ts ├── env-gen │ └── page.tsx ├── globals.css ├── layout.tsx ├── package.json ├── page.tsx └── viewport │ └── [platform] │ └── page.tsx ├── middleware.ts ├── next.config.mjs ├── package.json ├── pnpm-lock.yaml ├── postcss.config.mjs ├── public ├── bg.png ├── blank.gif └── favicon.png ├── tailwind.config.ts └── tsconfig.json /.editorconfig: -------------------------------------------------------------------------------- 1 | [*.{js,tsx}] 2 | indent_style = space 3 | indent_size = 4 4 | -------------------------------------------------------------------------------- /.env: -------------------------------------------------------------------------------- 1 | ;app_options= 2 | ;app_contents= 3 | ;app_qrCodeContent= 4 | ;app_platforms= 5 | -------------------------------------------------------------------------------- /.eslintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["next/core-web-vitals", "next/typescript"] 3 | } 4 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | .yarn/install-state.gz 8 | 9 | # testing 10 | /coverage 11 | 12 | # next.js 13 | /.next/ 14 | /out/ 15 | 16 | # production 17 | /build 18 | 19 | # misc 20 | .DS_Store 21 | *.pem 22 | 23 | # debug 24 | npm-debug.log* 25 | yarn-debug.log* 26 | yarn-error.log* 27 | 28 | # local env files 29 | .env*.local 30 | 31 | # vercel 32 | .vercel 33 | 34 | # typescript 35 | *.tsbuildinfo 36 | next-env.d.ts 37 | 38 | # ide 39 | /.idea 40 | /.vscode 41 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "semi": true, 3 | "singleQuote": true, 4 | "bracketSpacing": true, 5 | "trailingComma":"none", 6 | "arrowParens": "avoid", 7 | "printWidth": 100 8 | } -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | GNU GENERAL PUBLIC LICENSE 2 | Version 3, 29 June 2007 3 | 4 | Copyright (C) 2007 Free Software Foundation, Inc. 5 | Everyone is permitted to copy and distribute verbatim copies 6 | of this license document, but changing it is not allowed. 7 | 8 | Preamble 9 | 10 | The GNU General Public License is a free, copyleft license for 11 | software and other kinds of works. 12 | 13 | The licenses for most software and other practical works are designed 14 | to take away your freedom to share and change the works. By contrast, 15 | the GNU General Public License is intended to guarantee your freedom to 16 | share and change all versions of a program--to make sure it remains free 17 | software for all its users. We, the Free Software Foundation, use the 18 | GNU General Public License for most of our software; it applies also to 19 | any other work released this way by its authors. You can apply it to 20 | your programs, too. 21 | 22 | When we speak of free software, we are referring to freedom, not 23 | price. Our General Public Licenses are designed to make sure that you 24 | have the freedom to distribute copies of free software (and charge for 25 | them if you wish), that you receive source code or can get it if you 26 | want it, that you can change the software or use pieces of it in new 27 | free programs, and that you know you can do these things. 28 | 29 | To protect your rights, we need to prevent others from denying you 30 | these rights or asking you to surrender the rights. Therefore, you have 31 | certain responsibilities if you distribute copies of the software, or if 32 | you modify it: responsibilities to respect the freedom of others. 33 | 34 | For example, if you distribute copies of such a program, whether 35 | gratis or for a fee, you must pass on to the recipients the same 36 | freedoms that you received. You must make sure that they, too, receive 37 | or can get the source code. And you must show them these terms so they 38 | know their rights. 39 | 40 | Developers that use the GNU GPL protect your rights with two steps: 41 | (1) assert copyright on the software, and (2) offer you this License 42 | giving you legal permission to copy, distribute and/or modify it. 43 | 44 | For the developers' and authors' protection, the GPL clearly explains 45 | that there is no warranty for this free software. For both users' and 46 | authors' sake, the GPL requires that modified versions be marked as 47 | changed, so that their problems will not be attributed erroneously to 48 | authors of previous versions. 49 | 50 | Some devices are designed to deny users access to install or run 51 | modified versions of the software inside them, although the manufacturer 52 | can do so. This is fundamentally incompatible with the aim of 53 | protecting users' freedom to change the software. The systematic 54 | pattern of such abuse occurs in the area of products for individuals to 55 | use, which is precisely where it is most unacceptable. Therefore, we 56 | have designed this version of the GPL to prohibit the practice for those 57 | products. If such problems arise substantially in other domains, we 58 | stand ready to extend this provision to those domains in future versions 59 | of the GPL, as needed to protect the freedom of users. 60 | 61 | Finally, every program is threatened constantly by software patents. 62 | States should not allow patents to restrict development and use of 63 | software on general-purpose computers, but in those that do, we wish to 64 | avoid the special danger that patents applied to a free program could 65 | make it effectively proprietary. To prevent this, the GPL assures that 66 | patents cannot be used to render the program non-free. 67 | 68 | The precise terms and conditions for copying, distribution and 69 | modification follow. 70 | 71 | TERMS AND CONDITIONS 72 | 73 | 0. Definitions. 74 | 75 | "This License" refers to version 3 of the GNU General Public License. 76 | 77 | "Copyright" also means copyright-like laws that apply to other kinds of 78 | works, such as semiconductor masks. 79 | 80 | "The Program" refers to any copyrightable work licensed under this 81 | License. Each licensee is addressed as "you". "Licensees" and 82 | "recipients" may be individuals or organizations. 83 | 84 | To "modify" a work means to copy from or adapt all or part of the work 85 | in a fashion requiring copyright permission, other than the making of an 86 | exact copy. The resulting work is called a "modified version" of the 87 | earlier work or a work "based on" the earlier work. 88 | 89 | A "covered work" means either the unmodified Program or a work based 90 | on the Program. 91 | 92 | To "propagate" a work means to do anything with it that, without 93 | permission, would make you directly or secondarily liable for 94 | infringement under applicable copyright law, except executing it on a 95 | computer or modifying a private copy. Propagation includes copying, 96 | distribution (with or without modification), making available to the 97 | public, and in some countries other activities as well. 98 | 99 | To "convey" a work means any kind of propagation that enables other 100 | parties to make or receive copies. Mere interaction with a user through 101 | a computer network, with no transfer of a copy, is not conveying. 102 | 103 | An interactive user interface displays "Appropriate Legal Notices" 104 | to the extent that it includes a convenient and prominently visible 105 | feature that (1) displays an appropriate copyright notice, and (2) 106 | tells the user that there is no warranty for the work (except to the 107 | extent that warranties are provided), that licensees may convey the 108 | work under this License, and how to view a copy of this License. If 109 | the interface presents a list of user commands or options, such as a 110 | menu, a prominent item in the list meets this criterion. 111 | 112 | 1. Source Code. 113 | 114 | The "source code" for a work means the preferred form of the work 115 | for making modifications to it. "Object code" means any non-source 116 | form of a work. 117 | 118 | A "Standard Interface" means an interface that either is an official 119 | standard defined by a recognized standards body, or, in the case of 120 | interfaces specified for a particular programming language, one that 121 | is widely used among developers working in that language. 122 | 123 | The "System Libraries" of an executable work include anything, other 124 | than the work as a whole, that (a) is included in the normal form of 125 | packaging a Major Component, but which is not part of that Major 126 | Component, and (b) serves only to enable use of the work with that 127 | Major Component, or to implement a Standard Interface for which an 128 | implementation is available to the public in source code form. A 129 | "Major Component", in this context, means a major essential component 130 | (kernel, window system, and so on) of the specific operating system 131 | (if any) on which the executable work runs, or a compiler used to 132 | produce the work, or an object code interpreter used to run it. 133 | 134 | The "Corresponding Source" for a work in object code form means all 135 | the source code needed to generate, install, and (for an executable 136 | work) run the object code and to modify the work, including scripts to 137 | control those activities. However, it does not include the work's 138 | System Libraries, or general-purpose tools or generally available free 139 | programs which are used unmodified in performing those activities but 140 | which are not part of the work. For example, Corresponding Source 141 | includes interface definition files associated with source files for 142 | the work, and the source code for shared libraries and dynamically 143 | linked subprograms that the work is specifically designed to require, 144 | such as by intimate data communication or control flow between those 145 | subprograms and other parts of the work. 146 | 147 | The Corresponding Source need not include anything that users 148 | can regenerate automatically from other parts of the Corresponding 149 | Source. 150 | 151 | The Corresponding Source for a work in source code form is that 152 | same work. 153 | 154 | 2. Basic Permissions. 155 | 156 | All rights granted under this License are granted for the term of 157 | copyright on the Program, and are irrevocable provided the stated 158 | conditions are met. This License explicitly affirms your unlimited 159 | permission to run the unmodified Program. The output from running a 160 | covered work is covered by this License only if the output, given its 161 | content, constitutes a covered work. This License acknowledges your 162 | rights of fair use or other equivalent, as provided by copyright law. 163 | 164 | You may make, run and propagate covered works that you do not 165 | convey, without conditions so long as your license otherwise remains 166 | in force. You may convey covered works to others for the sole purpose 167 | of having them make modifications exclusively for you, or provide you 168 | with facilities for running those works, provided that you comply with 169 | the terms of this License in conveying all material for which you do 170 | not control copyright. Those thus making or running the covered works 171 | for you must do so exclusively on your behalf, under your direction 172 | and control, on terms that prohibit them from making any copies of 173 | your copyrighted material outside their relationship with you. 174 | 175 | Conveying under any other circumstances is permitted solely under 176 | the conditions stated below. Sublicensing is not allowed; section 10 177 | makes it unnecessary. 178 | 179 | 3. Protecting Users' Legal Rights From Anti-Circumvention Law. 180 | 181 | No covered work shall be deemed part of an effective technological 182 | measure under any applicable law fulfilling obligations under article 183 | 11 of the WIPO copyright treaty adopted on 20 December 1996, or 184 | similar laws prohibiting or restricting circumvention of such 185 | measures. 186 | 187 | When you convey a covered work, you waive any legal power to forbid 188 | circumvention of technological measures to the extent such circumvention 189 | is effected by exercising rights under this License with respect to 190 | the covered work, and you disclaim any intention to limit operation or 191 | modification of the work as a means of enforcing, against the work's 192 | users, your or third parties' legal rights to forbid circumvention of 193 | technological measures. 194 | 195 | 4. Conveying Verbatim Copies. 196 | 197 | You may convey verbatim copies of the Program's source code as you 198 | receive it, in any medium, provided that you conspicuously and 199 | appropriately publish on each copy an appropriate copyright notice; 200 | keep intact all notices stating that this License and any 201 | non-permissive terms added in accord with section 7 apply to the code; 202 | keep intact all notices of the absence of any warranty; and give all 203 | recipients a copy of this License along with the Program. 204 | 205 | You may charge any price or no price for each copy that you convey, 206 | and you may offer support or warranty protection for a fee. 207 | 208 | 5. Conveying Modified Source Versions. 209 | 210 | You may convey a work based on the Program, or the modifications to 211 | produce it from the Program, in the form of source code under the 212 | terms of section 4, provided that you also meet all of these conditions: 213 | 214 | a) The work must carry prominent notices stating that you modified 215 | it, and giving a relevant date. 216 | 217 | b) The work must carry prominent notices stating that it is 218 | released under this License and any conditions added under section 219 | 7. This requirement modifies the requirement in section 4 to 220 | "keep intact all notices". 221 | 222 | c) You must license the entire work, as a whole, under this 223 | License to anyone who comes into possession of a copy. This 224 | License will therefore apply, along with any applicable section 7 225 | additional terms, to the whole of the work, and all its parts, 226 | regardless of how they are packaged. This License gives no 227 | permission to license the work in any other way, but it does not 228 | invalidate such permission if you have separately received it. 229 | 230 | d) If the work has interactive user interfaces, each must display 231 | Appropriate Legal Notices; however, if the Program has interactive 232 | interfaces that do not display Appropriate Legal Notices, your 233 | work need not make them do so. 234 | 235 | A compilation of a covered work with other separate and independent 236 | works, which are not by their nature extensions of the covered work, 237 | and which are not combined with it such as to form a larger program, 238 | in or on a volume of a storage or distribution medium, is called an 239 | "aggregate" if the compilation and its resulting copyright are not 240 | used to limit the access or legal rights of the compilation's users 241 | beyond what the individual works permit. Inclusion of a covered work 242 | in an aggregate does not cause this License to apply to the other 243 | parts of the aggregate. 244 | 245 | 6. Conveying Non-Source Forms. 246 | 247 | You may convey a covered work in object code form under the terms 248 | of sections 4 and 5, provided that you also convey the 249 | machine-readable Corresponding Source under the terms of this License, 250 | in one of these ways: 251 | 252 | a) Convey the object code in, or embodied in, a physical product 253 | (including a physical distribution medium), accompanied by the 254 | Corresponding Source fixed on a durable physical medium 255 | customarily used for software interchange. 256 | 257 | b) Convey the object code in, or embodied in, a physical product 258 | (including a physical distribution medium), accompanied by a 259 | written offer, valid for at least three years and valid for as 260 | long as you offer spare parts or customer support for that product 261 | model, to give anyone who possesses the object code either (1) a 262 | copy of the Corresponding Source for all the software in the 263 | product that is covered by this License, on a durable physical 264 | medium customarily used for software interchange, for a price no 265 | more than your reasonable cost of physically performing this 266 | conveying of source, or (2) access to copy the 267 | Corresponding Source from a network server at no charge. 268 | 269 | c) Convey individual copies of the object code with a copy of the 270 | written offer to provide the Corresponding Source. This 271 | alternative is allowed only occasionally and noncommercially, and 272 | only if you received the object code with such an offer, in accord 273 | with subsection 6b. 274 | 275 | d) Convey the object code by offering access from a designated 276 | place (gratis or for a charge), and offer equivalent access to the 277 | Corresponding Source in the same way through the same place at no 278 | further charge. You need not require recipients to copy the 279 | Corresponding Source along with the object code. If the place to 280 | copy the object code is a network server, the Corresponding Source 281 | may be on a different server (operated by you or a third party) 282 | that supports equivalent copying facilities, provided you maintain 283 | clear directions next to the object code saying where to find the 284 | Corresponding Source. Regardless of what server hosts the 285 | Corresponding Source, you remain obligated to ensure that it is 286 | available for as long as needed to satisfy these requirements. 287 | 288 | e) Convey the object code using peer-to-peer transmission, provided 289 | you inform other peers where the object code and Corresponding 290 | Source of the work are being offered to the general public at no 291 | charge under subsection 6d. 292 | 293 | A separable portion of the object code, whose source code is excluded 294 | from the Corresponding Source as a System Library, need not be 295 | included in conveying the object code work. 296 | 297 | A "User Product" is either (1) a "consumer product", which means any 298 | tangible personal property which is normally used for personal, family, 299 | or household purposes, or (2) anything designed or sold for incorporation 300 | into a dwelling. In determining whether a product is a consumer product, 301 | doubtful cases shall be resolved in favor of coverage. For a particular 302 | product received by a particular user, "normally used" refers to a 303 | typical or common use of that class of product, regardless of the status 304 | of the particular user or of the way in which the particular user 305 | actually uses, or expects or is expected to use, the product. A product 306 | is a consumer product regardless of whether the product has substantial 307 | commercial, industrial or non-consumer uses, unless such uses represent 308 | the only significant mode of use of the product. 309 | 310 | "Installation Information" for a User Product means any methods, 311 | procedures, authorization keys, or other information required to install 312 | and execute modified versions of a covered work in that User Product from 313 | a modified version of its Corresponding Source. The information must 314 | suffice to ensure that the continued functioning of the modified object 315 | code is in no case prevented or interfered with solely because 316 | modification has been made. 317 | 318 | If you convey an object code work under this section in, or with, or 319 | specifically for use in, a User Product, and the conveying occurs as 320 | part of a transaction in which the right of possession and use of the 321 | User Product is transferred to the recipient in perpetuity or for a 322 | fixed term (regardless of how the transaction is characterized), the 323 | Corresponding Source conveyed under this section must be accompanied 324 | by the Installation Information. But this requirement does not apply 325 | if neither you nor any third party retains the ability to install 326 | modified object code on the User Product (for example, the work has 327 | been installed in ROM). 328 | 329 | The requirement to provide Installation Information does not include a 330 | requirement to continue to provide support service, warranty, or updates 331 | for a work that has been modified or installed by the recipient, or for 332 | the User Product in which it has been modified or installed. Access to a 333 | network may be denied when the modification itself materially and 334 | adversely affects the operation of the network or violates the rules and 335 | protocols for communication across the network. 336 | 337 | Corresponding Source conveyed, and Installation Information provided, 338 | in accord with this section must be in a format that is publicly 339 | documented (and with an implementation available to the public in 340 | source code form), and must require no special password or key for 341 | unpacking, reading or copying. 342 | 343 | 7. Additional Terms. 344 | 345 | "Additional permissions" are terms that supplement the terms of this 346 | License by making exceptions from one or more of its conditions. 347 | Additional permissions that are applicable to the entire Program shall 348 | be treated as though they were included in this License, to the extent 349 | that they are valid under applicable law. If additional permissions 350 | apply only to part of the Program, that part may be used separately 351 | under those permissions, but the entire Program remains governed by 352 | this License without regard to the additional permissions. 353 | 354 | When you convey a copy of a covered work, you may at your option 355 | remove any additional permissions from that copy, or from any part of 356 | it. (Additional permissions may be written to require their own 357 | removal in certain cases when you modify the work.) You may place 358 | additional permissions on material, added by you to a covered work, 359 | for which you have or can give appropriate copyright permission. 360 | 361 | Notwithstanding any other provision of this License, for material you 362 | add to a covered work, you may (if authorized by the copyright holders of 363 | that material) supplement the terms of this License with terms: 364 | 365 | a) Disclaiming warranty or limiting liability differently from the 366 | terms of sections 15 and 16 of this License; or 367 | 368 | b) Requiring preservation of specified reasonable legal notices or 369 | author attributions in that material or in the Appropriate Legal 370 | Notices displayed by works containing it; or 371 | 372 | c) Prohibiting misrepresentation of the origin of that material, or 373 | requiring that modified versions of such material be marked in 374 | reasonable ways as different from the original version; or 375 | 376 | d) Limiting the use for publicity purposes of names of licensors or 377 | authors of the material; or 378 | 379 | e) Declining to grant rights under trademark law for use of some 380 | trade names, trademarks, or service marks; or 381 | 382 | f) Requiring indemnification of licensors and authors of that 383 | material by anyone who conveys the material (or modified versions of 384 | it) with contractual assumptions of liability to the recipient, for 385 | any liability that these contractual assumptions directly impose on 386 | those licensors and authors. 387 | 388 | All other non-permissive additional terms are considered "further 389 | restrictions" within the meaning of section 10. If the Program as you 390 | received it, or any part of it, contains a notice stating that it is 391 | governed by this License along with a term that is a further 392 | restriction, you may remove that term. If a license document contains 393 | a further restriction but permits relicensing or conveying under this 394 | License, you may add to a covered work material governed by the terms 395 | of that license document, provided that the further restriction does 396 | not survive such relicensing or conveying. 397 | 398 | If you add terms to a covered work in accord with this section, you 399 | must place, in the relevant source files, a statement of the 400 | additional terms that apply to those files, or a notice indicating 401 | where to find the applicable terms. 402 | 403 | Additional terms, permissive or non-permissive, may be stated in the 404 | form of a separately written license, or stated as exceptions; 405 | the above requirements apply either way. 406 | 407 | 8. Termination. 408 | 409 | You may not propagate or modify a covered work except as expressly 410 | provided under this License. Any attempt otherwise to propagate or 411 | modify it is void, and will automatically terminate your rights under 412 | this License (including any patent licenses granted under the third 413 | paragraph of section 11). 414 | 415 | However, if you cease all violation of this License, then your 416 | license from a particular copyright holder is reinstated (a) 417 | provisionally, unless and until the copyright holder explicitly and 418 | finally terminates your license, and (b) permanently, if the copyright 419 | holder fails to notify you of the violation by some reasonable means 420 | prior to 60 days after the cessation. 421 | 422 | Moreover, your license from a particular copyright holder is 423 | reinstated permanently if the copyright holder notifies you of the 424 | violation by some reasonable means, this is the first time you have 425 | received notice of violation of this License (for any work) from that 426 | copyright holder, and you cure the violation prior to 30 days after 427 | your receipt of the notice. 428 | 429 | Termination of your rights under this section does not terminate the 430 | licenses of parties who have received copies or rights from you under 431 | this License. If your rights have been terminated and not permanently 432 | reinstated, you do not qualify to receive new licenses for the same 433 | material under section 10. 434 | 435 | 9. Acceptance Not Required for Having Copies. 436 | 437 | You are not required to accept this License in order to receive or 438 | run a copy of the Program. Ancillary propagation of a covered work 439 | occurring solely as a consequence of using peer-to-peer transmission 440 | to receive a copy likewise does not require acceptance. However, 441 | nothing other than this License grants you permission to propagate or 442 | modify any covered work. These actions infringe copyright if you do 443 | not accept this License. Therefore, by modifying or propagating a 444 | covered work, you indicate your acceptance of this License to do so. 445 | 446 | 10. Automatic Licensing of Downstream Recipients. 447 | 448 | Each time you convey a covered work, the recipient automatically 449 | receives a license from the original licensors, to run, modify and 450 | propagate that work, subject to this License. You are not responsible 451 | for enforcing compliance by third parties with this License. 452 | 453 | An "entity transaction" is a transaction transferring control of an 454 | organization, or substantially all assets of one, or subdividing an 455 | organization, or merging organizations. If propagation of a covered 456 | work results from an entity transaction, each party to that 457 | transaction who receives a copy of the work also receives whatever 458 | licenses to the work the party's predecessor in interest had or could 459 | give under the previous paragraph, plus a right to possession of the 460 | Corresponding Source of the work from the predecessor in interest, if 461 | the predecessor has it or can get it with reasonable efforts. 462 | 463 | You may not impose any further restrictions on the exercise of the 464 | rights granted or affirmed under this License. For example, you may 465 | not impose a license fee, royalty, or other charge for exercise of 466 | rights granted under this License, and you may not initiate litigation 467 | (including a cross-claim or counterclaim in a lawsuit) alleging that 468 | any patent claim is infringed by making, using, selling, offering for 469 | sale, or importing the Program or any portion of it. 470 | 471 | 11. Patents. 472 | 473 | A "contributor" is a copyright holder who authorizes use under this 474 | License of the Program or a work on which the Program is based. The 475 | work thus licensed is called the contributor's "contributor version". 476 | 477 | A contributor's "essential patent claims" are all patent claims 478 | owned or controlled by the contributor, whether already acquired or 479 | hereafter acquired, that would be infringed by some manner, permitted 480 | by this License, of making, using, or selling its contributor version, 481 | but do not include claims that would be infringed only as a 482 | consequence of further modification of the contributor version. For 483 | purposes of this definition, "control" includes the right to grant 484 | patent sublicenses in a manner consistent with the requirements of 485 | this License. 486 | 487 | Each contributor grants you a non-exclusive, worldwide, royalty-free 488 | patent license under the contributor's essential patent claims, to 489 | make, use, sell, offer for sale, import and otherwise run, modify and 490 | propagate the contents of its contributor version. 491 | 492 | In the following three paragraphs, a "patent license" is any express 493 | agreement or commitment, however denominated, not to enforce a patent 494 | (such as an express permission to practice a patent or covenant not to 495 | sue for patent infringement). To "grant" such a patent license to a 496 | party means to make such an agreement or commitment not to enforce a 497 | patent against the party. 498 | 499 | If you convey a covered work, knowingly relying on a patent license, 500 | and the Corresponding Source of the work is not available for anyone 501 | to copy, free of charge and under the terms of this License, through a 502 | publicly available network server or other readily accessible means, 503 | then you must either (1) cause the Corresponding Source to be so 504 | available, or (2) arrange to deprive yourself of the benefit of the 505 | patent license for this particular work, or (3) arrange, in a manner 506 | consistent with the requirements of this License, to extend the patent 507 | license to downstream recipients. "Knowingly relying" means you have 508 | actual knowledge that, but for the patent license, your conveying the 509 | covered work in a country, or your recipient's use of the covered work 510 | in a country, would infringe one or more identifiable patents in that 511 | country that you have reason to believe are valid. 512 | 513 | If, pursuant to or in connection with a single transaction or 514 | arrangement, you convey, or propagate by procuring conveyance of, a 515 | covered work, and grant a patent license to some of the parties 516 | receiving the covered work authorizing them to use, propagate, modify 517 | or convey a specific copy of the covered work, then the patent license 518 | you grant is automatically extended to all recipients of the covered 519 | work and works based on it. 520 | 521 | A patent license is "discriminatory" if it does not include within 522 | the scope of its coverage, prohibits the exercise of, or is 523 | conditioned on the non-exercise of one or more of the rights that are 524 | specifically granted under this License. You may not convey a covered 525 | work if you are a party to an arrangement with a third party that is 526 | in the business of distributing software, under which you make payment 527 | to the third party based on the extent of your activity of conveying 528 | the work, and under which the third party grants, to any of the 529 | parties who would receive the covered work from you, a discriminatory 530 | patent license (a) in connection with copies of the covered work 531 | conveyed by you (or copies made from those copies), or (b) primarily 532 | for and in connection with specific products or compilations that 533 | contain the covered work, unless you entered into that arrangement, 534 | or that patent license was granted, prior to 28 March 2007. 535 | 536 | Nothing in this License shall be construed as excluding or limiting 537 | any implied license or other defenses to infringement that may 538 | otherwise be available to you under applicable patent law. 539 | 540 | 12. No Surrender of Others' Freedom. 541 | 542 | If conditions are imposed on you (whether by court order, agreement or 543 | otherwise) that contradict the conditions of this License, they do not 544 | excuse you from the conditions of this License. If you cannot convey a 545 | covered work so as to satisfy simultaneously your obligations under this 546 | License and any other pertinent obligations, then as a consequence you may 547 | not convey it at all. For example, if you agree to terms that obligate you 548 | to collect a royalty for further conveying from those to whom you convey 549 | the Program, the only way you could satisfy both those terms and this 550 | License would be to refrain entirely from conveying the Program. 551 | 552 | 13. Use with the GNU Affero General Public License. 553 | 554 | Notwithstanding any other provision of this License, you have 555 | permission to link or combine any covered work with a work licensed 556 | under version 3 of the GNU Affero General Public License into a single 557 | combined work, and to convey the resulting work. The terms of this 558 | License will continue to apply to the part which is the covered work, 559 | but the special requirements of the GNU Affero General Public License, 560 | section 13, concerning interaction through a network will apply to the 561 | combination as such. 562 | 563 | 14. Revised Versions of this License. 564 | 565 | The Free Software Foundation may publish revised and/or new versions of 566 | the GNU General Public License from time to time. Such new versions will 567 | be similar in spirit to the present version, but may differ in detail to 568 | address new problems or concerns. 569 | 570 | Each version is given a distinguishing version number. If the 571 | Program specifies that a certain numbered version of the GNU General 572 | Public License "or any later version" applies to it, you have the 573 | option of following the terms and conditions either of that numbered 574 | version or of any later version published by the Free Software 575 | Foundation. If the Program does not specify a version number of the 576 | GNU General Public License, you may choose any version ever published 577 | by the Free Software Foundation. 578 | 579 | If the Program specifies that a proxy can decide which future 580 | versions of the GNU General Public License can be used, that proxy's 581 | public statement of acceptance of a version permanently authorizes you 582 | to choose that version for the Program. 583 | 584 | Later license versions may give you additional or different 585 | permissions. However, no additional obligations are imposed on any 586 | author or copyright holder as a result of your choosing to follow a 587 | later version. 588 | 589 | 15. Disclaimer of Warranty. 590 | 591 | THERE IS NO WARRANTY FOR THE PROGRAM, TO THE EXTENT PERMITTED BY 592 | APPLICABLE LAW. EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT 593 | HOLDERS AND/OR OTHER PARTIES PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY 594 | OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO, 595 | THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR 596 | PURPOSE. THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE PROGRAM 597 | IS WITH YOU. SHOULD THE PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF 598 | ALL NECESSARY SERVICING, REPAIR OR CORRECTION. 599 | 600 | 16. Limitation of Liability. 601 | 602 | IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING 603 | WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MODIFIES AND/OR CONVEYS 604 | THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, INCLUDING ANY 605 | GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING OUT OF THE 606 | USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED TO LOSS OF 607 | DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY YOU OR THIRD 608 | PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER PROGRAMS), 609 | EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF 610 | SUCH DAMAGES. 611 | 612 | 17. Interpretation of Sections 15 and 16. 613 | 614 | If the disclaimer of warranty and limitation of liability provided 615 | above cannot be given local legal effect according to their terms, 616 | reviewing courts shall apply local law that most closely approximates 617 | an absolute waiver of all civil liability in connection with the 618 | Program, unless a warranty or assumption of liability accompanies a 619 | copy of the Program in return for a fee. 620 | 621 | END OF TERMS AND CONDITIONS 622 | 623 | How to Apply These Terms to Your New Programs 624 | 625 | If you develop a new program, and you want it to be of the greatest 626 | possible use to the public, the best way to achieve this is to make it 627 | free software which everyone can redistribute and change under these terms. 628 | 629 | To do so, attach the following notices to the program. It is safest 630 | to attach them to the start of each source file to most effectively 631 | state the exclusion of warranty; and each file should have at least 632 | the "copyright" line and a pointer to where the full notice is found. 633 | 634 | 635 | Copyright (C) 2024 Alex3236 636 | 637 | This program is free software: you can redistribute it and/or modify 638 | it under the terms of the GNU General Public License as published by 639 | the Free Software Foundation, either version 3 of the License, or 640 | (at your option) any later version. 641 | 642 | This program is distributed in the hope that it will be useful, 643 | but WITHOUT ANY WARRANTY; without even the implied warranty of 644 | MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 645 | GNU General Public License for more details. 646 | 647 | You should have received a copy of the GNU General Public License 648 | along with this program. If not, see . 649 | 650 | Also add information on how to contact you by electronic and paper mail. 651 | 652 | If the program does terminal interaction, make it output a short 653 | notice like this when it starts in an interactive mode: 654 | 655 | Copyright (C) 2024 Alex3236 656 | This program comes with ABSOLUTELY NO WARRANTY; for details type `show w'. 657 | This is free software, and you are welcome to redistribute it 658 | under certain conditions; type `show c' for details. 659 | 660 | The hypothetical commands `show w' and `show c' should show the appropriate 661 | parts of the General Public License. Of course, your program's commands 662 | might be different; for a GUI interface, you would use an "about box". 663 | 664 | You should also get your employer (if you work as a programmer) or school, 665 | if any, to sign a "copyright disclaimer" for the program, if necessary. 666 | For more information on this, and how to apply and follow the GNU GPL, see 667 | . 668 | 669 | The GNU General Public License does not permit incorporating your program 670 | into proprietary programs. If your program is a subroutine library, you 671 | may consider it more useful to permit linking proprietary applications with 672 | the library. If this is what you want to do, use the GNU Lesser General 673 | Public License instead of this License. But first, please read 674 | . 675 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Pay Next 2 | 3 | 一个简单的收款码展示页。 4 | 5 | >[!CAUTION] 6 | > **请勿以任何形式贩卖此项目。** 7 | 8 | ## 🚀 前情提要 9 | 10 | 微信不再允许长按扫描个人收款码。因此，重构本项目，实现二码（子母）模式，可将支付宝和微信收款码同时呈现 11 | 12 | 摄像头扫描时支付软件会自动选择适合自身的收款码，但从相册扫描时不行。 13 | 14 | 微信开通商家码后，可直接跳转页面，因此本项目也支持 UA 识别功能。 15 | 16 | 这是我第一个真正意义上的 React (Next.js) 项目。结构混乱，缺陷较多，还请谅解。 17 | 18 | ## ✨ 特性 19 | 20 | 更臃肿的体积换来了更强大的功能。 21 | 22 | - 字母码，用户可自定义子母比例 23 | - 用户可随意编辑页面，包括头像和背景 24 | - 一键导出 `.env` 文件，二维码一键下载 25 | - 也支持传统模式，识别 UA 展示相应二维码/跳转页面 26 | - 支持 ICP 展示 27 | 28 | ## 🛠️ 开始 29 | 30 | ### 部署 31 | 32 | #### 通过 Vercel 一键部署 33 | 34 | [![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Falex3236%2Fpay&demo-title=Pay%20Site&demo-description=A%20simple%20payment%20code%20landing%20page.&demo-url=https%3A%2F%2Fpay.alex3236.top%2F) 35 | 36 | #### 本地开发 37 | 38 | ```bash 39 | $ pnpm install 40 | $ pnpm run dev 41 | ``` 42 | 43 | ### 配置 44 | 45 | 1. 进入设置，调整相关选项 46 | 2. 进入编辑模式，编辑页面内容（图片只有右键编辑 URL 方可保存） 47 | 3. 下载配置文件（`saved.env`），导入为环境变量 48 | 4. 修改环境变量后，可能需要重新部署（Redeploy） 49 | 50 | ### UA 识别功能 51 | 52 | 可在 `已部署站点 - 设置 - 前往更多设置` 中快速生成 53 | 54 | 手动配置：按照以下格式填写 `app_platforms` 环境变量 55 | 56 | ```json5 57 | { 58 | "baidu": { 59 | "match": "MyClient/[0-9\.]+", // 匹配 User-Agent（正则） 60 | "redirect": "https://myclient.example.org/" // 直接跳转 61 | }, 62 | "unipay": { 63 | "match": "Unipay", 64 | "url": "https://unipay.example.org/", // 显示二维码，可长按识别 65 | "tip": "长按识别二维码" // 下方提示 66 | } 67 | } 68 | ``` 69 | 70 | ### 显示 ICP 备案 71 | 72 | 可在 `已部署站点 - 设置 - 前往更多设置` 中快速生成 73 | 74 | 手动配置：按照以下格式编辑 `app_contents` 环境变量 75 | 76 | ```json 77 | "icp": { 78 | "code": "闽ICP备00000000号", 79 | "url": "https://example.org/" 80 | } 81 | ``` 82 | 83 | ### 支付宝扫码白屏 84 | 85 | 尝试使用 Cloudflare 代理域名 86 | 87 | --- 88 | 89 | ```plain 90 | Pay: 一个简单的收款码展示页 91 | 92 | 版权所有 © 2024 Alex3236 93 | 94 | 本程序是自由软件: 您可以根据自由软件基金会发布的 95 | GNU 通用公共许可证第三版，或是您选择的任何更高版 96 | 本中的条款，重新发布和/或修改本程序。 97 | 98 | 本程序发布的目的是希望它能够发挥作用，但不提供任 99 | 何保证；甚至不包括适销性或特定用途适用性的隐含保 100 | 证。有关详细信息，请参阅 GNU 通用公共许可证。 101 | 102 | 您应该已经随本程序一起收到了 GNU 通用公共许可证 103 | 的副本。如果没有，请参阅 104 | 。 105 | ``` 106 | -------------------------------------------------------------------------------- /app/components/background.tsx: -------------------------------------------------------------------------------- 1 | import { toast } from "sonner"; 2 | import { Spinner } from "./icons"; 3 | import { getImageInput, Serializable } from "./utils"; 4 | import React from "react"; 5 | 6 | const Background: React.FC<{ 7 | contents: Serializable; 8 | options: Serializable; 9 | setContents: (arg0: { background: string }) => void; 10 | }> = ({ contents, options, setContents }) => ( 11 |
{ 19 | if (!options.editMode || e.target !== e.currentTarget) return; 20 | const target = e.currentTarget; 21 | const file = await getImageInput(); 22 | if (file) { 23 | target.style.backgroundImage = `url(${URL.createObjectURL(file)})`; 24 | toast.warning('临时背景已更新（不保存）'); 25 | } 26 | }} 27 | onContextMenu={e => { 28 | e.preventDefault(); 29 | if (!options.editMode || e.target !== e.currentTarget) return; 30 | const src = e.currentTarget.style.backgroundImage.slice(5, -2); 31 | const result = prompt( 32 | '请输入背景地址', 33 | src.startsWith('blob:') || src.startsWith('data:') ? '' : src 34 | ); 35 | const resultAttr = `url("${result}")`; 36 | if (result !== null && resultAttr !== e.currentTarget.style.backgroundImage) { 37 | e.currentTarget.style.backgroundImage = resultAttr; 38 | setContents({ ...contents, background: resultAttr }); 39 | toast.success('背景已更新'); 40 | } 41 | }} 42 | >
43 | ); 44 | 45 | const LoadingScreen = React.forwardRef((_, ref) => ( 46 |
55 | 56 |
57 | )); 58 | 59 | LoadingScreen.displayName = 'LoadingScreen'; 60 | 61 | export { Background, LoadingScreen }; 62 | -------------------------------------------------------------------------------- /app/components/buttons.tsx: -------------------------------------------------------------------------------- 1 | import { Ref } from "react"; 2 | import { Serializable } from "./utils"; 3 | import { GithubIcon } from "./icons"; 4 | 5 | interface ButtonGroupProps { 6 | buttonGroup: Ref | undefined; 7 | offlineAlert: Ref | undefined; 8 | options: Serializable; 9 | isModalOpen: boolean | undefined; 10 | setIsModalOpen: (arg0: boolean) => void; 11 | } 12 | 13 | const ButtonGroup: React.FC = ({ buttonGroup, offlineAlert, options, isModalOpen, setIsModalOpen }) => <> 14 |
18 | 30 | 31 | {!options.hideButton && ( 32 | 38 | )} 39 | 40 | 47 | 48 | 49 |
50 | 51 | 52 | const ICPButton: React.FC<{ 53 | contents: Serializable; 54 | }> = ({ contents }) => ( 55 | 66 | ) 67 | 68 | export { ICPButton, ButtonGroup }; -------------------------------------------------------------------------------- /app/components/home.tsx: -------------------------------------------------------------------------------- 1 | 'use client'; 2 | 3 | import dynamic from 'next/dynamic'; 4 | import { Suspense, useEffect, useRef, useState } from 'react'; 5 | import ContentEditable, { ContentEditableEvent } from 'react-contenteditable'; 6 | import { 7 | isOffline, 8 | Serializable, 9 | useStorage 10 | } from '@/app/components/utils'; 11 | import { toast } from 'sonner'; 12 | import FileSaver from 'file-saver'; 13 | import DomToImage from 'dom-to-image-more'; 14 | import { Background, LoadingScreen } from './background'; 15 | import { Avartar, Description } from './infomation'; 16 | import SettingsModal from './modal'; 17 | import { ButtonGroup, ICPButton } from './buttons'; 18 | 19 | const DynamicQRCode = dynamic(() => import('@/app/components/qrcode'), { 20 | ssr: false 21 | }); 22 | 23 | interface Options { 24 | loaded?: boolean; 25 | editMode?: boolean; 26 | dualCode?: boolean; 27 | hideButton?: boolean; 28 | 29 | [key: string]: boolean | number | undefined; 30 | } 31 | 32 | export default function Home(props: { url?: string; tip?: string }) { 33 | const [isModalOpen, setIsModalOpen] = useState(false); 34 | const [options, setOptions] = useStorage( 35 | 'options', 36 | { 37 | hideButton: props.url !== undefined 38 | }, 39 | { hideButton: true } 40 | ); 41 | const [contents, setContents] = useStorage('contents', {}); 42 | const [mounted, setMounted] = useState(false); 43 | 44 | const mainContainer = useRef(null); 45 | const loadingScreen = useRef(null); 46 | const buttonGroup = useRef(null); 47 | const offlineAlert = useRef(null); 48 | const avatarImage = useRef(null); 49 | 50 | const toggleOption = (opt: string) => { 51 | setOptions({ ...options, [opt]: !(options[opt] === true) }); 52 | }; 53 | 54 | const handleEditable = (e: ContentEditableEvent) => { 55 | const id = e.currentTarget?.id; 56 | if (id) { 57 | setContents({ ...contents, [id]: e.target.value }); 58 | } 59 | }; 60 | 61 | const getContent = (id: string, fallback: string) => { 62 | return contents[id] ?? fallback; 63 | }; 64 | 65 | const saveScreenShot = async () => { 66 | 67 | toast.dismiss(); 68 | 69 | const bg = document.getElementById('background'); 70 | 71 | if ( 72 | !mainContainer.current || 73 | !loadingScreen.current || 74 | !bg || 75 | loadingScreen.current.style.display !== 'none' 76 | ) { 77 | return; 78 | } 79 | 80 | const reset = () => { 81 | if ( 82 | loadingScreen.current && 83 | mainContainer.current && 84 | bg 85 | ) { 86 | loadingScreen.current.style.display = 'none'; 87 | if (buttonGroup.current) 88 | buttonGroup.current.style.display = ''; 89 | mainContainer.current.style.width = ''; 90 | mainContainer.current.style.height = ''; 91 | bg.style.borderRadius = ''; 92 | } 93 | }; 94 | const timeout = setTimeout(reset, 15000); 95 | loadingScreen.current.style.display = ''; 96 | if (buttonGroup.current) 97 | buttonGroup.current.style.display = 'none'; 98 | mainContainer.current.style.width = 'fit-content'; 99 | mainContainer.current.style.height = 'fit-content'; 100 | bg.style.borderRadius = '1.2rem'; 101 | document 102 | .querySelectorAll('[srcset], [imagesrcset]') 103 | .forEach(e => { 104 | e.removeAttribute('srcset'); 105 | e.removeAttribute('imagesrcset'); 106 | }); 107 | try { 108 | const image = await DomToImage.toBlob( 109 | mainContainer.current, 110 | { 111 | scale: 1.5, 112 | copyDefaultStyles: false, 113 | filter: (node: Element) => { 114 | return !['loading-screen', 'icp'].includes( 115 | node.id 116 | ); 117 | } 118 | } 119 | ); 120 | FileSaver.saveAs(image, 'qrcode.png'); 121 | } catch (e) { 122 | toast.error('保存失败'); 123 | console.error(e); 124 | } 125 | reset(); 126 | clearTimeout(timeout); 127 | } 128 | 129 | useEffect(() => { 130 | setMounted(true); 131 | }, []); 132 | 133 | useEffect(() => { 134 | if (mounted) { 135 | if (isOffline()) { 136 | if (offlineAlert.current) offlineAlert.current.style.display = ''; 137 | } 138 | if (contents.title) { 139 | document.title = contents.title; 140 | } 141 | console.log( 142 | atob( 143 | 'CiAgICBfX18KICAgIC8gXyBcX19fIF9fXyBfXwogICAvIF9fXy8gXyBgLyAvLyAvCiAgL18vICAgXF8sXy9cXywgLwogICAgICAgICAgICAvX19fLwoK' 144 | ), 145 | 'https://github.com/alex3236/pay' 146 | ); 147 | } 148 | }, [contents.title, mounted]); 149 | 150 | return ( 151 | <> 152 |
156 | 157 | 158 |
159 |
160 | 166 |
167 | 168 |
169 | 174 |
175 | 176 |
177 | 178 | 188 | 189 |
190 |
191 | 199 |
200 | 201 | 208 | 209 | {contents.icp?.url !== undefined && } 210 | 211 | {/* Modal */} 212 | {isModalOpen && ( 213 | 222 | )} 223 |
224 |
225 | 226 | ); 227 | } 228 | -------------------------------------------------------------------------------- /app/components/icons.tsx: -------------------------------------------------------------------------------- 1 | import { ComponentProps } from 'react'; 2 | 3 | const Spinner = () => { 4 | return ( 5 | 21 | ); 22 | }; 23 | 24 | const GithubIcon = (props: ComponentProps<'svg'>) => { 25 | return ( 26 | 41 | ); 42 | }; 43 | 44 | export { Spinner, GithubIcon }; 45 | -------------------------------------------------------------------------------- /app/components/infomation.tsx: -------------------------------------------------------------------------------- 1 | import { toast } from "sonner"; 2 | import { decodeAvatarSrc, encodeAvatarSrc, getImageInput, Serializable } from "./utils"; 3 | import Image from "next/image"; 4 | import { Ref } from "react"; 5 | import ContentEditable, { ContentEditableEvent } from "react-contenteditable"; 6 | 7 | 8 | const Avartar: React.FC<{ 9 | avatarImage: Ref; 10 | options: Serializable; 11 | contents: Serializable; 12 | setContents: (arg0: { avatar: string }) => void; 13 | }> = ({ avatarImage, options, contents, setContents }) => ( 14 | { 22 | if (!options.editMode) return; 23 | const target = e.currentTarget; 24 | const file = await getImageInput(); 25 | if (file) { 26 | target.srcset = ''; 27 | target.src = URL.createObjectURL(file); 28 | toast.warning('临时头像已更新（不保存）'); 29 | } 30 | }} 31 | onContextMenu={(e: { preventDefault: () => void; currentTarget: { src: string; }; }) => { 32 | e.preventDefault(); 33 | if (!options.editMode) return; 34 | const src = decodeAvatarSrc(e.currentTarget.src); 35 | 36 | let result = prompt( 37 | '请输入头像地址\n支持：/*, qq/[qq_number], github/[username]', 38 | src 39 | ); 40 | result = encodeAvatarSrc(result); 41 | if (result && result !== e.currentTarget.src) { 42 | e.currentTarget.src = result; 43 | setContents({ 44 | ...contents, 45 | avatar: result 46 | }); 47 | toast.success('头像已更新'); 48 | } 49 | }} 50 | src={contents.avatar || '/blank.gif'} 51 | alt="Profile Image" 52 | /> 53 | ) 54 | 55 | const Description: React.FC<{ 56 | handleEditable: (event: ContentEditableEvent) => void; 57 | options: Serializable; 58 | getContent: (arg0: string, arg1: string) => string; 59 | }> = ({ handleEditable, options, getContent }) => ( 60 | <> 61 | 69 | 77 | 78 | ); 79 | 80 | export { Avartar, Description }; 81 | -------------------------------------------------------------------------------- /app/components/modal.tsx: -------------------------------------------------------------------------------- 1 | import { saveStorageAsFile, Serializable } from "./utils"; 2 | import Link from "next/link"; 3 | 4 | interface SettingsModalProps { 5 | contents: Serializable; 6 | setContents: (arg0: { title?: string; meta?: string; }) => void; 7 | setIsModalOpen: (arg0: boolean) => void; 8 | options: Serializable; 9 | setOptions: (arg0: { childRatio: number; }) => void; 10 | toggleOption: (arg0: string) => void; 11 | saveScreenshot: () => Promise; 12 | } 13 | 14 | const SettingsModal: React.FC = ({ contents, setContents, setIsModalOpen, options, setOptions, toggleOption, saveScreenshot }) => ( 15 |
19 |
20 |

设置

21 | 22 | 41 | 42 | 64 | 65 | 74 | 75 |

76 | 编辑模式下，你可以自由编辑页面内容。 77 |
78 | 数据储存在浏览器本地，清除网站数据后页面恢复为默认状态。 79 |

80 | 81 | 90 | 91 |

92 | 子母模式下，可以将两个二维码合并展示。 93 |
94 | 一般用于合并微信、支付宝收款码。 95 |

96 | 97 |
102 | 128 | 129 |

130 | 子码比例为子码相对于主码的尺寸。 131 |
132 | 您可根据识别成功率自由调整。 133 |

134 |
135 | 136 | 145 | 146 |

153 | 隐藏设置按钮后，您需要手动修改浏览器本地存储空间或重置网站数据，以再次打开设置面板。 154 |

155 | 156 | {/* Download JSON Button */} 157 | 163 | 164 | {/* Download Image Button */} 165 | 176 | 177 | 195 | 196 | {/* Close Button */} 197 | 198 | 203 | 204 | 205 | 213 |
214 |
215 | ) 216 | 217 | export default SettingsModal; 218 | -------------------------------------------------------------------------------- /app/components/qrcode.tsx: -------------------------------------------------------------------------------- 1 | import { Jimp, JimpInstance, JimpMime } from 'jimp'; 2 | import jsQR from 'jsqr'; 3 | import { Component, HTMLAttributes, MouseEventHandler } from 'react'; 4 | import { toast } from 'sonner'; 5 | import QRCodeCanvas, { ErrorCorrectionLevel } from 'styled-qr-code'; 6 | 7 | import { fromStorage, getEnv, getImageInput, saveToStorage, Serializable } from './utils'; 8 | import { deepEqual } from 'fast-equals'; 9 | import Image from 'next/image'; 10 | 11 | function parseBigImage(image: JimpInstance, scale: number): JimpInstance { 12 | const w = image.width * scale; 13 | const h = image.height * scale; 14 | const x = image.width - w; 15 | const y = image.height - h; 16 | image.scan(x, y, w, h, (x, y) => { 17 | image.setPixelColor(0x00000000, x, y); 18 | }); 19 | return image; 20 | } 21 | 22 | interface QRCodeProps extends HTMLAttributes { 23 | url?: string; 24 | editmode?: string; 25 | childratio?: string; 26 | } 27 | 28 | interface QRCodeState { 29 | qrData: { 30 | [key: string]: string; 31 | }; 32 | data: { 33 | [key: string]: string; 34 | }; 35 | editMode?: boolean; 36 | childRatio?: number; 37 | } 38 | 39 | class DynamicQRCode extends Component { 40 | state: QRCodeState; 41 | qr: QRCodeCanvas; 42 | defaultVal?: Serializable; 43 | 44 | constructor(props: QRCodeProps) { 45 | super(props); 46 | 47 | this.defaultVal = getEnv('qrCodeContent', { 48 | main: props.url ?? 'Hello React World awa', 49 | child: "Wow that's awesome" 50 | }); 51 | 52 | this.state = { 53 | editMode: this.props.editmode === 'true', 54 | childRatio: parseFloat(this.props.childratio ?? '0'), 55 | qrData: {}, 56 | data: fromStorage('qrCodeContent', this.defaultVal) 57 | }; 58 | 59 | this.handleQRCodeClick = this.handleQRCodeClick.bind(this); 60 | 61 | this.qr = new QRCodeCanvas({ 62 | data: this.state.data.main, 63 | width: 235, 64 | height: 235, 65 | margin: 0, 66 | qrOptions: { 67 | errorCorrectionLevel: 'H' 68 | }, 69 | dotsOptions: { 70 | type: 'extra-rounded' 71 | }, 72 | cornersSquareOptions: { 73 | type: 'extra-rounded' 74 | }, 75 | cornersDotOptions: { 76 | type: 'dot' 77 | }, 78 | backgroundOptions: { 79 | color: '#00000000' 80 | } 81 | }); 82 | } 83 | 84 | // Lifecycle method similar to the `useEffect` hook 85 | async componentDidMount() { 86 | await this.generateQRCode(); 87 | } 88 | 89 | componentDidUpdate(prevProps: QRCodeProps, prevState: QRCodeState) { 90 | if (!deepEqual(this.state.data, prevState.data) || !deepEqual(this.props, prevProps)) { 91 | this.setState( 92 | { 93 | editMode: this.props.editmode === 'true', 94 | childRatio: parseFloat(this.props.childratio ?? '0') 95 | }, 96 | async () => { 97 | await this.generateQRCode(); 98 | } 99 | ); 100 | if (!deepEqual(this.state.data, this.defaultVal)) { 101 | saveToStorage(this.state.data, 'qrCodeContent'); 102 | } 103 | } 104 | } 105 | 106 | async getQRCode( 107 | data: string, 108 | level?: ErrorCorrectionLevel, 109 | parse?: number, 110 | rotate?: number 111 | ): Promise { 112 | this.qr.update({ 113 | qrOptions: { 114 | errorCorrectionLevel: level ?? 'H' 115 | }, 116 | data: data 117 | }); 118 | const url = await this.qr.toDataUrl('jpg'); 119 | const image = await Jimp.read(url); 120 | image.autocrop(); 121 | image.rotate(rotate ?? 0); 122 | if (parse) { 123 | parseBigImage(image as unknown as JimpInstance, parse); 124 | } 125 | return await image.getBase64(JimpMime.png); 126 | } 127 | 128 | async generateQRCode() { 129 | const main = await this.getQRCode( 130 | this.state.data.main, 131 | 'H', 132 | this.state.childRatio ?? undefined 133 | ); 134 | const child = this.state.childRatio 135 | ? await this.getQRCode(this.state.data.child, 'L', undefined, 180) 136 | : undefined; 137 | 138 | this.setState({ 139 | qrData: { 140 | main: main, 141 | child: child 142 | } 143 | }); 144 | } 145 | 146 | handleQRCodeClick: MouseEventHandler = async e => { 147 | e.preventDefault(); 148 | const name = e.currentTarget.getAttribute('data-name') ?? ''; 149 | const current = this.state.data[name]; 150 | 151 | if (!this.state.editMode) return; 152 | 153 | if (e.type === 'contextmenu') { 154 | const result = prompt('请输入二维码内容', current); 155 | if (result === null) return; 156 | if (result && result !== current) { 157 | this.setState({ data: { ...this.state.data, [name]: result } }); 158 | toast.success('二维码内容已更新'); 159 | } else { 160 | toast.info('二维码内容无变化'); 161 | } 162 | return; 163 | } 164 | 165 | try { 166 | const file = await getImageInput(); // Assume this function gets an image file from user input. 167 | if (file) { 168 | const reader = new FileReader(); 169 | reader.onloadend = async () => { 170 | if (reader.result) { 171 | const img = await Jimp.read(reader.result); 172 | const decoded = jsQR( 173 | img.bitmap.data as unknown as Uint8ClampedArray, 174 | img.bitmap.width, 175 | img.bitmap.height 176 | ); 177 | if (decoded) { 178 | if (decoded.data !== current) { 179 | this.setState({ 180 | data: { 181 | ...this.state.data, 182 | [name]: decoded.data 183 | } 184 | }); 185 | // this.setState({data: {main: decoded.data, child: this.state.data.child}}); 186 | toast.success('二维码已更换'); 187 | } else { 188 | toast.info('二维码内容无变化'); 189 | } 190 | } else { 191 | toast.error('无法解析二维码'); 192 | } 193 | } 194 | }; 195 | reader.readAsDataURL(file); // Read image as Data URL (base64). 196 | } 197 | } catch (error) { 198 | console.error('Error selecting file:', error); 199 | } 200 | }; 201 | 202 | render() { 203 | const { qrData, data } = this.state; 204 | const { ...props } = this.props; 205 | 206 | return ( 207 |
208 | {data.url 219 | {data.url 236 |
237 | ); 238 | } 239 | } 240 | 241 | export default DynamicQRCode; 242 | -------------------------------------------------------------------------------- /app/components/utils.tsx: -------------------------------------------------------------------------------- 1 | import { Dispatch, SetStateAction, useEffect, useState } from 'react'; 2 | import { deepEqual } from 'fast-equals'; 3 | import FileSaver from 'file-saver'; 4 | 5 | export const env = process.env.exposed ? JSON.parse(process.env.exposed) : {}; 6 | 7 | export interface Serializable { 8 | [key: string]: any; // eslint-disable-line 9 | } 10 | 11 | const prefix = process.env.prefix || ''; 12 | 13 | export const getEnv = (key: string, fallback?: Serializable): Serializable | undefined => { 14 | if (env[key]) { 15 | return JSON.parse(env[key]); 16 | } 17 | return fallback; 18 | }; 19 | 20 | export const fromStorage = (key: string, defaultVal: Serializable = {}): Serializable => { 21 | const val = localStorage.getItem(prefix + key); 22 | try { 23 | return val ? JSON.parse(val) : defaultVal; 24 | } catch (e) { 25 | console.warn(`Failed to load ${key} from storage:`, e); 26 | return defaultVal; 27 | } 28 | }; 29 | 30 | export function useStorage( 31 | key: string, 32 | defaultVal?: Serializable, 33 | initVal: Serializable = {} 34 | ): [S, Dispatch>] { 35 | defaultVal = getEnv(key) || defaultVal; 36 | const [value, setter] = useState({ 37 | ...initVal, 38 | loaded: false 39 | } as unknown as S); 40 | useEffect(() => { 41 | setter(fromStorage(key, defaultVal) as unknown as S); 42 | }, [key]); 43 | useEffect(() => { 44 | if (value.loaded === false) return; 45 | if (!deepEqual(value, defaultVal)) { 46 | saveToStorage(value, key); 47 | } else { 48 | removeStorage(key); 49 | } 50 | }, [value]); 51 | return [value, setter]; 52 | } 53 | 54 | export const removeStorage = (key: string) => { 55 | localStorage.removeItem(prefix + key); 56 | }; 57 | 58 | export const saveToStorage = (val: Serializable, key: string) => { 59 | if (val.loaded !== false) { 60 | const filteredVal = Object.entries(val).reduce( 61 | (acc: { [key: string]: string }, [key, value]) => { 62 | if (value !== '') { 63 | // prevent empty strings from being saved 64 | acc[key] = value; 65 | } 66 | return acc; 67 | }, 68 | {} 69 | ); 70 | localStorage.setItem(prefix + key, JSON.stringify(filteredVal)); 71 | } 72 | }; 73 | 74 | export const isOffline = () => { 75 | try { 76 | const envVariables = Object.keys(localStorage).filter(key => key.startsWith(prefix)); 77 | return envVariables.length > 0; 78 | } catch { 79 | return false; 80 | } 81 | }; 82 | 83 | export const saveStorageAsFile = () => { 84 | const envVariables = Object.keys(localStorage) 85 | .filter(key => key.startsWith(prefix)) 86 | .reduce((acc: string[], key) => { 87 | acc.push(`${key}=${localStorage[key]}`); 88 | return acc; 89 | }, []); 90 | const envContent = envVariables.join('\n'); 91 | FileSaver.saveAs(new Blob([envContent], { type: 'text/plain' }), 'saved.env'); 92 | }; 93 | 94 | export const getImageInput = (): Promise => { 95 | return new Promise((resolve, reject) => { 96 | // 创建 input 元素 97 | const i = document.createElement('input'); 98 | i.type = 'file'; 99 | i.accept = 'image/*'; 100 | 101 | // 监听文件选择事件 102 | i.onchange = e => { 103 | const input = e.target as HTMLInputElement; 104 | if (input.files && input.files.length > 0) { 105 | resolve(input.files[0]); // 如果有文件，返回第一个文件 106 | } else { 107 | resolve(null); // 没有选择文件，返回 null 108 | } 109 | }; 110 | 111 | i.onerror = () => reject(new Error('File selection failed')); // 如果发生错误，返回 reject 112 | 113 | // 模拟点击 input，打开文件选择对话框 114 | i.click(); 115 | }); 116 | }; 117 | 118 | export const decodeAvatarSrc = (src: string) => { 119 | if (src.startsWith('blob:') || src.startsWith('data:')) { 120 | return ''; 121 | } 122 | if (src.indexOf('_next/image?url=') !== -1) { 123 | src = decodeURIComponent(src.slice(src.indexOf('image?url=') + 10)); 124 | } 125 | const qqMatch = src.match( 126 | /^https:\/\/q1.qlogo.cn\/g\?b=qq&nk=([0-9]+)&s=640(&w=[0-9]+&q=[0-9]+)?$/ 127 | ); 128 | if (qqMatch) { 129 | src = `qq/${qqMatch[1]}`; 130 | } 131 | const githubMatch = src.match( 132 | /^https:\/\/avatars.githubusercontent.com\/(\w+)(&w=[0-9]+&q=[0-9]+)?$/ 133 | ); 134 | if (githubMatch) { 135 | src = `github/${githubMatch[1]}`; 136 | } 137 | return src; 138 | }; 139 | 140 | export const encodeAvatarSrc = (src: string | null) => { 141 | const qqMatch = src?.match(/^qq\/([0-9]+)$/); 142 | if (qqMatch) { 143 | src = `https://q1.qlogo.cn/g?b=qq&nk=${qqMatch[1]}&s=640`; 144 | } 145 | const githubMatch = src?.match(/^github\/(\w+)$/); 146 | if (githubMatch) { 147 | src = `https://avatars.githubusercontent.com/${githubMatch[1]}`; 148 | } 149 | return src; 150 | }; 151 | -------------------------------------------------------------------------------- /app/dom-to-image-more.d.ts: -------------------------------------------------------------------------------- 1 | // https://github.com/1904labs/dom-to-image-more?tab=readme-ov-file#using-typescript 2 | declare module 'dom-to-image-more' { 3 | export = require('dom-to-image'); // eslint-disable-line 4 | } 5 | -------------------------------------------------------------------------------- /app/env-gen/page.tsx: -------------------------------------------------------------------------------- 1 | 'use client'; 2 | 3 | import { useState } from 'react'; 4 | import FileSaver from 'file-saver'; 5 | 6 | const saveAsFile = (str: string) => { 7 | FileSaver.saveAs(new Blob([str], { type: 'text/plain' }), Date.now() + '.env'); 8 | }; 9 | 10 | const EnvGenPage = () => { 11 | const [platforms, setPlatforms] = useState([ 12 | { name: '', match: '', redirect: '', url: '', tip: '', option: 'redirect' } 13 | ]); 14 | const [icpCode, setIcpCode] = useState(''); 15 | const [icpUrl, setIcpUrl] = useState(''); 16 | const [envContent, setEnvContent] = useState(''); 17 | 18 | const addPlatform = () => { 19 | setPlatforms([ 20 | ...platforms, 21 | { name: '', match: '', redirect: '', url: '', tip: '', option: 'redirect' } 22 | ]); 23 | }; 24 | 25 | const removePlatform = (index: number) => { 26 | const newPlatforms = platforms.filter((_, i) => i !== index); 27 | setPlatforms(newPlatforms); 28 | }; 29 | 30 | const handlePlatformChange = (index: number, field: string, value: string) => { 31 | const newPlatforms = platforms.map((platform, i) => 32 | i === index ? { ...platform, [field]: value } : platform 33 | ); 34 | setPlatforms(newPlatforms); 35 | }; 36 | 37 | const isValidName = (name: string) => /^[A-Za-z0-9_]+$/.test(name); 38 | 39 | const generateEnv = () => { 40 | const invalidPlatforms = platforms.filter( 41 | platform => 42 | !isValidName(platform.name) || 43 | !platform.match || 44 | (!platform.redirect && !platform.url) 45 | ); 46 | 47 | if (invalidPlatforms.length > 0) { 48 | alert('请确保所有平台都有有效的名称、匹配正则和重定向或URL。'); 49 | return; 50 | } 51 | 52 | const appPlatforms = platforms.reduce((acc: { [key: string]: any }, platform) => { // eslint-disable-line 53 | acc[platform.name] = { 54 | match: platform.match, 55 | ...(platform.redirect ? { redirect: platform.redirect } : {}), 56 | ...(platform.url ? { url: platform.url } : {}), 57 | ...(platform.tip ? { tip: platform.tip } : {}) 58 | }; 59 | return acc; 60 | }, {}); 61 | 62 | const appContents = { 63 | icp: { 64 | code: icpCode, 65 | url: icpUrl 66 | } 67 | }; 68 | 69 | const envContent = `app_platforms=${JSON.stringify(appPlatforms)}\napp_contents=${JSON.stringify(appContents)}`; 70 | setEnvContent(envContent); 71 | }; 72 | 73 | return ( 74 |
75 |

76 | .env 生成器 77 |

78 |

79 | 如需在已部署站点使用编辑模式，请先将此页面生成的 .env 导入 80 |
81 | 避免编辑模式生成内容覆盖下述字段 82 |

83 | {platforms.map((platform, index) => ( 84 |
88 | handlePlatformChange(index, 'name', e.target.value)} 93 | className="block w-full mb-2 p-2 border rounded-md bg-gray-50 dark:bg-gray-700 border-gray-300 dark:border-gray-600 text-gray-900 dark:text-gray-100 placeholder-gray-400 dark:placeholder-gray-500 transition-colors" 94 | /> 95 | handlePlatformChange(index, 'match', e.target.value)} 100 | className="block w-full mb-2 p-2 border rounded-md bg-gray-50 dark:bg-gray-700 border-gray-300 dark:border-gray-600 text-gray-900 dark:text-gray-100 placeholder-gray-400 dark:placeholder-gray-500 transition-colors" 101 | /> 102 |
103 | 116 | 129 |
130 | {platform.option === 'redirect' && ( 131 | handlePlatformChange(index, 'redirect', e.target.value)} 136 | className="block w-full mb-2 p-2 border rounded-md bg-gray-50 dark:bg-gray-700 border-gray-300 dark:border-gray-600 text-gray-900 dark:text-gray-100 placeholder-gray-400 dark:placeholder-gray-500 transition-colors" 137 | /> 138 | )} 139 | {platform.option === 'showCode' && ( 140 | <> 141 | handlePlatformChange(index, 'url', e.target.value)} 146 | className="block w-full mb-2 p-2 border rounded-md bg-gray-50 dark:bg-gray-700 border-gray-300 dark:border-gray-600 text-gray-900 dark:text-gray-100 placeholder-gray-400 dark:placeholder-gray-500 transition-colors" 147 | /> 148 | handlePlatformChange(index, 'tip', e.target.value)} 153 | className="block w-full mb-2 p-2 border rounded-md bg-gray-50 dark:bg-gray-700 border-gray-300 dark:border-gray-600 text-gray-900 dark:text-gray-100 placeholder-gray-400 dark:placeholder-gray-500 transition-colors" 154 | /> 155 | 156 | )} 157 | 163 |
164 | ))} 165 | 171 |
172 | setIcpCode(e.target.value)} 177 | className="block w-full mb-2 p-2 border rounded-md bg-gray-50 dark:bg-gray-700 border-gray-300 dark:border-gray-600 text-gray-900 dark:text-gray-100 placeholder-gray-400 dark:placeholder-gray-500 transition-colors" 178 | /> 179 | setIcpUrl(e.target.value)} 184 | className="block w-full mb-2 p-2 border rounded-md bg-gray-50 dark:bg-gray-700 border-gray-300 dark:border-gray-600 text-gray-900 dark:text-gray-100 placeholder-gray-400 dark:placeholder-gray-500 transition-colors" 185 | /> 186 |
187 | 193 | {envContent && ( 194 | <> 195 | 
{envContent}
196 | 202 | 203 | )} 204 |
205 | ); 206 | }; 207 | 208 | export default EnvGenPage; 209 | -------------------------------------------------------------------------------- /app/globals.css: -------------------------------------------------------------------------------- 1 | @tailwind base; 2 | @tailwind components; 3 | @tailwind utilities; 4 | 5 | :root { 6 | --background: #ffffff; 7 | --foreground: #171717; 8 | } 9 | 10 | @media (prefers-color-scheme: dark) { 11 | :root { 12 | --background: #0a0a0a; 13 | --foreground: #ededed; 14 | } 15 | } 16 | 17 | body { 18 | color: var(--foreground); 19 | background: var(--background); 20 | font-family: Arial, Helvetica, sans-serif; 21 | } 22 | 23 | @layer utilities { 24 | .text-balance { 25 | text-wrap: balance; 26 | } 27 | } 28 | 29 | @layer base { 30 | input[type="number"]::-webkit-inner-spin-button, 31 | input[type="number"]::-webkit-outer-spin-button { 32 | -webkit-appearance: none; 33 | margin: 0; 34 | } 35 | } 36 | 37 | @layer components { 38 | .hue { 39 | filter: invert(.35) sepia(1) hue-rotate(176deg); 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /app/layout.tsx: -------------------------------------------------------------------------------- 1 | import './globals.css'; 2 | import { Toaster } from 'sonner'; 3 | import { ReactNode } from 'react'; 4 | import { Metadata } from 'next'; 5 | 6 | let title: string | undefined; 7 | let description: string | undefined; 8 | 9 | try { 10 | if (process.env.app_contents) { 11 | const contents = JSON.parse(process.env.app_contents); 12 | title = contents.title; 13 | description = contents.meta; 14 | } 15 | } catch { } 16 | 17 | export const metadata: Metadata = { 18 | title: title ?? 'QR Code Generator', 19 | description: description ?? 'A landing page for QR codes', 20 | authors: [ 21 | { 22 | name: 'Alex3236', 23 | url: 'https://alex3236.top' 24 | } 25 | ], 26 | icons: { 27 | icon: '/favicon.png' 28 | } 29 | }; 30 | 31 | export default function RootLayout({ children }: { children: ReactNode }) { 32 | return ( 33 | 34 | 35 | {children} 36 | 37 | 38 | 39 | ); 40 | } 41 | -------------------------------------------------------------------------------- /app/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "app", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "private": true 10 | } 11 | -------------------------------------------------------------------------------- /app/page.tsx: -------------------------------------------------------------------------------- 1 | import Home from "./components/home"; 2 | 3 | export default function Main() { 4 | return ; 5 | } 6 | -------------------------------------------------------------------------------- /app/viewport/[platform]/page.tsx: -------------------------------------------------------------------------------- 1 | import Home from '../../components/home'; 2 | 3 | const env = process.env.exposed ? JSON.parse(process.env.exposed) : {}; 4 | 5 | export default function Main({ params }: { params: { platform: string } }) { 6 | if (params.platform != 'unknown') { 7 | const platforms = env['platforms'] !== undefined ? JSON.parse(env['platforms']) : {}; 8 | const settings = platforms[params.platform]; 9 | return ; 10 | } 11 | return ; 12 | } -------------------------------------------------------------------------------- /middleware.ts: -------------------------------------------------------------------------------- 1 | import { NextRequest, NextResponse, userAgent } from 'next/server' 2 | import { getEnv } from './app/components/utils' 3 | 4 | const platforms = getEnv('platforms', undefined); 5 | 6 | 7 | export const config = { 8 | matcher: '/', 9 | } 10 | 11 | export default function middleware(req: NextRequest) { 12 | const { ua } = userAgent(req) 13 | var platform; 14 | var id; 15 | 16 | for (const i in platforms) { 17 | if (new RegExp(platforms[i].match).test(ua)) { 18 | platform = platforms[i]; 19 | id = i; 20 | break; 21 | } 22 | } 23 | 24 | if (platform?.redirect !== undefined) { 25 | NextResponse.rewrite 26 | return NextResponse.redirect(platform.redirect, 303) 27 | } 28 | 29 | if (id !== undefined) { 30 | return NextResponse.rewrite(new URL(`viewport/${id}`, req.url)) 31 | } 32 | 33 | if (platforms !== undefined) { 34 | return NextResponse.rewrite(new URL('viewport/unknown', req.url)) 35 | } 36 | 37 | return NextResponse.next(); 38 | } 39 | -------------------------------------------------------------------------------- /next.config.mjs: -------------------------------------------------------------------------------- 1 | const prefix = 'app_' 2 | 3 | const envVariables = Object.keys(process.env) 4 | .filter((key) => key.startsWith(prefix)) 5 | .reduce((acc, key) => { 6 | acc[key.substring(prefix.length)] = process.env[key] 7 | return acc 8 | }, {}) 9 | 10 | /** @type {import('next').NextConfig} */ 11 | const nextConfig = { 12 | swcMinify: false, 13 | env: { 14 | prefix: prefix, 15 | exposed: JSON.stringify(envVariables) 16 | }, 17 | images: { 18 | remotePatterns: [ 19 | // https://q1.qlogo.cn/g?b=qq&nk=2706992599&s=640 20 | { 21 | protocol: 'https', 22 | hostname: 'q1.qlogo.cn', 23 | pathname: '/g' 24 | }, 25 | // https://avatars.githubusercontent.com/alex3236 26 | { 27 | protocol: 'https', 28 | hostname: 'avatars.githubusercontent.com', 29 | pathname: '/*' 30 | } 31 | ] 32 | } 33 | } 34 | 35 | export default nextConfig 36 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "pay", 3 | "author": "alex3236", 4 | "description": "A landing page for QR codes", 5 | "version": "0.2.0", 6 | "private": true, 7 | "scripts": { 8 | "dev": "next dev", 9 | "build": "next build", 10 | "start": "next start", 11 | "lint": "next lint" 12 | }, 13 | "dependencies": { 14 | "@loskir/styled-qr-code-node": "^1.5.2", 15 | "@paulmillr/qr": "^0.2.0", 16 | "@solana/qr-code-styling": "^1.6.0", 17 | "@vercel/speed-insights": "^1.0.12", 18 | "dom-to-image-more": "^3.4.5", 19 | "fast-deep-equal": "^3.1.3", 20 | "fast-equals": "^5.0.1", 21 | "file-saver": "^2.0.5", 22 | "jimp": "^1.6.0", 23 | "jsqr": "^1.4.0", 24 | "next": "14.2.12", 25 | "react": "^18", 26 | "react-contenteditable": "^3.3.7", 27 | "react-dom": "^18", 28 | "sharp": "^0.33.5", 29 | "skia-canvas": "^1.0.2", 30 | "sonner": "^1.5.0", 31 | "styled-qr-code": "^1.0.0" 32 | }, 33 | "devDependencies": { 34 | "@types/dom-to-image": "^2.6.7", 35 | "@types/file-saver": "^2.0.7", 36 | "@types/node": "^20", 37 | "@types/react": "^18", 38 | "@types/react-dom": "^18", 39 | "eslint": "^8", 40 | "eslint-config-next": "14.2.12", 41 | "postcss": "^8", 42 | "prettier": "^3.3.3", 43 | "tailwindcss": "^3.4.1", 44 | "typescript": "^5" 45 | } 46 | } 47 | -------------------------------------------------------------------------------- /postcss.config.mjs: -------------------------------------------------------------------------------- 1 | /** @type {import('postcss-load-config').Config} */ 2 | const config = { 3 | plugins: { 4 | tailwindcss: {}, 5 | }, 6 | }; 7 | 8 | export default config; 9 | -------------------------------------------------------------------------------- /public/bg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/alex3236/pay/69be14f3775254da241edb4493b4874f8804109d/public/bg.png -------------------------------------------------------------------------------- /public/blank.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/alex3236/pay/69be14f3775254da241edb4493b4874f8804109d/public/blank.gif -------------------------------------------------------------------------------- /public/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/alex3236/pay/69be14f3775254da241edb4493b4874f8804109d/public/favicon.png -------------------------------------------------------------------------------- /tailwind.config.ts: -------------------------------------------------------------------------------- 1 | import type {Config} from "tailwindcss"; 2 | 3 | const config: Config = { 4 | content: [ 5 | "./pages/**/*.{js,ts,jsx,tsx,mdx}", 6 | "./components/**/*.{js,ts,jsx,tsx,mdx}", 7 | "./app/**/*.{js,ts,jsx,tsx,mdx}", 8 | ], 9 | theme: { 10 | extend: { 11 | colors: { 12 | background: "var(--background)", 13 | foreground: "var(--foreground)", 14 | }, 15 | height: { 16 | 'fill': '-webkit-fill-available' 17 | }, 18 | width: { 19 | 'fill': '-webkit-fill-available' 20 | }, 21 | }, 22 | }, 23 | plugins: [], 24 | }; 25 | export default config; 26 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "lib": ["dom", "dom.iterable", "esnext"], 4 | "allowJs": true, 5 | "skipLibCheck": true, 6 | "strict": true, 7 | "noEmit": true, 8 | "esModuleInterop": true, 9 | "module": "esnext", 10 | "moduleResolution": "bundler", 11 | "resolveJsonModule": true, 12 | "isolatedModules": true, 13 | "jsx": "preserve", 14 | "incremental": true, 15 | "plugins": [ 16 | { 17 | "name": "next" 18 | } 19 | ], 20 | "paths": { 21 | "@/*": ["./*"] 22 | } 23 | }, 24 | "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"], 25 | "exclude": ["node_modules"] 26 | } 27 | --------------------------------------------------------------------------------