Skip to content

Y
yd-csf-front
Commit c58ec623 by Sweet Zhang
Options

应收款管理、弹窗组件修改

parent 44ffb5e2
Showing with 512 additions and 363 deletions
index.html
...@@ -33,6 +33,9 @@ ...@@ -33,6 +33,9 @@
color: #383838; color: #383838;
padding: 0.2em 0; padding: 0.2em 0;
} }
.el-dialog__header.dialog-header.show-close {
padding-right: 0 ;
}
#loader-wrapper { #loader-wrapper {
position: fixed; position: fixed;
......
src/App.vue
<template> <template>
<router-view />
<el-watermark :font="font" :content="content">
<router-view />
</el-watermark>
</template> </template>
<script setup> <script setup>
import useSettingsStore from '@/store/modules/settings' import useSettingsStore from '@/store/modules/settings'
import { handleThemeStyle } from '@/utils/theme' import { handleThemeStyle } from '@/utils/theme'
import { reactive } from 'vue'
const font = reactive({
color: 'rgba(0, 0, 0, .15)',
})
const content = reactive('csf')
onMounted(() => { onMounted(() => {
nextTick(() => { nextTick(() => {
......
src/api/financial/commission.js
...@@ -256,3 +256,19 @@ export function expectedFortuneStatistics(data) { ...@@ -256,3 +256,19 @@ export function expectedFortuneStatistics(data) {
data: data data: data
}) })
} }
// 入账记录查询
export function commissionEntryRecord(data) {
return request({
url: '/csf/api/commission/compare/records',
method: 'post',
data: data
})
}
// 入账操作记录查询
export function commissionEntryEditRecords(data) {
return request({
url: '/csf/api/commission/edit/records',
method: 'post',
data: data
})
}
src/components/commonDialog/index.vue
...@@ -8,7 +8,8 @@ ...@@ -8,7 +8,8 @@
:close-on-click-modal="closeOnClickModal" :close-on-click-modal="closeOnClickModal"
:before-close="handleClose" :before-close="handleClose"
center center
:show-close="false" :show-close="showClose"
header-class="dialog-header"
> >
<template #header> <template #header>
<div class="titleBox">{{ dialogTitle }}</div> <div class="titleBox">{{ dialogTitle }}</div>
...@@ -18,7 +19,7 @@ ...@@ -18,7 +19,7 @@
</div> </div>
<template #footer> <template #footer>
<div class="dialog-footer"> <div class="dialog-footer" v-if="showAction">
<!-- 取消按钮 --> <!-- 取消按钮 -->
<el-button type="info" plain v-if="showCancle" @click="close">{{ cancleText }}</el-button> <el-button type="info" plain v-if="showCancle" @click="close">{{ cancleText }}</el-button>
<!-- 确认按钮 --> <!-- 确认按钮 -->
...@@ -50,7 +51,14 @@ const props = defineProps({ ...@@ -50,7 +51,14 @@ const props = defineProps({
type: String, type: String,
default: '确认' default: '确认'
}, },
showAction: {
type: Boolean,
default: true
},
showClose: {
type: Boolean,
default: false
},
showConfirm: { showConfirm: {
type: Boolean, type: Boolean,
default: true default: true
...@@ -78,11 +86,9 @@ const props = defineProps({ ...@@ -78,11 +86,9 @@ const props = defineProps({
const showDialog = ref(props.openDialog) const showDialog = ref(props.openDialog)
const emit = defineEmits(['confirm', 'close']) const emit = defineEmits(['confirm', 'close'])
const close = () => { const close = () => {
showDialog.value = false
emit('close') emit('close')
} }
const confirm = () => { const confirm = () => {
showDialog.value = false
emit('confirm') emit('confirm')
} }
const handleClose = done => { const handleClose = done => {
...@@ -109,6 +115,7 @@ watch( ...@@ -109,6 +115,7 @@ watch(
justify-content: center; justify-content: center;
align-items: center; align-items: center;
padding: 15px 0; padding: 15px 0;
color: rgba(0,0,0,0.9);
} }
.content { .content {
padding: 0 15px; padding: 0 15px;
...@@ -120,4 +127,5 @@ watch( ...@@ -120,4 +127,5 @@ watch(
align-items: center; align-items: center;
padding: 20px 0; padding: 20px 0;
} }
</style> </style>
src/views/financialCenter/receivables.vue
<template> statistics-cards<template>
<CommonPage <CommonPage :operationBtnList="operationBtnList" :showSearchForm="true" :show-pagination="true" :total="pageTotal"
:operationBtnList="operationBtnList" :current-page="currentPage" :page-size="pageSize" @size-change="handleSizeChange"
:showSearchForm="true" @current-change="handleCurrentChange">
:show-pagination="true" <!-- 搜索区域 -->
:total="pageTotal" <template #searchForm>
:current-page="currentPage" <SearchForm ref="searchFormRef" v-model="searchFormData" :fields="searchFields" label-position="top"
:page-size="pageSize" :label-width="null" :inline="false" :gutter="20" class="custom-search-form" />
@size-change="handleSizeChange" </template>
@current-change="handleCurrentChange" <!-- 列表区域 -->
> <template #table>
<!-- 搜索区域 --> <!-- 统计信息卡片 -->
<template #searchForm> <div class="statistics-cards" v-if="statisticsData.totalPolicyCount > 0">
<SearchForm <el-row :gutter="20">
ref="searchFormRef" <el-col :xs="24" :sm="12" :md="4" class="text-center mb-4">
v-model="searchFormData" <el-statistic title="应收款总金额" :value="statisticsData.totalAmount" />
:fields="searchFields" </el-col>
label-position="top" <el-col :xs="24" :sm="12" :md="4" class="text-center mb-4">
:label-width="null" <el-statistic title="已入账金额" :value="statisticsData.totalPaidAmount" />
:inline="false" </el-col>
:gutter="20" <el-col :xs="24" :sm="12" :md="4" class="text-center mb-4">
class="custom-search-form" <el-statistic title="待入账金额（估）" :value="statisticsData.pendingPaidAmount" />
/> </el-col>
</template> <el-col :xs="24" :sm="12" :md="4" class="text-center mb-4">
<!-- 列表区域 --> <el-statistic title="已入账比例" :value="statisticsData.paidAmountRatio" />
<template #table> </el-col>
<el-col :xs="24" :sm="12" :md="4" class="text-center mb-4">
<!-- 应收款管理列表 --> <el-statistic title="总保单数" :value="statisticsData.totalPolicyCount" />
<el-table </el-col>
:data="tableData" </el-row>
height="400" </div>
border <!-- 应收款管理列表 -->
highlight-current-row <el-table :data="tableData" height="400" border highlight-current-row style="width: 100%"
style="width: 100%" v-loading="loading">
v-loading="loading" <el-table-column prop="commissionBizType" label="应收款类型" width="120" fixed="left" sortable />
> <el-table-column prop="receivableNo" label="应收款编号" width="120" />
<el-table-column prop="commissionBizType" label="应收款类型" width="120" fixed="left" sortable /> <el-table-column prop="policyNo" label="保单号" width="120" />
<el-table-column prop="receivableNo" label="应收款编号" width="120" /> <el-table-column prop="reconciliationCompany" label="对账公司" width="120" sortable />
<el-table-column prop="policyNo" label="保单号" width="120" /> <el-table-column prop="status" label="入账状态" width="120" sortable>
<el-table-column prop="reconciliationCompany" label="对账公司" width="120" sortable /> <template #default="{ row }">
<el-table-column prop="status" label="入账状态" width="120" sortable> <el-tag :type="row.status === '1' ? 'success' : 'warning'">
<template #default="{ row }"> {{ row.status === '1' ? '已入账' : '待入账' }}
<el-tag :type="row.status === '1' ? 'success' : 'warning'"> </el-tag>
{{ row.status === '1' ? '已入账' : '待入账' }} </template>
</el-tag> </el-table-column>
</template> <el-table-column prop="commissionPeriod" label="入账期数" width="120" sortable />
</el-table-column> <el-table-column prop="totalPeriod" label="入账总期数" width="120" sortable />
<el-table-column prop="commissionPeriod" label="入账期数" width="120" sortable /> <el-table-column prop="commissionType" label="入账项目" width="120" sortable />
<el-table-column prop="totalPeriod" label="入账总期数" width="120" sortable /> <el-table-column prop="commissionDate" label="入账日(估)" width="120" sortable />
<el-table-column prop="commissionType" label="入账项目" width="120" sortable /> <el-table-column prop="commissionRatio" label="入账比例(估)" width="140" sortable>
<el-table-column prop="commissionDate" label="入账日(估)" width="120" sortable /> <template #default="{ row }">
<el-table-column prop="commissionRatio" label="入账比例(估)" width="140" sortable> {{ (row.commissionRatio || 0) + '%' }}
<template #default="{ row }"> </template>
{{ (row.commissionRatio || 0) + '%' }} </el-table-column>
</template> <el-table-column prop="expectedAmount" label="入账金额(估)" width="140" sortable>
</el-table-column> <template #default="{ row }">
<el-table-column prop="expectedAmount" label="入账金额(估)" width="140" sortable> {{ formatCurrency(row.expectedAmount) }}
<template #default="{ row }"> </template>
{{ formatCurrency(row.expectedAmount) }} </el-table-column>
</template> <el-table-column prop="paidAmountRatio" label="已入账比例" width="120" sortable>
</el-table-column> <template #default="{ row }">
<el-table-column prop="paidAmountRatio" label="已入账比例" width="120" sortable> {{ (row.paidAmountRatio || 0) + '%' }}
<template #default="{ row }"> </template>
{{ (row.paidAmountRatio || 0) + '%' }} </el-table-column>
</template> <el-table-column prop="paidAmount" label="已入账金额" width="120" sortable>
</el-table-column> <template #default="{ row }">
<el-table-column prop="paidAmount" label="已入账金额" width="120" sortable> {{ formatCurrency(row.paidAmount) }}
<template #default="{ row }"> </template>
{{ formatCurrency(row.paidAmount) }} </el-table-column>
</template> <el-table-column prop="pendingRatio" label="待入账比例" width="120" sortable>
</el-table-column> <template #default="{ row }">
<el-table-column prop="pendingRatio" label="待入账比例" width="120" sortable> {{ (row.pendingRatio || 0) + '%' }}
<template #default="{ row }"> </template>
{{ (row.pendingRatio || 0) + '%' }} </el-table-column>
</template> <el-table-column prop="pendingPaidAmount" label="待入账金额（估）" width="160" sortable>
</el-table-column> <template #default="{ row }">
<el-table-column prop="pendingPaidAmount" label="待入账金额（估）" width="160" sortable> {{ formatCurrency(row.pendingPaidAmount) }}
<template #default="{ row }"> </template>
{{ formatCurrency(row.pendingPaidAmount) }} </el-table-column>
</template> <el-table-column prop="defaultExchangeRate" label="结算汇率（估）" width="120" />
</el-table-column> <el-table-column prop="insurerBizId" label="保险公司" width="120" sortable />
<el-table-column prop="defaultExchangeRate" label="结算汇率（估）" width="120" /> <el-table-column prop="productLaunchBizId" label="产品计划" width="120" sortable />
<el-table-column prop="insurerBizId" label="保险公司" width="120" sortable /> <el-table-column prop="premium" label="期交保费" width="120" sortable>
<el-table-column prop="productLaunchBizId" label="产品计划" width="120" sortable /> <template #default="{ row }">
<el-table-column prop="premium" label="期交保费" width="120" sortable> {{ formatCurrency(row.premium) }}
<template #default="{ row }"> </template>
{{ formatCurrency(row.premium) }} </el-table-column>
</template> <el-table-column prop="remark" label="备注" width="150" />
</el-table-column> <el-table-column fixed="right" label="操作" min-width="120">
<el-table-column prop="remark" label="备注" width="150" /> <template #default="{ row }">
</el-table> <el-popover placement="right" :width="200" trigger="click">
</template> <template #reference>
</CommonPage> <el-icon>
<!-- 统计信息卡片 --> <MoreFilled />
<div class="statistics-cards" v-if="statisticsData.totalPolicyCount > 0"> </el-icon>
<el-row :gutter="20"> </template>
<el-col :xs="24" :sm="12" :md="4" :lg="4"> <el-menu @select="handleSelect($event, row)" popper-class="custom-menu">
<el-card shadow="hover" class="statistics-card"> <el-menu-item :index="item.value" v-for="item in dropdownItems" :key="item.value">{{
<div class="card-content"> item.label
<div class="card-label">应收款总金额</div> }}</el-menu-item>
<div class="card-value">{{ formatCurrency(statisticsData.totalAmount) }}</div> </el-menu>
</div> </el-popover>
</el-card> </template>
</el-col> </el-table-column>
<el-col :xs="24" :sm="12" :md="4" :lg="4"> </el-table>
<el-card shadow="hover" class="statistics-card"> </template>
<div class="card-content"> </CommonPage>
<div class="card-label">已入账金额</div> <!-- 比对状态表格弹窗-->
<div class="card-value">{{ formatCurrency(statisticsData.totalPaidAmount) }}</div> <CommonDialog dialogTitle="入账记录" dialogWidth="80%" :openDialog="entryRecordDialogTableVisible" :showAction="false" :showClose="true" @close="entryRecordDialogTableVisible=false">
</div> <el-table :data="entryRecordDialogTableData" border style="width: 100%">
</el-card> <el-table-column v-for="item in entryRecordDialogTableColumns" :key="item.property"
</el-col> :property="item.property" :label="item.label" :width="item.width" />
<el-col :xs="24" :sm="12" :md="4" :lg="4"> <el-table-column fixed="right" label="操作" min-width="120">
<el-card shadow="hover" class="statistics-card"> <template #default>
<div class="card-content"> <el-button link type="primary" size="small" @click="handleClick">
<div class="card-label">待入账金额</div> 查看比对记录
<div class="card-value">{{ formatCurrency(statisticsData.pendingPaidAmount) }}</div> </el-button>
</div> </template>
</el-card> </el-table-column>
</el-col> </el-table>
<el-col :xs="24" :sm="12" :md="4" :lg="4"> </CommonDialog>
<el-card shadow="hover" class="statistics-card">
<div class="card-content"> <!-- 操作记录表格弹窗-->
<div class="card-label">已入账比例</div> <CommonDialog dialogTitle="操作记录" dialogWidth="80%" :openDialog="actionRecordsDialogVisible" :showAction="false" :showClose="true" @close="actionRecordsDialogVisible=false">
<div class="card-value">{{ statisticsData.paidAmountRatio }}</div> <el-table :data="actionRecordsDialogTableData" border style="width: 100%">
</div> <el-table-column v-for="item in actionRecordsDialogTableColumns" :key="item.property"
</el-card> :property="item.property" :label="item.label" :width="item.width" />
</el-col> </el-table>
<el-col :xs="24" :sm="12" :md="4" :lg="4"> </CommonDialog>
<el-card shadow="hover" class="statistics-card">
<div class="card-content"> <!-- 设置状态 弹窗-->
<div class="card-label">总保单数</div> <CommonDialog dialogTitle="设置入账状态" dialogWidth="80%" :openDialog="setStatusDialogTableVisible" @close="setStatusDialogTableVisible=false" @confirm="setStatusDialogTableVisible=false">
<div class="card-value">{{ statisticsData.totalPolicyCount }}</div> <el-form :model="form">
</div> <el-form-item label="入账状态" label-width="120">
</el-card> <el-select v-model="form.status" placeholder="请选择入账状态">
</el-col> <el-option label="Zone No.1" value="shanghai" />
</el-row> <el-option label="Zone No.2" value="beijing" />
</div> </el-select>
</el-form-item>
<el-form-item label="修改理由" :label-width="120">
<el-input v-model="form.desc" type="textarea" />
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="setStatusDialogTableVisible = false">取消</el-button>
<el-button type="primary" @click="setStatusDialogTableVisible = false">
确认
</el-button>
</div>
</template>
</CommonDialog>
</template> </template>
<script setup name="Receivables"> <script setup name="Receivables">
import CommonPage from '@/components/commonPage' import CommonPage from '@/components/commonPage'
import CommonDialog from '@/components/commonDialog'
import { ref, reactive, onMounted, watch } from 'vue' import { ref, reactive, onMounted, watch } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus' import { ElMessage, ElMessageBox } from 'element-plus'
import { formatCurrency } from '@/utils/number' import { formatCurrency } from '@/utils/number'
import { receivedFortuneList } from '@/api/financial/commission' import { receivedFortuneList, commissionEntryRecord, commissionEntryEditRecords } from '@/api/financial/commission'
import SearchForm from '@/components/SearchForm/index.vue' import SearchForm from '@/components/SearchForm/index.vue'
import { searchCompanies, searchCommissionTypes } from '@/api/search' import { searchCompanies, searchCommissionTypes } from '@/api/search'
// 分页相关 // 分页相关
...@@ -151,146 +166,204 @@ const currentPage = ref(1) ...@@ -151,146 +166,204 @@ const currentPage = ref(1)
const pageSize = ref(10) const pageSize = ref(10)
const pageTotal = ref(0) const pageTotal = ref(0)
const loading = ref(false) const loading = ref(false)
// 表格操作菜单
const dropdownItems = [
{ label: '入账记录', value: 'entryRecord' },
{ label: '设置状态', value: 'setStatus' }
]
const entryRecordDialogTableVisible = ref(false)
const setStatusDialogTableVisible = ref(false)
const actionRecordsDialogVisible = ref(false)
const actionRecordsDialogTableData = ref([])
const entryRecordDialogTableData = ref([])
const entryRecordDialogTableColumns = ref([])
const actionRecordsDialogTableColumns = ref([])
const form = reactive({
status: '',
desc: '',
})
const selectedRow = ref(null)
const handleSelect = (e, row) => {
console.log(e, row)
selectedRow.value = row
if (e === 'entryRecord') {
entryRecordDialogTableVisible.value = true
entryRecordDialogTableColumns.value = [
{ property: 'commissionPeriod', label: '佣金期数', width: '100' },
{ property: 'totalPeriod', label: '总期数', width: '150' },
{ property: 'exchangeRate', label: '结算汇率（实）', width: '150' },
{ property: 'currency', label: '入账币种', width: '150' },
{ property: 'amount', label: '入账金额', width: '150' },
{ property: 'commissionPeriod', label: '入账比例', width: '150' },
{ property: 'commissionPeriod', label: '入账日', width: '150' },
{ property: 'status', label: '入账状态', width: '150' }
]
// 加载入账记录-假数据等待接口修改
loadEntryRecordData(selectedRow.value.commissionExpectedBizId).then(records => {
entryRecordDialogTableData.value = records =
[{
commissionPeriod: '2023-08-01',
totalPeriod: '2023-08-31',
exchangeRate: '1.2345',
currency: '假数据，等接口改CNY',
amount: '10000.00',
commissionPeriod: '10%',
commissionPeriod: '2023-08-01',
status: '已入账'
}]
})
} else if (e === 'setStatus') {
setStatusDialogTableVisible.value = true
}
}
const handleClick = () => {
actionRecordsDialogVisible.value = true
actionRecordsDialogTableColumns.value = [
{ property: 'commissionPeriod', label: '检核年月', width: '100' },
{ property: 'totalPeriod', label: '比对状态', width: '150' },
{ property: 'exchangeRate', label: '入账比例', width: '150' },
{ property: 'currency', label: '应入账比例', width: '150' },
{ property: 'amount', label: '对账公司', width: '150' },
{ property: 'createTime', label: '比对时间', width: '150' },
{ property: 'userName', label: '比对人', width: '150' }
]
// 加载入账操作记录-假数据等待接口修改
loadEntryEditRecordData(selectedRow.value.commissionExpectedBizId).then(records => {
actionRecordsDialogTableData.value = records =
[{
commissionPeriod: '2023-08-01',
totalPeriod: '2023-08-31',
exchangeRate: '1.2345',
currency: '假数据，等接口改CNY',
amount: '10000.00',
commissionPeriod: '10%',
commissionPeriod: '2023-08-01',
status: '已入账'
}]
})
}
// 搜索表单数据 - 修正字段名 // 搜索表单数据 - 修正字段名
const searchFormData = reactive({ const searchFormData = reactive({
policyNo: '', policyNo: '',
incomeDateRange: [], // 改为数组格式 incomeDateRange: [], // 改为数组格式
statusList: [], statusList: [],
commissionNameList: [], // 修改字段名 commissionNameList: [], // 修改字段名
commissionPeriod: '', commissionPeriod: '',
reconciliationCompanyList: [], // 修改字段名 reconciliationCompanyList: [], // 修改字段名
insurerBizId: [], insurerBizId: [],
productLaunchBizId: [], productLaunchBizId: [],
commissionBizType: '', commissionBizType: '',
teamBizId: '', teamBizId: '',
}) })
const searchFields = ref([ const searchFields = ref([
{ {
type: 'input', type: 'input',
field: 'policyNo', field: 'policyNo',
label: '保单号', label: '保单号',
placeholder: '请输入保单号', placeholder: '请输入保单号',
colSpan: 6, colSpan: 6,
clearable: true, clearable: true,
rules: [ rules: [
{ max: 50, message: '保单号长度不能超过50个字符', trigger: 'blur' } { max: 50, message: '保单号长度不能超过50个字符', trigger: 'blur' }
] ]
}, },
{ {
type: 'daterange', type: 'daterange',
field: 'incomeDateRange', field: 'incomeDateRange',
label: '入账日期', label: '入账日期',
startPlaceholder: '开始日期', startPlaceholder: '开始日期',
endPlaceholder: '结束日期', endPlaceholder: '结束日期',
colSpan: 6, colSpan: 6,
dateFormat: 'YYYY-MM-DD', dateFormat: 'YYYY-MM-DD',
props: { props: {
valueFormat: 'YYYY-MM-DD', valueFormat: 'YYYY-MM-DD',
style: 'width: 100%' style: 'width: 100%'
} }
}, },
{ {
type: 'multi-select', type: 'multi-select',
field: 'statusList', field: 'statusList',
label: '入账状态', label: '入账状态',
placeholder: '请选择入账状态', placeholder: '请选择入账状态',
colSpan: 6, colSpan: 6,
options: [ remoteConfig: {
{ label: '已入账', value: '1' }, type: 'commissionType',
{ label: '待入账', value: '0' }, apiMethod: searchCommissionTypes,
{ label: '部分入账', value: '2' } formatResult: (data) => data.map(item => ({
] label: item.typeName,
}, value: item.typeCode,
{ remark: item.remark
type: 'remote-multi-select', })),
field: 'commissionNameList', defaultOptions: [
label: '入账项目', { label: '已入账', value: '1' },
placeholder: '请输入关键词搜索', { label: '待入账', value: '0' },
colSpan: 6, { label: '部分入账', value: '2' }
remoteConfig: { ]
type: 'commissionType', }
apiMethod: searchCommissionTypes, },
formatResult: (data) => data.map(item => ({ {
label: item.typeName, type: 'input',
value: item.typeCode, field: 'commissionNameList',
remark: item.remark label: '入账项目',
})), placeholder: '请输入关键词搜索',
defaultOptions: [ colSpan: 6,
{ label: '佣金', value: 'COMMISSION' }, },
{ label: '服务费', value: 'SERVICE_FEE' } {
] type: 'remote-multi-select',
} field: 'reconciliationCompanyList',
}, label: '对账公司',
{ placeholder: '请输入关键词搜索',
type: 'remote-multi-select', colSpan: 6,
field: 'reconciliationCompanyList', remoteConfig: {
label: '对账公司', type: 'company',
placeholder: '请输入关键词搜索', apiMethod: (params) => searchCompanies({ ...params, type: 'reconciliation' }),
colSpan: 6, defaultOptions: []
remoteConfig: { }
type: 'company', },
apiMethod: (params) => searchCompanies({ ...params, type: 'reconciliation' }), {
defaultOptions: [] type: 'input',
} field: 'commissionPeriod',
}, label: '入账期数',
{ placeholder: '请输入期数',
type: 'input', colSpan: 6,
field: 'commissionPeriod', },
label: '入账期数', {
placeholder: '请输入期数', type: 'input',
colSpan: 6, field: 'insurerBizId',
}, label: '保险公司',
{ placeholder: '请输入关键词搜索保险公司',
type: 'remote-multi-select', colSpan: 6,
field: 'insurerBizId', },
label: '保险公司', {
placeholder: '请输入关键词搜索保险公司', type: 'input',
colSpan: 6, field: 'productLaunchBizId',
remoteConfig: { label: '产品计划',
type: 'insurer', placeholder: '请输入关键词搜索产品计划',
apiMethod: (params) => searchCompanies({ ...params, type: 'insurer' }), colSpan: 6,
defaultOptions: [] },
} {
}, type: 'select',
{ field: 'commissionBizType',
type: 'remote-multi-select', label: '应收款类型',
field: 'productLaunchBizId', placeholder: '请选择应收款类型',
label: '产品计划', colSpan: 6,
placeholder: '请输入关键词搜索产品计划', options: [
colSpan: 6, { label: '全部', value: '' },
remoteConfig: { { label: '关联保单应收单', value: '1' },
type: 'product', { label: '非关联保单应收单', value: '2' }
apiMethod: (params) => searchCompanies({ ...params, type: 'product' }), ]
defaultOptions: [] },
{
type: 'input',
field: 'teamBizId',
label: '出单团队',
placeholder: '请输入关键词搜索出单团队',
colSpan: 6,
} }
},
{
type: 'select',
field: 'commissionBizType',
label: '应收款类型',
placeholder: '请选择应收款类型',
colSpan: 6,
options: [
{ label: '全部', value: '' },
{ label: '关联保单应收单', value: '1' },
{ label: '非关联保单应收单', value: '2' }
]
},
{
type: 'remote-multi-select',
field: 'teamBizId',
label: '出单团队',
placeholder: '请输入关键词搜索出单团队',
colSpan: 6,
remoteConfig: {
type: 'team',
apiMethod: (params) => searchCompanies({ ...params, type: 'team' }),
defaultOptions: []
}
}
]) ])
// 表格数据 // 表格数据
...@@ -308,134 +381,173 @@ const statisticsData = ref({ ...@@ -308,134 +381,173 @@ const statisticsData = ref({
// 按钮事件处理 // 按钮事件处理
const handleAdd = () => { const handleAdd = () => {
ElMessage.info('点击新增按钮') ElMessage.info('点击新增按钮')
} }
const handleImport = () => { const handleImport = () => {
ElMessage.info('点击导入按钮') ElMessage.info('点击导入按钮')
} }
const handleExport = () => { const handleExport = () => {
ElMessage.info('点击导出按钮') ElMessage.info('点击导出按钮')
} }
const handleReset = () => { const handleReset = () => {
// 重置搜索表单 // 重置搜索表单
Object.keys(searchFormData).forEach(key => { Object.keys(searchFormData).forEach(key => {
if (Array.isArray(searchFormData[key])) { if (Array.isArray(searchFormData[key])) {
searchFormData[key] = [] searchFormData[key] = []
} else { } else {
searchFormData[key] = '' searchFormData[key] = ''
} }
}) })
ElMessage.success('搜索条件已重置') ElMessage.success('搜索条件已重置')
// 重新加载数据 // 重新加载数据
loadTableData() loadTableData()
} }
const handleQuery = async () => { const handleQuery = async () => {
// 表单验证 loadTableData()
// const valid = await proxy.$refs.searchFormRef.validate()
// if (!valid) return
ElMessage.info('执行查询操作')
loadTableData()
} }
// 控制要显示的默认按钮 // 控制要显示的默认按钮
// const visibleDefaultButtons = ref(['add', 'import', 'export']) // 只显示新增和查询两个默认按钮 const visibleDefaultButtons = ref(['add', 'import', 'export']) // 只显示新增和查询两个默认按钮
// 按钮配置 // 按钮配置
const operationBtnList = ref([ const operationBtnList = ref([
{ {
key: 'add', key: 'add',
direction: 'left', direction: 'left',
click: handleAdd click: handleAdd
}, },
{ {
key: 'import', key: 'import',
direction: 'left', direction: 'left',
click: handleImport click: handleImport
}, },
{ {
key: 'export', key: 'export',
direction: 'right', direction: 'right',
click: handleExport click: handleExport
}, },
{ {
key: 'reset', key: 'reset',
direction: 'right', direction: 'right',
click: handleReset click: handleReset
}, },
{ {
key: 'query', key: 'query',
direction: 'right', direction: 'right',
click: handleQuery click: handleQuery
} }
]) ])
// 分页事件 // 分页事件
const handleSizeChange = (val) => { const handleSizeChange = (val) => {
pageSize.value = val pageSize.value = val
loadTableData() loadTableData()
} }
const handleCurrentChange = (val) => { const handleCurrentChange = (val) => {
currentPage.value = val currentPage.value = val
loadTableData() loadTableData()
} }
// 加载表格数据 // 加载表格数据
const loadTableData = async () => { const loadTableData = async () => {
loading.value = true loading.value = true
try { try {
const params = { const params = {
...searchFormData, ...searchFormData,
currentPage: currentPage.value, currentPage: currentPage.value,
pageSize: pageSize.value pageSize: pageSize.value
}
const response = await receivedFortuneList(params)
tableData.value = response.data.page.records
pageTotal.value = response.data.page.total
pageSize.value = response.data.page.size
// 统计信息
statisticsData.value = {
totalAmount: response.data.expectedStatisticsVO.totalAmount,
totalPaidAmount: response.data.expectedStatisticsVO.totalPaidAmount,
pendingPaidAmount: response.data.expectedStatisticsVO.pendingPaidAmount,
paidAmountRatio: response.data.expectedStatisticsVO.paidAmountRatio,
totalPolicyCount: response.data.expectedStatisticsVO.totalPolicyCount,
paidAmountRatio: response.data.expectedStatisticsVO.paidAmountRatio
}
} catch (error) {
console.error('加载数据失败:', error)
// ElMessage.error('加载数据失败')
} finally {
loading.value = false
}
}
// 入账记录查询
const loadEntryRecordData = async (cbd) => {
loading.value = true
try {
const params = {
commissionBizId: cbd
}
const response = await commissionEntryRecord(params)
const records = response.data.records
return records
} catch (error) {
console.error('加载数据失败:', error)
// ElMessage.error('加载数据失败')
} finally {
loading.value = false
}
}
// 入账操作记录查询
const loadEntryEditRecordData = async (cbd) => {
loading.value = true
try {
const params = {
commissionBizId: cbd
}
const response = await commissionEntryEditRecords(params)
const records = response.data.records
return records
} catch (error) {
console.error('加载数据失败:', error)
// ElMessage.error('加载数据失败')
} finally {
loading.value = false
} }
const response = await receivedFortuneList(params)
tableData.value = response.data.page.records
pageTotal.value = response.data.page.total
pageSize.value = response.data.page.size
// 统计信息
statisticsData.value = {
totalAmount: response.data.expectedStatisticsVO.totalAmount,
totalPaidAmount: response.data.expectedStatisticsVO.totalPaidAmount,
pendingPaidAmount: response.data.expectedStatisticsVO.pendingPaidAmount,
paidAmountRatio: response.data.expectedStatisticsVO.paidAmountRatio,
totalPolicyCount: response.data.expectedStatisticsVO.totalPolicyCount,
paidAmountRatio: response.data.expectedStatisticsVO.paidAmountRatio
}
} catch (error) {
console.error('加载数据失败:', error)
ElMessage.error('加载数据失败')
} finally {
loading.value = false
}
} }
// 初始化加载数据 // 初始化加载数据
onMounted(() => { onMounted(() => {
loadTableData() loadTableData()
}) })
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.statistics-cards {
margin-bottom: 5px;
background: RGBA(0,82,217,0.03);
border-radius: 8px;
padding: 10px 20px;
}
.page-search-container { .page-search-container {
padding: 20px; padding: 20px;
background: #fff; background: #fff;
border-radius: 8px; border-radius: 8px;
margin-bottom: 20px; margin-bottom: 20px;
} }
.search-actions { .search-actions {
margin-top: 20px; margin-top: 20px;
padding-top: 20px; padding-top: 20px;
border-top: 1px solid #ebeef5; border-top: 1px solid #ebeef5;
text-align: right; text-align: right;
} }
.el-menu {
border: none;
}
</style> </style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment