zhibo/pages_user/user/userTui.vue

<template>
  <view class="my-promotion">
    <view class="header">
	 <image class="bg" src="../../static/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="../../static/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="../../static/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="../../static/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="../../static/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="../../static/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="../../static/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) {
		this.utils.isLogin().then(res => {
			if(res){
				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>