提交 7112cca3 authored 作者: pengxiaohui's avatar pengxiaohui

feat:跟进记录调试接口

上级 208b6029
......@@ -55,7 +55,7 @@ export default {
handler: function (nv) {
this.userId = nv
},
immediate: true,
// immediate: true,
deep: true
},
defaultList: {
......@@ -68,6 +68,7 @@ export default {
},
methods: {
handleChange() {
console.log
const selectedUser = this.userList.find(item => item.id === this.userId)
this.$emit('input', this.userId)
this.$emit('select', selectedUser)
......
......@@ -52,3 +52,15 @@ export function editCooProject(data) {
export function delCooProject(data) {
return httpRequest.delete(`/api/customer/admin/v1/project/${data.id}`, data)
}
// 获取更进记录列表
export function getFollowRecordsList(params) {
return httpRequest.get(`/api/customer/admin/v1/${params.customer_id}/records`, { params })
}
// 新建跟进记录
export function createFollowRecord(id, data) {
return httpRequest.post(`/api/customer/admin/v1/${id}/record`, data)
}
// 删除跟进记录
export function deleteFollowRecord(id) {
return httpRequest.delete(`/api/customer/admin/v1/record/${id}`)
}
\ No newline at end of file
<template>
<el-dialog v-bind="$attrs" v-on="$listeners" width="30%" top="40vh" :title="title">
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-dialog :visible="value" :close-on-click-modal="false" :close-on-press-escape="false" top="15vh" @close="handleClose" width="560px" title="创建跟进记录">
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-form-item label="跟进员工" prop="staff">
<el-select v-model="form.source" placeholder="请选择跟进员工" size="small" style="width: 100%">
<el-option label="产业学院" :value="1"></el-option>
</el-select>
<app-user-search v-model="form.staff"></app-user-search>
</el-form-item>
<el-form-item label="跟进时间" prop="follow_up_date">
<el-input v-model="form.follow_up_date" />
<!-- <el-input v-model="form.follow_up_date" /> -->
<el-date-picker
v-model="form.follow_up_date"
type="datetime"
placeholder="请选择跟进时间"
size="small"
>
</el-date-picker>
</el-form-item>
<el-form-item label="联系人" prop="contact_id">
<el-select v-model="form.contact_id" placeholder="请选择负责人(可多选)" size="small" style="width: 100%">
<el-option label="公司资源" :value="1"></el-option>
<el-option label="自己开拓" :value="2"></el-option>
<el-option label="第三方介绍" :value="3"></el-option>
<el-select v-model="form.contact_id" placeholder="请选择联系人" size="small" style="width: 100%">
<el-option :label="item.name" :value="item.id" :key="item.id" v-for="item in contactList"></el-option>
</el-select>
</el-form-item>
<el-form-item label="跟进项目" prop="project_id">
<el-select v-model="form.project_id" placeholder="请选择合作意向度" size="small" style="width: 100%">
<el-option label="1" :value="1"></el-option>
<el-option label="2" :value="2"></el-option>
<el-select v-model="form.project_id" placeholder="请选择跟进项目" size="small" style="width: 100%">
<el-option :label="item.tag === 1 ? '产业学院':'1+X'" :value="item.id" :key="item.id" v-for="item in projectList"></el-option>
</el-select>
</el-form-item>
<el-form-item label="跟进方式" prop="communication_mode">
<el-select v-model="form.communication_mode" placeholder="请选择合作意向度" size="small" style="width: 100%">
<el-option label="1" :value="1"></el-option>
<el-option label="2" :value="2"></el-option>
<el-select v-model="form.communication_mode" placeholder="请选择跟进方式" size="small" style="width: 100%">
<el-option label="上门拜访" :value="1"></el-option>
<el-option label="电话" :value="2"></el-option>
<el-option label="短信" :value="2"></el-option>
<el-option label="微信" :value="2"></el-option>
</el-select>
</el-form-item>
<el-form-item label="下次联络时间" prop="next_contact_time">
<el-input v-model="form.next_contact_time" placeholder="请选择合作意向度" size="small" style="width: 100%" />
<el-date-picker
v-model="form.next_contact_time"
type="datetime"
placeholder="请选择下次联络时间"
size="small"
>
</el-date-picker>
</el-form-item>
<el-form-item label="当前项目进展" prop="project_status">
<el-select v-model="form.project_status" placeholder="请选择当前项目进展" size="small" style="width: 100%">
......@@ -42,19 +52,21 @@
</el-select>
</el-form-item>
<el-form-item label="跟进记录" prop="desc">
<el-input v-model="form.desc" />
<el-input v-model="form.desc" type="textarea" size="small" rows="4" placeholder="请输入跟进记录" />
</el-form-item>
<el-form-item>
<el-button type="primary" style="margin-left: 20px" @click="submit">提交</el-button>
<el-button @click="$emit('update:visible', false)" style="margin-left: 50px">取消</el-button>
<el-button @click="handleCancle" style="margin-left: 50px">取消</el-button>
</el-form-item>
</el-form>
</el-dialog>
</template>
<script>
import { createContact } from '../api'
import AppUserSearch from '@/components/base/AppUserSearch.vue'
import { createFollowRecord, getCoopList, getContactList } from '../api'
export default {
components: { AppUserSearch },
data() {
return {
form: {
......@@ -68,34 +80,77 @@ export default {
project_status: ''
},
rules: {
staff: [{ required: true, message: '', trigger: 'blur' }],
follow_up_date: [{ required: true, message: '', trigger: 'blur' }],
contact_id: [{ required: true, message: '', trigger: 'blur' }],
communication_mode: [{ required: true, message: '', trigger: 'blur' }],
cooperation_intention: [{ required: true, message: '', trigger: 'blur' }],
desc: [{ required: true, message: '', trigger: 'blur' }],
project_status: [{ required: true, message: '', trigger: 'blur' }]
}
staff: [{ required: true, message: '请选择跟进员工', trigger: '' }],
follow_up_date: [{ required: true, message: '请选择跟进时间', trigger: 'change' }],
contact_id: [{ required: true, message: '请选择联系人', trigger: 'change' }],
communication_mode: [{ required: true, message: '请选择跟进方式', trigger: 'changge' }],
desc: [{ required: true, message: '请输入跟进记录', trigger: 'blur' }],
project_status: [{ required: true, message: '请选择当前项目进展', trigger: 'blur' }]
},
projectList: [],
contactList: []
}
},
props: {
data: {
type: Object,
default: () => ({})
value: {
type: Boolean,
default: false
}
},
computed: {
customerId() {
return this.$route.query.id
}
},
watch: {
value(val) {
this.$nextTick(() => {
this.$refs.form.clearValidate()
})
}
},
created() {
this.fetchProjectList()
this.fetchContactList()
},
methods: {
// 提交
submit() {
this.$refs.form.validate().then(() => {
const params = Object.assign({ group_id: this.id }, this.form)
createContact(params).then(res => {
this.$message.success('新建联系人成功')
this.$emit('update:visible', false)
this.$emit('success', res.data)
const params = Object.assign({}, this.form)
for (const key in params) {
if (params[key] === '' || params[key] === null || params[key] === undefined) {
delete params[key]
}
}
createFollowRecord(this.customerId, params).then(res => {
this.$message.success('新建跟进记录成功')
this.$emit('input', false)
this.$emit('success')
})
})
},
handleCancle() {
this.$refs.form.clearValidate()
this.$emit('input', false)
},
handleClose() {
this.type = ''
this.$emit('input', false)
},
fetchProjectList() {
getCoopList({ page: 1, limit: 1000, customer_id: this.customerId }).then(res => {
if (res.code === 0) {
this.projectList = res.data.data
}
})
},
fetchContactList() {
getContactList({ page: 1, limit: 1000, customer_id: this.customerId }).then(res => {
if (res.code === 0) {
this.contactList = res.data.data
}
})
}
}
}
......@@ -115,11 +170,7 @@ export default {
::v-deep .el-dialog__body {
padding: 0 20px 20px;
}
::v-deep .form-item-select {
display: inline-block;
width: calc(50% - 10px);
}
::v-deep .el-cascader {
::v-deep .el-date-editor {
width: 100%;
}
</style>
......@@ -5,7 +5,7 @@
:visible="value"
:close-on-click-modal="false"
:close-on-press-escape="false"
top="50px"
top="15vh"
@close="handleClose"
>
<!-- <div slot="title">
......@@ -148,11 +148,6 @@ export default {
}
</script>
<style scoped>
::v-deep .case-dialog {
width: 95%;
max-width: 1160px;
margin-bottom: 20px;
}
::v-deep .el-dialog__header {
padding: 12px 20px 20px;
}
......
<template>
<div class="base-info">
<div class="bar">
<el-button type="primary" size="small">添加跟进记录</el-button>
<el-button type="primary" size="small" @click="dialogVisible = true">添加跟进记录</el-button>
</div>
<app-list v-bind="tableOptions" ref="list">
<!-- 操作 -->
<template v-slot:table-operate="{ row }">
<template>
<el-button type="text" @click="handleEdit(row)" size="mini">编辑</el-button>
<!-- <el-button type="text" @click="handleEdit(row)" size="mini">编辑</el-button> -->
<el-button type="text" @click="handleDelete(row)" size="mini">删除</el-button>
</template>
</template>
</app-list>
<create-follow v-model="dialogVisible" v-if="dialogVisible" @success="handleRefetchList"/>
</div>
</template>
<script>
// 组件
import AppList from '@/components/base/AppList.vue'
import CreateFollow from './CreateFollow.vue'
import { getFollowRecordsList, deleteFollowRecord } from '../api'
const communicationModeMap = {
1: '上门拜访',
2: '电话',
3: '短信',
4: '微信'
}
export default {
name: 'Contact',
components: { AppList },
components: { AppList, CreateFollow },
computed: {
customerId() {
return this.$route.query.id
},
// 列表配置
tableOptions() {
return {
// remote: {
// httpRequest: getRoleList,
// params: { },
// },
data: [
{
name: '李老师',
post: '校长',
department: '综合管理部',
phone: '13500010002',
email: 'seraphim1230@sina.com',
wechat: 'wfewfwefwef',
mobile: '13500030004',
qq: '379628069',
creator: '单小楠',
created_time: '2021-12-12 12:12'
remote: {
httpRequest: getFollowRecordsList,
params: {
customer_id: this.customerId
}
],
},
columns: [
// { type: 'selection', minWidth: '40px' },
{ prop: 'name', label: '姓名', minWidth: '120px' },
{ prop: 'post', label: '职位', minWidth: '120px' },
{ prop: 'department', label: '部门', minWidth: '80px' },
{ prop: 'phone', label: '电话', minWidth: '150px' },
{ prop: 'email', label: '邮箱', minWidth: '150px' },
{ prop: 'wechat', label: '微信号', minWidth: '140px' },
{ prop: 'mobile', label: '附属手机号', minWidth: '140px' },
{ prop: 'qq', label: 'QQ号', minWidth: '140px' },
{ prop: 'creator', label: '创建员工', minWidth: '140px' },
{ prop: 'created_time', label: '创建时间', minWidth: '140px' },
{
prop: 'staff',
label: '跟进员工',
minWidth: '100px',
computed({ row }) {
return row.staff.realname || row.staff.nickname
}
},
// { prop: 'project.tag', label: '跟进项目', minWidth: '120px' },
{
prop: 'project.tag',
label: '跟进项目',
minWidth: '120px',
computed({ row }) {
return row.project.tag === 1 ? '产业学院' : '1+x'
}
},
{ prop: 'contact.name', label: '联系人', minWidth: '80px' },
{ prop: 'follow_up_date', label: '跟进时间', minWidth: '150px' },
{ prop: 'next_contact_time', label: '下次联络时间', minWidth: '150px' },
// { prop: 'communication_mode', label: '跟进方式', minWidth: '140px' },
{
prop: 'communication_mode',
label: '跟进方式',
minWidth: '120px',
computed({ row }) {
return communicationModeMap[row.communication_mode]
}
},
{
prop: 'created_by',
label: '创建人',
minWidth: '100px',
computed({ row }) {
return row.created_by.realname || row.created_by.nickname
}
},
{ prop: 'created_at', label: '创建时间', minWidth: '140px' },
{ prop: 'desc', label: '跟进记录', minWidth: '140px' },
{ label: '操作', minWidth: '140px', slots: 'table-operate' }
]
}
......@@ -61,20 +90,39 @@ export default {
},
data() {
return {
form: {
name: '北京大学继续教育学院',
abbr: '北大继教',
source: '公司资源',
category: '院校类',
area: '北京市北京市海淀区',
address: '北京市海淀区颐和园路5号',
remark: '北京大学怎么怎么样等等'
}
selectedInfo: {},
dialogVisible: false
}
},
methods: {
handleAdd() {},
handleEdit() {},
handleDelete() {}
handleDelete(data) {
this.$confirm('删除客户请谨慎操作,确定删除?', '删除客户', {
confirmButtonText: '删除',
cancelButtonText: '取消',
type: 'warning'
})
.then(() => {
this.fetchDelete(data)
})
.catch(() => {})
},
fetchDelete(data) {
deleteFollowRecord(data.id).then(res => {
if (res.code === 0 && res.data && res.data.status) {
this.$message.success('删除跟进记录成功')
this.handleRefetchList()
} else {
this.$message.error('删除跟进记录失败')
}
}).catch(() => {
this.$message.error('删除跟进记录失败')
})
},
handleRefetchList() {
this.$refs.list.refetch()
}
}
}
</script>
......
......@@ -41,7 +41,7 @@
</template>
</template>
</app-list>
<customer-form-dialog v-model="dialogVisable" @change="refetchList" />
<customer-form-dialog v-model="dialogVisible" @change="refetchList" />
</app-card>
</template>
......@@ -90,7 +90,7 @@ export default {
{ name: '已合作', id: 5 },
{ name: '已失效', id: 6 }
],
dialogVisable: false
dialogVisible: false
}
},
computed: {
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论