工单SDK

您好,欢迎接入工单SDK, 以下提供基本用法、注意事项、参数说明、方法说明、事件说明、相关示例等。

基本用法

第一步:配置SDK

登陆Udesk客服系统管理员账号,在 管理中心 -> 渠道管理 -> 工单SDK,配置基本属性。

第二步:调用SDK

复制基本信息中的代码到网页底部,修改配置参数信息,调用相应方法既可使用SDK。

效果示例

电脑端

udesk

udesk

udesk

udesk

移动端

udesk

udesk

udesk

udesk

注意事项

设备支持

工单SDK目前支持PC/Android(含平板)/IOS(含平板)等设备。

浏览器支持

  • 目前支持IE9+(含)的IE浏览器与基于它内核(360/qq/...)、其他主流浏览器(chrome/firefox/...)。
  • 由于IE9浏览器不完全支持 https://developer.mozilla.org/en-US/docs/Glossary/CORS/ (W3C CORS标准), 在IE9上使用SDK时会有一定的限制,即跨域请求的两端必须采取相同的协议。
  • 如果有可能,建议您升级到IE10或更高版本,以获得最佳的用户体验。

第三方库

工单SDK依赖第三方库Jquery,请在网站中引入Jquery,或者取消工单SDK插件代码中Jquery引用的注释。

基本示例

内嵌代码示例

<body>
    <!-- 网页内容 具体代码请在管理员工单SDK插件处复制 -->

    <script>
    (function() {
      var token = "" + (token = new Date()).getFullYear() + token.getMonth() + token.getDate();

      /* if your website does not introduce jQuery ,please cancel the ollowing annotation code.*/

      // var scriptDom = document.createElement("script");
      // scriptDom.src = "https://assets-cli.udesk.cn/ticket_js_sdk/static/vendor/js/jquery.min.js?t="+token;
      // document.body.appendChild(scriptDom);

      var scriptDom = document.createElement("script");
      scriptDom.src = "https://assets-cli.udesk.cn/ticket_js_sdk/1.0.1/js/sdk.min.js?t="+token;
      document.body.appendChild(scriptDom);
      var styleDom = document.createElement("link");
      styleDom.rel = "stylesheet";
      styleDom.href = "https://assets-cli.udesk.cn/ticket_js_sdk/1.0.1/css/sdk.min.css?t="+token;
      document.body.appendChild(styleDom);
      scriptDom.addEventListener('load', function() {
          var udesk = UdeskSDK.ticketSDK.init({
              // [Required] Must provide subdomain.
              subdomain:'your subdomain',
              // [Required] Must provide client appId.
              appid:'f840xxxxxx5f868e',
              // [Required] Must provide signature.
              signature: 'your signature',
              // [Required] Must provide type.
              type:'content type',
              // [Required] Must provide content.
              content:'content',
              container:'sdk'
          });
          // Your code goes here...
          udesk.create({
            type:'new'
          })
      }, false);
  })();
    </script>
</body>

自定义配置

初始化全局参数

参数名称 类型 是否必需 说明
subdomain String 公司子域名 必填 公司域名
appid String 系统生成 必填 SDK中工单插件的唯一标识
signature String 签名加密的字符串 必填 SDK认证必须的签名,查看详情
type String token/email/weixin 必填 类型取值范围
content String 类型值 必填 对应类型的值,计算signature使用
position Objcet { position: absolute, right: 0; bottom: 0 } 工单插件相对于容器的停靠位置,可以指定相对或绝对定位,在绝对定位时,还可以指定上下左右的位置信息:{ position: relative/absolute; left: 0, right: 0, top: 0, bottom: 0 }
height String 100% 配置自定义SDK高度
width String 100% 配置自定义SDK宽度
theme String "default" 配置自定义SDK主题。请注意,本插件中并不提供内置的多主题,您可以根据自己的需要设置多主题,然后通过此属性进行切换。
lang String ZH-CN/EN-US 配置SDK的国际化语言设置,默认语言是中文。
defaultFormData Object {content:'工单主题',select_fields:'文本字段'} 设置工单提交时的字段值,会覆盖客户填入的值

初始化签名认证算法

客户身份认证。SDK首先要做客户身份认证,认证请参考下面的参数以及signature加密算法。token,email,weixin三者必填其一。

类型及内容参数说明

参数名称 类型 是否必需 说明
appid String 系统生成 SDK中工单插件的唯一标示
token(类型) String customer_token 客户标识
email(类型) String email 必须主邮箱
weixin(类型) String contact_weixins.openid 微信的appid + "#" +openid

签名算法

用户名: {appid}&{类型}&{内容}
算法:SHA1(用户名 + "&" + appkey)

注意:

  • 签名的计算应在服务器端完成
  • 如果客户不存在会自动创建

初始化实例代码

var udesk = UdeskSDK.ticketSDK.init({
    appid: "XXXXXXX-XXXXXXXXXXX-XXXXXXXX-XXXXXX",
    signature: "XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX",
    type:"xxx"
    content:"xxx",
    subdomain: "xxxx",
    position: {
        position: relative
    },
    height: "100%",
    width: "100%",
    theme: "default",
    lang: "ZH-CN"
});

方法说明

方法名称 参数 说明
setDefaultFormData {} 设置提交新建工单时的附加数据。通过此方式,您可以在提交新工单时,以编程的方式附加上一些额外的字段。此方法在提交一些UI不可见的字段值时非常有用。参数与[defaultFormData]
create {type:"xxx"} 此方法用来生成工单相关页面。参数type的可选值为:new/list/detail,其中detail需要传ticketId。如:udesk.create({type:"detail",ticketId:1})
hide String 隐藏渲染出来的对应类型的组件。参数可选值为:new/list/detail。留空隐藏全部组件。
show String 显示隐藏的对应类型的组件。参数可选值为:new/list/detail。显示全部隐藏的组件。
destroy String 销毁渲染出来的对应类型的组件。参数可选值为:new/list/detail。留空注销全部组件。

create方法详细说明

参数说明

参数名称 类型 是否必需 说明
type {} new/list/ticketId 生成对应类型工单页面
ticketId Number 数字 type值为detail时,ticketId必填
container Elment/String [Element body] 默认容器body节点。可以设置id值和Dom对象。(会覆盖init中的容器值)
height String "100%" 配置实例化表单的高度(会覆盖init中的高度)
width String "100%" 配置实例化表单的宽度(会覆盖init中的宽度)
position String {} 配置实例化表单的定位样式(会覆盖init中的定位样式)
classNames String "test" 配置实例化表单的class(会覆盖init中的高度)

使用实例

    //新建工单
    udesk.create({
            type: 'new',
            classNames:'subdomain-ticket-sdk',
            container: document.body,
        height: "100%",
        width: "100%",
        position: {
            position: relative
        },
        });
        //工单详情
        udesk.create({
            type: 'detail',
            ticketId: 10,
            classNames:'subdomain-ticket-sdk',
            container: 'sdk'//容器id值,
        height: "100%",
        width: "100%",
        position: {
            position: relative
        },
        });