JP-ChargeTeam51/pages/user/finance/refundDet.vue

<template>
	<view>
		<ujp-navbar title="退费详情"></ujp-navbar>
		<view class="rechargeDet-head">
			<view class="payPrice">
				<font>{{refund.refundAmount!=null ? refund.refundAmount.toFixed(2) : '0.00'}}</font><span>元</span>
			</view>
			<p>退费金额(元)</p>
		</view>
		<view class="rechargeDet-main">
			<view class="rechargeDet-list">
				<p>退费订单</p><span>{{refund.refundOrderNo}}</span>
			</view>
			<view class="rechargeDet-list">
				<p>手续费</p><span>{{refund.proceduresAmount!=null?refund.proceduresAmount.toFixed(2):'0.00'}}元</span>
			</view>
			<view class="rechargeDet-list">
				<p>退费时间</p><span>{{refund.applicationTime}}</span>
			</view>
			<!-- <view class="rechargeDet-list">
				<p>退费渠道</p><span>{{refund.refundChannelText}}</span>
			</view> -->
			<view class="rechargeDet-list">
				<p>退费金额</p><span>{{refund.refundAmount!=null?refund.refundAmount.toFixed(2):'0.00'}}元</span>
			</view>
		</view>
		<view class="rechargeDet-main">
			<view class="rechargeDet-list">
				<p>状态</p><span>{{refund.statusText}}</span>
			</view>
		</view>
	</view>
</template>

<script>
	import * as api from "@/apis/refund.js"
	let _self;
	export default {
		data() {
			return {
				elderMode:false,
				refund :{"id":3,"regUserId":"c9ab09fb-1a91-4dc5-8573-cebb353cffae","refundAmount":0.01,"status":"0","refundOrderNo":"RE0525151604592452","refundTime":null,"refundChannel":"wechat","refundRealAmount":0.01,"proceduresAmount":0,"applicationTime":"2022-05-25 15:16","applicationBy":"c9ab09fb-1a91-4dc5-8573-cebb353cffae","examineTime":null,"examineBy":null,"remark":null,"createBy":"c9ab09fb-1a91-4dc5-8573-cebb353cffae","createTime":"2022-05-25 15:16","updateBy":null,"updateTime":null,"delFlag":false,"phone":null,"headImg":null,"applicationByN":null,"examineByN":null}
			}
		},
		onLoad(op){
			_self = this;
			if(op.id){
				let data ={id:op.id};
				//('data'+JSON.stringify(data))
					api.personAccountRefundDetail(data).then(function(res){
						//('res'+JSON.stringify(res));
						if(res.result){
							_self.refund = res.data;
							
							if(_self.refund.refundChannel == 'wechat')
								_self.refund.refundChannelText = "微信"
							else if (_self.refund.refundChannel == 'alipay')
								_self.refund.refundChannelText = "支付宝"
								
								
							if(_self.refund.status == '0')
								_self.refund.statusText = "退款中"
							else if (_self.refund.status == '1')
								_self.refund.statusText = "退款成功"
							else if (_self.refund.status == '2')
								_self.refund.statusText = "退款拒绝"
							else if (_self.refund.status == '3')
								_self.refund.statusText = "退款失败"
						}
					},function(err){
						uni.showToast({
							title: err,
							icon: "none"
						})
						////('err'+JSON.stringify(err));
					})
					////('item'+JSON.stringify(item))
				
			}
		},
		onReady(){
			this.elderMode = this.carhelp.get('getElderModeClass') == '长辈模式';
			if(this.elderMode)
				this.theme('elder')
			else
				this.theme('standard')
		},
		methods: {
			theme(type) { 
			  if(type == 'elder')	
			  {
 				document.getElementsByTagName('body')[0].setAttribute('data-theme',type);
 				  
			  }
			  else
			  {
 				document.getElementsByTagName('body')[0].setAttribute('data-theme',type);
 				  
			  } 
			}
		}
	}
</script>

<style lang="scss" scoped> 
	@import "@/_theme.scss";
	.rechargeDet-head{
		background-color: #fff;
		padding: 48rpx 0;
		display: flex;
		flex-direction: column;
		align-items: center;
		.payPrice{
			display: flex;
			align-items: flex-end;
			justify-content: center;
			font{
				@include themeify{
					font-size:themed('font-size13'); 
					line-height:themed('font-size13'); 
				}
				/*
				font-size: 36px;
				line-height: 36px;*/
			}
		}
		p{
			color:#999;
			margin-top: 8rpx;
		}
	}
	.rechargeDet-main{
		background-color: #fff;
		padding-left: 32rpx;
		margin-top: 24rpx;
		.rechargeDet-list{
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 24rpx 32rpx 24rpx 0;
			border-bottom: 2rpx solid #f7f7f7;
			@include themeify{
				font-size:themed('font-size2'); 
 			}
			&:last-child{
				border-bottom: none;
			}
		}
	}
</style>