首页客服弹窗修改样式、发票管理咨询代理商

src/pages/MainPage/ProjectManager/purchaseManager.js

@@ -1,6 +1,6 @@
 import React, { PureComponent } from 'react';
 import { history } from 'umi';
-import { Row, Col, Tooltip, Card, List, DatePicker, Button, Statistic, Spin, Empty, message,Popconfirm } from 'antd';
+import { Row, Col, Tooltip, Card, List, DatePicker, Button, Statistic, Spin, Empty, message,Popconfirm, Space } from 'antd';
 // import PageHeaderWrapper from '@/components/PageHeaderWrapper';
 import { connect } from 'dva';
 import './index.less';
@@ -17,6 +17,7 @@ import QuestDetail from '@/pages/SystemMessage/message/components/questDetail'
 import { getQuestList } from '@/pages/SystemMessage/message/service'
 import ApprovalDetail from '@/pages/SystemMessage/message/components/approvalDetail'
 import {submitHiddenForm, createHiddenForm} from '@/utils/CustomerService' //智慧客服
+import kefu from '@/assets/img/kefu.png'  //智慧客服
 @connect(({ dashboard, loading }) => ({
     ...dashboard,
     downlistLoading: loading.effects['dashboard/fetchDowntlist'],
@@ -34,6 +35,7 @@ class manager extends PureComponent {
         questVisible: false, //问卷弹窗
         mainDetail: false, // 审批单消息弹窗
         isModalVisible: false, //智慧客服
+        kefuTip: false, // 客服弹窗
     }
     componentDidMount() {
         this.props.dispatch({
@@ -188,7 +190,7 @@ class manager extends PureComponent {
         const { datevalue, messId, messageDetail, detailId, noticeDetail, questData, questVisible, mainDetail, } = this.state; //智慧客服state
         return (
             <>
-              <Popconfirm
+              {/* <Popconfirm
                     title={()=>{
                         return <><p>您好，系统操作咨询仅可以解决您在平台的操作问题，如想了解发票、保证金及项目相关问题请点击具体项目的咨询窗口进行咨询。</p>
                         <p>是否还要继续咨询系统操作问题？</p></>
@@ -198,8 +200,12 @@ class manager extends PureComponent {
                     cancelText="否"
                   >
                     <a className="talk">系统操作咨询︵<span>8:30</span><span>|</span><span>12:30</span><span>13:00</span><span>|</span><span>17:00</span>︶<img src={talkPng} /></a>
-                  </Popconfirm>
-                {/* <a className="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> */}
+                  </Popconfirm> */}
+                <a className="talk" onClick={() => {
+                     this.setState({
+                        kefuTip: true
+                    })
+                }}>系统操作咨询︵<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>}>
@@ -321,6 +327,41 @@ class manager extends PureComponent {
                 {
                     idList.length > 0 ? <ApprovalDetail approvalId={idList[0]} dateNum={dateNum} trelist={idList} onCancel={() => { this.closeModel(), this.props.dispatch({ type: "dashboard/fetchtClarify", payload: { authorizestate: '0', templatetype: '4', size: 6 } }) }} modalVisible={mainDetail} /> : null
                 }
+                {
+                this.state.kefuTip ? <div style={{ border:'1px solid grey', borderRadius: '10px', backgroundColor:'white',position:'absolute', width:'600px', left:'50%', top:'50%',transform:'translate(-50%,-50%)'}}>
+                    <div style={{padding:'10px',borderRadius: '6px 6px 0px 0px',backgroundColor:'rgb(179,0,0)', color:'white'}}>
+                        温馨提示
+                    </div>
+                    <div style={{padding:'10px'}}>
+                        <p>您好，系统操作咨询仅可以解决您在<span style={{color:'rgb(179,0,0)', fontWeight:'bolder'}}>平台操作使用问题。</span></p>
+                        <p>如您需要咨询发票、保证金及项目相关问题请点击项目右侧<img style={{width:20,height:20,}} src={kefu} alt="" />进行咨询。</p>
+                        <p>请问您是否咨询系统操作问题？</p>
+                    </div>
+                    <div style={{
+                        //width:'200px',
+                        position:'relative',
+                        left:'50%', 
+                        transform:'translateX(-50%)',
+                        display: 'inline-block',
+                        margin: '8px 4px',
+                        padding: '4px'
+                        }}>
+                        
+                            <Space
+                                align='center'
+                                >
+                                <Button type='primary' onClick={() => {this.initChatUI();this.setState({
+                                    kefuTip: false
+                                    })}}>是</Button>
+                                <Button  onClick={() => this.setState({
+                                    kefuTip: false
+                                    })}>否
+                                </Button>
+                            </Space>
+                        
+                    </div>
+                </div>:null
+            }
             </>
         )
     }