Skip to content

phsl / admin

Go to a project
Commit 08bb022c by YunaiV
Options

✨ CRM：完善联系人的编辑、详情

parent 094b1925
Showing with 92 additions and 94 deletions
src/api/crm/contact/index.ts
......@@ -2,29 +2,34 @@ import request from '@/config/axios'
import { TransferReqVO } from '@/api/crm/customer'
export interface ContactVO {
name: string
nextTime: Date
mobile: string
telephone: string
email: string
post: string
customerId: number
detailAddress: string
remark: string
ownerUserId: string
lastTime: Date
id: number
parentId: number
qq: number
wechat: string
sex: number
master: boolean
creatorName: string
updateTime?: Date
createTime?: Date
customerName: string
areaName: string
ownerUserName: string
id: number // 编号
name: string // 联系人名称
customerId: number // 客户编号
customerName?: string // 客户名称
contactLastTime: Date // 最后跟进时间
contactLastContent: string // 最后跟进内容
contactNextTime: Date // 下次联系时间
ownerUserId: number // 负责人的用户编号
ownerUserName?: string // 负责人的用户名称
ownerUserDept?: string // 负责人的部门名称
mobile: string // 手机号
telephone: string // 电话
qq: string // QQ
wechat: string // wechat
email: string // email
areaId: number // 所在地
areaName?: string // 所在地名称
detailAddress: string // 详细地址
sex: number // 性别
master: boolean // 是否主联系人
post: string // 职务
parentId: number // 上级联系人编号
parentName?: string // 上级联系人名称
remark: string // 备注
creator: string // 创建人
creatorName?: string // 创建人名称
createTime: Date // 创建时间
updateTime: Date // 更新时间
}
export interface ContactBusinessReqVO {
......
src/views/crm/clue/detail/index.vue
......@@ -33,7 +33,7 @@
ref="permissionListRef"
:biz-id="clue.id!"
:biz-type="BizTypeEnum.CRM_CLUE"
:show-action="!permissionListRef?.isPool || false"
:show-action="true"
@quit-team="close"
/>
</el-tab-pane>
......
src/views/crm/contact/detail/ContactDetailsHeader.vue
......@@ -16,17 +16,11 @@
</div>
<ContentWrap class="mt-10px">
<el-descriptions :column="5" direction="vertical">
<el-descriptions-item label="客户">
{{ contact.customerName }}
</el-descriptions-item>
<el-descriptions-item label="职务">
{{ contact.post }}
</el-descriptions-item>
<el-descriptions-item label="手机">
{{ contact.mobile }}
</el-descriptions-item>
<el-descriptions-item label="客户名称">{{ contact.customerName }}</el-descriptions-item>
<el-descriptions-item label="职务">{{ contact.post }}</el-descriptions-item>
<el-descriptions-item label="手机">{{ contact.mobile }}</el-descriptions-item>
<el-descriptions-item label="创建时间">
{{ contact.createTime ? formatDate(contact.createTime) : '空' }}
{{ formatDate(contact.createTime) }}
</el-descriptions-item>
</el-descriptions>
</ContentWrap>
......
src/views/crm/contact/detail/ContactDetailsInfo.vue
......@@ -6,60 +6,49 @@
<span class="text-base font-bold">基本信息</span>
</template>
<el-descriptions :column="4">
<el-descriptions-item label="姓名">
{{ contact.name }}
</el-descriptions-item>
<el-descriptions-item label="客户">
{{ contact.customerName }}
</el-descriptions-item>
<el-descriptions-item label="手机">
{{ contact.mobile }}
</el-descriptions-item>
<el-descriptions-item label="座机">
{{ contact.telephone }}
</el-descriptions-item>
<el-descriptions-item label="邮箱">
{{ contact.email }}
</el-descriptions-item>
<el-descriptions-item label="QQ">
{{ contact.qq }}
</el-descriptions-item>
<el-descriptions-item label="微信">
{{ contact.wechat }}
</el-descriptions-item>
<el-descriptions-item label="下次联系时间">
{{ contact.nextTime ? formatDate(contact.nextTime) : '空' }}
</el-descriptions-item>
<el-descriptions-item label="所在地">
{{ contact.areaName }}
</el-descriptions-item>
<el-descriptions-item label="详细地址">
{{ contact.detailAddress }}
<el-descriptions-item label="姓名">{{ contact.name }}</el-descriptions-item>
<el-descriptions-item label="客户名称">{{ contact.customerName }}</el-descriptions-item>
<el-descriptions-item label="手机">{{ contact.mobile }}</el-descriptions-item>
<el-descriptions-item label="电话">{{ contact.telephone }}</el-descriptions-item>
<el-descriptions-item label="邮箱">{{ contact.email }}</el-descriptions-item>
<el-descriptions-item label="QQ">{{ contact.qq }}</el-descriptions-item>
<el-descriptions-item label="微信">{{ contact.wechat }}</el-descriptions-item>
<el-descriptions-item label="地址">
{{ contact.areaName }} {{ contact.detailAddress }}
</el-descriptions-item>
<el-descriptions-item label="职务">{{ contact.post }}</el-descriptions-item>
<el-descriptions-item label="直属上级">{{ contact.parentName }}</el-descriptions-item>
<el-descriptions-item label="关键决策人">
<dict-tag :type="DICT_TYPE.INFRA_BOOLEAN_STRING" :value="contact.master" />
</el-descriptions-item>
<el-descriptions-item label="性别">
<dict-tag :type="DICT_TYPE.SYSTEM_USER_SEX" :value="contact.sex" />
</el-descriptions-item>
<el-descriptions-item label="备注">
{{ contact.remark }}
<el-descriptions-item label="下次联系时间">
{{ formatDate(contact.contactNextTime) }}
</el-descriptions-item>
<el-descriptions-item label="备注">{{ contact.remark }}</el-descriptions-item>
</el-descriptions>
</el-collapse-item>
<el-collapse-item name="systemInfo">
<template #title>
<span class="text-base font-bold">系统信息</span>
</template>
<el-descriptions :column="2">
<el-descriptions-item label="负责人">
{{ contact.ownerUserName }}
<el-descriptions :column="4">
<el-descriptions-item label="负责人">{{ contact.ownerUserName }}</el-descriptions-item>
<el-descriptions-item label="最后跟进记录">
{{ contact.contactLastContent }}
</el-descriptions-item>
<el-descriptions-item label="创建人">
{{ contact.creatorName }}
<el-descriptions-item label="最后跟进时间">
{{ formatDate(contact.contactLastTime) }}
</el-descriptions-item>
<el-descriptions-item label="">&nbsp;</el-descriptions-item>
<el-descriptions-item label="创建人">{{ contact.creatorName }}</el-descriptions-item>
<el-descriptions-item label="创建时间">
{{ contact.createTime ? formatDate(contact.createTime) : '空' }}
{{ formatDate(contact.createTime) }}
</el-descriptions-item>
<el-descriptions-item label="更新时间">
{{ contact.updateTime ? formatDate(contact.updateTime) : '空' }}
{{ formatDate(contact.updateTime) }}
</el-descriptions-item>
</el-descriptions>
</el-collapse-item>
......
src/views/crm/contact/detail/index.vue
......@@ -9,6 +9,9 @@
</ContactDetailsHeader>
<el-col>
<el-tabs>
<el-tab-pane label="跟进记录">
<FollowUpList :biz-id="contactId" :biz-type="BizTypeEnum.CRM_CONTACT" />
</el-tab-pane>
<el-tab-pane label="详细资料">
<ContactDetailsInfo :contact="contact" />
</el-tab-pane>
......@@ -20,7 +23,7 @@
ref="permissionListRef"
:biz-id="contact.id!"
:biz-type="BizTypeEnum.CRM_CONTACT"
:show-action="!permissionListRef?.isPool || false"
:show-action="true"
@quit-team="close"
/>
</el-tab-pane>
......@@ -34,8 +37,8 @@
</el-tabs>
</el-col>
<!-- 表单弹窗：添加/修改 -->
<ContactForm ref="formRef" @success="getContactData(contact.id)" />
<CrmTransferForm ref="crmTransferFormRef" @success="close" />
<ContactForm ref="formRef" @success="getContact(contact.id)" />
<CrmTransferForm ref="transferFormRef" @success="close" />
</template>
<script lang="ts" setup>
import { useTagsViewStore } from '@/store/modules/tagsView'
......@@ -49,18 +52,19 @@ import { OperateLogV2VO } from '@/api/system/operatelog'
import { getOperateLogPage } from '@/api/crm/operateLog'
import ContactForm from '@/views/crm/contact/ContactForm.vue'
import CrmTransferForm from '@/views/crm/permission/components/TransferForm.vue'
import FollowUpList from '@/views/crm/followup/index.vue'
defineOptions({ name: 'CrmContactDetail' })
const route = useRoute()
const message = useMessage()
const id = Number(route.params.id) // 联系人编号
const contactId = ref(0) // 线索编号
const loading = ref(true) // 加载中
const contact = ref<ContactApi.ContactVO>({} as ContactApi.ContactVO) // 联系人详情
const permissionListRef = ref<InstanceType<typeof PermissionList>>() // 团队成员列表 Ref
/** 获取详情 */
const getContactData = async (id: number) => {
const getContact = async (id: number) => {
loading.value = true
try {
contact.value = await ContactApi.getContact(id)
......@@ -77,9 +81,9 @@ const openForm = (type: string, id?: number) => {
}
/** 联系人转移 */
const crmTransferFormRef = ref<InstanceType<typeof CrmTransferForm>>() // 联系人转移表单 ref
const transferFormRef = ref<InstanceType<typeof CrmTransferForm>>() // 联系人转移表单 ref
const transfer = () => {
crmTransferFormRef.value?.open('联系人转移', contact.value.id, ContactApi.transferContact)
transferFormRef.value?.open('联系人转移', contact.value.id, ContactApi.transferContact)
}
/** 获取操作日志 */
......@@ -96,19 +100,21 @@ const getOperateLog = async (contactId: number) => {
}
/** 关闭窗口 */
const { delView } = useTagsViewStore() // 视图操作
const { currentRoute } = useRouter() // 路由
const close = () => {
delView(unref(currentRoute))
}
/** 初始化 */
const { delView } = useTagsViewStore() // 视图操作
const { currentRoute } = useRouter() // 路由
const { params } = useRoute()
onMounted(async () => {
if (!id) {
if (!params.id) {
message.warning('参数错误，联系人不能为空！')
close()
return
}
await getContactData(id)
contactId.value = params.id as unknown as number
await getContact(contactId.value)
})
</script>
src/views/crm/contact/index.vue
......@@ -53,15 +53,6 @@
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="QQ" prop="qq">
<el-input
v-model="queryParams.qq"
class="!w-240px"
clearable
placeholder="请输入QQ"
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item label="微信" prop="wechat">
<el-input
v-model="queryParams.wechat"
......@@ -109,6 +100,11 @@
<!-- 列表 -->
<ContentWrap>
<el-tabs v-model="activeName" @tab-click="handleTabClick">
<el-tab-pane label="我负责的" name="1" />
<el-tab-pane label="我参与的" name="2" />
<el-tab-pane label="下属负责的" name="3" />
</el-tabs>
<el-table v-loading="loading" :data="list" :show-overflow-tooltip="true" :stripe="true">
<el-table-column align="center" fixed="left" label="联系人姓名" prop="name" width="160">
<template #default="scope">
......@@ -224,6 +220,7 @@ import * as ContactApi from '@/api/crm/contact'
import ContactForm from './ContactForm.vue'
import { DICT_TYPE } from '@/utils/dict'
import * as CustomerApi from '@/api/crm/customer'
import { TabsPaneContext } from 'element-plus'
defineOptions({ name: 'CrmContact' })
......@@ -237,16 +234,17 @@ const customerList = ref<CustomerApi.CustomerVO[]>([]) // 客户列表
const queryParams = reactive({
pageNo: 1,
pageSize: 10,
sceneType: '1', // 默认和 activeName 相等
mobile: undefined,
telephone: undefined,
email: undefined,
customerId: undefined,
name: undefined,
qq: undefined,
wechat: undefined
})
const queryFormRef = ref() // 搜索的表单
const exportLoading = ref(false) // 导出的加载中
const activeName = ref('1') // 列表 tab
/** 查询列表 */
const getList = async () => {
......@@ -272,6 +270,12 @@ const resetQuery = () => {
handleQuery()
}
/** tab 切换 */
const handleTabClick = (tab: TabsPaneContext) => {
queryParams.sceneType = tab.paneName
handleQuery()
}
/** 添加/修改操作 */
const formRef = ref()
const openForm = (type: string, id?: number) => {
......
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 sign in to comment