|
@@ -2,81 +2,151 @@
|
|
|
<view class="container">
|
|
|
<!-- 头部 -->
|
|
|
<view class="header">
|
|
|
- <text class="active">消费</text>
|
|
|
- <text>充值</text>
|
|
|
+ <text :class="tabType==1?'active':''" @tap="changeTab(1)">消费</text>
|
|
|
+ <text :class="tabType==0?'active':''" @tap="changeTab(0)">充值</text>
|
|
|
</view>
|
|
|
|
|
|
<!-- 主体内容 -->
|
|
|
- <scroll-view class="scroll-content" scroll-y>
|
|
|
- <view class="month-list">
|
|
|
- <!-- 3月记录 -->
|
|
|
- <view class="month-card">
|
|
|
- <view class="month-header">
|
|
|
- <text class="month-title">2025年3月</text>
|
|
|
- <text class="month-total">总计:¥4.00</text>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="record-list">
|
|
|
- <view
|
|
|
- class="record-item"
|
|
|
- v-for="(item, index) in marchRecords"
|
|
|
- :key="index"
|
|
|
- >
|
|
|
- <view class="item-left">
|
|
|
- <text class="amount-label">消费</text>
|
|
|
- <text class="time">{{item.time}}</text>
|
|
|
- </view>
|
|
|
- <text class="amount">¥{{item.amount}}</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
+ <view class="scroll-content" >
|
|
|
+ <scroll-view scroll-y style="height: 100%;width:100%;overflow: auto;" @scrolltolower="onreachBottom">
|
|
|
+ <view class="month-list">
|
|
|
+ <!-- 3月记录 -->
|
|
|
+ <view class="month-card" v-for="item in list" :key="item.tradeMonth">
|
|
|
+ <view class="month-header">
|
|
|
+ <text class="month-title">{{item.tradeMonth}}</text>
|
|
|
+ <text class="month-total">总计:¥{{item.totalAmount}}</text>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="record-list">
|
|
|
+ <view
|
|
|
+ class="record-item"
|
|
|
+ v-for="(sitem, index) in item.list"
|
|
|
+ :key="sitem.id"
|
|
|
+ >
|
|
|
+ <view class="item-left">
|
|
|
+ <text class="amount-label">{{tabType==0?'充值':'消费'}}</text>
|
|
|
+ <text class="time" v-if="tabType==1&&sitem.bizType=='SALES'">{{sitem.finishFlag==1?'支付时间':'采购时间'}}:{{sitem.tradeDate}}</text>
|
|
|
+ <text class="time" v-if="tabType==1&&sitem.bizType=='REFUND'">退款时间:{{sitem.tradeDate}}</text>
|
|
|
+ <text class="time" v-if="tabType==0">{{sitem.bizType=='ZERO'?'清零时间':'充值时间'}}:{{sitem.tradeDate}}</text>
|
|
|
+ </view>
|
|
|
+ <text class="amount">¥{{sitem.tradeAmount}}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view style="padding:0 30upx 30upx;">
|
|
|
+ <u-empty :src="`/static/nodata.png`" icon-size="180" :text="noDataText" img-width="120" v-if="list.length==0 && status!='loading'" mode="list"></u-empty>
|
|
|
+ <u-loadmore v-if="(total>=list.length&&list.length)||status=='loading'" :status="status" />
|
|
|
+ </view>
|
|
|
</view>
|
|
|
-
|
|
|
- <!-- 2月记录 -->
|
|
|
- <view class="month-card">
|
|
|
- <view class="month-header">
|
|
|
- <text class="month-title">2025年2月</text>
|
|
|
- <text class="month-total">总计:¥6.00</text>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="record-list">
|
|
|
- <view
|
|
|
- class="record-item"
|
|
|
- v-for="(item, index) in febRecords"
|
|
|
- :key="index"
|
|
|
- >
|
|
|
- <view class="item-left">
|
|
|
- <text class="amount-label">消费</text>
|
|
|
- <text class="time">{{item.time}}</text>
|
|
|
- </view>
|
|
|
- <text class="amount">¥{{item.amount}}</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </scroll-view>
|
|
|
+ </scroll-view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+import {xprhStoreAccountFlowPage} from '@/api/recharge.js'
|
|
|
+import {
|
|
|
+ mapState,
|
|
|
+ mapMutations,
|
|
|
+ } from 'vuex'
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
- marchRecords: [
|
|
|
- { amount: 1.00, time: '2025/03/04 08:00:29' },
|
|
|
- { amount: 1.00, time: '2025/03/03 18:42:57' },
|
|
|
- { amount: 1.00, time: '2025/03/03 18:16:31' },
|
|
|
- { amount: 1.00, time: '2025/03/03 08:06:20' }
|
|
|
- ],
|
|
|
- febRecords: [
|
|
|
- { amount: 1.00, time: '2025/02/28 20:36:46' },
|
|
|
- { amount: 1.00, time: '2025/02/28 07:55:45' }
|
|
|
- ]
|
|
|
+ status: 'loading',
|
|
|
+ noDataText: '暂无数据',
|
|
|
+ // 查询条件
|
|
|
+ pageNo: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ list: [],
|
|
|
+ total: 0,
|
|
|
+ tabType:0,
|
|
|
+ lastMoth:''
|
|
|
}
|
|
|
+ },
|
|
|
+ onLoad(opts){
|
|
|
+ this.tabType = opts.type
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+ this.getRow(1)
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapState(['hasLogin']),
|
|
|
+ // 登录用户信息
|
|
|
+ userInfo(){
|
|
|
+ return this.$store.state.vuex_userInfo
|
|
|
+ },
|
|
|
+ // 货架经销商信息
|
|
|
+ shelfInfo(){
|
|
|
+ return this.$store.state.vuex_storeShelf
|
|
|
+ },
|
|
|
+ maxNums(){
|
|
|
+ let nums = 0
|
|
|
+ this.list.forEach(item => {
|
|
|
+ nums += item.list.length
|
|
|
+ })
|
|
|
+ return nums
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ changeTab(type){
|
|
|
+ this.tabType = type
|
|
|
+ this.list = []
|
|
|
+ this.lastMoth = ''
|
|
|
+ this.getRow(1)
|
|
|
+ },
|
|
|
+ // 查询列表
|
|
|
+ getRow (pageNo) {
|
|
|
+ let _this = this
|
|
|
+ this.status = "loading"
|
|
|
+ // 0 充值,1 消费
|
|
|
+ const params = {
|
|
|
+ storeSn:this.shelfInfo.storeSn,
|
|
|
+ bizTypeList:this.tabType==0 ? ['RECHARGE'] : ['SALES', 'REFUND'],
|
|
|
+ accountType: ['RECHARGE','GIVE'][this.tabType]
|
|
|
+ }
|
|
|
+ xprhStoreAccountFlowPage({pageNo:this.pageNo,pageSize: this.pageSize,...params}).then(res => {
|
|
|
+ if (res.status == 200) {
|
|
|
+ const list = res.data&&res.data.list || []
|
|
|
+ if(_this.pageNo>1){
|
|
|
+ const fm = list[0] && list[0].tradeMonth
|
|
|
+ // 如果相等,将数据拼接到上页去
|
|
|
+ if(fm == _this.lastMoth){
|
|
|
+ let preList = _this.list[_this.list.length-1].list
|
|
|
+ preList = preList.concat(list[0].list)
|
|
|
+ _this.list[_this.list.length-1].list = preList
|
|
|
+ // 删除第一项
|
|
|
+ list[0].list = []
|
|
|
+ }
|
|
|
+ console.log(list)
|
|
|
+ _this.list = _this.list.concat(list.length?list.filter(item=>item.list.length):list)
|
|
|
+ }else{
|
|
|
+ _this.list = list
|
|
|
+ }
|
|
|
+ // 最后一条的月份
|
|
|
+ _this.lastMoth = _this.list.length>0 ? _this.list[_this.list.length-1].tradeMonth : ''
|
|
|
+ _this.total = res.data.count || 0
|
|
|
+ } else {
|
|
|
+ _this.list = []
|
|
|
+ _this.total = 0
|
|
|
+ _this.noDataText = res.message
|
|
|
+ }
|
|
|
+ _this.status = _this.total>=_this.maxNums ? "nomore" : 'loadmore'
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // scroll-view到底部加载更多
|
|
|
+ onreachBottom() {
|
|
|
+ if(this.maxNums < this.total){
|
|
|
+ this.pageNo += 1
|
|
|
+ this.getRow()
|
|
|
+ }else{
|
|
|
+ this.status = "nomore"
|
|
|
+ }
|
|
|
+ },
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
-<style lang="scss">
|
|
|
+<style lang="less">
|
|
|
.container {
|
|
|
height: 100vh;
|
|
|
display: flex;
|
|
@@ -102,7 +172,7 @@ export default {
|
|
|
}
|
|
|
|
|
|
.scroll-content {
|
|
|
- flex-grow: 1;
|
|
|
+ height: calc(100vh - 90px);
|
|
|
.month-list{
|
|
|
padding: 0 15px;
|
|
|
}
|