oil-station/gasStation-uni/pagesMy/invite/list.vue
2024-10-17 11:27:25 +08:00

223 lines
4.0 KiB
Vue

<template>
<view class="content">
<view class="container">
<!-- <view class="top_box">
<view class="two_t">
<view class="">浏览人数</view>
<view class="size_">50</view>
</view>
<view class="two_t">
<view class="">注册人数</view>
<view class="size_">50</view>
</view>
</view> -->
<view class="tab_">
<view class="t-box" :class="{'orsize' : tindex == index }" v-for="(item,index) in tabList" :key="index"
@click="setIndex(index)">{{item.name}}</view>
</view>
<view class="whit-box" v-if="tindex == 1">
<view class="one_h" v-for="(item,index) in 4" :key="index">
<view class="">券名称</view>
<view class="">2024-8-7</view>
</view>
</view>
<view class="whit-box" v-else>
<view class="one_h" v-for="(item,index) in list" :key="index">
<view class="d-s">
<view class="touxiang">
<image src="../../static/logo.png" mode=""></image>
</view>
<view class="">{{item.inviteeUserName || "--"}}</view>
</view>
<view class="">{{item.createTime}}</view>
</view>
</view>
<view v-if="tindex == 1 && rewardList.length==0">
<u-empty mode="list" icon="http://cdn.uviewui.com/uview/empty/list.png">
</u-empty>
</view>
<view v-if="tindex != 1 && list.length==0">
<u-empty mode="list" icon="http://cdn.uviewui.com/uview/empty/list.png">
</u-empty>
</view>
</view>
</view>
</template>
<script>
import request from '../../utils/request';
export default {
data() {
return {
title: '',
tindex: 0,
tabList: [{
name: '会员注册记录'
},
{
name: '我的奖励记录'
}
],
list: [],
pageNo: 1,
pageSize: 10,
totalPage: '',
rewardList: []
}
},
onPullDownRefresh() {
//下拉刷新
this.resetting() //重置方法
this.getList() //调用请求
uni.stopPullDownRefresh()
},
onReachBottom() {
// 触底加载
if (this.pageNo >= this.totalPage) {
uni.showToast({
title: '没有下一页数据',
icon: 'none'
})
} else {
this.pageNo++
this.getList()
}
},
components: {
},
onLoad() {
},
onShow() {
this.getList()
},
methods: {
setIndex(num) {
this.tindex = num
},
//滞空方法
resetting() {
this.pageNo = 1
this.pageSize = 10
this.totalPage = ''
this.list = []
},
// 获取列表信息
getList() {
request({
url: '/business/marketingActivity/activeApplet/getRecommendedRecordsByStoreId',
method: 'get',
params: {
storeId: uni.getStorageSync("storeId")
}
}).then(res => {
console.log(res, 106)
if (res.code == 200) {
this.list = res.data
}
})
},
goback() {
uni.navigateBack()
}
}
}
</script>
<style scoped lang="scss">
.content {
background: #f4f5f6;
}
.container {
width: 100%;
height: 100vh;
box-sizing: border-box;
padding-top: 15px;
}
.top_box {
width: 95%;
display: flex;
align-items: center;
justify-content: space-between;
margin: 15px auto;
box-sizing: border-box;
padding-top: 15px;
}
.two_t {
width: 49%;
background: #fff;
box-sizing: border-box;
padding: 15px;
text-align: center;
}
.size_ {
font-weight: 600;
font-size: 18px;
color: #333333;
}
.tab_ {
width: 100%;
display: flex;
align-items: center;
justify-content: space-around;
}
.t-box {
font-weight: 600;
font-size: 16px;
color: #333333;
box-sizing: border-box;
padding-bottom: 10px;
border-bottom: 1px solid transparent;
}
.orsize {
color: #FA6400;
border-bottom: 1px solid #FA6400;
}
.whit-box {
width: 95%;
background: #fff;
margin: 10px auto;
}
.one_h {
width: 100%;
box-sizing: border-box;
padding: 10px;
border-bottom: 1px solid #eee;
display: flex;
align-items: center;
justify-content: space-between;
}
.touxiang {
width: 40px;
height: 40px;
overflow: hidden;
border-radius: 50%;
margin-right: 10px;
image {
width: 40px;
height: 40px;
}
}
.d-s {
display: flex;
align-items: center;
}
</style>