first
This commit is contained in:
147
pages/memberCenter/rechargeRecord/detail.vue
Normal file
147
pages/memberCenter/rechargeRecord/detail.vue
Normal file
@@ -0,0 +1,147 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<view class="mbr-info">
|
||||
<image :src="vdata.record.avatarUrl" />
|
||||
<text class="mbr-info-name">{{ vdata.record.mbrName }}</text>
|
||||
<text class="mbr-info-amount">{{ '+' + cal.cert2Dollar(vdata.record.entryAmount) }}</text>
|
||||
</view>
|
||||
<view class="account-line"></view>
|
||||
<view class="account-history">
|
||||
<view class="account-history-item"><text>充值状态</text>
|
||||
<text class="order-text">{{ datamap.rechargeRecordImage(vdata.record.state).text }}</text>
|
||||
</view>
|
||||
<view class="account-history-item">
|
||||
<text>充值订单号</text>
|
||||
<text>{{ vdata.record.rechargeRecordId }}
|
||||
<text class="info-copy" @tap="copyInfo(vdata.record.rechargeRecordId)">复制</text>
|
||||
</text>
|
||||
</view>
|
||||
<view class="account-history-item"><text>会员ID</text><text>{{ vdata.record.mbrId }}</text></view>
|
||||
<view class="account-history-item"><text>会员手机号</text><text>{{ vdata.record.mbrTel }}</text></view>
|
||||
<view class="account-history-item"><text>支付金额</text><text>￥{{ cal.cert2Dollar(vdata.record.payAmount) }}</text></view>
|
||||
<view class="account-history-item"><text>赠送金额</text><text>￥{{ cal.cert2Dollar(vdata.record.giveAmount) }}</text></view>
|
||||
<view class="account-history-item"><text>到账金额</text><text>￥{{ cal.cert2Dollar(vdata.record.entryAmount) }}</text></view>
|
||||
<view v-if="vdata.record.payOrderId" class="account-history-item">
|
||||
<text>支付订单号</text>
|
||||
<text>{{ vdata.record.payOrderId }}
|
||||
<text class="info-copy" @tap="copyInfo(vdata.record.payOrderId)">复制</text>
|
||||
</text>
|
||||
</view>
|
||||
<view class="account-history-item"><text>异步通知地址</text><text>{{ vdata.record.notifyUrl }}</text></view>
|
||||
<view class="account-history-item"><text>创建时间</text><text>{{ vdata.record.createdAt }}</text></view>
|
||||
<view class="account-history-item"><text>支付成功时间</text><text>{{ vdata.record.successTime }}</text></view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref } from 'vue'
|
||||
import { onLoad, onUnload } from '@dcloudio/uni-app'
|
||||
import { reqLoad, API_URL_MEMBER_RECHARGE_RECORDS } from '@/http/apiManager.js'
|
||||
import infoBox from '@/commons/utils/infoBox.js';
|
||||
import cal from '@/commons/utils/cal.js'
|
||||
import go from '@/commons/utils/go.js'
|
||||
import emit from '@/commons/utils/emit.js'
|
||||
import ent from '@/commons/utils/ent.js'
|
||||
import datamap from '@/commons/utils/datamap.js'
|
||||
|
||||
onLoad((options) => {
|
||||
refData(options.rechargeRecordId)
|
||||
})
|
||||
|
||||
const vdata = reactive({
|
||||
record : { }
|
||||
})
|
||||
|
||||
// 监听 更新事件
|
||||
onUnload(() => uni.$off(emit.ENAME_REF_MEMBER_RECHARGE_RECORD_DETAIL))
|
||||
uni.$on(emit.ENAME_REF_MEMBER_RECHARGE_RECORD_DETAIL, function(data){
|
||||
refData(vdata.record.rechargeRecordId)
|
||||
})
|
||||
|
||||
function refData(rechargeRecordId){
|
||||
reqLoad.getById(API_URL_MEMBER_RECHARGE_RECORDS, rechargeRecordId).then(({bizData}) => {
|
||||
vdata.record = bizData
|
||||
})
|
||||
}
|
||||
|
||||
const copyInfo = (val) => {
|
||||
uni.setClipboardData({ data: val}).then(() => {
|
||||
infoBox.showSuccessToast('复制成功')
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.content {
|
||||
width: 630rpx;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.mbr-info {
|
||||
height: 376rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.mbr-info-name {
|
||||
padding-top: 10rpx;
|
||||
color: #828282ff;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
.mbr-info-amount {
|
||||
padding-top: 10rpx;
|
||||
color: #000000ff;
|
||||
font-size: 50rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
.account-line {
|
||||
border-bottom: 1rpx solid #0000001a;
|
||||
}
|
||||
.account-history {
|
||||
padding-top: 60rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: flex-start;
|
||||
|
||||
.account-history-item {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-start;
|
||||
opacity: 1;
|
||||
padding: 13rpx 0 12rpx;
|
||||
|
||||
text:first-child {
|
||||
width: 180rpx;
|
||||
color: #999999;
|
||||
font-size: 26rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
text:nth-child(2) {
|
||||
width: 450rpx;
|
||||
word-break: break-all;
|
||||
color: #000000;
|
||||
font-size: 26rpx;
|
||||
font-weight: 400;
|
||||
|
||||
.info-copy {
|
||||
padding-left: 20rpx;
|
||||
color: #2d6dccff;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
116
pages/memberCenter/rechargeRecord/index.vue
Normal file
116
pages/memberCenter/rechargeRecord/index.vue
Normal file
@@ -0,0 +1,116 @@
|
||||
<template>
|
||||
<view class="page-wrapper">
|
||||
<JeepayCustomNavbar title="红包记录" backCtrl="back" />
|
||||
|
||||
<!-- 搜索 -->
|
||||
<JSearchTitle place="搜索手机号、会员名称" @click="go.toSearchPage('memberRechargeRecord')">
|
||||
<template #right>
|
||||
<JeepaySearchSelect v-model:bizType="vdata.searchData.state" :list="vdata.searchParamsList" title="按充值状态筛选" @change="refTable"/>
|
||||
</template>
|
||||
</JSearchTitle>
|
||||
|
||||
<!-- 数据列表 -->
|
||||
<JeepayTableList ref="jeepayTableListRef" :searchData="vdata.searchData" :reqTableDataFunc="reqTableDataFunc">
|
||||
<template #tableBody="{ record }">
|
||||
<MemberRechargeRecordRender :record="record" />
|
||||
</template>
|
||||
</JeepayTableList>
|
||||
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
|
||||
<script setup>
|
||||
import { nextTick, reactive, ref } from "vue"
|
||||
import { onReachBottom, onShow, onUnload } from '@dcloudio/uni-app'
|
||||
import go from '@/commons/utils/go.js'
|
||||
import emit from '@/commons/utils/emit.js'
|
||||
import { reqLoad, API_URL_MEMBER_RECHARGE_RECORDS } from "@/http/apiManager.js"
|
||||
import MemberRechargeRecordRender from '@/pages/list/render/MemberRechargeRecordRender.vue'
|
||||
|
||||
const jeepayTableListRef = ref()
|
||||
|
||||
onReachBottom(() => { })
|
||||
|
||||
const vdata = reactive({
|
||||
searchData: { state: '' },
|
||||
searchParamsList: [
|
||||
{ label: '全部充值状态', value: '' },
|
||||
{ label: '初始化', value: '0' },
|
||||
{ label: '充值中', value: '1' },
|
||||
{ label: '充值成功', value: '2' },
|
||||
{ label: '充值失败', value: '3' }
|
||||
]
|
||||
})
|
||||
|
||||
// // 监听 更新事件
|
||||
onUnload(() => uni.$off(emit.ENAME_REF_MEMBER_RECHARGE_RECORD_LIST))
|
||||
uni.$on(emit.ENAME_REF_MEMBER_RECHARGE_RECORD_LIST, function(data){
|
||||
jeepayTableListRef.value.refTable(true)
|
||||
})
|
||||
|
||||
function refTable (e) {
|
||||
jeepayTableListRef.value.refTable(true)
|
||||
}
|
||||
|
||||
// 请求
|
||||
function reqTableDataFunc (params) {
|
||||
return reqLoad.list(API_URL_MEMBER_RECHARGE_RECORDS, params)
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.sta-input {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 30rpx;
|
||||
height: 110rpx;
|
||||
background-color: $J-bg-ff;
|
||||
.input-main {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 70rpx;
|
||||
background-color: $J-bg-f5;
|
||||
border-radius: $J-b-r12;
|
||||
color: rgba(0, 0, 0, 0.35);
|
||||
font-size: 27rpx;
|
||||
font-weight: 400;
|
||||
image {
|
||||
padding: 22rpx;
|
||||
width: 26rpx;
|
||||
height: 26rpx;
|
||||
}
|
||||
}
|
||||
.icon-more {
|
||||
margin-left: 30rpx;
|
||||
width: 70rpx;
|
||||
height: 70rpx;
|
||||
}
|
||||
}
|
||||
.footer-wrapper {
|
||||
height: 170rpx;
|
||||
background-color: transparent;
|
||||
.footer-button {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
padding: 30rpx;
|
||||
button {
|
||||
height: 110rpx;
|
||||
font-size: 33rpx;
|
||||
font-weight: 500;
|
||||
color: $J-color-tff;
|
||||
border-radius: 20rpx;
|
||||
background: $jeepay-bg-primary;
|
||||
}
|
||||
.hover-button {
|
||||
opacity: 0.5;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user