317 lines
18 KiB
JavaScript
317 lines
18 KiB
JavaScript
import React, { PureComponent } from 'react';
|
||
import { history } from 'umi';
|
||
import { Row, Col, Tooltip, Card, List, DatePicker, Button, Statistic, Spin, Empty, message } from 'antd';
|
||
import { connect } from 'dva';
|
||
import './index.less';
|
||
import talkPng from '@/images/talk/talk.png';
|
||
import { routerRedux } from 'dva/router';
|
||
import { RightOutlined } from '@ant-design/icons';
|
||
import moment from 'moment';
|
||
import { getSessionUserData, getRA } from '@/utils/session';
|
||
import { getDefId } from './service';
|
||
import { getURLInformation } from '@/utils/CommonUtils';
|
||
import MessageDetail from '@/pages/SystemMessage/message/components/messageDetail'
|
||
import NoticeDetail from '@/pages/notice/noticeList/components/NoticeDetail'
|
||
import NoticeModal from '@/pages/Auction/NoticeModal/noticeModal'
|
||
import StopReason from '@/pages/Auction/NoticeModal/stopReason'
|
||
import QuestDetail from '@/pages/SystemMessage/message/components/questDetail'
|
||
import { getQuestList } from '@/pages/SystemMessage/message/service'
|
||
import ChatUI from '@/pages/customerservice/support/conversation' //智慧客服
|
||
|
||
@connect(({ dashboard, loading }) => ({
|
||
...dashboard,
|
||
fetchtShotList: loading.effects['dashboard/fetchtShotList'],
|
||
projectlistLoading: loading.effects['dashboard/fetchprojectRecords'],
|
||
}))
|
||
class manager extends PureComponent {
|
||
state = {
|
||
datevalue: moment(moment().format('YYYYMM'), 'YYYY-MM'),
|
||
datestring: moment().format('YYYYMM'),
|
||
messId: '0', // 消息id
|
||
messageDetail: false, // 消息弹窗
|
||
detailId: '1', // 公告id
|
||
noticeDetail: false, // 公告弹窗
|
||
projectId: '0', // 竞拍公告弹窗id
|
||
noticeModalVis: false, // 竞拍公告弹窗
|
||
tpid: '0', // 中止原因id
|
||
isModalVisible: false, // 中止原因弹窗
|
||
questData: {},//问卷数据
|
||
questVisible: false, //问卷弹窗
|
||
isChatModalVisible: false, //智慧客服
|
||
isFlash: false, //智慧客服
|
||
isCloseWs: true, //智慧客服
|
||
optionsModal: false, //智慧客服
|
||
projectModal: false, //智慧客服
|
||
supplierNumber: '', //智慧客服
|
||
staffId: '', //智慧客服'
|
||
staffName:'', //智慧客服
|
||
kfType:0,//智慧客服
|
||
questionType:0,//智慧客服
|
||
roleIds:'',//智慧客服
|
||
}
|
||
componentDidMount() {
|
||
this.props.dispatch({
|
||
type: "dashboard/fetchParticipants",
|
||
payload: { selectDate: moment().format('YYYY-MM') }
|
||
})
|
||
this.props.dispatch({
|
||
type: "dashboard/fetchtlist",
|
||
payload: { limit: 7 }
|
||
})
|
||
this.props.dispatch({
|
||
type: "dashboard/fetchtShotList",
|
||
payload: { pageNo: 1, pageSize: 4, limit: 4 }
|
||
}),
|
||
this.props.dispatch({
|
||
type: "dashboard/fetchtlistre",
|
||
payload: { pageNo: 1, pageSize: 7 }
|
||
})
|
||
NTKF_PARAM = {
|
||
siteid: "bl_1000", //企业ID，,为固定值
|
||
settingid: "bl_1000_1492484340268", //接待组ID，为固定值，必填
|
||
uid: getSessionUserData()?.userId,
|
||
uname: getSessionUserData()?.deptName + "-" + getSessionUserData()?.fullName, //用户名，未登录可以为空，但是不能给null，uname赋予的值显示到小能客户端
|
||
isvip: "0", //是否为vip用户，0代表非会员，1代表会员，取值显示到小能客户端
|
||
userlevel: "1", //网站自定义会员级别，1-N，可根据选择判断，取值显示到小能客户端
|
||
erpparam: "abc" //erpparam为erp功能的扩展字段，可选，购买erp功能后用于erp功能集成
|
||
}
|
||
//智慧客服，获取供应商编码
|
||
let userData = getSessionUserData()
|
||
let roleAuthority = getRA()
|
||
this.setState({roleIds: roleAuthority && roleAuthority.length>0? roleAuthority[0]: userData.roleIds})
|
||
this.setState({staffId: userData.userId})
|
||
this.setState({staffName: userData.fullName})
|
||
this.setState({supplierNumber: userData.organizationId})
|
||
//<<<<<<智慧客服end
|
||
}
|
||
onChange = (date, dateString) => {
|
||
this.setState({
|
||
datevalue: moment(dateString, 'YYYY-MM'),
|
||
datestring: dateString
|
||
})
|
||
}
|
||
onSearch = () => {
|
||
const { datestring } = this.state;
|
||
this.props.dispatch({
|
||
type: "dashboard/save",
|
||
payload: { staloading: true }
|
||
})
|
||
this.props.dispatch({
|
||
type: "dashboard/fetchParticipants",
|
||
payload: { selectDate: datestring }
|
||
})
|
||
}
|
||
lookDetail = (id) => { // 消息查看详情
|
||
this.setState({
|
||
messId: id,
|
||
messageDetail: true
|
||
})
|
||
}
|
||
closeModel = () => { // 关闭消息弹窗
|
||
this.setState({
|
||
messageDetail: false
|
||
})
|
||
}
|
||
lookInfo = (id) => { // 公告查看
|
||
this.setState({
|
||
detailId: id,
|
||
noticeDetail: true
|
||
})
|
||
}
|
||
noticeModel = () => { // 公告关闭消息弹窗
|
||
this.setState({
|
||
noticeDetail: false,
|
||
noticeModalVis: false,
|
||
isModalVisible: false
|
||
})
|
||
}
|
||
toParticipate = async (servicecode) => {//问卷调查弹窗
|
||
const { questId } = JSON.parse(servicecode);
|
||
await getQuestList({ id: questId }).then(res => {
|
||
if (res?.code == 200 && res?.success) {
|
||
this.setState({
|
||
questData: res?.data,
|
||
questVisible: true,
|
||
})
|
||
}
|
||
})
|
||
}
|
||
closeParticipate = () => { // 关闭问卷调查弹窗
|
||
this.setState({
|
||
questVisible: false
|
||
})
|
||
}
|
||
lookNotice = (id) => { // 查看竞拍公告
|
||
this.setState({
|
||
projectId: id,
|
||
noticeModalVis: true
|
||
})
|
||
}
|
||
getAbortReasonrView = (id) => {
|
||
this.setState({
|
||
tpid: id,
|
||
isModalVisible: true
|
||
})
|
||
}
|
||
enterTheBidding = (id) => { // 竞拍出价 || 查看结果
|
||
let projectData = {
|
||
id: id
|
||
};
|
||
sessionStorage.setItem('projectData', JSON.stringify(projectData));
|
||
window.open("/AuctionViewAuctions/Index");
|
||
}
|
||
initChatUI = () => {
|
||
//智慧客服
|
||
if(this.state.isCloseWs && window.isCloseChatUIModal==undefined){ //弹窗主动关闭或者页面刷新
|
||
this.setState({optionsModal: true})
|
||
}else{
|
||
this.setState({isChatModalVisible: true})
|
||
this.setState({isCloseWs: false})
|
||
this.setState({isFlash :false})
|
||
}
|
||
}
|
||
render() {
|
||
const { projectlist, staloading, tlist, trelist, shotList, Participants } = this.props;
|
||
const { datevalue, messId, messageDetail, detailId, noticeDetail, noticeModalVis, projectId, isModalVisible, tpid, questData, questVisible, isChatModalVisible, isCloseWs, optionsModal, projectModal, supplierNumber, staffId, staffName, kfType, questionType, isFlash, roleIds} = this.state; //智慧客服state
|
||
return (
|
||
<>
|
||
<a className={isFlash && !isChatModalVisible ? "talk text-effect":"talk"} onClick={() => this.initChatUI()}>咨询服务︵<span>8:30</span><span>|</span><span>12:30</span><span>13:00</span><span>|</span><span>17:00</span>︶<img src={talkPng} /></a>
|
||
<div className="dashboard" style={{ height: innerHeight - 70, overflow: "hidden" }}>
|
||
<Row className="topt">
|
||
<Col span={8}><Card title="我的消息" bordered={false} className="cardtre" style={{ marginRight: "10px" }} extra={<div className="moret" onClick={() => history.push('/SystemMessage/message')}>更多<RightOutlined /></div>}>
|
||
{trelist != [] && trelist.map((item, index) => {
|
||
return (
|
||
<div onClick={() => { item.templatetype == '3' ? this.toParticipate(item.servicecode) : this.lookDetail(item.msgId) }} className="messagetre" key={item.id}>
|
||
<div className="round">{index + 1}</div>
|
||
<div className="txt" title={item.title}>{item.title}</div>
|
||
<div className="time">{item.createtime}</div>
|
||
</div>
|
||
)
|
||
})}
|
||
</Card></Col>
|
||
<Col span={8}><Card title="我参与的项目" bordered={false} className="cardtremanager" style={{ marginRight: "10px" }} loading={staloading} extra={<div style={{ marginTop: "-14px" }}>
|
||
<DatePicker showNow={false} picker="month" style={{ marginRight: "10px" }} value={datevalue} onChange={this.onChange} allowClear={false} /><Button type="primary" onClick={() => { this.onSearch() }}>确定</Button></div>}>
|
||
<div className="boxrezt" key='0' style={{ height: "130px" }}>
|
||
<div className="boxtitle" title='竞拍'>
|
||
竞拍<div className="yue">月</div></div>
|
||
<div className="boxcount" onClick={() => history.push('/Auction/AuctionMyLookingForInnerShot')}><Statistic value={Participants} /></div>
|
||
<div className="boxdescription" title='竞拍的数量'>竞拍的数量</div>
|
||
</div>
|
||
</Card>
|
||
</Col>
|
||
<Col span={8}><Card title="系统公告" bordered={false} className="cardtre" extra={<div className="moret" onClick={() => history.push('/notice/noticeList')}>更多<RightOutlined /></div>}>
|
||
{tlist != [] && tlist.map((item, index) => {
|
||
return (
|
||
<div className="messagetre" onClick={() => { this.lookInfo(item.id) }} key={item.id}>
|
||
<div className="round">{index + 1}</div>
|
||
<div className="txt" title={item.noticeTitle}>{item.noticeTitle}</div>
|
||
<div className="time">{item.updateDate}</div>
|
||
</div>
|
||
)
|
||
})}</Card>
|
||
</Col>
|
||
</Row>
|
||
<Row className="downt" type="flex" justify="space-around">
|
||
<Col span={24}>
|
||
<Card title="我的内拍项目" className="cardtre" extra={<div className="moret" onClick={() => history.push('/Auction/AuctionMyLookingForInnerShot')}>更多<RightOutlined /></div>}>
|
||
<List
|
||
size="large"
|
||
bordered={false}
|
||
dataSource={shotList != [] && shotList}
|
||
renderItem={item => <List.Item className="pointer" key={item.id} style={{ height: "25%" }}>
|
||
<div className="downtitle" title={item.projectName}>{item.projectName}
|
||
<div className="downtime">竞拍开始时间：{item.auctionStartTime}</div>
|
||
</div>
|
||
<div className="downb">
|
||
{
|
||
item.bidOpeningStatus == 0 ?
|
||
<>
|
||
<Button type="primary" style={{ float: "right", marginLeft: "20px" }} onClick={() => { message.warn('竞拍未开始，无法进入竞拍！') }}>竞拍出价</Button>
|
||
<Button type="primary" style={{ float: "right" }} onClick={() => { this.lookNotice(item.id) }}>查看公告</Button>
|
||
</> :
|
||
item.bidOpeningStatus == 1 ?
|
||
<>
|
||
<Button type="primary" style={{ float: "right", marginLeft: "20px" }} onClick={() => { this.enterTheBidding(item.id) }}>竞拍出价</Button>
|
||
<Button type="primary" style={{ float: "right" }} onClick={() => { this.lookNotice(item.id) }}>查看公告</Button>
|
||
</> :
|
||
item.bidOpeningStatus == 2 ?
|
||
<>
|
||
<Button type="primary" style={{ float: "right", marginLeft: "20px" }} onClick={() => { this.enterTheBidding(item.id) }}>查看结果</Button>
|
||
<Button type="primary" style={{ float: "right" }} onClick={() => { this.lookNotice(item.id) }}>查看公告</Button>
|
||
|
||
</> :
|
||
item.bidOpeningStatus == 6 ?
|
||
<>
|
||
<Button type="primary" style={{ float: "right", marginLeft: "20px" }} onClick={() => { this.enterTheBidding(item.id) }}>查看结果</Button>
|
||
<Button type="primary" style={{ float: "right" }} onClick={() => { this.lookNotice(item.id) }}>查看公告</Button>
|
||
</> :
|
||
item.bidOpeningStatus == 7 ?
|
||
<>
|
||
<Button type="primary" style={{ float: "right", marginLeft: "20px" }} onClick={() => { this.getAbortReasonrView(item.id) }}>中止原因</Button>
|
||
<Button type="primary" style={{ float: "right" }} onClick={() => { this.lookNotice(item.id) }}>查看公告</Button>
|
||
</> :
|
||
null
|
||
}
|
||
</div>
|
||
</List.Item>}
|
||
/>
|
||
</Card>
|
||
</Col>
|
||
</Row>
|
||
</div>
|
||
{messageDetail ? <MessageDetail messId={messId} onCancel={() => { this.closeModel(), this.props.dispatch({type: "dashboard/fetchtlistre", payload: { pageNo: 1, pageSize: 7 }}) }} modalVisible={messageDetail} /> : null }
|
||
{questVisible ? <QuestDetail questData={questData} onCancel={() => { this.closeParticipate(), this.props.dispatch({type: "dashboard/fetchtlistre", payload: { pageNo: 1, pageSize: 7 }}) }} modalVisible={questVisible} /> : null}
|
||
{noticeDetail && <NoticeDetail detailId={detailId} onCancel={() => { this.noticeModel() }} modalVisible={noticeDetail} />}
|
||
<NoticeModal projectId={projectId} state={'3'} vis={noticeModalVis} close={() => { this.noticeModel() }} />
|
||
<StopReason tpid={tpid} modalVisible={isModalVisible} onCancel={() => { this.noticeModel() }} />
|
||
{/*智慧客服*/}
|
||
<ChatUI
|
||
openProjectWin={()=>{
|
||
this.setState({kfType: 2})
|
||
this.setState({projectModal: true})
|
||
}}
|
||
openWin={(kfType, questionType)=>{
|
||
this.setState({questionType: questionType})
|
||
this.setState({kfType: kfType})
|
||
this.setState({optionsModal: false})
|
||
this.setState({isChatModalVisible: true})
|
||
this.setState({isCloseWs: false})
|
||
this.setState({isFlash :false})
|
||
}}
|
||
closeWin={()=>{
|
||
this.setState({kfType: 0})
|
||
this.setState({questionType: 0})
|
||
this.setState({optionsModal: false})
|
||
this.setState({isChatModalVisible: false})
|
||
this.setState({isCloseWs: true})
|
||
this.setState({projectModal: false})
|
||
}}
|
||
optionsModal={optionsModal}
|
||
projectModal={projectModal}
|
||
isModalVisible={isChatModalVisible}
|
||
kfType={kfType}
|
||
questionType={questionType}
|
||
staffId={staffId}
|
||
staffName={staffName}
|
||
supplierNumber={supplierNumber}
|
||
isCloseWs={isCloseWs}
|
||
roleIds={roleIds}
|
||
hideWin={()=>{
|
||
this.setState({optionsModal: false})
|
||
this.setState({isChatModalVisible: false})
|
||
}}
|
||
closeOptionsModal={()=>{
|
||
this.setState({optionsModal: false})
|
||
}}
|
||
closeProjectModal={()=>{
|
||
this.setState({projectModal: false})
|
||
}}
|
||
msgAlert={()=>{
|
||
if(!isChatModalVisible) this.setState({isFlash: true})
|
||
}}
|
||
/>
|
||
</>
|
||
)
|
||
}
|
||
}
|
||
export default manager; |