feat: 跳转二次确认弹窗

src/pages/DetailPage/DetailPage.tsx

@@ -13,6 +13,7 @@ import hxLink from "hx-product_detail-link";
 import { ModalCtrl } from "@/core/ctrls/ModalCtrl.tsx";
 import { BuyPanel } from "@/panels/BuyPanel/BuyPanel.tsx";
 import { SellPanel } from '@/panels/SellPanel/SellPanel';
+import JumpConfirmPop from '@/panels/jumpConfirmPop/jumpConfirmPop.jsx';
 import { diffJump } from "@/AppTools.ts";
 import HomePage from "@/pages/HomePage/HomePage.tsx";
 
@@ -110,7 +111,11 @@ class DetailPage extends React.Component<any, any> {
     });
 
     clickReallyBuy = _asyncThrottle(async () => {
-        diffJump(this.props.realBuyJumpUrl)
+        ModalCtrl.showModal(JumpConfirmPop, {
+            confirmCb: () => {
+                diffJump(this.props.realBuyJumpUrl)
+            }
+        })
     });
 
 

src/panels/jumpConfirmPop/jumpConfirmPop.jsx

+'use strict';
+
+import React from 'react';
+import { observer } from 'mobx-react';
+import './jumpConfirmPop.less';
+import store from '../../store/store';
+import { Button } from '@grace/ui';
+import { _asyncThrottle } from "../../utils/utils";
+import { ModalCtrl } from "@/core/ctrls/ModalCtrl";
+
+@observer
+class JumpConfirmPop extends React.Component {
+  constructor(props) {
+    super(props);
+  }
+
+  async componentDidMount() {
+  }
+
+  handleClose = _asyncThrottle(() => {
+    ModalCtrl.closeModal()
+  })
+  
+  handleConfirm = _asyncThrottle(() => {
+    ModalCtrl.closeModal()
+    this.props.confirmCb?.()
+  })
+
+  render() {
+    return (
+      <div className="jumpConfirmPop modal_center">
+        <span className="bg"></span>
+        <div className="text">离开模拟理财功能<br />前往真实理财产品交易页面</div>
+        <Button className="think_btn" onClick={this.handleClose} />
+        <Button className="confirm_btn" onClick={this.handleConfirm} />
+        <Button className="close" onClick={this.handleClose} />
+      </div>
+    );
+  }
+}
+export default JumpConfirmPop;

src/panels/jumpConfirmPop/jumpConfirmPop.less

+@import "../../res.less";
+
+.jumpConfirmPop {
+  width: 750px;
+  height: 1624px;
+  left: 0px;
+  top: 0px;
+  position: absolute;
+
+  .bg {
+    left: 82px;
+    top: 529px;
+    width: 585px;
+    height: 388px;
+    position: absolute;
+    .sparkBg("jumpConfirmPop/bg.png");
+  }
+
+  .think_btn {
+    position: absolute;
+    left: 135px;
+    top: 758px;
+    width: 231px;
+    height: 110px;
+    .sparkBg("jumpConfirmPop/think_btn.png");
+  }
+
+  .confirm_btn {
+    position: absolute;
+    left: 374px;
+    top: 754px;
+    width: 257px;
+    height: 138px;
+    .sparkBg("jumpConfirmPop/confirm_btn.png");
+  }
+
+  .text {
+    width: 505px;
+    height: 90px;
+    left: 122px;
+    top: 610px;
+    position: absolute;
+    font-size: 36px;
+    line-height: 50px;
+    color: rgb(0, 0, 0);
+    font-weight: bold;
+    text-align: center;
+  }
+
+  .close {
+    left: 346px;
+    top: 986px;
+    width: 58px;
+    height: 58px;
+    position: absolute;
+    .sparkBg("common/close.png");
+  }
+}

src/store/store.ts

@@ -186,6 +186,12 @@ class Store {
       const res = await queryAppFundDetail(fundcodeList[i])
       if (res) adInfos.push(res)
     }
+    // 本地自测代码
+    // adInfos[0] = {
+    //   fundcode: '23112008P',
+    //   incomeRate: '1.78%',
+    //   pernetValue: '1.0690',
+    // }
 
     // 将客户端查到的收益率 更新到产品列表中
     const _temp = JSON.parse(JSON.stringify(this.indexData))
@@ -199,12 +205,6 @@ class Store {
     })
     this.indexData = _temp;
     console.info('基金产品收益率信息(客户端更新后的), ', toJS(this.indexData))
-    // 本地自测代码
-    // adInfos[0] = {
-    //   fundcode: '23112008P',
-    //   incomeRate: '1.78%',
-    //   pernetValue: '1.0690',
-    // }
 
     if (!adInfos?.length) return
     // 将客户端查到的收益率 更新我们后端