shop-applet/pages/users/gather_list/index.vue

375 lines
9.2 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="list">
<view class="head">
<view class="head_conent">
<view class="sum">
<view class="text">已提现金额</view>
<u-count-to class="num" style="color: #F84221;" :startVal="0" :endVal="sumTofixed" :decimals="2"></u-count-to>
</view>
<view class="line"></view>
<view class="sum">
<view class="text">已提现次数</view>
<u-count-to class="num" :startVal="0" :endVal="count"></u-count-to>
</view>
</view>
<u-line></u-line>
<view class="tixian" @click="tixian">
立即提现
</view>
</view>
<!-- <view class="public-wrapper">
<view class="title">
提现详情
</view>
<view class="conter">
<view class="data">编号</view>
<view class="browse">银行</view>
<view class="turnover">日期</view>
<view class="money">金额()</view>
</view>
<view class="footer">
<scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y">
<view class=" footer_list" v-for="(item,index) in UserApplylist" :key="index">
<view class="data">{{index+1}}</view>
<view class="browse">{{item.financial_account.bank}}</view>
<view class="turnover">{{item.create_time}}</view>
<view class="money">{{item.extract_money}}</view>
</view>
</scroll-view>
</view>
</view> -->
<view class="recoder">
<block>
<!-- <picker mode="date" fields="month" :end="endDate" @change="changeDate">
<view class="time">
<view>2023年-11月</view>
<image src="@/static/images/arrow-right.png" class="icon"></image>
</view>
</picker> -->
<view class="card" v-for="(item,index) in UserApplylist" :key="index">
<image class="left" src="@/static/images/qianbao.png" style="width: 60rpx;height: 60rpx;"></image>
<view class="right">
<view class="item">
<view class="item_title">佣金提现到银行卡</view>
<view class="item_money">+{{item.extract_money}}</view>
</view>
<view class="item">
<view class="item_brank">{{`${item.financial_account.bank} (${item.financial_account.bank_code}) `}}</view>
<view class="item_time">{{item.create_time}}</view>
</view>
</view>
</view>
</block>
</view>
</view>
</template>
<script>
// +----------------------------------------------------------------------
// | CRMEB [ CRMEB赋能开发者助力企业发展 ]
// +----------------------------------------------------------------------
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
// +----------------------------------------------------------------------
// | Licensed CRMEB并不是自由软件未经许可不能去掉CRMEB相关版权
// +----------------------------------------------------------------------
// | Author: CRMEB Team <admin@crmeb.com>
// +----------------------------------------------------------------------
import {
getAdminApplyListAPI
} from '@/api/user.js'
export default {
data() {
return {
sum: 0,
count:0,
scrollTop: 0,
endDate: '',
merId: '',
UserApplylist:[]
}
},
computed: {
sumTofixed(){
return this.returnFloat(this.sum)
}
},
watch: {
},
onLoad(option) {
this.merId = option.mer_id
let date = new Date();
this.endDate = `${date.getFullYear()}-${date.getMonth()+1}-01`
console.log(this.endDate);
// console.log(this.merId);
this.ApplyList()
// this.UserApplylist.forEach((item)=>{
// console.log(item.extract_money);
// })
},
methods: {
changeDate(e){
console.log(e.detail.value);
},
/**数字强制转为两位小数*/
returnFloat(value){
var value=Math.round(parseFloat(value)*100)/100;
var xsd=value.toString().split(".");
if(xsd.length==1){
value=value.toString()+".00";
return value;
}
if(xsd.length>1){
if(xsd[1].length<2){
value=value.toString()+"0";
}
return value;
}
},
tixian() {
uni.navigateBack({
delta: 1
});
},
ApplyList(){
getAdminApplyListAPI(this.merId).then(res=>{
console.log(res);
this.UserApplylist=res.data.list
this.count=this.UserApplylist.length
this.UserApplylist.forEach(item=>{
item.financial_account.bank_code=item.financial_account.bank_code.substr(-4)
console.log(item.financial_account.bank_code);
// item.create_time=item.create_time.substr(0,10)
// console.log(parseInt(item.extract_money));
})
for(let i =0; i<this.UserApplylist.length; i++){
this.sum+=parseInt(this.UserApplylist[i].extract_money)
}
}).catch(err=>{
console.log(err);
})
}
},
}
</script>
<style lang="scss">
.list {
.head {
// width: 100%;
// height: 150px;
// display: flex;
// background-image: linear-gradient(90deg, #FA6514 0%, #E93323 100%);
// position: relative;
// padding-top: 28rpx;
width: 694rpx;
margin: 28rpx auto;
padding: 28rpx;
background-color: #fff;
border-radius: 24rpx;
.head_conent {
// width: 694rpx;
// margin: 28rpx auto;
// height: 150px;
// margin: 50px auto;
// border-radius: 15px;
// box-shadow: 0px 0px 5px rgba(#FA6514, 0.5);
display: flex;
justify-content: space-around;
align-items: center;
.line{
width: 1rpx;
height: 70rpx;
background-color: #dfdfdf;
}
.sum {
flex: 1;
text-align: center;
color: #737373;
font-size: 30rpx;
.num{
font-size: 42.06rpx;
margin-bottom: 15rpx;
}
.text{
margin-bottom: 15rpx;
}
}
}
.tixian {
width: 326rpx;
height: 53rpx;
line-height: 53rpx;
text-align: center;
background: #FFFFFF;
border-radius: 25rpx 25rpx 25rpx 25rpx;
opacity: 1;
border: 2rpx solid #F84221;
margin: 0 auto;
margin-top: 20rpx;
font-size: 26rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #F84221;
// position: absolute;
// background-image: linear-gradient(90deg, #FA6514 0%, #E93323 100%);
// box-shadow: 0px 0px 5px rgba(#FA6514, 0.5);
// width: 100px;
// height: 40px;
// line-height: 40px;
// border-radius: 30px;
// text-align: center;
// font-size: 18px;
// color: #fff;
// font-weight: 700;
// left: 37%;
// top: 150px;
}
}
.public-wrapper {
width: 90%;
margin: 70px auto;
box-shadow: 0px 0px 5px rgba(#FA6514, 0.7);
border-radius: 10px;
.title {
font-size: 18px;
font-weight: 700;
padding: 10px 0 0 10px;
}
.conter {
display: flex;
align-items: center;
padding: 10px 0 0 10px;
text-align: center;
.data {
width: 40px;
}
.browse {
width: 110px;
}
.turnover {
width: 110px;
}
.money {
width: 60px;
}
}
.footer {
.scroll-Y {
max-height: 60vh;
.footer_list {
display: flex;
align-items: center;
padding: 10px 0 0 10px;
text-align: center;
.data {
width: 40px;
}
.browse {
width: 110px;
}
.turnover {
width: 110px;
}
.money {
width: 60px;
}
}
}
}
}
.recoder{
padding: 0 28rpx 28rpx 28rpx;
.time{
height: 42rpx;
font-size: 30rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: #333333;
line-height: 45rpx;
margin-bottom: 20rpx;
display: flex;
align-items: center;
.icon{
width: 30rpx;
height: 30rpx;
transform: rotate(90deg);
margin-left: 10rpx;
}
}
.card{
width: 694rpx;
background: #FFFFFF;
border-radius: 21rpx 21rpx 21rpx 21rpx;
opacity: 1;
padding: 28rpx;
margin-bottom: 20rpx;
display: flex;
align-items: center;
.left{
flex-shrink: 0;
margin-right: 20rpx;
}
.right{
flex: 1;
.item{
width: 100%;
display: flex;
justify-content: space-between;
&_title{
font-size: 30rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: #333333;
line-height: 45rpx;
}
&_money{
font-size: 33rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: #F84221;
line-height: 50rpx;
}
&_brank{
font-size: 26rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #737373;
line-height: 39rpx;
}
&_time{
font-size: 23rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #B3B3B3;
line-height: 34rpx;
}
}
}
}
}
}
</style>