Skip to content

Commit 324d1e8

Browse files
qingkediguoYunaiV
qingkediguo
authored and
YunaiV
committed
!334 feat: 客户配置 review 修改
* feat: 客户配置 review 修改 * feat: 客户配置 review 修改 * feat: 客户配置 review 修改 * feat: 客户配置 review 修改 * feat: 客户配置 review 修改 * feat: 客户配置 review 修改 * feat: 客户配置 review 修改
1 parent 36702f5 commit 324d1e8

File tree

12 files changed

+181
-144
lines changed

12 files changed

+181
-144
lines changed

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

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,20 @@ export interface CustomerLimitConfigVO {
99
dealCountEnabled?: boolean
1010
}
1111

12+
/**
13+
* 客户限制配置类型
14+
*/
15+
export enum LimitConfType {
16+
/**
17+
* 拥有客户数限制
18+
*/
19+
CUSTOMER_QUANTITY_LIMIT = 1,
20+
/**
21+
* 锁定客户数限制
22+
*/
23+
CUSTOMER_LOCK_LIMIT = 2
24+
}
25+
1226
// 查询客户限制配置列表
1327
export const getCustomerLimitConfigPage = async (params) => {
1428
return await request.get({ url: `/crm/customer-limit-config/page`, params })

‎src/api/crm/customerPoolConf/index.ts renamed to ‎src/api/crm/customerPoolConfig/index.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import request from '@/config/axios'
2+
import { ConfigVO } from '@/api/infra/config'
23

34
export interface CustomerPoolConfigVO {
45
enabled?: boolean
@@ -14,6 +15,6 @@ export const getCustomerPoolConfig = async () => {
1415
}
1516

1617
// 更新客户公海规则设置
17-
export const updateCustomerPoolConfig = async (data: ConfigVO) => {
18-
return await request.put({ url: `/crm/customer-pool-config/update`, data })
18+
export const saveCustomerPoolConfig = async (data: ConfigVO) => {
19+
return await request.put({ url: `/crm/customer-pool-config/save`, data })
1920
}

‎src/views/crm/clue/ClueForm.vue

Lines changed: 16 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,9 +10,15 @@
1010
<el-form-item label="线索名称" prop="name">
1111
<el-input v-model="formData.name" placeholder="请输入线索名称" />
1212
</el-form-item>
13-
<!-- TODO wanwan 客户选择 -->
1413
<el-form-item label="客户" prop="customerId">
15-
<el-input v-model="formData.customerId" placeholder="请选择客户" />
14+
<el-select v-model="formData.customerId" clearable placeholder="请选择客户">
15+
<el-option
16+
v-for="item in customerList"
17+
:key="item.id"
18+
:label="item.name"
19+
:value="item.id"
20+
/>
21+
</el-select>
1622
</el-form-item>
1723
<el-form-item label="下次联系时间" prop="contactNextTime">
1824
<el-date-picker
@@ -47,6 +53,7 @@
4753
</template>
4854
<script setup lang="ts">
4955
import * as ClueApi from '@/api/crm/clue'
56+
import * as CustomerApi from '@/api/crm/customer'
5057
5158
const { t } = useI18n() // 国际化
5259
const message = useMessage() // 消息弹窗
@@ -55,6 +62,7 @@ const dialogVisible = ref(false) // 弹窗的是否展示
5562
const dialogTitle = ref('') // 弹窗的标题
5663
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
5764
const formType = ref('') // 表单的类型：create - 新增；update - 修改
65+
const customerList = ref([]) // 客户列表
5866
const formData = ref({
5967
id: undefined,
6068
name: undefined,
@@ -79,6 +87,12 @@ const open = async (type: string, id?: number) => {
7987
dialogTitle.value = t('action.' + type)
8088
formType.value = type
8189
resetForm()
90+
const customerData = await CustomerApi.getCustomerPage({
91+
pageNo: 1,
92+
pageSize: 100,
93+
pool: false
94+
})
95+
customerList.value = customerData.list
8296
// 修改时，设置数据
8397
if (id) {
8498
formLoading.value = true

‎src/views/crm/customerLimitConfig/CustomerLimitConfigForm.vue renamed to ‎src/views/crm/config/customerLimitConfig/CustomerLimitConfigForm.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -57,11 +57,11 @@
5757
</template>
5858
<script setup lang="ts">
5959
import * as CustomerLimitConfigApi from '@/api/crm/customerLimitConfig'
60-
import { LimitConfType } from '@/views/crm/customerLimitConfig/customerLimitConf'
6160
import * as DeptApi from '@/api/system/dept'
6261
import { defaultProps, handleTree } from '@/utils/tree'
6362
import * as UserApi from '@/api/system/user'
6463
import { cloneDeep } from 'lodash-es'
64+
import { LimitConfType } from '@/api/crm/customerLimitConfig'
6565
6666
const { t } = useI18n() // 国际化
6767
const message = useMessage() // 消息弹窗

‎src/views/crm/customerLimitConfig/CustomerLimitConfDetails.vue renamed to ‎src/views/crm/config/customerLimitConfig/CustomerLimitConfigList.vue

Lines changed: 13 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -19,8 +19,16 @@
1919
>
2020
<el-table-column label="编号" align="center" prop="id" />
2121
<el-table-column label="规则类型" align="center" prop="type" />
22-
<el-table-column label="规则适用人群" align="center" prop="userNames" />
23-
<el-table-column label="规则适用部门" align="center" prop="deptNames" />
22+
<el-table-column
23+
label="规则适用人群"
24+
align="center"
25+
:formatter="(row) => row.users?.map((user: any) => user.nickname).join('，')"
26+
/>
27+
<el-table-column
28+
label="规则适用部门"
29+
align="center"
30+
:formatter="(row) => row.depts?.map((dept: any) => dept.name).join('，')"
31+
/>
2432
<el-table-column
2533
:label="
2634
confType === LimitConfType.CUSTOMER_QUANTITY_LIMIT ? '拥有客户数上限' : '锁定客户数上限'
@@ -80,11 +88,11 @@
8088
<script setup lang="ts">
8189
import { dateFormatter } from '@/utils/formatTime'
8290
import * as CustomerLimitConfigApi from '@/api/crm/customerLimitConfig'
83-
import CustomerLimitConfigForm from '@/views/crm/customerLimitConfig/CustomerLimitConfigForm.vue'
84-
import { LimitConfType } from '@/views/crm/customerLimitConfig/customerLimitConf'
91+
import CustomerLimitConfigForm from '@/views/crm/config/customerLimitConfig/CustomerLimitConfigForm.vue'
8592
import { DICT_TYPE } from '@/utils/dict'
93+
import { LimitConfType } from '@/api/crm/customerLimitConfig'
8694
87-
defineOptions({ name: 'CustomerLimitConfDetails' })
95+
defineOptions({ name: 'CustomerLimitConfigList' })
8896
8997
const message = useMessage() // 消息弹窗
9098
const { t } = useI18n() // 国际化

‎src/views/crm/config/customerLimitConfig/customerLimitConfig.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
// TODO 可以挪到它对应的 api.ts 文件里哈
2+
/**
3+
* 客户限制配置类型
4+
*/

‎src/views/crm/config/customerLimitConfig/index.vue

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<template>
2+
<!-- 列表 -->
3+
<ContentWrap>
4+
<el-tabs>
5+
<el-tab-pane label="拥有客户数限制">
6+
<CustomerLimitConfigList :confType="LimitConfType.CUSTOMER_QUANTITY_LIMIT" />
7+
</el-tab-pane>
8+
<el-tab-pane label="锁定客户数限制">
9+
<CustomerLimitConfigList :confType="LimitConfType.CUSTOMER_LOCK_LIMIT" />
10+
</el-tab-pane>
11+
</el-tabs>
12+
</ContentWrap>
13+
</template>
14+
<script setup lang="ts">
15+
import CustomerLimitConfigList from '@/views/crm/config/customerLimitConfig/CustomerLimitConfigList.vue'
16+
import { LimitConfType } from '@/api/crm/customerLimitConfig'
17+
18+
defineOptions({ name: 'CrmCustomerLimitConfig' })
19+
</script>

‎src/views/crm/customerPoolConf/index.vue renamed to ‎src/views/crm/config/customerPoolConfig/index.vue

Lines changed: 25 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323
</template>
2424
<!-- 表单 -->
2525
<el-form-item label="客户公海规则设置" prop="enabled">
26-
<el-radio-group v-model="formData.enabled" class="ml-4">
26+
<el-radio-group v-model="formData.enabled" @change="changeEnable" class="ml-4">
2727
<el-radio :label="false" size="large">不启用</el-radio>
2828
<el-radio :label="true" size="large">启用</el-radio>
2929
</el-radio-group>
@@ -36,7 +36,11 @@
3636
天未成交
3737
</el-form-item>
3838
<el-form-item label="提前提醒设置" prop="notifyEnabled">
39-
<el-radio-group v-model="formData.notifyEnabled" class="ml-4">
39+
<el-radio-group
40+
v-model="formData.notifyEnabled"
41+
@change="changeNotifyEnable"
42+
class="ml-4"
43+
>
4044
<el-radio :label="false" size="large">不提醒</el-radio>
4145
<el-radio :label="true" size="large">提醒</el-radio>
4246
</el-radio-group>
@@ -52,11 +56,10 @@
5256
</ContentWrap>
5357
</template>
5458
<script setup lang="ts">
55-
import * as CustomerPoolConfApi from '@/api/crm/customerPoolConf'
59+
import * as CustomerPoolConfigApi from '@/api/crm/customerPoolConfig'
5660
import { CardTitle } from '@/components/Card'
5761
58-
// TODO @wanwan：CustomerPoolConf =》 CustomerPoolConfig；另外，我们在 crm 目录下，新建一个 config 目录，然后把 customerPoolConfig 和 customerLimitConfig 都挪进
59-
defineOptions({ name: 'CustomerPoolConf' })
62+
defineOptions({ name: 'CrmCustomerPoolConfig' })
6063
6164
const message = useMessage() // 消息弹窗
6265
const { t } = useI18n() // 国际化
@@ -78,7 +81,7 @@ const formRef = ref() // 表单 Ref
7881
const getConfig = async () => {
7982
try {
8083
formLoading.value = true
81-
const data = await CustomerPoolConfApi.getCustomerPoolConfig()
84+
const data = await CustomerPoolConfigApi.getCustomerPoolConfig()
8285
if (data === null) {
8386
return
8487
}
@@ -97,8 +100,8 @@ const onSubmit = async () => {
97100
// 提交请求
98101
formLoading.value = true
99102
try {
100-
const data = formData.value as unknown as CustomerPoolConfApi.CustomerPoolConfigVO
101-
await CustomerPoolConfApi.updateCustomerPoolConfig(data)
103+
const data = formData.value as unknown as CustomerPoolConfigApi.CustomerPoolConfigVO
104+
await CustomerPoolConfigApi.saveCustomerPoolConfig(data)
102105
message.success(t('common.updateSuccess'))
103106
await getConfig()
104107
formLoading.value = false
@@ -107,27 +110,22 @@ const onSubmit = async () => {
107110
}
108111
}
109112
110-
// TODO @wanwan：el-radio-group 选择后，触发会不会更好哈；
111-
watch(
112-
() => formData.value.enabled,
113-
(val: boolean) => {
114-
if (!val) {
115-
formData.value.contactExpireDays = undefined
116-
formData.value.dealExpireDays = undefined
117-
formData.value.notifyEnabled = false
118-
formData.value.notifyDays = undefined
119-
}
113+
/** 更改客户公海规则设置 */
114+
const changeEnable = () => {
115+
if (!formData.value.enabled) {
116+
formData.value.contactExpireDays = undefined
117+
formData.value.dealExpireDays = undefined
118+
formData.value.notifyEnabled = false
119+
formData.value.notifyDays = undefined
120120
}
121-
)
122-
// TODO @wanwan：el-radio-group 选择后，触发会不会更好哈；
123-
watch(
124-
() => formData.value.notifyEnabled,
125-
(val: boolean) => {
126-
if (!val) {
127-
formData.value.notifyDays = undefined
128-
}
121+
}
122+
123+
/** 更改提前提醒设置 */
124+
const changeNotifyEnable = () => {
125+
if (!formData.value.notifyEnabled) {
126+
formData.value.notifyDays = undefined
129127
}
130-
)
128+
}
131129
132130
onMounted(() => {
133131
getConfig()

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

Lines changed: 85 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,85 @@
1+
<template>
2+
<div v-loading="loading">
3+
<div class="flex items-start justify-between">
4+
<div>
5+
<!-- 左上：客户基本信息 -->
6+
<CustomerBasicInfo :customer="customer" />
7+
</div>
8+
<div>
9+
<!-- 右上：按钮 -->
10+
<el-button v-hasPermi="['crm:customer:update']" @click="openForm('update', customer.id)">
11+
编辑
12+
</el-button>
13+
<el-button>更改成交状态</el-button>
14+
</div>
15+
</div>
16+
<el-row class="mt-10px">
17+
<el-button>
18+
<Icon class="mr-5px" icon="ph:calendar-fill" />
19+
创建任务
20+
</el-button>
21+
<el-button>
22+
<Icon class="mr-5px" icon="carbon:email" />
23+
发送邮件
24+
</el-button>
25+
<el-button>
26+
<Icon class="mr-5px" icon="system-uicons:contacts" />
27+
创建联系人
28+
</el-button>
29+
<el-button>
30+
<Icon class="mr-5px" icon="ep:opportunity" />
31+
创建商机
32+
</el-button>
33+
<el-button>
34+
<Icon class="mr-5px" icon="clarity:contract-line" />
35+
创建合同
36+
</el-button>
37+
<el-button>
38+
<Icon class="mr-5px" icon="icon-park:income-one" />
39+
创建回款
40+
</el-button>
41+
<el-button>
42+
<Icon class="mr-5px" icon="fluent:people-team-add-20-filled" />
43+
添加团队成员
44+
</el-button>
45+
</el-row>
46+
</div>
47+
<ContentWrap class="mt-10px">
48+
<el-descriptions :column="5" direction="vertical">
49+
<el-descriptions-item label="客户级别">
50+
<dict-tag :type="DICT_TYPE.CRM_CUSTOMER_LEVEL" :value="customer.level" />
51+
</el-descriptions-item>
52+
<el-descriptions-item label="成交状态">
53+
{{ customer.dealStatus ? '已成交' : '未成交' }}
54+
</el-descriptions-item>
55+
<el-descriptions-item label="负责人">
56+
{{ customer.ownerUserName }}
57+
</el-descriptions-item>
58+
<!-- TODO wanwan 首要联系人? -->
59+
<el-descriptions-item label="首要联系人" />
60+
<!-- TODO wanwan 首要联系人电话? -->
61+
<el-descriptions-item label="首要联系人电话">
62+
{{ customer.mobile }}
63+
</el-descriptions-item>
64+
</el-descriptions>
65+
</ContentWrap>
66+
67+
<!-- 表单弹窗：添加/修改 -->
68+
<CustomerForm ref="formRef" @success="emit('refresh')" />
69+
</template>
70+
<script setup lang="ts">
71+
import * as CustomerApi from '@/api/crm/customer'
72+
import { DICT_TYPE } from '@/utils/dict'
73+
import CustomerBasicInfo from '@/views/crm/customer/detail/CustomerBasicInfo.vue'
74+
import CustomerForm from '@/views/crm/customer/CustomerForm.vue'
75+
76+
const { customer, loading } = defineProps<{ customer: CustomerApi.CustomerVO; loading: boolean }>()
77+
78+
const openForm = (type: string, id?: number) => {
79+
formRef.value.open(type, id)
80+
}
81+
82+
const formRef = ref()
83+
84+
const emit = defineEmits(['refresh']) // 定义 success 事件，用于操作成功后的回调
85+
</script>

0 commit comments

Comments
 (0)