7 changed files with 314 additions and 11 deletions
-
6src/pages.json
-
3src/subpackage/wallet/js/api.js
-
15src/subpackage/wallet/pages/douyin_withdraw/index.vue
-
76src/subpackage/wallet/pages/index/index.vue
-
82src/subpackage/wallet/pages/index/modules/recharge_modal.vue
-
6src/subpackage/wallet/pages/index/modules/wallet_info.vue
-
137src/subpackage/wallet/pages/index/recharge_record.vue
@ -0,0 +1,82 @@ |
|||||
|
<template> |
||||
|
<wallet-modal title="充值" :show="isShow" @click:close="hide"> |
||||
|
<view class="recharge-container"> |
||||
|
<view class="rc-balance"> |
||||
|
<text class="rb-txt">钱包余额:</text> |
||||
|
{{ balance || 0 }}元 |
||||
|
</view> |
||||
|
<input type="digit" class="rc-ipt" v-model="iptNum" placeholder="请输入金额"> |
||||
|
<view class="rc-btns"> |
||||
|
<wm-button @click="hide">取消</wm-button> |
||||
|
<wm-button green @click="confirmBtn">确认</wm-button> |
||||
|
</view> |
||||
|
</view> |
||||
|
</wallet-modal> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import walletModal from '../../../components/wallet_modal.vue'; |
||||
|
import wmButton from '../../../components/wm_button.vue'; |
||||
|
import { showNone } from '@/utils/util'; |
||||
|
export default { |
||||
|
props: { |
||||
|
balance: { |
||||
|
type: Number, |
||||
|
default: 0 |
||||
|
} |
||||
|
}, |
||||
|
components: { |
||||
|
walletModal, |
||||
|
wmButton, |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
isShow: false, |
||||
|
iptNum: '', |
||||
|
initData: {}, |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
show(data){ |
||||
|
this.isShow = true; |
||||
|
this.initData = data ?? {}; |
||||
|
}, |
||||
|
hide(){ |
||||
|
this.isShow = false; |
||||
|
}, |
||||
|
confirmBtn(){ |
||||
|
let { initData, iptNum, hide } = this; |
||||
|
if(!iptNum || isNaN(iptNum) || Number(iptNum) <= 0)return showNone('请输入正确金额!'); |
||||
|
initData?.success?.(iptNum); |
||||
|
hide(); |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss"> |
||||
|
.recharge-container{ |
||||
|
padding: 0 50upx; |
||||
|
.rc-balance{ |
||||
|
margin-top: 60upx; |
||||
|
@include flcw(28upx, 40upx, $mColor); |
||||
|
@include tHide; |
||||
|
.rb-txt{ |
||||
|
color: #1A1A1A; |
||||
|
} |
||||
|
} |
||||
|
.rc-ipt{ |
||||
|
margin-top: 20upx; |
||||
|
padding: 0 20upx; |
||||
|
display: block; |
||||
|
height: 108upx; |
||||
|
border-radius: 10upx; |
||||
|
background: #F2F2F7; |
||||
|
@include flcw(32upx, 44upx, #1A1A1A); |
||||
|
} |
||||
|
.rc-btns{ |
||||
|
margin-top: 80upx; |
||||
|
@include ctf(space-between); |
||||
|
} |
||||
|
} |
||||
|
</style> |
@ -0,0 +1,137 @@ |
|||||
|
<template> |
||||
|
<view class="recharge-record"> |
||||
|
<filtrate-bar |
||||
|
:filter-list="['全部', '已完成', '已退款']" |
||||
|
ref="filtrateBar" |
||||
|
@change:times="timesChange" |
||||
|
@change:filter="filterBtn" |
||||
|
></filtrate-bar> |
||||
|
<view class="rr-ls"> |
||||
|
<view class="rl-item" v-for="(e, i) in rechargeList" :key="i"> |
||||
|
<record-line name="充值金额" :tag="getTagTxt(e.pay_status)" >{{ e.amount || 0 }}</record-line> |
||||
|
<record-line name="充值单号">{{ e.order_no || '-' }}</record-line> |
||||
|
<record-line name="充值时间">{{ e.pay_time || '-' }}</record-line> |
||||
|
<record-line name="支付方式">{{ e.pay_type || '-' }}</record-line> |
||||
|
<record-line name="交易流水号">{{ e.trans_no || '-' }}</record-line> |
||||
|
<record-line name="充值途径"> |
||||
|
{{ e.optsourse || '-' }} <block v-if="e.optname"> ({{ e.optname }}) </block> |
||||
|
</record-line> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import filtrateBar from '../../components/filtrate_bar.vue'; |
||||
|
import recordLine from '../../components/record_line.vue'; |
||||
|
import { WALLET_API } from '../../js/api'; |
||||
|
import servers from '../../js/server'; |
||||
|
import { routeTo, showLoad, hideLoad, debounce, showModal, showNone } from '@/utils/util'; |
||||
|
export default { |
||||
|
components: { |
||||
|
filtrateBar, |
||||
|
recordLine, |
||||
|
}, |
||||
|
data(){ |
||||
|
return { |
||||
|
rechargeList: [], |
||||
|
page: 1, |
||||
|
brand_id: '', |
||||
|
|
||||
|
stime: '', |
||||
|
etime: '', |
||||
|
status: '' // 0:未支付, 1:已支付, 2:已退款 |
||||
|
} |
||||
|
}, |
||||
|
onLoad(opts){ |
||||
|
let _bid = opts?.brand_id ?? ''; |
||||
|
this.brand_id = _bid; |
||||
|
let { startDate, endDate } = this.$refs.filtrateBar.getTimes(); |
||||
|
this.stime = startDate; |
||||
|
this.etime = endDate; |
||||
|
this.getRechargeList({ brand_id: _bid, stime: startDate, etime: endDate }); |
||||
|
}, |
||||
|
onReachBottom(){ |
||||
|
let { brand_id, page, stime, etime } = this; |
||||
|
this.getRechargeList({ brand_id, page: ++page, stime, etime }); |
||||
|
}, |
||||
|
methods: { |
||||
|
getTagTxt(status = ''){ |
||||
|
return status === 0 ? '未支付' : |
||||
|
status === 1 ? '已完成' : |
||||
|
status === 2 ? '已退款' : ''; |
||||
|
}, |
||||
|
timesChange(e){ |
||||
|
let { startDate, endDate } = e; |
||||
|
this.stime = startDate ?? ''; |
||||
|
this.etime = endDate ?? ''; |
||||
|
this.refreshLs(); |
||||
|
}, |
||||
|
filterBtn(idx) { |
||||
|
let _status = idx === 0 ? '' : idx; |
||||
|
this.status = _status; |
||||
|
this.refreshLs(); |
||||
|
}, |
||||
|
refreshLs(){ |
||||
|
let { brand_id, stime, etime, status } = this; |
||||
|
this.page = 1; |
||||
|
this.rechargeList = []; |
||||
|
this.getRechargeList({ |
||||
|
brand_id: brand_id, |
||||
|
pay_status: status, |
||||
|
stime, |
||||
|
etime, |
||||
|
}); |
||||
|
}, |
||||
|
// 获取充值记录 |
||||
|
getRechargeList({ brand_id, pay_status = '', stime = '', etime = '', page_size = 20, page = 1 }){ |
||||
|
showLoad(); |
||||
|
return servers.post({ |
||||
|
url: WALLET_API.rechargeList, |
||||
|
data: { brand_id, pay_status, stime, etime, page_size, page }, |
||||
|
isDefaultGet: false, |
||||
|
}) |
||||
|
.then(res => { |
||||
|
hideLoad(); |
||||
|
let _data = res?.data || {}; |
||||
|
if(_data.code === 0){ |
||||
|
let _ls = _data?.data?.list || []; |
||||
|
if(page === 1)return this.rechargeList = _ls; |
||||
|
if(_ls?.length <= 0)return showNone('没有更多!'); |
||||
|
this.rechargeList = [ ...this.rechargeList, ..._ls ]; |
||||
|
this.page = page; |
||||
|
}else{ |
||||
|
return Promise.reject(_data); |
||||
|
} |
||||
|
}) |
||||
|
.catch(err => { |
||||
|
hideLoad(); |
||||
|
showModal({ |
||||
|
title: '提示', |
||||
|
content: err.message || '加载失败!' |
||||
|
}) |
||||
|
console.warn('wallet index getPayInfo err --->', err); |
||||
|
// return Promise.reject(err); |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss"> |
||||
|
.recharge-record{ |
||||
|
|
||||
|
} |
||||
|
.rr-ls{ |
||||
|
padding: 24upx; |
||||
|
.rl-item{ |
||||
|
padding: 26upx 20upx; |
||||
|
border-radius: 10upx; |
||||
|
background: #fff; |
||||
|
&+ .rl-item{ |
||||
|
margin-top: 24upx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
Write
Preview
Loading…
Cancel
Save
Reference in new issue