一切都是对象

<script>
  import wepy from 'wepy'
  import api from '../api/api'
  export default class consumeRecord extends wepy.page {
    config = {
      navigationBarTitleText: '消费流水'
    }
    data = {
      commonCfg: {},
      consumeTypeMap: {
        '消费': 'Consume',
        '冻结': 'Freeze',
        '充值': 'Recharge',
        '审核成功': 'CheckSuccess',
        '赠送': 'Gift',
        '退款': 'Refund',
        '解冻': 'Unfreeze',
        '续费': 'Renew'
      },
      apiRes: {}
    }
    async getConsumeHistory() {
      const UID = this.$parent.UID
      const backEndRequire = {
        method: 'POST',
        header: {
          "Content-Type": "application/x-www-form-urlencoded"
        }
      }
      let queryAccountBalance = backEndRequire
      queryAccountBalance.query = {
        uid: UID.uid
      }
      const resAccountBalance = await api.getAccountBalance(queryAccountBalance)
      let queryRecentConsumeTotal = backEndRequire
      queryRecentConsumeTotal.query = {
        uid: UID.uid,
        period: 30
      }
      const resRecentConsumeTotal = await api.getRecentConsumeTotal(queryRecentConsumeTotal)
      let queryConsumeList = backEndRequire
      queryConsumeList.query = {
        uid: UID.uid,
        page: 1,
        size: 30
      }
      const resConsumeList = await api.getConsumeList(queryConsumeList)
      this.apiRes = {
        ConsumeList: resConsumeList.data.data,
        RecentConsumeTotal: resRecentConsumeTotal.data.data,
        AccountBalance: resAccountBalance.data.data
      }
      this.$apply()
    }
    onLaunch() {}
    onLoad() {
      this.commonCfg = wepy.$appConfig.common
      this.getConsumeHistory()
    }
    onShareAppMessage() {}
    methods = {}
  }
</script>

<template>
  <view>
    <view class="page">
      <view class="page__bd">
        <view class="page__desc intro">【最近30天】消费总金额{{apiRes.RecentConsumeTotal.consume}}币，充值总金额{{apiRes['RecentConsumeTotal']['recharge']}}币</view>
        <view class="page__desc intro">【当前】冻结金额{{apiRes.AccountBalance['1'].freeze}}币，当前余额{{apiRes.AccountBalance['1'].val}}币</view>
      </view>
      <view class="page__bd">
        <view class="weui-cells">
          <repeat for="{{apiRes.ConsumeList}}" key="index" index="index" item="item">
            <view class="weui-cell weui-cell_access" hover-class="weui-cell_active">
              <view class="weui-cell__hd">
                <image src="{{commonCfg.localImgPath}}account{{consumeTypeMap[item.type]}}.svg" style="margin-right: 5rpx;vertical-align: middle;20rpx; height: 20rpx;"></image>
              </view>
              <view class="weui-cell__bd">{{item.val}}：{{item.service}}：{{item.log}}：{{item.create_time}}</view>
              <view class="weui-cell__ft weui-cell__ft_in-access"></view>
            </view>
          </repeat>
          <navigator url="" class="weui-cell weui-cell_access" hover-class="weui-cell_active">
            <view class="weui-cell__hd">
              <image src="{{commonCfg.localImgPath}}消费图标2.png" style="margin-right: 5rpx;vertical-align: middle;20rpx; height: 20rpx;"></image>
            </view>
            <view class="weui-cell__bd">发布 【开发阶段0627】为展示icon而硬代码显示</view>
            <view class="weui-cell__ft weui-cell__ft_in-access"></view>
          </navigator>
          <navigator url="" class="weui-cell weui-cell_access" hover-class="weui-cell_active">
            <view class="weui-cell__hd">
              <image src="{{commonCfg.localImgPath}}消费图标2.png" style="margin-right: 5rpx;vertical-align: middle;20rpx; height: 20rpx;"></image>
            </view>
            <view class="weui-cell__bd">发布短视频 小兔子乖乖</view>
            <view class="weui-cell__ft weui-cell__ft_in-access"></view>
          </navigator>
          <navigator url="" class="weui-cell weui-cell_access" hover-class="weui-cell_active">
            <view class="weui-cell__hd">
              <image src="{{commonCfg.localImgPath}}赠送图标.png" style="margin-right: 5rpx;vertical-align: middle;20rpx; height: 20rpx;"></image>
            </view>
            <view class="weui-cell__bd">赠送成功</view>
            <view class="weui-cell__ft weui-cell__ft_in-access"></view>
          </navigator>
          <navigator url="" class="weui-cell weui-cell_access" hover-class="weui-cell_active">
            <view class="weui-cell__hd">
              <image src="{{commonCfg.localImgPath}}充值图标.png" style="margin-right: 5rpx;vertical-align: middle;20rpx; height: 20rpx;"></image>
            </view>
            <view class="weui-cell__bd">充值成功</view>
            <view class="weui-cell__ft weui-cell__ft_in-access"></view>
          </navigator>
          <navigator url="" class="weui-cell weui-cell_access" hover-class="weui-cell_active">
            <view class="weui-cell__hd">
              <image src="{{commonCfg.localImgPath}}续费图标.png" style="margin-right: 5rpx;vertical-align: middle;20rpx; height: 20rpx;"></image>
            </view>
            <view class="weui-cell__bd">续费成功</view>
            <view class="weui-cell__ft weui-cell__ft_in-access"></view>
          </navigator>
          <navigator url="" class="weui-cell weui-cell_access" hover-class="weui-cell_active">
            <view class="weui-cell__hd">
              <image src="{{commonCfg.localImgPath}}冻结图标.png" style="margin-right: 5rpx;vertical-align: middle;20rpx; height: 20rpx;"></image>
            </view>
            <view class="weui-cell__bd">冻结成功</view>
            <view class="weui-cell__ft weui-cell__ft_in-access"></view>
          </navigator>
          <navigator url="" class="weui-cell weui-cell_access" hover-class="weui-cell_active">
            <view class="weui-cell__hd">
              <image src="{{commonCfg.localImgPath}}消费图标2.png" style="margin-right: 5rpx;vertical-align: middle;20rpx; height: 20rpx;"></image>
            </view>
            <view class="weui-cell__bd">发布 屈原</view>
            <view class="weui-cell__ft weui-cell__ft_in-access"></view>
          </navigator>
          <navigator url="" class="weui-cell weui-cell_access" hover-class="weui-cell_active">
            <view class="weui-cell__hd">
              <image src="{{commonCfg.localImgPath}}解冻图标.png" style="margin-right: 5rpx;vertical-align: middle;20rpx; height: 20rpx;"></image>
            </view>
            <view class="weui-cell__bd">解冻成功</view>
            <view class="weui-cell__ft weui-cell__ft_in-access"></view>
          </navigator>
          <navigator url="" class="weui-cell weui-cell_access" hover-class="weui-cell_active">
            <view class="weui-cell__hd">
              <image src="{{commonCfg.localImgPath}}退款图标.png" style="margin-right: 5rpx;vertical-align: middle;20rpx; height: 20rpx;"></image>
            </view>
            <view class="weui-cell__bd">退款成功</view>
            <view class="weui-cell__ft weui-cell__ft_in-access"></view>
          </navigator>
          <navigator url="" class="weui-cell weui-cell_access" hover-class="weui-cell_active">
            <view class="weui-cell__hd">
              <image src="{{commonCfg.localImgPath}}审核成功图标.png" style="margin-right: 5rpx;vertical-align: middle;20rpx; height: 20rpx;"></image>
            </view>
            <view class="weui-cell__bd">审核成功 </view>
            <view class="weui-cell__ft weui-cell__ft_in-access"></view>
          </navigator>
        </view>
      </view>
    </view>
  </view>
</template>

<style lang="less">
  @import "../style/weui.wxss";
  .section__ctn {
    text-align: center;
  }
  .intro {
    margin: 15rpx;
    /* text-align: center; */
  }
</style>