|
@@ -1,7 +1,274 @@
|
|
|
<!-- 报表查询-机构资金报表 -->
|
|
<!-- 报表查询-机构资金报表 -->
|
|
|
<template>
|
|
<template>
|
|
|
- <app-view></app-view>
|
|
|
|
|
|
|
+ <app-view>
|
|
|
|
|
+ <template #header>
|
|
|
|
|
+ <app-filter :option="filterOption" :rules="filterRules">
|
|
|
|
|
+ <template #reckondate>
|
|
|
|
|
+ <el-form-item :label="t('report.investor.reckondate')" prop="reckondate">
|
|
|
|
|
+ <el-date-picker :type="dateType" v-model="dateValue" :format="dateFormat" :value-format="dateFormat"
|
|
|
|
|
+ :placeholder="t('common.pleasechoice')" :start-placeholder="t('common.start')" :end-placeholder="t('common.end')" @change="onDateChange" />
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <template #quarter="{ item }">
|
|
|
|
|
+ <el-form-item :label="item.label" prop="quarter"
|
|
|
|
|
+ v-if="queryParams.cycletype === ReportType.Quarter">
|
|
|
|
|
+ <el-select v-model="item.value">
|
|
|
|
|
+ <el-option v-for="option in getQuarterList()" :key="option.value" :label="option.label"
|
|
|
|
|
+ :value="option.value" />
|
|
|
|
|
+ </el-select>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ <template v-else>
|
|
|
|
|
+ {{ (item.value = undefined) }}
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <template #quarterend="{ item }">
|
|
|
|
|
+ <el-form-item :label="item.label" prop="quarterend"
|
|
|
|
|
+ v-if="queryParams.cycletype === ReportType.Quarter">
|
|
|
|
|
+ <el-select v-model="item.value">
|
|
|
|
|
+ <el-option v-for="option in getQuarterList()" :key="option.value" :label="option.label"
|
|
|
|
|
+ :value="option.value" />
|
|
|
|
|
+ </el-select>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ <template v-else>
|
|
|
|
|
+ {{ (item.value = undefined) }}
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <template #inamount>
|
|
|
|
|
+ <el-form-item :label="t('report.investor.inamount')" prop="inamount">
|
|
|
|
|
+ <el-input-number v-model="queryParams.inamount" :min="0" controls-position="right"
|
|
|
|
|
+ :placeholder="t('report.investor.tips1')" style="width: 240px;" />
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <template #outamount>
|
|
|
|
|
+ <el-form-item :label="t('report.investor.outamount')" prop="outamount">
|
|
|
|
|
+ <el-input-number v-model="queryParams.outamount" :min="0" controls-position="right"
|
|
|
|
|
+ :placeholder="t('report.investor.tips1')" style="width: 240px;" />
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <template #roles>
|
|
|
|
|
+ <el-form-item label="机构角色" prop="roles">
|
|
|
|
|
+ <el-checkbox-group v-model="roles">
|
|
|
|
|
+ <el-checkbox label="运营机构" value="2" />
|
|
|
|
|
+ <el-checkbox label="经纪会员" value="7" />
|
|
|
|
|
+ <el-checkbox label="产业会员" value="9" />
|
|
|
|
|
+ <el-checkbox label="仓库机构" value="4" />
|
|
|
|
|
+ <el-checkbox label="报价商" value="13" />
|
|
|
|
|
+ <el-checkbox label="营销中心" value="3" />
|
|
|
|
|
+ <el-checkbox label="做市会员" value="8" />
|
|
|
|
|
+ <el-checkbox label="自营会员" value="6" />
|
|
|
|
|
+ </el-checkbox-group>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </app-filter>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <app-table :data="dataList" :columns="tableColumns" :loading="loading">
|
|
|
|
|
+ <template #headerLeft>
|
|
|
|
|
+ <app-operation :data-list="getActionButtons(['report_institution_export'])"
|
|
|
|
|
+ @click="openComponentOnClick" />
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <template #footer>
|
|
|
|
|
+ <app-pagination :total="total" v-model:page-size="pageSize" v-model:page-index="pageIndex"
|
|
|
|
|
+ @change="onSearch" />
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </app-table>
|
|
|
|
|
+ <component :is="componentMap.get(componentId)" v-bind="{ record, queryParams }" @closed="closeComponent"
|
|
|
|
|
+ v-if="componentId" />
|
|
|
|
|
+ </app-view>
|
|
|
</template>
|
|
</template>
|
|
|
|
|
|
|
|
<script lang="ts" setup>
|
|
<script lang="ts" setup>
|
|
|
|
|
+import { ref, shallowRef, computed } from 'vue'
|
|
|
|
|
+import { ElMessage, FormRules } from 'element-plus'
|
|
|
|
|
+import { useDataFilter } from '@/hooks/datatable-v2'
|
|
|
|
|
+import { useEnum } from '@/hooks/enum'
|
|
|
|
|
+import { useRequest } from '@/hooks/request'
|
|
|
|
|
+import { useOperation } from '@/hooks/operation'
|
|
|
|
|
+import { investorReportQuery } from '@/services/api/report'
|
|
|
|
|
+import { getReportTypeList, ReportType, getQuarterList } from '@/constants/report'
|
|
|
|
|
+import { i18n } from '@/stores'
|
|
|
|
|
+import AppTable from '@pc/components/base/table/index.vue'
|
|
|
|
|
+import AppPagination from '@pc/components/base/pagination/index.vue'
|
|
|
|
|
+import AppOperation from '@pc/components/base/operation/index.vue'
|
|
|
|
|
+import AppFilter from '@pc/components/base/table-filter-v2/index.vue'
|
|
|
|
|
+
|
|
|
|
|
+const { global: { t } } = i18n
|
|
|
|
|
+const accountstatusEnum = useEnum('accountstatus') // 机构状态
|
|
|
|
|
+const dateValue = shallowRef<string[] | null>([])
|
|
|
|
|
+
|
|
|
|
|
+const roles = ref<string[] | null>([])
|
|
|
|
|
+
|
|
|
|
|
+const { componentMap, componentId, record, openComponent, closeComponent, getActionButtons } = useOperation<Model.InvestorReportReq>({
|
|
|
|
|
+ onClose: () => onSearch()
|
|
|
|
|
+})
|
|
|
|
|
+
|
|
|
|
|
+const { dataList, total, pageSize, pageIndex, loading, run } = useRequest(investorReportQuery, {
|
|
|
|
|
+ manual: true,
|
|
|
|
|
+ params: {
|
|
|
|
|
+ pageNum: 1,
|
|
|
|
|
+ pageSize: 20
|
|
|
|
|
+ },
|
|
|
|
|
+ onError: (err) => {
|
|
|
|
|
+ ElMessage.error(err)
|
|
|
|
|
+ }
|
|
|
|
|
+})
|
|
|
|
|
+
|
|
|
|
|
+// 日期类型
|
|
|
|
|
+const dateType = computed(() => {
|
|
|
|
|
+ switch (queryParams.value.cycletype) {
|
|
|
|
|
+ case ReportType.Week:
|
|
|
|
|
+ return 'week'
|
|
|
|
|
+ case ReportType.Month:
|
|
|
|
|
+ return 'monthrange'
|
|
|
|
|
+ case ReportType.Quarter:
|
|
|
|
|
+ return 'year'
|
|
|
|
|
+ case ReportType.Year:
|
|
|
|
|
+ return 'yearrange'
|
|
|
|
|
+ default:
|
|
|
|
|
+ return 'daterange'
|
|
|
|
|
+ }
|
|
|
|
|
+})
|
|
|
|
|
+
|
|
|
|
|
+// 日期格式
|
|
|
|
|
+const dateFormat = computed(() => {
|
|
|
|
|
+ switch (queryParams.value.cycletype) {
|
|
|
|
|
+ case ReportType.Month:
|
|
|
|
|
+ return 'YYYYMM'
|
|
|
|
|
+ case ReportType.Quarter:
|
|
|
|
|
+ case ReportType.Year:
|
|
|
|
|
+ return 'YYYY'
|
|
|
|
|
+ default:
|
|
|
|
|
+ return 'YYYYMMDD'
|
|
|
|
|
+ }
|
|
|
|
|
+})
|
|
|
|
|
+
|
|
|
|
|
+// 选择类型
|
|
|
|
|
+const onTypeChange = (value: number) => {
|
|
|
|
|
+ if (value === ReportType.Week || value === ReportType.Quarter) {
|
|
|
|
|
+ dateValue.value = []
|
|
|
|
|
+ } else {
|
|
|
|
|
+ dateValue.value = []
|
|
|
|
|
+ }
|
|
|
|
|
+ queryParams.value.reckondate = undefined
|
|
|
|
|
+ queryParams.value.reckondateend = undefined
|
|
|
|
|
+ queryParams.value.quarter = undefined
|
|
|
|
|
+ queryParams.value.quarterend = undefined
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+// 选择日期
|
|
|
|
|
+const onDateChange = () => {
|
|
|
|
|
+ if (Array.isArray(dateValue.value)) {
|
|
|
|
|
+ const [startDate, endDate] = dateValue.value
|
|
|
|
|
+ queryParams.value.reckondate = startDate
|
|
|
|
|
+ queryParams.value.reckondateend = endDate
|
|
|
|
|
+ } else {
|
|
|
|
|
+ queryParams.value.reckondate = dateValue.value ?? ''
|
|
|
|
|
+ queryParams.value.reckondateend = dateValue.value ?? ''
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+const tableColumns = ref<Model.TableColumn[]>([
|
|
|
|
|
+ { field: 'reckondate', label: '日期' },
|
|
|
|
|
+ { field: 'accountid', label: '资金账户' },
|
|
|
|
|
+ { field: 'accountname', label: '账户' },
|
|
|
|
|
+ { field: 'balance', label: '期初余额' },
|
|
|
|
|
+ { field: 'currentbalance', label: '期末余额' },
|
|
|
|
|
+ { field: 'inamount', label: '入金金额' },
|
|
|
|
|
+ { field: 'outamount', label: '出金金额' },
|
|
|
|
|
+ { field: 'closepl', label: '转让损益' },
|
|
|
|
|
+ { field: 'floatpl', label: '浮动损益' },
|
|
|
|
|
+ { field: 'reckonpl', label: '结算损益' },
|
|
|
|
|
+ { field: 'paycharge', label: '手续费' },
|
|
|
|
|
+ { field: 'interestCharge', label: '递延费' },
|
|
|
|
|
+ { field: 'otherincome', label: '分润收入' },
|
|
|
|
|
+ { field: 'usedmargin', label: '占用资金' },
|
|
|
|
|
+ { field: 'freezemargin', label: '冻结资金' },
|
|
|
|
|
+ { field: 'outamountfreeze', label: '出金冻结' },
|
|
|
|
|
+ { field: 'avaiablemoney', label: '可用资金' },
|
|
|
|
|
+ { field: 'avaiableoutmoney', label: '可出资金' },
|
|
|
|
|
+ { field: 'floatnetvalues', label: '当前净值' },
|
|
|
|
|
+])
|
|
|
|
|
+
|
|
|
|
|
+// 表单验证规则
|
|
|
|
|
+const filterRules: FormRules = {
|
|
|
|
|
+ date: [{
|
|
|
|
|
+ required: true,
|
|
|
|
|
+ validator: () => {
|
|
|
|
|
+ return !!dateValue.value && dateValue.value.length === 2
|
|
|
|
|
+ }
|
|
|
|
|
+ }]
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+const { queryParams, filterOption, getQueryParams, resetFilters } = useDataFilter<Model.InvestorReportReq>({
|
|
|
|
|
+ filters: [
|
|
|
|
|
+ {
|
|
|
|
|
+ field: 'cycletype',
|
|
|
|
|
+ label: '报表类型',
|
|
|
|
|
+ required: true,
|
|
|
|
|
+ options: () => getReportTypeList(),
|
|
|
|
|
+ onChange: () => onTypeChange
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ field: 'reckondate'
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ field: 'quarter',
|
|
|
|
|
+ label: '开始季度',
|
|
|
|
|
+ required: true
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ field: 'quarterend',
|
|
|
|
|
+ label: '结束季度',
|
|
|
|
|
+ required: true
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ field: 'inamount',
|
|
|
|
|
+ label: '入金金额',
|
|
|
|
|
+ placeholder: '查询>=次数值'
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ field: 'outamount',
|
|
|
|
|
+ label: '出金金额',
|
|
|
|
|
+ placeholder: '查询>=次数值'
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ field: 'accountstatus',
|
|
|
|
|
+ label: '机构状态',
|
|
|
|
|
+ options: () => accountstatusEnum.getEnumOptions()
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ field: 'roles',
|
|
|
|
|
+ label: '机构角色',
|
|
|
|
|
+ }
|
|
|
|
|
+ ],
|
|
|
|
|
+ buttons: [
|
|
|
|
|
+ { label: t('operation.search'), className: 'el-button--primary', onClick: () => onSearch() },
|
|
|
|
|
+ { label: t('operation.reset'), className: 'el-button--primary', validateEvent: false, onClick: () => onReset() }
|
|
|
|
|
+ ]
|
|
|
|
|
+})
|
|
|
|
|
+
|
|
|
|
|
+// 处理请求参数
|
|
|
|
|
+const processRequiredParams = () => {
|
|
|
|
|
+ const qs = getQueryParams()
|
|
|
|
|
+ const [startDate, endDate] = dateValue.value || []
|
|
|
|
|
+ qs.reckondate = startDate
|
|
|
|
|
+ qs.reckondateend = endDate
|
|
|
|
|
+ qs.roles = roles.value?.join(',')
|
|
|
|
|
+ return qs
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+const onSearch = () => {
|
|
|
|
|
+ const qs = processRequiredParams()
|
|
|
|
|
+ run(qs)
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+const onReset = () => {
|
|
|
|
|
+ dateValue.value = []
|
|
|
|
|
+ resetFilters()
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+const openComponentOnClick = (code: string) => {
|
|
|
|
|
+ queryParams.value = processRequiredParams()
|
|
|
|
|
+ openComponent(code)
|
|
|
|
|
+}
|
|
|
</script>
|
|
</script>
|