groupon-wx/pages/order_addcart/wallet_missed/index.vue

<!-- #ifdef H5 -->
<template >
  <view class="wallet_missed" :style="colorStyle">
    <view class="tota_income">
      <text class="t-t"> {{ moneyObj.lossTotalAmount }}</text>
      <text class="t-b"> 已错失总金额</text>
    </view>

    <view class="tota_history">
      <view class="h-item" v-for="(src, i) in historyList" :key="src.id">
        <view class="h-l">
          <text>{{ src.dateTime }}</text>
        </view>
        <view class="h-r">
          <text class="imp">{{ src.count }}元</text>
        </view>
      </view>
    </view>
    <view class="op-area">
			
		<button type="warn"  @click="goToAccelerate" class="bnt">去加速</button>
    </view>
  </view>
</template>

<script>	import {
  exclusivePage,
  todayStatistics
} from '@/api/home.js';
export default {
  components: {

  },
  data () {
    return {
      historyList: [],
      moneyObj: {
        lossTotalAmount: "0",
        receiveItemAmount: "0",
        receiveItemCount: 0,
        redEnvelopeItemCount: 0,
        remainItemCount: 0,
        totalReceivedRedEnvelopeAmount: "0",
        totalRedEnvelopeAmount: "0",
        totalRemainItemAmount: "0"
      },
    };
  },
  onPullDownRefresh () {
    this.exclusivePage()
    this.todayStatistics()
  },
  onLoad (options) {

  },
  created () {
    this.exclusivePage()
    this.todayStatistics()
  },
  methods: {
		goToAccelerate(){
      uni.navigateTo({
        url: '/pages/order_addcart/wallet_accelerate/index'
      })
		},
    todayStatistics () {
      todayStatistics().then(res => {
        this.moneyObj = res.data
      })
    },
    exclusivePage () {
      let that = this
      exclusivePage().then(res => {
        if (res.data.length > 0) {
          that.$set(that, "historyList", res.data)
        } else {
          that.$set(that, "historyList", [])
        }
        uni.stopPullDownRefresh();
      })
    },
  }
}
</script>

<style scoped lang="scss">
.wallet_missed {
  .tota_income {
    height: 250rpx;
    background: white;
    border-bottom: 3px solid rgb(250, 250, 250);
    box-sizing: border-box;
    padding-top: 20px;
    padding-bottom: 20px;
    .t-t {
      display: block;
      text-align: center;
      width: 100%;
      font-size: 30px;
      color: #ec912d;
    }
    .t-b {
      display: block;
      text-align: center;
      font-size: 15px;
      font-family: PingFangSC-Regular, PingFang SC;
      font-weight: 400;
      color: #ec912d;
    }
  }

  .tota_history {
		overflow: auto;
		height: 740rpx;
    .h-item {
      display: flex;
      padding: 10px;
      height: 100rpx;
      background: white;
      border-bottom: 3px solid rgb(250, 250, 250);
      .h-l {
        display: flex;
        flex-direction: column;
        text-align: left;
        flex: 1;
        line-height: 50rpx;
        &:nth-child(0) {
          font-size: 15px;
          font-family: PingFangSC-Medium, PingFang SC;
          font-weight: 500;
          color: #333333;
        }
      }
      .h-r {
        display: flex;
        text-align: right;
        flex: 1;
        font-size: 12px;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: #666666;
        line-height: 50rpx;
        justify-content: flex-end;
        padding-right: 30px;
        .imp {
          font-family: DINAlternate-Bold, DINAlternate;
          color: #eb4c63;
        }
      }
    }
  }
  .op-area {
    .bnt {
      background: rgb(235, 75, 99);
      font-size: 32rpx;
      color: #fff;
      width: 690rpx;
      height: 90rpx;
      text-align: center;
      border-radius: 50rpx;
      line-height: 90rpx;
      margin: 64rpx auto;
    }
  }
}
</style>
<!-- #endif -->