Skip to content

华
华夏模拟理财_20250701
Commit 86091ae1 authored by 俞嘉婷's avatar 俞嘉婷
Browse files
Options

feat: 产品列表页

parent 9a178f97
Hide whitespace changes
Inline Side-by-side
Showing with 248 additions and 10 deletions
dist/index.html
View file @ 86091ae1
...@@ -46,10 +46,10 @@ ...@@ -46,10 +46,10 @@
// alert("【警告】检测到活动url中没有appID参数\n缺少该参数会导致埋点、分享、app信息获取错误。") // alert("【警告】检测到活动url中没有appID参数\n缺少该参数会导致埋点、分享、app信息获取错误。")
} }
</script> </script>
<script type="module" crossorigin src="https://yun.duiba.com.cn/db_games/spark/v3/1752133227597/assets/index-LPwj3o85.js"></script> <script type="module" crossorigin src="https://yun.duiba.com.cn/db_games/spark/v3/1752138306804/assets/index-D7spEB_k.js"></script>
<link rel="modulepreload" crossorigin href="https://yun.duiba.com.cn/db_games/spark/v3/1752133227597/assets/vendor-pyrxJLW_.js"> <link rel="modulepreload" crossorigin href="https://yun.duiba.com.cn/db_games/spark/v3/1752138306804/assets/vendor-pyrxJLW_.js">
<link rel="stylesheet" crossorigin href="https://yun.duiba.com.cn/db_games/spark/v3/1752133227597/assets/vendor-BQh5NVNk.css"> <link rel="stylesheet" crossorigin href="https://yun.duiba.com.cn/db_games/spark/v3/1752138306804/assets/vendor-BQh5NVNk.css">
<link rel="stylesheet" crossorigin href="https://yun.duiba.com.cn/db_games/spark/v3/1752133227597/assets/index-BljVMm7t.css"> <link rel="stylesheet" crossorigin href="https://yun.duiba.com.cn/db_games/spark/v3/1752138306804/assets/index-BGlhOQPQ.css">
<script type="module">import.meta.url;import("_").catch(()=>1);(async function*(){})().next();if(location.protocol!="file:"){window.__vite_is_modern_browser=true}</script> <script type="module">import.meta.url;import("_").catch(()=>1);(async function*(){})().next();if(location.protocol!="file:"){window.__vite_is_modern_browser=true}</script>
<script type="module">!function(){if(window.__vite_is_modern_browser)return;console.warn("vite: loading legacy chunks, syntax error above and the same error below should be ignored");var e=document.getElementById("vite-legacy-polyfill"),n=document.createElement("script");n.src=e.src,n.onload=function(){System.import(document.getElementById('vite-legacy-entry').getAttribute('data-src'))},document.body.appendChild(n)}();</script> <script type="module">!function(){if(window.__vite_is_modern_browser)return;console.warn("vite: loading legacy chunks, syntax error above and the same error below should be ignored");var e=document.getElementById("vite-legacy-polyfill"),n=document.createElement("script");n.src=e.src,n.onload=function(){System.import(document.getElementById('vite-legacy-entry').getAttribute('data-src'))},document.body.appendChild(n)}();</script>
</head> </head>
...@@ -57,8 +57,8 @@ ...@@ -57,8 +57,8 @@
<body> <body>
<div id="root"></div> <div id="root"></div>
<script nomodule>!function(){var e=document,t=e.createElement("script");if(!("noModule"in t)&&"onbeforeload"in t){var n=!1;e.addEventListener("beforeload",(function(e){if(e.target===t)n=!0;else if(!e.target.hasAttribute("nomodule")||!n)return;e.preventDefault()}),!0),t.type="module",t.src=".",e.head.appendChild(t),t.remove()}}();</script> <script nomodule>!function(){var e=document,t=e.createElement("script");if(!("noModule"in t)&&"onbeforeload"in t){var n=!1;e.addEventListener("beforeload",(function(e){if(e.target===t)n=!0;else if(!e.target.hasAttribute("nomodule")||!n)return;e.preventDefault()}),!0),t.type="module",t.src=".",e.head.appendChild(t),t.remove()}}();</script>
<script nomodule crossorigin id="vite-legacy-polyfill" src="https://yun.duiba.com.cn/db_games/spark/v3/1752133227597/assets/polyfills-legacy-D0AVcSo7.js"></script> <script nomodule crossorigin id="vite-legacy-polyfill" src="https://yun.duiba.com.cn/db_games/spark/v3/1752138306804/assets/polyfills-legacy-D0AVcSo7.js"></script>
<script nomodule crossorigin id="vite-legacy-entry" data-src="https://yun.duiba.com.cn/db_games/spark/v3/1752133227597/assets/index-legacy-BHbiafmR.js">System.import(document.getElementById('vite-legacy-entry').getAttribute('data-src'))</script> <script nomodule crossorigin id="vite-legacy-entry" data-src="https://yun.duiba.com.cn/db_games/spark/v3/1752138306804/assets/index-legacy-CI4Omejx.js">System.import(document.getElementById('vite-legacy-entry').getAttribute('data-src'))</script>
</body> </body>
</html> </html>
mock/main.ts
View file @ 86091ae1
...@@ -70,7 +70,7 @@ export default [ ...@@ -70,7 +70,7 @@ export default [
"preDayIncome": "656", "preDayIncome": "656",
"availableFunds": "10284329.43", "availableFunds": "10284329.43",
"totalMoney": "359998480.1", "totalMoney": "359998480.1",
"realBuyJumpUrl": "anim consectetur dolor", // "realBuyJumpUrl": "anim consectetur dolor",
"totalIncome": "8390.22" "totalIncome": "8390.22"
}, },
"checkIn": { "checkIn": {
......
src/pages/HomePage/HomePage.tsx
View file @ 86091ae1
...@@ -13,6 +13,7 @@ import API from '@/api'; ...@@ -13,6 +13,7 @@ import API from '@/api';
import DetailPage from '../DetailPage/DetailPage'; import DetailPage from '../DetailPage/DetailPage';
import ResPage from '../ResPage/ResPage'; import ResPage from '../ResPage/ResPage';
import Countdown from '@/core/components/ComCountdown/index.jsx'; import Countdown from '@/core/components/ComCountdown/index.jsx';
import ProductListPage from '../productListPage/productListPage';
@observer @observer
class HomePage extends React.Component<any, any> { class HomePage extends React.Component<any, any> {
...@@ -38,7 +39,12 @@ class HomePage extends React.Component<any, any> { ...@@ -38,7 +39,12 @@ class HomePage extends React.Component<any, any> {
realBuyHandle = _asyncThrottle(() => { realBuyHandle = _asyncThrottle(() => {
if (!store.judgeActTime()) return if (!store.judgeActTime()) return
const { realBuyJumpUrl } = store.indexData?.virtualAssets || {} const { realBuyJumpUrl } = store.indexData?.virtualAssets || {}
diffJump(realBuyJumpUrl) if (realBuyJumpUrl) {
diffJump(realBuyJumpUrl)
} else {
// 没有链接 就跳产品列表页
PageCtrl.changePage(ProductListPage)
}
}) })
/** 跳转“模拟”产品详情页 */ /** 跳转“模拟”产品详情页 */
...@@ -151,7 +157,8 @@ class HomePage extends React.Component<any, any> { ...@@ -151,7 +157,8 @@ class HomePage extends React.Component<any, any> {
<span className="prize_btn md16" onClick={this.prizeHandle}></span> <span className="prize_btn md16" onClick={this.prizeHandle}></span>
</div>} </div>}
{/* 模拟资产 */} {/* 模拟资产 */}
<div className={`virtual_assets ${!virtualAssets?.realBuyJumpUrl ? 'short_height' : ''}`}> {/* <div className={`virtual_assets ${!virtualAssets?.realBuyJumpUrl ? 'short_height' : ''}`}> */}
<div className="virtual_assets">
{ {
endPoint > currentTime && endPoint > currentTime &&
<Countdown <Countdown
...@@ -192,7 +199,7 @@ class HomePage extends React.Component<any, any> { ...@@ -192,7 +199,7 @@ class HomePage extends React.Component<any, any> {
<span className="canuse_popover_bg"></span> <span className="canuse_popover_bg"></span>
<span className="canuse_popover_text">可用资金去购买理财</span> <span className="canuse_popover_text">可用资金去购买理财</span>
</div> </div>
{!!virtualAssets?.realBuyJumpUrl && <Button className="realbuy_btn md7" onClick={this.realBuyHandle}>真实买入</Button>} <Button className="realbuy_btn md7" onClick={this.realBuyHandle}>真实买入</Button>
</div> </div>
{/* 签到区 */} {/* 签到区 */}
{productEnd ? null : <div className="sign_section"> {productEnd ? null : <div className="sign_section">
......
src/pages/productListPage/productListPage.less 0 → 100644
View file @ 86091ae1
@import "../../res.less";
.productListPage {
width: 100%;
height: 100%;
left: 0;
top: 0;
position: absolute;
overflow: hidden;
background-color: rgb(255, 227, 216);
.pageTitle {
position: absolute;
left: 270px;
top: 90px;
width: 210px;
height: 49px;
.webpBg("productListPage/title.png");
}
.backBtn {
position: absolute;
left: 47px;
top: 98px;
width: 16px;
height: 31px;
.webpBg("productListPage/back.png");
}
.listNone {
position: absolute;
top: 400px;
left: 0;
width: 100%;
font-size: 32px;
color: #d62928;
text-align: center;
font-weight: bold;
}
.list_bg {
position: absolute;
left: 19px;
top: 204px;
width: 713px;
height: 1456px;
.webpBg("productListPage/list_bg.png");
}
.products_list {
width: 653px;
// height: 696px;
left: 50px;
top: 210px;
bottom: 0;
position: absolute;
overflow-y: auto;
padding-top: 50px;
box-sizing: border-box;
.product_item {
width: 653px;
height: 173px;
position: relative;
&:not(:last-child) {
margin-bottom: 50px;
}
.product_name {
width: 650px;
height: 30px;
left: 0px;
top: 0px;
position: absolute;
font-size: 28px;
line-height: 30px;
color: rgba(1, 1, 1, 1);
font-weight: bold;
}
.product_rate {
width: 200px;
height: 63px;
left: 0px;
top: 57px;
position: absolute;
.product_rate_label {
width: 100%;
height: 20px;
left: 0px;
top: 46px;
position: absolute;
opacity: 0.6;
font-size: 20px;
line-height: 20px;
color: rgba(1, 1, 1, 1);
.lineClamp1();
}
.product_rate_value {
width: 100%;
height: 32px;
left: 2px;
top: 0px;
position: absolute;
font-size: 32px;
line-height: 32px;
color: rgba(211, 26, 25, 1);
font-weight: bold;
.lineClamp1();
}
}
.product_shu {
width: 280px;
height: 63px;
left: 222px;
top: 57px;
position: absolute;
.product_shu_label {
width: 100%;
height: 20px;
left: 1px;
top: 45px;
position: absolute;
opacity: 0.6;
font-size: 20px;
line-height: 20px;
color: rgba(1, 1, 1, 1);
.lineClamp1();
}
.product_shu_value {
width: 100%;
height: 30px;
left: 0px;
top: 0px;
position: absolute;
font-size: 28px;
line-height: 30px;
color: rgba(0, 0, 0, 1);
font-weight: bold;
.lineClamp1();
}
}
.real_btn {
width: 140px;
height: 49px;
left: 513px;
top: 65px;
position: absolute;
.sparkBg("productListPage/real_btn.png");
}
.product_line {
width: 652px;
height: 2px;
left: 1px;
top: 171px;
position: absolute;
.sparkBg("productListPage/item_line.png");
}
}
}
}
src/pages/productListPage/productListPage.tsx 0 → 100644
View file @ 86091ae1
import React from 'react';
import { observer } from 'mobx-react';
import './productListPage.less';
import { Button } from "@grace/ui";
import { PageCtrl } from "@/core/ctrls/PageCtrl.tsx";
import HomePage from "@/pages/HomePage/HomePage.tsx";
import store from '@/store/store';
import { diffJump, RATE_NAME } from '@/AppTools';
import JumpConfirmPop from '@/panels/jumpConfirmPop/jumpConfirmPop.jsx';
import { ModalCtrl } from '@/core/ctrls/ModalCtrl';
@observer
class ProductListPage extends React.Component<any, any> {
state = {
}
/** 跳转“真实”产品详情页 */
jumpRealDetailHandle = (item) => {
ModalCtrl.showModal(JumpConfirmPop, {
confirmCb: () => {
diffJump(item.realBuyJumpUrl)
}
})
}
clickBack = () => {
PageCtrl.changePage(HomePage);
}
render() {
const { recommendProductConfig } = store.indexData
return <div className="productListPage">
<div className="pageTitle" />
<Button className="backBtn" onClick={this.clickBack} />
<div className="list_bg"></div>
{recommendProductConfig?.length
? <div className="products_list">
{recommendProductConfig?.map((item, index) => (
<div className="product_item" key={`r_prdct_${index}`} onClick={() => this.jumpRealDetailHandle(item.realBuyJumpUrl)}>
<span className="product_name">{item.name}</span>
<div className="product_rate">
{!!item.rate && <span className="product_rate_value">{(item.rate / 100).toFixed(2)}%</span>}
<span className="product_rate_label">{RATE_NAME[item.type] || '年化收益率'}</span>
</div>
<div className="product_shu">
<span className="product_shu_value">{item.shenShuGuiZei}</span>
<span className="product_shu_label">{item.fengXian} ｜ {item.qigouText}</span>
</div>
<Button className="real_btn"></Button>
<span className="product_line"></span>
</div>
))}
</div>
: <div className="listNone">暂无产品哦</div>
}
</div>;
}
}
export default ProductListPage;
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment