fix: 统计分析自测问题修复。
This commit is contained in:
tianyongbao
@@ -1,124 +1,129 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<div class="search-con">
|
<div class="search-con">
|
||||||
<div class="title">查询条件</div>
|
<div class="title">查询条件</div>
|
||||||
<el-form :model="queryParams" ref="queryRef" :inline="true" :rules="rules" label-width="100px">
|
<el-form :model="queryParams" ref="queryRef" :inline="true" :rules="rules" label-width="100px">
|
||||||
<el-form-item label="信用卡" prop="id">
|
<el-form-item label="信用卡" prop="id">
|
||||||
<el-select v-model="queryParams.id" placeholder="请选择信用卡" clearable>
|
<el-select v-model="queryParams.id" placeholder="请选择信用卡" clearable>
|
||||||
<el-option v-for="creditCard in creditCardList" :key="creditCard.id" :label="creditCard.nameCode" :value="creditCard.id" />
|
<el-option v-for="creditCard in creditCardList" :key="creditCard.id" :label="creditCard.nameCode" :value="creditCard.id" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="time" v-if="queryParams.type === 2">
|
<el-form-item label="" prop="time" v-if="queryParams.type === 2">
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
v-model="queryParams.time"
|
v-model="queryParams.time"
|
||||||
type="monthrange"
|
type="monthrange"
|
||||||
range-separator="~"
|
range-separator="~"
|
||||||
format="YYYY-MM"
|
format="YYYY-MM"
|
||||||
start-placeholder="开始时间"
|
start-placeholder="开始时间"
|
||||||
end-placeholder="结束时间"
|
end-placeholder="结束时间"
|
||||||
:disabled-date="disabledDateFun"
|
:disabled-date="disabledDateFun"
|
||||||
@calendar-change="calendarChange"
|
@calendar-change="calendarChange"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
<div class="search-btn-con">
|
<div class="search-btn-con">
|
||||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||||
<el-button type="info" icon="Refresh" @click="resetQuery">重置</el-button>
|
<el-button type="info" icon="Refresh" @click="resetQuery">重置</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="main-con" style="height: calc(100% - 2.05rem)">
|
||||||
|
<div class="summary-con">
|
||||||
|
<div class="left-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/chart-pie.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="num">{{ creditObj.creditBillRate }}%</div>
|
||||||
|
<div class="title">使用率</div>
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ creditObj.creditLimit }}</span> <span class="unit"></span>
|
||||||
|
</div>
|
||||||
|
<div class="title">总额度</div>
|
||||||
|
</div>
|
||||||
|
<div class="line"></div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ creditObj.creditBalance }}</span> <span class="unit"></span>
|
||||||
|
</div>
|
||||||
|
<div class="title">已用额度</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="main-con" style="height: calc(100% - 2.05rem)">
|
<div class="center-con">
|
||||||
<div class="summary-con">
|
<div class="img">
|
||||||
<div class="left-con">
|
<img src="@/assets/images/accumulate.png" alt="" />
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/chart-pie.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="num">{{ creditObj.creditBillRate }}%</div>
|
|
||||||
<div class="title">使用率</div>
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ creditObj.creditLimit }}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
<div class="title">总额度</div>
|
|
||||||
</div>
|
|
||||||
<div class="line"></div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ creditObj.creditBalance }}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
<div class="title">已用额度</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="center-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/accumulate.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">可用额度</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ creditObj.creditAvailableLimit }}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="center-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/accumulate.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">信用卡总数</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ creditObj.creditCardCount }}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="right-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/average.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">月平均账单金额</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ creditObj.averageCreditBill }}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="right-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/average.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">累计账单金额</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ creditObj.actualCreditBill }}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="title-con">
|
<div class="item-wrap">
|
||||||
<div class="title">账单统计</div>
|
<div class="title">可用额度</div>
|
||||||
<div class="operate-btn-con">
|
<div>
|
||||||
<el-radio-group v-model="radioVal" @change="handleRadioChange">
|
<span class="num">{{ creditObj.creditAvailableLimit }}</span> <span class="unit"></span>
|
||||||
<el-radio-button label="柱状图" />
|
|
||||||
<el-radio-button label="折线图" />
|
|
||||||
<el-radio-button label="表格" />
|
|
||||||
</el-radio-group>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="content-con">
|
|
||||||
<div v-show="radioVal === '柱状图'" class="chart" id="chartBar" style="height: calc(100% - 170px)"></div>
|
|
||||||
<div v-show="radioVal === '折线图'" class="chart" id="chartLine" style="height: calc(100% - 170px)"></div>
|
|
||||||
<el-table v-show="radioVal === '表格'" v-loading="loading" :data="creditObj.tableCreditBillList" height="calc(100% - 170px)">
|
|
||||||
<el-table-column label="序号" width="50" type="index" align="center">
|
|
||||||
<template #default="scope">
|
|
||||||
<span>{{ scope.$index + 1 }}</span>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column label="统计日期" align="center" prop="time" />
|
|
||||||
<el-table-column label="账单金额" align="center" prop="value" />
|
|
||||||
</el-table>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="center-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/accumulate.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">信用卡总数</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ creditObj.creditCardCount }}</span> <span class="unit"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="right-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">月平均账单金额</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ creditObj.averageCreditBill }}</span> <span class="unit"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="right-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">累计账单金额</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ creditObj.actualCreditBill }}</span> <span class="unit"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="title-con">
|
||||||
|
<div class="title">账单统计</div>
|
||||||
|
<div class="operate-btn-con">
|
||||||
|
<el-radio-group v-model="radioVal" @change="handleRadioChange">
|
||||||
|
<el-radio-button label="柱状图" />
|
||||||
|
<el-radio-button label="折线图" />
|
||||||
|
<el-radio-button label="表格" />
|
||||||
|
</el-radio-group>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="content-con">
|
||||||
|
<div v-show="radioVal === '柱状图'" class="chart" id="chartBar" style="height: calc(100% - 170px)"></div>
|
||||||
|
<div v-show="radioVal === '折线图'" class="chart" id="chartLine" style="height: calc(100% - 170px)"></div>
|
||||||
|
<el-table v-show="radioVal === '表格'" v-loading="loading" :data="creditObj.tableCreditBillList" height="calc(100% - 170px)">
|
||||||
|
<el-table-column label="序号" width="50" type="index" align="center">
|
||||||
|
<template #default="scope">
|
||||||
|
<span>{{ scope.$index + 1 }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="统计日期" align="center" prop="time" />
|
||||||
|
<el-table-column label="账单金额" align="center" prop="value" />
|
||||||
|
<el-table-column prop="detail" label="账单明细" width="700" v-if="queryParams.type === 2">
|
||||||
|
<template #default="scope">
|
||||||
|
<span v-html="formatMultiLineData(scope.row.detail)"></span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -131,9 +136,7 @@ import { getCreditAnalysis } from '@/api/invest/statisticAnalysis'
|
|||||||
import { listBankcardLend } from '@/api/invest/bankcardlend'
|
import { listBankcardLend } from '@/api/invest/bankcardlend'
|
||||||
const { proxy } = getCurrentInstance()
|
const { proxy } = getCurrentInstance()
|
||||||
|
|
||||||
const dates = [
|
const dates = [{ value: 2, label: '月' }]
|
||||||
{ value: 2, label: '月' }
|
|
||||||
]
|
|
||||||
|
|
||||||
const loading = ref(true)
|
const loading = ref(true)
|
||||||
const total = ref(0)
|
const total = ref(0)
|
||||||
@@ -173,7 +176,7 @@ const data = reactive({
|
|||||||
|
|
||||||
const { queryParams, queryCreditCardParams, rules } = toRefs(data)
|
const { queryParams, queryCreditCardParams, rules } = toRefs(data)
|
||||||
const today = new Date()
|
const today = new Date()
|
||||||
const end = today.getFullYear() + '-' + ('0' + (today.getMonth())).slice(-2)
|
const end = today.getFullYear() + '-' + ('0' + today.getMonth()).slice(-2)
|
||||||
const start = dayjs(end).add(-11, 'months')
|
const start = dayjs(end).add(-11, 'months')
|
||||||
queryParams.value.time = [start, end]
|
queryParams.value.time = [start, end]
|
||||||
/** 查询信用卡卡管理列表 */
|
/** 查询信用卡卡管理列表 */
|
||||||
@@ -183,6 +186,11 @@ function getCreditCardList() {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function formatMultiLineData(data) {
|
||||||
|
if (data != null) {
|
||||||
|
return data.replace(/<br\/>/g, '<br/>')
|
||||||
|
}
|
||||||
|
}
|
||||||
const disabledDateFun = (time) => {
|
const disabledDateFun = (time) => {
|
||||||
const arr = [0, 30, 365, 365 * 5]
|
const arr = [0, 30, 365, 365 * 5]
|
||||||
const days = arr[queryParams.value.type]
|
const days = arr[queryParams.value.type]
|
||||||
|
|||||||
@@ -200,6 +200,11 @@
|
|||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="交易日期" align="center" prop="time" />
|
<el-table-column label="交易日期" align="center" prop="time" />
|
||||||
<el-table-column label="交易金额" align="center" prop="value" />
|
<el-table-column label="交易金额" align="center" prop="value" />
|
||||||
|
<el-table-column prop="detail" label="交易明细" width="700" v-if="queryParams.type === 1">
|
||||||
|
<template #default="scope">
|
||||||
|
<span v-html="formatMultiLineData(scope.row.detail)"></span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -317,7 +322,11 @@ const calendarChange = (val) => {
|
|||||||
firstChooseDate.value = val[0].getTime()
|
firstChooseDate.value = val[0].getTime()
|
||||||
if (val[1]) firstChooseDate.value = ''
|
if (val[1]) firstChooseDate.value = ''
|
||||||
}
|
}
|
||||||
|
function formatMultiLineData(data) {
|
||||||
|
if (data != null) {
|
||||||
|
return data.replace(/<br\/>/g, '<br/>')
|
||||||
|
}
|
||||||
|
}
|
||||||
const account = ref({
|
const account = ref({
|
||||||
amount: '',
|
amount: '',
|
||||||
income: '',
|
income: '',
|
||||||
|
|||||||
@@ -136,6 +136,11 @@
|
|||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="还款日期" align="center" prop="time" />
|
<el-table-column label="还款日期" align="center" prop="time" />
|
||||||
<el-table-column label="待还款金额" align="center" prop="value" />
|
<el-table-column label="待还款金额" align="center" prop="value" />
|
||||||
|
<el-table-column prop="detail" label="待还款明细" width="700" v-if="queryParams.type === 1">
|
||||||
|
<template #default="scope">
|
||||||
|
<span v-html="formatMultiLineData(scope.row.detail)"></span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -220,6 +225,11 @@ function getCreditCardList() {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function formatMultiLineData(data) {
|
||||||
|
if (data != null) {
|
||||||
|
return data.replace(/<br\/>/g, '<br/>')
|
||||||
|
}
|
||||||
|
}
|
||||||
const handleTimeChange = (type) => {
|
const handleTimeChange = (type) => {
|
||||||
queryParams.value.time = null
|
queryParams.value.time = null
|
||||||
if (type === 1) {
|
if (type === 1) {
|
||||||
|
|||||||
@@ -1,131 +1,135 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<div class="search-con">
|
<div class="search-con">
|
||||||
<div class="title">查询条件</div>
|
<div class="title">查询条件</div>
|
||||||
<el-form :model="queryParams" ref="queryRef" :inline="true" :rules="rules" label-width="100px">
|
<el-form :model="queryParams" ref="queryRef" :inline="true" :rules="rules" label-width="100px">
|
||||||
<el-form-item label="信用卡" prop="bankCardLendId">
|
<el-form-item label="信用卡" prop="bankCardLendId">
|
||||||
<el-select v-model="queryParams.id" placeholder="信用卡" clearable>
|
<el-select v-model="queryParams.id" placeholder="信用卡" clearable>
|
||||||
<el-option v-for="creditCard in creditCardList" :key="creditCard.id" :label="creditCard.nameCode" :value="creditCard.id" />
|
<el-option v-for="creditCard in creditCardList" :key="creditCard.id" :label="creditCard.nameCode" :value="creditCard.id" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="type">
|
<el-form-item label="" prop="type">
|
||||||
<el-select v-model="queryParams.type" @change="handleTimeChange" placeholder="请选择日期">
|
<el-select v-model="queryParams.type" @change="handleTimeChange" placeholder="请选择日期">
|
||||||
<el-option v-for="item in dates" :key="item.value" :label="item.label" :value="item.value" />
|
<el-option v-for="item in dates" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="time" v-if="queryParams.type === 1">
|
<el-form-item label="" prop="time" v-if="queryParams.type === 1">
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
v-model="queryParams.time"
|
v-model="queryParams.time"
|
||||||
type="daterange"
|
type="daterange"
|
||||||
range-separator="~"
|
range-separator="~"
|
||||||
start-placeholder="开始时间"
|
start-placeholder="开始时间"
|
||||||
end-placeholder="结束时间"
|
end-placeholder="结束时间"
|
||||||
format="YYYY-MM-DD"
|
format="YYYY-MM-DD"
|
||||||
@calendar-change="calendarChange"
|
@calendar-change="calendarChange"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="time" v-if="queryParams.type === 2">
|
<el-form-item label="" prop="time" v-if="queryParams.type === 2">
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
v-model="queryParams.time"
|
v-model="queryParams.time"
|
||||||
type="monthrange"
|
type="monthrange"
|
||||||
range-separator="~"
|
range-separator="~"
|
||||||
format="YYYY-MM"
|
format="YYYY-MM"
|
||||||
start-placeholder="开始时间"
|
start-placeholder="开始时间"
|
||||||
end-placeholder="结束时间"
|
end-placeholder="结束时间"
|
||||||
@calendar-change="calendarChange"
|
@calendar-change="calendarChange"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="time" v-if="queryParams.type === 3">
|
<el-form-item label="" prop="time" v-if="queryParams.type === 3">
|
||||||
<yearPicker
|
<yearPicker
|
||||||
v-model="queryParams.time"
|
v-model="queryParams.time"
|
||||||
ref="statisticPicker"
|
ref="statisticPicker"
|
||||||
labelText="选择年份"
|
labelText="选择年份"
|
||||||
:initYear="dateValue"
|
:initYear="dateValue"
|
||||||
:showYear="showYearValue"
|
:showYear="showYearValue"
|
||||||
:maxLength="20"
|
:maxLength="20"
|
||||||
sp="~"
|
sp="~"
|
||||||
@updateTimeRange="updateStatisticYear"
|
@updateTimeRange="updateStatisticYear"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
<div class="search-btn-con">
|
<div class="search-btn-con">
|
||||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||||
<el-button type="info" icon="Refresh" @click="resetQuery">重置</el-button>
|
<el-button type="info" icon="Refresh" @click="resetQuery">重置</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="main-con" style="height: calc(100% - 2.05rem)">
|
||||||
|
<div class="summary-con">
|
||||||
|
<div class="center-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/accumulate.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">已结清分期笔数</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ historyObj.clearedCount }}</span> <span class="unit">笔</span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="main-con" style="height: calc(100% - 2.05rem)">
|
<div class="center-con">
|
||||||
<div class="summary-con">
|
<div class="img">
|
||||||
<div class="center-con">
|
<img src="@/assets/images/accumulate.png" alt="" />
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/accumulate.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">已结清分期笔数</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ historyObj.clearedCount }}</span> <span class="unit">笔</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="center-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/accumulate.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">已结清分期（本息）</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ historyObj.clearedTotal }}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="center-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/accumulate.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">已结清分期（本金）</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ historyObj.clearedPrincipal}}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="center-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/accumulate.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">已结清总利息</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ historyObj.totalInterest }}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div class="title-con">
|
<div class="item-wrap">
|
||||||
<div class="title">已结清信用卡分期统计</div>
|
<div class="title">已结清分期（本息）</div>
|
||||||
<div class="operate-btn-con">
|
<div>
|
||||||
<el-radio-group v-model="radioVal" @change="handleRadioChange">
|
<span class="num">{{ historyObj.clearedTotal }}</span> <span class="unit"></span>
|
||||||
<el-radio-button label="柱状图" />
|
|
||||||
<el-radio-button label="折线图" />
|
|
||||||
<el-radio-button label="表格" />
|
|
||||||
</el-radio-group>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="content-con">
|
|
||||||
<div v-show="radioVal === '柱状图'" class="chart" id="chartBar" style="height: calc(100% - 170px)"></div>
|
|
||||||
<div v-show="radioVal === '折线图'" class="chart" id="chartLine" style="height: calc(100% - 170px)"></div>
|
|
||||||
<el-table v-show="radioVal === '表格'" v-loading="loading" :data="historyObj.tableHistoryList" height="calc(100% - 170px)">
|
|
||||||
<el-table-column label="序号" width="50" type="index" align="center">
|
|
||||||
<template #default="scope">
|
|
||||||
<span>{{ scope.$index + 1 }}</span>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column label="分期日期" align="center" prop="time" />
|
|
||||||
<el-table-column label="分期金额（本息）" align="center" prop="value" />
|
|
||||||
</el-table>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="center-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/accumulate.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">已结清分期（本金）</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ historyObj.clearedPrincipal }}</span> <span class="unit"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="center-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/accumulate.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">已结清总利息</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ historyObj.totalInterest }}</span> <span class="unit"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="title-con">
|
||||||
|
<div class="title">已结清信用卡分期统计</div>
|
||||||
|
<div class="operate-btn-con">
|
||||||
|
<el-radio-group v-model="radioVal" @change="handleRadioChange">
|
||||||
|
<el-radio-button label="柱状图" />
|
||||||
|
<el-radio-button label="折线图" />
|
||||||
|
<el-radio-button label="表格" />
|
||||||
|
</el-radio-group>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="content-con">
|
||||||
|
<div v-show="radioVal === '柱状图'" class="chart" id="chartBar" style="height: calc(100% - 170px)"></div>
|
||||||
|
<div v-show="radioVal === '折线图'" class="chart" id="chartLine" style="height: calc(100% - 170px)"></div>
|
||||||
|
<el-table v-show="radioVal === '表格'" v-loading="loading" :data="historyObj.tableHistoryList" height="calc(100% - 170px)">
|
||||||
|
<el-table-column label="序号" width="50" type="index" align="center">
|
||||||
|
<template #default="scope">
|
||||||
|
<span>{{ scope.$index + 1 }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="分期日期" align="center" prop="time" />
|
||||||
|
<el-table-column label="分期金额（本息）" align="center" prop="value" />
|
||||||
|
<el-table-column prop="detail" label="分期金额明细" width="700" v-if="queryParams.type === 2">
|
||||||
|
<template #default="scope">
|
||||||
|
<span v-html="formatMultiLineData(scope.row.detail)"></span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -203,7 +207,11 @@ function getCreditCardList() {
|
|||||||
creditCardList.value = response.rows
|
creditCardList.value = response.rows
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
function formatMultiLineData(data) {
|
||||||
|
if (data != null) {
|
||||||
|
return data.replace(/<br\/>/g, '<br/>')
|
||||||
|
}
|
||||||
|
}
|
||||||
const handleTimeChange = (type) => {
|
const handleTimeChange = (type) => {
|
||||||
queryParams.value.time = null
|
queryParams.value.time = null
|
||||||
if (type === 2) {
|
if (type === 2) {
|
||||||
|
|||||||
@@ -1,196 +1,206 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<div class="search-con">
|
<div class="search-con">
|
||||||
<div class="title">查询条件</div>
|
<div class="title">查询条件</div>
|
||||||
<el-form :model="queryParams" ref="queryRef" :inline="true" :rules="rules" label-width="100px">
|
<el-form :model="queryParams" ref="queryRef" :inline="true" :rules="rules" label-width="100px">
|
||||||
<el-form-item label="" prop="type">
|
<el-form-item label="" prop="type">
|
||||||
<el-select v-model="queryParams.type" @change="handleTimeChange" placeholder="请选择日期">
|
<el-select v-model="queryParams.type" @change="handleTimeChange" placeholder="请选择日期">
|
||||||
<el-option v-for="item in dates" :key="item.value" :label="item.label" :value="item.value" />
|
<el-option v-for="item in dates" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="time" v-if="queryParams.type === 1">
|
<el-form-item label="" prop="time" v-if="queryParams.type === 1">
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
v-model="queryParams.time"
|
v-model="queryParams.time"
|
||||||
type="daterange"
|
type="daterange"
|
||||||
range-separator="~"
|
range-separator="~"
|
||||||
start-placeholder="开始时间"
|
start-placeholder="开始时间"
|
||||||
end-placeholder="结束时间"
|
end-placeholder="结束时间"
|
||||||
format="YYYY-MM-DD"
|
format="YYYY-MM-DD"
|
||||||
@calendar-change="calendarChange"
|
@calendar-change="calendarChange"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="time" v-if="queryParams.type === 2">
|
<el-form-item label="" prop="time" v-if="queryParams.type === 2">
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
v-model="queryParams.time"
|
v-model="queryParams.time"
|
||||||
type="monthrange"
|
type="monthrange"
|
||||||
range-separator="~"
|
range-separator="~"
|
||||||
format="YYYY-MM"
|
format="YYYY-MM"
|
||||||
start-placeholder="开始时间"
|
start-placeholder="开始时间"
|
||||||
end-placeholder="结束时间"
|
end-placeholder="结束时间"
|
||||||
:disabled-date="disabledDateFun"
|
:disabled-date="disabledDateFun"
|
||||||
@calendar-change="calendarChange"
|
@calendar-change="calendarChange"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="time" v-if="queryParams.type === 3">
|
<el-form-item label="" prop="time" v-if="queryParams.type === 3">
|
||||||
<yearPicker
|
<yearPicker
|
||||||
v-model="queryParams.time"
|
v-model="queryParams.time"
|
||||||
ref="statisticPicker"
|
ref="statisticPicker"
|
||||||
labelText="选择年份"
|
labelText="选择年份"
|
||||||
:initYear="dateValue"
|
:initYear="dateValue"
|
||||||
:showYear="showYearValue"
|
:showYear="showYearValue"
|
||||||
:maxLength="5"
|
:maxLength="5"
|
||||||
sp="~"
|
sp="~"
|
||||||
@updateTimeRange="updateStatisticYear"
|
@updateTimeRange="updateStatisticYear"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
<div class="search-btn-con">
|
<div class="search-btn-con">
|
||||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||||
<el-button type="info" icon="Refresh" @click="resetQuery">重置</el-button>
|
<el-button type="info" icon="Refresh" @click="resetQuery">重置</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="main-con" style="height: calc(100% - 1.45rem)">
|
||||||
|
<div class="summary-con" style="height: 115px">
|
||||||
|
<div class="right-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">近1月硬查询</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ creditRecord.lastOneMonths }}</span> <span class="unit">次</span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="main-con" style="height: calc(100% - 1.45rem)">
|
<div class="right-con">
|
||||||
<div class="summary-con" style="height: 115px" >
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
<div class="right-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/average.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">近1月硬查询</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ creditRecord.lastOneMonths }}</span> <span class="unit">次</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="right-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/average.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">近2月硬查询</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ creditRecord.lastTwoMonths }}</span> <span class="unit">次</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="right-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/average.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">近3月硬查询</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ creditRecord.lastThreeMonths }}</span> <span class="unit">次</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="center-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/average.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">近6月硬查询</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ creditRecord.lastSixMonths }}</span>次
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="center-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/average.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">近1年硬查询</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ creditRecord.lastOneYears }}</span>次
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="summary-con" style="height: 110px;">
|
<div class="item-wrap">
|
||||||
<div class="center-con">
|
<div class="title">近2月硬查询</div>
|
||||||
<div class="img">
|
<div>
|
||||||
<img src="@/assets/images/average.png" alt="" />
|
<span class="num">{{ creditRecord.lastTwoMonths }}</span> <span class="unit">次</span>
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">近2年硬查询</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ creditRecord.lastTwoYears }}</span>次
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="center-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/average.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">近6月个人查询</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ creditRecord.lastSixMonthPersonalCount }}</span>次
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="center-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/average.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">个人查询总数</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ creditRecord.totalPersonalCount }}</span>次
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="center-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/average.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">近2年贷后管理</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ creditRecord.lastTwoYearsAfterLoan }}</span>次
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="center-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/average.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">贷后管理总数</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ creditRecord.totalAfterLoan }}</span>次
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div class="title-con" style="margin-top: 18px">
|
|
||||||
<div class="title">征信查询统计</div>
|
|
||||||
<div class="operate-btn-con">
|
|
||||||
<el-radio-group v-model="radioVal" @change="handleRadioChange">
|
|
||||||
<el-radio-button label="柱状图" />
|
|
||||||
<el-radio-button label="折线图" />
|
|
||||||
<el-radio-button label="表格" />
|
|
||||||
</el-radio-group>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="content-con">
|
|
||||||
<div v-show="radioVal === '柱状图'" class="chart" id="chartBar" style="height: calc(100% - 225px);margin-top: -10px;"></div>
|
|
||||||
<div v-show="radioVal === '折线图'" class="chart" id="chartLine" style="height: calc(100% - 225px);margin-top: -10px;"></div>
|
|
||||||
<el-table v-show="radioVal === '表格'" v-loading="loading" :data="creditRecord.tableCreditRecordsList" height="calc(100% - 245px)">
|
|
||||||
<el-table-column label="序号" width="50" type="index" align="center">
|
|
||||||
<template #default="scope">
|
|
||||||
<span>{{ scope.$index + 1 }}</span>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column label="查询日期" align="center" prop="time" />
|
|
||||||
<el-table-column label="查询次数" align="center" prop="value" />
|
|
||||||
</el-table>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="right-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">近3月硬查询</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ creditRecord.lastThreeMonths }}</span> <span class="unit">次</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="center-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">近6月硬查询</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ creditRecord.lastSixMonths }}</span
|
||||||
|
>次
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="center-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">近1年硬查询</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ creditRecord.lastOneYears }}</span
|
||||||
|
>次
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="summary-con" style="height: 110px">
|
||||||
|
<div class="center-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">近2年硬查询</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ creditRecord.lastTwoYears }}</span
|
||||||
|
>次
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="center-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">近6月个人查询</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ creditRecord.lastSixMonthPersonalCount }}</span
|
||||||
|
>次
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="center-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">个人查询总数</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ creditRecord.totalPersonalCount }}</span
|
||||||
|
>次
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="center-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">近2年贷后管理</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ creditRecord.lastTwoYearsAfterLoan }}</span
|
||||||
|
>次
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="center-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">贷后管理总数</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ creditRecord.totalAfterLoan }}</span
|
||||||
|
>次
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="title-con" style="margin-top: 18px">
|
||||||
|
<div class="title">征信查询统计</div>
|
||||||
|
<div class="operate-btn-con">
|
||||||
|
<el-radio-group v-model="radioVal" @change="handleRadioChange">
|
||||||
|
<el-radio-button label="柱状图" />
|
||||||
|
<el-radio-button label="折线图" />
|
||||||
|
<el-radio-button label="表格" />
|
||||||
|
</el-radio-group>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="content-con">
|
||||||
|
<div v-show="radioVal === '柱状图'" class="chart" id="chartBar" style="height: calc(100% - 225px); margin-top: -10px"></div>
|
||||||
|
<div v-show="radioVal === '折线图'" class="chart" id="chartLine" style="height: calc(100% - 225px); margin-top: -10px"></div>
|
||||||
|
<el-table v-show="radioVal === '表格'" v-loading="loading" :data="creditRecord.tableCreditRecordsList" height="calc(100% - 245px)">
|
||||||
|
<el-table-column label="序号" width="50" type="index" align="center">
|
||||||
|
<template #default="scope">
|
||||||
|
<span>{{ scope.$index + 1 }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="查询日期" align="center" prop="time" />
|
||||||
|
<el-table-column label="查询次数" align="center" prop="value" />
|
||||||
|
<el-table-column prop="detail" label="查询明细" width="700" v-if="queryParams.type === 1">
|
||||||
|
<template #default="scope">
|
||||||
|
<span v-html="formatMultiLineData(scope.row.detail)"></span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -273,7 +283,11 @@ const handleTimeChange = (type) => {
|
|||||||
}
|
}
|
||||||
getList()
|
getList()
|
||||||
}
|
}
|
||||||
|
function formatMultiLineData(data) {
|
||||||
|
if (data != null) {
|
||||||
|
return data.replace(/<br\/>/g, '<br/>')
|
||||||
|
}
|
||||||
|
}
|
||||||
const disabledDateFun = (time) => {
|
const disabledDateFun = (time) => {
|
||||||
const arr = [0, 30, 365, 365 * 5]
|
const arr = [0, 30, 365, 365 * 5]
|
||||||
const days = arr[queryParams.value.type]
|
const days = arr[queryParams.value.type]
|
||||||
|
|||||||
@@ -200,6 +200,11 @@
|
|||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="交易日期" align="center" prop="time" />
|
<el-table-column label="交易日期" align="center" prop="time" />
|
||||||
<el-table-column label="交易金额" align="center" prop="value" />
|
<el-table-column label="交易金额" align="center" prop="value" />
|
||||||
|
<el-table-column prop="detail" label="交易明细" width="700" v-if="queryParams.type === 1">
|
||||||
|
<template #default="scope">
|
||||||
|
<span v-html="formatMultiLineData(scope.row.detail)"></span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -295,7 +300,11 @@ const handleTimeChange = (type) => {
|
|||||||
}
|
}
|
||||||
getList()
|
getList()
|
||||||
}
|
}
|
||||||
|
function formatMultiLineData(data) {
|
||||||
|
if (data != null) {
|
||||||
|
return data.replace(/<br\/>/g, '<br/>')
|
||||||
|
}
|
||||||
|
}
|
||||||
const disabledDateFun = (time) => {
|
const disabledDateFun = (time) => {
|
||||||
const arr = [0, 30, 365, 365 * 5]
|
const arr = [0, 30, 365, 365 * 5]
|
||||||
const days = arr[queryParams.value.type]
|
const days = arr[queryParams.value.type]
|
||||||
|
|||||||
@@ -1,132 +1,136 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<div class="search-con">
|
<div class="search-con">
|
||||||
<div class="title">查询条件</div>
|
<div class="title">查询条件</div>
|
||||||
<el-form :model="queryParams" ref="queryRef" :inline="true" :rules="rules" label-width="100px">
|
<el-form :model="queryParams" ref="queryRef" :inline="true" :rules="rules" label-width="100px">
|
||||||
<el-form-item label="期货账户" prop="futureStocksId">
|
<el-form-item label="期货账户" prop="futureStocksId">
|
||||||
<el-select v-model="queryParams.id" placeholder="请选择期货账户" clearable>
|
<el-select v-model="queryParams.id" placeholder="请选择期货账户" clearable>
|
||||||
<el-option v-for="futureStocks in futureStocksList" :key="futureStocks.id" :label="futureStocks.nameCode" :value="futureStocks.id" />
|
<el-option v-for="futureStocks in futureStocksList" :key="futureStocks.id" :label="futureStocks.nameCode" :value="futureStocks.id" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="type">
|
<el-form-item label="" prop="type">
|
||||||
<el-select v-model="queryParams.type" @change="handleTimeChange" placeholder="请选择日期">
|
<el-select v-model="queryParams.type" @change="handleTimeChange" placeholder="请选择日期">
|
||||||
<el-option v-for="item in dates" :key="item.value" :label="item.label" :value="item.value" />
|
<el-option v-for="item in dates" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="time" v-if="queryParams.type === 1">
|
<el-form-item label="" prop="time" v-if="queryParams.type === 1">
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
v-model="queryParams.time"
|
v-model="queryParams.time"
|
||||||
type="daterange"
|
type="daterange"
|
||||||
range-separator="~"
|
range-separator="~"
|
||||||
start-placeholder="开始时间"
|
start-placeholder="开始时间"
|
||||||
end-placeholder="结束时间"
|
end-placeholder="结束时间"
|
||||||
format="YYYY-MM-DD"
|
format="YYYY-MM-DD"
|
||||||
:disabled-date="disabledDateFun"
|
:disabled-date="disabledDateFun"
|
||||||
@calendar-change="calendarChange"
|
@calendar-change="calendarChange"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="time" v-if="queryParams.type === 2">
|
<el-form-item label="" prop="time" v-if="queryParams.type === 2">
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
v-model="queryParams.time"
|
v-model="queryParams.time"
|
||||||
type="monthrange"
|
type="monthrange"
|
||||||
range-separator="~"
|
range-separator="~"
|
||||||
format="YYYY-MM"
|
format="YYYY-MM"
|
||||||
start-placeholder="开始时间"
|
start-placeholder="开始时间"
|
||||||
end-placeholder="结束时间"
|
end-placeholder="结束时间"
|
||||||
:disabled-date="disabledDateFun"
|
:disabled-date="disabledDateFun"
|
||||||
@calendar-change="calendarChange"
|
@calendar-change="calendarChange"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="time" v-if="queryParams.type === 3">
|
<el-form-item label="" prop="time" v-if="queryParams.type === 3">
|
||||||
<yearPicker
|
<yearPicker
|
||||||
v-model="queryParams.time"
|
v-model="queryParams.time"
|
||||||
ref="statisticPicker"
|
ref="statisticPicker"
|
||||||
labelText="选择年份"
|
labelText="选择年份"
|
||||||
:initYear="dateValue"
|
:initYear="dateValue"
|
||||||
:showYear="showYearValue"
|
:showYear="showYearValue"
|
||||||
:maxLength="10"
|
:maxLength="10"
|
||||||
sp="~"
|
sp="~"
|
||||||
@updateTimeRange="updateStatisticYear"
|
@updateTimeRange="updateStatisticYear"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
<div class="search-btn-con">
|
<div class="search-btn-con">
|
||||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||||
<el-button type="info" icon="Refresh" @click="resetQuery">重置</el-button>
|
<el-button type="info" icon="Refresh" @click="resetQuery">重置</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="main-con" style="height: calc(100% - 2.05rem)">
|
||||||
|
<div class="summary-con">
|
||||||
|
<div class="right-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/accumulate.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">累计收益</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ futuresStock.accumulateIncome }}</span> <span class="unit"></span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="main-con" style="height: calc(100% - 2.05rem)">
|
<div class="center-con">
|
||||||
<div class="summary-con">
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
<div class="right-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/accumulate.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">累计收益</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ futuresStock.accumulateIncome }}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="center-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/average.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">平均收益</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ futuresStock.averageIncome }}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="center-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/chart-pie.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">最大收益</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ futuresStock.maxRevenue }}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="center-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/accumulate.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">最大亏损</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ futuresStock.maxLoss }}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="title-con">
|
<div class="item-wrap">
|
||||||
<div class="title">收益统计</div>
|
<div class="title">平均收益</div>
|
||||||
<div class="operate-btn-con">
|
<div>
|
||||||
<el-radio-group v-model="radioVal" @change="handleRadioChange">
|
<span class="num">{{ futuresStock.averageIncome }}</span> <span class="unit"></span>
|
||||||
<el-radio-button label="柱状图" />
|
|
||||||
<el-radio-button label="折线图" />
|
|
||||||
<el-radio-button label="表格" />
|
|
||||||
</el-radio-group>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="content-con">
|
|
||||||
<div v-show="radioVal === '柱状图'" class="chart" id="chartBar" style="height: calc(100% - 170px)"></div>
|
|
||||||
<div v-show="radioVal === '折线图'" class="chart" id="chartLine" style="height: calc(100% - 170px)"></div>
|
|
||||||
<el-table v-show="radioVal === '表格'" v-loading="loading" :data="futuresStock.tableFuturesStocksList" height="calc(100% - 170px)">
|
|
||||||
<el-table-column label="序号" width="50" type="index" align="center">
|
|
||||||
<template #default="scope">
|
|
||||||
<span>{{ scope.$index + 1 }}</span>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column label="统计日期" align="center" prop="time" />
|
|
||||||
<el-table-column label="收益" align="center" prop="value" />
|
|
||||||
</el-table>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="center-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/chart-pie.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">最大收益</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ futuresStock.maxRevenue }}</span> <span class="unit"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="center-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/accumulate.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">最大亏损</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ futuresStock.maxLoss }}</span> <span class="unit"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="title-con">
|
||||||
|
<div class="title">收益统计</div>
|
||||||
|
<div class="operate-btn-con">
|
||||||
|
<el-radio-group v-model="radioVal" @change="handleRadioChange">
|
||||||
|
<el-radio-button label="柱状图" />
|
||||||
|
<el-radio-button label="折线图" />
|
||||||
|
<el-radio-button label="表格" />
|
||||||
|
</el-radio-group>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="content-con">
|
||||||
|
<div v-show="radioVal === '柱状图'" class="chart" id="chartBar" style="height: calc(100% - 170px)"></div>
|
||||||
|
<div v-show="radioVal === '折线图'" class="chart" id="chartLine" style="height: calc(100% - 170px)"></div>
|
||||||
|
<el-table v-show="radioVal === '表格'" v-loading="loading" :data="futuresStock.tableFuturesStocksList" height="calc(100% - 170px)">
|
||||||
|
<el-table-column label="序号" width="50" type="index" align="center">
|
||||||
|
<template #default="scope">
|
||||||
|
<span>{{ scope.$index + 1 }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="统计日期" align="center" prop="time" />
|
||||||
|
<el-table-column label="收益" align="center" prop="value" />
|
||||||
|
<el-table-column prop="detail" label="收益明细" width="700" v-if="queryParams.type === 2">
|
||||||
|
<template #default="scope">
|
||||||
|
<span v-html="formatMultiLineData(scope.row.detail)"></span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -194,7 +198,7 @@ const data = reactive({
|
|||||||
|
|
||||||
const { queryParams, queryFutureStocksListParams, rules } = toRefs(data)
|
const { queryParams, queryFutureStocksListParams, rules } = toRefs(data)
|
||||||
const today = new Date()
|
const today = new Date()
|
||||||
const end = today.getFullYear() + '-' + ('0' + (today.getMonth())).slice(-2)
|
const end = today.getFullYear() + '-' + ('0' + today.getMonth()).slice(-2)
|
||||||
const start = dayjs(end).add(-59, 'months')
|
const start = dayjs(end).add(-59, 'months')
|
||||||
queryParams.value.time = [start, end]
|
queryParams.value.time = [start, end]
|
||||||
/** 查询期货股票卡管理列表 */
|
/** 查询期货股票卡管理列表 */
|
||||||
@@ -204,11 +208,16 @@ function getFutureStocksList() {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function formatMultiLineData(data) {
|
||||||
|
if (data != null) {
|
||||||
|
return data.replace(/<br\/>/g, '<br/>')
|
||||||
|
}
|
||||||
|
}
|
||||||
const handleTimeChange = (type) => {
|
const handleTimeChange = (type) => {
|
||||||
queryParams.value.time = null
|
queryParams.value.time = null
|
||||||
if (type === 2) {
|
if (type === 2) {
|
||||||
const today = new Date()
|
const today = new Date()
|
||||||
const end = today.getFullYear() + '-' + ('0' + (today.getMonth())).slice(-2)
|
const end = today.getFullYear() + '-' + ('0' + today.getMonth()).slice(-2)
|
||||||
const start = dayjs(end).add(-59, 'months')
|
const start = dayjs(end).add(-59, 'months')
|
||||||
queryParams.value.time = [start, end]
|
queryParams.value.time = [start, end]
|
||||||
} else if (type === 3) {
|
} else if (type === 3) {
|
||||||
|
|||||||
@@ -1,92 +1,91 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<div class="search-con">
|
<div class="search-con">
|
||||||
<div class="title">查询条件</div>
|
<div class="title">查询条件</div>
|
||||||
<el-form :model="queryParams" ref="queryRef" :inline="true" :rules="rules" label-width="100px">
|
<el-form :model="queryParams" ref="queryRef" :inline="true" :rules="rules" label-width="100px">
|
||||||
<el-form-item label="" prop="type">
|
<el-form-item label="" prop="type">
|
||||||
<el-select v-model="queryParams.type" @change="handleTimeChange" placeholder="请选择日期">
|
<el-select v-model="queryParams.type" @change="handleTimeChange" placeholder="请选择日期">
|
||||||
<el-option v-for="item in dates" :key="item.value" :label="item.label" :value="item.value" />
|
<el-option v-for="item in dates" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="time" v-if="queryParams.type === 1">
|
<el-form-item label="" prop="time" v-if="queryParams.type === 1">
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
v-model="queryParams.time"
|
v-model="queryParams.time"
|
||||||
type="daterange"
|
type="daterange"
|
||||||
range-separator="~"
|
range-separator="~"
|
||||||
start-placeholder="开始时间"
|
start-placeholder="开始时间"
|
||||||
end-placeholder="结束时间"
|
end-placeholder="结束时间"
|
||||||
format="YYYY-MM-DD"
|
format="YYYY-MM-DD"
|
||||||
:disabled-date="disabledDateFun"
|
:disabled-date="disabledDateFun"
|
||||||
@calendar-change="calendarChange"
|
@calendar-change="calendarChange"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="time" v-if="queryParams.type === 2">
|
<el-form-item label="" prop="time" v-if="queryParams.type === 2">
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
v-model="queryParams.time"
|
v-model="queryParams.time"
|
||||||
type="monthrange"
|
type="monthrange"
|
||||||
range-separator="~"
|
range-separator="~"
|
||||||
format="YYYY-MM"
|
format="YYYY-MM"
|
||||||
start-placeholder="开始时间"
|
start-placeholder="开始时间"
|
||||||
end-placeholder="结束时间"
|
end-placeholder="结束时间"
|
||||||
:disabled-date="disabledDateFun"
|
:disabled-date="disabledDateFun"
|
||||||
@calendar-change="calendarChange"
|
@calendar-change="calendarChange"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="time" v-if="queryParams.type === 3">
|
<el-form-item label="" prop="time" v-if="queryParams.type === 3">
|
||||||
<yearPicker
|
<yearPicker
|
||||||
v-model="queryParams.time"
|
v-model="queryParams.time"
|
||||||
ref="statisticPicker"
|
ref="statisticPicker"
|
||||||
labelText="选择年份"
|
labelText="选择年份"
|
||||||
:initYear="dateValue"
|
:initYear="dateValue"
|
||||||
:showYear="showYearValue"
|
:showYear="showYearValue"
|
||||||
:maxLength="10"
|
:maxLength="10"
|
||||||
sp="~"
|
sp="~"
|
||||||
@updateTimeRange="updateStatisticYear"
|
@updateTimeRange="updateStatisticYear"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
<div class="search-btn-con">
|
<div class="search-btn-con">
|
||||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||||
<el-button type="info" icon="Refresh" @click="resetQuery">重置</el-button>
|
<el-button type="info" icon="Refresh" @click="resetQuery">重置</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="main-con" style="height: calc(100% - 2.05rem)">
|
||||||
|
<div class="summary-con">
|
||||||
|
<div class="right-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/accumulate.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">累计收益</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ futuresStock.accumulateIncome }}</span> <span class="unit"></span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="main-con" style="height: calc(100% - 2.05rem)">
|
<div class="right-con">
|
||||||
<div class="summary-con">
|
<div class="img">
|
||||||
|
<img src="@/assets/images/accumulate.png" alt="" />
|
||||||
<div class="right-con">
|
</div>
|
||||||
<div class="img">
|
<div class="item-wrap">
|
||||||
<img src="@/assets/images/accumulate.png" alt="" />
|
<div class="title">期货累计收益</div>
|
||||||
</div>
|
<div>
|
||||||
<div class="item-wrap">
|
<span class="num">{{ futuresStock.accumulateFutures }}</span> <span class="unit"></span>
|
||||||
<div class="title">累计收益</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ futuresStock.accumulateIncome }}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="right-con">
|
</div>
|
||||||
<div class="img">
|
</div>
|
||||||
<img src="@/assets/images/accumulate.png" alt="" />
|
<div class="right-con">
|
||||||
</div>
|
<div class="img">
|
||||||
<div class="item-wrap">
|
<img src="@/assets/images/accumulate.png" alt="" />
|
||||||
<div class="title">期货累计收益</div>
|
</div>
|
||||||
<div>
|
<div class="item-wrap">
|
||||||
<span class="num">{{ futuresStock.accumulateFutures }}</span> <span class="unit"></span>
|
<div class="title">股票累计收益</div>
|
||||||
</div>
|
<div>
|
||||||
</div>
|
<span class="num">{{ futuresStock.accumulateStocks }}</span> <span class="unit"></span>
|
||||||
</div>
|
</div>
|
||||||
<div class="right-con">
|
</div>
|
||||||
<div class="img">
|
</div>
|
||||||
<img src="@/assets/images/accumulate.png" alt="" />
|
<!-- <div class="center-con">
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">股票累计收益</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ futuresStock.accumulateStocks }}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- <div class="center-con">
|
|
||||||
<div class="img">
|
<div class="img">
|
||||||
<img src="@/assets/images/average.png" alt="" />
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
</div>
|
</div>
|
||||||
@@ -97,53 +96,58 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div> -->
|
</div> -->
|
||||||
<div class="center-con">
|
<div class="center-con">
|
||||||
<div class="img">
|
<div class="img">
|
||||||
<img src="@/assets/images/chart-pie.png" alt="" />
|
<img src="@/assets/images/chart-pie.png" alt="" />
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">最大收益</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ futuresStock.maxRevenue }}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="center-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/average.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">最大亏损</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ futuresStock.maxLoss }}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="title-con">
|
<div class="item-wrap">
|
||||||
<div class="title">收益统计</div>
|
<div class="title">最大收益</div>
|
||||||
<div class="operate-btn-con">
|
<div>
|
||||||
<el-radio-group v-model="radioVal" @change="handleRadioChange">
|
<span class="num">{{ futuresStock.maxRevenue }}</span>
|
||||||
<el-radio-button label="柱状图" />
|
|
||||||
<el-radio-button label="折线图" />
|
|
||||||
<el-radio-button label="表格" />
|
|
||||||
</el-radio-group>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="content-con">
|
|
||||||
<div v-show="radioVal === '柱状图'" class="chart" id="chartBar" style="height: calc(100% - 170px)"></div>
|
|
||||||
<div v-show="radioVal === '折线图'" class="chart" id="chartLine" style="height: calc(100% - 170px)"></div>
|
|
||||||
<el-table v-show="radioVal === '表格'" v-loading="loading" :data="futuresStock.tableFuturesStocksList" height="calc(100% - 170px)">
|
|
||||||
<el-table-column label="序号" width="50" type="index" align="center">
|
|
||||||
<template #default="scope">
|
|
||||||
<span>{{ scope.$index + 1 }}</span>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column label="统计日期" align="center" prop="time" />
|
|
||||||
<el-table-column label="收益" align="center" prop="value" />
|
|
||||||
</el-table>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="center-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">最大亏损</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ futuresStock.maxLoss }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="title-con">
|
||||||
|
<div class="title">收益统计</div>
|
||||||
|
<div class="operate-btn-con">
|
||||||
|
<el-radio-group v-model="radioVal" @change="handleRadioChange">
|
||||||
|
<el-radio-button label="柱状图" />
|
||||||
|
<el-radio-button label="折线图" />
|
||||||
|
<el-radio-button label="表格" />
|
||||||
|
</el-radio-group>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="content-con">
|
||||||
|
<div v-show="radioVal === '柱状图'" class="chart" id="chartBar" style="height: calc(100% - 170px)"></div>
|
||||||
|
<div v-show="radioVal === '折线图'" class="chart" id="chartLine" style="height: calc(100% - 170px)"></div>
|
||||||
|
<el-table v-show="radioVal === '表格'" v-loading="loading" :data="futuresStock.tableFuturesStocksList" height="calc(100% - 170px)">
|
||||||
|
<el-table-column label="序号" width="50" type="index" align="center">
|
||||||
|
<template #default="scope">
|
||||||
|
<span>{{ scope.$index + 1 }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="统计日期" align="center" prop="time" />
|
||||||
|
<el-table-column label="收益" align="center" prop="value" />
|
||||||
|
<el-table-column prop="detail" label="收益明细" width="700" v-if="queryParams.type === 2">
|
||||||
|
<template #default="scope">
|
||||||
|
<span v-html="formatMultiLineData(scope.row.detail)"></span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -203,14 +207,14 @@ const data = reactive({
|
|||||||
|
|
||||||
const { queryParams, rules } = toRefs(data)
|
const { queryParams, rules } = toRefs(data)
|
||||||
const today = new Date()
|
const today = new Date()
|
||||||
const end = today.getFullYear() + '-' + ('0' + (today.getMonth())).slice(-2)
|
const end = today.getFullYear() + '-' + ('0' + today.getMonth()).slice(-2)
|
||||||
const start = dayjs(end).add(-59, 'months')
|
const start = dayjs(end).add(-59, 'months')
|
||||||
queryParams.value.time = [start, end]
|
queryParams.value.time = [start, end]
|
||||||
const handleTimeChange = (type) => {
|
const handleTimeChange = (type) => {
|
||||||
queryParams.value.time = null
|
queryParams.value.time = null
|
||||||
if (type === 2) {
|
if (type === 2) {
|
||||||
const today = new Date()
|
const today = new Date()
|
||||||
const end = today.getFullYear() + '-' + ('0' + (today.getMonth())).slice(-2)
|
const end = today.getFullYear() + '-' + ('0' + today.getMonth()).slice(-2)
|
||||||
const start = dayjs(end).add(-59, 'months')
|
const start = dayjs(end).add(-59, 'months')
|
||||||
queryParams.value.time = [start, end]
|
queryParams.value.time = [start, end]
|
||||||
} else if (type === 3) {
|
} else if (type === 3) {
|
||||||
@@ -221,7 +225,11 @@ const handleTimeChange = (type) => {
|
|||||||
}
|
}
|
||||||
getList()
|
getList()
|
||||||
}
|
}
|
||||||
|
function formatMultiLineData(data) {
|
||||||
|
if (data != null) {
|
||||||
|
return data.replace(/<br\/>/g, '<br/>')
|
||||||
|
}
|
||||||
|
}
|
||||||
const disabledDateFun = (time) => {
|
const disabledDateFun = (time) => {
|
||||||
const arr = [0, 30, 365, 365 * 5]
|
const arr = [0, 30, 365, 365 * 5]
|
||||||
const days = arr[queryParams.value.type]
|
const days = arr[queryParams.value.type]
|
||||||
|
|||||||
@@ -136,6 +136,11 @@
|
|||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="还款日期" align="center" prop="time" />
|
<el-table-column label="还款日期" align="center" prop="time" />
|
||||||
<el-table-column label="待还款金额" align="center" prop="value" />
|
<el-table-column label="待还款金额" align="center" prop="value" />
|
||||||
|
<el-table-column prop="detail" label="待还款明细" width="700" v-if="queryParams.type === 1">
|
||||||
|
<template #default="scope">
|
||||||
|
<span v-html="formatMultiLineData(scope.row.detail)"></span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -221,6 +226,12 @@ function getCreditCardList() {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function formatMultiLineData(data) {
|
||||||
|
if (data != null) {
|
||||||
|
return data.replace(/<br\/>/g, '<br/>')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
const handleTimeChange = (type) => {
|
const handleTimeChange = (type) => {
|
||||||
queryParams.value.time = null
|
queryParams.value.time = null
|
||||||
if (type === 1) {
|
if (type === 1) {
|
||||||
|
|||||||
@@ -1,131 +1,135 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<div class="search-con">
|
<div class="search-con">
|
||||||
<div class="title">查询条件</div>
|
<div class="title">查询条件</div>
|
||||||
<el-form :model="queryParams" ref="queryRef" :inline="true" :rules="rules" label-width="100px">
|
<el-form :model="queryParams" ref="queryRef" :inline="true" :rules="rules" label-width="100px">
|
||||||
<el-form-item label="网贷机构" prop="bankCardLendId">
|
<el-form-item label="网贷机构" prop="bankCardLendId">
|
||||||
<el-select v-model="queryParams.id" placeholder="请选择网贷机构" clearable>
|
<el-select v-model="queryParams.id" placeholder="请选择网贷机构" clearable>
|
||||||
<el-option v-for="creditCard in creditCardList" :key="creditCard.id" :label="creditCard.nameCode" :value="creditCard.id" />
|
<el-option v-for="creditCard in creditCardList" :key="creditCard.id" :label="creditCard.nameCode" :value="creditCard.id" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="type">
|
<el-form-item label="" prop="type">
|
||||||
<el-select v-model="queryParams.type" @change="handleTimeChange" placeholder="请选择日期">
|
<el-select v-model="queryParams.type" @change="handleTimeChange" placeholder="请选择日期">
|
||||||
<el-option v-for="item in dates" :key="item.value" :label="item.label" :value="item.value" />
|
<el-option v-for="item in dates" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="time" v-if="queryParams.type === 1">
|
<el-form-item label="" prop="time" v-if="queryParams.type === 1">
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
v-model="queryParams.time"
|
v-model="queryParams.time"
|
||||||
type="daterange"
|
type="daterange"
|
||||||
range-separator="~"
|
range-separator="~"
|
||||||
start-placeholder="开始时间"
|
start-placeholder="开始时间"
|
||||||
end-placeholder="结束时间"
|
end-placeholder="结束时间"
|
||||||
format="YYYY-MM-DD"
|
format="YYYY-MM-DD"
|
||||||
@calendar-change="calendarChange"
|
@calendar-change="calendarChange"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="time" v-if="queryParams.type === 2">
|
<el-form-item label="" prop="time" v-if="queryParams.type === 2">
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
v-model="queryParams.time"
|
v-model="queryParams.time"
|
||||||
type="monthrange"
|
type="monthrange"
|
||||||
range-separator="~"
|
range-separator="~"
|
||||||
format="YYYY-MM"
|
format="YYYY-MM"
|
||||||
start-placeholder="开始时间"
|
start-placeholder="开始时间"
|
||||||
end-placeholder="结束时间"
|
end-placeholder="结束时间"
|
||||||
@calendar-change="calendarChange"
|
@calendar-change="calendarChange"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="time" v-if="queryParams.type === 3">
|
<el-form-item label="" prop="time" v-if="queryParams.type === 3">
|
||||||
<yearPicker
|
<yearPicker
|
||||||
v-model="queryParams.time"
|
v-model="queryParams.time"
|
||||||
ref="statisticPicker"
|
ref="statisticPicker"
|
||||||
labelText="选择年份"
|
labelText="选择年份"
|
||||||
:initYear="dateValue"
|
:initYear="dateValue"
|
||||||
:showYear="showYearValue"
|
:showYear="showYearValue"
|
||||||
:maxLength="20"
|
:maxLength="20"
|
||||||
sp="~"
|
sp="~"
|
||||||
@updateTimeRange="updateStatisticYear"
|
@updateTimeRange="updateStatisticYear"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
<div class="search-btn-con">
|
<div class="search-btn-con">
|
||||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||||
<el-button type="info" icon="Refresh" @click="resetQuery">重置</el-button>
|
<el-button type="info" icon="Refresh" @click="resetQuery">重置</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="main-con" style="height: calc(100% - 2.05rem)">
|
||||||
|
<div class="summary-con">
|
||||||
|
<div class="center-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/accumulate.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">已结清网贷笔数</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ historyObj.clearedCount }}</span> <span class="unit">笔</span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="main-con" style="height: calc(100% - 2.05rem)">
|
<div class="center-con">
|
||||||
<div class="summary-con">
|
<div class="img">
|
||||||
<div class="center-con">
|
<img src="@/assets/images/accumulate.png" alt="" />
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/accumulate.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">已结清网贷笔数</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ historyObj.clearedCount }}</span> <span class="unit">笔</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="center-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/accumulate.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">已结清网贷（本息）</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ historyObj.clearedTotal }}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="center-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/accumulate.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">已结清网贷（本金）</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ historyObj.clearedPrincipal}}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="center-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/accumulate.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">已结清总利息</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ historyObj.totalInterest }}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div class="title-con">
|
<div class="item-wrap">
|
||||||
<div class="title">已结清网贷统计</div>
|
<div class="title">已结清网贷（本息）</div>
|
||||||
<div class="operate-btn-con">
|
<div>
|
||||||
<el-radio-group v-model="radioVal" @change="handleRadioChange">
|
<span class="num">{{ historyObj.clearedTotal }}</span> <span class="unit"></span>
|
||||||
<el-radio-button label="柱状图" />
|
|
||||||
<el-radio-button label="折线图" />
|
|
||||||
<el-radio-button label="表格" />
|
|
||||||
</el-radio-group>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="content-con">
|
|
||||||
<div v-show="radioVal === '柱状图'" class="chart" id="chartBar" style="height: calc(100% - 170px)"></div>
|
|
||||||
<div v-show="radioVal === '折线图'" class="chart" id="chartLine" style="height: calc(100% - 170px)"></div>
|
|
||||||
<el-table v-show="radioVal === '表格'" v-loading="loading" :data="historyObj.tableHistoryList" height="calc(100% - 170px)">
|
|
||||||
<el-table-column label="序号" width="50" type="index" align="center">
|
|
||||||
<template #default="scope">
|
|
||||||
<span>{{ scope.$index + 1 }}</span>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column label="借款日期" align="center" prop="time" />
|
|
||||||
<el-table-column label="借款金额（本息）" align="center" prop="value" />
|
|
||||||
</el-table>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="center-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/accumulate.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">已结清网贷（本金）</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ historyObj.clearedPrincipal }}</span> <span class="unit"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="center-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/accumulate.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">已结清总利息</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ historyObj.totalInterest }}</span> <span class="unit"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="title-con">
|
||||||
|
<div class="title">已结清网贷统计</div>
|
||||||
|
<div class="operate-btn-con">
|
||||||
|
<el-radio-group v-model="radioVal" @change="handleRadioChange">
|
||||||
|
<el-radio-button label="柱状图" />
|
||||||
|
<el-radio-button label="折线图" />
|
||||||
|
<el-radio-button label="表格" />
|
||||||
|
</el-radio-group>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="content-con">
|
||||||
|
<div v-show="radioVal === '柱状图'" class="chart" id="chartBar" style="height: calc(100% - 170px)"></div>
|
||||||
|
<div v-show="radioVal === '折线图'" class="chart" id="chartLine" style="height: calc(100% - 170px)"></div>
|
||||||
|
<el-table v-show="radioVal === '表格'" v-loading="loading" :data="historyObj.tableHistoryList" height="calc(100% - 170px)">
|
||||||
|
<el-table-column label="序号" width="50" type="index" align="center">
|
||||||
|
<template #default="scope">
|
||||||
|
<span>{{ scope.$index + 1 }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="借款日期" align="center" prop="time" />
|
||||||
|
<el-table-column label="借款金额（本息）" align="center" prop="value" />
|
||||||
|
<el-table-column prop="detail" label="借款金额明细" width="700" v-if="queryParams.type === 2">
|
||||||
|
<template #default="scope">
|
||||||
|
<span v-html="formatMultiLineData(scope.row.detail)"></span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -220,7 +224,11 @@ const handleTimeChange = (type) => {
|
|||||||
}
|
}
|
||||||
getList()
|
getList()
|
||||||
}
|
}
|
||||||
|
function formatMultiLineData(data) {
|
||||||
|
if (data != null) {
|
||||||
|
return data.replace(/<br\/>/g, '<br/>')
|
||||||
|
}
|
||||||
|
}
|
||||||
const firstChooseDate = ref('')
|
const firstChooseDate = ref('')
|
||||||
const calendarChange = (val) => {
|
const calendarChange = (val) => {
|
||||||
firstChooseDate.value = val[0].getTime()
|
firstChooseDate.value = val[0].getTime()
|
||||||
|
|||||||
@@ -1,131 +1,135 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<div class="search-con">
|
<div class="search-con">
|
||||||
<div class="title">查询条件</div>
|
<div class="title">查询条件</div>
|
||||||
<el-form :model="queryParams" ref="queryRef" :inline="true" :rules="rules" label-width="100px">
|
<el-form :model="queryParams" ref="queryRef" :inline="true" :rules="rules" label-width="100px">
|
||||||
<el-form-item label="POS机" style="width: 500px;" prop="id">
|
<el-form-item label="POS机" style="width: 500px" prop="id">
|
||||||
<el-select v-model="queryParams.id" placeholder="请选择POS机" clearable>
|
<el-select v-model="queryParams.id" placeholder="请选择POS机" clearable>
|
||||||
<el-option v-for="pos in posMachineList" :key="pos.id" :label="pos.nameMerchantName" :value="pos.id" />
|
<el-option v-for="pos in posMachineList" :key="pos.id" :label="pos.nameMerchantName" :value="pos.id" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="type">
|
<el-form-item label="" prop="type">
|
||||||
<el-select v-model="queryParams.type" @change="handleTimeChange" placeholder="请选择日期">
|
<el-select v-model="queryParams.type" @change="handleTimeChange" placeholder="请选择日期">
|
||||||
<el-option v-for="item in dates" :key="item.value" :label="item.label" :value="item.value" />
|
<el-option v-for="item in dates" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="time" v-if="queryParams.type === 1">
|
<el-form-item label="" prop="time" v-if="queryParams.type === 1">
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
v-model="queryParams.time"
|
v-model="queryParams.time"
|
||||||
type="daterange"
|
type="daterange"
|
||||||
range-separator="~"
|
range-separator="~"
|
||||||
start-placeholder="开始时间"
|
start-placeholder="开始时间"
|
||||||
end-placeholder="结束时间"
|
end-placeholder="结束时间"
|
||||||
format="YYYY-MM-DD"
|
format="YYYY-MM-DD"
|
||||||
@calendar-change="calendarChange"
|
@calendar-change="calendarChange"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="time" v-if="queryParams.type === 2">
|
<el-form-item label="" prop="time" v-if="queryParams.type === 2">
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
v-model="queryParams.time"
|
v-model="queryParams.time"
|
||||||
type="monthrange"
|
type="monthrange"
|
||||||
range-separator="~"
|
range-separator="~"
|
||||||
format="YYYY-MM"
|
format="YYYY-MM"
|
||||||
start-placeholder="开始时间"
|
start-placeholder="开始时间"
|
||||||
end-placeholder="结束时间"
|
end-placeholder="结束时间"
|
||||||
:disabled-date="disabledDateFun"
|
:disabled-date="disabledDateFun"
|
||||||
@calendar-change="calendarChange"
|
@calendar-change="calendarChange"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="time" v-if="queryParams.type === 3">
|
<el-form-item label="" prop="time" v-if="queryParams.type === 3">
|
||||||
<yearPicker
|
<yearPicker
|
||||||
v-model="queryParams.time"
|
v-model="queryParams.time"
|
||||||
ref="statisticPicker"
|
ref="statisticPicker"
|
||||||
labelText="选择年份"
|
labelText="选择年份"
|
||||||
:initYear="dateValue"
|
:initYear="dateValue"
|
||||||
:showYear="showYearValue"
|
:showYear="showYearValue"
|
||||||
:maxLength="5"
|
:maxLength="5"
|
||||||
sp="~"
|
sp="~"
|
||||||
@updateTimeRange="updateStatisticYear"
|
@updateTimeRange="updateStatisticYear"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
<div class="search-btn-con">
|
<div class="search-btn-con">
|
||||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||||
<el-button type="info" icon="Refresh" @click="resetQuery">重置</el-button>
|
<el-button type="info" icon="Refresh" @click="resetQuery">重置</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="main-con" style="height: calc(100% - 1.45rem)">
|
||||||
|
<div class="summary-con">
|
||||||
|
<div class="right-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">刷卡金额</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ pos.amount }}</span> <span class="unit"></span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="main-con" style="height: calc(100% - 1.45rem)">
|
<div class="right-con">
|
||||||
<div class="summary-con" >
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
<div class="right-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/average.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">刷卡金额</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ pos.amount }}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="right-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/average.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">刷卡手续费</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ pos.commission }}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="right-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/average.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">入账金额</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ pos.actualAmount }}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="right-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/average.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">刷卡次数</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ pos.count }}</span> <span class="unit">次</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="title-con" >
|
<div class="item-wrap">
|
||||||
<div class="title">POS机刷卡统计</div>
|
<div class="title">刷卡手续费</div>
|
||||||
<div class="operate-btn-con">
|
<div>
|
||||||
<el-radio-group v-model="radioVal" @change="handleRadioChange">
|
<span class="num">{{ pos.commission }}</span> <span class="unit"></span>
|
||||||
<el-radio-button label="柱状图" />
|
|
||||||
<el-radio-button label="折线图" />
|
|
||||||
<el-radio-button label="表格" />
|
|
||||||
</el-radio-group>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="content-con">
|
|
||||||
<div v-show="radioVal === '柱状图'" class="chart" id="chartBar" style="height: calc(100% - 170px);"></div>
|
|
||||||
<div v-show="radioVal === '折线图'" class="chart" id="chartLine" style="height: calc(100% - 170px);"></div>
|
|
||||||
<el-table v-show="radioVal === '表格'" v-loading="loading" :data="pos.tablePosList" height="calc(100% - 170px)">
|
|
||||||
<el-table-column label="序号" width="50" type="index" align="center">
|
|
||||||
<template #default="scope">
|
|
||||||
<span>{{ scope.$index + 1 }}</span>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column label="刷卡日期" align="center" prop="time" />
|
|
||||||
<el-table-column label="刷卡金额" align="center" prop="value" />
|
|
||||||
</el-table>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="right-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">入账金额</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ pos.actualAmount }}</span> <span class="unit"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="right-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">刷卡次数</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ pos.count }}</span> <span class="unit">次</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="title-con">
|
||||||
|
<div class="title">POS机刷卡统计</div>
|
||||||
|
<div class="operate-btn-con">
|
||||||
|
<el-radio-group v-model="radioVal" @change="handleRadioChange">
|
||||||
|
<el-radio-button label="柱状图" />
|
||||||
|
<el-radio-button label="折线图" />
|
||||||
|
<el-radio-button label="表格" />
|
||||||
|
</el-radio-group>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="content-con">
|
||||||
|
<div v-show="radioVal === '柱状图'" class="chart" id="chartBar" style="height: calc(100% - 170px)"></div>
|
||||||
|
<div v-show="radioVal === '折线图'" class="chart" id="chartLine" style="height: calc(100% - 170px)"></div>
|
||||||
|
<el-table v-show="radioVal === '表格'" v-loading="loading" :data="pos.tablePosList" height="calc(100% - 170px)">
|
||||||
|
<el-table-column label="序号" width="50" type="index" align="center">
|
||||||
|
<template #default="scope">
|
||||||
|
<span>{{ scope.$index + 1 }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="刷卡日期" align="center" prop="time" />
|
||||||
|
<el-table-column label="刷卡金额" align="center" prop="value" />
|
||||||
|
<el-table-column prop="detail" label="刷卡明细" v-if="queryParams.type === 1">
|
||||||
|
<template #default="scope">
|
||||||
|
<span v-html="formatMultiLineData(scope.row.detail)"></span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -255,6 +259,12 @@ function getPosMachineList() {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function formatMultiLineData(data) {
|
||||||
|
if (data != null) {
|
||||||
|
return data.replace(/<br\/>/g, '<br/>')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function getList() {
|
function getList() {
|
||||||
loading.value = true
|
loading.value = true
|
||||||
chartData.value = { name: [], value1: [] }
|
chartData.value = { name: [], value1: [] }
|
||||||
|
|||||||
@@ -1,132 +1,136 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<div class="search-con">
|
<div class="search-con">
|
||||||
<div class="title">查询条件</div>
|
<div class="title">查询条件</div>
|
||||||
<el-form :model="queryParams" ref="queryRef" :inline="true" :rules="rules" label-width="100px">
|
<el-form :model="queryParams" ref="queryRef" :inline="true" :rules="rules" label-width="100px">
|
||||||
<el-form-item label="股票账户" prop="futureStocksId">
|
<el-form-item label="股票账户" prop="futureStocksId">
|
||||||
<el-select v-model="queryParams.id" placeholder="请选择股票账户" clearable>
|
<el-select v-model="queryParams.id" placeholder="请选择股票账户" clearable>
|
||||||
<el-option v-for="futureStocks in futureStocksList" :key="futureStocks.id" :label="futureStocks.nameCode" :value="futureStocks.id" />
|
<el-option v-for="futureStocks in futureStocksList" :key="futureStocks.id" :label="futureStocks.nameCode" :value="futureStocks.id" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="type">
|
<el-form-item label="" prop="type">
|
||||||
<el-select v-model="queryParams.type" @change="handleTimeChange" placeholder="请选择日期">
|
<el-select v-model="queryParams.type" @change="handleTimeChange" placeholder="请选择日期">
|
||||||
<el-option v-for="item in dates" :key="item.value" :label="item.label" :value="item.value" />
|
<el-option v-for="item in dates" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="time" v-if="queryParams.type === 1">
|
<el-form-item label="" prop="time" v-if="queryParams.type === 1">
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
v-model="queryParams.time"
|
v-model="queryParams.time"
|
||||||
type="daterange"
|
type="daterange"
|
||||||
range-separator="~"
|
range-separator="~"
|
||||||
start-placeholder="开始时间"
|
start-placeholder="开始时间"
|
||||||
end-placeholder="结束时间"
|
end-placeholder="结束时间"
|
||||||
format="YYYY-MM-DD"
|
format="YYYY-MM-DD"
|
||||||
:disabled-date="disabledDateFun"
|
:disabled-date="disabledDateFun"
|
||||||
@calendar-change="calendarChange"
|
@calendar-change="calendarChange"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="time" v-if="queryParams.type === 2">
|
<el-form-item label="" prop="time" v-if="queryParams.type === 2">
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
v-model="queryParams.time"
|
v-model="queryParams.time"
|
||||||
type="monthrange"
|
type="monthrange"
|
||||||
range-separator="~"
|
range-separator="~"
|
||||||
format="YYYY-MM"
|
format="YYYY-MM"
|
||||||
start-placeholder="开始时间"
|
start-placeholder="开始时间"
|
||||||
end-placeholder="结束时间"
|
end-placeholder="结束时间"
|
||||||
:disabled-date="disabledDateFun"
|
:disabled-date="disabledDateFun"
|
||||||
@calendar-change="calendarChange"
|
@calendar-change="calendarChange"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" prop="time" v-if="queryParams.type === 3">
|
<el-form-item label="" prop="time" v-if="queryParams.type === 3">
|
||||||
<yearPicker
|
<yearPicker
|
||||||
v-model="queryParams.time"
|
v-model="queryParams.time"
|
||||||
ref="statisticPicker"
|
ref="statisticPicker"
|
||||||
labelText="选择年份"
|
labelText="选择年份"
|
||||||
:initYear="dateValue"
|
:initYear="dateValue"
|
||||||
:showYear="showYearValue"
|
:showYear="showYearValue"
|
||||||
:maxLength="10"
|
:maxLength="10"
|
||||||
sp="~"
|
sp="~"
|
||||||
@updateTimeRange="updateStatisticYear"
|
@updateTimeRange="updateStatisticYear"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
<div class="search-btn-con">
|
<div class="search-btn-con">
|
||||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||||
<el-button type="info" icon="Refresh" @click="resetQuery">重置</el-button>
|
<el-button type="info" icon="Refresh" @click="resetQuery">重置</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="main-con" style="height: calc(100% - 2.05rem)">
|
||||||
|
<div class="summary-con">
|
||||||
|
<div class="right-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/accumulate.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">累计收益</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ futuresStock.accumulateIncome }}</span> <span class="unit"></span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="main-con" style="height: calc(100% - 2.05rem)">
|
<div class="center-con">
|
||||||
<div class="summary-con">
|
<div class="img">
|
||||||
|
<img src="@/assets/images/average.png" alt="" />
|
||||||
<div class="right-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/accumulate.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">累计收益</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ futuresStock.accumulateIncome }}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="center-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/average.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">平均收益</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ futuresStock.averageIncome }}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="center-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/chart-pie.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">最大收益</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ futuresStock.maxRevenue }}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="center-con">
|
|
||||||
<div class="img">
|
|
||||||
<img src="@/assets/images/accumulate.png" alt="" />
|
|
||||||
</div>
|
|
||||||
<div class="item-wrap">
|
|
||||||
<div class="title">最大亏损</div>
|
|
||||||
<div>
|
|
||||||
<span class="num">{{ futuresStock.maxLoss }}</span> <span class="unit"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="title-con">
|
<div class="item-wrap">
|
||||||
<div class="title">收益统计</div>
|
<div class="title">平均收益</div>
|
||||||
<div class="operate-btn-con">
|
<div>
|
||||||
<el-radio-group v-model="radioVal" @change="handleRadioChange">
|
<span class="num">{{ futuresStock.averageIncome }}</span> <span class="unit"></span>
|
||||||
<el-radio-button label="柱状图" />
|
|
||||||
<el-radio-button label="折线图" />
|
|
||||||
<el-radio-button label="表格" />
|
|
||||||
</el-radio-group>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="content-con">
|
|
||||||
<div v-show="radioVal === '柱状图'" class="chart" id="chartBar" style="height: calc(100% - 170px)"></div>
|
|
||||||
<div v-show="radioVal === '折线图'" class="chart" id="chartLine" style="height: calc(100% - 170px)"></div>
|
|
||||||
<el-table v-show="radioVal === '表格'" v-loading="loading" :data="futuresStock.tableFuturesStocksList" height="calc(100% - 170px)">
|
|
||||||
<el-table-column label="序号" width="50" type="index" align="center">
|
|
||||||
<template #default="scope">
|
|
||||||
<span>{{ scope.$index + 1 }}</span>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column label="统计日期" align="center" prop="time" />
|
|
||||||
<el-table-column label="收益" align="center" prop="value" />
|
|
||||||
</el-table>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="center-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/chart-pie.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">最大收益</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ futuresStock.maxRevenue }}</span> <span class="unit"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="center-con">
|
||||||
|
<div class="img">
|
||||||
|
<img src="@/assets/images/accumulate.png" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="item-wrap">
|
||||||
|
<div class="title">最大亏损</div>
|
||||||
|
<div>
|
||||||
|
<span class="num">{{ futuresStock.maxLoss }}</span> <span class="unit"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="title-con">
|
||||||
|
<div class="title">收益统计</div>
|
||||||
|
<div class="operate-btn-con">
|
||||||
|
<el-radio-group v-model="radioVal" @change="handleRadioChange">
|
||||||
|
<el-radio-button label="柱状图" />
|
||||||
|
<el-radio-button label="折线图" />
|
||||||
|
<el-radio-button label="表格" />
|
||||||
|
</el-radio-group>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="content-con">
|
||||||
|
<div v-show="radioVal === '柱状图'" class="chart" id="chartBar" style="height: calc(100% - 170px)"></div>
|
||||||
|
<div v-show="radioVal === '折线图'" class="chart" id="chartLine" style="height: calc(100% - 170px)"></div>
|
||||||
|
<el-table v-show="radioVal === '表格'" v-loading="loading" :data="futuresStock.tableFuturesStocksList" height="calc(100% - 170px)">
|
||||||
|
<el-table-column label="序号" width="50" type="index" align="center">
|
||||||
|
<template #default="scope">
|
||||||
|
<span>{{ scope.$index + 1 }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="统计日期" align="center" prop="time" />
|
||||||
|
<el-table-column label="收益" align="center" prop="value" />
|
||||||
|
<el-table-column prop="detail" label="收益明细" width="700" v-if="queryParams.type === 2">
|
||||||
|
<template #default="scope">
|
||||||
|
<span v-html="formatMultiLineData(scope.row.detail)"></span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -195,7 +199,7 @@ const data = reactive({
|
|||||||
|
|
||||||
const { queryParams, queryFutureStocksListParams, rules } = toRefs(data)
|
const { queryParams, queryFutureStocksListParams, rules } = toRefs(data)
|
||||||
const today = new Date()
|
const today = new Date()
|
||||||
const end = today.getFullYear() + '-' + ('0' + (today.getMonth())).slice(-2)
|
const end = today.getFullYear() + '-' + ('0' + today.getMonth()).slice(-2)
|
||||||
const start = dayjs(end).add(-59, 'months')
|
const start = dayjs(end).add(-59, 'months')
|
||||||
queryParams.value.time = [start, end]
|
queryParams.value.time = [start, end]
|
||||||
/** 查询期货股票卡管理列表 */
|
/** 查询期货股票卡管理列表 */
|
||||||
@@ -205,11 +209,16 @@ function getFutureStocksList() {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function formatMultiLineData(data) {
|
||||||
|
if (data != null) {
|
||||||
|
return data.replace(/<br\/>/g, '<br/>')
|
||||||
|
}
|
||||||
|
}
|
||||||
const handleTimeChange = (type) => {
|
const handleTimeChange = (type) => {
|
||||||
queryParams.value.time = null
|
queryParams.value.time = null
|
||||||
if (type === 2) {
|
if (type === 2) {
|
||||||
const today = new Date()
|
const today = new Date()
|
||||||
const end = today.getFullYear() + '-' + ('0' + (today.getMonth())).slice(-2)
|
const end = today.getFullYear() + '-' + ('0' + today.getMonth()).slice(-2)
|
||||||
const start = dayjs(end).add(-59, 'months')
|
const start = dayjs(end).add(-59, 'months')
|
||||||
queryParams.value.time = [start, end]
|
queryParams.value.time = [start, end]
|
||||||
} else if (type === 3) {
|
} else if (type === 3) {
|
||||||
|
|||||||
Reference in New Issue
Block a user