Files
xdd-uniapp-new/pages/user/promotion/UserPromotion/index.vue
T
2024-02-06 12:42:46 +08:00

242 lines
6.6 KiB
Vue

<template>
<view class="my-promotion">
<view class="topBanner acea-row row-middle row-center">
<view class="item acea-row row-column">
<view class="itemValue">{{ force2Decimal(Info.commissionCount) }}</view>
<view class="itemTitle">当前佣金</view>
</view>
<view class="vline"></view>
<view class="item acea-row row-column">
<view class="itemValue">{{ force2Decimal(Info.lastDayCount) }}</view>
<view class="itemTitle">今日收益</view>
</view>
<view class="vline"></view>
<view class="item acea-row row-column">
<view class="itemValue">{{ force2Decimal(Info.extractCount) }}</view>
<view class="itemTitle">累计已提</view>
</view>
</view>
<view class="acea-row row-right">
<view class="withdrawRecordBtn acea-row row-middle row-center" @click="goCashRecord()">
<image :src="webUrl+'/20210819120620545726.png'" mode="" style="width: 24rpx;height: 24rpx;margin-right: 10rpx;"></image>
<text style="color: #fff;font-size: 24rpx;">提现记录</text>
</view>
</view>
<view class="menu-list acea-row row-column">
<view class="menu-item acea-row row-middle" @click="goPromoterList()">
<image class="menu-item-img" :src="webUrl+'/20210819120915878640.png'" mode=""></image>
<text class="menu-item-title">推广统计</text>
<text class="iconfont icon-jiantou" style="font-size: 24rpx;color: #999999;"></text>
</view>
<view class="menu-item acea-row row-middle" @click="goCommissionDetails()">
<image class="menu-item-img" :src="webUrl+'/20210819133737716135.png'" mode=""></image>
<text class="menu-item-title">佣金明细</text>
<text class="iconfont icon-jiantou" style="font-size: 24rpx;color: #999999;"></text>
</view>
<view class="menu-item acea-row row-middle" @click="goPromoterOrder()">
<image class="menu-item-img" :src="webUrl+'/20210819133751983817.png'" mode=""></image>
<text class="menu-item-title">推广人订单</text>
<text class="iconfont icon-jiantou" style="font-size: 24rpx;color: #999999;"></text>
</view>
<view class="menu-item acea-row row-middle" @click="toCash()">
<image class="menu-item-img" :src="webUrl+'/20210819133726059725.png'" mode=""></image>
<text class="menu-item-title">立即提现</text>
<text class="iconfont icon-jiantou" style="font-size: 24rpx;color: #999999;"></text>
</view>
</view>
<!-- <view class="header">
<view class="name acea-row row-center-wrapper">
<view>当前佣金</view>
<view class="record" @click="goCashRecord()">
提现记录
<text class="iconfont icon-xiangyou"></text>
</view>
</view>
<view class="num">{{ force2Decimal(Info.commissionCount) }}</view>
<view class="profit acea-row row-between-wrapper">
<view class="item">
<view>今日收益</view>
<view class="money">{{ force2Decimal(Info.lastDayCount) }}</view>
</view>
<view class="item">
<view>累积已提</view>
<view class="money">{{ force2Decimal(Info.extractCount) }}</view>
</view>
</view>
</view>
<view class="list acea-row row-between-wrapper">
<view class="item acea-row row-center-wrapper row-column" @click="goPoster()">
<text class="iconfont icon-erweima"></text>
<view>推广名片</view>
</view>
<view class="item acea-row row-center-wrapper row-column" @click="goPromoterList()">
<text class="iconfont icon-tongji"></text>
<view>推广人统计</view>
</view>
<view class="item acea-row row-center-wrapper row-column" @click="goCommissionDetails()">
<text class="iconfont icon-qiandai"></text>
<view>佣金明细</view>
</view>
<view class="item acea-row row-center-wrapper row-column" @click="goPromoterOrder()">
<text class="iconfont icon-dingdan"></text>
<view>推广人订单</view>
</view>
<view class="item acea-row row-center-wrapper row-column" @click="toCash()">
<text class="iconfont icon-chongzhi"></text>
<view>立即提现</view>
</view>
</view> -->
</view>
</template>
<script>
import { getSpreadInfo } from "@/api/user";
export default {
name: "UserPromotion",
components: {},
props: {},
data: function() {
return {
Info: {
lastDayCount: 0,
extractCount: 0,
commissionCount: 0
},
webUrl:this.$VUE_APP_RESOURCES_URL
};
},
mounted: function() {
},
onShow:function(){
this.getInfo();
},
methods: {
force2Decimal(v){
return this.$force2Decimal(v);
},
goPoster() {
this.$yrouter.push("/pages/user/promotion/Poster/index");
},
goCashRecord() {
this.$yrouter.push('/pkg_user/views/withdrawalLog');
},
goPromoterList() {
this.$yrouter.push("/pages/user/promotion/PromoterList/index");
},
goCommissionDetails() {
this.$yrouter.push("/pages/user/promotion/CommissionDetails/index");
},
goPromoterOrder() {
this.$yrouter.push("/pages/user/promotion/PromoterOrder/index");
},
getInfo: function() {
let that = this;
getSpreadInfo().then(
res => {
that.Info = res.data;
},
function(err) {
uni.showToast({
title: err.msg || err.response.data.msg|| err.response.data.message,
icon: 'none',
duration: 2000
});
}
);
},
toCash: function() {
this.$yrouter.push("/pkg_user/views/withdrawal");
}
}
};
</script>
<style lang="less">
.my-promotion{
padding: 32rpx;
}
.my-promotion .header{
background-image: none !important;
background-color: #FE5261;
}
.my-promotion .list .item .iconfont{
color: #FE5261 !important;
}
.topBanner{
height: 180rpx;
background: #FFFFFF;
box-shadow: 0px 6rpx 16rpx rgba(232, 236, 241, 0.5);
border-radius: 16rpx;
padding: 32rpx;
}
.topBanner .item{
flex: 1;
}
.topBanner .item .itemValue{
color: #333333;
font-size: 36rpx;
text-align: center;
}
.topBanner .item .itemTitle{
color: #999999;
font-size: 22rpx;
text-align: center;
}
.vline{
background-color: #E3E3E3;
width: 1px;
height: 64rpx;
margin: 0 10rpx;
}
.withdrawRecordBtn{
width: 174rpx;
height: 60rpx;
background: #0DC5C5;
box-shadow: 0px 8rpx 14rpx rgba(179, 188, 191, 0.6);
border-radius: 8rpx;
margin: 32rpx 0;
}
.menu-list{
}
.menu-list .menu-item{
padding: 24rpx;
background: #FFFFFF;
box-shadow: 0px 6rpx 16rpx rgba(232, 236, 241, 0.5);
border-radius: 16rpx;
margin-bottom: 18rpx;
}
.menu-list .menu-item .menu-item-title{
font-size: 24rpx;
font-weight: 500;
color: #333333;
flex-grow: 1;
}
.menu-list .menu-item .menu-item-img{
width: 40rpx;
height: 40rpx;
flex-shrink:0;
margin-right: 16rpx;
}
</style>