添加支付宝埋点，完成花呗

App.vue

@@ -28,6 +28,13 @@ export default {
 
 		// 启动完成
 		console.log(`App 启动耗时: ${Date.now() - startTime}ms`)
+
+		// 初始化埋点，进入支付宝模拟器首页
+		this.$apiUserEvent('all', {
+			type: 'event',
+			key: 'index',
+			value: "进入支付宝模拟器首页",
+		})
 	},
 
 	onShow: function () {
@@ -48,17 +55,17 @@ export default {
 						} catch (error) {
 							//TODO handle the exception
 						}
-						// } else if (event == "jump") {
-						// 	if (data == 'pages/index/index' || data == 'pages/contacts/index' || data ==
-						// 		'pages/discover/index' || data == 'pages/me/index') {
-						// 		uni.switchTab({
-						// 			url: '/' + data
-						// 		});
-						// 	} else {
-						// 		uni.navigateTo({
-						// 			url: '/' + data
-						// 		});
-						// 	}
+					} else if (event == "jump") {
+						if (data) {
+							let pages = getCurrentPages();
+							let currentPage = pages[pages.length - 1];
+							let currentUrl = currentPage.route;
+							if (currentUrl != data) {
+								uni.navigateTo({
+									url: '/' + data
+								});
+							}
+						}
 
 					} else if (event == 'wx_pay_result' || event == 'ios_pay_result') {
 						this.globalData.recentNativeEvent = event
@@ -77,7 +84,7 @@ export default {
 		// 关闭数据库
 		// #ifdef APP
 		// plus.sqlite.closeDatabase({ name: 'zyds' })
-		uni.sendNativeEvent('unimp_stop', "stop", ret => {
+		uni.sendNativeEvent('unimp_stop_alipay', "stop", ret => {
 			// console.log('宿主App回传的数据：' + ret);
 		});
 		// #endif

common/main.css

@@ -381,6 +381,11 @@
 	src: url("/static/font/WeChatSansStd-Light.otf");
 }
 
+@font-face {
+	font-family: "sacramento";
+	src: url("/static/font/Sacramento-Regular.ttf");
+}
+
 .alipay-font {
 	font-family: "alipayNumber";
 }
@@ -396,3 +401,7 @@
 .wx-font-light {
 	font-family: "wxNumberLight";
 }
+
+.sacramento-font {
+	font-family: "sacramento";
+}

components/custom-tab/custom-tab.vue

@@ -0,0 +1,698 @@
+<template>
+	<view class="container">
+		<view class="list">
+			<view class="item" v-for="(item, index) in tabList" :key="item.id"
+				:class="{ 'active': index === activeIndex }" @click="onTabChange(index)">
+				<view class="left">
+					<view class="triangle-concave-transparent ">
+					</view>
+				</view>
+				<view class="box" v-show="index != activeIndex">
+					{{ item.label }} 
+					<image class="closeImage" v-if="isHuise&&index==1" src="/static/image/template/close.png" mode=""></image>
+				</view>
+				<view class="box" v-show="index == activeIndex">
+					<image class="titleImage" :src="item.icon" mode=""></image>
+					<image class="vipImage" v-if="!isHuise||index!=1" src="/static/image/recharge/vip.png" mode=""></image>
+					<image class="vipImage" v-else src="/static/image/template/close.png" mode=""></image>
+				</view>
+				<view class="right">
+					<view class="triangle-concave-transparent leftBox">
+					</view>
+				</view>
+			</view>
+		</view> 
+		<!-- :class="{'centerVip':activeIndex>0&&activeIndex<3,'leftVip':activeIndex==0,'rightVip':activeIndex==3}" -->
+		<view class="vip-benefits-container">
+			<template v-if="activeIndex == 0">
+				<view class="benefit-item" v-for="(benefit, index) in wxList" :key="index">
+					<image class="img" :src="benefit.url" mode=""></image>
+					<view class="name">
+						{{ benefit.name }}
+					</view>
+				</view>
+			</template>
+			<template v-else-if="activeIndex == 1">
+				<view class="benefit-item" v-for="(benefit, index) in alList" :key="index">
+					<image class="img" :src="benefit.url" mode=""></image>
+					<view class="name">
+						{{ benefit.name }}
+					</view>
+				</view>
+			</template>
+			<template v-else-if="activeIndex == 2">
+				<view class="benefit-item" v-for="(benefit, index) in anyList" :key="index">
+					<image class="img" :src="benefit.url" mode=""></image>
+					<view class="name">
+						{{ benefit.name }}
+					</view>
+				</view>
+			</template>
+			<template v-else>
+				<image class="qydb" src="/static/image/recharge/qydb.png" mode="widthFix"></image>
+			</template>
+		</view>
+	</view>
+</template>
+
+<script>
+
+export default {
+	name: 'custom-tab',
+	props: {
+		isHuise: {
+			type: Boolean,
+			default: true
+		}
+	},
+	data() {
+		return {
+			tabActiveInd: 0,
+			// 当前激活的tab索引
+			activeIndex: 0,
+			chunjie:{
+				"wxList": [
+					{
+						"name": "AI聊天模板",
+						"url": "/static/image/recharge/chunjie/mo.png"
+					},
+					{
+						"name": "聊天转账",
+						"url": "/static/image/recharge/chunjie/li.png"
+					},
+					{
+						"name": "限额设置",
+						"url": "/static/image/recharge/chunjie/wei.png"
+					},
+					{
+						"name": "零钱修改",
+						"url": "/static/image/recharge/chunjie/xing.png"
+					},
+					{
+						"name": "零钱通",
+						"url": "/static/image/recharge/chunjie/jin.png"
+					},
+					{
+						"name": "分付",
+						"url": "/static/image/recharge/chunjie/ma.png"
+					},
+					{
+						"name": "账单",
+						"url": "/static/image/recharge/chunjie/song.png"
+					},
+					{
+						"name": "朋友圈",
+						"url": "/static/image/recharge/chunjie/fu.png"
+					}
+				],
+				"alList": [
+					{
+						"name": "余额模拟",
+						"url": "/static/image/recharge/chunjie/mo.png"
+					},
+					{
+						"name": "账单生成",
+						"url": "/static/image/recharge/chunjie/li.png"
+					},
+					{
+						"name": "理财",
+						"url": "/static/image/recharge/chunjie/xiao.png"
+					},
+					{
+						"name": "花呗",
+						"url": "/static/image/recharge/chunjie/bao.png"
+					},
+					{
+						"name": "账单详情",
+						"url": "/static/image/recharge/chunjie/ma.png"
+					},
+					{
+						"name": "逾期",
+						"url": "/static/image/recharge/chunjie/yue.png"
+					},
+					{
+						"name": "黑卡",
+						"url": "/static/image/recharge/chunjie/xin.png"
+					},
+					{
+						"name": "热门图标",
+						"url": "/static/image/recharge/chunjie/nian.png"
+					}
+				],
+				"anyList": [
+					{
+						"name": "无广告",
+						"url": "/static/image/recharge/chunjie/2.png"
+					},
+					{
+						"name": "无水印",
+						"url": "/static/image/recharge/chunjie/0.png"
+					},
+					{
+						"name": "专属客服",
+						"url": "/static/image/recharge/chunjie/2.png"
+					},
+					{
+						"name": "多设备",
+						"url": "/static/image/recharge/chunjie/6.png"
+					},
+					{
+						"name": "朋友圈素材",
+						"url": "/static/image/recharge/chunjie/gong.png"
+					},
+					{
+						"name": "豪车视频",
+						"url": "/static/image/recharge/chunjie/he.png"
+					},
+					{
+						"name": "小决定",
+						"url": "/static/image/recharge/chunjie/xin.png"
+					},
+					{
+						"name": "随机数",
+						"url": "/static/image/recharge/chunjie/zhu.png"
+					}
+				]
+			 
+			},
+			anyList:[
+				{
+					name: "无广告",
+					url: "/static/image/recharge/icon1.png"
+				},
+				{
+					name: "无水印",
+					url: "/static/image/recharge/icon2.png"
+				},
+				{
+					name: "专属客服",
+					url: "/static/image/recharge/icon3.png"
+				},
+				{
+					name: "多设备",
+					url: "/static/image/recharge/icon4.png"
+				},
+				{
+					name: "朋友圈素材",
+					url: "/static/image/recharge/icon12.png"
+				},
+				{
+					name: "豪车视频",
+					url: "/static/image/recharge/icon20.png"
+				},
+				{
+					name: "小决定",
+					url: "/static/image/recharge/icon19.png"
+				},
+				{
+					name: "随机数",
+					url: "/static/image/recharge/icon18.png"
+				}
+			],
+			alList:[],
+			qrj:{
+				"wxList": [
+					{
+						"name": "AI聊天模板",
+						"url": "/static/image/recharge/214/icon5.png"
+					},
+					{
+						"name": "聊天转账",
+						"url": "/static/image/recharge/214/icon6.png"
+					},
+					{
+						"name": "限额设置",
+						"url": "/static/image/recharge/214/icon7.png"
+					},
+					{
+						"name": "零钱修改",
+						"url": "/static/image/recharge/214/icon8.png"
+					},
+					{
+						"name": "零钱通",
+						"url": "/static/image/recharge/214/icon9.png"
+					},
+					{
+						"name": "分付",
+						"url": "/static/image/recharge/214/icon10.png"
+					},
+					{
+						"name": "账单",
+						"url": "/static/image/recharge/214/icon11.png"
+					},
+					{
+						"name": "朋友圈",
+						"url": "/static/image/recharge/214/icon12.png"
+					}
+				],
+				"anyList": [
+					{
+						"name": "无广告",
+						"url": "/static/image/recharge/214/icon1.png"
+					},
+					{
+						"name": "无水印",
+						"url": "/static/image/recharge/214/icon2.png"
+					},
+					{
+						"name": "专属客服",
+						"url": "/static/image/recharge/214/icon3.png"
+					},
+					{
+						"name": "多设备",
+						"url": "/static/image/recharge/214/icon4.png"
+					},
+					{
+						"name": "朋友圈素材",
+						"url": "/static/image/recharge/214/icon12.png"
+					},
+					{
+						"name": "豪车视频",
+						"url": "/static/image/recharge/214/icon20.png"
+					},
+					{
+						"name": "小决定",
+						"url": "/static/image/recharge/214/icon19.png"
+					},
+					{
+						"name": "随机数",
+						"url": "/static/image/recharge/214/icon18.png"
+					}
+				],
+				"alList": [
+					{
+						"name": "余额模拟",
+						"url": "/static/image/recharge/214/icon8.png"
+					},
+					{
+						"name": "账单生成",
+						"url": "/static/image/recharge/214/icon11.png"
+					},
+					{
+						"name": "理财",
+						"url": "/static/image/recharge/214/icon17.png"
+					},
+					{
+						"name": "花呗",
+						"url": "/static/image/recharge/214/icon16.png"
+					},
+					{
+						"name": "账单详情",
+						"url": "/static/image/recharge/214/icon21.png"
+					},
+					{
+						"name": "逾期",
+						"url": "/static/image/recharge/214/icon13.png"
+					},
+					{
+						"name": "黑卡",
+						"url": "/static/image/recharge/214/icon14.png"
+					},
+					{
+						"name": "热门图标",
+						"url": "/static/image/recharge/214/icon15.png"
+					}
+				]
+				
+			},
+			alListZC:[
+				{
+					name: "余额模拟",
+					url: "/static/image/recharge/icon8.png"
+				},
+				{
+					name: "账单生成",
+					url: "/static/image/recharge/icon11.png"
+				},
+				{
+					name: "理财",
+					url: "/static/image/recharge/icon17.png"
+				},
+				{
+					name: "花呗",
+					url: "/static/image/recharge/icon16.png"
+				},
+				{
+					name: "账单详情",
+					url: "/static/image/recharge/icon21.png"
+				},
+				{
+					name: "逾期",
+					url: "/static/image/recharge/icon13.png"
+				},
+				{
+					name: "黑卡",
+					url: "/static/image/recharge/icon14.png"
+				},
+				{
+					name: "热门图标",
+					url: "/static/image/recharge/icon15.png"
+				}
+			],
+			alListHS:[
+				{
+					name: "余额模拟",
+					url: "/static/image/recharge/huise/icon8.png"
+				},
+				{
+					name: "账单生成",
+					url: "/static/image/recharge/huise/icon11.png"
+				},
+				{
+					name: "理财",
+					url: "/static/image/recharge/huise/icon17.png"
+				},
+				{
+					name: "花呗",
+					url: "/static/image/recharge/huise/icon16.png"
+				},
+				{
+					name: "账单详情",
+					url: "/static/image/recharge/huise/icon21.png"
+				},
+				{
+					name: "逾期",
+					url: "/static/image/recharge/huise/icon13.png"
+				},
+				{
+					name: "黑卡",
+					url: "/static/image/recharge/huise/icon14.png"
+				},
+				{
+					name: "热门图标",
+					url: "/static/image/recharge/huise/icon15.png"
+				}
+			],
+			wxList: [
+				{
+					name: "AI聊天模板",
+					url: "/static/image/recharge/icon5.png"
+				},
+				{
+					name: "聊天转账",
+					url: "/static/image/recharge/icon6.png"
+				},
+				{
+					name: "限额设置",
+					url: "/static/image/recharge/icon7.png"
+				},
+				{
+					name: "零钱修改",
+					url: "/static/image/recharge/icon8.png"
+				},
+				{
+					name: "零钱通",
+					url: "/static/image/recharge/icon9.png"
+				},
+				{
+					name: "分付",
+					url: "/static/image/recharge/icon10.png"
+				},
+				{
+					name: "账单",
+					url: "/static/image/recharge/icon11.png"
+				},
+				{
+					name: "朋友圈",
+					url: "/static/image/recharge/icon12.png"
+				}
+			],
+			// tab数据列表
+			tabList: [
+				{ label: '微信特权', icon: '/static/image/recharge/weixin.png' },
+				{ label: '小宝特权', icon: '/static/image/recharge/aili.png' },
+				{ label: '通用特权', icon: '/static/image/recharge/tytq.png' },
+				{ label: '权益对比', icon: '/static/image/recharge/qy.png' }
+			]
+		};
+	},
+	watch: {
+		isHuise(newValue, oldValue) {
+			console.log(newValue)
+			console.log(this.alList[0].url.indexOf('recharge/huise/icon')!=-1)
+				this.alList.forEach(element => {
+					if(element.url.indexOf('recharge/huise/icon')!=-1){
+						if(!newValue) {
+							// element.url = element.url.replace('recharge/huise/icon','recharge/icon');
+							const config = uni.getStorageSync('config').config
+							const themeConfig = config?.['client.uniapp.theme']
+							if(themeConfig?.enable){
+								if(themeConfig?.theme=='0214'){
+									this.alList= this.qrj.alList
+								}else if(themeConfig?.theme=='0217'){
+									this.alList= this.chunjie.alList
+								}
+							}else{
+								this.alList=this.alListZC
+							}
+						}
+					}else{
+						if(newValue) {
+							// element.url = element.url.replace('recharge/icon', 'recharge/huise/icon');
+							this.alList=this.alListHS
+						}
+						
+					}
+					
+				});
+		}
+	},
+	mounted() {
+		this.alList=this.alListZC
+		const config = uni.getStorageSync('config').config
+		console.log("config",config)
+		const themeConfig = config?.['client.uniapp.theme']
+		console.log("themeConfig",themeConfig)
+		if(themeConfig?.enable){
+			if(themeConfig?.theme=='0214'){
+				this.wxList= this.qrj.wxList
+				this.alList= this.qrj.alList
+				this.anyList= this.qrj.anyList
+			}else if(themeConfig?.theme=='0217'){
+				this.wxList= this.chunjie.wxList
+				this.alList= this.chunjie.alList
+				this.anyList= this.chunjie.anyList
+			}
+		}
+		if(this.isHuise) {
+			this.alList=this.alListHS
+			// this.alList.forEach(element => {
+			// 	element.url = element.url.replace('recharge/icon', 'recharge/huise/icon');
+			// });
+		}
+	},
+	methods: {
+		// tab切换事件
+		onTabChange(index) {
+			this.activeIndex = index;
+		}
+	}
+};
+</script>
+
+<style lang="scss" scoped>
+.container {
+	margin:0 20px 20px 20px;
+	overflow: hidden;
+}
+
+.list {
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	background-image: url('/static/image/recharge/tabBg.png');
+	background-size: 100% 68px;
+	background-position: 0 5px;
+	background-repeat: no-repeat;
+	.item {
+		width: 100%;
+		height: 42px;
+		// background-color: #;
+		border-radius: 14px 14px 0 0;
+		position: relative;
+		line-height: 47px;
+		text-align: center;
+		font-size: 12px;
+		color: #fff;
+		// transition: all 0.3s ease-in-out;
+		cursor: pointer;
+		.box{
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			.titleImage{
+				width: 45px;
+				height: 11px;
+				margin-top: 16px;
+			}
+			.vipImage{
+				margin-top: 15px;
+				width: 12px;
+				height: 12px;
+			}
+			.closeImage{
+				width: 12px;
+				height: 12px;
+			}
+			
+		}
+
+
+
+		.left {
+			display: none;
+			position: absolute;
+			bottom: 0;
+			left: -25px;
+			// transition: all 0.3s ease-in-out;
+			transform-origin: right center;
+			// transform: scaleX(0);
+		}
+
+		.right {
+			display: none;
+			position: absolute;
+			bottom: 0;
+			right: -25px;
+			// transition: all 0.3s ease-in-out;
+			transform-origin: left center;
+			// transform: scaleX(0);
+		}
+	}
+
+	.active {
+		background-color: #fff;
+		color: #000;
+		// transition: all 0.3s ease-in-out;
+
+		.left {
+			display: block;
+			// transform: scaleX(1);
+		}
+
+		.right {
+			display: block;
+			// transform: scaleX(1);
+		}
+	}
+
+	.triangle-concave-transparent {
+		transform: rotate(180deg);
+		width: 25px;
+		height: 25px;
+		position: relative;
+		background-color: #fff;
+
+		/* 创建直角三角形遮罩 */
+		mask:
+			/* 步骤1：先创建一个直角三角形区域 */
+			linear-gradient(315deg,
+				transparent 0%,
+				transparent calc(50% - 1px),
+				black 50%,
+				black 100%),
+			/* 步骤2：从右下角创建一个径向渐变来切割出凹陷 */
+			radial-gradient(circle at 100% 100%,
+				transparent calc(50.5% + 7px),
+				/* 控制凹陷深度，值越大凹陷越深 */
+				black calc(50.5% + 7px));
+
+		mask-composite: intersect;
+		-webkit-mask-composite: source-in;
+		mask-size: 100% 100%;
+		mask-position: 0 0;
+		mask-repeat: no-repeat;
+	}
+
+	.leftBox {
+		transform: rotate(270deg);
+	}
+}
+.leftVip{
+	border-radius:0 14px 14px 14px !important;
+}
+.rightVip{
+	border-radius:14px 0 14px 14px !important;
+}
+.centerVip{
+	border-radius: 14px !important;
+}
+.vip-benefits-container {
+	border-radius:0 0 14px 14px;
+	background-color: #FFFFFF;
+	padding: 16px 0px 0 0;
+	display: flex;
+	justify-content: space-between;
+	flex-wrap: wrap;
+	align-items: center;
+	background-color: #FFFFFF;
+	animation: fadeInUp2 0.6s ease-out;
+
+	.benefit-item {
+		width: 25%;
+		display: flex;
+		flex-direction: column;
+		justify-content: center;
+		align-items: center;
+		margin-bottom: 16px;
+		transition: all 0.3s ease-in-out;
+		animation: fadeInUp 0.3s ease-out;
+
+		// 为每个item添加延迟动画
+		@for $i from 1 through 12 {
+			&:nth-child(#{$i}) {
+				animation-delay: #{$i * 0.1}s;
+				animation-fill-mode: both;
+			}
+		}
+
+		// 悬停效果
+		&:hover {
+			// transform: translateY(-4px);
+			// box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+		}
+
+		.img {
+			width: 76rpx;
+			height: 76rpx;
+			transition: all 0.3s ease-in-out;
+		}
+
+		.name {
+			font-size: 10px;
+			margin-top: 16rpx;
+			transition: all 0.3s ease-in-out;
+		}
+	}
+	.qydb{
+		margin: 10px;
+		width: calc(100% - 20px);
+		// transition: all 0.3s ease-in-out;
+		animation: fadeInUp 0.3s ease-out;
+	}
+
+}
+
+// 淡入上移动画
+@keyframes fadeInUp {
+	from {
+		opacity: 0;
+		transform: translateY(20px);
+	}
+
+	to {
+		opacity: 1;
+		transform: translateY(0);
+	}
+}
+// 淡入上移动画
+@keyframes fadeInUp2 {
+	from {
+		opacity: 0;
+	}
+
+	to {
+		opacity: 1;
+	}
+}
+</style>

components/nav-bar/nav-bar.vue

@@ -103,6 +103,10 @@ const props = defineProps({
 	zIndex: {
 		type: Number,
 		default: 999
+	},
+	noBack: {
+		type: Boolean,
+		default: false
 	}
 })
 
@@ -129,6 +133,7 @@ const openPopup = () => {
 const onBack = () => {
 	emit('back')
 	// 默认返回上一页
+	if (props.noBack) return
 	uni.navigateBack()
 }
 

main.js

@@ -1,5 +1,6 @@
 import App from './App'
 import globalMethods from '@/utils/globalMethods.js';
+import pageData from "@/static/json/page.json"
 // #ifndef VUE3
 import Vue from 'vue'
 import './uni.promisify.adaptor'
@@ -22,10 +23,13 @@ import {
 export function createApp() {
 	const app = createSSRApp(App)
 	// 从缓存读取系统信息（已在App.vue中获取）
+	app.config.globalProperties.$pageData = pageData
 	const systemInfo = uni.getStorageSync('systemInfo') || {}
 	app.config.globalProperties.$system = systemInfo.platform == 'ios' ? 'iOS' : 'Android'
 	app.config.globalProperties.$systemInfo = systemInfo
-	uni.setStorageSync('version', '1.0.0')
+	uni.setStorageSync('version', '1.0.0.sp2')
+	app.config.globalProperties.$version = uni.getStorageSync('version')
+
 	app.use(globalMethods);
 	return {
 		app

pages.json

@@ -70,6 +70,15 @@
 					}
 				}
 			]
+		}, {
+			"root": "pages/finance-management",
+			"pages": [{
+				"path": "index",
+				"style": {
+					"navigationBarTitleText": "理财首页",
+					"navigationStyle": "custom"
+				}
+			}]
 		},
 		{
 			"root": "pages/common",

pages/ant-credit-pay/index.vue

@@ -23,11 +23,11 @@
 
 				<view class="nav-bar flex-between w100" :class="{ 'ios-nav-bar': $system == 'iOS' }">
 					<view class="flex-align-center flex-1">
-						<view class="left" @click.stop="goBack">
+						<view class="left flex-align-center" @click.stop="goBack">
 							<image class=" back-icon" src="/static/image/nav-bar/back-white.png" mode="">
 							</image>
 						</view>
-						<view class="title ">
+						<view class="title flex-align-center">
 							花呗
 						</view>
 					</view>
@@ -38,7 +38,8 @@
 					</view>
 				</view>
 			</NavBar>
-			<NavBar v-else title="拼图" bgColor="#EFEFEF" isRightButton @right-click="confirmImage">
+			<NavBar v-else title="拼图" bgColor="#EFEFEF" noBack @back="closeImage" isRightButton
+				@right-click="confirmImage">
 			</NavBar>
 			<view v-if="huabeiInfo.styleType == 1" class="current-month">{{ huabeiInfo.mouth }}月应还(元)</view>
 			<view v-else class="current-month">{{ huabeiInfo.mouth }}月账单累计中(元)</view>
@@ -46,6 +47,7 @@
 				<text class="money alipay-font">{{ numberUtil.formatMoneyWithThousand(huabeiInfo.money) }}</text>
 				<uni-icons type="right" size="16" color="#B9D6FF"></uni-icons>
 			</view>
+			<!-- 样式一 按钮样式 -->
 			<view v-if="huabeiInfo.styleType == 1 || !huabeiInfo.styleType" class="style-1 button-group">
 				<view class="button-item second-button" :class="{ 'ios-button': $system == 'iOS' }">立即还款</view>
 				<view v-if="!huabeiInfo.isInstallment" class="button-item primary-button"
@@ -55,12 +57,14 @@
 					</view>
 				</view>
 			</view>
+			<!-- 样式二 纯气泡样式 -->
 			<view v-if="huabeiInfo.styleType == 2" class="style-2 bubble-container">
 				<view class="bubble-box">
 					<view class="arrow"></view>
 					<text class="text">{{ huabeiInfo.descText }}</text>
 				</view>
 			</view>
+			<!-- 样式三 气泡带箭头样式 -->
 			<view v-if="huabeiInfo.styleType == 3" class="style-3 bubble-container">
 				<view class="bubble-box">
 					<view class="arrow"></view>
@@ -84,7 +88,7 @@
 			</view>
 		</view>
 		<view v-if="!selectedImage" class="image-box flex-1 flex-align-center flex-column flex-justify-center"
-			@longpress="chooseImage">
+			@touchstart="handleTouchStart" @touchend="handleTouchEnd">
 			<view v-if="!huabeiInfo.image" class="flex-align-center flex-column">
 				<image style="width:92rpx; height: 92rpx;margin-top: 16rpx;"
 					src="/static/image/common/upload-screenshot.png">
@@ -130,16 +134,16 @@
 					<text class="label">总计额度</text>
 					<input class="input" type="digit" v-model="editHuabeiInfo.totalAmount" placeholder="请输入总计额度" />
 				</view>
-				<view class="form-item">
+				<view v-if="huabeiInfo.styleType != 1" class="form-item">
 					<text class="label">气泡文本</text>
 					<input class="input" type="text" v-model="editHuabeiInfo.descText" placeholder="请输入描述文本" />
 				</view>
-				<view class="form-item">
+				<view v-if="huabeiInfo.styleType == 1 && !editHuabeiInfo.isInstallment" class="form-item">
 					<text class="label">分期气泡</text>
 					<input class="input" type="text" v-model="editHuabeiInfo.installmentBadgeText"
 						placeholder="请输入分期还款气泡文案" />
 				</view>
-				<view class="form-item flex-between">
+				<view v-if="huabeiInfo.styleType == 1" class="form-item flex-between">
 					<text class="label">是否分期</text>
 					<switch :checked="editHuabeiInfo.isInstallment" style="transform: scale(0.8);"
 						@change="e => editHuabeiInfo.isInstallment = e.detail.value" />
@@ -195,6 +199,7 @@ import {
 } from '@dcloudio/uni-app';
 
 const instance = getCurrentInstance();
+const { proxy } = instance;
 
 
 const buttonGroup = [{
@@ -288,6 +293,12 @@ const onMonthChange = (e) => {
 }
 
 onLoad((option) => {
+	// 进入花呗页面埋点
+	proxy.$apiUserEvent('all', {
+		type: 'click',
+		key: 'huabei',
+		value: "花呗"
+	})
 	console.log(option)
 	// 读取缓存
 	let savedInfo = uni.getStorageSync(data.huabeiInfoStorageKey)
@@ -306,7 +317,9 @@ onLoad((option) => {
 onShow(() => {
 	// #ifdef APP-PLUS
 	util.setAndroidSystemBarColor('#ffffff')
+	setTimeout(() => {
 		plus.navigator.setStatusBarStyle("light");
+	}, 500)
 	// #endif
 })
 
@@ -324,6 +337,14 @@ const closeDialog = () => {
 
 // 确认修改
 const confirmDialog = () => {
+	// 校验数据: 本月应还不能大于总计额度
+	if (Number(editHuabeiInfo.value.money) > Number(editHuabeiInfo.value.totalAmount)) {
+		uni.showToast({
+			title: '本月应还不能大于总计额度',
+			icon: 'none'
+		})
+		return
+	}
 	data.huabeiInfo = JSON.parse(JSON.stringify(editHuabeiInfo.value))
 	// 保存到缓存
 	uni.setStorageSync(data.huabeiInfoStorageKey, data.huabeiInfo)
@@ -403,8 +424,8 @@ const confirmImage = () => {
 						canvasId: 'crop-canvas',
 						width: canvasW,
 						height: canvasH,
-						destWidth: canvasW * 2, // 导出更高清
-						destHeight: canvasH * 2,
+						destWidth: sWidth, // 使用原图实际宽度,保持原图清晰度
+						destHeight: sHeight, // 使用原图实际高度,保持原图清晰度
 						success: (res) => {
 							console.log('crop success (temp)', res
 								.tempFilePath)
@@ -413,25 +434,18 @@ const confirmImage = () => {
 							uni.saveFile({
 								tempFilePath: res.tempFilePath,
 								success: (saveRes) => {
-									console.log(
-										'save success (saved)',
-										saveRes
-											.savedFilePath)
-									data.huabeiInfo.image =
-										saveRes.savedFilePath
-									selectedImage.value =
-										'' // 隐藏编辑模式
-
+									console.log('save success (saved)', saveRes.savedFilePath)
+									data.huabeiInfo.image = saveRes.savedFilePath
+									selectedImage.value = '' // 隐藏编辑模式
+									setTimeout(() => {
+										plus.navigator.setStatusBarStyle("light");
+									}, 200)
 									// 保存到缓存
-									uni.setStorageSync(data
-										.huabeiInfoStorageKey,
-										data.huabeiInfo)
+									uni.setStorageSync(data.huabeiInfoStorageKey, data.huabeiInfo)
 									uni.hideLoading()
 								},
 								fail: (err) => {
-									console.error(
-										'saveFile fail',
-										err)
+									console.error('saveFile fail', err)
 									uni.hideLoading()
 									uni.showToast({
 										title: '保存失败',
@@ -484,10 +498,36 @@ const chooseImage = () => {
 		success: (res) => {
 			selectedImage.value = res.tempFilePaths[0]
 			data.showMask = true
+			setTimeout(() => {
+				plus.navigator.setStatusBarStyle("dark");
+			}, 500)
 		}
 	})
 }
 
+// 长按事件定时器
+let longPressTimer = null
+const handleTouchStart = () => {
+	longPressTimer = setTimeout(() => {
+		uni.vibrateShort()
+		chooseImage()
+	}, 1200) // 长按时间大于1s
+}
+
+const handleTouchEnd = () => {
+	if (longPressTimer) {
+		clearTimeout(longPressTimer)
+		longPressTimer = null
+	}
+}
+
+const closeImage = () => {
+	selectedImage.value = ''
+	data.showMask = false
+	plus.navigator.setStatusBarStyle("light");
+	return false
+}
+
 const closeMask = () => {
 	data.showMask = false
 }
@@ -516,11 +556,18 @@ const goBack = () => {
 		align-items: center;
 		padding: 0 20rpx;
 
+		.left {
+			display: flex;
+			align-items: center;
+		}
+
 		.title {
 			color: #ffffff;
 			font-size: 17px;
 			font-weight: 500;
 			text-align: center;
+			display: flex;
+			align-items: center;
 		}
 
 		.right {

pages/ant-credit-pay/overdue-payment/overdue-payment.vue

@@ -7,7 +7,7 @@
 			<view class="header-bg"></view>
 
 			<!-- 导航栏 - 降低层级以显示水印 -->
-			<NavBar title="花呗 | 信用购" :bgColor="'transparent'" textColor="#fff" :isFixed="true" :zIndex="10"
+			<NavBar title="花呗 | 信用购" :bgColor="'#717E91'" textColor="#fff" :isFixed="true" :zIndex="10"
 				:buttonGroup="buttonGroup" @button-click="clickTitlePopupButton">
 				<!-- 使用作用域插槽自定义按钮渲染，特别是switch的checked绑定 -->
 				<template #button="{ button }">
@@ -21,11 +21,11 @@
 				</template>
 				<view class="nav-bar flex-between w100" :class="{ 'ios-nav-bar': $system == 'iOS' }">
 					<view class="flex-align-center flex-1">
-						<view class="left" @click.stop="goBack">
+						<view class="left flex-align-center" @click.stop="goBack">
 							<image class=" back-icon" src="/static/image/nav-bar/back-white.png" mode="">
 							</image>
 						</view>
-						<view class="title ">
+						<view class="title flex-align-center">
 							花呗
 						</view>
 					</view>
@@ -83,10 +83,10 @@
 			<view class="left flex-align-center">
 				<image class="img " src="/static/image/ant-credit-pay/overdue-payment/consume-dot.png">
 				</image>
-				<view class="text-box">消费记录</view>
+				<view class="text-box">消费成功{{ Number(huabeiInfo.consumptionAmount).toFixed(2) }}元</view>
 			</view>
 			<view class="right flex-align-center">
-				<view class="date">2025/09/22</view>
+				<view class="date">{{ huabeiInfo.consumptionDate }}</view>
 				<image class="icon" src="/static/image/ant-credit-pay/overdue-payment/right-icon.png"></image>
 			</view>
 		</view>
@@ -117,6 +117,20 @@
 					<text class="label">总计额度</text>
 					<input class="input" type="digit" v-model="editHuabeiInfo.totalAmount" placeholder="请输入总计额度" />
 				</view>
+				<!-- <text>消费信息</text> -->
+				<view class="form-item">
+					<text class="label">消费金额</text>
+					<input class="input" type="digit" v-model="editHuabeiInfo.consumptionAmount"
+						placeholder="请输入消费金额" />
+				</view>
+				<view class="form-item">
+					<text class="label">消费日期</text>
+					<picker mode="date" :fields="$system == 'Android' ? 'day' : ''"
+						:value="editHuabeiInfo.consumptionDate" @change="onConsumptionDateChange"
+						:end="dateUtil.now('YYYY-MM-DD')" style="flex:1">
+						<view class="input">{{ editHuabeiInfo.consumptionDate || '请选择日期' }}</view>
+					</picker>
+				</view>
 				<view class="popup-btns">
 					<view class="btn cancel" @click="closeDialog">取消</view>
 					<view class="btn confirm" @click="confirmDialog">确定</view>
@@ -139,18 +153,23 @@
 import NavBar from '@/components/nav-bar/nav-bar'
 import {
 	numberUtil,
+	dateUtil,
 	util
 } from '@/utils/common.js'
 import {
 	ref,
 	toRefs,
-	reactive
+	reactive,
+	getCurrentInstance
 } from 'vue';
 import {
 	onLoad,
 	onShow
 } from '@dcloudio/uni-app';
 
+const instance = getCurrentInstance();
+const { proxy } = instance;
+
 const buttonGroup = [{
 	name: "编辑花呗数据",
 	click: () => {
@@ -169,7 +188,6 @@ const buttonGroup = [{
 		}
 	}
 }]
-
 const serviceList = [{
 	id: 1,
 	name: "花呗金",
@@ -217,7 +235,9 @@ const data = reactive({
 		installmentBadgeText: '4折起',
 		image: "",
 		isOverdue: false,
-		daysPastDue: 1
+		daysPastDue: 1,
+		consumptionAmount: 66.5,
+		consumptionDate: '2025/09/22'
 	},
 })
 
@@ -236,7 +256,18 @@ const onMonthChange = (e) => {
 	editHuabeiInfo.value.mouth = monthRange[e.detail.value]
 }
 
+const onConsumptionDateChange = (e) => {
+	// e.detail.value 格式通常为 YYYY-MM-DD，如果需要 YYYY/MM/DD 可以转换
+	editHuabeiInfo.value.consumptionDate = e.detail.value.replace(/-/g, '/')
+}
+
 onLoad((option) => {
+	// 进入花呗页面埋点
+	proxy.$apiUserEvent('all', {
+		type: 'click',
+		key: 'huabei',
+		value: "花呗"
+	})
 	console.log(option)
 	// 读取缓存
 	let savedInfo = uni.getStorageSync(data.huabeiInfoStorageKey)
@@ -255,6 +286,9 @@ onLoad((option) => {
 onShow(() => {
 	// #ifdef APP-PLUS
 	util.setAndroidSystemBarColor('#F6F6F6')
+	setTimeout(() => {
+		plus.navigator.setStatusBarStyle("light");
+	}, 500)
 	// #endif
 })
 
@@ -272,6 +306,14 @@ const closeDialog = () => {
 
 // 确认修改
 const confirmDialog = () => {
+	// 校验数据: 本月应还不能大于总计额度
+	if (Number(editHuabeiInfo.value.money) > Number(editHuabeiInfo.value.totalAmount)) {
+		uni.showToast({
+			title: '本月应还不能大于总计额度',
+			icon: 'none'
+		})
+		return
+	}
 	data.huabeiInfo = JSON.parse(JSON.stringify(editHuabeiInfo.value))
 	// 保存到缓存
 	uni.setStorageSync(data.huabeiInfoStorageKey, data.huabeiInfo)
@@ -298,7 +340,8 @@ const goBack = () => {
 	flex-direction: column;
 	background-color: #F6F6F6;
 	height: 100vh;
-	overflow: hidden;
+	// overflow: hidden;
+	padding-bottom: 16rpx;
 
 	.nav-bar {
 		height: 100%;
@@ -314,7 +357,7 @@ const goBack = () => {
 		}
 
 		.right {
-			width: 80px;
+			width: 90px;
 		}
 
 		.icon {
@@ -327,7 +370,7 @@ const goBack = () => {
 
 	.ios-nav-bar {
 		.left {
-			width: 80px;
+			width: 90px;
 		}
 
 		.title {
@@ -338,7 +381,7 @@ const goBack = () => {
 		}
 
 		.right {
-			width: 80px;
+			width: 90px;
 		}
 	}
 
@@ -421,7 +464,7 @@ const goBack = () => {
 
 				.label {
 					color: #ffffff;
-					font-size: 30rpx;
+					font-size: 26rpx;
 					line-height: 42rpx;
 				}
 
@@ -443,6 +486,7 @@ const goBack = () => {
 		background-image: url('/static/image/ant-credit-pay/overdue-payment/overdue-bg.png');
 		background-size: contain;
 		background-repeat: no-repeat;
+		margin-top: -1px;
 
 		.overdue-info {
 			width: 654rpx;
@@ -519,7 +563,7 @@ const goBack = () => {
 	}
 
 	.consumption-box {
-		margin: 16rpx 24rpx;
+		margin: 16rpx 24rpx 16rpx;
 		background-color: #ffffff;
 		border-radius: 12rpx;
 		padding: 24rpx 16rpx;

pages/balance/index.vue

@@ -114,7 +114,6 @@
 import NavBar from '@/components/nav-bar/nav-bar'
 import BalanceList from '@/components/balance-list/balance-list.vue'
 import { fastEntranceList } from '@/static/json/initial.json'
-
 import {
 	util,
 	deviceUtil
@@ -128,7 +127,8 @@ import {
 	ref,
 	onMounted,
 	watch,
-	toRefs
+	toRefs,
+	getCurrentInstance
 } from 'vue'
 
 import {
@@ -136,6 +136,8 @@ import {
 	onShow
 } from '@dcloudio/uni-app'
 
+const { appContext, proxy } = getCurrentInstance();
+
 // 导入状态管理
 import {
 	useStore,
@@ -179,7 +181,7 @@ const data = reactive({
 		bgColor: "#00000000"
 	},
 	statusBarHeight: 0,
-	balance: 1000000,
+	balance: 888888,
 	windowHeight: 0,
 	changeDetailList: [],
 	menuList: [],
@@ -198,6 +200,13 @@ onLoad(async () => {
 	updateStatusBarHeight()
 	data.windowHeight = await deviceUtil.getWindowHeight()
 
+	// 进入余额页面埋点
+	proxy.$apiUserEvent('all', {
+		type: 'click',
+		key: 'balance',
+		value: "余额"
+	})
+
 })
 
 onShow(() => {
@@ -307,6 +316,16 @@ const dialogInputConfirm = () => {
 		data.balance = 999999999.00
 	}
 	storage.set('balance', data.balance)
+
+	// 修改余额埋点
+	proxy.$apiUserEvent('all', {
+		type: 'event',
+		key: 'edit_balance',
+		value: "修改零钱余额",
+		extra: {
+			balance: data.balance
+		}
+	})
 	inputDialog.value.close()
 }
 

pages/bill/bill-list/bill-list.vue

@@ -139,15 +139,20 @@ import {
 	toRefs,
 	onMounted,
 	ref,
-	computed
+	computed,
+	getCurrentInstance
 } from 'vue'
 import {
 	useStore
 } from '@/store/index.js'
 import {
 	onShow,
+	onLoad
 } from '@dcloudio/uni-app'
 
+const instance = getCurrentInstance();
+const { proxy } = instance;
+
 // 存储卡片的 ref
 const cardRefs = ref([])
 
@@ -255,6 +260,15 @@ onShow(() => {
 	// #endif
 })
 
+onLoad(() => {
+	// 进入账单页面埋点
+	proxy.$apiUserEvent('all', {
+		type: 'click',
+		key: 'bill',
+		value: "账单"
+	})
+})
+
 /**
  * 获取账单列表
  */

pages/common/alipay-annual-bill/alipay-annual-bill.vue

@@ -165,7 +165,8 @@
 import {
 	ref,
 	reactive,
-	toRefs
+	toRefs,
+	getCurrentInstance
 } from 'vue';
 import {
 	onLoad,
@@ -176,6 +177,9 @@ const statusBarHeight = ref(0);
 const dialogPopup = ref(null);
 const timeDialogPopup = ref(null);
 
+const instance = getCurrentInstance();
+const { proxy } = instance;
+
 const data = reactive({
 	totalMoney: 10000000,
 	time: "",
@@ -215,6 +219,12 @@ let {
 
 
 onLoad(() => {
+	// 进入花呗页面埋点
+	proxy.$apiUserEvent('all', {
+		type: 'click',
+		key: 'year_in_review',
+		value: "年度账单"
+	})
 	time.value = getYesterday();
 	statusBarHeight.value = uni.getSystemInfoSync().statusBarHeight;
 

pages/finance-management/index.vue

@@ -0,0 +1,352 @@
+<template>
+	<view class="container">
+		<view class="main-info-container">
+			<!-- 导航栏 placeholder -->
+			<NavBar bgColor="transparent">
+				<view class="nav-bar flex-align-center h100">
+					<view class="left flex-align-center">
+						<image src="/static/image/finance-management/search/search-left.png"></image>
+					</view>
+					<view class="nav-bar-search flex-align-center flex-1">
+						<image class="search-icon" src="/static/image/bill/bill-list/search-black.png" mode=""></image>
+						<input type="text" class="search-input flex-1" placeholder="小而美的基金" />
+						<view class="line h100"></view>
+						<view class="search-button">搜索</view>
+					</view>
+					<view class="right flex-align-center">
+						<image src="/static/image/finance-management/search/search-right.png"></image>
+					</view>
+				</view>
+			</NavBar>
+
+			<view class="total-money-box flex-align-center flex-justify-between">
+				<view class="revenue-box flex-1">
+					<view class="total-money flex-align-center">
+						<view class="total-money-title flex-align-center">
+							<text>总资产(元)</text>
+							<image class="eye-icon" src="/static/image/finance-management/eye.png"></image>
+							<view class="flex-align-center" style="color: #A39797;font-size: 22rpx;">
+								<image class="safe-icon" src="/static/image/finance-management/safe.png"></image>
+								<text>免费升级保障</text>
+							</view>
+						</view>
+						<view class="total-money-title flex-align-center">
+							<text>昨日收益</text>
+						</view>
+					</view>
+					<view class="total-money flex-align-center" style="margin-top: 10px;">
+						<view class="total-money-value flex-align-center">
+							<text>{{ financeInfo.totalMoney }}</text>
+						</view>
+						<view class="total-money-value flex-align-center">
+							<text>{{ financeInfo.yesterdayIncome }}</text>
+						</view>
+					</view>
+				</view>
+				<view class="family-protection">
+					<view class="total-money-title flex-align-center">
+						<text>家庭保障</text>
+					</view>
+					<view class=" flex-align-end" style="margin-top: 10px;">
+						<text class="value">{{ financeInfo.familyProtection }}</text>
+						<text class="text">份</text>
+					</view>
+				</view>
+			</view>
+
+			<view class="arrow-box">
+				<image class="arrow-icon" src="/static/image/finance-management/arrow-down.png"></image>
+			</view>
+
+			<view class="card-box flex-column">
+
+				<view class="wealth-card-box flex">
+					<!-- 占位图片设置为透明 -->
+					<image class="wealth-card-opacity0" src="/static/image/finance-management/v1/bg.png"
+						mode="widthFix" />
+					<!-- 背景图片高度自适应 -->
+					<image class="wealth-card" src="/static/image/finance-management/v1/bg.png" mode="widthFix" />
+
+					<view class="card-info">
+						<image class="logo" src="/static/image/finance-management/v1/logo.png" mode="scaleToFill" />
+						<view class="name-box flex-align-center">
+							<image class="card-holder-icon" src="/static/image/finance-management/v1/card-holder.png"
+								mode="scaleToFill" />
+							<view class="card-holder-name sacramento-font">{{ financeInfo.cardHolderName }}</view>
+						</view>
+
+					</view>
+					<view class="enjoy-benefits flex-align-center">
+						<text class="benefits-text">{{ financeInfo.benefitsText }}</text>
+						<image class="arrow-icon" src="/static/image/finance-management/v1/arrow.png"></image>
+					</view>
+
+				</view>
+
+				<view class="content-box"></view>
+			</view>
+		</view>
+
+		<view class="content">
+		</view>
+	</view>
+</template>
+
+<script setup>
+import NavBar from '@/components/nav-bar/nav-bar.vue'
+import { ref, toRefs, reactive, onMounted } from 'vue'
+import { onLoad } from '@dcloudio/uni-app'
+
+onLoad(() => {
+	// 理财页面埋点
+	// proxy.$apiUserEvent('all', {
+	// 	type: 'click',
+	// 	key: 'fortune',
+	// 	value: "理财"
+	// })
+})
+
+const data = reactive({
+	financeInfo: {
+		totalMoney: 100000000,
+		yesterdayIncome: 22222,
+		familyProtection: 1,
+		benefitsText: '尊享礼遇18000元/年',
+		cardHolderName: 'LiXing',
+		vipLevel: 1,
+	}
+})
+
+let { financeInfo } = toRefs(data)
+
+</script>
+
+<style>
+@import "@/common/main.css";
+</style>
+<style lang="less" scoped>
+.container {
+	height: 100vh;
+	background-color: #f5f5f5;
+	overflow: hidden;
+}
+
+.main-info-container {
+	background: linear-gradient(191deg, #0B1028 5.48%, #0B1028 30.26%, #18336C 60.18%, #18336C 100%);
+
+
+	.nav-bar {
+		padding: 20rpx;
+
+		.left {
+			image {
+				height: 48rpx;
+				width: 48rpx;
+			}
+		}
+
+		.right {
+			image {
+				height: 36rpx;
+				width: 36rpx;
+			}
+		}
+
+		.nav-bar-search {
+			background-color: #ffffff;
+			border-radius: 300rpx;
+			height: 56rpx;
+			padding: 4px 0;
+			margin: 0 26rpx 0 14rpx;
+
+			.search-icon {
+				width: 32rpx;
+				height: 32rpx;
+				margin-left: 4px;
+				margin-right: 6px;
+			}
+
+			.search-input {
+				font-size: 14px;
+			}
+
+			::v-deep .input-placeholder {
+				color: #767676;
+			}
+
+			.line {
+				width: 1px;
+				background-color: #D8D8D8;
+			}
+
+			.search-button {
+				font-size: 14px;
+				padding: 0 12px;
+				color: #8B634E;
+				font-weight: 500;
+			}
+		}
+
+	}
+
+	.total-money-box {
+		padding-top: 10rpx;
+		padding-bottom: 6rpx;
+
+		.revenue-box {
+			padding: 0 24rpx;
+
+			.total-money {
+				font-size: 24rpx;
+				display: flex;
+				justify-content: space-between;
+			}
+
+
+			.total-money-value {
+				color: #F1CFAB;
+			}
+
+		}
+
+		.total-money-title {
+			color: #A39797;
+
+			.eye-icon {
+				width: 44rpx;
+				height: 44rpx;
+				margin: 0 32rpx 0 20rpx;
+			}
+
+			.safe-icon {
+				width: 24rpx;
+				height: 24rpx;
+				margin-right: 4rpx;
+			}
+		}
+
+		.total-money-value {
+			font-size: 50rpx;
+			font-weight: 500;
+			line-height: 64rpx;
+		}
+
+		.family-protection {
+			display: flex;
+			flex-direction: column;
+			height: 100%;
+			padding: 0 28rpx;
+			border-left: 1rpx solid #172139;
+			align-items: center;
+			font-size: 24rpx;
+
+			.value {
+				color: #F1CFAB;
+				font-size: 56rpx;
+				font-weight: 500;
+				line-height: 64rpx;
+			}
+
+			.text {
+				color: #F1CFAB;
+				font-size: 24rpx;
+				margin-left: 8rpx;
+
+			}
+		}
+	}
+
+	.arrow-box {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		padding: 4rpx;
+
+		.arrow-icon {
+			width: 28rpx;
+			height: 28rpx;
+		}
+	}
+
+	.card-box {
+		display: flex;
+		flex-direction: column;
+
+		.wealth-card-box {
+			position: relative;
+
+			.card-info {
+				display: flex;
+				justify-content: space-between;
+				align-items: flex-start;
+				position: absolute;
+				width: 100%;
+				top: 12%;
+				padding: 0 5%;
+
+				.logo {
+					width: 188rpx;
+					height: 40rpx;
+				}
+
+				.name-box {
+					display: flex;
+					align-items: center;
+				}
+
+				.card-holder-icon {
+					width: 68rpx;
+					height: 28rpx;
+					margin-right: 8rpx;
+				}
+
+				.card-holder-name {
+					color: #F1CFAB;
+					font-size: 30rpx;
+				}
+			}
+
+			.enjoy-benefits {
+				position: absolute;
+				bottom: 25%;
+				right: 4%;
+
+				.benefits-text {
+					color: #F1CFAB;
+					font-size: 24rpx;
+				}
+
+				.arrow-icon {
+					width: 28rpx;
+					height: 28rpx;
+					margin-left: 6rpx;
+				}
+			}
+
+
+		}
+
+		.wealth-card-opacity0 {
+			width: 100%;
+			opacity: 0;
+		}
+
+		.wealth-card {
+			position: absolute;
+			width: 100%;
+		}
+
+		.content-box {
+			margin-top: -1px;
+			background-color: #ffffff;
+			padding: 20rpx;
+		}
+
+
+	}
+}
+
+.content {
+	padding: 20rpx;
+}
+</style>

pages/index/index.nvue

@@ -113,16 +113,16 @@ import {
 import {
 	ref,
 	reactive,
-	toRefs
+	toRefs,
+	getCurrentInstance
 } from 'vue';
 import {
 	onLoad,
 	onShow
 } from '@dcloudio/uni-app';
 
-import {
-	getCurrentInstance
-} from 'vue'
+const instance = getCurrentInstance();
+const { proxy } = instance;
 
 // 菜单列表
 const menuList = [{
@@ -141,6 +141,7 @@ const menuList = [{
 	icon: "licaiheika",
 	name: "理财黑卡",
 	isHot: true,
+	// path: "/pages/finance-management/index"
 	path: ""
 },
 {