|
|
@@ -7,23 +7,64 @@
|
|
|
<view class="hold-status-bar">
|
|
|
<!-- 占据了状态栏位置 -->
|
|
|
</view>
|
|
|
- <view class="" style="display: none;">
|
|
|
- <view class="top-img mall">
|
|
|
- <image :src="$getimg + 'usercenter-bg.png'" class="img" mode="scaleToFill"></image>
|
|
|
- <view class="integral">
|
|
|
- <view class="integral-til">我的积分</view>
|
|
|
+
|
|
|
+ <view class="top-img mall">
|
|
|
+ <image :src="$getimg + 'usercenter-bg.png'" class="img" mode="scaleToFill"></image>
|
|
|
+ <view class="integral">
|
|
|
+ <view class="integral-til">我的积分</view>
|
|
|
+ <view class="integral-num">
|
|
|
+ <text class="num">9</text>
|
|
|
+ <text class="num">9</text>
|
|
|
+ <text class="num">9</text>
|
|
|
+ <text class="num">9</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
- </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="integral-content">
|
|
|
+ <view class="integral-content-til">积分兑换</view>
|
|
|
+ <mescroll-body class="" ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback" :down="downOption" :up="upOption">
|
|
|
+ <view class="product">
|
|
|
+ <view v-for="(item,index) in productList" :key="index" class="product-item" @click="goCertDetails(item.fkOrderId)">
|
|
|
+
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </mescroll-body>
|
|
|
+ </view>
|
|
|
+
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+ // 引入mescroll-mixins.js
|
|
|
+ import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
|
|
|
+ // 引入mescroll-body组件 (如已在main.js注册全局组件,则省略此步骤)
|
|
|
+ import MescrollBody from "@/components/mescroll-uni/mescroll-body.vue"; // 注意.vue后缀不能省
|
|
|
export default {
|
|
|
+ mixins: [MescrollMixin], // 使用mixin
|
|
|
+ components: {
|
|
|
+ MescrollBody,
|
|
|
+ },
|
|
|
data() {
|
|
|
return {
|
|
|
+ mescroll: null, // mescroll实例对象 (此行可删,mixins已默认)
|
|
|
+ // 下拉刷新的配置(可选, 绝大部分情况无需配置)
|
|
|
+ downOption: {
|
|
|
+ // ...
|
|
|
+ },
|
|
|
+ // 上拉加载的配置(可选, 绝大部分情况无需配置)
|
|
|
+ upOption: {
|
|
|
+ page: {
|
|
|
+ size: 10 // 每页数据的数量,默认10
|
|
|
+ },
|
|
|
+ noMoreSize: 5, // 配置列表的总数量要大于等于5条才显示'-- END --'的提示
|
|
|
+ empty: {
|
|
|
+ tip: '暂无相关数据'
|
|
|
+ }
|
|
|
+ },
|
|
|
token:'',
|
|
|
$getimg:this.$getimg,
|
|
|
+ productList:[],
|
|
|
params:{
|
|
|
|
|
|
}
|
|
|
@@ -37,11 +78,68 @@
|
|
|
|
|
|
},
|
|
|
methods: {
|
|
|
- goIndex(){
|
|
|
- uni.switchTab({
|
|
|
- url:'../index/index'
|
|
|
- })
|
|
|
+ /*mescroll组件初始化的回调,可获取到mescroll对象 (此处可删,mixins已默认)*/
|
|
|
+ mescrollInit(mescroll) {
|
|
|
+ this.mescroll = mescroll;
|
|
|
+ },
|
|
|
+ /*下拉刷新的回调, 有三种处理方式:*/
|
|
|
+ downCallback(){
|
|
|
+
|
|
|
+ // 第2种: 下拉刷新和上拉加载调同样的接口, 那么不用第1种方式, 直接mescroll.resetUpScroll()即可
|
|
|
+ this.mescroll.resetUpScroll(); // 重置列表为第一页 (自动执行 page.num=1, 再触发upCallback方法 )
|
|
|
+ },
|
|
|
+ /*上拉加载的回调*/
|
|
|
+ upCallback(page) {
|
|
|
+ let pageNum = page.num; // 页码, 默认从1开始
|
|
|
+ let pageSize = page.size; // 页长, 默认每页10条
|
|
|
+ this.params = Object.assign(this.params,{pageNum:pageNum,pageSize:pageSize});
|
|
|
+ let thetoken = this.tokenhead + ' ' + this.token;
|
|
|
+ // console.log('thetoken',thetoken);
|
|
|
+ // this.$api.http.post(this.config.apiBaseurl+'/carbon-h5/wap/order/searchCredentialList',{params:this.params,header: {Authorization:thetoken}})
|
|
|
+ this.$api.http.post(this.config.apiBaseurl + '/carbon-h5/wap/order/searchCredentialList',this.params,{
|
|
|
+ header: {
|
|
|
+ Accept:'application/json',
|
|
|
+ Authorization: 'Bearer '+ this.token, //注意Bearer后面有一空格
|
|
|
+ },
|
|
|
+ }).then(data => {
|
|
|
+ // 接口返回的当前页数据列表 (数组)
|
|
|
+ let curPageData = data.data.retBody;
|
|
|
+ // console.log('curPageData',curPageData);
|
|
|
+ // 接口返回的当前页数据长度 (如列表有26个数据,当前页返回8个,则curPageLen=8)
|
|
|
+ let curPageLen = curPageData.length;
|
|
|
+ // 接口返回的总页数 (如列表有26个数据,每页10条,共3页; 则totalPage=3)
|
|
|
+ // let totalPage = data.xxx;
|
|
|
+ // 接口返回的总数据量(如列表有26个数据,每页10条,共3页; 则totalSize=26)
|
|
|
+ let totalSize = data.data.retHead.total;
|
|
|
+ // this.mescrollList = curPageData;
|
|
|
+ // 接口返回的是否有下一页 (true/false)
|
|
|
+ // let hasNext = data.xxx;
|
|
|
+
|
|
|
+ //设置列表数据
|
|
|
+ if(page.num == 1) this.certificateList = []; //如果是第一页需手动置空列表
|
|
|
+ this.certificateList = this.certificateList.concat(curPageData); //追加新数据
|
|
|
+ // console.log('page.num',page.num);
|
|
|
+ console.log('this.certificateList',JSON.parse(JSON.stringify(this.certificateList)));
|
|
|
+
|
|
|
+ //方法二(推荐): 后台接口有返回列表的总数据量 totalSize
|
|
|
+ this.mescroll.endBySize(curPageLen, totalSize);
|
|
|
+
|
|
|
+ // setTimeout(()=>{
|
|
|
+ // this.mescroll.endSuccess(curPageLen)
|
|
|
+ // },20)
|
|
|
+
|
|
|
+ }).catch(err => {
|
|
|
+ this.mescroll.endErr()
|
|
|
+ console.log(err)
|
|
|
+
|
|
|
+ });
|
|
|
+
|
|
|
}
|
|
|
+ // goIndex(){
|
|
|
+ // uni.switchTab({
|
|
|
+ // url:'../index/index'
|
|
|
+ // })
|
|
|
+ // }
|
|
|
|
|
|
}
|
|
|
}
|
