ww664853070
2 years ago
4 changed files with 152 additions and 2 deletions
@ -0,0 +1,128 @@ |
|||
import React, { useEffect, useState } from 'react'; |
|||
import { connect } from 'react-redux'; |
|||
import { Select, Input, Button, Banner, Radio, Tooltip, Table } from '@douyinfe/semi-ui'; |
|||
import { IconSearch } from '@douyinfe/semi-icons'; |
|||
import '../../style.less' |
|||
import moment from 'moment' |
|||
|
|||
const CustomerContactFollowup = (props) => { |
|||
const [downloadUrl, setDownloadUrl] = useState(null); |
|||
const [warningBanner, setWarningBanner] = useState(null); |
|||
|
|||
const columns = [ |
|||
{ |
|||
title: '序号', |
|||
dataIndex: 'index', |
|||
render: (text, record, index) => index + 1 |
|||
}, |
|||
{ |
|||
title: '客户名称', |
|||
dataIndex: 'department', |
|||
}, |
|||
{ |
|||
title: '项目名称', |
|||
dataIndex: 'salesManager', |
|||
}, |
|||
{ |
|||
title: '部门', |
|||
dataIndex: 'projectName', |
|||
}, |
|||
{ |
|||
title: '跟进人员', |
|||
dataIndex: 'customerName', |
|||
}, |
|||
{ |
|||
title: '跟进日期', |
|||
dataIndex: 'projectType', |
|||
}, |
|||
{ |
|||
title: '客户联系人', |
|||
dataIndex: 'projectState', |
|||
}, |
|||
{ |
|||
title: '联系方式', |
|||
dataIndex: 'projectDescribe', |
|||
}, |
|||
{ |
|||
title: '拜访方式', |
|||
dataIndex: 'creationTime', |
|||
}, |
|||
{ |
|||
title: '项目进展', |
|||
dataIndex: 'reserveProjectCycle', |
|||
} |
|||
]; |
|||
const data = []; |
|||
const exportAll = () => { |
|||
|
|||
} |
|||
|
|||
return ( |
|||
<> |
|||
<div style={{ padding: '0px 12px' }}> |
|||
<div style={{ display: 'flex' }}> |
|||
<div style={{ color: 'rgba(0,0,0,0.45)', fontSize: 14 }}>业务管理</div> |
|||
<div style={{ color: 'rgba(0,0,0,0.45)', fontSize: 14, margin: '0px 8px' }}>/</div> |
|||
<div style={{ color: 'rgba(0,0,0,0.45)', fontSize: 14 }}>客户报表</div> |
|||
<div style={{ color: '#033C9A', fontSize: 14, margin: '0px 8px' }}>/</div> |
|||
<div style={{ color: '#033C9A', fontSize: 14 }}>客户联系人对接跟进</div> |
|||
</div> |
|||
<div style={{ background: '#FFFFFF', boxShadow: '0px 0px 12px 2px rgba(220,222,224,0.2)', borderRadius: 2, padding: '20px ', marginTop: 9 }}> |
|||
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}> |
|||
<div style={{ display: 'flex', alignItems: 'baseline' }}> |
|||
<div style={{ width: 0, height: 20, borderLeft: '3px solid #0F7EFB', borderTop: '3px solid transparent', borderBottom: '3px solid transparent' }}></div> |
|||
<div style={{ fontFamily: "YouSheBiaoTiHei", fontSize: 24, color: '#033C9A', marginLeft: 8 }}>客户联系人对接跟进</div> |
|||
<div style={{ marginLeft: 6, fontSize: 12, color: '#969799', fontFamily: "DINExp", }}>CUSTOMER CONTACT FOLLOW UP</div> |
|||
</div> |
|||
</div> |
|||
{ |
|||
warningBanner && |
|||
(<Banner |
|||
type="danger" |
|||
description={warningBanner} |
|||
onClose={() => setWarningBanner(null)} |
|||
/>)} |
|||
<div style={{ display: 'flex', marginTop: 16, marginBottom: 17 }}> |
|||
<div style={{ marginLeft: 12, marginRight: 18 }}> |
|||
<Input suffix={<IconSearch />} |
|||
showClear |
|||
placeholder='请输入关键字' |
|||
style={{ width: 346 }} |
|||
// onChange={seachValueChange} |
|||
> |
|||
</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='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} /> |
|||
</div> |
|||
{ |
|||
downloadUrl ? <iframe key={downloadUrl} src={downloadUrl} style={{ display: 'none' }} /> : '' |
|||
} |
|||
</div> |
|||
</> |
|||
) |
|||
} |
|||
|
|||
|
|||
function mapStateToProps(state) { |
|||
const { auth, global } = state; |
|||
return { |
|||
user: auth.user, |
|||
actions: global.actions, |
|||
}; |
|||
} |
|||
|
|||
export default connect(mapStateToProps)(CustomerContactFollowup); |
Loading…
Reference in new issue