baiyuApp/pages_user/user/userTui.vue

<template>
	<view class="my-promotion">
		<view class="header">
			<image class="bg" src="https://zkzh-2025.oss-cn-beijing.aliyuncs.com/shop/images/bg_1.png"></image>
			<view class="name acea-row row-center-wrapper">
				<view>累计佣金</view>
			</view>
			<view class="num">{{ brokeragePrice }}</view>
			<view class="profit acea-row row-between-wrapper">
				<view class="item">
					<view>昨日收益</view>
					<view class="money">{{ yesterdayMoney }}</view>
				</view>
				<view class="item" @click="navgetTo('userTuiExtractLog')">
					<view>
						提现记录
					</view>
				</view>
			</view>
		</view>
		<view class="list acea-row row-between-wrapper">
			<view class="item acea-row row-center-wrapper row-column" @click="navgetTo('userTuiImg')">
				<image class="icon" src="https://zkzh-2025.oss-cn-beijing.aliyuncs.com/shop/images/tui_1.png"></image>
				<view>推广名片</view>
			</view>
			<view class="item acea-row row-center-wrapper row-column" @click="navgetTo('userTuiProduct')">
				<image class="icon" src="https://zkzh-2025.oss-cn-beijing.aliyuncs.com/shop/images/products_icon.png">
				</image>
				<view>推广商品</view>
			</view>
			<view class="item acea-row row-center-wrapper row-column" @click="navgetTo('userTuiList')">
				<image class="icon" src="https://zkzh-2025.oss-cn-beijing.aliyuncs.com/shop/images/statistics-icon.png">
				</image>
				<view>推广人统计</view>
			</view>
			<view class="item acea-row row-center-wrapper row-column" @click="navgetTo('userTuiMoneyList')">
				<image class="icon" src="https://zkzh-2025.oss-cn-beijing.aliyuncs.com/shop/images/commission_icon.png">
				</image>
				<view>佣金明细</view>
			</view>
			<view class="item acea-row row-center-wrapper row-column" @click="navgetTo('userTuiOrderList')">
				<image class="icon" src="https://zkzh-2025.oss-cn-beijing.aliyuncs.com/shop/images/order_icon.png">
				</image>
				<view>推广人订单</view>
			</view>
			<view class="item acea-row row-center-wrapper row-column" @click="navgetTo('userTuiMoney')">
				<image class="icon" src="https://zkzh-2025.oss-cn-beijing.aliyuncs.com/shop/images/cash_icon.png">
				</image>
				<view>提现管理</view>
			</view>
		</view>
	</view>
</template>
<script>
	import {
		getTuiMoney
	} from '@/api/user'
	export default {
		name: "UserTui",
		components: {},
		props: {},
		data: function() {
			return {
				brokeragePrice: 0,
				yesterdayMoney: 0
			};
		},
		mounted: function() {
			this.getTuiMoney();
		},
		methods: {
			getTuiMoney: function() {
				let that = this;
				getTuiMoney().then(
					res => {
						that.brokeragePrice = res.brokeragePrice + res.nowMoney;
						that.yesterdayMoney = res.yesterdayMoney;
					},
					err => {
						uni.showToast({
							title: err.msg,
							icon: "none",
							duration: 2000
						});
					},
					300
				);
			},
			navgetTo(url) {
				if (this.$isLogin()) {
					uni.navigateTo({
						url: url
					})
				}
			},

		}
	};
</script>


<style lang="less">
	/*我的推广*/
	.my-promotion .header {
		position: relative;
		width: 100%;
		height: 3.75 * 100rpx;
	}

	.my-promotion .header .bg {
		position: absolute;
		width: 100%;
		height: 3.75 * 100rpx;
	}

	.my-promotion .header .name {
		font-size: 0.3 * 100rpx;
		color: #fff;
		padding-top: 0.57 * 100rpx;
		position: relative;
	}

	.my-promotion .header .name .record {

		font-size: 0.26 * 100rpx;
		color: rgba(255, 255, 255, 0.8);
		position: absolute;
		right: 0.2 * 100rpx;
	}

	.my-promotion .header .name .record .iconfont {
		font-size: 0.25 * 100rpx;
		margin-left: 0.1 * 100rpx;
	}

	.my-promotion .header .num {
		position: relative;
		text-align: center;
		color: #fff;
		// margin-top: 0.25*100rpx;
		font-size: 0.9 * 100rpx;
		font-family: 'GuildfordProBook 5';
	}

	.my-promotion .header .profit {
		position: relative;
		padding: 0 0.2 * 100rpx;
		margin-top: 0.33 * 100rpx;
		font-size: 0.24 * 100rpx;
		color: rgba(255, 255, 255, 0.8);
	}

	.my-promotion .header .profit .item {
		min-width: 2 * 100rpx;
		text-align: center;
	}

	.my-promotion .header .profit .item .money {
		font-size: 0.34 * 100rpx;
		color: #fff;
	}

	.my-promotion .bnt {
		font-size: 0.28 * 100rpx;
		color: #fff;
		width: 2.58 * 100rpx;
		height: 0.68 * 100rpx;
		border-radius: 0.5 * 100rpx;
		text-align: center;
		line-height: 0.68 * 100rpx;
		margin: -0.32 * 100rpx auto 0 auto;
	}

	.my-promotion .list {
		padding: 0 0.2 * 100rpx;
		margin-top: 0.1 * 100rpx;
	}

	.my-promotion .list .item {
		width: 3.45 * 100rpx;
		height: 2.4 * 100rpx;
		border-radius: 0.2 * 100rpx;
		background-color: #fff;
		margin-top: 0.2 * 100rpx;
		font-size: 0.3 * 100rpx;
		color: #666;
	}

	.my-promotion .list .item .icon {
		width: 80rpx;
		height: 80rpx;
		margin-bottom: 10rpx;
	}
</style>