<!DOCTYPE html
  PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <meta name="keywords" content="" />
  <meta name="description" content="" />
  <title>智能客服</title>
  <link data-n-head="ssr" rel="icon" type="image/x-icon" href="./static/images/favicon.ico">
  <link rel="stylesheet" type="text/css" href="static/css/common.css" />
  <link rel="stylesheet" type="text/css" href="static/css/style2024.css" />
  <!-- <link rel="stylesheet" href="static/js/lib/kindeditor/themes/default/default.css"> -->
  <link rel="stylesheet" type="text/css" href="/lib/layout/cty-layout.css">
  <script src="static/js/lib/marked.min.js"></script>
  <link href="../oneframe/cmcui.css"
  rel="stylesheet" type="text/css">
  <style>
    #ctyun-cn-open-header .header-banner.show {
      display: none;
    }
    :root {
      --blueColor: #0076FF;
    }
    a{
      /* color: rgb(0, 0, 238); */
      color: var(--blueColor);
    }

    a[data-flag=nightServe] + a {
      color: inherit;
      pointer-events: none;
      cursor: inherit;
    }

    a:visited {
      /* color: purple; */
    }

    .answer-search__result {
      display: none;
      position: absolute;
      top: -171px;
      left: 0;
      width: 100%;
      background: #fff;
      border: 1px solid #ddd;
      padding: 10px 0;
      height: 172px;
      overflow: hidden;
      z-index: 1000000;
      box-sizing: border-box;
    }

    .answer-search__result li {
      height: 30px;
      line-height: 30px;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      font-size: 12px;
      color: #555;
      cursor: pointer;
      text-indent: 1em;
    }

    .answer-search__result li:hover {
      background: #DDD;
    }
  </style>
  <style>
    /* 更多/收起样式 */
    .mainMsgText {
      max-height: 186px;
      overflow: hidden;
    }
    .mainMsgText.ai {
      max-height: none;
    }
    .relationFaqBox {
      display: none;
    }

    .mainMsgText img {
      /* cursor: pointer; */
      /* cursor: url('./static/images/big.jpg'), auto; */
      /* cursor: zoom-in; */
      max-width: 100%;
    }

    #hideCtrol {
      display: none;
    }

    .more-body {
      display: none;
      border: 1px solid #d9d9d9;
      align-items: center;
      justify-content: center;
      padding: 6px 0 0 0;
      cursor: pointer;
      color: #666;
      width: max-content;
      border: 1px solid #d9d9d9;
      padding: 0 10px;
      border-radius: 6px;
      margin: 10px auto;
    }
    .more-body:hover > span {
      color: var(--blackColor);
    }
    .more-body .black, .more-body:hover .ng-star-inserted {
      display: none;
    }
    .more-body:hover .black {
      display: block;
    }

    .more-body-float {
      height: 32px;
      line-height: 32px;
      width: 32px;
      border-radius: 20px;
      box-sizing: border-box;
      box-shadow: 0px 1px 1px 0px #95959540;

      text-align: center;
      display: block;
      position: absolute;
      top: -7px;
      right: -62px;
      background-color: white;
      background-image: url(../pages/static/images/double-up.svg);
      background-size: 70%;
      background-position: center;
      background-repeat: no-repeat;
      cursor: pointer;
      color: transparent;
    }

    .more-body-float:hover {
      background-image: url(../pages/static/images/double-up-black.svg);
    }

    .more-body span {
      margin-right: 5px;
    }

    /* .more-body span:hover {
      color: #f00;
    } */

    .more-body img {
      width: 14px;
      height: 14px;
    }

    #win {
      position: fixed;
      height: 700px;
      width: 550px;
      bottom: 20px;
      right: 20px;
      background: #fff;
      border-radius: 4px;
      box-shadow: 0px 0px 4px 2px rgba(0,0,0, .5);
      z-index: 99999;
      display: none;
    }
    @media screen and (max-height: 765px) {
      #win {
        height: 580px;
        width: 400px;
      }
    }

    #win .header {
      height: 60px;
      width: 100%;
      cursor: move;
      background: #E5E7EB;
      background-repeat: no-repeat;
      background-image: url(./static/images/word1.png);
      background-size: contain;
      background-position: right;
      font-size: 16px;
      line-height: 60px;
      text-indent: 20px;
      color: #181818;
      position: relative;
      border-top-left-radius: 4px;
      border-top-right-radius: 4px;
    }

    #win .header i{
      display: inline-block;
      height: 22px;
      width: 22px;
      background: url(./static/images/close.svg);
      background-size: contain;
      position: absolute;
      right: 18px;
      top: 19px;
      cursor: pointer;
      z-index: 1;
    }

    #win .iframe {
      height: calc(100% - 100px);
      width: 100%;
      overflow: hidden;
    }
    #win .footer {
      height: 40px;
      line-height: 40px;
      color: #2883D6;
      width: 100%;
      font-weight: 400;
      box-shadow: 0px -2px 4px 2px rgba(0,0,0,0.05);
    }
    #win .footer .link {
      display: inline-block;
      cursor: pointer;
      text-indent: 10px;
    }
    #win .footer i{
      display: inline-block;
      height: 14px;
      width: 14px;
      background: url(./static/images/open.svg);
      background-size: contain;
      position: relative;
      top: 3px;
    }

    #win iframe {
      height: 100%;
      border: none;
      width: 100%;
    }
    #win .loading {
      position: absolute;
      height: 100%;
      width: 100%;
      background-color: rgba(255,255,255, .5);
      background-position: 50% calc(50% - 50px);
    }
    .win-wrapper.h{
      position: absolute;
      width: calc(100% + 6px);
      height: 100%;
      top: 0px;
      left: -3px;
      background: transparent;
      z-index: -1;
      cursor: col-resize;
    }
    .win-wrapper.l{
      position: absolute;
      width: 100%;
      height: calc(100% + 6px);
      top: -3px;
      left: 0;
      background: transparent;
      z-index: -1;
      cursor: row-resize;
    }

    .mainMsgText table {
      border-top: 1px solid #ccc;
      border-left: 1px solid #ccc;
    }
    .mainMsgText table td,
    .mainMsgText table th {
      border-bottom: 1px solid #ccc;
      border-right: 1px solid #ccc;
      padding: 3px 5px;
    }
    .mainMsgText table th {
      border-bottom: 2px solid #ccc;
      text-align: center;
    }/* blockquote 样式 */
    .mainMsgText blockquote {
      display: block;
      border-left: 8px solid #d0e5f2;
      padding: 5px 10px;
      margin: 10px 0;
      line-height: 1.4;
      font-size: 100%;
      background-color: #f1f1f1;
    }/* code 样式 */
    .mainMsgText code {
      display: inline-block;
      background-color: #f1f1f1;
      border-radius: 3px;
      padding: 3px 5px;
      margin: 0 3px;
    }
    .mainMsgText pre code {
      display: block;
      overflow-x: auto;
    }/* ul ol 样式 */

    .mainMsgText ol li{
      list-style: auto;
    }
    .mainMsgText h1, .mainMsgText h2, .mainMsgText h3, .mainMsgText h4, .mainMsgText h5, .mainMsgText h6 {
      font-size: initial;
    }
    .mainMsgText ol, .mainMsgText ul {
      padding-left: 28px;
      list-style: initial;
    }
    .mainMsgText li{
      list-style: initial;
    }
    .chat-msg {
      position: relative;
    }
    .chat-msg.robot-tpl,  .chat-msg.robot-loading, .chat-msg.robot-tpl .chat-msg__addbox {
      overflow: visible;
    }
    .chat-msg.robot-loading .chat-msg__wrapper {
      width: max-content;
    }
    .overflow-tooltip {
      position: fixed;
      max-height: 290px;
      overflow: hidden;
      width: 600px;
      background: white;
      padding: 15px 0 15px 15px;
      border-radius: 10px;
      visibility: hidden;
      z-index: 10000;
      box-sizing: content-box;
      box-shadow: 0px 0px 40px 0px #0000001A;

    }
    /* 更改滚动条的默认样式 */
    .overflow-tooltip::-webkit-scrollbar {
      width: 8px; /*高宽分别对应横竖滚动条的尺寸*/
    }
    .overflow-tooltip::-webkit-scrollbar-thumb {
      /*滚动条里面小方块*/
      border-radius: 2px;
      background: rgba(144, 147, 153, 0.5);
    }
    ::-webkit-scrollbar-track {
      background-color: #F5F5F5
    }

    ::-webkit-scrollbar {
      width: 3px;
      background-color: #F5F5F5
    }

    ::-webkit-scrollbar-thumb {
      background-color: #d9d9d9
    }

    .overtip {
      color: var(--blueColor);
      cursor: pointer;
      position: relative;
    }
    .overtip.before.top::before{
      content: '';
      height: 24px;
      width: 24px;
      background: url('./static/images/arrow-sort.svg');
      display: inline-block;
      position: absolute;
      background-size: contain;
      top: -15px;
      left: calc(50% - 9px);
      z-index: 100001;
    }
    .overtip.before.bottom::before{
      content: '';
      height: 24px;
      width: 24px;
      background: url('./static/images/arrow-sort.svg');

      transform: rotateZ(180deg);
      display: inline-block;
      position: absolute;
      background-size: contain;
      top: 10px;
      left: calc(50% - 9px);
      z-index: 100001;
    }
    .overflow-tooltip img {
      max-width: 100%;
    }
  
  </style>
</head>

<body>
  <div class="good-answer-active"></div>
  <div class="not-good-answer-active"></div>
  <div class="red-collaspe"></div>
  <!-- 文档小窗口 -->
  <div id="win" >
      <div class="win-wrapper h" id="h"></div>
      <div class="win-wrapper l" id="l"></div>
      <div class="header" id="win-header">
        帮助文档
        <i class="close-btn"></i>
      </div>
      <div class="iframe">
        <div class="loading"></div>
        <iframe id="winIframe" src=""></iframe>
      </div>
      <div class="footer">
        <div class="link">
          新窗口打开文档
          <i class="open"></i>
        </div>
      </div>
  </div>
  <!--背景色块-->
  <div class="backdrop1">
    <div></div>
  </div>
  <div class="backdrop2"><div></div></div>
  <div class="backdrop3"><div></div></div>
  <div class="backdrop4"><div></div></div>
  <!--背景色块-->
  
  <div id="ctyun-cn-open-header">
    <!-- <img src="./static/img2023/header2.jpg" class="bannerIcon1" alt=""> -->
  </div>
  <div id="app" class="chatWarp">
    <div class="chat" id="chatOut">
      <div class="chat-main">
        <div id="chatBox" class="chat-content">
          <div id="chatContent"></div>
        </div>
        <div class="toolsBox2023">
          <!-- 为您推荐 -->
          <div class="foryouRmd" id='foryouRmd' style="display: none;">
            <ul>
            </ul>
            <span class="change"><img src="static/img2023/help_refresh0428.svg" alt="">换一换</span>
          </div>
        </div>
        
        <!-- 发送模块 -->
        <div id="chatSend" class="chat-send">
          <ul id="questionUl"></ul>
          <input id="editor" class="chat-editor" placeholder='请用"产品+问题"描述您的问题，如：云主机无法远程登录' ></input>
          <div class="btn-clear"></div>
          <button class="btn-send">
            <div class="btn-send-icon"></div>
          </button>
        </div>
        <div class="scurity-alert">服务内容由AI生成，请甄别使用<span class="alert-scurity">《安全须知》</span></div>
      </div>
      <!-- 人工窗口 -->
      <div class="personWarp">
        <iframe name="myiframe" id="myframe" src="" frameborder="0" width="100%" height="100%" scrolling="no"
          style="background:transparent"></iframe>
      </div>
      <!-- 人工窗口end--> 
      <!-- 右侧 -->
      <div class="chat-sidebar">
        <div class="chat-sidebar-wrapper">
          <div class="rightTit zzfw"></div>
          <ul class="toolUl">
            <li class="func-btn tjgd" onclick="openTools('https://www.ctyun.cn/h5/wsc/worksheet/submit','_blank', '提交工单')">
              <img class="gray" src="./static/img2023/zzfu_tjgd.svg" alt="">
              <img class="light" src="./static/img2023/zzfu_tjgd_light.svg" alt="">
              <span>提交工单</span>
            </li>
            <li class="func-btn jgjsq" onclick="openTools('https://www.ctyun.cn/pricing/ecs','_blank','价格计算器');">
              <img class="gray" src="./static/img2023/zzfu_jisuanqi.svg" alt="">
              <img class="light" src="./static/img2023/zzfu_jisuanqi_light.svg" alt="">
              <span>价格计算器</span>
            </li>
            <li class="func-btn ksba" onclick="openTools('http://www.ctyun.cn/record','_blank','快速备案');">
              <img class="gray" src="./static/img2023/zzfu_ksba.svg" alt="">
              <img class="light" src="./static/img2023/zzfu_ksba_light.svg" alt="">
              <span>快速备案</span>
            </li>
            <li class="func-btn sqfp" onclick="openTools('https://www.ctyun.cn/console/expense/invoice','_blank','申请发票');">
              <img class="gray" src="./static/img2023/zzfu_sqfp.svg" alt="">
              <img class="light" src="./static/img2023/zzfu_sqfp_light.svg" alt="">
              <span>申请发票</span>
            </li>
            <li class="lastLi func-btn zygl" onclick="openTools('http://www.ctyun.cn/vmcontrol/control','_blank','资源管理');">
              <img class="gray" src="./static/img2023/zzfu_zygl.svg" alt="">
              <img class="light" src="./static/img2023/zzfu_zygl_light.svg" alt="">
              <span>资源管理</span>
            </li>
          </ul>
          <div class="rightTit hyzh"></div>
          <ul class="toolUl">
            <li class="func-btn zhmm" onclick="openTools('https://www.ctyun.cn/auth/#/findpass','_blank','找回密码');">
              <img class="gray" src="./static/img2023/hyzh_zhmm.svg" alt="">
              <img class="light" src="./static/img2023/hyzh_zhmm_light.svg" alt="">
              <span>找回密码</span>
            </li>
            <li class="func-btn xgmm" onclick="openTools('https://www.ctyun.cn/user/change_password','_blank','修改密码');">
              <img class="gray" src="./static/img2023/hyzh_xgmm.svg" alt="">
              <img class="light" src="./static/img2023/hyzh_xgmm_light.svg" alt="">
              <span>修改密码</span>
            </li>
            <li class="func-btn ggsjh lastLi" onclick="openTools('http://www.ctyun.cn/user/check_mobilephone','_blank','更改手机号');">
              <img class="gray" src="./static/img2023/hyzh_sjgg.svg" alt="">
              <img class="light" src="./static/img2023/hyzh_sjgg_light.svg" alt="">
              <span>更改手机号</span>
            </li>
          </ul>
          <div class="rightTit cwwt"></div>
          <ul class="toolUl">
            <li class="func-btn zhcz" onclick="openTools('https://www.ctyun.cn/console/expense/fund/recharge','_blank','账户充值');">
              <img class="gray" src="./static/img2023/cwwt_zhcz.svg" alt="">
              <img class="light" src="./static/img2023/cwwt_zhcz_light.svg" alt="">
              <span>账户充值</span>
            </li>
            <li class="func-btn xfzd" onclick="openTools('https://www.ctyun.cn/console/expense/bill/list','_blank','消费账单');">
              <img class="gray" src="./static/img2023/cwwt_xfzd.svg" alt="">
              <img class="light" src="./static/img2023/cwwt_xfzd_light.svg" alt="">
              <span>消费账单</span>
            </li>
            <li class="lastLi func-btn jymx" onclick="openTools('https://www.ctyun.cn/console/expense/bill/billDetail','_blank','交易明细');">
              <img class="gray" src="./static/img2023/cwwt_jymx.svg" alt="">
              <img class="light" src="./static/img2023/cwwt_jymx_light.svg" alt="">
              <span>交易明细</span>
            </li>
            <li class="lastLi func-btn yetx" onclick="openTools('https://www.ctyun.cn/console/expense/fund/withdraw','_blank','余额提现');">
              <img class="gray" src="./static/img2023/cwwt_yetx.svg" alt="">
              <img class="light" src="./static/img2023/cwwt_yetx_light.svg" alt="">
              <span>余额提现</span>
            </li>
          </ul>
          <div class="rightTit helpDiv ggxx" style="padding: 5px 10px 5px 10px;">
            <div class="helpTit_left"></div>
            <div class="helpTit_right">
              <span class="moreNotice">更多</span>
            </div>
          </div>
          <div class="noticeBox listBox">
            <ul class="helpUl" id="notice-ul"></ul>
          </div>
          <div class="rightTit helpDiv bzwd">
            <div class="helpTit_left helpHref" ></div>
            <div class="helpTit_right helpRefresh">
              <img src="./static/img2023/help_refresh0428.svg" alt="">
              <span>换一换</span>
            </div>
          </div>
          <!-- 帮助模块 -->
          <div class="helpBox listBox">
            <ul class="helpUl helpOne">
              <li class="helpLi">
                <a target='_blank' title="新手上云指导教程"
                  href="https://www.ctyun.cn/document/novice">
                  新手上云指导教程
                </a>
              </li>
              <li class="helpLi">
                <a target='_blank' title="天翼云学堂及考试认证"
                  href="https://edu.ctyun.cn/">
                  天翼云学堂及考试认证
                </a>
              </li>
              <li class="helpLi">
                <a target='_blank' title="天翼云OpenAPI中心"
                  href="https://www.ctyun.cn/document/api">
                  天翼云OpenAPI中心
                </a>
              </li>
              <li class="helpLi">
                <a target='_blank' title="个人免费试用中心"
                  href="https://www.ctyun.cn/h5/activity/trial/personal">
                  个人免费试用中心
                </a>
              </li>
            </ul>
            <ul class="helpUl helpTwo">
              <li class="helpLi">
                <a target='_blank' title="弹性云主机相关问题"
                  href="https://www.ctyun.cn/document/10026730">
                  弹性云主机相关问题
                </a>
              </li>
              <li class="helpLi">
                <a target='_blank' title="企业免费试用中心"
                  href="https://www.ctyun.cn/h5/activity/trial/enterprise">
                  企业免费试用中心
                </a>
              </li>
              <li class="helpLi">
                <a target='_blank' title="精选企业案例"
                  href="https://www.ctyun.cn/cases/">
                  精选企业案例
                </a>
              </li>
              <li class="helpLi">
                <a target='_blank' title="自助工具及常见问题指南" href="https://www.ctyun.cn/document/selfhelp">
                  自助工具及常见问题指南
                </a>
              </li>
            </ul>
          </div>
        </div>
        <div class="fixed-footer">
          售前咨询热线：400-810-9889转1
        </div>
      </div>
      <!-- 右侧end -->
    </div>
  </div>
  <!-- 发送空白时弹出 -->
  <div id="tip" class="tip hide">
    <p>不能发送空白信息</p>
  </div>

  <!-- 转人工 -----------------start-->
  <!-- 产品类型和问题分类弹窗 -->
  <div id="questionType">
    <div class="tips">为了更好的为您推荐案例，请先选择您的产品类型及所遇到的问题分类</div>
    <div class="selet-wrapper">
      <div>选择产品：</div>
      <select class="left easyui-combobox" placeholder="请选择" style="width: 450px;">
      </select>
    </div>
    <div class="selet-wrapper">
      <div>选择问题类型：</div>
      <select class="right easyui-combobox"  placeholder="请选择" style="width: 450px;">
      </select>
    </div>
  </div>
  <!-- 转人工 -------------------------end-->
  <!-- 主机自检弹窗 start -->
  <div id="ipContent" class="search-content">
    <div class="header">
      <input id="ip" class="ip input" type="text" placeholder="请输入想要查询的IP地址" />
      <i class="search-icon" id="ip-search-btn"></i>
    </div>
    <div>
      <div class="tips"></div>
      <div id="IPStatus" class="msg">
        <div class="item">
          <span class="label">IP是否压制：</span>
          <span class="isIP value"></span>
        </div>
      </div>
      <div class="load">
        <i class="icon-loading"></i>
        <span>查询中...</span>
      </div>
    </div>
  </div>
  <div id="hostContent" class="search-content">
    <div class="header">
      <input id="host" class="input host" type="text" placeholder="请输入想要查询的域名" />
      <i class="search-icon" id="host-search-btn"></i>
    </div>
    <div>
      <div class="tips"></div>
      <div id="hostStatus" class="msg">
        <!-- <div class="title">监控信息：</div> -->
        <div class="item">
          <span class="label">封堵状态：</span>
          <span class="isFilter value"></span>
        </div>
        <div class="item">
          <span class="label">工信部备案状态：</span>
          <span class="gxbBa value"></span>
        </div>
        <div class="item">
          <span class="label">天翼云备案状态：</span>
          <span class="ygsBa value"></span>
        </div>
      </div>
      <div class="load">
        <i class="icon-loading"></i>
        <span>查询中...</span>
      </div>
    </div>
  </div>
  <!-- 主机自检弹窗 end -->
  <!-- 登录弹框 -->
  <div class="backupForLogin" style="display: none;"></div>
  <div class="toLoginBox" style="display: none;">
    <div class="toLoginIcon">
      <img src="./static/img2023/login_warning.svg" alt="">
    </div>
    <div class="toLoginBoxTitle">
      <p>温馨提示</p>
      <div class="login_close">
        <img src="./static/img2023/login_close.svg" alt="">
      </div>
    </div>
    <div class="toLoginBoxContent">
      <div class="firstStep">
        <div class="toLoginBoxTips tips0">为了更好的服务，请您登录后使用
        </div>
        <div class="toLoginBoxTips tips1">让我们为您提供更好的服务
        </div>
        <div class="loginBtnBox">
          <div class="toLoginBoxButton">立即登录</div>
        </div>
      </div>
    </div>
  </div>
  <!-- 登录弹框 end-->

  <!-- 图片点击变大 -->
  <div class="dialog-bg" id="dialog-bg">
    <div class="img-box" id="img-box">
      <img src="">
    </div>
  </div>

  <!-- 猜你想问 - 欢迎配置 -->
  <script type="text/html" id="welcomeTpl">
  <div class="chat-msg">
    <div class="chat-avatar"><span class="chat_head_seat chatImage"><img  src="static/img2023/tx_robot.svg" alt=""></span></div>
    <div class="chat-msg__item">
      <div class="chat-msg__addbox">
        <div class="triangle_border_down_AI" style="margin-left: 4px !important; margin-top: 14px !important;"><span></span></div>
        <div class="chat-msg__wrapper welcomeTpl">
          <div class="chat-msg__content"><%=welcomeData%></div>
          <div class="chat-msg__guess">
            <p>猜您想问的问题是：</p>
            <div class="chat-msg__qa">
              <div class="guess-left">
                <% for(var i = 0; i < Math.ceil(questions.length/2); i++){ %>
                <div class="guess-item">
                  <span><%=i+1%>.</span>
                  <a data-faqknowledgecontent="<%=questions[i].faqTitle%>" title="<%=questions[i].faqTitle%>" data-faqid="<%=questions[i].faqId%>" class="link link-relate" href="javascript:;"><%=questions[i].faqTitle%></a>
                </div>
                <% } %>
              </div>
              <% if(questions.length > Math.ceil(questions.length/2)){ %>
              <div class="guess-right">
                <% for(var i = Math.ceil(questions.length/2); i < questions.length; i++){ %>
                <div class="guess-item">
                  <span><%=i+1%>.</span>
                  <a data-faqknowledgecontent="<%=questions[i].faqTitle%>" title="<%=questions[i].faqTitle%>" data-faqid="<%=questions[i].faqId%>" class="link link-relate" href="javascript:;"><%=questions[i].faqTitle%></a>
                </div>
                <% } %>
              </div>
              <% } %>
            </div>
          </div>

          <div class="self-tools">
            <div class="self-tools-title">直接使用自助工具</div>
            <div class="tools-wrapper">
              <div class="tools">
                <div class="tool1" data-link="https://www.ctyun.cn/console/smartservice/ticket/detection?type=remote-login">
                  <div class="icon"></div>
                  <div>
                    <div class="tool-name">无法远程登录</div>
                    <div class="tool-desc">检测实例状态、访问控制、磁盘、弹性公网IP等状态，帮助您排查定位问题</div>
                  </div>
                </div>
                <div class="tool2" data-link="https://www.ctyun.cn/console/smartservice/ticket/detection?type=inaccessible">
                  <div class="icon"></div>
                  <div>
                    <div class="tool-name">网站无法访问</div>
                    <div class="tool-desc">检测实例状态、域名、访问控制、实例性能等状态，帮助您排查相关问题</div>
                  </div>
                </div>
                <div class="tool3" data-link="https://www.ctyun.cn/console/smartservice/ticket/detection?type=port">
                  <div class="icon"></div>
                  <div>
                    <div class="tool-name">端口通信诊断</div>
                    <div class="tool-desc">检测实例安全组规则、访问控制、实例状态，帮助您排查定位端口问题</div>
                  </div>
                </div>
                <div class="tool4" data-link="https://www.ctyun.cn/console/smartservice/ticket/detection?type=quick-detection">
                  <div class="icon"></div>
                  <div>
                    <div class="tool-name">主机一键诊断</div>
                    <div class="tool-desc">检测实例状态、性能、配额、磁盘等状态，帮助您了解弹性云主机的状态</div>
                  </div>
                </div>
                <div class="tool5" data-link="https://www.ctyun.cn/console/smartservice/ticket/detection/network">
                  <div class="icon"></div>
                  <div class="tool-name"></div>
                  <div>
                    <div class="tool-name">EIP 自检诊断</div>
                    <div class="tool-desc">检测EIP实例状态、端口备案情况、封堵等状态，帮助您了解弹性EIP的状态</div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</script>
  <!-- 用户消息模板 -->
  <script type="text/html" id="userTpl">
  <div class="chat-msg chat-msg__user">
    <div class="chat-avatar"><span class="chat_head_custom"><img src="static/img2023/tx_people.svg" alt=""></span></div>
    <div class="chat-msg__item">
      <div class="">
        <div class="triangle_border_down_cust_AI" style="position: static !important;"></div>
        <div class="chat-msg__wrapper">
          <div class="chat-msg__content"><%=msgData%></div>
        </div>
      </div>
    </div>
  </div>
</script>
  <!-- 机器人消息模板 -->
  <script type="text/html" id="robotTpl">
  <div class="chat-msg robot-tpl">
    <div class="chat-avatar"><span class="chat_head_seat chatImage"><img  src="static/img2023/tx_robot.svg" alt=""></span></div>
    <div class="chat-msg__item">
      <div class="chat-msg__addbox">
        <div class="triangle_border_down_AI" style="margin-left: 4px !important; margin-top: 14px !important;"><span></span></div>
        <div class="chat-msg__wrapper">
          <div class="chat-msg__content">
            <% if(passObj && passObj.faqTitle){ %>   <!--没标题就不展示-->
            <div class="titName"><%=passObj.faqTitle%></div>
            <hr style="border: 0;margin: 10px 0;">
            <% } %>
            <% if(passObj && passObj.otherFaqType !== "1"){ %>    <!--无话术就不展示-->
            <div class="mainMsgBox">
              <div class="mainMsgText">
                <% if(!passObj.selfOptionFlag){ %>
                  <div class="mstTextIn"><%=msgData%></div>
                <% } %>
                <% if(passObj.selfOptionFlag){ %>
                  <div class="mstTextIn">
                    <div>
                      <%=passObj.questionText%>
                    </div>
                    <div>
                      <% for(var i = 0; i < passObj.optionList.length; i++){ %>
                        <div class="dianji"><%=passObj.optionList[i]%></div>
                        <% } %>
                    </div>
                  </div>
                <% } %>
              </div>
              <div class="more-body">
                <span>展开</span>
                <img src="./static/img2023/closed_up.svg" class="ng-star-inserted"/>
                <img src="./static/img2023/closed_up_black.svg" class="ng-star-inserted black"/>
              </div>
              <div class="more-body-float">收起</div>
            </div>
            <% } %>

            <!-- 类似关联问题 -->
            <% if(passObj && passObj.relationFaqTitles){ %>
            <div class="relationFaqBox">
              <!-- <h3>猜您想问的问题是</h3> -->
              <h3>相关问题：</h3>
              <ul>
              <% for(var i = 0; i < passObj.relationFaqTitles.length; i++){ %>
              <li><span class="link-relate" data-faqknowledgecontent="<%=passObj.relationFaqTitles[i]%>"><%=passObj.relationFaqTitles[i]%></span></li>
              <% } %>
              </ul>
              <% if(passObj.otherFaqType === "1"){ %>
                <div class="gudinghuashu">
                  如果以上都不是，请以“产品+问题”详细描述您的问题，例：<span class="link-relate" data-faqknowledgecontent="弹性云主机的登录方式">弹性云主机的登录方式</span>
                </div>
              <% } %>
            </div>
            <% } %>
            <% if(passObj && passObj.defaultUserMsgType === "1"){ %>    <!--点踩操作就不展示-->
            <div class="chat-judge-wrapper">
              <div></div>
              <div class="chat-judge-field" data-input="<%=passObj.realInputContent%>" data-interindex="<%=passObj.session.interIdx%>" data-logid="<%=passObj.session.interIdxLogId%>">
                <div class="good-answer little-btn answer-btn">
                  <div class="answerTip">点赞</div>
                </div>
                <div class="not-good-answer little-btn answer-btn">
                  <div class="answerTip">点踩</div>
                </div>
                <div class="answer-comment">
                  <div class="title">您认为需要改进的是：</div>
                  <div class="answer-close"></div>
                  <div class="reasons">
                    <div class="reason selected">匹配有误</div>
                    <div class="reason">内容解答不完善</div>
                  </div>
                  <textarea rows="4" class="comment-text" maxLength="100" resize="off" placeholder="请在此处反馈您的改进意见"></textarea>
                  <div class="word-length-limit">0/100</div>
                  <button class="answer-comment-btn">提交</button>
                  <div class="triangle"></div>
                </div>
              </div>
            </div>
            <% } %>
          </div>
          <% if(passObj && passObj.overtips){ %>
            <% for(var i = 0; i < passObj.overtips.length; i++){ %>
            <div class="overflow-tooltip" data-overtip="<%=passObj.overtips[i].ref%>">
              <div class="overflow-text" style="height: 100%;max-height: 248px;overflow: auto;padding-right:15px;">
                <%=passObj.overtips[i].tip%>
              </div>
            </div>
            <% } %>
          <% } %>
        </div>
      </div>
      <% if(passObj && passObj.type !== 'no' && passObj.type !== 'dialogFlow' && (passObj.defaultUserMsgType === "1" || passObj.otherFaqType === '1' || passObj.type === 'faq')){ %>    <!--点踩操作就不展示-->
        <div style="position: relative;bottom: -6px;height: 30px;line-height: 30px;left: 21px;color:#999;">如需人工服务，请点击 <span data-input="<%=passObj.realInputContent%>" data-interindex="<%=passObj.session.interIdx%>" data-logid="<%=passObj.session.interIdxLogId%>" id="enterLog" style="cursor: pointer;">转人工服务</span></div>
      <% } %>
    </div>
  </div>
</script>

  <!-- ai消息模板 -->
  <script type="text/html" id="aiTpl">
    <div class="chat-msg robot-tpl">
      <div class="chat-avatar"><span class="chat_head_seat chatImage"><img  src="static/img2023/tx_robot.svg" alt=""></span></div>
      <div class="chat-msg__item">
        <div class="chat-msg__addbox">
          <div class="triangle_border_down_AI" style="margin-left: 4px !important; margin-top: 14px !important;"><span></span></div>
          <div class="chat-msg__wrapper">
            <div class="chat-msg__content">
              <div class="mainMsgBox">
                <div class="mainMsgText">
                  <div class="mstTextIn"><%=msgData%></div>
                </div>
              </div>
              
              <!-- 类似关联问题 -->
              <% if(passObj && passObj.relationFaqTitles){ %>
              <div class="relationFaqBox">
                <!-- <h3>猜您想问的问题是</h3> -->
                <h3>相关问题：</h3>
                <ul>
                <% for(var i = 0; i < passObj.relationFaqTitles.length; i++){ %>
                <li><span class="link-relate" data-faqknowledgecontent="<%=passObj.relationFaqTitles[i]%>"><%=passObj.relationFaqTitles[i]%></span></li>
                <% } %>
                </ul>
                <% if(passObj.otherFaqType === "1"){ %>
                  <div class="gudinghuashu">
                    如果以上都不是，请以“产品+问题”详细描述您的问题，例：<span class="link-relate" data-faqknowledgecontent="弹性云主机的登录方式">弹性云主机的登录方式</span>
                  </div>
                <% } %>
              </div>
              <% } %>
              <div class="chat-judge-wrapper">
                <div class="ai-content-tip">内容由人工智能模型生成，请您注意甄别</div>
                <div class="chat-judge-field" data-input="<%=passObj.realInputContent%>" data-interindex="<%=passObj.session.interIdx%>" data-logid="<%=passObj.session.interIdxLogId%>">
                  <div class="good-answer little-btn answer-btn">
                    <div class="answerTip">点赞</div>
                  </div>
                  <div class="not-good-answer little-btn answer-btn">
                    <div class="answerTip">点踩</div>
                  </div>
                  <div class="answer-comment">
                    <div class="title">您认为需要改进的是：</div>
                    <div class="answer-close"></div>
                    <div class="reasons">
                      <div class="reason selected">匹配有误</div>
                      <div class="reason">内容解答不完善</div>
                    </div>
                    <textarea rows="4" class="comment-text" maxLength="100" resize="off" placeholder="请在此处反馈您的改进意见"></textarea>
                    <div class="word-length-limit">0/100</div>
                    <button class="answer-comment-btn">提交</button>
                    <div class="triangle"></div>
                  </div>
                </div>
              </div>
            </div>
            <% if(passObj && passObj.overtips){ %>
              <% for(var i = 0; i < passObj.overtips.length; i++){ %>
              <div class="overflow-tooltip" data-overtip="<%=passObj.overtips[i].ref%>">
                <div class="overflow-text" style="height: 100%;overflow: auto;padding-right:15px;">
                  <%=passObj.overtips[i].tip%>
                </div>
              </div>
              <% } %>
            <% } %>
          </div>
        </div>
        <div style="position: relative;bottom:-6px;height: 30px;line-height: 30px;left: 21px;color:#999;">如需人工服务，请点击 <span data-input="<%=passObj.realInputContent%>" data-interindex="<%=passObj.session.interIdx%>" data-logid="<%=passObj.session.interIdxLogId%>" id="enterLog" style="cursor: pointer;">转人工服务</span></div>
        
      </div>
    </div>
  </script>

<!--生成中消息模版-->
  <script type="text/html" id="loadingTpl">
    <div class="chat-msg robot-loading">
      <div class="chat-avatar"><span class="chat_head_seat chatImage"><img  src="static/img2023/tx_robot.svg" alt=""></span></div>
      <div class="chat-msg__item">
        <div class="chat-msg__addbox">
          <div class="triangle_border_down_AI" style="margin-left: 4px !important; margin-top: 14px !important;"><span></span></div>
          <div class="chat-msg__wrapper">
            <div class="chat-msg__content">
              <div class="loading-img"></div>
              <p>稍等片刻，云顶大模型正在为您解答···</p>
            </div>
          </div>
        </div>
      </div>
    </div>
  </script>

  <!-- 点击人工客服后展示的模板 - 转人工模板 -->
  <script type="text/html" id="serviceTypeTpl">
  <div class="chat-msg">
    <div class="chat-avatar"><span class="chat_head_seat chatImage"><img  src="static/img2023/tx_robot.svg" alt=""></span></div>
    <div class="chat-msg__item">
      <div class="chat-msg__addbox">
        <div class="triangle_border_down_AI" style="margin-left: 4px !important; margin-top: 14px !important;"><span></span></div>
        <div class="chat-msg__wrapper">
          <div class="chat-msg__content">
            <p>请选择服务种类 ：</p>
            <div class="artificialList">
              <a class="questionA" href="javascript:void(0);" data-qaType="23">售前服务</a>
              <a class="questionA" href="javascript:void(0);" data-qaType="24">售后服务</a>
              <a class="questionA" href="javascript:void(0);" data-qaType="25">备案服务</a>
              <a class="questionA" href="javascript:void(0);" data-qaType="26">投诉建议</a>
              <a class="questionA" href="javascript:void(0);" style="display: none" data-qaType="28">测试技能</a>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</script>
  <!-- 新版机器人-聊天us -->
  <script type="text/html" id="serviceTypeTpl2">
    <div class="chat-msg">
      <div class="chat-avatar"><span class="chat_head_seat chatImage"><img  src="static/img2023/tx_robot.svg" alt=""></span></div>
      <div class="chat-msg__item">
        <div class="chat-msg__addbox">
           <div class="chat-msg__wrapper">
            <div class="chat-msg__content">
              <p><%=msgData%></p>
            </div>
          </div>
        </div>
      </div>
    </div>
  </script>

 <script type="text/javascript" src="./static/js/lib/pako.min.js"></script>
  <script type="text/javascript" src="/lib/layout/cty-layout.min.js"></script>
  <script type="text/javascript" src="static/js/lib/jquery.min.js"></script>
  <script type="text/javascript" src="static/js/lib/jquery.tmpl.js"></script>
  <script type="text/javascript" src="static/js/lib/layer/layer.js"></script>
  <script type="text/javascript" src="static/js/lib/base64.min.js"></script>
  <script type="text/javascript" src="static/js/lib/json2.js"></script>
  <script type="text/javascript" src="static/js/lib/unslider.min.js"></script>
  <script type="text/javascript" src="static/js/tools2023.js"></script>
  <script type="text/javascript" src="static/js/pc2023.js?v=11"></script>
  <script type="text/javascript" src="../oneframe/jquery.easyui.min.js"></script>


  <script type="text/javascript">
    $.ajaxSetup({
      complete: function(XMLHttpRequest){
        if(XMLHttpRequest.status === 401){
          window.location.replace('/ucfront/uc_channel_access/webchat/pages/robot.html')
        }
      }
    })
    var userData = {
      name: '',
    };
    var headerMenuMutionObserver = window.MutationObserver
    var headerObserver = new headerMenuMutionObserver(function(mutationList){
      $('#app').css('height', 'calc(100% - ' + $('#ctyun-cn-open-header').height() + 'px)')
    })
    headerObserver.observe(document.querySelector("#ctyun-cn-open-header"), {
      childList: true,
      subtree: true,
      attributes: true,
      attributeFilter: ['style']
    })
    jQuery(document).ready(function () {
      window.CtyLayout.openHeader.init({
        props: {
          responsive: true,
        }
      })
      const params = Config.getParams()
      
      if(params.ticket){
        $.ajax({
          url: '/sso/yunticketLogin',
          type: "GET",
          dataType: "json",
          data: {
            ticket: window.location.href,
          },
          success: function (ress) {
            if(ress) {
              current()
            }else{
              layer.alert('登录验证失败，请重新登录')
            }
          }
        });
      }else{
        toLoginPage()
      }

      function current(){
        $.ajax({
          url: '/sso/yunCurrent',
          type: "GET",
          dataType: "json",
          success: function (ress) {
            if (!ress.userInfoData.name) {
              toLoginPage()
            } else {
              userData = ress.userInfoData;

              PC.init(userData);
            }
            tools.init();
          }
        });
      }

      function toLoginPage(){
        if(window.location.origin !== 'https://ocss.ctyun.cn'){
          location.href =
          "https://wwwtest.ctyun.cn:21443/cas/login?service=" + encodeURIComponent(window.location.origin + '/ucfront/uc_channel_access/webchat/pages/robot.html');
        }else{
          location.href =
          "https://www.ctyun.cn/cas/login?service=" + encodeURIComponent(window.location.origin + '/ucfront/uc_channel_access/webchat/pages/robot.html');
        }
      }

      //点击转自助-后退到机器人页面
      $("#myframe").on("load", function (event) {//判断 iframe是否加载完成  这一步很重要
        console.log(this.contentWindow)
        $("#goRobot2023", this.contentDocument).click(function () {//添加点击事件
          layer.confirm('<div class="zizhuTitle">确定转自助服务？</div><div class="zizhuContent">感谢您的咨询，希望下次还可以为您服务</div>', {
            btn: ['确认', '取消'], //按钮
            skin:'overHuihuaBox',
            title: '提示'
          }, function (index) {
            console.log('关闭345');
            sessionStorage.setItem( 'refreshMark','1')
            layer.close(index);
            $(".personWarp").hide();
            $('.chat-main').css('visibility', 'visible')
            $(".chat-content").show();
            $(".checkWarp").hide();
            $("#myframe").attr("src", '');
            window.reloadGuess()
          }, function () {
          });
        });

        // 关闭会话
        const iframeWindow = this.contentWindow
        const iframeDoc = this.contentDocument
        $('#closeChat', this.contentDocument).on('click', function(){
            if ($(iframeDoc).find('#closeChat').attr('disabled') || $(iframeDoc).find('.satisfy-box').is(':visible')) {
              return;
            }
            layer.confirm('<div class="zizhuTitle">确认结束会话？</div><div class="zizhuContent">感谢您的咨询，希望下次还可以为您服务</div>', {
              skin:'overHuihuaBox',
              btn: ['确认', '取消'], //按钮
            }, function (index) {
              layer.close(index);
              iframeWindow.OCSMAIN.customerOnDisconnect({
                chatId: $(iframeDoc).find('#chatId').val(),
                targetId: iframeWindow.customerName,
                accessType: iframeWindow.accessType,
                seatName: iframeWindow.fromName,
              });
            }), function (index) {
              layer.close(index);
            }
        });

      });

      $.ajax({
        url: "/oneframe/getGroupProblemList",
        type: "get",
        cache: false,
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        success: function (data) {
          sessionStorage.setItem("groupData", JSON.stringify(data))
        }, error: function (e) {}
      });
    })

    function openTools(link, target, name){
      window.open(link, target);
      $.ajax({
        url: "/sam/hrefStatic/saveTHrefClickStatic",
        data: JSON.stringify({
          customerId: userData.name,
          hrefName: name,
          hrefAddress: link,
          type: 'right'
        }),
        type: "post",
        cache: false,
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        success: function (data) {
          
        }, error: function (e) {}
      });
    }
    $('.helpBox').on('click', 'a', function(){
      $.ajax({
        url: "/sam/hrefStatic/saveTHrefClickStatic",
        data: JSON.stringify({
          customerId: userData.name,
          hrefName: $(this).attr('title'),
          hrefAddress: $(this).attr('href'),
          type: 'right'
        }),
        type: "post",
        cache: false,
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        success: function (data) {
          
        }, error: function (e) {}
      });
    })
    $('#notice-ul').on('click', 'a', function(){
      $.ajax({
        url: "/sam/hrefStatic/saveTHrefClickStatic",
        data: JSON.stringify({
          customerId: userData.name,
          hrefName: $(this).attr('title'),
          hrefAddress: $(this).attr('href'),
          type: 'right'
        }),
        type: "post",
        cache: false,
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        success: function (data) {
          
        }, error: function (e) {}
      });
    })
  </script>
</body>

</html>