Skip to content

Commit bdc80ea

Browse files
YunaiVYunaiV
committed
crm: 增加基于客户查询回款分页
1 parent 88e5e67 commit bdc80ea

File tree

4 files changed

+144
-164
lines changed

4 files changed

+144
-164
lines changed

‎src/api/crm/receivable/index.ts

Lines changed: 12 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -6,46 +6,47 @@ export interface ReceivableVO {
66
planId: number
77
customerId: number
88
contractId: number
9-
checkStatus: number
9+
auditStatus: number
1010
processInstanceId: number
1111
returnTime: Date
1212
returnType: string
1313
price: number
1414
ownerUserId: number
15-
batchId: number
1615
sort: number
17-
dataScope: number
18-
dataScopeDeptIds: string
19-
status: number
2016
remark: string
2117
}
2218

23-
// 查询回款管理列表
19+
// 查询回款列表
2420
export const getReceivablePage = async (params) => {
2521
return await request.get({ url: `/crm/receivable/page`, params })
2622
}
2723

28-
// 查询回款管理详情
24+
// 查询回款列表
25+
export const getReceivablePageByCustomer = async (params) => {
26+
return await request.get({ url: `/crm/receivable/page-by-customer`, params })
27+
}
28+
29+
// 查询回款详情
2930
export const getReceivable = async (id: number) => {
3031
return await request.get({ url: `/crm/receivable/get?id=` + id })
3132
}
3233

33-
// 新增回款管理
34+
// 新增回款
3435
export const createReceivable = async (data: ReceivableVO) => {
3536
return await request.post({ url: `/crm/receivable/create`, data })
3637
}
3738

38-
// 修改回款管理
39+
// 修改回款
3940
export const updateReceivable = async (data: ReceivableVO) => {
4041
return await request.put({ url: `/crm/receivable/update`, data })
4142
}
4243

43-
// 删除回款管理
44+
// 删除回款
4445
export const deleteReceivable = async (id: number) => {
4546
return await request.delete({ url: `/crm/receivable/delete?id=` + id })
4647
}
4748

48-
// 导出回款管理 Excel
49+
// 导出回款 Excel
4950
export const exportReceivable = async (params) => {
5051
return await request.download({ url: `/crm/receivable/export-excel`, params })
5152
}

‎src/views/crm/customer/detail/index.vue

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,9 @@
1818
<el-tab-pane label="合同" lazy>
1919
<ContractList :biz-id="customer.id!" :biz-type="BizTypeEnum.CRM_CUSTOMER" />
2020
</el-tab-pane>
21-
<el-tab-pane label="回款" lazy>TODO待开发 </el-tab-pane>
21+
<el-tab-pane label="回款" lazy>
22+
<ReceivableList :biz-id="customer.id!" :biz-type="BizTypeEnum.CRM_CUSTOMER" />
23+
</el-tab-pane>
2224
<el-tab-pane label="回访" lazy>TODO 待开发</el-tab-pane>
2325
</el-tabs>
2426
</el-col>
@@ -31,6 +33,7 @@ import CustomerDetailsHeader from './CustomerDetailsHeader.vue' // 客户明细
3133
import ContactList from '@/views/crm/contact/components/ContactList.vue' // 联系人列表
3234
import ContractList from '@/views/crm/contract/components/ContractList.vue' // 合同列表
3335
import BusinessList from '@/views/crm/business/components/BusinessList.vue' // 商机列表
36+
import ReceivableList from '@/views/crm/receivable/components/ReceivableList.vue' // 回款列表
3437
import PermissionList from '@/views/crm/permission/components/PermissionList.vue' // 团队成员列表（权限）
3538
import { BizTypeEnum } from '@/api/crm/permission'
3639

‎src/views/crm/receivable/components/ReceivableList.vue

Lines changed: 125 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,125 @@
1+
<template>
2+
<!-- 操作栏 -->
3+
<el-row justify="end">
4+
<el-button @click="openForm">
5+
<Icon class="mr-5px" icon="icon-park:income-one" />
6+
创建回款
7+
</el-button>
8+
</el-row>
9+
10+
<!-- 列表 -->
11+
<ContentWrap class="mt-10px">
12+
<el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
13+
<el-table-column label="回款编号" fixed="left" align="center" prop="no">
14+
<template #default="scope">
15+
<el-link type="primary" :underline="false" @click="openDetail(scope.row.id)">
16+
{{ scope.row.no }}
17+
</el-link>
18+
</template>
19+
</el-table-column>
20+
<el-table-column label="合同编号" align="center" prop="contractNo" />
21+
<el-table-column
22+
label="回款金额（元）"
23+
align="center"
24+
prop="price"
25+
:formatter="fenToYuanFormat"
26+
/>
27+
<el-table-column label="负责人" align="center" prop="ownerUserName" />
28+
<el-table-column align="center" label="状态" prop="auditStatus">
29+
<template #default="scope">
30+
<dict-tag :type="DICT_TYPE.CRM_AUDIT_STATUS" :value="scope.row.auditStatus" />
31+
</template>
32+
</el-table-column>
33+
<el-table-column
34+
label="回款日期"
35+
align="center"
36+
prop="returnTime"
37+
:formatter="dateFormatter"
38+
width="180px"
39+
/>
40+
</el-table>
41+
<!-- 分页 -->
42+
<Pagination
43+
:total="total"
44+
v-model:page="queryParams.pageNo"
45+
v-model:limit="queryParams.pageSize"
46+
@pagination="getList"
47+
/>
48+
</ContentWrap>
49+
50+
<!-- 表单弹窗：添加 -->
51+
<ReceivableForm ref="formRef" @success="getList" />
52+
</template>
53+
<script setup lang="ts">
54+
import * as ReceivableApi from '@/api/crm/receivable'
55+
import ReceivableForm from './../ReceivableForm.vue'
56+
import { BizTypeEnum } from '@/api/crm/permission'
57+
import { dateFormatter } from '@/utils/formatTime'
58+
import { fenToYuanFormat } from '@/utils/formatter'
59+
import { DICT_TYPE } from '@/utils/dict'
60+
61+
defineOptions({ name: 'CrmReceivableList' })
62+
const props = defineProps<{
63+
bizType: number // 业务类型
64+
bizId: number // 业务编号
65+
}>()
66+
67+
const loading = ref(true) // 列表的加载中
68+
const total = ref(0) // 列表的总页数
69+
const list = ref([]) // 列表的数据
70+
const queryParams = reactive({
71+
pageNo: 1,
72+
pageSize: 10,
73+
customerId: undefined as unknown // 允许 undefined + number
74+
})
75+
76+
/** 查询列表 */
77+
const getList = async () => {
78+
loading.value = true
79+
try {
80+
// 置空参数
81+
queryParams.customerId = undefined
82+
// 执行查询
83+
let data = { list: [], total: 0 }
84+
switch (props.bizType) {
85+
case BizTypeEnum.CRM_CUSTOMER:
86+
queryParams.customerId = props.bizId
87+
data = await ReceivableApi.getReceivablePageByCustomer(queryParams)
88+
break
89+
default:
90+
return
91+
}
92+
list.value = data.list
93+
total.value = data.total
94+
} finally {
95+
loading.value = false
96+
}
97+
}
98+
99+
/** 搜索按钮操作 */
100+
const handleQuery = () => {
101+
queryParams.pageNo = 1
102+
getList()
103+
}
104+
105+
/** 添加 */
106+
const formRef = ref()
107+
const openForm = () => {
108+
formRef.value.open('create')
109+
}
110+
111+
/** 打开合同详情 */
112+
const { push } = useRouter()
113+
const openDetail = (id: number) => {
114+
push({ name: 'CrmReceivableDetail', params: { id } })
115+
}
116+
117+
/** 监听打开的 bizId + bizType，从而加载最新的列表 */
118+
watch(
119+
() => [props.bizId, props.bizType],
120+
() => {
121+
handleQuery()
122+
},
123+
{ immediate: true, deep: true }
124+
)
125+
</script>

‎src/views/crm/receivable/index.vue

Lines changed: 3 additions & 152 deletions
Original file line numberDiff line numberDiff line change
@@ -17,15 +17,6 @@
1717
class="!w-240px"
1818
/>
1919
</el-form-item>
20-
<!--<el-form-item label="回款计划ID" prop="planId">
21-
<el-input
22-
v-model="queryParams.planId"
23-
placeholder="请输入回款计划ID"
24-
clearable
25-
@keyup.enter="handleQuery"
26-
class="!w-240px"
27-
/>
28-
</el-form-item>-->
2920
<el-form-item label="客户名称" prop="customerId">
3021
<el-input
3122
v-model="queryParams.customerId"
@@ -35,131 +26,6 @@
3526
class="!w-240px"
3627
/>
3728
</el-form-item>
38-
<el-form-item label="合同名称" prop="contractId">
39-
<el-input
40-
v-model="queryParams.contractId"
41-
placeholder="请输入合同名称"
42-
clearable
43-
@keyup.enter="handleQuery"
44-
class="!w-240px"
45-
/>
46-
</el-form-item>
47-
<el-form-item label="审批状态" prop="checkStatus">
48-
<el-select
49-
v-model="queryParams.checkStatus"
50-
placeholder="请选择审批状态"
51-
clearable
52-
class="!w-240px"
53-
>
54-
<el-option
55-
v-for="dict in getIntDictOptions(DICT_TYPE.CRM_AUDIT_STATUS)"
56-
:key="dict.value"
57-
:label="dict.label"
58-
:value="dict.value"
59-
/>
60-
</el-select>
61-
</el-form-item>
62-
<!--<el-form-item label="工作流编号" prop="processInstanceId">
63-
<el-input
64-
v-model="queryParams.processInstanceId"
65-
placeholder="请输入工作流编号"
66-
clearable
67-
@keyup.enter="handleQuery"
68-
class="!w-240px"
69-
/>
70-
</el-form-item>-->
71-
<el-form-item label="回款日期" prop="returnTime">
72-
<el-date-picker
73-
v-model="queryParams.returnTime"
74-
value-format="YYYY-MM-DD HH:mm:ss"
75-
type="daterange"
76-
start-placeholder="开始日期"
77-
end-placeholder="结束日期"
78-
:default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
79-
class="!w-240px"
80-
/>
81-
</el-form-item>
82-
<el-form-item label="回款方式" prop="returnType">
83-
<el-select
84-
v-model="queryParams.returnType"
85-
placeholder="请选择回款方式"
86-
clearable
87-
class="!w-240px"
88-
>
89-
<el-option
90-
v-for="dict in getIntDictOptions(DICT_TYPE.CRM_RETURN_TYPE)"
91-
:key="dict.value"
92-
:label="dict.label"
93-
:value="dict.value"
94-
/>
95-
</el-select>
96-
</el-form-item>
97-
<!--<el-form-item label="回款金额" prop="price">
98-
<el-input
99-
v-model="queryParams.price"
100-
placeholder="请输入回款金额"
101-
clearable
102-
@keyup.enter="handleQuery"
103-
class="!w-240px"
104-
/>
105-
</el-form-item>-->
106-
<!--<el-form-item label="负责人" prop="ownerUserId">
107-
<el-input
108-
v-model="queryParams.ownerUserId"
109-
placeholder="请输入负责人"
110-
clearable
111-
@keyup.enter="handleQuery"
112-
class="!w-240px"
113-
/>
114-
</el-form-item>
115-
<el-form-item label="批次" prop="batchId">
116-
<el-input
117-
v-model="queryParams.batchId"
118-
placeholder="请输入批次"
119-
clearable
120-
@keyup.enter="handleQuery"
121-
class="!w-240px"
122-
/>
123-
</el-form-item>-->
124-
<!--<el-form-item label="数据范围（1：全部数据权限 2：自定数据权限 3：本部门数据权限 4：本部门及以下数据权限）" prop="dataScope">
125-
<el-input
126-
v-model="queryParams.dataScope"
127-
placeholder="请输入数据范围（1：全部数据权限 2：自定数据权限 3：本部门数据权限 4：本部门及以下数据权限）"
128-
clearable
129-
@keyup.enter="handleQuery"
130-
class="!w-240px"
131-
/>
132-
</el-form-item>
133-
<el-form-item label="数据范围(指定部门数组)" prop="dataScopeDeptIds">
134-
<el-input
135-
v-model="queryParams.dataScopeDeptIds"
136-
placeholder="请输入数据范围(指定部门数组)"
137-
clearable
138-
@keyup.enter="handleQuery"
139-
class="!w-240px"
140-
/>
141-
</el-form-item>-->
142-
<el-form-item label="状态" prop="status">
143-
<el-select v-model="queryParams.status" placeholder="请选择状态" clearable class="!w-240px">
144-
<el-option
145-
v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)"
146-
:key="dict.value"
147-
:label="dict.label"
148-
:value="dict.value"
149-
/>
150-
</el-select>
151-
</el-form-item>
152-
<el-form-item label="创建时间" prop="createTime">
153-
<el-date-picker
154-
v-model="queryParams.createTime"
155-
value-format="YYYY-MM-DD HH:mm:ss"
156-
type="daterange"
157-
start-placeholder="开始日期"
158-
end-placeholder="结束日期"
159-
:default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
160-
class="!w-240px"
161-
/>
162-
</el-form-item>
16329
<el-form-item>
16430
<el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
16531
<el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
@@ -266,7 +132,7 @@
266132
</template>
267133

268134
<script setup lang="ts">
269-
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
135+
import { DICT_TYPE } from '@/utils/dict'
270136
import { dateFormatter, dateFormatter2 } from '@/utils/formatTime'
271137
import download from '@/utils/download'
272138
import * as ReceivableApi from '@/api/crm/receivable'
@@ -284,22 +150,7 @@ const queryParams = reactive({
284150
pageNo: 1,
285151
pageSize: 10,
286152
no: null,
287-
planId: null,
288-
customerId: null,
289-
contractId: null,
290-
checkStatus: null,
291-
processInstanceId: null,
292-
returnTime: [],
293-
returnType: null,
294-
price: null,
295-
ownerUserId: null,
296-
batchId: null,
297-
sort: null,
298-
dataScope: null,
299-
dataScopeDeptIds: null,
300-
status: null,
301-
remark: null,
302-
createTime: []
153+
customerId: null
303154
})
304155
const queryFormRef = ref() // 搜索的表单
305156
const exportLoading = ref(false) // 导出的加载中
@@ -355,7 +206,7 @@ const handleExport = async () => {
355206
// 发起导出
356207
exportLoading.value = true
357208
const data = await ReceivableApi.exportReceivable(queryParams)
358-
download.excel(data, '回款管理.xls')
209+
download.excel(data, '回款.xls')
359210
} catch {
360211
} finally {
361212
exportLoading.value = false

0 commit comments

Comments
 (0)