外呼优化

js/component/manageCenter/customer/NEW/components/outbound/index.jsx

@@ -1,6 +1,7 @@
 import React, { Component } from "react";
 import { Table, Spin, Button, message, Select, Modal, Icon } from "antd";
 import $ from "jquery/src/ajax";
+import moment from 'moment';
 import "./index.less";
 
 class Outbound extends Component {
@@ -11,6 +12,7 @@ class Outbound extends Component {
       pVisible: false,
       rVisible: false,
       tVisible: false,
+      status: false,
       uList: [],
       tList: [],
       transAgent: "",
@@ -23,7 +25,7 @@ class Outbound extends Component {
         showQuickJumper: true,
         pageSize: 10,
         onChange: function (page) {
-          this.loadData(page);
+          this.userCallList(page);
         }.bind(this),
         showTotal: function (total) {
           return '共' + total + '条数据';
@@ -47,9 +49,12 @@ class Outbound extends Component {
           width: 100,
         },
         {
-          title: '时长(秒)',
+          title: '时长',
           dataIndex: 'duration',
           key: 'duration',
+          render: (text) => {
+            return this.isTime(text)
+          }
         },
         {
           title: '时间',
@@ -59,53 +64,76 @@ class Outbound extends Component {
       ],
     };
     this.onOk = this.onOk.bind(this);
-    this.onCancel = this.onCancel.bind(this);
     this.blindTransferByAgent = this.blindTransferByAgent.bind(this);
     this.webSocket = null;
   }
 
   componentDidMount() {
-    this.webSocket = new WebSocket('wss://uat.jishutao.com/webSocketServer');
 
+  }
+
+  componentWillUnmount() {
+
+  }
+
+  isTime(second) {
+    let time = "0秒"
+    if (second > 3600) {
+      time = moment.utc(second * 1000).format('h小时m分s秒')
+    } else if (second > 60) {
+      time = moment.utc(second * 1000).format('m分s秒')
+    } else {
+      time = moment.utc(second * 1000).format('s秒')
+    }
+    return time
+  }
+
+  getWebSocket() {
+    const _this = this
+    if (typeof (WebSocket) == "undefined") {
+      console.log('\x1b[31m您的浏览器不支持WebSocket\x1b[0m')
+    } else {
+      console.log('\x1b[32m您的浏览器支持WebSocket\x1b[0m')
+    }
+    // 测试
+    // this.webSocket = new WebSocket('ws://uat.jishutao.com/webSocketServer');
+    // 生产
+    this.webSocket = new WebSocket('wss://bm.jishutao.com/webSocketServer');
     // 处理WebSocket打开事件
     this.webSocket.onopen = () => {
-      console.log('WebSocket connection opened');
+      console.log('WebSocke已打开');
     };
-
     // 处理收到消息的事件
     this.webSocket.onmessage = (event) => {
       const newMessage = event.data;
-      this.setState((prevState) => ({
-        messages: [...prevState.messages, newMessage],
-      }));
+      console.log('WebSocke已连接', newMessage);
+      _this.setState({
+        status: false
+      })
+      // const newMessage = event.data;
+      // this.setState((prevState) => ({
+      //   messages: [...prevState.messages, newMessage],
+      // }));
+      if (this.webSocket) {
+        console.log("关闭WebSocket连接")
+        this.webSocket.close();
+      }
     };
-
     // 处理WebSocket关闭事件
     this.webSocket.onclose = () => {
-      console.log('WebSocket connection closed');
+      console.log('WebSocket已关闭');
     };
-
     // 处理WebSocket错误事件
     this.webSocket.onerror = (error) => {
-      console.error('WebSocket error:', error);
+      console.error('WebSocket出错了', error);
     };
   }
 
-  componentWillUnmount() {
-    // 在组件卸载前关闭WebSocket连接
-    if (this.webSocket) {
-      this.webSocket.close();
-    }
-  }
-
   onOk() {
-    this.callNumber()
-  }
-
-  onCancel() {
     this.setState({
-      pVisible: false
+      status: true
     })
+    this.callNumber()
   }
   // 公共库-默认联系人
   getDefaultMobile() {
@@ -217,16 +245,20 @@ class Outbound extends Component {
   // 呼叫转移
   blindTransferByAgent() {
     const { transAgent } = this.state
+    const _this = this
     $.ajax({
       method: "post",
       dataType: "json",
       crossDomain: false,
-      url: globalConfig.context + "/api/admblindTransferByAgentin/userOutbound",
+      url: globalConfig.context + "/api/admin/userOutbound/blindTransferByAgent",
       data: {
         transAgent,
       }
     }).done(function (data) {
       if (!data.error.length) {
+        _this.setState({
+          tVisible: false
+        })
         message.success(data.data)
       } else {
         message.warning(data.error[0].message);
@@ -289,23 +321,27 @@ class Outbound extends Component {
   }
 
   render() {
-    const { pVisible, rVisible, tVisible, transAgent, tList, mobile, uList } = this.state
+    const { status, pVisible, rVisible, tVisible, transAgent, tList, mobile, uList } = this.state
     const { type, } = this.props
 
     return (
       <span>
         {type != "history" &&
           <Button
-            style={{ background: !pVisible ? "green" : "red", border: 0 }}
+            style={{ background: !status ? "green" : "red", border: 0 }}
             type="primary"
             loading={pVisible}
             onClick={() => {
+              if (status) {
+                return
+              }
+              this.getWebSocket();
               type == "public"
                 ? this.getDefaultMobile()
                 : this.findCustomerContacts()
             }}
-          >{!pVisible && <Icon type="phone" />} {!pVisible ? '呼叫' : '正在通话中'}</Button>}
-        {type == "private" &&
+          >{!pVisible && <Icon type="phone" />} {!status ? '呼叫' : '正在通话中'}</Button>}
+        {type == "private" && status &&
           <Button
             style={{ background: "green", border: 0, marginLeft: 20 }}
             type="primary"
@@ -329,7 +365,11 @@ class Outbound extends Component {
           maskClosable={false}
           okText="呼叫"
           onOk={this.onOk}
-          onCancel={this.onCancel}
+          onCancel={() => {
+            this.setState({
+              pVisible: false
+            })
+          }}
         >
           <div className="contacts">
             <Select
@@ -394,7 +434,7 @@ class Outbound extends Component {
         >
           <div>
             <div style={{ marginBottom: 5 }}>公司名称：{this.state.info.name}</div>
-            <div style={{ marginBottom: 10 }}>累计通话次数：{this.state.info.callCount}次&nbsp;&nbsp;&nbsp;&nbsp;通话时长：{this.state.info.callDuration}秒</div>
+            <div style={{ marginBottom: 10 }}>累计通话次数：{this.state.info.callCount}次&nbsp;&nbsp;&nbsp;&nbsp;通话时长：{this.isTime(this.state.info.callDuration)}</div>
             <Spin spinning={this.state.loading}>
               <Table
                 size="middle"

js/component/manageCenter/set/userManagementS/newUser.jsx

@@ -162,6 +162,7 @@ const Newuser = Form.create()(React.createClass({
           managerId: this.state.managerId,
           expenseSuperExamine: this.state.expenseSuperExamine, // 报销是否需要上级审核
           publicCarbonCopy: this.state.publicCarbonCopy,// 公出抄送
+          callNo: this.state.callNo, // 外呼编号
         }),
         publicReviewerIds: getNewArray(this.state.Business, "reviewerId").toString(),// 公出审核
         assistReviewerIds: getNewArray(this.state.Coorder, "reviewerId").toString(),// 协单审核
@@ -286,6 +287,7 @@ const Newuser = Form.create()(React.createClass({
             expenseSuperExamine: thisdata.expenseSuperExamine, // 报销是否需要上级主管审核
             publicCarbonCopy: thisdata.publicCarbonCopy, // 公出抄送
             publicCarbonCopyName: thisdata.publicCarbonCopyName,
+            callNo:thisdata.callNo, // 外呼编号
           });
         }.bind(this),
       }).always(function () {
@@ -785,40 +787,29 @@ const Newuser = Form.create()(React.createClass({
                   </FormItem>
                 </div>
 
-                {/* <FormItem className="half-item"
-                  {...formItemLayout}
-                  label="协单审核"
-                >
-                  <StaffSearch
-                    valueName={this.state.publicCarbonCopyName}
-                    placeholder="输入名称"
-                    onBlurText={e => {
-                      this.setState({
-                        publicCarbonCopyName: e.title
-                      })
-                    }}
-                    onBlurChange={(obj) => {
-                      this.setState({
-                        publicCarbonCopy: obj.value,
-                      })
-                    }}
-                  />
-                </FormItem> */}
-
-                <FormItem className="half-item"
-                  {...formItemLayout}
-                  label="业务员"
-                >
-                  <Select
-                    placeholder="请选择"
-                    value={this.state.publicPurview}
-                    style={{ width: '200px' }}
-                    onChange={(e) => { this.setState({ publicPurview: e }) }}
+                <div className='clearfix'>
+                  <FormItem className="half-item"
+                    {...formItemLayout}
+                    label="业务员"
                   >
-                    <Select.Option value={0} >否</Select.Option>
-                    <Select.Option value={1} >是</Select.Option>
-                  </Select>
-                </FormItem>
+                    <Select
+                      placeholder="请选择"
+                      value={this.state.publicPurview}
+                      style={{ width: '200px' }}
+                      onChange={(e) => { this.setState({ publicPurview: e }) }}
+                    >
+                      <Select.Option value={0} >否</Select.Option>
+                      <Select.Option value={1} >是</Select.Option>
+                    </Select>
+                  </FormItem>
+
+                  <FormItem className="half-item"
+                    {...formItemLayout}
+                    label="外呼编号" >
+                    <Input placeholder="请输入外呼编号" style={{ width: '200px' }} value={this.state.callNo}
+                      onChange={(e) => { this.setState({ callNo: e.target.value }) }} />
+                  </FormItem>
+                </div>
 
                 <div className='clearfix'>
                   <FormItem className="half-item"

package.json

@@ -1,6 +1,6 @@
 {
   "name": "afanti",
-  "version": "1.3.28",
+  "version": "1.3.29",
   "description": "",
   "main": "index.js",
   "scripts": {