|
@@ -14,44 +14,50 @@
|
|
|
<image src="../../static/img/promotion-bg.png" mode=""></image>
|
|
|
</view>
|
|
|
<view class="money-box">
|
|
|
- <view class="money">{{ all }}</view>
|
|
|
+ <view class="money">{{ navList.count||0 }}</view>
|
|
|
<view>我的推广人数</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <swiper :current="tabCurrentIndex" :style="{ height: maxheight }" class="swiper-box" duration="300"
|
|
|
- @change="changeTab">
|
|
|
- <swiper-item class="tab-content" v-for="(tabItem, tabIndex) in navList" :key="tabIndex">
|
|
|
- <scroll-view class="list-scroll-content" :style="{ height: maxheight }" scroll-y
|
|
|
- @scrolltolower="loadData">
|
|
|
- <empty v-if="tabItem.loaded === true && tabItem.orderList.length === 0"></empty>
|
|
|
-
|
|
|
- <view v-for="(item, index) in tabItem.orderList" :key="index" class="order-item flex">
|
|
|
- <view class="title-box flex_item">
|
|
|
- <view class="title-avatar">
|
|
|
- <image :src="item.avatar"></image>
|
|
|
- </view>
|
|
|
- <view class="list_tpl">
|
|
|
- <view class="title">
|
|
|
- <view class="title-name clamp">{{ item.nickname }}</view>
|
|
|
- </view>
|
|
|
- <view class="time">
|
|
|
- <text>{{ item.time }}</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <!-- <view class="money">
|
|
|
- <text>{{ item.self_achievement == null ? '未购买' : item.self_achievement + '元' }}</text>
|
|
|
- </view> -->
|
|
|
- </view>
|
|
|
+ <view class="info-box flex">
|
|
|
+ <view class="info-item">
|
|
|
+ <view class="info-font">参与人数</view>
|
|
|
+ <view class="info-num">{{navList.count||0}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="shu"></view>
|
|
|
+ <view class="info-item">
|
|
|
+ <view class="info-font">累计参与积分</view>
|
|
|
+ <view class="info-num">{{navList.user_price||0}}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="content-box" v-for="item in navList.user_list">
|
|
|
+ <view class="content-box-left">
|
|
|
+ <view class="left-img">
|
|
|
+ <image :src="item.avatar" mode=""></image>
|
|
|
+ </view>
|
|
|
+ <view class="right-title">
|
|
|
+ <view class="top">
|
|
|
+ {{item.nickname}}
|
|
|
+ </view>
|
|
|
+ <view class="bottom">
|
|
|
+ ID:{{item.uid}}
|
|
|
</view>
|
|
|
- <uni-load-more :status="tabItem.loadingType"></uni-load-more>
|
|
|
- </scroll-view>
|
|
|
- </swiper-item>
|
|
|
- </swiper>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="content-box-right">
|
|
|
+ <view class="state">
|
|
|
+ {{item.zt==0?'间推':'直推'}}
|
|
|
+ </view>
|
|
|
+ <view class="box-right">
|
|
|
+ 参与积分:<span>{{item.price}}</span>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</template>
|
|
|
<script>
|
|
|
import {
|
|
|
- myspread
|
|
|
+ myspread,tuiguang
|
|
|
} from '@/api/user.js';
|
|
|
import {
|
|
|
mapState,
|
|
@@ -105,62 +111,10 @@
|
|
|
},
|
|
|
//获取收入支出信息
|
|
|
async loadData(source) {
|
|
|
- //这里是将订单挂载到tab列表下
|
|
|
- let index = this.tabCurrentIndex;
|
|
|
- let navItem = this.navList[index];
|
|
|
- let state = navItem.state;
|
|
|
- if (source === 'tabChange' && navItem.loaded === true) {
|
|
|
- //tab切换只有第一次需要加载数据
|
|
|
- return;
|
|
|
- }
|
|
|
- if (navItem.loadingType === 'loading') {
|
|
|
- //防止重复加载
|
|
|
- return;
|
|
|
- }
|
|
|
- if (navItem.loadingType === 'noMore') {
|
|
|
- //防止重复加载
|
|
|
- return;
|
|
|
- }
|
|
|
- // 修改当前对象状态为加载中
|
|
|
- navItem.loadingType = 'loading';
|
|
|
- myspread({
|
|
|
- page: navItem.page,
|
|
|
- limit: navItem.limit
|
|
|
- })
|
|
|
- .then(({
|
|
|
- data
|
|
|
- }) => {
|
|
|
- console.log(data);
|
|
|
- this.all = data.total;
|
|
|
- if (data.list.length > 0) {
|
|
|
- this.list = data.list;
|
|
|
- navItem.orderList = navItem.orderList.concat(data.list);
|
|
|
- navItem.page++;
|
|
|
- }
|
|
|
- this.$nextTick(function() {
|
|
|
- if (navItem.limit == data.list.length) {
|
|
|
- //判断是否还有数据, 有改为 more, 没有改为noMore
|
|
|
- navItem.loadingType = 'more';
|
|
|
- return;
|
|
|
- } else {
|
|
|
- //判断是否还有数据, 有改为 more, 没有改为noMore
|
|
|
- navItem.loadingType = 'noMore';
|
|
|
- }
|
|
|
- });
|
|
|
- this.$set(navItem, 'loaded', true);
|
|
|
- })
|
|
|
- .catch(e => {
|
|
|
- console.log(e);
|
|
|
- });
|
|
|
- },
|
|
|
- //swiper 切换
|
|
|
- changeTab(e) {
|
|
|
- this.tabCurrentIndex = e.target.current;
|
|
|
- this.loadData('tabChange');
|
|
|
- },
|
|
|
- //顶部tab点击
|
|
|
- tabClick(index) {
|
|
|
- this.tabCurrentIndex = index;
|
|
|
+ tuiguang().then(res=>{
|
|
|
+ console.log(res,'data');
|
|
|
+ this.navList = res.data
|
|
|
+ })
|
|
|
},
|
|
|
// 点击返回 我的页面
|
|
|
toBack() {
|
|
@@ -178,6 +132,46 @@
|
|
|
height: 100%;
|
|
|
}
|
|
|
|
|
|
+ .info-box {
|
|
|
+ width: 670rpx;
|
|
|
+ height: 186rpx;
|
|
|
+ background: #ffffff;
|
|
|
+ box-shadow: 0px 0px 20rpx 0px rgba(50, 50, 52, 0.06);
|
|
|
+ border-radius: 20rpx;
|
|
|
+ margin: -100rpx auto 0;
|
|
|
+ position: relative;
|
|
|
+ z-index: 2;
|
|
|
+
|
|
|
+ .info-item {
|
|
|
+ width: 50%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ line-height: 1;
|
|
|
+
|
|
|
+ .info-font {
|
|
|
+ font-size: 30rpx;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #999999;
|
|
|
+ }
|
|
|
+
|
|
|
+ .info-num {
|
|
|
+ margin-top: 30rpx;
|
|
|
+ font-size: 30rpx;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #181818;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .shu {
|
|
|
+ width: 2rpx;
|
|
|
+ height: 74rpx;
|
|
|
+ background: #dcdfe6;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
.status_bar {
|
|
|
height: var(--status-bar-height);
|
|
|
width: 100%;
|
|
@@ -382,4 +376,58 @@
|
|
|
background: #dddddd;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+ .content-box {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ margin: 30rpx;
|
|
|
+
|
|
|
+ .content-box-left {
|
|
|
+ display: flex;
|
|
|
+
|
|
|
+ .left-img {
|
|
|
+ width: 100rpx;
|
|
|
+ height: 100rpx;
|
|
|
+ border-radius: 50%;
|
|
|
+ overflow: hidden;
|
|
|
+ image {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .right-title {
|
|
|
+ margin-left: 15rpx;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: space-around;
|
|
|
+
|
|
|
+ .top {
|
|
|
+ font-weight: 500;
|
|
|
+ font-size: 30rpx;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .bottom {
|
|
|
+ color: #999999;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .content-box-right {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ width: 230rpx;
|
|
|
+ color: #999999;
|
|
|
+ .state{
|
|
|
+ color: red;
|
|
|
+ }
|
|
|
+ span{
|
|
|
+ color: red;
|
|
|
+ font-size: 28rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
</style>
|