cunzaicourseMall_user_app/pages_company/refundList.vue

<template>
	<view class="column hb flex-1" >
		<view class="searchbox">
			<view class="searchbox-bar x-ac">
				<view :class="queryParam.type == index ? 'searchbox-item searchbox-active':'searchbox-item'"
					v-for="(item,index) in typeOption" :key="index" @click="handleType(index)">{{item.label}}</view>
			</view>
			<view class="x-ac ss mt20" v-show="queryParam.type == 4">
				<view class="calendar-day x-c" @click="showCalendar = true"><u-icon name="calendar" color="#999"
						size="20"></u-icon>{{startTime}}</view>
				<view class="calendar-day x-c" @click="showCalendar = true"><u-icon name="calendar" color="#999"
						size="20"></u-icon>{{endTime}}</view>
			</view>
		</view>
		<view >
			<u-calendar :show="showCalendar" :mode="mode" @confirm="confirmCalendar" style="flex: 0; overflow: hidden;"
				@close="closeCalendar" :minDate="new Date().getTime()-(3600*1000*24*60)" :maxDate="new Date().getTime()"
				></u-calendar>
		</view>
		<view class="justify-between p40 align-center">
			<view>{{PaymentData.statPeriod}}</view>
			<view class='base-color-6 fs24'>
				<text class="base-color-dark fs32">{{queryParam.type != 4?'已退款':'拒绝退款'}}{{PaymentData.count}}</text>笔
			</view>
			<!-- <view>
				<view class='fs28 base-color-6'>已退款:
					<text class="base-success">￥{{PaymentData.count?PaymentData.count:'0.00'}}</text></view>
			</view> -->
		</view>
		<view class="column scrolly">
			<scroll-view :scroll-y="true" class="hb pb40" :refresher-enabled="isEnabled" :refresher-triggered="triggered"
				refresher-background="rgba(0,0,0,0)" @refresherrefresh="pullDownRefresh"
				@refresherrestore="triggered = false" :upper-threshold="100" :lower-threshold="100"
				@refresherabort="triggered = false" @scrolltolower="reachBottom">
				<view class="bgf p40 m4 " v-for="(item,index) in paymentList" :key="index">
					<view class="justify-between align-center" @click="tolineDetails(item)">
						<!-- <view class="justify-between align-center"> -->
							<view>
								<view class="fs28 base-color-6 mt4" v-if="item.remark">备注：{{item.remark}}</view>
								<view class="fs24 base-color-9">支付时间：{{item.payTime}}</view>
							</view>
							<view class="column centerV">
								<view class="base-success fs40 bold">{{item.payMoney.toFixed(2)}}</view>
								<view class="base-price fs24" v-if="item.refundAuditStatus==1">已退款</view>
								<view class="orangecol fs24" v-if="item.refundAuditStatus==0" @click="topaymentId(item.paymentId)">待审核</view>
								<view class="base-price fs24" v-else-if="item.refundAuditStatus==2">拒绝退款</view>
							</view>
						<!-- </view> -->
					</view>
				</view>
				<u-loadmore :status="status" />
				<view class="pb120" v-if="queryParam.type==1"></view>
			</scroll-view>
		</view>
		<view>
			<u-modal :show="showReview" :title="titleReview" :content='contentReview' cancelText='拒绝' confirmText='通过'
			 :showCancelButton='true' @cancel='toReview(2)' @confirm='toReview(1)'></u-modal>
		</view>
	</view>
</template>

<script>
	import {getPendingRefundList,getRefundAuditCount,auditRefund } from '@/api/payment'
	export default {
		data() {
			return {
				typeOption: [{
					label: '全部',
					value: 0
				}, {
					label: '待审核',
					value: 1
				}, {
					label: '已审核',
					value: 2
				}, {
					label: '已拒绝',
					value: 4
				}],
				queryParam: {
					type: 0
				},
				showCalendar:false,
				mode: 'range',
				startTime:uni.$u.timeFormat(new Date(), 'yyyy-mm-dd'),
				endTime:uni.$u.timeFormat(new Date(), 'yyyy-mm-dd'),
				companyId:'',
				companyUserId:'',
				pageSize:10,
				pageNum:1,
				triggered: false,
				status: 'loadmore',
				isEnabled: true,
				paymentList:[],
				PaymentData:[],
				selectedUsers:[],
				isSelectAll:false,
				titleReview:'审核',
				contentReview:'确认退款金额并同意当前订单退款！',
				showReview:false,
				getpaymentId:null
			}
		},
		onLoad(option) {
			this.companyUserId=option.companyUserId
			this.companyId=option.companyId
			this.getlistDiscount()
			this.getPaymentDatas("refresh")
		},
		methods:{
			// 全选
			selectAll() {
				this.isSelectAll = !this.isSelectAll;
				this.selectedUsers = []; // 清空已选列表
				 // 遍历所有用户项，更新 checked 状态
				    this.paymentList = this.paymentList.map(group => {
				      // group = group.map(user => {
				        if (this.isSelectAll) {
				          this.selectedUsers.push(group.paymentId); // 添加用户ID到选中列表
				        }
				        return {
				          ...group,
				          checked: this.isSelectAll,
				        };
				      // });
				      return group;
				    });
				// 如果取消全选，清空 selectedUsers
					if (!this.isSelectAll) {
					  this.selectedUsers = [];
					}
			},
			// 单选 /反选
			changeitem(paymentId) {
				const index = this.selectedUsers.indexOf(paymentId);
				if (index === -1) {
				  this.selectedUsers.push(paymentId); // 选中
				} else {
				  this.selectedUsers.splice(index, 1); // 取消选中
				}
				// 更新全选状态
				this.isSelectAll = this.selectedUsers.length === this.getTotalUsers();
			},
			// 计算总用户数
			  getTotalUsers() {
			    return this.paymentList.reduce((total, group) => total + group.length, 0);
			  },
			tolineDetails(item){
				uni.navigateTo({
					url:'/pages_company/order/lineDetails?paymentId='+item.paymentId
				})
			},
			paymentId(id){
				this.getpaymentId=id
			},
			toReview(type){
				if(this.queryParam.type!=1){
					this.selectedUsers[0]=this.getpaymentId
				}else{
					
				}
				const data={
					paymentId:this.getpaymentId,
					refundStatus:type
				}
				auditRefund(data).then(res=>{
					if(res.code==200){
						uni.showToast({
							icon:'none',
							title: '操作成功！',
						});
						this.showReview=false
						this.getlistDiscount('refresh')
					}else{
						uni.showToast({
							icon:'none',
							title: res.msg,
						});
					}
				})
			},
			getPaymentDatas(){
				const data={
					companyUserId:this.companyUserId,
					auditStatus:this.queryParam.type,
					// startDate:this.startTime,
					// endDate:this.endTime,
					companyId:this.companyId,
					appId:wx.getAccountInfoSync().miniProgram.appId
				}
				getRefundAuditCount(data).then(res=>{
					if(res.code==200){
						this.PaymentData=res.data
					}else{
						uni.showToast({
							icon:'none',
							title: res.msg,
						});
					}
				})
			},
			handleType(type) {
				this.queryParam.type = type
				// if(this.queryParam.type != 4){
					this.pageNum=1
					this.paymentList=[]
					this.getlistDiscount()
					this.getPaymentDatas("refresh")
				// }
				// if (this.queryParam.type == 4) {
				// }
			},
			confirmCalendar(e) {
				this.startTime = e[0]
				this.endTime = e[e.length - 1]
				this.paymentList=[]
				this.getlistDiscount()
				this.getPaymentDatas("refresh")
				this.showCalendar = false
			},
			closeCalendar() {
				this.showCalendar = false
			},
			pullDownRefresh() {
				// 下拉刷新
				this.triggered = true; //下拉了状态为true
				setTimeout(() => {
					this.triggered = false;
					uni.stopPullDownRefresh()
					this.pageNum = 1;
					this.paymentList=[]
					this.getlistDiscount('refresh') //触底  不穿执行else
					// 请求接口里面需要判断是不是最后一页   是最后一页 status赋值为‘loadmore’没有更多了
					// 请求接口
				}, 1000)
			},
			reachBottom() {
				// status这个是加载状态
				console.log(111);
				if (this.status === 'loadmore') {
					this.status = 'loading'
					uni.showNavigationBarLoading()
					setTimeout(() => {
						this.pageNum++
						this.getlistDiscount() //触底  不穿执行else
						uni.hideNavigationBarLoading()
					}, 1000);
				}
			},
			getlistDiscount(type){
				const data={
					companyUserId:this.companyUserId,
					companyId:this.companyId,
					auditStatus:this.queryParam.type,
					// startDate:this.startTime,
					// endDate:this.endTime,
					pageSize:this.pageSize,
					pageNum:this.pageNum,
					appId:wx.getAccountInfoSync().miniProgram.appId
					}
				getPendingRefundList(data).then(res=>{
					if(res.code==200){
						// refresh 下拉
						// let list=res.data.list
						let list = res.data.list.map(item => {
							return {
								...item,
								checked: false,
							}
						})
						if (type == 'refresh') {
							this.paymentList = list
							
						} else {
							// 加载更多 当前页和下一页合并
							this.paymentList = [...this.paymentList, ...list]
						}
						if (res.data.isLastPage) {
							this.status = 'nomore'
						} else {
							this.status = 'loadmore'
						}
					}else{
						uni.showToast({
							icon:'none',
							title: res.msg,
						});
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.foot-select {
		width:100%;
		padding: 20rpx 20rpx;
		padding-bottom: 60rpx;
		z-index: 10000 !important;
		position: fixed;
		bottom: 0;
	}
	.orangecol{
		background-color: #ffa006;
		color: #fff;
		border-radius: 40rpx;
		padding: 10rpx 20rpx;
		text-align: center;
	}
	.searchbox {
		background-color: #fff;
		border-radius: 8rpx 8rpx 0 0;
		padding: 15px;
	
		&-item {
			height: 23px;
			line-height: 23px;
			width: 65px;
			background: #f5f5f5;
			text-align: center;
			border-radius: 5px;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			font-size: 12px;
			color: #888;
		}
	
		&-active {
			color: #fff !important;
			background-color: #1677ff !important;
		}
	}
</style>