pointsExchangeRecords.vue 3.9 KB
<template>
<div class="records_back">
    <!-- 占位 -->
    <div v-show="this.isCNLive.value" class="title_box_lh" :style="'padding-top: ' + (($parent.top.value)+8) + 'px'">

    </div>
    <!--返回按钮-->
    <div class="title_box" :style="'padding-top: ' + (($parent.top.value)+8) + 'px'" >
        <div class="title">      <!--返回按钮-->
          <img v-if="this.isCNLive.value" @click="goback"
              class="goback" src="static/img/icon_back.png" />
          <div class="text">兑换记录</div>
        </div>
    </div>
    <div  class="com_box"
          v-infinite-scroll="loadMore"
          infinite-scroll-disabled="loading"
          :infinite-scroll-distance="list.length">
      <div class="item_box" v-for="(item, index) in list" :key="index">
        <img v-lazy="item.simg" src="item" alt=""/>
        <div class="right">
          <div class="name">
            {{item.title}}
          </div>
          <div class="address_name">
            收货人 {{item.address_name}}
          </div>
          <div class="exchange_time">
            兑换时间 {{item.create_time*1000 | datetime('yyyy-MM-dd hh:mm:ss')}}
          </div>
        </div>
      </div>
      <div v-if="isMore==0" class="is_more">
        没有更多了
      </div>
    </div>
</div>
</template>

<script>
// 引入组件
import { Toast, Indicator } from "mint-ui";
export default {
  data () {
    return {
      list: [], // 中奖记录列表
      page: 0,
      isMore: 1, // 0没有更多1有更多
      addressInfo: null // 暂存已选商品发货地址信息
    }
  },
  //部件
  components: {
  },
  //静态
  props: [
  ],
  //对象内部的属性监听,也叫深度监听
  watch: {
  },
  //属性的结果会被缓存,除非依赖的响应式属性变化才会重新计算。主要当作属性来使用;
  computed: {
  },
  //方法表示一个具体的操作,主要书写业务逻辑;
  methods: {
    // 下拉刷新
    loadMore () {
      this.loading = true;
      this.page++;
      this.getmyLuckDraw(this.page);
    },
    // 抽奖记录
    /**
     * 获取活动详情页信息
     * @param {string} id [活动id]
     * * @param {string} uid [用户id]
     */
    getmyLuckDraw (page) {
      if (this.isMore == 1) {
        // 加载中提示
        Indicator.open("加载中...");
        // 请求接口
        this.http(
          "/Api/" + this.getApiVersion().LuckDraw + "/myLuckIntegralOrder",
          {
            uid: this.getStore("uid"),
            page: page,
            type: "1"
          },
          this.myLuckDrawCallback,
          {
            method: "POST"
          }
        );
      }
    },
    /**
     * 获取抽奖记录信息回调
     * @param {object} res [服务器返回数据]
     * @param {object} ext [扩展参数]
     */
    myLuckDrawCallback (res, ext) {
      this.loading = false;
      // 加载完成
      Indicator.close();

      // 返回处理
      if (res.code == 200) {
        // 解构数据
        let { data: datas } = res;
        if (datas.list.length == 0) {
          this.isMore = 0;
        } else {
          /* 获取活动详情页数据 开始 */
          for (let i = 1; i <= datas.list.length; i++) {
            this.list.push(datas.list[i - 1]);
          }
        }
        /* 获取抽奖记录 结束 */
      } else if (res.code == 400) {
        // 获取抽奖记录失败
        Toast(res.message);
      } else {
        // 获取抽奖记录失败
        Toast("获取抽奖记录失败");
      }
    },
    // 返回
    goback () {
      if (this.isAndroid.value) {
        this.$parent.back();
      } else {
        this.$router.push({
          path: '/pointsMall',
          query: {
            uid: this.getStore("uid") || 0,
          }
        })
      }
    }
  },
  //请求数据
  created () {
  },
  mounted () {
  }
}
</script>

<style rel="stylesheet/less" scoped lang="less">
@import 'pointsExchangeRecords';
</style>