hly
/
pay-video-applet-uniapp-24-8-22
1
0
Fork 0
Code Issues 0 Pull Requests 0 Projects 0 Releases 0 Wiki Activity
Browse Source

上传代码

master
前端-胡立永 11 months ago
parent
7f7abaa079
commit
e0646253b0
7 changed files with 727 additions and 649 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +1
    -1
      api/api.js
  2. +3
    -0
      config.js
  3. +70
    -0
      mixins/list.js
  4. +82
    -96
      pages_mine/mine/incomeRecord.vue
  5. +269
    -260
      pages_mine/mine/purse.vue
  6. +162
    -165
      pages_mine/mine/withdraw.vue
  7. +140
    -127
      pages_mine/mine/withdrawalRecord.vue

+ 1
- 1
api/api.js View File

@ -208,7 +208,7 @@ const config = {
// 用户提现 // 用户提现
infoWithdraw: { infoWithdraw: {
url: '/api/info/withdraw', url: '/api/info/withdraw',
method: 'POST',
method: 'GET',
auth: true, auth: true,
showLoading : true, showLoading : true,
}, },


+ 3
- 0
config.js View File

@ -14,6 +14,9 @@ const config = {
// baseUrl : 'http://8.138.162.67:8000/a-notice-api', // baseUrl : 'http://8.138.162.67:8000/a-notice-api',
baseUrl : 'http://h5.xzaiyp.top/a-notice-api', baseUrl : 'http://h5.xzaiyp.top/a-notice-api',
}, },
test2 : {
baseUrl : 'http://test-lzx.natapp1.cc/a-notice-api',
},
test : { test : {
baseUrl : 'https://admin.anqi.shop/a-notice-api', baseUrl : 'https://admin.anqi.shop/a-notice-api',
}, },


+ 70
- 0
mixins/list.js View File

@ -0,0 +1,70 @@
function query(self, queryParams){
// return (self.beforeGetData && self.beforeGetData()) ||
// queryParams || self.queryParams
// 深度合并对象
return self.$utils.deepMergeObject(
self.$utils.deepMergeObject(self.queryParams,
(self.beforeGetData && self.beforeGetData()) || {}),
queryParams)
}
export default {
data() {
return {
queryParams: {
pageNo: 1,
pageSize: 10,
},
total : 0,
list : [],
}
},
onPullDownRefresh() {
this.getData()
},
onReachBottom() {
this.loadMoreData()
},
onShow() {
this.getData()
},
methods: {
getData(queryParams){
return new Promise((success, error) => {
if(!this.mixinsListApi){
return console.error('mixinsListApi 缺失');
}
this.$api(this.mixinsListApi,
query(this, queryParams), res => {
uni.stopPullDownRefresh()
if(res.code == 200){
this.getDataThen && this.getDataThen(res.result.records, res.result.total, res.result)
success(res.result)
this[this.mixinsListKey || 'list'] = res.result.records
this.total = res.result.total
}
})
})
},
loadMoreData(){
console.log('loadMoreData----', this.queryParams.pageSize < this.total);
if(this.queryParams.pageSize < this.total){
this.queryParams.pageSize += 10
this.getData()
}
},
}
}

+ 82
- 96
pages_mine/mine/incomeRecord.vue View File

@ -1,103 +1,89 @@
<template> <template>
<view class="incomeRecord">
<!--顶部导航栏-->
<navbar leftClick @leftClick="$utils.navigateBack" title="收益记录"/>
<!--内容区域-->
<view class="content">
<view class="title">收益记录</view>
<view class="list">
<view class="item" v-for="(item,index) in list" :key="index">
<view class="left">
<image src="../static/incomeRecord/1.png" style="width: 70%;height: 70%;"></image>
</view>
<view class="center">
<view>{{ item.userId }}</view>
<view>{{ item.createTime }}</view>
</view>
<view class="right">
<view>收益金额</view>
<view>￥{{item.price}}</view>
</view>
</view>
</view>
</view>
</view>
<view class="incomeRecord">
<!--顶部导航栏-->
<navbar leftClick @leftClick="$utils.navigateBack" title="收益记录" />
<!--内容区域-->
<view class="content">
<view class="title">收益记录</view>
<view class="list">
<view class="item" v-for="(item,index) in list" :key="index">
<view class="left">
<image src="../static/incomeRecord/1.png" style="width: 70%;height: 70%;"></image>
</view>
<view class="center">
<view>{{ item.userId }}</view>
<view>{{ item.createTime }}</view>
</view>
<view class="right">
<view>收益金额</view>
<view>￥{{item.price}}</view>
</view>
</view>
</view>
</view>
</view>
</template> </template>
<script> <script>
export default {
data() {
return {
list: [],
queryParams: {
pageNo: 1,
pageSize: 10,
},
};
},
mounted() {
this.getData()
},
methods: {
getData() {
this.$api('infoGetIncomePage', {
pageNo: this.queryParams.pageNo,
pageSize: this.queryParams.pageSize,
}, res => {
if (res.code == 200) {
this.list = res.result.records
}
})
},
}
}
import mixinsList from '@/mixins/list.js'
export default {
mixins: [mixinsList],
data() {
return {
mixinsListApi : 'infoGetIncomePage',
};
},
mounted() {
this.getData()
},
methods: {
}
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.incomeRecord {
.content {
padding: 0 40rpx;
height: calc(100vh - 240rpx);
.title {
font-weight: bold;
margin-top: 5%;
}
.list {
padding-top: 50rpx;
.item {
display: flex;
gap: 20rpx;
//height: 80rpx;
margin-bottom: 40rpx;
.left {
display: flex;
justify-content: center;
align-items: flex-start;
width: 15%;
}
.center {
width: 60%;
}
.right {
width: 30%;
text-align: center;
}
}
}
}
}
</style>
.incomeRecord {
.content {
padding: 0 40rpx;
.title {
font-weight: bold;
margin-top: 5%;
}
.list {
padding-top: 50rpx;
.item {
display: flex;
gap: 20rpx;
//height: 80rpx;
margin-bottom: 40rpx;
.left {
display: flex;
justify-content: center;
align-items: flex-start;
width: 15%;
}
.center {
width: 60%;
}
.right {
width: 30%;
text-align: center;
}
}
}
}
}
</style>

+ 269
- 260
pages_mine/mine/purse.vue View File

@ -1,268 +1,277 @@
<template> <template>
<view class="purse">
<!--顶部导航栏-->
<navbar leftClick @leftClick="$utils.navigateBack" title="我的钱包"/>
<!--内容区-->
<view class="content">
<!--上部分-->
<view class="content-top">
<view class="aaa">
<view class="top">￥{{ money.money }}</view>
<view class="bottom">可提现金额</view>
</view>
<view class="b">
<view class="bb">
<view class="top">今日收益</view>
<view class="bottom">￥{{ money.todayMoney }}</view>
</view>
<view class="bb">
<view class="top">累计收益</view>
<view class="bottom">￥{{ money.userSumMoney }}</view>
</view>
<view class="bb">
<view class="top">已提现</view>
<view class="bottom">￥{{ money.userMoney }}</view>
</view>
</view>
</view>
<!--下部分-->
<view class="content-bottom">
<view class="card-record">银行卡</view>
<!--具体银行卡-->
<view class="cards" >
<view class="cardItem" v-for="(item, index) in list" :key="index">
<view class="cardImage">
<image src="https://tennis-oss.xzaiyp.top/2024-09-09/85fe8ad3-5094-473f-b184-ef4cf5c1db6e.svg" style="width: 100%;height: 100%;"></image>
<!-- <image src="../static/addBankCard/1.svg" style="width: 100%;height: 100%;"></image> -->
</view>
<view class="cardInfo">
<view class="cardNum">
{{ item.bankId }}
</view>
<view class="cardName">
{{ item.bankAddress }}
</view>
</view>
<view class="cardIcon">
<!-- <image src="../static/purse/1.svg" style="width: 70%;height: 70%;"></image> -->
</view>
</view>
</view>
</view>
</view>
<!--收益记录和去提现-->
<span class="income-record" @click="gotoIncomeRecordPage">收益记录</span>
<!--去提现按钮-->
<button @click="gotoWithdrawPage" class="bottomBtn">
去提现
</button>
</view>
<view class="purse">
<!--顶部导航栏-->
<navbar leftClick @leftClick="$utils.navigateBack" title="我的钱包" />
<!--内容区-->
<view class="content">
<!--上部分-->
<view class="content-top">
<view class="aaa">
<view class="top">￥{{ money.money }}</view>
<view class="bottom">可提现金额</view>
</view>
<view class="b">
<view class="bb">
<view class="top">今日收益</view>
<view class="bottom">￥{{ money.todayMoney }}</view>
</view>
<view class="bb">
<view class="top">累计收益</view>
<view class="bottom">￥{{ money.userSumMoney }}</view>
</view>
<view class="bb">
<view class="top">已提现</view>
<view class="bottom">￥{{ money.userMoney }}</view>
</view>
</view>
</view>
<!--下部分-->
<view class="content-bottom">
<view class="card-record">银行卡</view>
<!--具体银行卡-->
<view class="cards">
<view class="cardItem" v-for="(item, index) in list" :key="index">
<view class="cardImage">
<image
src="https://tennis-oss.xzaiyp.top/2024-09-09/85fe8ad3-5094-473f-b184-ef4cf5c1db6e.svg"
style="width: 100%;height: 100%;"></image>
<!-- <image src="../static/addBankCard/1.svg" style="width: 100%;height: 100%;"></image> -->
</view>
<view class="cardInfo">
<view class="cardNum">
{{ item.bankId }}
</view>
<view class="cardName">
{{ item.bankAddress }}
</view>
</view>
<view class="cardIcon">
<!-- <image src="../static/purse/1.svg" style="width: 70%;height: 70%;"></image> -->
</view>
</view>
</view>
</view>
</view>
<!--收益记录和去提现-->
<span class="income-record"
style="bottom: 220rpx;"
@click="$utils.navigateTo('/pages_mine/mine/withdrawalRecord')">提现记录</span>
<span class="income-record" @click="gotoIncomeRecordPage">收益记录</span>
<!--去提现按钮-->
<button @click="gotoWithdrawPage" class="bottomBtn">
去提现
</button>
</view>
</template> </template>
<script> <script>
import '../../common.css'; // 引入公共 CSS 文件
export default {
data() {
return {
queryParams: {
pageNo: 1,
pageSize: 10
import '../../common.css'; // 引入公共 CSS 文件
export default {
data() {
return {
queryParams: {
pageNo: 1,
pageSize: 10
},
total: 0,
list: [],
money: {}
};
}, },
total : 0,
list : [],
money : {}
};
},
onShow() {
this.getData()
this.infoGetInfoMoney()
},
//滚动到屏幕底部
// onReachBottom() {
// console.log(1111111);
// if(this.queryParams.pageSize < this.total){
// this.queryParams.pageSize += 10
// this.getData()
// }
// },
methods: {
// 跳转到收益记录页面
gotoIncomeRecordPage() {
uni.navigateTo({
url: '/pages_mine/mine/incomeRecord'
});
},
// 跳转到提现页面
gotoWithdrawPage() {
uni.navigateTo({
url:'/pages_mine/mine/withdraw'
})
},
getData(){
this.$api('infoGetBankCardPage', res => {
if(res.code == 200){
this.list = res.result ? [res.result] : []
}
})
},
infoGetInfoMoney(){
this.$api('infoGetInfoMoney', res => {
if(res.code == 200){
this.money = res.result
}
})
},
}
}
onShow() {
this.getData()
this.infoGetInfoMoney()
},
//滚动到屏幕底部
// onReachBottom() {
// console.log(1111111);
// if(this.queryParams.pageSize < this.total){
// this.queryParams.pageSize += 10
// this.getData()
// }
// },
methods: {
// 跳转到收益记录页面
gotoIncomeRecordPage() {
uni.navigateTo({
url: '/pages_mine/mine/incomeRecord'
});
},
// 跳转到提现页面
gotoWithdrawPage() {
uni.navigateTo({
url: '/pages_mine/mine/withdraw'
})
},
getData() {
this.$api('infoGetBankCardPage', res => {
if (res.code == 200) {
this.list = res.result ? [res.result] : []
}
})
},
infoGetInfoMoney() {
this.$api('infoGetInfoMoney', res => {
if (res.code == 200) {
this.money = res.result
}
})
},
}
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.purse {
.content {
.content-top {
display: flex;
flex-direction: column;
align-items: center;
padding-top: 60rpx;
padding-bottom: 40rpx;
background-color: #f8faff;
height: 18vh;
.aaa {
color: #000000;
.top {
font-size: 50rpx;
}
.bottom {
font-size: 28rpx;
display: flex;
justify-content: center;
align-items: center;
}
}
.b {
display: flex;
justify-content: center;
align-items: center;
gap: 100rpx;
width: 100%;
margin: 30rpx 40rpx 0 40rpx;
color: #4b4b4d;
.bb {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 10px;
}
}
}
.content-bottom {
border-radius: 50rpx 50rpx 0 0;
box-shadow: 0 -10rpx 10rpx rgba(0, 0, 0, 0.2); /* 仅上边的阴影效果 */
background-color: #fff;
overflow: auto;
height: calc(82vh - 240rpx);
width: 100vw;
.card-record {
font-size: 34rpx;
padding: 40rpx 0 0 40rpx;
}
.cards {
display: flex;
flex-direction: column;
gap: 20rpx;
//width: 100vw;
padding: 40rpx;
.cardItem {
display: flex;
gap: 20rpx;
height: 100rpx;
//border: 1px solid red;
//width: 100vw;
.cardImage {
width: 30%;
//height: 100%;
}
.cardInfo {
display: flex;
flex-direction: column;
justify-content: space-evenly;
gap: 6rpx;
width: 60%;
.cardName {
font-size: 28rpx;
color: #8f92a1;
}
.cardNum {
font-size: 24rpx;
color: #000000;
}
}
.cardIcon {
width: 10%;
}
}
}
}
}
.withdraw-button {
position: fixed;
bottom: 80rpx;
left: 16px; // 与页面左边保持一定距离
right: 16px; // 与页面右边保持一定距离
background: $uni-linear-gradient-btn-color; // 按钮背景渐变
color: white; // 按钮文字颜色
text-align: center; // 文字居中
padding: 10px 0; // 内边距，增加按钮的高度
font-size: 18px; // 按钮文字大小
z-index: 1000; // 确保按钮位于其他内容的上方
display: flex;
justify-content: center;
align-items: center;
width: 50%;
height: 80rpx;
border-radius: 10rpx;
}
.income-record {
position: fixed;
bottom: 160rpx;
right: 40%;
margin-bottom: 40rpx;
background: $uni-linear-gradient-color;
-webkit-background-clip: text; /*将设置的背景颜色限制在文字中*/
-webkit-text-fill-color: transparent; /*给文字设置成透明*/
}
}
</style>
.purse {
.content {
.content-top {
display: flex;
flex-direction: column;
align-items: center;
padding-top: 60rpx;
padding-bottom: 40rpx;
background-color: #f8faff;
height: 18vh;
.aaa {
color: #000000;
.top {
font-size: 50rpx;
}
.bottom {
font-size: 28rpx;
display: flex;
justify-content: center;
align-items: center;
}
}
.b {
display: flex;
justify-content: center;
align-items: center;
gap: 100rpx;
width: 100%;
margin: 30rpx 40rpx 0 40rpx;
color: #4b4b4d;
.bb {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 10px;
}
}
}
.content-bottom {
border-radius: 50rpx 50rpx 0 0;
box-shadow: 0 -10rpx 10rpx rgba(0, 0, 0, 0.2);
/* 仅上边的阴影效果 */
background-color: #fff;
overflow: auto;
height: calc(82vh - 240rpx);
width: 100vw;
.card-record {
font-size: 34rpx;
padding: 40rpx 0 0 40rpx;
}
.cards {
display: flex;
flex-direction: column;
gap: 20rpx;
//width: 100vw;
padding: 40rpx;
.cardItem {
display: flex;
gap: 20rpx;
height: 100rpx;
//border: 1px solid red;
//width: 100vw;
.cardImage {
width: 30%;
//height: 100%;
}
.cardInfo {
display: flex;
flex-direction: column;
justify-content: space-evenly;
gap: 6rpx;
width: 60%;
.cardName {
font-size: 28rpx;
color: #8f92a1;
}
.cardNum {
font-size: 24rpx;
color: #000000;
}
}
.cardIcon {
width: 10%;
}
}
}
}
}
.withdraw-button {
position: fixed;
bottom: 80rpx;
left: 16px; // 与页面左边保持一定距离
right: 16px; // 与页面右边保持一定距离
background: $uni-linear-gradient-btn-color; // 按钮背景渐变
color: white; // 按钮文字颜色
text-align: center; // 文字居中
padding: 10px 0; // 内边距，增加按钮的高度
font-size: 18px; // 按钮文字大小
z-index: 1000; // 确保按钮位于其他内容的上方
display: flex;
justify-content: center;
align-items: center;
width: 50%;
height: 80rpx;
border-radius: 10rpx;
}
.income-record {
position: fixed;
bottom: 160rpx;
right: 40%;
margin-bottom: 40rpx;
background: $uni-linear-gradient-color;
-webkit-background-clip: text;
/*将设置的背景颜色限制在文字中*/
-webkit-text-fill-color: transparent;
/*给文字设置成透明*/
}
}
</style>

+ 162
- 165
pages_mine/mine/withdraw.vue View File

@ -1,172 +1,169 @@
<template> <template>
<view class="withdraw">
<!--顶部导航栏-->
<navbar leftClick @leftClick="$utils.navigateBack" title="提现"/>
<!--内容区-->
<view class="content">
<!--上部分-->
<view class="content-top">
<view class="aaa">
<view class="top">￥{{money.money}}</view>
<view class="bottom">可提现金额</view>
</view>
</view>
<!--下部分-->
<view class="content-bottom">
<view class="inputComponent">
<view class="left">填写提现金额</view>
<view class="centerAndRight">
<view class="center">
<uv-input placeholder="输入金额" v-model="withdrawMoney"
border="none" @change="moneyChange"></uv-input>
</view>
<view class="right" @click="withdrawMoney = money.money">全部提现</view>
</view>
</view>
</view>
</view>
<!--提现按钮-->
<button @click="withdrawPage" class="bottomBtn">
提现
</button>
</view>
<view class="withdraw">
<!--顶部导航栏-->
<navbar leftClick @leftClick="$utils.navigateBack" title="提现" />
<!--内容区-->
<view class="content">
<!--上部分-->
<view class="content-top">
<view class="aaa">
<view class="top">￥{{money.money}}</view>
<view class="bottom">可提现金额</view>
</view>
</view>
<!--下部分-->
<view class="content-bottom">
<view class="inputComponent">
<view class="left">填写提现金额</view>
<view class="centerAndRight">
<view class="center">
<uv-input placeholder="输入金额" v-model="withdrawMoney" type="number" border="none"></uv-input>
</view>
<view class="right" @click="withdrawMoney = money.money">全部提现</view>
</view>
</view>
</view>
</view>
<!--提现按钮-->
<button @click="withdrawPage" class="bottomBtn">
提现
</button>
</view>
</template> </template>
<script> <script>
import '../../common.css'; // 引入公共 CSS 文件
export default {
data() {
return {
withdrawMoney: "",
money: null,
};
},
onShow() {
this.infoGetInfoMoney()
},
methods: {
// 金额发生变化
moneyChange(e) {
console.log(e)
this.withdrawMoney = e
},
infoGetInfoMoney(){
this.$api('infoGetInfoMoney', res => {
if(res.code == 200){
this.money = res.result
}
})
},
// 提现
withdrawPage() {
this.$api('infoWithdraw', {
withdrawMoney: this.withdrawMoney
}, res => {
if (res.code == 200) {
uni.navigateTo({
url: '/pages_mine/mine/withdrawalRecord'
});
// this.$utils.navigateTo('/pages_mine/mine/withdrawalRecord');
}
})
}
}
}
import '../../common.css'; // 引入公共 CSS 文件
export default {
data() {
return {
withdrawMoney: "",
money: {},
};
},
onShow() {
this.infoGetInfoMoney()
},
methods: {
infoGetInfoMoney() {
this.$api('infoGetInfoMoney', res => {
if (res.code == 200) {
this.money = res.result
}
})
},
// 提现
withdrawPage() {
this.$api('infoWithdraw', {
money: this.withdrawMoney
}, res => {
if (res.code == 200) {
uni.navigateTo({
url: '/pages_mine/mine/withdrawalRecord'
});
// this.$utils.navigateTo('/pages_mine/mine/withdrawalRecord');
}
})
}
}
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.withdraw {
.content {
.content-top {
display: flex;
flex-direction: column;
align-items: center;
padding-top: 60rpx;
background-color: #f8faff;
height: 10vh;
.aaa {
color: #000000;
.top {
font-size: 50rpx;
}
.bottom {
font-size: 14px;
display: flex;
justify-content: center;
align-items: center;
}
}
}
.content-bottom {
border-radius: 50rpx 50rpx 0 0;
box-shadow: 0 -10rpx 10rpx rgba(0, 0, 0, 0.2); /* 仅上边的阴影效果 */
background-color: #fff;
height: calc(90vh - 240rpx);
//width: 100vw;
padding: 40rpx;
.inputComponent {
display: flex;
//gap: 20rpx;
//border: 1px solid red;
.left {
display: flex;
justify-content: flex-start;
align-items: center;
font-size: 30rpx;
width: 50%;
margin-right: 20rpx;
}
.centerAndRight {
display: flex;
width: 50%;
.center {
width: 60%;
}
.right {
display: flex;
justify-content: flex-end;
align-items: center;
font-size: 32rpx;
margin-left: 20rpx;
width: 40%;
background: $uni-linear-gradient-color;
-webkit-background-clip: text; /*将设置的背景颜色限制在文字中*/
-webkit-text-fill-color: transparent; /*给文字设置成透明*/
}
}
}
}
}
}
</style>
.withdraw {
.content {
.content-top {
display: flex;
flex-direction: column;
align-items: center;
padding-top: 60rpx;
background-color: #f8faff;
height: 10vh;
.aaa {
color: #000000;
.top {
font-size: 50rpx;
}
.bottom {
font-size: 14px;
display: flex;
justify-content: center;
align-items: center;
}
}
}
.content-bottom {
border-radius: 50rpx 50rpx 0 0;
box-shadow: 0 -10rpx 10rpx rgba(0, 0, 0, 0.2);
/* 仅上边的阴影效果 */
background-color: #fff;
height: calc(90vh - 240rpx);
//width: 100vw;
padding: 40rpx;
.inputComponent {
display: flex;
//gap: 20rpx;
//border: 1px solid red;
.left {
display: flex;
justify-content: flex-start;
align-items: center;
font-size: 30rpx;
width: 50%;
margin-right: 20rpx;
}
.centerAndRight {
display: flex;
width: 60%;
.center {
width: 60%;
}
.right {
display: flex;
justify-content: flex-end;
align-items: center;
font-size: 32rpx;
margin-left: 20rpx;
width: 40%;
background: $uni-linear-gradient-color;
-webkit-background-clip: text;
/*将设置的背景颜色限制在文字中*/
-webkit-text-fill-color: transparent;
/*给文字设置成透明*/
}
}
}
}
}
}
</style>

+ 140
- 127
pages_mine/mine/withdrawalRecord.vue View File

@ -1,135 +1,148 @@
<template> <template>
<view class="withdrawalRecord">
<!--顶部导航栏-->
<navbar leftClick @leftClick="$utils.navigateBack" title="提现记录"/>
<!--提现记录页面-->
<view class="content">
<view class="list" v-for="(item,index) in list ">
<!--第一行-->
<view class="item1">
<view class="left">提现金额</view>
<view class="right">
<view class="money">￥{{ item.price }}</view>
<view :class="item.type==1 ? 'yiDaoZhangClass' : 'shenHeClass'">{{ item.type==1 ? '已到账' : '审核中' }}</view>
</view>
</view>
<!--第二行-->
<view class="item2">
<view class="left">申请时间</view>
<view class="right">{{ item.createTime }}</view>
</view>
<!--第三行-->
<view class="item2">
<view class="left">到账时间</view>
<view class="right">{{ item.successTime }}</view>
</view>
</view>
</view>
</view>
<view class="withdrawalRecord">
<!--顶部导航栏-->
<navbar leftClick @leftClick="$utils.navigateBack" title="提现记录" />
<!--提现记录页面-->
<view class="content">
<view class="list" :key="item.id" v-for="(item,index) in list ">
<!--第一行-->
<view class="item1">
<view class="left">提现金额</view>
<view class="right">
<view class="money">￥{{ item.price }}</view>
<view :class="stateClass[item.state]">
{{ state[item.state] }}
</view>
</view>
</view>
<!--第二行-->
<view class="item1">
<view class="left">申请时间</view>
<view class="right">
<view class="">
{{ item.createTime }}
</view>
<view class="btn"
@click="requestMerchantTransfer(item)"
v-if="item.state == 1 && item.type == 1">
领取
</view>
</view>
</view>
<!--第三行-->
<view class="item1"
v-if="item.successTime">
<view class="left">到账时间</view>
<view class="right">{{ item.successTime }}</view>
</view>
</view>
</view>
</view>
</template> </template>
<script> <script>
export default {
data() {
return {
list: [],
queryParams: {
pageNo: 1,
pageSize: 10,
},
};
},
mounted() {
this.getData()
},
methods: {
getData() {
this.$api('infoGetWithdrawPage', {
pageNo: this.queryParams.pageNo,
pageSize: this.queryParams.pageSize,
}, res => {
if (res.code == 200) {
this.list = res.result.records
}
})
},
}
}
import mixinsList from '@/mixins/list.js'
export default {
mixins: [mixinsList],
data() {
return {
mixinsListApi: 'infoGetWithdrawPage',
state : ['审核中', '待领取', '已到账'],
stateClass : ['shenHeClass', 'yiDaoZhangClass', 'yiDaoZhangClass'],
};
},
methods: {
requestMerchantTransfer(item) {
if (!wx.canIUse('requestMerchantTransfer')) {
wx.showModal({
content: '你的微信版本过低，请更新至最新版本。',
showCancel: false,
});
return
}
wx.requestMerchantTransfer({
mchId: '1684030364',
appId: wx.getAccountInfoSync().miniProgram.appId,
package: item.packageInfo,
success: (res) => {
// res.err_msg将在页面展示成功后返回应用时返回ok，并不代表付款成功
console.log('success:', res);
},
fail: (res) => {
console.log('fail:', res);
},
});
},
}
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
.withdrawalRecord {
background-color: #f8faff;
height: calc(100vh - 240rpx);
width: 100vw;
.content {
padding: 20rpx 20rpx 50rpx 20rpx;
box-sizing: border-box;
width: 100vw;
.list {
box-sizing: border-box;
border-bottom: 2rpx solid #e0e2e6;
padding: 30rpx;
display: flex;
flex-direction: column;
gap: 10rpx;
.item1 {
display: flex;
.left {
width: 30%;
}
.right {
display: flex;
width: 70%;
.money {
width: 75%;
}
.yiDaoZhangClass {
width: 25%;
background: $uni-linear-gradient-color;
-webkit-background-clip: text;
/*将设置的背景颜色限制在文字中*/
-webkit-text-fill-color: transparent;
/*给文字设置成透明*/
}
.shenHeClass {
width: 25%;
}
}
}
.item2 {
display: flex;
.left {
width: 30%;
}
.right {
width: 70%;
}
}
}
}
}
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
.withdrawalRecord {
background-color: #f8faff;
width: 100vw;
font-size: 26rpx;
.content {
padding: 20rpx 20rpx 50rpx 20rpx;
box-sizing: border-box;
width: 100vw;
.list {
box-sizing: border-box;
border-bottom: 2rpx solid #e0e2e6;
padding: 30rpx;
display: flex;
flex-direction: column;
gap: 20rpx;
.item1 {
display: flex;
.left {
width: 30%;
}
.right {
display: flex;
width: 70%;
.btn{
background: $uni-linear-gradient-color;
padding: 10rpx 20rpx;
border-radius: 10rpx;
color: #fff;
margin-left: auto;
}
.money {
width: 75%;
}
.yiDaoZhangClass {
width: 25%;
background: $uni-linear-gradient-color;
-webkit-background-clip: text;
/*将设置的背景颜色限制在文字中*/
-webkit-text-fill-color: transparent;
/*给文字设置成透明*/
}
.shenHeClass {
width: 25%;
}
}
}
}
}
}
</style> </style>

Write Preview
Loading…
Cancel
Save