feat: 初始化
This commit is contained in:
George
72
pages/partner/components/statReport/index.scss
Normal file
72
pages/partner/components/statReport/index.scss
Normal file
@ -0,0 +1,72 @@
|
||||
::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
.statDataWrapper {
|
||||
padding: 12px 4px 30px;
|
||||
display: flex;
|
||||
overflow-y: auto;
|
||||
.statData {
|
||||
display: flex;
|
||||
column-gap: 10px;
|
||||
.statDataItem {
|
||||
position: relative;
|
||||
flex-shrink: 0;
|
||||
min-width: 135px;
|
||||
height: 80px;
|
||||
padding: 6px 9px;
|
||||
box-sizing: border-box;
|
||||
box-shadow: -1px 0px 5px 1px rgba(0, 0, 0, 0.1);
|
||||
.title {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: flex-end;
|
||||
height: 100%;
|
||||
.label {
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
font-weight: 700;
|
||||
color: #333333;
|
||||
}
|
||||
.value {
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
color: #25bae4;
|
||||
line-height: 26px;
|
||||
.unit {
|
||||
color: #333333;
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
}
|
||||
.bgIcon {
|
||||
position: absolute;
|
||||
right: 8px;
|
||||
top: 6px;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.filterWrapper {
|
||||
display: flex;
|
||||
column-gap: 6px;
|
||||
margin-bottom: 10px;
|
||||
.filterSelector {
|
||||
flex: 1;
|
||||
}
|
||||
.filterButton {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 91px;
|
||||
height: 34px;
|
||||
color: #fff;
|
||||
background-color: rgba(41, 187, 228, 1);
|
||||
.filterText {
|
||||
white-space: nowrap;
|
||||
margin: 0 8px 0 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
175
pages/partner/components/statReport/index.vue
Normal file
175
pages/partner/components/statReport/index.vue
Normal file
@ -0,0 +1,175 @@
|
||||
<template>
|
||||
<view class="statDataWrapper">
|
||||
<view class="statData">
|
||||
<view v-for="item in statDataList" :key="item.dataIndex" class="statDataItem">
|
||||
<view class="title">
|
||||
<view class="label">{{ item.title }}</view>
|
||||
<view class="value">
|
||||
{{ statData[item.dataIndex] ?? '-' }}
|
||||
<text class="unit">USD</text>
|
||||
<image :src="item.bgSrc" mode="aspectFit" class="bgIcon"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<ReportTable
|
||||
:title="reportList[currentReport].title"
|
||||
:url="reportList[currentReport].url"
|
||||
:defaultDateRangeKey="reportList[currentReport].defaultDateRangeKey ?? 'apply_time'"
|
||||
:timeRangeStart="reportList[currentReport].timeRangeStart ?? 'apply_time_start'"
|
||||
:timeRangeEnd="reportList[currentReport].timeRangeEnd ?? 'apply_time_end'"
|
||||
:visible="visible"
|
||||
>
|
||||
<template v-slot="{ showSearchDialog }">
|
||||
<view class="filterWrapper">
|
||||
<uni-data-select
|
||||
:localdata="reportOptions"
|
||||
@change="handleReportSelectorChange"
|
||||
:clear="false"
|
||||
v-model="currentReport"
|
||||
:placeholder="$t('form.pleaseSelect')"
|
||||
:emptyTips="$t('common.empty')"
|
||||
class="filterSelector"
|
||||
></uni-data-select>
|
||||
<view class="filterButton" @click="showSearchDialog">
|
||||
<image src="/static/filter.png" alt="" style="width: 12px; height: 13px" />
|
||||
<text class="filterText">{{ $t('common.filter') }}</text>
|
||||
<uni-icons type="right" size="20" color="#fff"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</ReportTable>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getStatReportInfo } from '@/services/partner/statReport';
|
||||
import ReportTable from '@/pages/components/reportTable/index.vue';
|
||||
export default {
|
||||
name: 'StatReport',
|
||||
props: {
|
||||
visible: {
|
||||
type: Boolean,
|
||||
required: true,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
currentReport: 'deposit',
|
||||
statData: {},
|
||||
statDataList: [
|
||||
{ title: this.$t('partner.statReport.statCommission'), dataIndex: 'yj', bgSrc: '/static/partner/statCommission.svg' },
|
||||
{ title: this.$t('partner.statReport.statDeposit'), dataIndex: 'rj', bgSrc: '/static/partner/statDeposit.svg' },
|
||||
{ title: this.$t('partner.statReport.statWithdrawal'), dataIndex: 'mt_cj', bgSrc: '/static/partner/statWithdrawal.svg' },
|
||||
{ title: this.$t('partner.statReport.statTransaction'), dataIndex: 'jyl', bgSrc: '/static/partner/statTransaction.svg' },
|
||||
{ title: this.$t('partner.statReport.currentPL'), dataIndex: 'profit', bgSrc: '/static/partner/currentPL.svg' }
|
||||
],
|
||||
reportList: {
|
||||
// 入金报表
|
||||
deposit: {
|
||||
title: this.$t('report.goldIn'),
|
||||
url: '/app/report/getReport16'
|
||||
},
|
||||
// 出金报表
|
||||
withdrawal: {
|
||||
title: this.$t('report.goldOut'),
|
||||
url: '/app/report/getReport17'
|
||||
},
|
||||
// 挂单报表
|
||||
pendingTrading: {
|
||||
title: this.$t('report.pendingOrder'),
|
||||
url: '/app/report/getReport14'
|
||||
},
|
||||
// 交易报表
|
||||
trading: {
|
||||
title: this.$t('report.trading'),
|
||||
url: '/app/report/getReport20'
|
||||
},
|
||||
// 持仓报表
|
||||
openPosition: {
|
||||
title: this.$t('report.openPosition'),
|
||||
url: '/app/report/getReport22',
|
||||
defaultDateRangeKey: 'close_time'
|
||||
},
|
||||
// 账户综合报表
|
||||
consolidatedAccount: {
|
||||
title: this.$t('report.consolidatedAccount'),
|
||||
url: '/app/report/getReport21',
|
||||
defaultDateRangeKey: 'regdate',
|
||||
timeRangeStart: 'close_start',
|
||||
timeRangeEnd: 'close_end'
|
||||
},
|
||||
// 资金报表
|
||||
fund: {
|
||||
title: this.$t('report.fund'),
|
||||
url: '/app/report/getReport24',
|
||||
defaultDateRangeKey: 'close_time',
|
||||
timeRangeStart: 'close_time_start',
|
||||
timeRangeEnd: 'close_time_end'
|
||||
},
|
||||
// 佣金钱包报表
|
||||
rebateWallet: {
|
||||
title: this.$t('report.rebateWallet'),
|
||||
url: '/app/report/getReport28',
|
||||
defaultDateRangeKey: 'create_time',
|
||||
timeRangeStart: 'create_time_start',
|
||||
timeRangeEnd: 'create_time_end'
|
||||
},
|
||||
// 待定钱包报表
|
||||
pendingWallet: {
|
||||
title: this.$t('report.pendingWallet'),
|
||||
url: '/app/report/getReport27',
|
||||
defaultDateRangeKey: 'create_time',
|
||||
timeRangeStart: 'create_time_start',
|
||||
timeRangeEnd: 'create_time_end'
|
||||
},
|
||||
// 交易返佣报表
|
||||
tradeRebate: {
|
||||
title: this.$t('report.tradeRebate'),
|
||||
url: '/app/report/getReport26',
|
||||
defaultDateRangeKey: 'close_time'
|
||||
},
|
||||
// 业绩统计报表
|
||||
performanceStatistics: {
|
||||
title: this.$t('report.performanceStatistics'),
|
||||
url: '/app/report/getReport81'
|
||||
}
|
||||
}
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
reportOptions() {
|
||||
return Object.keys(this.reportList).map((key) => ({
|
||||
text: this.reportList[key].title,
|
||||
value: key
|
||||
}));
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleReportSelectorChange(e) {
|
||||
this.currentReport = e;
|
||||
},
|
||||
async getStatData() {
|
||||
const res = await getStatReportInfo();
|
||||
if (res && res.code === 0) {
|
||||
this.statData = res.data;
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
visible(newValue, oldValue) {
|
||||
if (newValue) {
|
||||
this.getStatData();
|
||||
}
|
||||
}
|
||||
},
|
||||
components: {
|
||||
ReportTable
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import './index.scss';
|
||||
</style>
|
||||
Reference in New Issue
Block a user