uniapp/pages_tool/member/integral/apply_record.vue

<template>
	<page-meta :page-style="themeColor"></page-meta>	
	<view class="image-wrap">
    <mescroll-uni @getData="applyRecord" class="member-point" ref="mescroll">
      <view slot="list">
        <block v-if="Object.keys(list).length > 0">
          <view class="detailed-wrap">
            <view class="cont">
              <view class="detailed-item" v-for="(item, index) in list" :key="index">
                <view class="info">
                  <view class="event">申请提现{{ item.money }}桑果</view>
                  <view class="time-box">
                    <text class="time color-tip">{{ $util.timeStampTurnTime(item.create_time) }}</text>
                  </view>
                </view>
                <view class="num color-base-text" v-if="parseInt(item.status) === 1">待审核</view>
                <view class="num increase-number color-base-text" v-else-if="parseInt(item.status) === 2">已通过</view>
                <view class="num reduce-number" v-else>已拒绝</view>
              </view>
            </view>
          </view>
        </block>
        <block v-else>
          <view class="cart-empty">
            <ns-empty></ns-empty>
          </view>
        </block>
      </view>
    </mescroll-uni>
	</view>
</template>
<script>
export default {
	data() {
		return {
      list: [],


		};
	},
	computed: {},
	onLoad(data) {},
	onReady() {},
	onShow() {
		if (!uni.getStorageSync('token')) {
			this.$util.redirectTo('/pages_tool/login/login', {
				back: '/pages_promotion/co2/lo2log'
			});
		}
	},
	onReachBottom() {},
	methods: {
    // 获取提现申请记录
    applyRecord(mescroll) {
      let _this = this;
      if(!mescroll) return false;
      _this.$api.sendRequest({
        url: '/fenxiao/api/withdraw/integralMoneyApply',
        data: {
          page: mescroll.num
        },
        success: res => {
          if(parseInt(res.code) === 0){
            let list = res.data.list;
            mescroll.endSuccess(list.length);
            //设置列表数据
            if (parseInt(mescroll.num) === 1) this.list = []; //如果是第一页需手动制空列表
            this.list = this.list.concat(list); //追加新数据
          }else{
            this.$util.showToast({
              title: res.message
            });
          }
          // 关闭弹框
          if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
        },
        fail: res => {
          mescroll.endErr();
          if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
        }
      });
    },
	}
};
</script>
<style scoped lang="scss">
/deep/ .fixed {
  position: relative;
  top: 0;
}

.tab {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 10;
  display: flex;
  justify-content: space-between;
  height: 80rpx;
  background-color: $color-bg;

  view {
    flex: 1;
    text-align: center;
    line-height: 80rpx;

    text {
      margin-left: 10rpx;
      font-size: $font-size-base;
    }
  }
  .tab-left{
    display: flex;
    padding-left: 30rpx;
  }
  .tab-right{
    display: flex;
    justify-content: flex-end;
    padding-right: 40rpx;
  }
}

.cart-empty {
  margin-top: 208rpx !important;
}

.account-box {
  width: 100%;
  box-sizing: border-box;
  position: relative;

  > image {
    width: 100%;
    position: absolute;
    top: 0;
    z-index: 1;
  }

  .accout-btn {
    display: flex;
    margin-top: 30rpx;

    view {
      width: 170rpx;
      height: 44rpx;
      border-radius: 22rpx;
      border: 2rpx solid rgba(255, 255, 255, 0.4);
      color: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-right: 44rpx;
    }
  }

  .account-text {
    position: relative;
    padding: 50rpx 30rpx 34rpx 30rpx;
    display: flex;
    align-items: center;
    z-index: 9;

    .headimg {
      width: 100rpx;
      height: 100rpx;
      background: #fff;
      border: 4rpx solid #fff;
      border-radius: 50%;
      overflow: hidden;

      image {
        width: 100%;
        height: 100%;
      }
    }

    .point {
      margin-left: 30rpx;
      color: #fff;
      font-size: 36rpx;
    }

    .iconjifen1 {
      color: #fff;
      margin-left: 8rpx;
    }
  }
}

.detailed-wrap {
  background: #fff;
  position: relative;
  z-index: 9;

  .head {
    display: flex;
    height: 90rpx;

    & > view {
      flex: 1;
      text-align: left;
      padding: 0 $padding;
      line-height: 90rpx;
    }
  }

  .cont {
    background: #fff;
    width: 100%;
    margin: 0 auto;

    .detailed-item {
      padding: 30rpx 0 32rpx;
      margin: 0 32rpx;
      border-bottom: 2rpx solid $color-line;
      position: relative;
      box-sizing: border-box;

      &:last-of-type {
        border-bottom: none;
      }

      .info {
        padding-right: 180rpx;

        .event {
          font-size: $font-size-base;
          line-height: 1.3;
          font-weight: 500;
        }

        .time-box {
          line-height: 1;
          margin-top: 24rpx;
        }

        .time {
          font-size: $font-size-activity-tag;
          color: $color-tip;
        }
      }

      .num {
        width: 160rpx;
        position: absolute;
        right: 17rpx;
        top: 50%;
        transform: translateY(-50%);
        text-align: right;
        font-size: $font-size-toolbar;
        font-weight: 500;
      }
    }
  }
}
/deep/ .increase-number{
  color: #07c160!important;
}
/deep/ .reduce-number{
  color: #ee0a24!important;
}
</style>