|
@@ -0,0 +1,223 @@
|
|
|
+<template>
|
|
|
+ <view class="user_directPartner">
|
|
|
+ <view class="integral-details" :style="colorStyle">
|
|
|
+ <!-- <view class='header'>
|
|
|
+ <view class='currentScore'>{{$t(`当前红色积分`)}}</view>
|
|
|
+ <view class="scoreNum">{{userInfo.integral}}</view>
|
|
|
+ <view class='line'></view>
|
|
|
+ </view> -->
|
|
|
+ <view class="wrapper">
|
|
|
+ <view class="list" :hidden="current != 0">
|
|
|
+ <view
|
|
|
+ class="item acea-row row-between-wrapper"
|
|
|
+ v-for="(item, index) in integralList"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
+ <view class="left">
|
|
|
+ <view class="state">
|
|
|
+ <view class="order">{{ index + 1 }}</view>
|
|
|
+ <img :src="item.avatar" alt="" />
|
|
|
+ <view class="s-r">
|
|
|
+ <text>
|
|
|
+ {{ item.userName }}
|
|
|
+ </text>
|
|
|
+ <text>
|
|
|
+ {{ item.account }}
|
|
|
+ </text>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="text-info">推荐人 : {{ item.recommendName }}</view>
|
|
|
+ <view class="text-info">推荐时间 : {{ item.createTime }}</view>
|
|
|
+ </view>
|
|
|
+ <view class="right">
|
|
|
+ <view class="num font-color"> </view>
|
|
|
+ <view class="text-info">贡献人 : {{ item.parentName }}</view>
|
|
|
+ <view class="text-info">贡献时间 : {{ item.contributeTime }}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view
|
|
|
+ class="loadingicon acea-row row-center-wrapper"
|
|
|
+ v-if="integralList.length > 0"
|
|
|
+ >
|
|
|
+ <text
|
|
|
+ class="loading iconfont icon-jiazai"
|
|
|
+ :hidden="loading == false"
|
|
|
+ ></text
|
|
|
+ >{{ loadTitle }}
|
|
|
+ </view>
|
|
|
+ <view v-if="integralList.length == 0">
|
|
|
+ <emptyPage :title="$t(`暂无收益记录哦~`)"></emptyPage>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import {
|
|
|
+ linkedUserList
|
|
|
+} from '@/api/home.js';
|
|
|
+import dayjs from '@/plugin/dayjs/dayjs.min.js';
|
|
|
+import {
|
|
|
+ toLogin
|
|
|
+} from '@/libs/login.js';
|
|
|
+import {
|
|
|
+ mapGetters
|
|
|
+} from "vuex";
|
|
|
+// #ifdef MP
|
|
|
+import authorize from '@/components/Authorize';
|
|
|
+// #endif
|
|
|
+import emptyPage from '@/components/emptyPage.vue';
|
|
|
+import colors from '@/mixins/color'
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ // #ifdef MP
|
|
|
+ authorize,
|
|
|
+ // #endif
|
|
|
+ emptyPage
|
|
|
+ },
|
|
|
+ filters: {
|
|
|
+ dateFormat: function (value) {
|
|
|
+ return dayjs(value * 1000).format('YYYY-MM-DD');
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mixins: [colors],
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ current: 0,
|
|
|
+ page: 1,
|
|
|
+ limit: 10,
|
|
|
+ integralList: [],
|
|
|
+ userInfo: {},
|
|
|
+ loadend: false,
|
|
|
+ loading: false,
|
|
|
+ loadTitle: this.$t(`加载更多`),
|
|
|
+ isAuto: false, //没有授权的不会自动授权
|
|
|
+ isShowAuth: false, //是否隐藏授权
|
|
|
+ isTime: 0
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: mapGetters(['isLogin']),
|
|
|
+ watch: {
|
|
|
+ isLogin: {
|
|
|
+ handler: function (newV, oldV) {
|
|
|
+ if (newV) {
|
|
|
+ // this.getUserInfo();
|
|
|
+ this.linkedUserList();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ deep: true
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad () {
|
|
|
+ if (this.isLogin) {
|
|
|
+ // this.getUserInfo();
|
|
|
+ this.getIntegralList();
|
|
|
+ } else {
|
|
|
+ toLogin();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 页面上拉触底事件的处理函数
|
|
|
+ */
|
|
|
+ onReachBottom: function () {
|
|
|
+ this.getIntegralList();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ /**
|
|
|
+ * 授权回调
|
|
|
+ */
|
|
|
+ onLoadFun: function () {
|
|
|
+ this.getUserInfo();
|
|
|
+ this.getIntegralList();
|
|
|
+ },
|
|
|
+ // 授权关闭
|
|
|
+ authColse: function (e) {
|
|
|
+ this.isShowAuth = e
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 获取积分明细
|
|
|
+ */
|
|
|
+ getIntegralList: function () {
|
|
|
+ let that = this;
|
|
|
+ if (that.loading) return;
|
|
|
+ if (that.loadend) return;
|
|
|
+ that.loading = true;
|
|
|
+ that.loadTitle = '';
|
|
|
+ linkedUserList({
|
|
|
+ userId: this.$store.state.app.uid,
|
|
|
+ current: that.page,
|
|
|
+ size: that.limit
|
|
|
+ }).then(function (res) {
|
|
|
+ let list = res.data,
|
|
|
+ loadend = list.length < that.limit;
|
|
|
+ that.integralList = that.$util.SplitArray(list, that.integralList);
|
|
|
+ that.$set(that, 'integralList', that.integralList);
|
|
|
+ that.page = that.page + 1;
|
|
|
+ that.loading = false;
|
|
|
+ that.loadend = loadend;
|
|
|
+ that.loadTitle = loadend ? that.$t(`我也是有底线的`) : that.$t(`加载更多`);
|
|
|
+ }, function (res) {
|
|
|
+ this.loading = false;
|
|
|
+ that.loadTitle = that.$t(`加载更多`);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ nav: function (current) {
|
|
|
+ this.current = current;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+.user_directPartner {
|
|
|
+ .text-info{
|
|
|
+ color: #999999;
|
|
|
+ margin-top: 5rpx;
|
|
|
+ }
|
|
|
+ .list {
|
|
|
+ .item {
|
|
|
+ line-height: 50rpx;
|
|
|
+ padding: 30rpx;
|
|
|
+ background: white;
|
|
|
+ .left {
|
|
|
+ .state {
|
|
|
+ height: 100rpx;
|
|
|
+ .order {
|
|
|
+ margin: auto 0;
|
|
|
+ text-align: center;
|
|
|
+ width: 50rpx;
|
|
|
+ height: 50rpx;
|
|
|
+ line-height: 50rpx;
|
|
|
+ background: #333333;
|
|
|
+ color: white;
|
|
|
+ border-radius: 50%;
|
|
|
+ }
|
|
|
+ display: flex;
|
|
|
+ image {
|
|
|
+ margin-left: 30rpx;
|
|
|
+ margin-right: 30rpx;
|
|
|
+ width: 100rpx;
|
|
|
+ height: 100rpx;
|
|
|
+ border-radius: 50%;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
+ .s-r {
|
|
|
+ font-size: 34rpx;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .right{
|
|
|
+ .num{
|
|
|
+ height: 100rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|