呼叫能力 (UI电话条)

注意事项：

• 建议优先使用 Chrome 浏览器，此版本只针对 PC 浏览器做了全面测试，在移动端 H5 页面中使用可能会有未知的兼容问题，不建议在移动端 H5 页面中对接使用。
• 由于软电话需要依赖浏览器提供的 WebRTC 能力，因此使用软电话时，建议使用对 WebRTC 支持较好的浏览器，例如：Chrome 或者 Firefox 浏览器。
• 集成 SDK 需要使用 HTTPS 协议。
• Chrome 浏览器需开启麦克风、声音权限，Firefox 浏览器需开启麦克风、扬声器权限。
• 在 iFrame 中使用需要给 iframe 添加 allow 属性，iframe.allow = "midi;encrypted-media;microphone *;camera *;"这样才能在 iframe 中使用 WebRTC 的相关能力。

ui-sdk插件引用地址

注意：使用SDK，请按照下面的方式添加sysnum参数，sysnum对应的是Sobot的企业ID（可在Sobot管理后台=》管理中心=》账户管理=》企业账户=》企业信息中查看），切勿将SDK代码下载到本地，放到自己服务器上使用，避免后续获取不到SDK的更新，造成SDK不可用。

<script type="text/javascript" src="https://www.soboten.com/call-bar/6.3.2/tel-bar-sdk.js?sysnum=您的企业ID"></script>

初始化

● 电话条初始化

//如果只引入了UI电话条SDK，SDK内部会先加载JS-SDK，加载完成后，才会挂载 window.sobotAgent对象，使用window.sobotAgent.initTelBar的时候，请先判断方法是否存在；
//如果在引入UI电话条SDK之前，引入了JS-SDK，window.sobotAgent的挂载是同步的，可以在后续代码中直接使用
 window.sobotCallBar.onReady(function () {
      window.sobotAgent.initTelBar(
        {
            id: 'root',
            token: "xxxxxxxxx",
            companyId: "xxxxxxxxx",
            agent: "1000", //座席ID
            agentType: "0",
            themeColor:{
                showLeftLine: true,
                showRightLine: true,
                light: "#ffffff",
                dark: "#515A7C",
                darkContent: "#434A66",
            },
            appConfig:{
                placement: 'right' //辅助功能位置
                showQueueInfo: true, //技能组排队信息
                showNetDelayInfo: true, // 网络延迟信息
            },
            actionConfig:{
                transfer: true, //转移
                consult: true, //咨询
                keepContinue: true, //保持（包含取消保持）
                stillVoice: true, //静音（包含取消静音)
                sendSatisfaction: true, //发送满意度
                extendBtn: true, //是否显示延长按钮
                internal: true, // 是否显示内部通话按钮
                extendFinishTime: 60, //延长整理时长，默认60
            },
            settingConfig:{
                readOnlyExt: false,
                showUnbind: true,
            }
        },
        function (msg) {
            // 会将电话条收到的事件通过该函数推送出来
            // 如果您对接了UI-SDK并且需要进行自己的来电弹屏信息展示，可以在此处监听通话事件进行处理， 如下：
            switch(msg.messageID) {
                case 'EventRinging' :
                    // 座席来电振铃
                    // do something ...
                    break
                case 'EventDialing' :
                    // 外呼振铃
                    // do something ...
                    break
                case 'EventTokenInvalid' :
                    // 坐席Token失效
                    // 调用您代码中获取Token的方法，重新获取Token，获取成功后调用handleRefreshToken更新SDK的Token
                    // window.sobotAgent.handleRefreshToken(newToken)
                    // 注意：
                    // 1. Token过期后，如果不调用刷新Token的方法，仍然可以接打电话，但是http接口无法调用
                    // 2. EventTokenInvalid事件触发以后，会等待10s获取新Token，在这期间发出的http请求会进行缓存，
                     // 在写入新Token之后会将缓存的请求重新发出
                    // 3. 如果不需要使用handleRefreshToken自动更新Token，建议在EventTokenInvalid添加提示逻辑，
                    // 提示坐席当前Token已过期，刷新页面或者进行其他能够重新获取Token的操作
                    break
                default: 
                    //  do something ...
            }
        }
    )
 })
   

请求参数params说明

属性	名称	类型	可空	说明
token	登录鉴权	string	否	座席登录鉴权（对接token方式请参照智齿接口认证文档）需对接座席级授权接口(座席级token)
companyId	公司编码	string	否	公司编码
agent	座席	string	否	座席工号 或 座席id。
agentType	接口座席参数类别	string	否	0：座席工号；1：座席id；为空时默认为座席工号。
id	电话条位置	string	否	电话条在页面中的位置。例如：'root'，则电话条会展示在id为root的元素内。
themeColor	电话条样式配置	object	是	自定义电话条的样式（例如背景颜色、分割线等）。 为空时，使用系统推荐的默认配置。见下表1
appConfig	辅助功能配置	object	是	电话条是否需要显示辅助功能（网络延时、排队人数等），以及自定义辅助功能。 为空时，默认不显示。见下表2
actionConfig	电话功能配置	object	是	自定义电话功能。 为空时，使用系统推荐的默认配置。见下表3
settingConfig	设置功能配置	object	是	自定义设置功能。 为空时，使用系统推荐的默认配置。见下表4

表1 themeColor参数说明

属性	名称	类型	可空	说明
showLeftLine	左侧分割线	boolean	是	电话条（含辅助功能区域）最左侧是否需要显示分割线。 false：隐藏；true：显示。 默认隐藏。
showRightLine	右侧分割线	boolean	是	电话条（含辅助功能区域）最右侧是否需要显示分割线。 false：隐藏；true：显示。 默认隐藏。
light	未通话时UI背景色	string	是	未通话时UI背景颜色（RGB颜色）。 为空时，默认#FFFFFF。
dark	通话中主区域背景色	string	是	通话中电话条主区域的背景颜色（RGB颜色）。 为空时，默认#515A7C。
darkContent	通话中扩展区背景色	string	是	通话中电话条扩展区域的背景颜色（RGB颜色）。 为空时，默认#434A66。

表2 appConfig参数说明

属性	名称	类型	可空	说明
placement	显示位置	string	是	辅助功能显示在电话条的左侧还是右侧。 left：电话条左侧；right：电话条右侧。
showQueueInfo	查看排队人数	boolean	是	是否显示该功能图标。 false：隐藏；true：显示。 默认显示。
showNetDelayInfo	查看网络延时	boolean	是	是否显示该功能图标，改图标仅限接听方式为网页电话时可见。 false：隐藏；true：显示。 默认显示。

表3 actionConfig参数说明

属性	名称	类型	可空	说明
transfer	转移	boolean	是	是否显示操作按钮。 false：隐藏；true：显示。 为空时，默认显示。
consult	咨询	boolean	是	是否显示操作按钮。 false：隐藏；true：显示。 为空时，默认显示。
keepContinue	保持（包含取消保持）	boolean	是	是否显示操作按钮。 false：隐藏；true：显示。 为空时，默认显示。
stillVoice	静音（包含取消静音）	boolean	是	是否显示操作按钮。 false：隐藏；true：显示。 为空时，默认显示。
sendSatisfaction	发送满意度	boolean	是	是否显示操作按钮。 false：隐藏；true：显示。 为空时，默认显示。
extendBtn	延长整理时长	boolean	是	是否显示操作按钮。 false：隐藏；true：显示。 为空时，默认显示。
extendFinishTime	延长时间	number	是	配置后每次按此时间延长整理。 30-900秒。 为空时，默认60秒。
internal	内部通话	boolean	是	是否显示操作按钮。 false：隐藏；true：显示。 为空时，默认显示。
acwToBusy	结束整理并置忙	boolean	是	是否显示操作按钮。 false：隐藏；true：显示。 为空时，默认显示。
dialingPad	拨号盘	boolean	是	是否能够使用拨号盘。 false: 隐藏；true:显示 为空时，默认显示
soundRecording	通话录音（包含取消通话录音）	boolean	是	是否显示操作按钮。 false：隐藏；true：显示。 为空时，默认隐藏。
region	国家编码	boolean	是	是否能够使用国家编码。 false: 隐藏；true:显示。 为空时，默认隐藏。

表4 settingConfig参数说明

属性	名称	类型	可空	说明
readOnlyExt	修改分机号	boolean	是	修改座席绑定的分机号。 false：可改；true：只读。 为空时，默认可改。
showUnbind	离线后自动解绑	boolean	是	UI是否显示该功能。 false：隐藏；true：显示。 为空时，默认显示。
chooseEdgeLocation	语音接入点	boolean	是	通过选择最近的语音接入站点，能够利用附近的服务器进行实时语音通讯，从而减少通信延迟，有效提升系统的响应速度和带宽使用效率。

呼叫操作

● 外呼

//需要在电话条初始化后才能执行
window.sobotAgent.makeCall({
    otherDN: "133****3333",
    privacyNumber: "XFHAOWHFEFLASJLKWJLD",
    userData: {}
})

请求参数

属性	名称	类型	可空	说明
otherDN	客户号码	string	否	UI显示的客户号码。
privacyNumber	客户号码加密	string	是	支持加密号码外呼；例如：XFHAOWHFEFLASJLKWJLD；
userData	自定义数据	object	是	在电话事件中会返回该值。 在通话记录中会存储该值。 需要encodeURIComponent编码