141 lines
4.5 KiB
Vue
141 lines
4.5 KiB
Vue
![]() |
<template>
|
||
|
<view class="overviewCard">
|
||
|
<view class="field currentCommission">
|
||
|
<text>{{ $t('partner.currentCommission') }}</text>
|
||
|
<view class="valueWrapper">
|
||
|
<text class="value">{{ ibFund.amount ?? '-' }}</text>
|
||
|
<text>{{ ' USD' }}</text>
|
||
|
</view>
|
||
|
</view>
|
||
|
<view class="field">
|
||
|
<text>{{ $t('partner.statCommission') }}</text>
|
||
|
<text>{{ ibFund.totalAmount ?? '-' }} USD</text>
|
||
|
</view>
|
||
|
<view class="field">
|
||
|
<text>{{ $t('partner.withdrawn') }}</text>
|
||
|
<text>{{ ibFund.fundOut ?? '-' }} USD</text>
|
||
|
</view>
|
||
|
<view class="field">
|
||
|
<text>{{ $t('partner.transferred') }}</text>
|
||
|
<text>{{ ibFund.fundTransfer ?? '-' }} USD</text>
|
||
|
</view>
|
||
|
<view class="overviewCardBtns">
|
||
|
<view class="btn primaryButton" @click="navigateTo('/pages/capital/ibWithdraw/index')">
|
||
|
{{ $t('home.goldout') }}
|
||
|
</view>
|
||
|
<view class="btn secondaryButton" @click="navigateTo('/pages/capital/ibTransfer/index')">
|
||
|
{{ $t('home.transfer') }}
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
<view class="filter">
|
||
|
<uni-data-checkbox v-model="daterangePreset" :localdata="daterangePresets" @change="handlePresetChange" selectedColor="#29BBE4" class="datePreset"></uni-data-checkbox>
|
||
|
<uni-datetime-picker type="daterange" v-model="timeRange" @change="handleDaterangeChange" />
|
||
|
</view>
|
||
|
<view class="overviewContent">
|
||
|
<view v-for="item in overviewList" :key="item.label" class="overviewItem" @click="() => showChart(item)">
|
||
|
<view class="label">
|
||
|
{{ item.label }}
|
||
|
</view>
|
||
|
<view class="value">
|
||
|
{{ overviewData[item.dataIndex]?.toFixed(2) }}
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
import { useUserStore } from '@/stores/user';
|
||
|
import { getPhaseSummarizing } from '@/services/partner/overview.ts';
|
||
|
import dayjs from 'dayjs';
|
||
|
export default {
|
||
|
name: 'Overview',
|
||
|
props: {
|
||
|
visible: {
|
||
|
type: Boolean,
|
||
|
required: true,
|
||
|
default: false
|
||
|
}
|
||
|
},
|
||
|
data() {
|
||
|
return {
|
||
|
ibFund: {
|
||
|
totalAmount: 123.123,
|
||
|
amount: 290.123,
|
||
|
fundOut: 123.0,
|
||
|
fundTransfer: 0.0
|
||
|
},
|
||
|
overviewList: [
|
||
|
{ label: this.$t('partner.overview.statPL'), dataIndex: 'my_yk', type: 8, clickable: true },
|
||
|
{ label: this.$t('partner.overview.statEquity'), dataIndex: 'jz', type: false, clickable: false },
|
||
|
{ label: this.$t('partner.overview.IBCommission'), dataIndex: 'yj', type: 2, clickable: true },
|
||
|
{ label: this.$t('partner.overview.statDeposit'), dataIndex: 'rj', type: 3, clickable: true },
|
||
|
{ label: this.$t('partner.overview.statWithdraw'), dataIndex: 'mt_cj', type: 4, clickable: true },
|
||
|
{ label: this.$t('partner.overview.statIBWithdraw'), dataIndex: 'yj_cj', type: 9, clickable: true },
|
||
|
{ label: this.$t('partner.overview.newClient'), dataIndex: 'zc', type: 5, clickable: true },
|
||
|
{ label: this.$t('partner.overview.volume'), dataIndex: 'my_jyl', type: 6, clickable: true },
|
||
|
{ label: this.$t('partner.overview.volume_cent'), dataIndex: 'mf_jyl', type: 7, clickable: true },
|
||
|
{ label: this.$t('partner.overview.statPL_cent'), dataIndex: 'mf_yk', type: 1, clickable: true }
|
||
|
],
|
||
|
overviewData: {},
|
||
|
timeRange: undefined,
|
||
|
daterangePreset: undefined,
|
||
|
daterangePresets: [
|
||
|
{ text: this.$t('common.yesterday'), value: 1 },
|
||
|
{ text: this.$t('common.threeDays'), value: 2 },
|
||
|
{ text: this.$t('common.7Days'), value: 6 },
|
||
|
{ text: this.$t('common.30Days'), value: 29 }
|
||
|
]
|
||
|
};
|
||
|
},
|
||
|
methods: {
|
||
|
async getOverviewData() {
|
||
|
let params = {};
|
||
|
if (this.timeRange) {
|
||
|
params.time_start = this.timeRange[0];
|
||
|
params.time_end = this.timeRange[1];
|
||
|
}
|
||
|
const res = await getPhaseSummarizing(params);
|
||
|
if (res && res.code === 0) {
|
||
|
this.overviewData = res.data;
|
||
|
}
|
||
|
},
|
||
|
handleDaterangeChange() {
|
||
|
this.daterangePreset = undefined;
|
||
|
this.getOverviewData();
|
||
|
},
|
||
|
handlePresetChange(e) {
|
||
|
this.daterangePreset = e.detail.value;
|
||
|
this.timeRange = [dayjs().subtract(Number(e.detail.value), 'day').format('YYYY-MM-DD'), dayjs().format('YYYY-MM-DD')];
|
||
|
this.getOverviewData();
|
||
|
},
|
||
|
showChart(overview) {
|
||
|
if (!overview.clickable) return;
|
||
|
this.navigateTo('/pages/partner/overviewChart/index', {
|
||
|
label: overview.label,
|
||
|
type: overview.type,
|
||
|
time_start: this.timeRange[0],
|
||
|
time_end: this.timeRange[1]
|
||
|
});
|
||
|
},
|
||
|
navigateTo(target, params) {
|
||
|
if (target) {
|
||
|
uni.navigateTo({
|
||
|
url: `${target}${params ? `?params=${JSON.stringify(params)}` : ''}`
|
||
|
});
|
||
|
}
|
||
|
}
|
||
|
},
|
||
|
created() {
|
||
|
const userStore = useUserStore();
|
||
|
this.ibFund = userStore.ibFund;
|
||
|
this.handlePresetChange({ detail: { value: 6 } });
|
||
|
this.getOverviewData();
|
||
|
}
|
||
|
};
|
||
|
</script>
|
||
|
|
||
|
<style lang="scss" scoped>
|
||
|
@import './index.scss';
|
||
|
</style>
|