|
|
@@ -3,34 +3,27 @@ import { webview } from '@kit.ArkWeb'
|
|
|
import { bundleManager, common } from '@kit.AbilityKit'
|
|
|
import { BusinessError } from '@kit.BasicServicesKit'
|
|
|
import { WebViewJavascriptBridge, WVJBResponseCallback } from '@yue/webview_javascript_bridge'
|
|
|
-import util from '@kit.ArkTS';
|
|
|
+import { YTAvoid, yTRouter } from 'basic'
|
|
|
+import { GetUnifiedPayInfoRequestData } from '../../model/OrderModelIndex'
|
|
|
+import { OrderApi } from '../../apis/OrderApi'
|
|
|
+import { PageState } from '../../model/EnumState'
|
|
|
|
|
|
|
|
|
@Component
|
|
|
-struct PrivacyPolicyPage {
|
|
|
- @Require fromText: string
|
|
|
+struct InitiatePayPage {
|
|
|
+ @Require orderId: string
|
|
|
|
|
|
+ @State safeTop: number = AppStorage.get(YTAvoid.SAFE_TOP_KEY) as number
|
|
|
+ @State safeBottom: number = AppStorage.get(YTAvoid.SAFE_BOTTOM_KEY) as number
|
|
|
+ // 页面状态
|
|
|
+ @State pageState: PageState = PageState.LOADING
|
|
|
+ @State url: string = ''
|
|
|
|
|
|
- @State targetUrl: string = ''
|
|
|
- @State title: string = ''
|
|
|
- // 是否有进度条
|
|
|
- hasProgressBar: boolean = false
|
|
|
- // 网络加载进度
|
|
|
- @State progressNum: number = 0
|
|
|
- // 网络是否在加载中
|
|
|
- @State loading: boolean = true
|
|
|
// 是否显示
|
|
|
navBarShow: boolean = true
|
|
|
- // 进入页面时,状态条颜色
|
|
|
- onPageShowBarColor: StatusBarColor = StatusBarColor.Black
|
|
|
- // 隐藏页面时,状态条颜色
|
|
|
- onPageHideBarColor: StatusBarColor = StatusBarColor.Black
|
|
|
- // 顶部安全高度
|
|
|
- safeTop: number = AppStorage.get('safeTop') as number
|
|
|
- // 底部安全高度
|
|
|
- safeBottom: number = AppStorage.get('safeBottom') as number
|
|
|
controller: webview.WebviewController = new webview.WebviewController()
|
|
|
historyCurrIndex: number = 0
|
|
|
+
|
|
|
// WebViewJavascriptBridge 桥接
|
|
|
private bridge: WebViewJavascriptBridge | undefined;
|
|
|
private context: common.UIAbilityContext = getContext(this) as common.UIAbilityContext;
|
|
|
@@ -42,8 +35,6 @@ struct PrivacyPolicyPage {
|
|
|
private isWeixinPay = false;
|
|
|
// 支付订单页url,如果成功拉起微信支付以后取消会回到app,此时需要跳到订单页
|
|
|
private orderUrl: string = '';
|
|
|
- // 监听网页加载是否出错
|
|
|
- @State loadError: boolean = false;
|
|
|
// 点击返回键需要直接退出web组件的url集合
|
|
|
private excludedUrlList: string[] = [
|
|
|
'https://app.sightcloud.cn/storage/#/package',
|
|
|
@@ -52,11 +43,90 @@ struct PrivacyPolicyPage {
|
|
|
];
|
|
|
|
|
|
aboutToAppear(): void {
|
|
|
- this.onPageShow()
|
|
|
+ this.getPaymentUrl(this.orderId)
|
|
|
+ }
|
|
|
+
|
|
|
+ build() {
|
|
|
+ NavDestination() {
|
|
|
+ Column() {
|
|
|
+ if(this.pageState == PageState.LOADING) {
|
|
|
+ Column() {
|
|
|
+ Text('加载支付中...')
|
|
|
+ .fontColor('#686868')
|
|
|
+ .fontSize(20)
|
|
|
+ }
|
|
|
+ .width('100%')
|
|
|
+ .height('100%')
|
|
|
+ .justifyContent(FlexAlign.Center)
|
|
|
+ } if (this.pageState == PageState.ERROR) {
|
|
|
+ Column() {
|
|
|
+ Text('出错啦!点击空白处刷新')
|
|
|
+ .fontColor('#686868')
|
|
|
+ .fontSize(20)
|
|
|
+ }
|
|
|
+ .width('100%')
|
|
|
+ .height('100%')
|
|
|
+ .justifyContent(FlexAlign.Center)
|
|
|
+ .onClick(() => {
|
|
|
+ this.pageState = PageState.COMPLETED
|
|
|
+ })
|
|
|
+ } else if (this.pageState == PageState.COMPLETED) {
|
|
|
+ Scroll() {
|
|
|
+ Web({
|
|
|
+ src: this.url,
|
|
|
+ controller: this.controller
|
|
|
+ })
|
|
|
+ .width('100%')
|
|
|
+ .height('100%')
|
|
|
+ .geolocationAccess(false)
|
|
|
+ .domStorageAccess(true)
|
|
|
+ .mixedMode(MixedMode.Compatible)
|
|
|
+ .fileAccess(true)
|
|
|
+ .multiWindowAccess(true)
|
|
|
+ .onControllerAttached(() => {
|
|
|
+ this.setupWebViewJavascriptBridge();
|
|
|
+ })
|
|
|
+ .onRefreshAccessedHistory((event) => {
|
|
|
+ //H5页面间的跳转
|
|
|
+ // if (this.controller.getTitle().length < 5) {
|
|
|
+ // this.title = this.controller.getTitle()
|
|
|
+ // }
|
|
|
+ if (event) {
|
|
|
+ const history = this.controller.getBackForwardEntries()
|
|
|
+ this.historyCurrIndex = history.currentIndex
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .onLoadIntercept((event) => {
|
|
|
+ const isPayment = this.handlePaymentIntercept(event)
|
|
|
+ return isPayment
|
|
|
+ })
|
|
|
+ .onPageEnd((event) => {
|
|
|
+ // this.controller.runJavaScript('document.forms[0].submit()')
|
|
|
+ if (this.orderUrl && event.url == this.orderUrl) {
|
|
|
+ this.controller.clearHistory()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .onErrorReceive((event) => {
|
|
|
+ if (event.request.getRequestUrl() == this.controller.getUrl()) {
|
|
|
+ console.error(`WebView load error: ${event.request.getRequestUrl()}, code: ${event.error.getErrorCode()}, message: ${event.error.getErrorInfo()}`);
|
|
|
+ // 显示错误页面
|
|
|
+ this.pageState = PageState.ERROR
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ .margin({ bottom: this.navBarShow ? this.safeBottom : 0 })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .width('100%')
|
|
|
+ .height('100%')
|
|
|
+ .padding({ top: this.navBarShow ? this.safeTop : 0, bottom: this.navBarShow ? this.safeBottom : 0 })
|
|
|
+ }
|
|
|
+ .hideTitleBar(true)
|
|
|
+ .onBackPressed(() => { return this.onBackPress() })
|
|
|
+ .onShown(() => { this.onPageShow() })
|
|
|
}
|
|
|
|
|
|
onPageShow(): void {
|
|
|
- // this.statusBarColorSelect(this.onPageShowBarColor)
|
|
|
// 判断是否安装支付宝
|
|
|
try {
|
|
|
this.canOpenAlipays = bundleManager.canOpenLink('alipays://');
|
|
|
@@ -72,147 +142,52 @@ struct PrivacyPolicyPage {
|
|
|
// 清跳转订单页
|
|
|
this.controller.loadUrl(this.orderUrl)
|
|
|
} else {
|
|
|
- this.backMethod()
|
|
|
+ this.onBackPress()
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- onPageHide(): void {
|
|
|
- this.statusBarColorSelect(this.onPageHideBarColor)
|
|
|
- }
|
|
|
-
|
|
|
- // 状态条颜色选取函数
|
|
|
- statusBarColorSelect(color: StatusBarColor) {
|
|
|
- switch (color) {
|
|
|
- case StatusBarColor.White:
|
|
|
- // themeManager.settingStatusBarWhite()
|
|
|
- break
|
|
|
- case StatusBarColor.Black:
|
|
|
- // themeManager.settingStatusBarBlack()
|
|
|
- break
|
|
|
- default:
|
|
|
- // themeManager.settingStatusBarBlack()
|
|
|
- break
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
// 页面自行处理返回逻辑,不进行页面路由
|
|
|
+ // todo 在返回之前查询订单是否完成, 根据结果跳转到对应的页面
|
|
|
onBackPress() {
|
|
|
- this.backMethod()
|
|
|
+ const url = this.controller.getUrl()
|
|
|
+ if (this.pageState == PageState.LOADING || this.pageState == PageState.ERROR){
|
|
|
+ yTRouter.pop()
|
|
|
+ } else if (this.excludedUrlList.some(item => url.startsWith(item))) {
|
|
|
+ yTRouter.pop()
|
|
|
+ } else if (this.historyCurrIndex == 0) {
|
|
|
+ yTRouter.pop()
|
|
|
+ }
|
|
|
return true
|
|
|
}
|
|
|
|
|
|
- backMethod() {
|
|
|
- if (this.loadError) {
|
|
|
- router.back()
|
|
|
- return
|
|
|
+ // 根据订单号获取支付链接
|
|
|
+ async getPaymentUrl(orderId: string): Promise<void> {
|
|
|
+ let payInfo: GetUnifiedPayInfoRequestData = {
|
|
|
+ orderId: orderId,
|
|
|
+ payWay: '2',
|
|
|
}
|
|
|
- const url = this.controller.getUrl()
|
|
|
- if (this.excludedUrlList.some(item => url.startsWith(item))) {
|
|
|
- router.back()
|
|
|
- return
|
|
|
- }
|
|
|
- if (this.historyCurrIndex > 0) {
|
|
|
- this.controller.backward()
|
|
|
- } else {
|
|
|
- router.back()
|
|
|
- }
|
|
|
- }
|
|
|
|
|
|
- build() {
|
|
|
- NavDestination() {
|
|
|
- Column() {
|
|
|
- if (this.navBarShow) {
|
|
|
- // PrivacyPolicyPageTitle({ title: this.title })
|
|
|
- }
|
|
|
+ this.url = await OrderApi.getPayInfo(payInfo)
|
|
|
+ this.pageState = PageState.COMPLETED
|
|
|
|
|
|
- Stack({ alignContent: Alignment.Top }) {
|
|
|
- if (this.hasProgressBar && this.loading && !this.loadError) {
|
|
|
- this.progress()
|
|
|
- }
|
|
|
- if (this.loadError) {
|
|
|
- Column() {
|
|
|
- Text('出错啦!点击空白处刷新')
|
|
|
- .fontColor('#686868')
|
|
|
- .fontSize(20)
|
|
|
- }
|
|
|
- // .width(StyleConstants.FULL_PARENT)
|
|
|
- // .height(StyleConstants.FULL_PARENT)
|
|
|
- .justifyContent(FlexAlign.Center)
|
|
|
- .onClick(() => {
|
|
|
- this.loadError = false
|
|
|
- })
|
|
|
- } else {
|
|
|
- Scroll() {
|
|
|
- Web({
|
|
|
- src: this.fromText,
|
|
|
- controller: this.controller
|
|
|
- })
|
|
|
- .width('100%')
|
|
|
- .height('100%')
|
|
|
- .geolocationAccess(false)
|
|
|
- .domStorageAccess(true)
|
|
|
- .mixedMode(MixedMode.Compatible)
|
|
|
- .fileAccess(true)
|
|
|
- .multiWindowAccess(true)
|
|
|
- .onControllerAttached(() => {
|
|
|
- this.setupWebViewJavascriptBridge();
|
|
|
- })
|
|
|
- .onProgressChange((date) => {
|
|
|
- if (date) {
|
|
|
- //记录加载进度
|
|
|
- this.progressNum = date.newProgress
|
|
|
- if (this.progressNum == 100) {
|
|
|
- //加载完成进度条消失
|
|
|
- animateTo({ duration: 800, delay: 300 }, () => {
|
|
|
- this.loading = false
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
- })
|
|
|
- .onRefreshAccessedHistory((event) => {
|
|
|
- //H5页面间的跳转
|
|
|
- // if (this.controller.getTitle().length < 5) {
|
|
|
- // this.title = this.controller.getTitle()
|
|
|
- // }
|
|
|
- if (event) {
|
|
|
- const history = this.controller.getBackForwardEntries()
|
|
|
- this.historyCurrIndex = history.currentIndex
|
|
|
- }
|
|
|
- })
|
|
|
- .onPageBegin((event) => {
|
|
|
- this.progressNum = 0
|
|
|
- this.loading = true
|
|
|
- })
|
|
|
- .onLoadIntercept((event) => {
|
|
|
- const isPayment = this.handlePaymentIntercept(event)
|
|
|
- return isPayment
|
|
|
- })
|
|
|
- .onPageEnd((event) => {
|
|
|
- // this.controller.runJavaScript('document.forms[0].submit()')
|
|
|
- if (this.orderUrl && event.url == this.orderUrl) {
|
|
|
- this.controller.clearHistory()
|
|
|
- }
|
|
|
- })
|
|
|
- .onErrorReceive((event) => {
|
|
|
- if (event.request.getRequestUrl() == this.controller.getUrl()) {
|
|
|
- console.error(`WebView load error: ${event.request.getRequestUrl()}, code: ${event.error.getErrorCode()}, message: ${event.error.getErrorInfo()}`);
|
|
|
- this.loadError = true; // 显示错误页面
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- .margin({ bottom: this.navBarShow ? this.safeBottom : 0 })
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .width('100%')
|
|
|
- .height('100%')
|
|
|
- .padding({ top: this.navBarShow ? this.safeTop : 0, bottom: this.navBarShow ? this.safeBottom : 0 })
|
|
|
- }
|
|
|
- .hideTitleBar(true)
|
|
|
+ console.log(`支付链接 = ${JSON.stringify(this.url)}`)
|
|
|
+ }
|
|
|
+
|
|
|
+ // todo 获取订单支付结果
|
|
|
+ async getPaymentResult(orderId: string): Promise<void> {
|
|
|
+ /**
|
|
|
+ * 前往借阅成功页面
|
|
|
+ */
|
|
|
+ // yTRouter.router2BorrowAnsPage()
|
|
|
}
|
|
|
|
|
|
- // 处理支付相关的拦截逻辑
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 处理支付相关的拦截逻辑
|
|
|
+ * @param event
|
|
|
+ * @returns
|
|
|
+ */
|
|
|
private handlePaymentIntercept(event: OnLoadInterceptEvent) {
|
|
|
let data = event.data;
|
|
|
let url = data.getRequestUrl();
|
|
|
@@ -276,7 +251,11 @@ struct PrivacyPolicyPage {
|
|
|
return false
|
|
|
}
|
|
|
|
|
|
- // 从微信支付链接中提取 redirect_url 参数
|
|
|
+ /**
|
|
|
+ * 从微信支付链接中提取 redirect_url 参数
|
|
|
+ * @param url
|
|
|
+ * @returns
|
|
|
+ */
|
|
|
private getRedirectUrlFromTenpay(url: string): string | null {
|
|
|
try {
|
|
|
// 使用正则提取 redirect_url 参数
|
|
|
@@ -292,13 +271,6 @@ struct PrivacyPolicyPage {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
- @Builder
|
|
|
- progress() {
|
|
|
- Progress({ value: this.progressNum, total: 100, type: ProgressType.Linear })
|
|
|
- .color('#17ab19')
|
|
|
- .zIndex(1)
|
|
|
- }
|
|
|
-
|
|
|
/**
|
|
|
* 设置 jsBridge
|
|
|
*/
|
|
|
@@ -310,21 +282,19 @@ struct PrivacyPolicyPage {
|
|
|
this.registerHandlers(this.bridge)
|
|
|
}
|
|
|
|
|
|
- // 注册原生处理函数 (这里需要知道H5端的方法名)
|
|
|
+ /**
|
|
|
+ * 注册原生处理函数 (这里需要知道H5端的方法名)
|
|
|
+ * @param bridge
|
|
|
+ */
|
|
|
private registerHandlers(bridge: WebViewJavascriptBridge) {
|
|
|
bridge.registerHandler('backToNative', (data: object, responseCallback: WVJBResponseCallback) => {
|
|
|
- this.backMethod();
|
|
|
+ this.onBackPress();
|
|
|
responseCallback(null);
|
|
|
});
|
|
|
}
|
|
|
}
|
|
|
|
|
|
-export enum StatusBarColor {
|
|
|
- White = 'White',
|
|
|
- Black = 'Black',
|
|
|
-}
|
|
|
-
|
|
|
@Builder
|
|
|
-function PrivacyPolicyBuilder(_: string, fromText: string) {
|
|
|
- PrivacyPolicyPage({fromText})
|
|
|
+function InitiatePayPageBuilder(_: string, orderId: string) {
|
|
|
+ InitiatePayPage({orderId})
|
|
|
}
|