From 50fafa9b7f4360ba6399b1b9a16fcaf0230c904f Mon Sep 17 00:00:00 2001
From: Vanessa <lly219@gmail.com>
Date: Wed, 19 Mar 2025 17:23:11 +0800
Subject: [PATCH] :art: https://github.com/siyuan-note/siyuan/issues/14159

---
 app/src/config/account.ts          | 64 ++++++++++++++++++++++++++----
 app/src/mobile/settings/account.ts |  2 +-
 2 files changed, 57 insertions(+), 9 deletions(-)

diff --git a/app/src/config/account.ts b/app/src/config/account.ts
index ece1f94da..b6c14eae5 100644
--- a/app/src/config/account.ts
+++ b/app/src/config/account.ts
@@ -5,12 +5,13 @@ import {fetchPost} from "../util/fetch";
 import {repos} from "./repos";
 import {confirmDialog} from "../dialog/confirmDialog";
 import {hasClosestByClassName} from "../protyle/util/hasClosest";
-import {getEventName, isIPad} from "../protyle/util/compatibility";
+import {getEventName, isInIOS} from "../protyle/util/compatibility";
 import {processSync} from "../dialog/processSystem";
 import {needSubscribe} from "../util/needSubscribe";
 import {syncGuide} from "../sync/syncGuide";
 import {hideElements} from "../protyle/ui/hideElements";
 import {getCloudURL, getIndexURL} from "./util/about";
+import {genUUID} from "../util/genID";
 
 const genSVGBG = () => {
     let html = "";
@@ -29,11 +30,29 @@ const genSVGBG = () => {
 export const account = {
     element: undefined as Element,
     genHTML: (onlyPayHTML = false) => {
-        const hideIPad = isIPad() ? " fn__none" : "";
-        const payHTML = `<a class="b3-button b3-button--big${hideIPad}" href="${getIndexURL("pricing.html")}" target="_blank">
+        const isIOS = isInIOS();
+        let payHTML
+        if (isIOS) {
+            // 已付费
+            if (window.siyuan.user?.userSiYuanOneTimePayStatus === 1) {
+                payHTML = `<button class="b3-button b3-button--big" data-action="iOSPay" data-type="subscribe">
+    <svg><use xlink:href="#iconVIP"></use></svg>${window.siyuan.languages.account4}
+</button>`
+            } else {
+                payHTML = `<button class="b3-button b3-button--big" data-action="iOSPay" data-type="subscribe">
+    <svg><use xlink:href="#iconVIP"></use></svg>${window.siyuan.languages.account10}
+</button>
+<div class="fn__hr"></div>
+<button class="b3-button b3-button--success" data-action="iOSPay" data-type="function">
+    <svg><use xlink:href="#iconVIP"></use></svg>${window.siyuan.languages.onepay}
+</button>`
+            }
+        } else {
+            payHTML = `<a class="b3-button b3-button--big" href="${getIndexURL("pricing.html")}" target="_blank">
     <svg><use xlink:href="#iconVIP"></use></svg>${window.siyuan.languages[window.siyuan.user?.userSiYuanOneTimePayStatus === 1 ? "account4" : "account1"]}
-</a>
-<div class="fn__hr--b${hideIPad}"></div>
+</a>`
+        }
+        payHTML += `<div class="fn__hr--b"></div>
 <span class="b3-chip b3-chip--primary b3-chip--hover${(window.siyuan.user && window.siyuan.user.userSiYuanSubscriptionStatus === 2) ? " fn__none" : ""}" id="trialSub">
     <svg class="ft__secondary"><use xlink:href="#iconVIP"></use></svg>
     ${window.siyuan.languages.freeSub}
@@ -87,7 +106,7 @@ ${genSVGBG()}
     ${window.siyuan.languages.account6} 
     ${Math.max(0, Math.floor((window.siyuan.user.userSiYuanProExpireTime - new Date().getTime()) / 1000 / 60 / 60 / 24))} 
     ${window.siyuan.languages.day} 
-    <a class="${hideIPad}" href="${getCloudURL("subscribe/siyuan")}" target="_blank">${window.siyuan.languages.clickMeToRenew}</a>
+    ${isIOS ? `<a href="javascript:void(0)" data-action="iOSPay" data-type="subscribe">${window.siyuan.languages.clickMeToRenew}</a>` : `<a href="${getCloudURL("subscribe/siyuan")}" target="_blank">${window.siyuan.languages.clickMeToRenew}</a>`}
 </div>`;
                 if (window.siyuan.user.userSiYuanOneTimePayStatus === 1) {
                     subscriptionHTML = `<div class="b3-chip"><svg><use xlink:href="#iconVIP"></use></svg>${window.siyuan.languages.onepay}</div>
@@ -122,8 +141,8 @@ ${renewHTML}
     </div>
     <div class="config-account__info">
         <div class="fn__flex">
-            <a class="b3-button b3-button--text${hideIPad}" href="${getCloudURL("settings")}" target="_blank">${window.siyuan.languages.manage}</a>
-            <span class="fn__space${hideIPad}"></span>
+            <a class="b3-button b3-button--text${isIOS ? " fn__none" : ""}" href="${getCloudURL("settings")}" target="_blank">${window.siyuan.languages.manage}</a>
+            <span class="fn__space${isIOS ? " fn__none" : ""}"></span>
             <button class="b3-button b3-button--cancel" id="logout">
                 ${window.siyuan.languages.logout}
             </button>
@@ -219,6 +238,35 @@ ${renewHTML}
 </div>`;
     },
     bindEvent: (element: Element) => {
+        element.querySelectorAll('[data-action="iOSPay"]').forEach(item => {
+            item.addEventListener("click", () => {
+                if (window.siyuan.user) {
+                    fetchPost("/api/setting/getCloudUser", {
+                        token: window.siyuan.user.userToken,
+                    }, response => {
+                        if (window.siyuan.user.userSiYuanOneTimePayStatus !== response.data.userSiYuanOneTimePayStatus ||
+                            window.siyuan.user.userSiYuanProExpireTime !== response.data.userSiYuanProExpireTime ||
+                            window.siyuan.user.userSiYuanSubscriptionPlan !== response.data.userSiYuanSubscriptionPlan ||
+                            window.siyuan.user.userSiYuanSubscriptionType !== response.data.userSiYuanSubscriptionType ||
+                            window.siyuan.user.userSiYuanSubscriptionStatus !== response.data.userSiYuanSubscriptionStatus) {
+                            showMessage(window.siyuan.languages["_kernel"][19]);
+                            return;
+                        }
+                        window.siyuan.user = response.data;
+                        const productType = item.getAttribute("data-type")
+                        let productID
+                        if (window.siyuan.config.cloudRegion === 0) {
+                            productID = productType === "function" ? "0" : "1"
+                        } else {
+                            productID = productType === "function" ? "2" : "3"
+                        }
+                        window.webkit.messageHandlers.purchase.postMessage(`${productID} ${genUUID().substring(0, 19)}${window.siyuan.config.cloudRegion}00${window.siyuan.user.userId.substring(0, 1)}-${window.siyuan.user.userId.substring(1)}`);
+                    });
+                } else {
+                    showMessage(window.siyuan.languages.needLogin);
+                }
+            });
+        });
         const trialSubElement = element.querySelector("#trialSub");
         if (trialSubElement) {
             trialSubElement.addEventListener("click", () => {
diff --git a/app/src/mobile/settings/account.ts b/app/src/mobile/settings/account.ts
index a520c5199..ebd3a92b3 100644
--- a/app/src/mobile/settings/account.ts
+++ b/app/src/mobile/settings/account.ts
@@ -41,7 +41,7 @@ export const showAccountInfo = () => {
     ${window.siyuan.languages.freeSub}
 </span>
 <div class="fn__hr${(window.siyuan.user && window.siyuan.user.userSiYuanSubscriptionStatus === 2) ? " fn__none" : ""}"></div>
-<a href="${getCloudURL("sponsor")}" target="_blank" class="b3-chip b3-chip--pink b3-chip--hover${isIOS ? " fn__none" : ""}">
+<a href="${getCloudURL("sponsor")}" target="_blank" class="b3-chip b3-chip--pink b3-chip--hover">
     <svg version='1.1' xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'><path fill='#ffe43c' d='M6.4 0h19.2c4.268 0 6.4 2.132 6.4 6.4v19.2c0 4.268-2.132 6.4-6.4 6.4h-19.2c-4.268 0-6.4-2.132-6.4-6.4v-19.2c0-4.268 2.135-6.4 6.4-6.4z'></path> <path fill='#00f5d4' d='M25.6 0h-8.903c-7.762 1.894-14.043 7.579-16.697 15.113v10.487c0 3.533 2.867 6.4 6.4 6.4h19.2c3.533 0 6.4-2.867 6.4-6.4v-19.2c0-3.537-2.863-6.4-6.4-6.4z'></path> <path fill='#01beff' d='M25.6 0h-0.119c-12.739 2.754-20.833 15.316-18.079 28.054 0.293 1.35 0.702 2.667 1.224 3.946h16.974c3.533 0 6.4-2.867 6.4-6.4v-19.2c0-3.537-2.863-6.4-6.4-6.4z'></path> <path fill='#9a5ce5' d='M31.005 2.966c-0.457-0.722-1.060-1.353-1.784-1.849-8.342 3.865-13.683 12.223-13.679 21.416-0.003 3.256 0.67 6.481 1.978 9.463h8.081c0.602 0 1.185-0.084 1.736-0.238-2.1-3.189-3.401-7.624-3.401-12.526 0-7.337 2.921-13.628 7.070-16.266z'></path> <path fill='#f15bb5' d='M32 25.6v-19.2c0-1.234-0.354-2.419-0.998-3.43-4.149 2.638-7.067 8.928-7.067 16.266 0 4.902 1.301 9.334 3.401 12.526 2.693-0.757 4.664-3.231 4.664-6.162z'></path> <path fill='#fff' opacity='0.2' d='M26.972 22.415c-2.889 0.815-4.297 2.21-6.281 3.182 1.552 0.348 3.105 0.461 4.902 0.461 2.644 0 5.363-1.449 6.406-2.519v-1.085c-1.598-0.399-2.664-0.705-5.028-0.039zM4.773 21.612c-0.003 0-0.006-0.003-0.006-0.003-1.726-0.863-3.382-1.205-4.767-1.301v2.487c0.779-0.341 2.396-0.921 4.773-1.182zM17.158 26.599c1.472-0.158 2.57-0.531 3.533-1.002-1.063-0.238-2.126-0.583-3.269-1.079-2.767-1.205-5.63-3.092-10.491-3.034-0.779 0.010-1.495 0.058-2.158 0.132 4.503 2.248 7.882 5.463 12.384 4.983z'></path> <path fill='#fff' opacity='0.2' d='M20.691 25.594c-0.963 0.47-2.061 0.844-3.533 1.002-4.503 0.483-7.882-2.731-12.381-4.983-2.38 0.261-3.994 0.841-4.773 1.179v2.809c0 4.268 2.132 6.4 6.4 6.4h19.197c4.268 0 6.4-2.132 6.4-6.4v-2.065c-1.044 1.069-3.762 2.519-6.406 2.519-1.797 0-3.35-0.113-4.902-0.461z'></path> <path fill='#fff' opacity='0.5' d='M3.479 19.123c0 0.334 0.271 0.606 0.606 0.606s0.606-0.271 0.606-0.606v0c0-0.334-0.271-0.606-0.606-0.606s-0.606 0.271-0.606 0.606v0z'></path> <path fill='#fff' opacity='0.5' d='M29.027 14.266c0 0.334 0.271 0.606 0.606 0.606s0.606-0.271 0.606-0.606v0c0-0.334-0.271-0.606-0.606-0.606s-0.606 0.271-0.606 0.606v0z'></path> <path fill='#fff' d='M9.904 1.688c0 0.167 0.136 0.303 0.303 0.303s0.303-0.136 0.303-0.303v0c0-0.167-0.136-0.303-0.303-0.303s-0.303 0.136-0.303 0.303v0z'></path> <path fill='#fff' d='M2.673 10.468c0 0.167 0.136 0.303 0.303 0.303s0.303-0.136 0.303-0.303v0c0-0.167-0.136-0.303-0.303-0.303s-0.303 0.136-0.303 0.303v0z'></path> <path fill='#fff' opacity='0.6' d='M30.702 9.376c0 0.167 0.136 0.303 0.303 0.303s0.303-0.136 0.303-0.303v0c0-0.167-0.136-0.303-0.303-0.303s-0.303 0.136-0.303 0.303v0z'></path> <path fill='#fff' opacity='0.8' d='M29.236 20.881c0 0.276 0.224 0.499 0.499 0.499s0.499-0.224 0.499-0.499v0c0-0.276-0.224-0.499-0.499-0.499s-0.499 0.224-0.499 0.499v0z'></path> <path fill='#fff' opacity='0.8' d='M15.38 1.591c0.047 0.016 0.101 0.026 0.158 0.026 0.276 0 0.499-0.224 0.499-0.499 0-0.219-0.141-0.406-0.338-0.473l-0.004-0.001c-0.047-0.016-0.101-0.026-0.158-0.026-0.276 0-0.499 0.224-0.499 0.499 0 0.219 0.141 0.406 0.338 0.473l0.004 0.001z'></path> <path fill='#ffdeeb' d='M25.732 8.268c-2.393-2.371-6.249-2.371-8.642 0l-1.089 1.085-1.079-1.089c-2.38-2.39-6.249-2.393-8.639-0.013s-2.393 6.249-0.013 8.639l2.158 2.158 6.474 6.464c0.596 0.593 1.562 0.593 2.158 0l6.474-6.464 2.193-2.158c2.384-2.383 2.384-6.242 0.003-8.622z'></path> <path fill='#fff' d='M17.081 8.268l-1.079 1.085-1.079-1.089c-2.38-2.39-6.249-2.393-8.639-0.013s-2.393 6.249-0.013 8.639l2.158 2.158 2.548 2.487c4.097-1.044 7.627-3.646 9.837-7.254 1.424-2.271 2.284-4.848 2.503-7.518-2.193-0.715-4.606-0.132-6.236 1.504z'></path> </svg>
     ${window.siyuan.languages.sponsor}
 </a>`;