10 changed files with 2382 additions and 1 deletions
@ -0,0 +1,27 @@ |
|||
import request from '@/utils/request' |
|||
|
|||
export default { |
|||
// 查询分页列表
|
|||
listPage: function(params) { |
|||
return request({ |
|||
url: '/oms/v1/crmcustomerfile/listPage', |
|||
method: 'post', |
|||
data: params, |
|||
headers: { 'Content-Type': 'application/json' } |
|||
}) |
|||
}, |
|||
fetchBySid: function(data) { |
|||
return request({ |
|||
url: '/oms/v1/crmcustomerfile/fetchFileListBySid/' + data, |
|||
method: 'get' |
|||
}) |
|||
}, |
|||
save: function(data) { |
|||
return request({ |
|||
url: '/oms/v1/crmfile/save', |
|||
method: 'post', |
|||
data: data, |
|||
headers: { 'Content-Type': 'application/json' } |
|||
}) |
|||
} |
|||
} |
@ -0,0 +1,45 @@ |
|||
import request from '@/utils/request' |
|||
|
|||
export default { |
|||
// 查询分页列表
|
|||
listPage: function(params) { |
|||
return request({ |
|||
url: '/oms/v1/crmvisit/pagerList', |
|||
method: 'post', |
|||
data: params, |
|||
headers: { 'Content-Type': 'application/json' } |
|||
}) |
|||
}, |
|||
fetchBySid: function(data) { |
|||
return request({ |
|||
url: '/oms/v1/crmvisit/fetchSid/' + data, |
|||
method: 'get' |
|||
}) |
|||
}, |
|||
save: function(data) { |
|||
return request({ |
|||
url: '/oms/v1/crmvisit/save', |
|||
method: 'post', |
|||
data: data, |
|||
headers: { 'Content-Type': 'application/json' } |
|||
}) |
|||
}, |
|||
update: function(data) { |
|||
return request({ |
|||
url: '/oms/v1/crmvisit/update', |
|||
method: 'post', |
|||
data: data, |
|||
headers: { 'Content-Type': 'application/json' } |
|||
}) |
|||
}, |
|||
del: function(data) { |
|||
return request({ |
|||
url: '/oms/v1/crmvisit/del', |
|||
method: 'DELETE', |
|||
data: data, |
|||
headers: { |
|||
'Content-Type': 'application/json' |
|||
} |
|||
}) |
|||
} |
|||
} |
@ -0,0 +1,43 @@ |
|||
import request from '@/utils/request' |
|||
|
|||
export default { |
|||
// 查询分页列表
|
|||
listPage: function(params) { |
|||
return request({ |
|||
url: '/oms/v1/crmcustomertemp/listPage', |
|||
method: 'post', |
|||
data: params, |
|||
headers: { 'Content-Type': 'application/json' } |
|||
}) |
|||
}, |
|||
fetchBySid: function(data) { |
|||
return request({ |
|||
url: '/oms/v1/crmcustomertemp/fetchSid/' + data, |
|||
method: 'get' |
|||
}) |
|||
}, |
|||
deleteBySids: function(data) { |
|||
return request({ |
|||
url: '/oms/v1/crmcustomertemp/del', |
|||
method: 'DELETE', |
|||
data: data, |
|||
headers: { 'Content-Type': 'application/json' } |
|||
}) |
|||
}, |
|||
save: function(data) { |
|||
return request({ |
|||
url: '/oms/v1/crmcustomertemp/save', |
|||
method: 'post', |
|||
data: data, |
|||
headers: { 'Content-Type': 'application/json' } |
|||
}) |
|||
}, |
|||
update: function(data) { |
|||
return request({ |
|||
url: '/oms/v1/crmcustomertemp/save', |
|||
method: 'post', |
|||
data: data, |
|||
headers: { 'Content-Type': 'application/json' } |
|||
}) |
|||
} |
|||
} |
@ -0,0 +1,261 @@ |
|||
<template> |
|||
<div class="app-container"> |
|||
<!--列表页面--> |
|||
<div v-show="viewState == 1"> |
|||
<button-bar view-title="客户档案资料" ref="btnbar" :btndisabled="btndisabled" @btnhandle="btnHandle"/> |
|||
<!--Start查询列表部分--> |
|||
<div class="main-content"> |
|||
<div class="searchcon"> |
|||
<el-button size="small" class="searchbtn" @click="clicksearchShow">{{ searchxianshitit }}</el-button> |
|||
<div v-show="isSearchShow" class="search"> |
|||
<el-form ref="listQueryform" :inline="true" :model="listQuery" label-width="100px" class="tab-header"> |
|||
<el-form-item label="文件类型"> |
|||
<el-input v-model="listQuery.params.attachType" placeholder="" clearable/> |
|||
</el-form-item> |
|||
<el-form-item label="文件名称"> |
|||
<el-input v-model="listQuery.params.fileName" placeholder="" clearable/> |
|||
</el-form-item> |
|||
</el-form> |
|||
<div class="btn" style="text-align: center;"> |
|||
<el-button type="primary" icon="el-icon-search" size="small" @click="handleFilter">查询</el-button> |
|||
<el-button type="primary" icon="el-icon-refresh" size="small" @click="handleReset">重置</el-button> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<!--End查询列表部分--> |
|||
<div class="listtop"> |
|||
<div class="tit">{{ customerName }}客户档案资料</div> |
|||
<pageye v-show="list.length > 0" :total="listQuery.total" :page.sync="listQuery.current" :limit.sync="listQuery.size" class="pagination" @pagination="getList"/> |
|||
</div> |
|||
<!--Start 主页面主要部分 --> |
|||
<div class=""> |
|||
<el-table :key="tableKey" v-loading="listLoading" :data="list" border style="width: 100%;"> |
|||
<el-table-column label="序号" type="index" width="80" :index="indexMethod" align="center"/> |
|||
<el-table-column prop="attachType" label="文件类型" align="center" /> |
|||
<el-table-column prop="fileName" label="文件名称" align="center" /> |
|||
<el-table-column label="图片" align="center"> |
|||
<template slot-scope="scope"> |
|||
<el-button type="primary" size="small" @click="handleAdd(scope.row)">上传</el-button> |
|||
<el-button type="primary" size="small" @click="handleLook(scope.row)">查看</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="name" label="最新上传人" align="center" /> |
|||
<el-table-column prop="createTime" label="最新上传时间" align="center"/> |
|||
</el-table> |
|||
</div> |
|||
<!--End 主页面主要部分--> |
|||
<div class="pages"> |
|||
<div class="tit"/> |
|||
<!-- 翻页 --> |
|||
<pagination v-show="list.length > 0" :total="listQuery.total" :page.sync="listQuery.current" :limit.sync="listQuery.size" class="pagination" @pagination="getList"/> |
|||
</div> |
|||
<!--End查询列表部分--> |
|||
</div> |
|||
</div> |
|||
<el-dialog :visible="dialogVisible" width="50%"> |
|||
<el-form ref="" :model="formobj" class="formaddcopy02"> |
|||
<el-row style="border-top: 1px solid #e0e3eb"> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">文件类型</div> |
|||
<el-form-item><el-input class="addinputInfo addinputw" v-model="formobj.attachType" clearable placeholder="" /></el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">文件名称</div> |
|||
<el-form-item><el-input class="addinputInfo addinputw" v-model="formobj.fileName" clearable placeholder="" /></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<div class="span-sty">附件</div> |
|||
<el-form-item> |
|||
<uploadImg ref="uploadImg" class="addinputInfo" v-model="formobj.filePath" :limit="50" bucket="map" :upload-data="{ type: '0001' }"/> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
<div slot="footer" class="dialog-footer"> |
|||
<el-button type="primary" size="small" @click="handleSave()">保存</el-button> |
|||
<el-button type="info" size="small" @click="dialogVisible = false">关闭</el-button> |
|||
</div> |
|||
</el-dialog> |
|||
<!-- 查看附件 --> |
|||
<el-dialog :visible.sync="dialogImageVisible"> |
|||
<el-image style="width: 150px; height: 150px" v-for="(item, index) in image_list" :key="index" :src="item" :preview-src-list="image_list"/> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import Pagination from '@/components/pagination' |
|||
import pageye from '@/components/pagination/pageye' |
|||
import ButtonBar from '@/components/ButtonBar' |
|||
import req from '@/api/customerManagement/customerArchives' |
|||
import uploadImg from '@/components/uploadFile/uploadImg' |
|||
|
|||
export default { |
|||
name: 'CustomerArchives', |
|||
components: { |
|||
Pagination, |
|||
pageye, |
|||
ButtonBar, |
|||
uploadImg |
|||
}, |
|||
data() { |
|||
return { |
|||
btndisabled: false, |
|||
dialogVisible: false, |
|||
formobj: { |
|||
fileName: '', |
|||
attachType: '', |
|||
filePath: [], |
|||
linkSid: '', |
|||
name: '' |
|||
}, |
|||
dialogImageVisible: false, |
|||
image_list: [], |
|||
customerName: '', |
|||
btnList: [ |
|||
{ |
|||
type: 'info', |
|||
size: 'small', |
|||
icon: 'cross', |
|||
btnKey: 'doClose', |
|||
btnLabel: '关闭' |
|||
} |
|||
], |
|||
isSearchShow: false, |
|||
searchxianshitit: '显示查询条件', |
|||
viewState: 1, // 1、列表 2、新增 3、编辑 4、查看 |
|||
tableKey: 0, |
|||
list: [], |
|||
sids: [], // 用于导出的时候保存已选择的SIDs |
|||
FormLoading: false, |
|||
listLoading: false, |
|||
// 翻页 |
|||
listQuery: { |
|||
current: 1, |
|||
size: 5, |
|||
total: 0, |
|||
params: { |
|||
fileName: '', |
|||
attachType: '', |
|||
customerSid: '' |
|||
} |
|||
} |
|||
} |
|||
}, |
|||
mounted() { |
|||
this.$refs['btnbar'].setButtonList(this.btnList) |
|||
}, |
|||
methods: { |
|||
// 搜索条件效果 |
|||
clicksearchShow() { |
|||
this.isSearchShow = !this.isSearchShow |
|||
if (this.isSearchShow) { |
|||
this.searchxianshitit = '隐藏查询条件' |
|||
} else { |
|||
this.searchxianshitit = '显示查询条件' |
|||
} |
|||
}, |
|||
btnHandle(btnKey) { |
|||
console.log('XXXXXXXXXXXXXXX ' + btnKey) |
|||
switch (btnKey) { |
|||
case 'doClose': |
|||
this.doClose() |
|||
break |
|||
default: |
|||
break |
|||
} |
|||
}, |
|||
// 表中序号 |
|||
indexMethod(index) { |
|||
var pagestart = (this.listQuery.current - 1) * this.listQuery.size |
|||
var pageindex = index + 1 + pagestart |
|||
return pageindex |
|||
}, |
|||
showData(sid, name) { |
|||
this.listQuery.params.customerSid = sid |
|||
this.customerName = name |
|||
this.getList() |
|||
}, |
|||
// 查询列表信息 |
|||
getList() { |
|||
this.listLoading = true |
|||
req.listPage(this.listQuery).then(response => { |
|||
this.listLoading = false |
|||
if (response.success) { |
|||
this.list = response.data.records |
|||
this.listQuery.total = response.data.total |
|||
} else { |
|||
this.list = [] |
|||
this.listQuery.total = 0 |
|||
} |
|||
}) |
|||
}, |
|||
// 查询按钮 |
|||
handleFilter() { |
|||
this.listQuery.current = 1 |
|||
this.getList() |
|||
}, |
|||
// 点击重置 |
|||
handleReset() { |
|||
this.listQuery.current = 1 |
|||
this.listQuery.size = 5 |
|||
this.listQuery.total = 0 |
|||
this.listQuery.params.attachType = '' |
|||
this.listQuery.params.fileName = '' |
|||
this.getList() |
|||
}, |
|||
handleAdd(row) { |
|||
this.dialogVisible = true |
|||
this.formobj.fileName = row.fileName |
|||
this.formobj.attachType = row.attachType |
|||
this.formobj.linkSid = row.sid |
|||
this.formobj.name = window.sessionStorage.getItem('userName') |
|||
req.fetchBySid(row.sid).then((res) => { |
|||
if (res.success) { |
|||
if (res.data.crmFileDetailsVoList.length > 0) { |
|||
res.data.crmFileDetailsVoList.forEach((e) => { |
|||
this.formobj.filePath.push(e) |
|||
}) |
|||
} |
|||
} |
|||
}) |
|||
}, |
|||
handleSave() { |
|||
req.save(this.formobj).then((res) => { |
|||
if (res.success) { |
|||
this.dialogVisible = false |
|||
this.formobj = { |
|||
fileName: '', |
|||
attachType: '', |
|||
filePath: [], |
|||
linkSid: '', |
|||
name: '' |
|||
} |
|||
this.$message({ showClose: true, type: 'success', message: '保存成功' }) |
|||
this.getList() |
|||
} |
|||
}) |
|||
}, |
|||
handleLook(row) { |
|||
req.fetchBySid(row.sid).then((res) => { |
|||
if (res.success) { |
|||
this.dialogImageVisible = true |
|||
this.image_list = [] |
|||
if (res.data.crmFileDetailsVoList.length > 0) { |
|||
res.data.crmFileDetailsVoList.forEach((e) => { |
|||
this.image_list.push(e.url) |
|||
}) |
|||
} |
|||
} |
|||
}) |
|||
}, |
|||
doClose() { |
|||
this.$emit('doback') |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style scoped> |
|||
</style> |
@ -0,0 +1,323 @@ |
|||
<template> |
|||
<div class="app-container"> |
|||
<div v-show="viewState == 1"> |
|||
<button-bar view-title="客户跟进记录" ref="btnbar" :btndisabled="btndisabled" @btnhandle="btnHandle"/> |
|||
<div class="main-content"> |
|||
<div class="searchcon"> |
|||
<el-button size="small" class="searchbtn" @click="clicksearchShow">{{ searchxianshitit }}</el-button> |
|||
<div v-show="isSearchShow" class="search"> |
|||
<el-form ref="listQueryform" :inline="true" :model="listQuery" label-width="100px" class="tab-header"> |
|||
<el-form-item class="formItem" label="跟进时间"> |
|||
<el-date-picker value-format="yyyy-MM-dd" v-model="listQuery.params.start_follow_time" clearable type="date" placeholder="开始日期"/> |
|||
<span style="padding: 0 8px">至</span> |
|||
<el-date-picker value-format="yyyy-MM-dd" v-model="listQuery.params.end_follow_time" clearable type="date" placeholder="结束日期"/> |
|||
</el-form-item> |
|||
<el-form-item label="跟进形式"> |
|||
<el-select v-model="listQuery.params.follow_form_key" class="addinputw" placeholder="请输入"> |
|||
<el-option v-for="item in followupform" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="跟进状态"> |
|||
<el-select v-model="listQuery.params.follow_state_key" class="addinputw" placeholder=""> |
|||
<el-option v-for="item in followupstatus" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-form> |
|||
<div class="btn" style="text-align: center;"> |
|||
<el-button type="primary" icon="el-icon-search" size="small" @click="handleReset()">查询</el-button> |
|||
<el-button type="primary" icon="el-icon-refresh" size="small" @click="handleFilter()">重置</el-button> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="listtop"> |
|||
<div class="tit">客户跟进记录列表</div> |
|||
<!-- 翻页分页 --> |
|||
<pageye v-show="total>0" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size" class="pagination" @pagination="getList"/> |
|||
</div> |
|||
<div class=""> |
|||
<el-table :key="tableKey" v-loading="listLoading" :data="list" border fit highlight-current-row style="width: 100%;" @selection-change="handleSelectionChange"> |
|||
<el-table-column type="selection" align="center" width="50"/> |
|||
<el-table-column label="序号" type="index" width="80" :index="indexMethod" align="center"/> |
|||
<el-table-column prop="follow_form" label="跟进形式" align="center" /> |
|||
<el-table-column prop="follow_time" label="跟进时间" align="center" /> |
|||
<el-table-column prop="follow_result" label="跟进结果" align="center" /> |
|||
<el-table-column prop="follow_state" label="跟进状态" align="center" /> |
|||
<el-table-column prop="staffName" label="业务员" align="center" /> |
|||
<el-table-column prop="isOnRemind" label="是否开启提醒" align="center" /> |
|||
<el-table-column prop="remind_day" label="提醒日期" align="center" /> |
|||
<el-table-column label="见证材料" align="center"> |
|||
<template slot-scope="scope"> |
|||
<span class="bluezi" @click="handleCheck(scope.row)">查看</span> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
</div> |
|||
<div class="pages"> |
|||
<div class="tit"/> |
|||
<!-- 翻页 --> |
|||
<pagination v-show="total > 0" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size" class="pagination" @pagination="getList"/> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<!-- 新增或编辑 --> |
|||
<customerFollowUpAdd ref="divAdd" v-show="viewState == 2 ||viewState == 3" @doback="resetState" @reloadlist="getList"/> |
|||
<!-- 查看附件 --> |
|||
<el-dialog :visible.sync="dialogImageVisible"> |
|||
<el-image style="width: 150px; height: 150px" v-for="(item, index) in image_list" :key="index" :src="item" :preview-src-list="image_list"/> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import req from '@/api/customerManagement/customerFollowUp' |
|||
import Pagination from '@/components/pagination' |
|||
import pageye from '@/components/pagination/pageye' |
|||
import ButtonBar from '@/components/ButtonBar' |
|||
import customerFollowUpAdd from './customerFollowUpAdd.vue' |
|||
import { typeValues } from '@/api/Common/dictcommons' |
|||
|
|||
export default { |
|||
name: 'CustomerFollowUp', |
|||
components: { |
|||
Pagination, |
|||
pageye, |
|||
ButtonBar, |
|||
customerFollowUpAdd |
|||
}, |
|||
data() { |
|||
return { |
|||
btndisabled: false, |
|||
btnList: [ |
|||
{ |
|||
type: 'primary', |
|||
size: 'small', |
|||
icon: 'plus', |
|||
btnKey: 'toAdd', |
|||
btnLabel: '新增' |
|||
}, |
|||
{ |
|||
type: 'primary', |
|||
size: 'small', |
|||
icon: 'edit', |
|||
btnKey: 'toEdit', |
|||
btnLabel: '编辑' |
|||
}, |
|||
{ |
|||
type: 'danger', |
|||
size: 'small', |
|||
icon: 'del', |
|||
btnKey: 'doDel', |
|||
btnLabel: '删除' |
|||
}, |
|||
{ |
|||
type: 'info', |
|||
size: 'small', |
|||
icon: 'cross', |
|||
btnKey: 'doClose', |
|||
btnLabel: '关闭' |
|||
} |
|||
], |
|||
viewState: 1, |
|||
isSearchShow: false, |
|||
searchxianshitit: '隐藏查询条件', |
|||
// 查询 ----------- |
|||
tableKey: 0, |
|||
list: [], |
|||
sids: [], |
|||
total: 1, |
|||
listLoading: false, |
|||
listQuery: { |
|||
current: 1, |
|||
size: 5, |
|||
params: { |
|||
start_follow_time: '', |
|||
follow_type: '', |
|||
follow_form: '', |
|||
follow_form_key: '', |
|||
end_follow_time: '', |
|||
follow_state: '', |
|||
follow_state_key: '', |
|||
customerSid: '', |
|||
staffSid: '' |
|||
} |
|||
}, |
|||
image_list: [], |
|||
Kehu_Name: '', |
|||
kehu_uesrsid: '', |
|||
followupform: [], |
|||
followupstatus: [], |
|||
dialogImageVisible: false |
|||
} |
|||
}, |
|||
mounted() { |
|||
this.$refs['btnbar'].setButtonList(this.btnList) |
|||
}, |
|||
methods: { |
|||
btnHandle(btnKey) { |
|||
console.log('XXXXXXXXXXXXXXX ' + btnKey) |
|||
switch (btnKey) { |
|||
case 'toAdd': |
|||
this.toAdd() |
|||
break |
|||
case 'toEdit': |
|||
this.toEdit() |
|||
break |
|||
case 'doDel': |
|||
this.doDel() |
|||
break |
|||
case 'doClose': |
|||
this.doClose() |
|||
break |
|||
default: |
|||
break |
|||
} |
|||
}, |
|||
// 搜索条件效果 |
|||
clicksearchShow() { |
|||
this.isSearchShow = !this.isSearchShow |
|||
if (this.isSearchShow) { |
|||
this.searchxianshitit = '隐藏查询条件' |
|||
} else { |
|||
this.searchxianshitit = '显示查询条件' |
|||
} |
|||
}, |
|||
// 初始 |
|||
init() { |
|||
typeValues({ type: 'visitWay' }).then((response) => { |
|||
if (response.success) { |
|||
this.followupform = response.data |
|||
} |
|||
}) |
|||
typeValues({ type: 'followState' }).then((response) => { |
|||
if (response.success) { |
|||
this.followupstatus = response.data |
|||
} |
|||
}) |
|||
}, |
|||
// 接收客户管理值 |
|||
showData(sid, name) { |
|||
this.Kehu_Name = name |
|||
this.kehu_uesrsid = sid |
|||
this.init() |
|||
this.getList() |
|||
}, |
|||
// 查询 |
|||
handleReset() { |
|||
this.listQuery.current = 1 |
|||
this.getList() |
|||
}, |
|||
// 序号 |
|||
indexMethod(index) { |
|||
var pagestart = (this.listQuery.current - 1) * this.listQuery.size |
|||
var pageindex = index + 1 + pagestart |
|||
return pageindex |
|||
}, |
|||
// 查询列表信息 |
|||
getList() { |
|||
this.listLoading = true |
|||
this.listQuery.params.customerSid = this.kehu_uesrsid |
|||
req.listPage(this.listQuery).then((response) => { |
|||
this.listLoading = false |
|||
if (response.success) { |
|||
this.list = response.data.records |
|||
this.total = response.data.total |
|||
} else { |
|||
this.list = [] |
|||
this.total = 0 |
|||
} |
|||
}) |
|||
}, |
|||
// 重置 |
|||
handleFilter() { |
|||
this.listQuery = { |
|||
current: 1, |
|||
size: 5, |
|||
params: { |
|||
start_follow_time: '', |
|||
follow_type: '', |
|||
follow_form: '', |
|||
follow_form_key: '', |
|||
end_follow_time: '', |
|||
follow_state: '', |
|||
follow_state_key: '', |
|||
customerSid: '', |
|||
staffSid: '' |
|||
} |
|||
} |
|||
this.getList() |
|||
}, |
|||
// 勾选 |
|||
handleSelectionChange(row) { |
|||
const aa = [] |
|||
row.forEach((element) => { |
|||
aa.push(element.sid) |
|||
}) |
|||
this.sids = aa |
|||
}, |
|||
// 打开添加 |
|||
toAdd() { |
|||
this.viewState = 2 |
|||
this.$refs['divAdd'].showAdd(this.Kehu_Name, this.kehu_uesrsid) |
|||
}, |
|||
// 打开修改 |
|||
toEdit() { |
|||
if (this.sids.length === 1) { |
|||
this.viewState = 3 |
|||
this.$refs['divAdd'].showEdit(this.sids[0]) |
|||
} else { |
|||
this.$notify({ title: '提示', message: '请选择一条记录进行操作', type: 'error', duration: 2000 }) |
|||
return |
|||
} |
|||
}, |
|||
resetState() { |
|||
this.viewState = 1 |
|||
}, |
|||
// 查看詳情 |
|||
handleCheck(row) { |
|||
this.dialogImageVisible = true |
|||
this.image_list = [] |
|||
if (row.files.length > 0) { |
|||
row.files.forEach((e) => { |
|||
this.image_list.push(e.url) |
|||
}) |
|||
} |
|||
}, |
|||
// 根据本行ID删除数据 |
|||
doDel() { |
|||
if (this.sids.length === 0) { |
|||
this.$message({ showClose: true, type: 'error', message: '请选择至少一条记录进行删除操作' }) |
|||
return |
|||
} |
|||
const tip = '请确认是否删除所选 ' + this.sids.length + ' 条记录?' |
|||
this.$confirm(tip, '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消', |
|||
type: 'warning' |
|||
}).then(() => { |
|||
const loading = this.$loading({ |
|||
lock: true, |
|||
text: 'Loading', |
|||
spinner: 'el-icon-loading', |
|||
background: 'rgba(0, 0, 0, 0.7)' |
|||
}) |
|||
req.del(this.sids).then((resp) => { |
|||
if (resp.success) { |
|||
this.$message({ type: 'success', message: resp.msg, showClose: true }) |
|||
} |
|||
this.getList() |
|||
loading.close() |
|||
}).catch(e => { |
|||
loading.close() |
|||
}) |
|||
}).catch(() => { |
|||
}) |
|||
}, |
|||
doClose() { |
|||
this.$emit('reloadlist') |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
</style> |
@ -0,0 +1,265 @@ |
|||
<template> |
|||
<div class="app-container"> |
|||
<div class="tab-header webtop"> |
|||
<div>{{viewTitle}}</div> |
|||
<div> |
|||
<el-button type="primary" size="small" @click="handleCreate()">保存</el-button> |
|||
<el-button type="info" size="small" icon="el-icon-close" @click="handleReturn()">关闭</el-button> |
|||
</div> |
|||
</div> |
|||
<div class="listconadd"> |
|||
<el-form ref="dataForm" :model="temp" class="formaddcopy02" :rules="rules"> |
|||
<el-row style="border-top: 1px solid #e0e3eb"> |
|||
<el-col :span="12"> |
|||
<div class="span-sty"><span class="icon">*</span>跟进形式</div> |
|||
<el-form-item prop="follow_form"> |
|||
<el-select class="addinputInfo" v-model="temp.follow_form_key" placeholder="" @change="getXingshi" filterable> |
|||
<el-option v-for="item in followupform" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">跟进时间</div> |
|||
<el-form-item><el-date-picker class="addinputInfo" v-model="temp.follow_time" type="date" format="yyyy-MM-dd" value-format="yyyy-MM-dd" placeholder="请选择" /></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<div class="span-sty"><span class="icon">*</span>跟进结果</div> |
|||
<el-form-item prop="follow_result"><el-input v-model="temp.follow_result" maxlength="20" placeholder="" class="addinputInfo addinputw" clearable/></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<div class="span-sty">跟进状态</div> |
|||
<el-form-item> |
|||
<el-select class="addinputInfo" v-model="temp.follow_state_key" placeholder="" @change="getZhuaangtai" filterable> |
|||
<el-option v-for="item in followupstatus" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">是否开启提醒</div> |
|||
<el-form-item> |
|||
<el-radio-group class="addinputInfo" v-model="temp.isOnRemind"> |
|||
<el-radio label="是">是</el-radio> |
|||
<el-radio label="否">否</el-radio> |
|||
</el-radio-group> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div v-show="temp.isOnRemind=='是'"> |
|||
<div class="span-sty">提醒日期</div> |
|||
<el-form-item><el-date-picker class="addinputInfo" v-model="temp.remind_day" type="date" format="yyyy-MM-dd" value-format="yyyy-MM-dd" placeholder="选择日期" :picker-options="pickerOptions" /></el-form-item> |
|||
</div> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row v-show="temp.isOnRemind=='是'"> |
|||
<el-col :span="24"> |
|||
<div class="span-sty">提醒备注</div> |
|||
<el-form-item><el-input class="addinputInfo addinputw" v-model="temp.remind_remark" maxlength="20" placeholder="" clearable /></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<div class="span-sty">见证材料</div> |
|||
<el-form-item> |
|||
<uploadImg ref="uploadImg" class="addinputInfo" v-model="temp.list" :limit="50" bucket="map" :upload-data="{ type: '0001' }"/> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
<script> |
|||
import req from '@/api/customerManagement/customerFollowUp' |
|||
import { typeValues } from '@/api/Common/dictcommons' |
|||
import uploadImg from '@/components/uploadFile/uploadImg' |
|||
|
|||
export default { |
|||
name: 'CustomerFollowUpAdd', |
|||
components: { |
|||
uploadImg |
|||
}, |
|||
data() { |
|||
return { |
|||
// 限制日期不可选择当天之前的 |
|||
pickerOptions: { |
|||
disabledDate(time) { |
|||
let oneDay = 60 * 60 * 24 * 1000 |
|||
return time.getTime() < Date.now() - oneDay |
|||
} |
|||
}, |
|||
viewTitle: '', |
|||
FormLoading: false, |
|||
followupform: [], |
|||
followupstatus: [], |
|||
temp: { |
|||
customerName: '', |
|||
customerSid: '', |
|||
follow_form: '', |
|||
follow_form_key: '', |
|||
follow_result: '', |
|||
follow_state: '', |
|||
follow_state_key: '', |
|||
follow_time: '', |
|||
isOnRemind: '', |
|||
isOnRemindkey: '', |
|||
orgSid: '', |
|||
remind_day: '', |
|||
remind_remark: '', |
|||
sid: '', |
|||
staffName: '', |
|||
staffSid: '', |
|||
visit_witness_materials: '', |
|||
list: [] |
|||
}, |
|||
rules: { |
|||
follow_form: [{ required: true, message: '请填写', trigger: 'blur' }], |
|||
follow_result: [{ required: true, message: '请填写', trigger: 'blur' }] |
|||
} |
|||
} |
|||
}, |
|||
created() { |
|||
// 初始化变量 |
|||
this.init() |
|||
}, |
|||
methods: { |
|||
init() { |
|||
this.getShuJuZiDian() |
|||
}, |
|||
// 新增 |
|||
showAdd(name, sid) { |
|||
this.viewTitle = '【新增】客户跟进记录' |
|||
this.$nextTick(() => { |
|||
this.$refs['dataForm'].clearValidate() |
|||
}) |
|||
this.temp.customerName = name |
|||
this.temp.customerSid = sid |
|||
this.temp.orgSid = window.sessionStorage.getItem('orgSid') |
|||
}, |
|||
// 修改回显 |
|||
showEdit(sid) { |
|||
this.viewTitle = '【编辑】客户跟进记录' |
|||
this.$nextTick(() => { |
|||
this.$refs['dataForm'].clearValidate() |
|||
}) |
|||
req.fetchBySid(sid).then((response) => { |
|||
if (response.success) { |
|||
this.temp = response.data |
|||
} |
|||
}) |
|||
}, |
|||
// ----------------------------------方法-------------------- |
|||
// 返回 |
|||
handleReturn(isreload) { |
|||
if (isreload === 'true') this.$emit('reloadlist') |
|||
this.temp = { |
|||
customerName: '', |
|||
customerSid: '', |
|||
follow_form: '', |
|||
follow_form_key: '', |
|||
follow_result: '', |
|||
follow_state: '', |
|||
follow_state_key: '', |
|||
follow_time: '', |
|||
isOnRemind: '', |
|||
isOnRemindkey: '', |
|||
orgSid: '', |
|||
remind_day: '', |
|||
remind_remark: '', |
|||
sid: '', |
|||
staffName: '', |
|||
staffSid: '', |
|||
visit_witness_materials: '', |
|||
list: [] |
|||
} |
|||
this.$emit('doback') |
|||
}, |
|||
// 添加数据 |
|||
handleCreate() { |
|||
if (this.temp.isOnRemind === '是') { |
|||
this.temp.isOnRemindkey = '1' |
|||
} else if (this.temp.isOnRemind === '否') { |
|||
this.temp.isOnRemindkey = '0' |
|||
} |
|||
this.$refs['dataForm'].validate((valid) => { |
|||
if (valid) { |
|||
this.FormLoading = true |
|||
if (this.temp.sid === '') { |
|||
req.save(this.temp).then((response) => { |
|||
this.FormLoading = false |
|||
if (response.success) { |
|||
this.$notify({ title: '提示', message: '添加成功', type: 'success', duration: 2000 }) |
|||
this.handleReturn('true') |
|||
} |
|||
}) |
|||
} else { |
|||
req.update(this.temp).then((response) => { |
|||
this.FormLoading = false |
|||
if (response.success) { |
|||
this.$notify({ title: '提示', message: '修改成功', type: 'success', duration: 2000 }) |
|||
this.handleReturn('true') |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
}) |
|||
}, |
|||
// 数据字典 |
|||
getShuJuZiDian() { |
|||
typeValues({ type: 'visitWay' }).then((response) => { |
|||
if (response.success) { |
|||
this.followupform = response.data |
|||
} |
|||
}) |
|||
typeValues({ type: 'followState' }).then((response) => { |
|||
if (response.success) { |
|||
this.followupstatus = response.data |
|||
} |
|||
}) |
|||
}, |
|||
// 跟进形式 处理 |
|||
getXingshi(value) { |
|||
const choose = this.followupform.filter((item) => item.dictKey === value) |
|||
if (choose !== null && choose.length > 0) { |
|||
this.temp.follow_form = choose[0].dictValue |
|||
} else { |
|||
this.temp.follow_form = '' |
|||
} |
|||
}, |
|||
// 跟进状态 处理 |
|||
getZhuaangtai(value) { |
|||
const choose = this.followupstatus.filter((item) => item.dictKey === value) |
|||
if (choose !== null && choose.length > 0) { |
|||
this.temp.follow_state = choose[0].dictValue |
|||
} else { |
|||
this.temp.follow_state = '' |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style scoped> |
|||
.span-sty { |
|||
width: 130px !important; |
|||
} |
|||
.addinputInfo { |
|||
margin-left: 120px !important; |
|||
} |
|||
/deep/ .el-form-item__error { |
|||
margin-left: 120px !important; |
|||
} |
|||
.formaddcopy02 .el-row .el-col /deep/ .el-form-item .addinputw { |
|||
margin-left: 120px !important; |
|||
width: calc(100% - 115px); |
|||
} |
|||
.formaddcopy02 .el-row .el-col /deep/ .el-form-item .el-radio-group { |
|||
display: inline; |
|||
line-height: 1px; |
|||
vertical-align: middle; |
|||
} |
|||
</style> |
@ -0,0 +1,488 @@ |
|||
<template> |
|||
<div class="app-container"> |
|||
<div v-show="viewState ==1"> |
|||
<button-bar view-title="客户管理" ref="btnbar" :btndisabled="btndisabled" @btnhandle="btnHandle"/> |
|||
<div class="main-content"> |
|||
<div class="searchcon"> |
|||
<el-button size="small" class="searchbtn" @click="clicksearchShow">{{ searchxianshitit }}</el-button> |
|||
<div v-show="isSearchShow" class="search"> |
|||
<el-form ref="listQueryform" :inline="true" :model="listQuery" label-width="100px" class="tab-header"> |
|||
<el-form-item label="客户名称"> |
|||
<el-input v-model="listQuery.params.name" maxlength="20" placeholder="请输入客户名称" class="addinputw" clearable/> |
|||
</el-form-item> |
|||
<el-form-item label="客户类型"> |
|||
<el-select v-model="listQuery.params.customerTypeKey" class="addinputw" placeholder="请选择"> |
|||
<el-option v-for="item in merType" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="联系电话"> |
|||
<el-input v-model="listQuery.params.mobile" maxlength="20" placeholder="请输入联系电话" class="addinputw" clearable/> |
|||
</el-form-item> |
|||
<el-form-item label="客户级别"> |
|||
<el-select v-model="listQuery.params.levelKey" class="addinputw" placeholder="请选择客户级别"> |
|||
<el-option v-for="item in induslevel" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="提醒日期"> |
|||
<el-date-picker value-format="yyyy-MM-dd" v-model="listQuery.params.remindStartDay" clearable style="width: 160px;" type="date" placeholder="开始日期"/> |
|||
<span style="padding: 0 8px">至</span> |
|||
<el-date-picker value-format="yyyy-MM-dd" v-model="listQuery.params.remindEndDay" clearable style="width: 160px;" type="date" placeholder="结束日期"/> |
|||
</el-form-item> |
|||
</el-form> |
|||
<div class="btn" style="text-align: center;"> |
|||
<el-button type="primary" icon="el-icon-search" size="small" @click="handleReset">查询</el-button> |
|||
<el-button type="primary" icon="el-icon-refresh" size="small" @click="handleFilter">重置</el-button> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="listtop"> |
|||
<div class="tit">客户信息列表</div> |
|||
<!-- 翻页分页 --> |
|||
<pageye v-show="listQuery.total > 0" :total="listQuery.total" :page.sync="listQuery.current" :limit.sync="listQuery.size" class="pagination" @pagination="getList"/> |
|||
</div> |
|||
<div class=""> |
|||
<el-table :key="tableKey" v-loading="listLoading" :data="list" border fit highlight-current-row style="width: 100%;" @selection-change="handleSelectionChange"> |
|||
<el-table-column type="selection" align="center" width="50"/> |
|||
<el-table-column label="序号" type="index" width="80" :index="indexMethod" align="center"/> |
|||
<el-table-column prop="customerNo" label="客户编号" align="center" /> |
|||
<el-table-column label="客户名称" align="center"> |
|||
<template slot-scope="scope"> |
|||
<span class="bluezi" @click="toInfo(scope.row)">{{ scope.row.name }}</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="customerType" label="客户类型" align="center" /> |
|||
<el-table-column prop="mobile" label="联系电话" align="center" /> |
|||
<el-table-column prop="weixin" label="微信号" align="center" /> |
|||
<el-table-column prop="level" label="客户级别" align="center" /> |
|||
<el-table-column prop="remind_day" label="提醒日期" align="center" /> |
|||
<el-table-column label="跟进记录" align="center"> |
|||
<template slot-scope="scope"> |
|||
<span class="bluezi" @click="handleJiLu(scope.row)">{{ scope.row.gjcounts }}</span> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
</div> |
|||
<div class="pages"> |
|||
<pagination v-show="listQuery.total > 0" :total="listQuery.total" :page.sync="listQuery.current" :limit.sync="listQuery.size" class="pagination" @pagination="getList"/> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<!--新增及修改 --> |
|||
<customerInformationAdd v-show="viewState ==2 || viewState ==3" ref="divAdd" @reloadlist="getList" @doback="resetState"/> |
|||
<!-- 详情 --> |
|||
<customerInformationInfo v-show="viewState ==4" ref="divInfo" @doback="resetState"/> |
|||
<!-- 跟进记录 --> |
|||
<customerFollowUp v-show="viewState ==5" ref="divGJ" @reloadlist="getList"/> |
|||
<!-- 客户档案 --> |
|||
<customerArchives v-show="viewState ==6" ref="divDA" @doback="resetState"/> |
|||
<!--登记类型弹窗--> |
|||
<el-dialog title="客户登记-类型" :visible.sync="dialogVisible" width="28%" top="13%"> |
|||
<el-form :model="customerTypeList"> |
|||
<el-form-item label="联络方式" :label-width="formLabelWidth" class="diaForm"> |
|||
<el-select v-model="customerTypeList.visitWayKey" placeholder="请选择联络方式" @change="getVisitWay" filterable> |
|||
<el-option v-for="(item) in visitWay_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="客户类型" :label-width="formLabelWidth" class="diaForm"> |
|||
<el-radio-group v-model="customerTypeList.customerType"> |
|||
<el-radio v-for="item in merType" :key="item.dictKey" :label="item.dictValue" @change="customerTypeChange">{{ item.dictValue }} |
|||
</el-radio> |
|||
</el-radio-group> |
|||
</el-form-item> |
|||
</el-form> |
|||
<div slot="footer" class="dialog-footer"> |
|||
<el-button class="el-button-sure" type="primary" @click="handleOpen()">确 定</el-button> |
|||
<el-button @click="dialogVisible = false">关 闭</el-button> |
|||
</div> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import req from '@/api/customerManagement/customerInformation' |
|||
import { typeValues } from '@/api/Common/dictcommons' |
|||
import Pagination from '@/components/pagination' |
|||
import pageye from '@/components/pagination/pageye' |
|||
import ButtonBar from '@/components/ButtonBar' |
|||
import customerInformationAdd from './customerInformationAdd' |
|||
import customerInformationInfo from './customerInformationInfo' |
|||
import customerFollowUp from '../customerFollowUp/customerFollowUp' |
|||
import customerArchives from '../customerArchives/customerArchives' |
|||
|
|||
export default { |
|||
name: 'CustomerInformation', |
|||
components: { |
|||
Pagination, |
|||
pageye, |
|||
ButtonBar, |
|||
customerInformationAdd, |
|||
customerInformationInfo, |
|||
customerFollowUp, |
|||
customerArchives |
|||
}, |
|||
data() { |
|||
return { |
|||
viewState: 1, |
|||
btndisabled: false, |
|||
btnList: [ |
|||
{ |
|||
type: 'primary', |
|||
size: 'small', |
|||
icon: 'plus', |
|||
btnKey: 'toAdd', |
|||
btnLabel: '新增' |
|||
}, |
|||
{ |
|||
type: 'primary', |
|||
size: 'small', |
|||
icon: 'edit', |
|||
btnKey: 'toEdit', |
|||
btnLabel: '编辑' |
|||
}, |
|||
{ |
|||
type: 'success', |
|||
size: 'small', |
|||
icon: 'user', |
|||
btnKey: 'toGenjin', |
|||
btnLabel: '客户跟进' |
|||
}, |
|||
{ |
|||
type: 'success', |
|||
size: 'small', |
|||
icon: 'user', |
|||
btnKey: 'toZiliao', |
|||
btnLabel: '客户档案' |
|||
}, |
|||
{ |
|||
type: 'danger', |
|||
size: 'small', |
|||
icon: 'del', |
|||
btnKey: 'doDel', |
|||
btnLabel: '删除' |
|||
}, |
|||
{ |
|||
type: 'success', |
|||
size: 'small', |
|||
icon: 'Import', |
|||
btnKey: 'doImport', |
|||
btnLabel: '导入' |
|||
}, |
|||
{ |
|||
type: 'success', |
|||
size: 'small', |
|||
icon: 'export', |
|||
btnKey: 'build', |
|||
btnLabel: '导出' |
|||
}, |
|||
{ |
|||
type: 'info', |
|||
size: 'small', |
|||
icon: 'cross', |
|||
btnKey: 'doClose', |
|||
btnLabel: '关闭' |
|||
} |
|||
], |
|||
dialogVisible: false, // 弹窗 |
|||
formLabelWidth: '110px', |
|||
customerTypeList: { |
|||
visitWay: '', // 联络方式 |
|||
visitWayKey: '', |
|||
customerType: '', // 客户类型 |
|||
customerTypeKey: '', // 客户类型 |
|||
psid: '' |
|||
}, |
|||
visitWay_list: [], |
|||
isSearchShow: false, |
|||
searchxianshitit: '显示查询条件', |
|||
// 查询 ----------- |
|||
tableKey: 0, |
|||
list: [], |
|||
sids: [], |
|||
names: [], |
|||
merType: [], |
|||
induslevel: [], |
|||
sourceLisst: [], |
|||
FormLoading: false, |
|||
listLoading: false, |
|||
listQuery: { |
|||
current: 1, |
|||
size: 5, |
|||
params: { |
|||
customerTypeKey: '', |
|||
levelKey: '', |
|||
mobile: '', |
|||
name: '', |
|||
remindStartDay: '', |
|||
remindEndtDay: '' |
|||
}, |
|||
total: 0 |
|||
} |
|||
} |
|||
}, |
|||
mounted() { |
|||
this.$refs['btnbar'].setButtonList(this.btnList) |
|||
}, |
|||
created() { |
|||
// 初始化变量 |
|||
this.init() |
|||
// 加载列表 |
|||
this.getList() |
|||
}, |
|||
methods: { |
|||
// 初始化 |
|||
init() { |
|||
typeValues({ type: 'customerType' }).then((res) => { |
|||
if (res.success) { |
|||
this.merType = res.data |
|||
} |
|||
}) |
|||
typeValues({ type: 'customerSource' }).then((res) => { |
|||
if (res.success) { |
|||
this.sourceLisst = res.data |
|||
} |
|||
}) |
|||
typeValues({ type: 'customerLevel' }).then((res) => { |
|||
if (res.success) { |
|||
this.induslevel = res.data |
|||
} |
|||
}) |
|||
typeValues({ type: 'visitWay' }).then((res) => { |
|||
if (res.success) { |
|||
this.visitWay_list = res.data |
|||
} |
|||
}) |
|||
}, |
|||
// 搜索条件效果 |
|||
clicksearchShow() { |
|||
this.isSearchShow = !this.isSearchShow |
|||
if (this.isSearchShow) { |
|||
this.searchxianshitit = '隐藏查询条件' |
|||
} else { |
|||
this.searchxianshitit = '显示查询条件' |
|||
} |
|||
}, |
|||
btnHandle(btnKey) { |
|||
console.log('XXXXXXXXXXXXXXX ' + btnKey) |
|||
switch (btnKey) { |
|||
case 'toAdd': |
|||
this.toAdd() |
|||
break |
|||
case 'toEdit': |
|||
this.toEdit() |
|||
break |
|||
case 'toGenjin': |
|||
this.toGenjin() |
|||
break |
|||
case 'toZiliao': |
|||
this.toZiliao() |
|||
break |
|||
case 'doDel': |
|||
this.doDel() |
|||
break |
|||
case 'doImport': |
|||
this.doImport() |
|||
break |
|||
case 'export': |
|||
this.export() |
|||
break |
|||
case 'doClose': |
|||
this.doClose() |
|||
break |
|||
default: |
|||
break |
|||
} |
|||
}, |
|||
// 序号 |
|||
indexMethod(index) { |
|||
var pagestart = (this.listQuery.current - 1) * this.listQuery.size |
|||
var pageindex = index + 1 + pagestart |
|||
return pageindex |
|||
}, |
|||
// 查询列表信息 |
|||
getList() { |
|||
this.listLoading = true |
|||
req.listPage(this.listQuery).then((response) => { |
|||
this.listLoading = false |
|||
if (response.success) { |
|||
this.list = response.data.records |
|||
this.listQuery.total = response.data.total |
|||
} else { |
|||
this.list = [] |
|||
this.listQuery.total = 0 |
|||
} |
|||
}) |
|||
}, |
|||
// 查询按钮 |
|||
handleReset() { |
|||
this.listQuery.current = 1 |
|||
this.getList() |
|||
}, |
|||
// 重置 |
|||
handleFilter() { |
|||
this.listQuery = { |
|||
current: 1, |
|||
size: 5, |
|||
params: { |
|||
customerTypeKey: '', |
|||
levelKey: '', |
|||
mobile: '', |
|||
name: '', |
|||
remindStartDay: '', |
|||
remindEndtDay: '' |
|||
}, |
|||
total: 0 |
|||
} |
|||
this.getList() |
|||
}, |
|||
// 勾选 |
|||
handleSelectionChange(row) { |
|||
const aa = [] |
|||
const cc = [] |
|||
row.forEach((element) => { |
|||
aa.push(element.sid) |
|||
}) |
|||
this.sids = aa |
|||
row.forEach((element) => { |
|||
cc.push(element.name) |
|||
}) |
|||
this.names = cc |
|||
}, |
|||
// 打开添加 |
|||
toAdd() { |
|||
this.dialogVisible = true |
|||
this.customerTypeList = { |
|||
visitWay: '', |
|||
visitWayKey: '', |
|||
customerType: '', |
|||
customerTypeKey: '', |
|||
psid: '' |
|||
} |
|||
}, |
|||
// 客户类型 |
|||
customerTypeChange(val) { |
|||
const choosetItem = this.merType.filter((item) => item.dictValue === val) |
|||
if (choosetItem !== null && choosetItem.length > 0) { |
|||
this.customerTypeList.customerTypeKey = choosetItem[0].dictKey |
|||
this.customerTypeList.psid = choosetItem[0].sid |
|||
} else { |
|||
this.customerTypeList.customerTypeKey = '' |
|||
this.customerTypeList.psid = '' |
|||
} |
|||
}, |
|||
// 联络方式 |
|||
getVisitWay(value) { |
|||
const choosetItem = this.visitWay_list.filter((item) => item.dictKey === value) |
|||
if (choosetItem !== null && choosetItem.length > 0) { |
|||
this.customerTypeList.visitWay = choosetItem[0].dictValue |
|||
} else { |
|||
this.customerTypeList.visitWay = '' |
|||
} |
|||
}, |
|||
handleOpen() { |
|||
if (this.customerTypeList.visitWay !== '' && this.customerTypeList.customerType !== '') { |
|||
this.dialogVisible = false |
|||
const customerTypeList = this.customerTypeList |
|||
this.viewState = 2 |
|||
this.$refs['divAdd'].openCreate(customerTypeList) |
|||
} else { |
|||
this.$message({ |
|||
message: '请选择联络方式和客户类型', |
|||
type: 'warning' |
|||
}) |
|||
} |
|||
}, |
|||
// 打开修改 |
|||
toEdit() { |
|||
if (this.sids.length === 1) { |
|||
this.viewState = 3 |
|||
this.$refs['divAdd'].openUpdate(this.sids[0]) |
|||
} else { |
|||
this.$notify({ title: '提示', message: '请选择一条记录进行操作', type: 'error', duration: 2000 }) |
|||
} |
|||
}, |
|||
// 打开跟进记录 |
|||
toGenjin() { |
|||
if (this.sids.length === 1) { |
|||
this.viewState = 5 |
|||
this.$refs['Newpage'].newpage(this.sids[0], this.names[0]) |
|||
} else { |
|||
this.$notify({ title: '提示', message: '请选择一条记录进行操作', type: 'error', duration: 2000 }) |
|||
} |
|||
}, |
|||
// 打开跟进记录 |
|||
handleJiLu(row) { |
|||
this.viewState = 5 |
|||
this.$refs['divGJ'].showData(row.sid, row.name) |
|||
}, |
|||
// |
|||
toZiliao() { |
|||
if (this.sids.length === 1) { |
|||
this.viewState = 6 |
|||
this.$refs['divDA'].showData(this.sids[0], this.names[0]) |
|||
} else { |
|||
this.$notify({ title: '提示', message: '请选择一条记录进行操作', type: 'error', duration: 2000 }) |
|||
} |
|||
}, |
|||
// 查看詳情 |
|||
toInfo(row) { |
|||
this.viewState = 4 |
|||
this.$refs['divInfo'].showInfo(row.sid) |
|||
}, |
|||
// 根据本行ID删除数据 |
|||
doDel() { |
|||
if (this.sids.length === 0) { |
|||
this.$message({ showClose: true, type: 'error', message: '请选择至少一条记录进行删除操作' }) |
|||
return |
|||
} |
|||
const tip = '请确认是否删除所选 ' + this.sids.length + ' 条记录?' |
|||
this.$confirm(tip, '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消', |
|||
type: 'warning' |
|||
}).then(() => { |
|||
const loading = this.$loading({ |
|||
lock: true, |
|||
text: 'Loading', |
|||
spinner: 'el-icon-loading', |
|||
background: 'rgba(0, 0, 0, 0.7)' |
|||
}) |
|||
req.deleteBySids(this.sids).then((resp) => { |
|||
if (resp.success) { |
|||
this.$message({ type: 'success', message: resp.msg, showClose: true }) |
|||
} |
|||
this.getList() |
|||
loading.close() |
|||
}).catch(e => { |
|||
loading.close() |
|||
}) |
|||
}).catch(() => { |
|||
}) |
|||
}, |
|||
// 导入 |
|||
doImport() {}, |
|||
// 导出 |
|||
export() {}, |
|||
// 添加修改返回 |
|||
resetState() { |
|||
this.viewState = 1 |
|||
}, |
|||
// 跟进记录返回 |
|||
genjinfanhui() { |
|||
this.viewState = 1 |
|||
this.getList() |
|||
}, |
|||
// 客户档案返回 |
|||
kehudanganziliao() { |
|||
this.viewState = 1 |
|||
this.getList() |
|||
}, |
|||
doClose() { |
|||
this.$store.dispatch('tagsView/delView', this.$route) |
|||
this.$router.go(-1) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
</style> |
@ -0,0 +1,614 @@ |
|||
<template> |
|||
<div class="app-container"> |
|||
<div> |
|||
<div class="tab-header webtop"> |
|||
<div>{{ viewTitle }}</div> |
|||
<div> |
|||
<el-button type="primary" size="small" icon="" @click="handleSave()">保存</el-button> |
|||
<el-button type="info" size="small" icon="el-icon-close" @click="handleReturn()">关闭</el-button> |
|||
</div> |
|||
</div> |
|||
<div class="listconadd"> |
|||
<el-form ref="dataForm" :model="temp" class="formaddcopy02" :rules="rules"> |
|||
<div class="title">基础信息</div> |
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="span-sty"><span class="icon">*</span>客户名称</div> |
|||
<el-form-item prop="name"> |
|||
<el-input class="addinputInfo addinputw" :disabled="editState" v-model="temp.name" placeholder="" clearable/> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">客户类型</div> |
|||
<el-form-item><span class="addinputInfo">{{ temp.customerType }}</span></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="span-sty"><span class="icon">*</span>联系电话</div> |
|||
<el-form-item prop="mobile"> |
|||
<el-input class="addinputInfo addinputw" :disabled="editState" v-model="temp.mobile" placeholder="" clearable/> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">微信号</div> |
|||
<el-form-item> |
|||
<el-input class="addinputInfo addinputw" v-model="temp.weixin" placeholder="" clearable/> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row v-show="temp.customerType==='个人'"> |
|||
<el-col :span="24"> |
|||
<div class="span-sty">公司名称</div> |
|||
<el-form-item> |
|||
<el-input class="addinputInfo" style="width: 20%" v-model="temp.companyName" maxlength="20" placeholder="请输入公司名称" clearable/> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<div class="span-sty">客户地址</div> |
|||
<el-form-item> |
|||
<div class="addinputInfo" style="display: flex;flex-direction: row;justify-content: flex-start;align-items: center"> |
|||
<el-select v-model="temp.province" filterable placeholder="请选择省" style="width:160px" @change="getShen"> |
|||
<el-option v-for="item in inputProvinceList" :key="item.sid" :label="item.name" :value="item.sid"/> |
|||
</el-select> |
|||
<el-select v-model="temp.city" filterable placeholder="请选择市" style="width:160px" @change="getShi"> |
|||
<el-option v-for="item in inputCityList" :key="item.sid" :label="item.name" :value="item.sid"/> |
|||
</el-select> |
|||
<el-select v-model="temp.county" filterable placeholder="请选择县" style="width:160px" @change="getQu"> |
|||
<el-option v-for="item in inputCountyList" :key="item.sid" :label="item.name" :value="item.sid"/> |
|||
</el-select> |
|||
<el-input v-model="temp.address" clearable/> |
|||
</div> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">客户级别</div> |
|||
<el-form-item> |
|||
<el-select v-model="temp.levelKey" class="addinputInfo" placeholder="请选择客户级别" @change="getJiBie" filterable> |
|||
<el-option v-for="item in induslevel" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">是否开启提醒</div> |
|||
<el-form-item> |
|||
<el-radio-group class="addinputInfo" v-model="temp.isOnRemind"> |
|||
<el-radio :disabled="editState" label="是">是</el-radio> |
|||
<el-radio :disabled="editState" label="否">否</el-radio> |
|||
</el-radio-group> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row v-show="temp.isOnRemind=='是'"> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">提醒日期</div> |
|||
<el-form-item><el-date-picker class="addinputInfo" v-model="temp.remind_day" type="date" value-format="yyyy-MM-dd" placeholder="选择日期" :picker-options="pickerOptions" clearable /></el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">提醒备注</div> |
|||
<el-form-item><el-input class="addinputInfo addinputw" v-model="temp.remind_remark" maxlength="20" placeholder="请输入提醒备注" clearable /></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<!--更多信息--> |
|||
<el-collapse v-model="activeNames"> |
|||
<el-collapse-item title="更多信息" name="1"> |
|||
<el-row v-show="temp.customerType==='个人'" style="border-top: 1px solid #e0e3eb"> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">客户生日</div> |
|||
<el-form-item><el-date-picker class="addinputInfo" v-model="temp.birthday" type="date" format="yyyy-MM-dd" value-format="yyyy-MM-dd" placeholder="请选择" clearable /></el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">性别</div> |
|||
<el-form-item> |
|||
<el-radio-group class="addinputInfo" v-model="temp.sex"> |
|||
<el-radio label="男">男</el-radio> |
|||
<el-radio label="女">女</el-radio> |
|||
</el-radio-group> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row style="border-top: 1px solid #e0e3eb"> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">证件类型</div> |
|||
<el-form-item><span class="addinputInfo">{{ temp.certificateType }}</span> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">证件号码</div> |
|||
<el-form-item><el-input v-model="temp.idnumber" maxlength="18" placeholder="请输入证件号码" class="addinputInfo addinputw" clearable/></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">证件有效期</div> |
|||
<el-form-item><el-date-picker v-model="temp.endDate" type="date" format="yyyy-MM-dd" class="addinputInfo" value-format="yyyy-MM-dd" placeholder="请选择"/></el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">电子邮箱</div> |
|||
<el-form-item><el-input class="addinputInfo addinputw" v-model="temp.e_mail" maxlength="20" placeholder="请输入电子邮箱" clearable /></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">紧急联系人</div> |
|||
<el-form-item><el-input class="addinputInfo addinputw" v-model="temp.emergencyContact" maxlength="20" placeholder="请输入紧急联系人" clearable /></el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">紧急联系电话</div> |
|||
<el-form-item><el-input class="addinputInfo addinputw" v-model="temp.emergencyMobile" maxlength="20" placeholder="请输入紧急联系电话" clearable /></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">客户来源</div> |
|||
<el-form-item> |
|||
<el-select v-model="temp.sourceKey" class="addinputInfo" placeholder="请选择客户来源" @change="getKeHuLaiYUan" filterable> |
|||
<el-option v-for="item in sourceLisst" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">客户分类</div> |
|||
<el-form-item> |
|||
<el-select v-model="temp.customerClassKey" class="addinputInfo" placeholder="请选择客户分类" @change="getFenLei" filterable> |
|||
<el-option v-for="item in merClass" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<div class="span-sty">备注</div> |
|||
<el-form-item><el-input class="addinputInfo addinputw" v-model="temp.remarks" maxlength="20" placeholder="请输入备注" clearable /></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-collapse-item> |
|||
<el-collapse-item title="见证材料" name="2"> |
|||
<el-row style="border-top: 1px solid #e0e3eb"> |
|||
<el-col :span="24"> |
|||
<div class="span-sty">附件</div> |
|||
<el-form-item> |
|||
<uploadImg ref="uploadImg" class="addinputInfo" v-model="temp.crmVisitAppendixDtoList" :limit="50" bucket="map" :upload-data="{ type: '0001' }"/> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-collapse-item> |
|||
</el-collapse> |
|||
</el-form> |
|||
</div> |
|||
</div> |
|||
<!-- 弹框提示 --> |
|||
<el-dialog :visible.sync="dialogFormVisible" width="300px" :close-on-click-modal="false"> |
|||
<div class="result-cont"> |
|||
是否更新用户 |
|||
</div> |
|||
<div slot="footer" v-loading="FormLoading" class="dialog-footer"> |
|||
<el-button @click="dialogFormVisibl()">否</el-button> |
|||
<el-button type="primary" @click="dialogStatus()">是</el-button> |
|||
</div> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import req from '@/api/customerManagement/customerInformation' |
|||
import uploadImg from '@/components/uploadFile/uploadImg' |
|||
import { getCity, getCounty, getProvince, typeValues } from '@/api/Common/dictcommons' // 省市区 |
|||
|
|||
export default { |
|||
name: 'CustomerInformationAdd', |
|||
components: { |
|||
uploadImg |
|||
}, |
|||
data() { |
|||
return { |
|||
// 限制日期不可选择当天之前的 |
|||
pickerOptions: { |
|||
disabledDate(time) { |
|||
let oneDay = 60 * 60 * 24 * 1000 |
|||
return time.getTime() < Date.now() - oneDay |
|||
} |
|||
}, |
|||
viewTitle: '', |
|||
editState: false, |
|||
inputProvinceList: [], |
|||
inputCityList: [], |
|||
inputCountyList: [], |
|||
activeNames: ['1'], |
|||
// --按钮菜单------- |
|||
customerClass: 'customerClass', |
|||
merClass: [], |
|||
customerSource: 'customerSource', |
|||
sourceLisst: [], |
|||
customerLevel: 'customerLevel', |
|||
induslevel: [], |
|||
customerType_list: [], |
|||
sex_list: [], |
|||
updateId: '', |
|||
FormLoading: false, |
|||
listLoading: false, |
|||
temp: { |
|||
address: '', // 客户地址:详细地址 |
|||
address_city: '', // 行政区划代码(市) |
|||
address_county: '', // 行政区划代码(县) |
|||
address_province: '', // 行政区划代码(省) |
|||
birthday: '', // 客户生日 |
|||
certificateType: '', // 证件类型(个人为身份证/企业为营业执照) |
|||
certificateTypeKey: '', // 证件类型key |
|||
city: '', // 客户地址:市 |
|||
companyName: '', // 公司名称 |
|||
contacts: '', // 联系人 |
|||
county: '', // 客户地址:县 |
|||
createBySid: '', // 用户sid |
|||
crmVisitAppendixDtoList: [], // 见证材料 |
|||
customerClass: '', // 客户分类(个人:司机/个体老板/其他。企业:企业型客户/一级经销商/二级经销商/终端物流客户) |
|||
customerClassKey: '', // 客户分类Key |
|||
customerOrgName: '', |
|||
customerOrgSid: '', |
|||
customerType: '', // 客户类型(1个人/2企业) |
|||
customerTypeKey: '', // 客户类型key |
|||
e_mail: '', // 电子邮箱 |
|||
emergencyContact: '', // 紧急联系人 |
|||
emergencyMobile: '', // 紧急联系电话 |
|||
endDate: '', // 证件有效期 |
|||
idnumber: '', // 证件号码 |
|||
isOnRemind: '', // 是否开启提醒(1开启,0不开启) |
|||
isOnRemindkey: '', // 是否开启提醒(1开启,0不开启) |
|||
level: '', // 客户级别(意向客户/准客户/成交客户/集团内销/黑名单客户) |
|||
levelKey: '', // 客户级别key |
|||
mobile: '', // 联系电话 |
|||
name: '', // 名称 |
|||
orgPath: '', |
|||
orgSidPath: '', |
|||
phone: '', // 电话 |
|||
province: '', // 省 |
|||
remarks: '', // 备注 |
|||
remind_day: '', // 提醒日期 |
|||
remind_remark: '', // 提醒备注 |
|||
sex: '', // 性别K |
|||
sexKey: '', // 性别Key |
|||
sid: '', |
|||
source: '', // 客户来源(公司资源/自主开发/交接客户/转介绍客户/集团内销) |
|||
sourceKey: '', // 客户来源key |
|||
staffSid: '', // 业务员sid |
|||
taxpayerNo: '', // 身份证号 |
|||
useOrgName: '', // 分公司名称 |
|||
useOrgSid: '', // 分公司sid |
|||
userSid: '', // 当前登录用户的sid |
|||
visitWay: '', // 见面方式(到店/电话/拜访) |
|||
visitWayKey: '', // 见面方式key |
|||
weixin: '' // 微信号码 |
|||
}, |
|||
dialogFormVisible: false, |
|||
rules: { |
|||
name: [{ required: true, message: '请填写客户名称', trigger: 'blur' }], |
|||
mobile: [{ required: true, message: '请填写联系电话', trigger: 'blur' }] |
|||
} |
|||
} |
|||
}, |
|||
methods: { |
|||
// 初始 |
|||
init() { |
|||
this.getShuJUZiDian() |
|||
}, |
|||
// 修改回显 |
|||
openUpdate(sid) { |
|||
this.viewTitle = '【编辑】客户信息' |
|||
this.$nextTick(() => { |
|||
this.$refs['dataForm'].clearValidate() |
|||
}) |
|||
this.init() |
|||
this.huoquSheng() // 获取省 |
|||
this.editState = true |
|||
req.fetchBySid(sid).then((response) => { |
|||
if (response.success) { |
|||
this.temp = response.data |
|||
typeValues({ type: 'customerType' }).then((res) => { |
|||
if (res.success) { |
|||
this.customerType_list = res.data |
|||
this.customerType_list.forEach((e) => { |
|||
if (e.dictValue === this.temp.customerType) { |
|||
typeValues({ psid: e.sid, type: this.customerClass }).then((res) => { |
|||
if (res.success) { |
|||
this.merClass = res.data |
|||
} |
|||
}) |
|||
} |
|||
}) |
|||
} |
|||
}) |
|||
} |
|||
}) |
|||
}, |
|||
// 新增 |
|||
openCreate(customerTypeList) { |
|||
this.temp.customerType = customerTypeList.customerType |
|||
this.temp.customerTypeKey = customerTypeList.customerTypeKey |
|||
this.temp.visitWay = customerTypeList.visitWay |
|||
this.temp.visitWayKey = customerTypeList.visitWayKey |
|||
this.temp.userSid = window.sessionStorage.getItem('userSid') |
|||
this.temp.staffSid = '' |
|||
this.temp.orgSid = window.sessionStorage.getItem('orgSid') |
|||
this.$refs['dataForm'].clearValidate() |
|||
if (this.temp.customerType !== '') { |
|||
if (this.temp.customerType === '个人') { |
|||
this.temp.certificateType = '身份证' |
|||
this.temp.certificateTypeKey = '01' |
|||
} else { |
|||
this.temp.certificateType = '营业执照' |
|||
this.temp.certificateTypeKey = '02' |
|||
} |
|||
typeValues({ psid: customerTypeList.psid, type: this.customerClass }).then((res) => { |
|||
if (res.code === '200') { |
|||
this.merClass = res.data |
|||
} |
|||
}) |
|||
} |
|||
this.init() |
|||
this.huoquSheng() // 获取省 |
|||
}, |
|||
// 下拉卡框 数据字典 |
|||
getShuJUZiDian() { |
|||
// |
|||
typeValues({ type: this.customerSource }).then((res) => { |
|||
if (res.code === '200') { |
|||
this.sourceLisst = res.data |
|||
} |
|||
}) |
|||
// |
|||
typeValues({ type: this.customerLevel }).then((res) => { |
|||
if (res.code === '200') { |
|||
this.induslevel = res.data |
|||
} |
|||
}) |
|||
// |
|||
typeValues({ type: 'sex' }).then((res) => { |
|||
if (res.code === '200') { |
|||
this.sex_list = res.data |
|||
} |
|||
}) |
|||
}, |
|||
// -------------------------获取省市县方法------------------------- |
|||
huoquSheng() { |
|||
getProvince().then((res) => { |
|||
if (res.success) { |
|||
this.inputProvinceList = res.data |
|||
} |
|||
}) |
|||
}, |
|||
getShen(value) { |
|||
let bb = '' |
|||
this.inputProvinceList.forEach((e) => { |
|||
if (e.sid === value) { |
|||
bb = { |
|||
name: e.name, |
|||
districtCode: e.districtCode, |
|||
sid: e.sid |
|||
} |
|||
} |
|||
}) |
|||
// 这里是把code的值赋给province省字段 |
|||
this.temp.province = bb.name |
|||
this.huoquShi(bb.sid) |
|||
}, |
|||
huoquShi(sid1) { |
|||
getCity({ sid: sid1 }).then((res) => { |
|||
if (res.success) { |
|||
this.inputCityList = res.data |
|||
} |
|||
}) |
|||
}, |
|||
getShi(value) { |
|||
let bb = '' |
|||
this.inputCityList.forEach((e) => { |
|||
if (e.sid === value) { |
|||
bb = { |
|||
name: e.name, |
|||
districtCode: e.districtCode, |
|||
sid: e.sid |
|||
} |
|||
} |
|||
}) |
|||
this.temp.city = bb.name |
|||
this.huoquXian(bb.sid) |
|||
}, |
|||
huoquXian(sid1) { |
|||
getCounty({ sid: sid1 }).then((res) => { |
|||
if (res.success) { |
|||
this.inputCountyList = res.data |
|||
} |
|||
}) |
|||
}, |
|||
getQu(value) { |
|||
let bb = '' |
|||
this.inputCountyList.forEach((e) => { |
|||
if (e.sid === value) { |
|||
bb = { |
|||
name: e.name, |
|||
districtCode: e.districtCode, |
|||
sid: e.sid |
|||
} |
|||
} |
|||
}) |
|||
this.temp.county = bb.name |
|||
}, |
|||
// ----------------------------------方法-------------------- |
|||
// 组件返回 |
|||
handleReturn(isreload) { |
|||
if (isreload === 'true') this.$emit('reloadlist') |
|||
this.temp = { |
|||
address: '', // 客户地址:详细地址 |
|||
address_city: '', // 行政区划代码(市) |
|||
address_county: '', // 行政区划代码(县) |
|||
address_province: '', // 行政区划代码(省) |
|||
birthday: '', // 客户生日 |
|||
certificateType: '', // 证件类型(个人为身份证/企业为营业执照) |
|||
certificateTypeKey: '', // 证件类型key |
|||
city: '', // 客户地址:市 |
|||
companyName: '', // 公司名称 |
|||
contacts: '', // 联系人 |
|||
county: '', // 客户地址:县 |
|||
createBySid: '', // 用户sid |
|||
crmVisitAppendixDtoList: [], |
|||
customerClass: '', // 客户分类(个人:司机/个体老板/其他。企业:企业型客户/一级经销商/二级经销商/终端物流客户) |
|||
customerClassKey: '', // 客户分类Key |
|||
customerOrgName: '', |
|||
customerOrgSid: '', |
|||
customerType: '', // 客户类型(1个人/2企业) |
|||
customerTypeKey: '', // 客户类型key |
|||
e_mail: '', // 电子邮箱 |
|||
emergencyContact: '', // 紧急联系人 |
|||
emergencyMobile: '', // 紧急联系电话 |
|||
endDate: '', // 证件有效期 |
|||
idnumber: '', // 证件号码 |
|||
isOnRemind: '', // 是否开启提醒(1开启,0不开启) |
|||
isOnRemindkey: '', // 是否开启提醒(1开启,0不开启) |
|||
level: '', // 客户级别(意向客户/准客户/成交客户/集团内销/黑名单客户) |
|||
levelKey: '', // 客户级别key |
|||
mobile: '', // 联系电话 |
|||
name: '', // 名称 |
|||
orgPath: '', |
|||
orgSidPath: '', |
|||
phone: '', // 电话 |
|||
province: '', // 省 |
|||
remarks: '', // 备注 |
|||
remind_day: '', // 提醒日期 |
|||
remind_remark: '', // 提醒备注 |
|||
sex: '', // 性别K |
|||
sexKey: '', // 性别Key |
|||
sid: '', |
|||
source: '', // 客户来源(公司资源/自主开发/交接客户/转介绍客户/集团内销) |
|||
sourceKey: '', // 客户来源key |
|||
staffSid: '', // 业务员sid |
|||
taxpayerNo: '', // 身份证号 |
|||
useOrgName: '', // 分公司名称 |
|||
useOrgSid: '', // 分公司sid |
|||
userSid: '', // 当前登录用户的sid |
|||
visitWay: '', // 见面方式(到店/电话/拜访) |
|||
visitWayKey: '', // 见面方式key |
|||
weixin: '' // 微信号码 |
|||
} |
|||
this.editState = false |
|||
this.activeNames = ['1'] |
|||
this.$emit('doback') |
|||
}, |
|||
// 保存客户运营数据 |
|||
handleSave() { |
|||
if (this.temp.sex !== '') { |
|||
this.sex_list.forEach((e) => { |
|||
if (e.dictValue === this.temp.sex) { |
|||
this.temp.sexKey = e.dictKey |
|||
} |
|||
}) |
|||
} |
|||
if (this.temp.isOnRemind !== '' && this.temp.isOnRemind === '是') { |
|||
this.temp.isOnRemindkey = 1 |
|||
} else { |
|||
this.temp.isOnRemindkey = 0 |
|||
} |
|||
this.$refs['dataForm'].validate((valid) => { |
|||
if (valid) { |
|||
this.FormLoading = true |
|||
if (this.temp.customerType === '企业' && this.temp.name.length < 5) { |
|||
this.$message({ showClose: true, type: 'error', message: '因客户类型为企业,客户名称的长度应不少于5个汉字' }) |
|||
return |
|||
} |
|||
console.log(this.temp, 858585) |
|||
if (this.temp.sid === '') { |
|||
const tip = '客户名称、联系电话一经保存,无法修改,是否继续保存' |
|||
this.$confirm(tip, '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消', |
|||
type: 'warning' |
|||
}).then(() => { |
|||
req.save(this.temp).then((response) => { |
|||
this.FormLoading = false |
|||
if (response.success) { |
|||
this.$notify({ title: '提示', message: '添加成功', type: 'success', duration: 2000 }) |
|||
this.handleReturn('true') |
|||
} else if (response.code === '511' || response.code === '513') { |
|||
this.FormLoading = false |
|||
this.dialogFormVisible = true |
|||
this.updateId = response.data |
|||
} else { |
|||
alert(200) |
|||
} |
|||
}) |
|||
}) |
|||
} else { |
|||
req.update(this.temp).then((response) => { |
|||
this.FormLoading = false |
|||
if (response.success) { |
|||
this.$notify({ title: '提示', message: '修改成功', type: 'success', duration: 2000 }) |
|||
this.handleReturn('true') |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
}) |
|||
}, |
|||
dialogStatus() { |
|||
this.dialogFormVisible = false |
|||
this.openUpdate(this.updateId) |
|||
}, |
|||
dialogFormVisibl() { |
|||
this.$notify({ title: '提示', message: '用户名手机号重复', type: 'error', duration: 2000 }) |
|||
this.dialogFormVisible = false |
|||
}, |
|||
// --------------------------------------------------------------------------------- |
|||
// ---------------------------数据字典的处理------------------------------------------------------ |
|||
// --------------------------------------------------------------------------------- |
|||
// 客户级别 |
|||
getJiBie(value) { |
|||
const choose = this.induslevel.filter((item) => item.dictKey === value) |
|||
if (choose !== null && choose.length > 0) { |
|||
this.temp.level = choose[0].dictValue |
|||
} else { |
|||
this.temp.level = '' |
|||
} |
|||
}, |
|||
// 客户来源 |
|||
getKeHuLaiYUan(value) { |
|||
const choose = this.sourceLisst.filter((item) => item.dictKey === value) |
|||
if (choose !== null && choose.length > 0) { |
|||
this.temp.source = choose[0].dictValue |
|||
} else { |
|||
this.temp.source = '' |
|||
} |
|||
}, |
|||
// 客户分类 |
|||
getFenLei(value) { |
|||
const choose = this.merClass.filter((item) => item.dictKey === value) |
|||
if (choose !== null && choose.length > 0) { |
|||
this.temp.customerClass = choose[0].dictValue |
|||
} else { |
|||
this.temp.customerClass = '' |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style scoped> |
|||
.span-sty { |
|||
width: 130px !important; |
|||
} |
|||
.addinputInfo { |
|||
margin-left: 120px !important; |
|||
} |
|||
/deep/ .el-form-item__error { |
|||
margin-left: 120px !important; |
|||
} |
|||
.formaddcopy02 .el-row .el-col /deep/ .el-form-item .addinputw { |
|||
margin-left: 120px !important; |
|||
width: calc(100% - 115px); |
|||
} |
|||
.formaddcopy02 .el-row .el-col /deep/ .el-form-item .el-radio-group { |
|||
display: inline; |
|||
line-height: 1px; |
|||
vertical-align: middle; |
|||
} |
|||
</style> |
@ -0,0 +1,299 @@ |
|||
<template> |
|||
<div class="app-container"> |
|||
<div> |
|||
<div class="tab-header webtop"> |
|||
<div>{{ viewTitle }}</div> |
|||
<div> |
|||
<el-button type="info" size="small" icon="el-icon-close" @click="handleReturn()">关闭</el-button> |
|||
</div> |
|||
</div> |
|||
<div class="listconadd"> |
|||
<el-form ref="dataForm" :model="temp" class="formaddcopy02" :rules="rules"> |
|||
<div class="title">基础信息</div> |
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">客户名称</div> |
|||
<el-form-item><span class="addinputInfo">{{ temp.name }}</span></el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">客户类型</div> |
|||
<el-form-item><span class="addinputInfo">{{ temp.customerType }}</span></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">联系电话</div> |
|||
<el-form-item><span class="addinputInfo">{{ temp.mobile }}</span></el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">微信号</div> |
|||
<el-form-item><span class="addinputInfo">{{ temp.weixin }}</span></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row v-show="temp.customerType==='个人'"> |
|||
<el-col :span="24"> |
|||
<div class="span-sty">公司名称</div> |
|||
<el-form-item><span class="addinputInfo">{{ temp.companyName }}</span></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<div class="span-sty">客户地址</div> |
|||
<el-form-item><span class="addinputInfo">{{ temp.province }}{{ temp.city }}{{ temp.county }}{{ temp.address }}</span></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">客户级别</div> |
|||
<el-form-item><span class="addinputInfo">{{ temp.level }}</span></el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">是否开启提醒</div> |
|||
<el-form-item><span class="addinputInfo">{{ temp.isOnRemind }}</span></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row v-show="temp.isOnRemind=='是'"> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">提醒日期</div> |
|||
<el-form-item><span class="addinputInfo">{{ temp.remind_day }}</span></el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">提醒备注</div> |
|||
<el-form-item><span class="addinputInfo">{{ temp.remind_remark }}</span></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<!--更多信息--> |
|||
<el-collapse v-model="activeNames"> |
|||
<el-collapse-item title="更多信息" name="1"> |
|||
<el-row v-show="temp.customerType==='个人'" style="border-top: 1px solid #e0e3eb"> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">客户生日</div> |
|||
<el-form-item><span class="addinputInfo">{{ temp.birthday }}</span></el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">性别</div> |
|||
<el-form-item><span class="addinputInfo">{{ temp.sex }}</span></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row style="border-top: 1px solid #e0e3eb"> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">证件类型</div> |
|||
<el-form-item><span class="addinputInfo">{{ temp.certificateType }}</span></el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">证件号码</div> |
|||
<el-form-item><span class="addinputInfo">{{ temp.idnumber }}</span></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">证件有效期</div> |
|||
<el-form-item><span class="addinputInfo">{{ temp.endDate }}</span></el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">电子邮箱</div> |
|||
<el-form-item><span class="addinputInfo">{{ temp.e_mail }}</span></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">紧急联系人</div> |
|||
<el-form-item><span class="addinputInfo">{{ temp.emergencyContact }}</span></el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">紧急联系电话</div> |
|||
<el-form-item><span class="addinputInfo">{{ temp.emergencyMobile }}</span></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">客户来源</div> |
|||
<el-form-item><span class="addinputInfo">{{ temp.source }}</span></el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<div class="span-sty">客户分类</div> |
|||
<el-form-item><span class="addinputInfo">{{ temp.customerClass }}</span></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<div class="span-sty">备注</div> |
|||
<el-form-item><span class="addinputInfo">{{ temp.remarks }}</span></el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-collapse-item> |
|||
<el-collapse-item title="见证材料" name="2"> |
|||
<el-row style="border-top: 1px solid #e0e3eb"> |
|||
<el-col :span="24"> |
|||
<div class="span-sty">附件</div> |
|||
<el-form-item><el-image class="addinputInfo" style="width: 100px;height: 100px" v-for="(item, index) in temp.crmVisitAppendixDtoList" :key="index" :src="item" :preview-src-list="temp.crmVisitAppendixDtoList" /> </el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-collapse-item> |
|||
</el-collapse> |
|||
</el-form> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import req from '@/api/customerManagement/customerInformation' |
|||
|
|||
export default { |
|||
name: 'CustomerInformationInfo', |
|||
data() { |
|||
return { |
|||
viewTitle: '', |
|||
activeNames: ['1'], |
|||
FormLoading: false, |
|||
listLoading: false, |
|||
temp: { |
|||
address: '', // 客户地址:详细地址 |
|||
address_city: '', // 行政区划代码(市) |
|||
address_county: '', // 行政区划代码(县) |
|||
address_province: '', // 行政区划代码(省) |
|||
birthday: '', // 客户生日 |
|||
certificateType: '', // 证件类型(个人为身份证/企业为营业执照) |
|||
certificateTypeKey: '', // 证件类型key |
|||
city: '', // 客户地址:市 |
|||
companyName: '', // 公司名称 |
|||
contacts: '', // 联系人 |
|||
county: '', // 客户地址:县 |
|||
createBySid: '', // 用户sid |
|||
crmVisitAppendixDtoList: [], // 见证材料 |
|||
customerClass: '', // 客户分类(个人:司机/个体老板/其他。企业:企业型客户/一级经销商/二级经销商/终端物流客户) |
|||
customerClassKey: '', // 客户分类Key |
|||
customerOrgName: '', |
|||
customerOrgSid: '', |
|||
customerType: '', // 客户类型(1个人/2企业) |
|||
customerTypeKey: '', // 客户类型key |
|||
e_mail: '', // 电子邮箱 |
|||
emergencyContact: '', // 紧急联系人 |
|||
emergencyMobile: '', // 紧急联系电话 |
|||
endDate: '', // 证件有效期 |
|||
idnumber: '', // 证件号码 |
|||
isOnRemind: '', // 是否开启提醒(1开启,0不开启) |
|||
isOnRemindkey: '', // 是否开启提醒(1开启,0不开启) |
|||
level: '', // 客户级别(意向客户/准客户/成交客户/集团内销/黑名单客户) |
|||
levelKey: '', // 客户级别key |
|||
mobile: '', // 联系电话 |
|||
name: '', // 名称 |
|||
orgPath: '', |
|||
orgSidPath: '', |
|||
phone: '', // 电话 |
|||
province: '', // 省 |
|||
remarks: '', // 备注 |
|||
remind_day: '', // 提醒日期 |
|||
remind_remark: '', // 提醒备注 |
|||
sex: '', // 性别K |
|||
sexKey: '', // 性别Key |
|||
sid: '', |
|||
source: '', // 客户来源(公司资源/自主开发/交接客户/转介绍客户/集团内销) |
|||
sourceKey: '', // 客户来源key |
|||
staffSid: '', // 业务员sid |
|||
taxpayerNo: '', // 身份证号 |
|||
useOrgName: '', // 分公司名称 |
|||
useOrgSid: '', // 分公司sid |
|||
userSid: '', // 当前登录用户的sid |
|||
visitWay: '', // 见面方式(到店/电话/拜访) |
|||
visitWayKey: '', // 见面方式key |
|||
weixin: '' // 微信号码 |
|||
}, |
|||
rules: {} |
|||
} |
|||
}, |
|||
methods: { |
|||
// 修改回显 |
|||
showInfo(sid) { |
|||
this.viewTitle = '客户信息详情' |
|||
this.$nextTick(() => { |
|||
this.$refs['dataForm'].clearValidate() |
|||
}) |
|||
req.fetchBySid(sid).then((response) => { |
|||
if (response.success) { |
|||
this.temp = response.data |
|||
} |
|||
}) |
|||
}, |
|||
// ----------------------------------方法-------------------- |
|||
// 组件返回 |
|||
handleReturn() { |
|||
this.temp = { |
|||
address: '', // 客户地址:详细地址 |
|||
address_city: '', // 行政区划代码(市) |
|||
address_county: '', // 行政区划代码(县) |
|||
address_province: '', // 行政区划代码(省) |
|||
birthday: '', // 客户生日 |
|||
certificateType: '', // 证件类型(个人为身份证/企业为营业执照) |
|||
certificateTypeKey: '', // 证件类型key |
|||
city: '', // 客户地址:市 |
|||
companyName: '', // 公司名称 |
|||
contacts: '', // 联系人 |
|||
county: '', // 客户地址:县 |
|||
createBySid: '', // 用户sid |
|||
crmVisitAppendixDtoList: [], |
|||
customerClass: '', // 客户分类(个人:司机/个体老板/其他。企业:企业型客户/一级经销商/二级经销商/终端物流客户) |
|||
customerClassKey: '', // 客户分类Key |
|||
customerOrgName: '', |
|||
customerOrgSid: '', |
|||
customerType: '', // 客户类型(1个人/2企业) |
|||
customerTypeKey: '', // 客户类型key |
|||
e_mail: '', // 电子邮箱 |
|||
emergencyContact: '', // 紧急联系人 |
|||
emergencyMobile: '', // 紧急联系电话 |
|||
endDate: '', // 证件有效期 |
|||
idnumber: '', // 证件号码 |
|||
isOnRemind: '', // 是否开启提醒(1开启,0不开启) |
|||
isOnRemindkey: '', // 是否开启提醒(1开启,0不开启) |
|||
level: '', // 客户级别(意向客户/准客户/成交客户/集团内销/黑名单客户) |
|||
levelKey: '', // 客户级别key |
|||
mobile: '', // 联系电话 |
|||
name: '', // 名称 |
|||
orgPath: '', |
|||
orgSidPath: '', |
|||
phone: '', // 电话 |
|||
province: '', // 省 |
|||
remarks: '', // 备注 |
|||
remind_day: '', // 提醒日期 |
|||
remind_remark: '', // 提醒备注 |
|||
sex: '', // 性别K |
|||
sexKey: '', // 性别Key |
|||
sid: '', |
|||
source: '', // 客户来源(公司资源/自主开发/交接客户/转介绍客户/集团内销) |
|||
sourceKey: '', // 客户来源key |
|||
staffSid: '', // 业务员sid |
|||
taxpayerNo: '', // 身份证号 |
|||
useOrgName: '', // 分公司名称 |
|||
useOrgSid: '', // 分公司sid |
|||
userSid: '', // 当前登录用户的sid |
|||
visitWay: '', // 见面方式(到店/电话/拜访) |
|||
visitWayKey: '', // 见面方式key |
|||
weixin: '' // 微信号码 |
|||
} |
|||
this.activeNames = ['1'] |
|||
this.$emit('doback') |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style scoped> |
|||
.span-sty { |
|||
width: 130px !important; |
|||
} |
|||
.addinputInfo { |
|||
margin-left: 120px !important; |
|||
} |
|||
/deep/ .el-form-item__error { |
|||
margin-left: 120px !important; |
|||
} |
|||
.formaddcopy02 .el-row .el-col /deep/ .el-form-item .addinputw { |
|||
margin-left: 120px !important; |
|||
width: calc(100% - 115px); |
|||
} |
|||
.formaddcopy02 .el-row .el-col /deep/ .el-form-item .el-radio-group { |
|||
display: inline; |
|||
line-height: 1px; |
|||
vertical-align: middle; |
|||
} |
|||
</style> |
Loading…
Reference in new issue