191 lines
4.4 KiB
Vue
191 lines
4.4 KiB
Vue
<!-- 分销账户：展示基本统计信息 -->
|
||
<template>
|
||
<view class="new-main">
|
||
<view class="account-card">
|
||
<view class="account-card-box">
|
||
<view class="ss-flex ss-row-between card-box-header">
|
||
<view class="ss-flex">
|
||
<!-- <view class="header-title ss-m-r-16">账户信息</view> -->
|
||
<button class="ss-reset-button look-btn ss-flex" @tap="state.showMoney = !state.showMoney">
|
||
<uni-icons :type="state.showMoney ? 'eye-filled' : 'eye-slash-filled'" color="#A57A55"
|
||
size="20" />
|
||
</button>
|
||
</view>
|
||
<view class="ss-flex" @tap="sheep.$router.go('/pages/commission/wallet')">
|
||
<view class="header-title ss-m-r-4">提现记录</view>
|
||
<text class="cicon-play-arrow" />
|
||
</view>
|
||
</view>
|
||
<!-- 提现金额 -->
|
||
<view class="ss-flex new-cont">
|
||
<view class="ss-flex-1 ss-flex-col ">
|
||
<view class="item-title">可提现(元)</view>
|
||
<view class="item-detail">
|
||
{{ state.showMoney ? fen2yuan(state.brokerageInfo.brokeragePrice) : '***' }}
|
||
</view>
|
||
</view>
|
||
<view class="ss-flex-1 ss-flex-col ss-col-center new-btn"
|
||
@tap="sheep.$router.go('/pages/commission/withdraw')"
|
||
>
|
||
立即提现
|
||
</view>
|
||
</view>
|
||
<!-- 收益 -->
|
||
<view class="card-content ss-flex">
|
||
<view class="ss-flex-1 ss-flex-col ss-col-center">
|
||
<view class="item-title">当前收益(元)</view>
|
||
<view class="item-detail">
|
||
{{ state.showMoney ? fen2yuan(state.summary.brokeragePrice || 0) : '***' }}
|
||
</view>
|
||
</view>
|
||
<view class="ss-flex-1 ss-flex-col ss-col-center">
|
||
<view class="item-title">昨天收益(元)</view>
|
||
<view class="item-detail">
|
||
{{ state.showMoney ? fen2yuan(state.summary.yesterdayPrice || 0) : '***' }}
|
||
</view>
|
||
</view>
|
||
<view class="ss-flex-1 ss-flex-col ss-col-center">
|
||
<view class="item-title">累计已提(元)</view>
|
||
<view class="item-detail">
|
||
{{ state.showMoney ? fen2yuan(state.summary.withdrawPrice || 0) : '***' }}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
|
||
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import sheep from '@/sheep';
|
||
import {
|
||
computed,
|
||
reactive,
|
||
onMounted,
|
||
onBeforeMount
|
||
} from 'vue';
|
||
import BrokerageApi from '@/sheep/api/trade/brokerage';
|
||
import {
|
||
fen2yuan
|
||
} from '@/sheep/hooks/useGoods';
|
||
|
||
const userInfo = computed(() => sheep.$store('user').userInfo);
|
||
|
||
const state = reactive({
|
||
showMoney: false,
|
||
summary: {},
|
||
brokerageInfo: {}, // 分销信息
|
||
arr:{}
|
||
});
|
||
|
||
// 获得分销信息
|
||
async function getBrokerageUser() {
|
||
const { data, code } = await BrokerageApi.getBrokerageUser();
|
||
if (code === 0) {
|
||
state.brokerageInfo = data;
|
||
}
|
||
}
|
||
|
||
|
||
|
||
onMounted(async () => {
|
||
let {
|
||
code,
|
||
data
|
||
} = await BrokerageApi.getBrokerageUserSummary();
|
||
if (code === 0) {
|
||
state.summary = data || {};
|
||
}
|
||
});
|
||
onBeforeMount(() => {
|
||
getBrokerageUser();
|
||
});
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.new-main{
|
||
width: 100%;
|
||
}
|
||
.account-card {
|
||
width: 694rpx;
|
||
margin: 0 auto;
|
||
padding: 2rpx;
|
||
// background: linear-gradient(180deg, #ffffff 0.88%, #fff9ec 100%);
|
||
border-radius: 12rpx 12rpx 0 0;
|
||
z-index: 3;
|
||
position: relative;
|
||
background: url('https://zysc.fjptzykj.com:3000/shangcheng/423af1ff70d4e80ca7bd4ede17b9fe63800aaffd2e4e8b5b7584ab5bf5884996.png') no-repeat;
|
||
background-size: cover;
|
||
|
||
|
||
|
||
.account-card-box {
|
||
|
||
// background: #ffefd6;
|
||
.new-cont {
|
||
padding: 0 45rpx;
|
||
|
||
.new-btn {
|
||
background: rgba(178, 102, 67);
|
||
border-radius: 22px;
|
||
padding: 8px 0;
|
||
font-size: 16px;
|
||
color: white;
|
||
font-weight:700;
|
||
}
|
||
|
||
.item-title {
|
||
color: rgba(139, 105, 87, 1);
|
||
}
|
||
|
||
.item-detail {
|
||
color: rgba(81, 41, 24, 1);
|
||
font-size: 31px;
|
||
}
|
||
}
|
||
|
||
.card-box-header {
|
||
padding: 0 45rpx;
|
||
height: 72rpx;
|
||
// box-shadow: 0px 2px 6px #f2debe;
|
||
|
||
.header-title {
|
||
font-size: 24rpx;
|
||
font-weight: 500;
|
||
color: #a17545;
|
||
line-height: 30rpx;
|
||
}
|
||
|
||
.cicon-play-arrow {
|
||
color: #a17545;
|
||
font-size: 24rpx;
|
||
line-height: 30rpx;
|
||
}
|
||
}
|
||
|
||
.card-content {
|
||
height: 190rpx;
|
||
// background: #fdfae9;
|
||
|
||
.item-title {
|
||
font-size: 24rpx;
|
||
font-weight: 500;
|
||
color: rgba(139, 105, 87, 1);
|
||
line-height: 30rpx;
|
||
margin-bottom: 24rpx;
|
||
}
|
||
|
||
.item-detail {
|
||
font-size: 36rpx;
|
||
font-family: OPPOSANS;
|
||
font-weight: bold;
|
||
color: #692e04;
|
||
line-height: 30rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style> |