|
|
|
@ -4,13 +4,18 @@ import { Select, Input, Button, Banner, Radio, Tooltip, Table } from '@douyinfe/ |
|
|
|
import { IconSearch } from '@douyinfe/semi-icons'; |
|
|
|
import '../../style.less' |
|
|
|
import moment from 'moment' |
|
|
|
import FileSaver from 'file-saver'; |
|
|
|
import xlsx from 'xlsx'; |
|
|
|
|
|
|
|
const CustomerContactFollowup = (props) => { |
|
|
|
const { dispatch,actions } = props |
|
|
|
const { dispatch, actions, customerContactsFollowupList } = props |
|
|
|
const [keyType, setKeyType] = useState('customer'); |
|
|
|
const [keyTypeSearch, setKeyTypeSearch] = useState('customer'); |
|
|
|
const [keyword, setKeyword] = useState(''); |
|
|
|
const [keywordSearch, setKeywordSearch] = useState(''); |
|
|
|
useEffect(() => { |
|
|
|
dispatch(actions.businessManagement.getCustomerContactsFollowup()); |
|
|
|
}, []); |
|
|
|
|
|
|
|
const columns = [ |
|
|
|
{ |
|
|
|
title: '序号', |
|
|
|
@ -19,46 +24,84 @@ const CustomerContactFollowup = (props) => { |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: '客户名称', |
|
|
|
dataIndex: 'department', |
|
|
|
dataIndex: 'customer', |
|
|
|
render: (text, record) => text == null ? '---' : text |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: '项目名称', |
|
|
|
dataIndex: 'salesManager', |
|
|
|
dataIndex: 'items', |
|
|
|
render: (text, record) => text == null ? '---' : text |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: '部门', |
|
|
|
dataIndex: 'projectName', |
|
|
|
dataIndex: 'department', |
|
|
|
render: (text, record) => text == null ? '---' : text |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: '跟进人员', |
|
|
|
dataIndex: 'customerName', |
|
|
|
dataIndex: 'sale', |
|
|
|
render: (text, record) => text == null ? '---' : text |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: '跟进日期', |
|
|
|
dataIndex: 'projectType', |
|
|
|
dataIndex: 'updatetime', |
|
|
|
render: (text, record) => text == null ? '---' : moment(text).format('YYYY-MM-DD') |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: '客户联系人', |
|
|
|
dataIndex: 'projectState', |
|
|
|
dataIndex: 'customerContacts', |
|
|
|
render: (text, record) => text == null ? '---' : text |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: '联系方式', |
|
|
|
dataIndex: 'projectDescribe', |
|
|
|
dataIndex: 'phone', |
|
|
|
render: (text, record) => text == null ? '---' : text |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: '拜访方式', |
|
|
|
dataIndex: 'creationTime', |
|
|
|
dataIndex: 'visitStyle', |
|
|
|
render: (text, record) => text == null ? '---' : text |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: '项目进展', |
|
|
|
dataIndex: 'reserveProjectCycle', |
|
|
|
dataIndex: 'itemText', |
|
|
|
render: (text, record) => text == null ? '---' : text |
|
|
|
} |
|
|
|
]; |
|
|
|
const data = []; |
|
|
|
const exportAll = () => { |
|
|
|
|
|
|
|
let data = customerContactsFollowupList; |
|
|
|
if (keywordSearch != '') { |
|
|
|
switch (keyTypeSearch) { |
|
|
|
case 'customer': |
|
|
|
data = customerContactsFollowupList.filter(e => e.customer.match(keywordSearch)) |
|
|
|
break; |
|
|
|
case 'items': |
|
|
|
data = customerContactsFollowupList.filter(e => e.items.match(keywordSearch)) |
|
|
|
break; |
|
|
|
case 'sale': |
|
|
|
data = customerContactsFollowupList.filter(e => e.sale.match(keywordSearch)) |
|
|
|
break; |
|
|
|
default: |
|
|
|
break; |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
const search = () => { |
|
|
|
setKeywordSearch(keyword) |
|
|
|
setKeyTypeSearch(keyType) |
|
|
|
} |
|
|
|
const exportAll = () => { |
|
|
|
// const allList = this.props.projectList.rows; |
|
|
|
if (JSON.stringify(customerContactsFollowupList) != '[]') { |
|
|
|
const strs = "\uFEFF" + ['序号,客户名称,项目名称,部门,跟进人员,跟进日期,客户联系人,联系方式,拜访方式,项目进展'].concat(customerContactsFollowupList.map((d, i) => { |
|
|
|
let update = d.updatetime ? moment(d.updatetime).format('YYYY-MM-DD') : '' |
|
|
|
return [`"${i + 1}"`, `"${d['customer'] ? d['customer'] : ''}"`, `"${d['items'] ? d['items'] : ''}"`, `"${d['department'] ? d['department'] : ''}"`, `"${d['sale'] ? d['sale'] : ''}"`, `"${update}"`, `"${d['customerContacts'] ? d['customerContacts'] : ''}"`, `"${d['phone'] ? d['phone'] : ''}"`, `"${d['visitStyle'] ? d['visitStyle'] : ''}"`, `"${d['itemText'] ? d['itemText'] : ''}"`,].join(',') |
|
|
|
})).join('\r\n'); |
|
|
|
let blob = new Blob([strs], { type: 'text/csv' }); |
|
|
|
FileSaver.saveAs(blob, `客户联系人对接跟进记录${moment().format('YYYY-MM-DD')}.csv`); |
|
|
|
} else if (JSON.stringify(customerContactsFollowupList) == '[]') { |
|
|
|
message.warning('暂无导出的数据') |
|
|
|
} |
|
|
|
} |
|
|
|
return ( |
|
|
|
<> |
|
|
|
<div style={{ padding: '0px 12px' }}> |
|
|
|
@ -80,29 +123,27 @@ const CustomerContactFollowup = (props) => { |
|
|
|
|
|
|
|
<div style={{ display: 'flex', marginTop: 16, marginBottom: 17 }}> |
|
|
|
<div style={{ marginLeft: 12, marginRight: 18 }}> |
|
|
|
<Select defaultValue='customer' style={{ width: 120, marginRight: 10 }} onChange={(value) => { setKeyType(value) }}> |
|
|
|
<Select.Option value='customer'>客户名称</Select.Option> |
|
|
|
<Select.Option value='items'>项目名称</Select.Option> |
|
|
|
<Select.Option value='sale'>跟进人员</Select.Option> |
|
|
|
</Select> |
|
|
|
<Input suffix={<IconSearch />} |
|
|
|
showClear |
|
|
|
placeholder='请输入关键字' |
|
|
|
style={{ width: 346 }} |
|
|
|
// onChange={seachValueChange} |
|
|
|
onChange={(value) => { setKeyword(value) }} |
|
|
|
> |
|
|
|
</Input> |
|
|
|
</div> |
|
|
|
<Button theme='solid' type='primary' style={{ width: 80, borderRadius: 2, height: 32, background: '#DBECFF', color: '#005ABD' }} |
|
|
|
onClick={() => { |
|
|
|
// dispatch(humanAffairs.getMemberList({ keywordTarget, keyword, state: typeChoose })).then((res) => {//搜索项企用户 |
|
|
|
// if (res.success) { |
|
|
|
// setArchivesList(res.payload.data.rows) |
|
|
|
// } |
|
|
|
// }) |
|
|
|
}}>查询</Button> |
|
|
|
<Button theme='solid' type='primary' style={{ width: 80, borderRadius: 2, height: 32, background: '#DBECFF', color: '#005ABD' }} onClick={search}>查询</Button> |
|
|
|
|
|
|
|
<Button theme='solid' type='secondary' style={{ width: 80, borderRadius: 2, marginLeft: 15 }} |
|
|
|
onClick={exportAll}>导出全部</Button> |
|
|
|
</div> |
|
|
|
<div style={{ borderBottom: '1px solid #F2F3F5', marginBottom: 16 }}></div> |
|
|
|
|
|
|
|
<Table columns={columns} dataSource={data} pagination={false} /> |
|
|
|
<Table columns={columns} dataSource={data} pagination /> |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
@ -112,10 +153,12 @@ const CustomerContactFollowup = (props) => { |
|
|
|
|
|
|
|
|
|
|
|
function mapStateToProps(state) { |
|
|
|
const { auth, global } = state; |
|
|
|
const { auth, global, customerContactsFollowupList } = state; |
|
|
|
return { |
|
|
|
user: auth.user, |
|
|
|
actions: global.actions, |
|
|
|
customerContactsFollowupList: customerContactsFollowupList.data || [], |
|
|
|
isRequesting: customerContactsFollowupList.isRequesting |
|
|
|
}; |
|
|
|
} |
|
|
|
|
|
|
|
|
