<?php
require_once __DIR__ . '/../includes/init.php';
require_once __DIR__ . '/../includes/auth.php';
checkUserAuth();

$pageTitle = __t('support_page_title', '在线客服');
$lang = defined('CURRENT_LANG') ? CURRENT_LANG : 'zh_cn';
$role_id = intval($_SESSION['role_id'] ?? 0);
$is_staff = ($role_id >= 13 && $role_id <= 39) || in_array($role_id, [9,10,11], true);

// 顶部显示“我是谁”
$uid = intval($_SESSION['user_id'] ?? 0);
$stmt = $pdo->prepare("SELECT id, username, nickname, role_id FROM users WHERE id=? LIMIT 1");
$stmt->execute([$uid]);
$me = $stmt->fetch(PDO::FETCH_ASSOC) ?: ['id'=>$uid,'username'=>'','nickname'=>'','role_id'=>$role_id];
$meName = trim((string)($me['nickname'] ?? ''));
if ($meName === '') $meName = trim((string)($me['username'] ?? ''));
$rid = intval($me['role_id'] ?? $role_id);
$meRoleLabel = __t('support_role_member', '会员');
if ($rid >= 13 && $rid <= 39) $meRoleLabel = __t('support_role_team_leader', '团队长');
if (in_array($rid, [9,10,11], true)) $meRoleLabel = __t('support_role_partner', '独立站管理员');

ob_start();
?>
<div class="container" style="max-width:1100px;">
    <div class="card shadow-sm" style="background:#fff;border-radius:14px;">
        <div class="card-header d-flex align-items-center justify-content-between">
            <div class="d-flex align-items-center gap-2" style="font-weight:700;">
                <i class="fas fa-headset me-1"></i><?php echo htmlspecialchars($pageTitle); ?>
                <span class="badge bg-light text-dark" style="border:1px solid #eee;">
                    <?php echo __t('support_current_label', '当前'); ?>：<?php echo htmlspecialchars($meRoleLabel); ?> <?php echo htmlspecialchars($meName); ?> (ID:<?php echo intval($uid); ?>)
                </span>
            </div>
            <div class="d-flex gap-2">
                <a class="btn btn-sm btn-outline-secondary" href="/user/index.php?lang=<?php echo urlencode($lang); ?>" target="_blank" rel="noopener">
                    <i class="fas fa-house me-1"></i><?php echo __t('support_btn_member_home', '会员首页'); ?>
                </a>
                <button class="btn btn-sm btn-outline-primary" type="button" onclick="location.reload();" title="<?php echo htmlspecialchars(__t('support_btn_refresh_title', '刷新页面即可继续会话')); ?>">
                    <i class="fas fa-rotate me-1"></i><?php echo __t('support_btn_refresh', '刷新'); ?>
                </button>
                <?php if ($is_staff): ?>
                    <a class="btn btn-sm btn-outline-primary" target="_blank" rel="noopener" href="/user/support_workbench.php?lang=<?php echo urlencode($lang); ?>">
                        <i class="fas fa-comments me-1"></i><?php echo __t('support_workbench_title', '客服工作台'); ?>
                    </a>
                <?php endif; ?>
                <a class="btn btn-sm btn-outline-secondary" href="/user/faq.php?lang=<?php echo urlencode($lang); ?>" target="_blank">
                    <i class="fas fa-book me-1"></i><?php echo __t('support_faq_btn', '公告/FAQ'); ?>
                </a>
            </div>
        </div>
        <div class="card-body">
            <div class="row g-3">
                <div class="col-md-4">
                    <div class="mb-2 fw-bold"><?php echo __t('support_search_title', '先搜索公告/常见问题'); ?></div>
                    <div class="input-group mb-2">
                        <input id="supportSearchInput" class="form-control" placeholder="<?php echo __t('support_search_placeholder', '输入关键词…'); ?>">
                        <button id="supportSearchBtn" class="btn btn-primary"><?php echo __t('support_search_btn', '搜索'); ?></button>
                    </div>
                    <div id="supportSearchResult" class="list-group" style="max-height:260px;overflow:auto;"></div>
                    <div class="mt-2">
                        <button id="btnAiAnswer" class="btn btn-outline-dark w-100" type="button">
                            <i class="fas fa-robot me-2"></i><?php echo __t('support_ai_answer_btn', 'AI智能解答（基于知识库）'); ?>
                        </button>
                        <div class="small text-muted mt-1">
                            <?php echo __t('support_ai_answer_hint', 'AI将基于公告/FAQ/文档给出建议，并附参考来源；不确定时会建议转人工。'); ?>
                        </div>
                    </div>

                    <hr>
                    <div class="mb-2 fw-bold"><?php echo __t('support_handover_title', '找不到？转人工'); ?></div>
                    <button id="btnToHuman" class="btn btn-success w-100">
                        <i class="fas fa-user-headset me-2"></i><?php echo __t('support_to_human', '转人工客服'); ?>
                    </button>
                    <div class="small text-muted mt-2">
                        <?php echo __t('support_handover_hint', '60秒未选择将自动分配：团队长→独立站→平台客服'); ?>
                    </div>
                    <div id="candidateBox" class="mt-2" style="display:none;">
                        <div class="small fw-bold mb-1"><?php echo __t('support_pick_hint', '请选择在线客服：'); ?></div>
                        <div id="candidateList" class="list-group"></div>
                        <div class="small text-muted mt-2">
                            <span id="autoPickCountdown">60</span>s <?php echo __t('support_auto_pick', '后自动分配'); ?>
                        </div>
                    </div>
                </div>
                <div class="col-md-8">
                    <div class="mb-2 fw-bold"><?php echo __t('support_chat_title', '对话'); ?></div>
                    <div class="alert alert-info py-2" style="font-size:13px;">
                        <?php echo __t('support_tip_reenter', '提示：如果你长时间未操作导致会话结束/退出，想重新进入时 <b>刷新本页面</b> 即可继续（优先由原接待人接待；若超时未回复会自动转给下一位）。'); ?>
                    </div>
                    <div id="chatBox" class="support-chatbox"></div>
                    <div class="input-group mt-2">
                        <input id="chatInput" class="form-control" placeholder="<?php echo __t('support_msg_placeholder', '输入消息…'); ?>">
                        <button id="chatSendBtn" class="btn btn-dark"><?php echo __t('support_send', '发送'); ?></button>
                        <button id="chatUploadBtn" class="btn btn-outline-primary" type="button"><?php echo __t('support_upload', '上传'); ?></button>
                        <button id="chatEndBtn" class="btn btn-outline-danger" type="button" style="display:none;" title="结束当前会话"><?php echo __t('support_end_conversation', '结束会话'); ?></button>
                    </div>
                    <input id="chatFileInput" type="file" style="display:none" />
                    <audio id="supportBeep" preload="auto">
                        <source src="/assets/sound/newmsg.mp3?v=20251224" type="audio/mpeg">
                        <source src="/assets/sound/support_new_message.mp3?v=20251224" type="audio/mpeg">
                        <source src="/assets/sound/notify.mp3" type="audio/mpeg">
                    </audio>
                    <div class="small text-muted mt-1">
                        <?php echo __t('support_sound_hint', '提示：接入成功/收到回复会有声音提示（若浏览器允许）。'); ?>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<style>
:root{
  --neo-bg:#0b1020;
  --neo-border:rgba(0,234,255,.20);
  --neo-grad:linear-gradient(135deg,#00eaff 0%, #0051ff 55%, #7c3aed 100%);
  --neo-user:#22c55e;
  --neo-staff:#3b82f6;
  --neo-system:#f59e0b;
  --neo-ai:#a855f7;
}
.support-chatbox{
  border:1px solid #e9eef5;
  border-radius:14px;
  height:440px;
  overflow:auto;
  padding:14px;
  background:
    radial-gradient(900px 240px at 12% 0%, rgba(0,234,255,.12), transparent 55%),
    radial-gradient(900px 240px at 88% 0%, rgba(124,58,237,.12), transparent 55%),
    linear-gradient(180deg,#f7f9ff 0%, #f5f7fb 100%);
}
.support-msg-row{display:flex;gap:10px;margin:10px 0;align-items:flex-end;}
.support-msg-row.me{justify-content:flex-end;}
.support-avatar{
  width:34px;height:34px;border-radius:999px;
  display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:12px;
  color:#fff;flex:0 0 auto;
  box-shadow:0 6px 18px rgba(0,0,0,.08);
}
.support-avatar.staff{background:linear-gradient(135deg,#111827,#374151);}
.support-avatar.me{background:linear-gradient(135deg,#2563eb,#00a3ff);}
.support-bubble{
  max-width:min(78%, 620px);
  border-radius:14px;
  padding:10px 12px;
  border:1px solid #e9eef5;
  background:#fff;
  box-shadow:0 10px 30px rgba(17,24,39,.06);
}
.support-msg-row.system{justify-content:center;}
.support-msg-row.system .support-avatar{display:none;}
.support-msg-row.system .support-bubble{
  max-width:min(92%, 760px);
  background:rgba(245,158,11,.10);
  border-color:rgba(245,158,11,.35);
  box-shadow:0 10px 30px rgba(245,158,11,.10);
}
.support-msg-row.system .support-meta{color:#92400e;text-align:center;font-weight:800;}
.support-msg-row.staff .support-bubble{border-left:4px solid rgba(59,130,246,.65);}
.support-msg-row.user .support-bubble{border-left:4px solid rgba(34,197,94,.65);}
.support-tag{
  display:inline-flex;align-items:center;gap:6px;
  padding:2px 8px;border-radius:999px;
  font-size:12px;font-weight:800;
  border:1px solid rgba(15,23,42,.10);
  background:rgba(15,23,42,.06);
  margin-right:8px;
}
.support-tag.user{background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.25);color:#166534;}
.support-tag.staff{background:rgba(59,130,246,.12);border-color:rgba(59,130,246,.25);color:#1d4ed8;}
.support-tag.system{background:rgba(245,158,11,.14);border-color:rgba(245,158,11,.25);color:#92400e;}
.support-tag.ai{background:rgba(168,85,247,.14);border-color:rgba(168,85,247,.25);color:#6b21a8;}
.support-meta-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px;}
.support-meta-time{opacity:.85;white-space:nowrap;}
.support-msg-row.me .support-meta-row{justify-content:flex-end;}
.support-msg-row.me .support-tag{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.22);color:#fff;}
.support-msg-row.me .support-bubble{
  background:linear-gradient(135deg,#2563eb,#00a3ff);
  color:#fff;
  border-color:rgba(255,255,255,.18);
}
.support-meta{font-size:12px;color:#6b7280;margin-bottom:6px;}
.support-msg-row.me .support-meta{color:rgba(255,255,255,.85); text-align:right;}
.support-text{font-size:14px;line-height:1.6;white-space:pre-wrap;word-break:break-word;}
.support-trans{
  margin-top:8px;padding-top:8px;
  border-top:1px dashed rgba(107,114,128,.35);
  font-size:13px;line-height:1.6;
  color:#6b7280;
}
.support-msg-row.me .support-trans{color:rgba(255,255,255,.85);border-top-color:rgba(255,255,255,.25);}
.support-file a{font-weight:800;text-decoration:none;}
.support-msg-row.me .support-file a{color:#fff;}
.support-faq-item{
  display:block;
  text-decoration:none;
  color:inherit;
  margin-bottom:8px;
  border-radius:8px;
  border:1px solid #e9eef5;
  padding:10px 12px;
  transition:all 0.2s;
  background:#fff;
}
.support-faq-item:hover{
  text-decoration:none;
  color:inherit;
  background:#f3f4f6;
  border-color:#3b82f6;
  transform:translateX(4px);
  box-shadow:0 2px 8px rgba(59,130,246,0.15);
}
.support-text a{
  color:#3b82f6;
  text-decoration:underline;
}
.support-text a:hover{
  color:#2563eb;
  text-decoration:underline;
}
@media (max-width: 768px){
  .container{padding-left:10px!important;padding-right:10px!important;}
  .support-chatbox{height:62vh;}
  #supportSearchResult{max-height:26vh!important;}
}
</style>

<script>
(() => {
  const lang = <?php echo json_encode($lang); ?>;
  const I18N = <?php echo json_encode([
      'who_platform' => __t('support_who_platform', '平台客服'),
      'who_me' => __t('support_who_me', '我'),
      'who_agent' => __t('support_who_agent', '客服'),
      'avatar_me' => __t('support_avatar_me', '我'),
      'avatar_agent' => __t('support_avatar_agent', '客'),
      'human_title' => __t('support_human_title', '请完整填写要咨询的问题'),
      'human_intro' => __t('support_human_intro', '该问题会自动发送为本会话的第一句，并作为会话标题，便于客服快速定位。'),
      'human_placeholder' => __t('support_human_placeholder', '请描述：发生了什么？需要我们帮你做什么？（建议越具体越好）'),
      'human_cancel' => __t('support_human_cancel', '取消'),
      'human_continue' => __t('support_human_continue', '继续选择人工客服'),
      'human_minlen' => __t('support_human_minlen', '请至少填写 5 个字以上的问题描述。'),
      'submit_failed' => __t('support_submit_failed', '提交失败'),
      'searching' => __t('support_searching', '搜索中…'),
      'no_result' => __t('support_no_result', '未找到，建议转人工或继续换关键词。'),
      'type_admin' => __t('support_type_admin', '平台技术客服'),
      'type_team_leader' => __t('support_type_team_leader', '团队长'),
      'type_partner' => __t('support_type_partner', '独立站管理员'),
      'type_agent' => __t('support_type_agent', '客服'),
      'no_online' => __t('support_no_online', '当前无人在线，可稍后再试或留言（后续版本）。'),
      'connected' => __t('support_connected', '已接入'),
      'connect_failed' => __t('support_connect_failed', '接入失败'),
      'need_search_alert' => __t('support_need_search_alert', '请先搜索公告/常见问题（输入关键词并点击“搜索”），若仍未解决再转人工客服。'),
      'need_conversation' => __t('support_need_conversation', '请先开始会话'),
      'upload_failed' => __t('support_upload_failed', '上传失败'),
      'send_failed' => __t('support_send_failed', '发送失败'),
      'support_end_conversation' => __t('support_end_conversation', '结束会话'),
  ], JSON_UNESCAPED_UNICODE); ?>;
  let conversationId = 0;
  let lastMsgId = 0;
  let es = null;
  let autoTimer = null;
  let countdown = 60;
  let hasSearched = false; // 会员需先搜索公告/FAQ 才允许转人工
  let searchTimer = null;  // 防抖：输入即搜（1个字也出结果）
  // 限制刷屏：仅保留“120秒未回复自动转接”系统消息最近2条
  const autoEscalateNodes = [];

  const $ = (id) => document.getElementById(id);
  const beep = () => { try { $('supportBeep')?.play?.(); } catch(e){} };

  function formatBytes(n){
    n = parseInt(n||0,10) || 0;
    if(n < 1024) return n + 'B';
    if(n < 1024*1024) return (n/1024).toFixed(1) + 'KB';
    if(n < 1024*1024*1024) return (n/1024/1024).toFixed(1) + 'MB';
    return (n/1024/1024/1024).toFixed(1) + 'GB';
  }

  function appendMsg(m){
    const box = $('chatBox');
    const div = document.createElement('div');
    const myUid = <?php echo intval($_SESSION['user_id']); ?>;
    const isMe = (m.sender_actor_type !== 'admin') && (parseInt(m.sender_id,10) === myUid);
    const isSystem = (m.msg_type === 'system') || ((m.sender_actor_type === 'admin') && (parseInt(m.sender_id||0,10) === 0));
    const isAi = (m.msg_type === 'ai');
    const isFile = (m.msg_type === 'file');
    const isStaffMsg = (!isSystem && (m.sender_actor_type === 'admin'));
    const isUserMsg = (!isSystem && !isAi && !isStaffMsg);
    const rowRole = isSystem ? 'system' : (isAi ? 'ai' : (isStaffMsg ? 'staff' : 'user'));
    div.className = 'support-msg-row ' + rowRole + (isMe ? ' me' : '');

    const who = isSystem ? '系统' : (isAi ? 'AI' : (isStaffMsg ? I18N.who_platform : (isMe ? I18N.who_me : I18N.who_agent)));
    const tagClass = isSystem ? 'system' : (isAi ? 'ai' : (isStaffMsg ? 'staff' : 'user'));
    const tagIcon = isSystem ? 'fa-bolt' : (isAi ? 'fa-wand-magic-sparkles' : (isStaffMsg ? 'fa-headset' : 'fa-user'));
    const avatarText = isMe ? escapeHtml(I18N.avatar_me) : (isSystem ? '系' : (isAi ? 'AI' : (isStaffMsg ? escapeHtml(I18N.avatar_agent) : '用')));
    const avatar = `<div class="support-avatar ${isMe ? 'me' : 'staff'}">${avatarText}</div>`;
    let bubbleInner = '';
    if(isFile){
      const mid = parseInt(m.id||0,10) || 0;
      const name = escapeHtml(m.file_name || 'file');
      const mime = String(m.file_mime||'');
      const size = formatBytes(m.file_size||0);
      const url = '/support/file.php?mid=' + mid;
      if(mime.startsWith('image/')){
        bubbleInner = `<div class="support-file">
                        <a href="${url}" target="_blank" rel="noopener">🖼️ ${name} (${size})</a>
                        <div style="margin-top:8px;">
                          <a href="${url}" target="_blank" rel="noopener">
                            <img src="${url}" alt="${name}" style="max-width:100%;border-radius:12px;border:1px solid #e9eef5;">
                          </a>
                        </div>
                      </div>`;
      } else {
        bubbleInner = `<div class="support-file"><a href="${url}" target="_blank" rel="noopener">📎 ${name} (${size})</a></div>`;
      }
    } else {
      let orig = String(m.original_text || '');
      // AI消息类型：允许HTML标签（已由后端安全处理）
      if (isAi) {
        // 确保所有链接都有target="_blank"
        orig = orig.replace(/<a\s+([^>]*?)href=["']([^"']+)["']([^>]*)>/gi, (match, before, url, after) => {
          const attrs = (before + ' ' + after).trim();
          if (!/target\s*=/i.test(attrs)) {
            return `<a href="${url}" target="_blank" rel="noopener" ${attrs}>`;
          }
          return match;
        });
        // 直接使用HTML（AI回答中的链接已由后端生成）
        bubbleInner = `<div class="support-text">${orig}</div>`;
        if (m.translated_text && String(m.translated_text).trim() !== '') {
          bubbleInner += `<div class="support-trans">${escapeHtml(m.translated_text)}</div>`;
        }
      } else {
        // 普通消息：转义HTML，但将URL转换为链接
        // 先处理HTML链接，确保已有链接添加target="_blank"
        orig = orig.replace(/<a\s+([^>]*?)href=["']([^"']+)["']([^>]*)>/gi, (match, before, url, after) => {
          const attrs = (before + ' ' + after).trim();
          if (!/target\s*=/i.test(attrs)) {
            return `<a href="${escapeHtml(url)}" target="_blank" rel="noopener" ${attrs}>`;
          }
          return match;
        });
        // 将纯文本URL转换为链接（包括 /user/faq.php?id=... 格式）
        orig = orig.replace(/(https?:\/\/[^\s<>"']+|\/user\/faq\.php\?id=\d+[^\s<>"']*)/gi, (url) => {
          // 检查是否已经在链接标签内
          const before = orig.substring(0, orig.indexOf(url));
          const after = orig.substring(orig.indexOf(url) + url.length);
          if (/<a\s[^>]*>[\s\S]*$/i.test(before) && /^[\s\S]*<\/a>/i.test(after)) {
            return url; // 已在链接内，不处理
          }
          return `<a href="${escapeHtml(url)}" target="_blank" rel="noopener" style="color:#3b82f6;text-decoration:underline;">${escapeHtml(url)}</a>`;
        });
        // 转义其他HTML（避免XSS）
        const tempDiv = document.createElement('div');
        tempDiv.textContent = orig;
        let escaped = tempDiv.innerHTML;
        // 恢复我们添加的链接（避免被转义）
        escaped = escaped.replace(/&lt;a href="([^"]+)" target="_blank" rel="noopener" style="color:#3b82f6;text-decoration:underline;"&gt;([^&]+)&lt;\/a&gt;/gi, '<a href="$1" target="_blank" rel="noopener" style="color:#3b82f6;text-decoration:underline;">$2</a>');
        // 恢复原有的HTML链接
        escaped = escaped.replace(/&lt;a\s+([^&]+?)href=["']([^"']+)["']([^&]+?)&gt;/gi, '<a $1href="$2"$3>');
        escaped = escaped.replace(/&lt;\/a&gt;/gi, '</a>');
        const tr = (m.translated_text && String(m.translated_text).trim() !== '') ? escapeHtml(m.translated_text) : '';
        bubbleInner = `<div class="support-text">${escaped}</div>` + (tr ? `<div class="support-trans">${tr}</div>` : '');
      }
    }

    const meta = `<div class="support-meta-row">
                    <div class="support-meta-left">
                      <span class="support-tag ${tagClass}"><i class="fa ${tagIcon}"></i>${escapeHtml(who)}</span>
                    </div>
                    <div class="support-meta-time">${escapeHtml(m.created_at || '')}</div>
                  </div>`;
    const bubble = `<div class="support-bubble">${meta}${bubbleInner}</div>`;
    div.innerHTML = isMe ? (bubble + avatar) : (avatar + bubble);
    box.appendChild(div);
    // 仅对“自动转接的系统提示”做限量展示（保留最后2条）
    try {
      // 注意：不同版本可能会把这类记录写成 system/text，sender_id 也可能是管理员ID
      // 因此这里仅按文本特征识别，避免会员端刷屏
      const txt = String(m.original_text || '');
      const isAutoEsc = /120\s*秒未回复/.test(txt) && /已自动转给/.test(txt) && /(系统：|系统:)/.test(txt);
      if (isAutoEsc) {
        autoEscalateNodes.push(div);
        while (autoEscalateNodes.length > 2) {
          const old = autoEscalateNodes.shift();
          if (old && old.parentNode) old.parentNode.removeChild(old);
        }
      }
    } catch(e) {}
    box.scrollTop = box.scrollHeight;
    lastMsgId = Math.max(lastMsgId, parseInt(m.id,10) || 0);
  }

  function escapeHtml(s){
    return String(s).replace(/[&<>"']/g, (c)=>({ '&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;' }[c]));
  }

  async function api(action, data){
    const form = new URLSearchParams();
    form.set('action', action);
    for(const k in data){ form.set(k, data[k]); }
    const res = await fetch('/user/support_api.php?lang='+encodeURIComponent(lang), {
      method:'POST',
      headers:{'Content-Type':'application/x-www-form-urlencoded'},
      body: form.toString()
    });
    return await res.json();
  }

  // ===== 发起人工：问题弹窗（不依赖bootstrap.js） =====
  function ensureHumanModal(){
    if(document.getElementById('humanQuestionModal')) return;
    const wrap = document.createElement('div');
    wrap.id = 'humanQuestionModal';
    wrap.style.cssText = 'position:fixed;left:0;top:0;right:0;bottom:0;z-index:99999;display:none;background:rgba(0,0,0,.45);';
    wrap.innerHTML = `
      <div style="max-width:640px;margin:8vh auto;background:#fff;border-radius:14px;box-shadow:0 20px 60px rgba(0,0,0,.22);padding:14px;">
        <div style="font-weight:800;font-size:16px;margin-bottom:8px;">${escapeHtml(I18N.human_title)}</div>
        <div class="small text-muted" style="margin-bottom:8px;">${escapeHtml(I18N.human_intro)}</div>
        <textarea id="humanQuestionText" class="form-control" rows="5" placeholder="${escapeHtml(I18N.human_placeholder)}"></textarea>
        <div class="d-flex justify-content-end gap-2" style="margin-top:10px;">
          <button id="humanQuestionCancel" class="btn btn-outline-secondary" type="button">${escapeHtml(I18N.human_cancel)}</button>
          <button id="humanQuestionOk" class="btn btn-primary" type="button">${escapeHtml(I18N.human_continue)}</button>
        </div>
      </div>
    `;
    document.body.appendChild(wrap);
    wrap.addEventListener('click', (e)=>{ if(e.target === wrap) closeHumanQuestionModal(); });
    document.getElementById('humanQuestionCancel').addEventListener('click', closeHumanQuestionModal);
    document.getElementById('humanQuestionOk').addEventListener('click', submitHumanQuestion);
  }

  function openHumanQuestionModal(){
    ensureHumanModal();
    const m = document.getElementById('humanQuestionModal');
    m.style.display = 'block';
    const ta = document.getElementById('humanQuestionText');
    try { ta.focus(); } catch(e){}
  }
  // 暴露到全局作用域，供AI回答中的链接调用
  window.openHumanQuestionModal = openHumanQuestionModal;
  function closeHumanQuestionModal(){
    const m = document.getElementById('humanQuestionModal');
    if(m) m.style.display = 'none';
  }
  async function submitHumanQuestion(){
    const ta = document.getElementById('humanQuestionText');
    const q = (ta ? ta.value : '').trim();
    if(q.length < 5){
      alert(I18N.human_minlen);
      try { ta.focus(); } catch(e){}
      return;
    }
    if(!conversationId){ await startConversation(); }
    const res = await api('human_request', { conversation_id: conversationId, question: q });
    if(!res.success){
      alert(res.msg || I18N.submit_failed);
      return;
    }
    if(res.conversation_id && parseInt(res.conversation_id,10) > 0){
      conversationId = parseInt(res.conversation_id,10);
      // 重启stream，确保马上能看到“第一句”
      startStream();
    }
    closeHumanQuestionModal();
    // 进入候选选择
    loadCandidates();
  }

  async function startConversation(){
    const res = await api('conversation_start', {});
    if(res.success){ 
      conversationId = res.conversation_id; 
      startStream();
      // 显示结束会话按钮
      const endBtn = $('chatEndBtn');
      if (endBtn) endBtn.style.display = '';
    }
  }
  
  // 结束会话
  async function endConversation(){
    if(!conversationId){ alert('没有正在进行的会话'); return; }
    if(!confirm('确定要结束当前会话吗？结束后将无法继续发送消息。')) return;
    
    const res = await api('end_conversation', {conversation_id: conversationId});
    if(res.success){
      alert('会话已结束');
      conversationId = 0;
      const endBtn = $('chatEndBtn');
      if (endBtn) endBtn.style.display = 'none';
      // 停止消息流
      if(es) try { es.close(); } catch(e){}
      es = null;
      // 清空聊天框
      $('chatBox').innerHTML = '';
    } else {
      alert(res.msg || '结束会话失败');
    }
  }
  
  // 绑定结束会话按钮
  const endBtn = $('chatEndBtn');
  if (endBtn) {
    endBtn.addEventListener('click', endConversation);
  }

  function startStream(){
    if(es) try { es.close(); } catch(e){}
    es = new EventSource('/user/support_api.php?action=stream&lang='+encodeURIComponent(lang)+'&last_id='+lastMsgId);
    es.addEventListener('message', (ev) => {
      try {
        const m = JSON.parse(ev.data);
        // 只展示当前会话
        if(parseInt(m.conversation_id,10) === conversationId){
          appendMsg(m);
          if(m.sender_id !== <?php echo intval($_SESSION['user_id']); ?>) beep();
        }
      } catch(e){}
    });
    es.addEventListener('ping', ()=>{});
  }

  $('chatSendBtn').addEventListener('click', async ()=>{
    const text = $('chatInput').value.trim();
    if(!text || !conversationId) return;
    $('chatInput').value = '';
    const res = await api('send', {conversation_id: conversationId, text});
    if(!res.success){ alert(res.msg || I18N.send_failed); }
  });

  // 上传文件
  async function uploadFile(f){
    if(!f) return;
    if(!conversationId){ alert(I18N.need_conversation); return; }
    
    try {
      const fd = new FormData();
      fd.append('conversation_id', String(conversationId));
      fd.append('file', f);
      
      const res = await fetch('/user/support_upload.php?lang='+encodeURIComponent(lang), { method:'POST', body: fd, credentials:'same-origin' });
      let data = {};
      try { data = await res.json(); } catch (e) { data = {}; }
      if(!data.success){
        alert(data.msg || I18N.upload_failed);
        if (data.interfere_nag && window.GGAI_INTERFERE_NAG && typeof window.GGAI_INTERFERE_NAG.applyFromServer === 'function') {
          window.GGAI_INTERFERE_NAG.applyFromServer(data.interfere_nag);
        }
        console.error('上传失败:', data);
      } else {
        console.log('上传成功:', data);
      }
    } catch(error) {
      console.error('上传文件时出错:', error);
      alert('上传失败: ' + (error.message || '网络错误'));
    }
  }

  $('chatUploadBtn').addEventListener('click', ()=>{
    if(!conversationId){ alert('请先开始会话'); return; }
    const fileInput = $('chatFileInput');
    if (!fileInput) {
      console.error('文件输入框不存在');
      alert('文件上传功能异常，请刷新页面重试');
      return;
    }
    fileInput.click();
  });
  $('chatFileInput').addEventListener('change', async ()=>{
    const fileInput = $('chatFileInput');
    const f = fileInput.files && fileInput.files[0];
    if (!f) {
      console.log('未选择文件');
      return;
    }
    fileInput.value = ''; // 清空，允许重复选择同一文件
    console.log('开始上传文件:', f.name, f.size);
    await uploadFile(f);
  });

  // 拖拽上传（把文件拖到聊天框即可）
  (function bindDragDrop(){
    const box = $('chatBox');
    if(!box) return;
    let dragDepth = 0;
    function setHint(on){
      box.style.outline = on ? '2px dashed #0051ff' : '';
      box.style.outlineOffset = on ? '4px' : '';
      box.style.background = on ? '#eef6ff' : '#fafafa';
    }
    ['dragenter','dragover','dragleave','drop'].forEach(evt=>{
      box.addEventListener(evt, function(e){ e.preventDefault(); e.stopPropagation(); });
    });
    box.addEventListener('dragenter', function(){
      dragDepth++;
      setHint(true);
    });
    box.addEventListener('dragleave', function(){
      dragDepth = Math.max(0, dragDepth - 1);
      if(dragDepth === 0) setHint(false);
    });
    box.addEventListener('drop', async function(e){
      dragDepth = 0;
      setHint(false);
      const files = (e.dataTransfer && e.dataTransfer.files) ? Array.from(e.dataTransfer.files) : [];
      if(files.length === 0) return;
      for(const f of files){
        // 逐个上传，避免并发太多
        await uploadFile(f);
      }
    });
  })();

  async function doSearch(){
    const q = $('supportSearchInput').value.trim();
    const box = $('supportSearchResult');
    if(!q){
      box.innerHTML = '';
      return;
    }
    hasSearched = true; // 任意一次搜索（含自动联想）都算“已搜索”
    box.innerHTML = '<div class="text-muted small">' + escapeHtml(I18N.searching) + '</div>';
    const res = await fetch('/user/support_api.php?action=search&lang='+encodeURIComponent(lang)+'&q='+encodeURIComponent(q));
    const data = await res.json();
    box.innerHTML = '';
    (data.items||[]).forEach((it, idx)=>{
      const a = document.createElement('a');
      a.className = 'list-group-item list-group-item-action support-faq-item';
      a.target = '_blank';
      a.href = it.url;
      a.style.cssText = 'margin-bottom:8px;border-radius:8px;border:1px solid #e9eef5;padding:10px 12px;transition:all 0.2s;';
      a.innerHTML = `<div style="font-weight:600;color:#1f2937;margin-bottom:4px;">${escapeHtml(it.title)}</div><div style="font-size:12px;color:#6b7280;"><span class="badge bg-info" style="font-size:11px;">${escapeHtml(it.type === 'notice' ? '公告' : (it.type === 'faq' ? '常见问题' : '文档'))}</span></div>`;
      a.addEventListener('mouseenter', function(){ this.style.background='#f3f4f6'; this.style.borderColor='#3b82f6'; this.style.transform='translateX(4px)'; });
      a.addEventListener('mouseleave', function(){ this.style.background=''; this.style.borderColor='#e9eef5'; this.style.transform=''; });
      box.appendChild(a);
    });
    if((data.items||[]).length === 0){
      const d = document.createElement('div');
      d.className = 'text-muted small';
      d.innerText = I18N.no_result;
      box.appendChild(d);
    }
  }

  $('supportSearchBtn').addEventListener('click', doSearch);
  // 回车搜索
  $('supportSearchInput').addEventListener('keydown', (e)=>{
    if(e.key === 'Enter'){
      e.preventDefault();
      doSearch();
    }
  });

  // 输入即联想（1个字也触发，300ms防抖）
  $('supportSearchInput').addEventListener('input', ()=>{
    if(searchTimer) clearTimeout(searchTimer);
    searchTimer = setTimeout(()=>{ doSearch(); }, 300);
  });

  // AI智能解答：基于公告/FAQ/文档检索结果组织回答（并写入会话）
  $('btnAiAnswer')?.addEventListener('click', async ()=>{
    const q = ($('supportSearchInput')?.value || '').trim();
    if(!hasSearched || !q){
      alert(I18N.need_search_alert);
      try { $('supportSearchInput').focus(); } catch(e) {}
      return;
    }
    if(!conversationId){ await startConversation(); }
    const res = await api('ai_answer', { conversation_id: conversationId, q: q });
    if(!res.success){
      alert(res.msg || 'AI解答失败');
      return;
    }
    if(res.message){ appendMsg(res.message); }
  });

  async function loadCandidates(){
    const res = await fetch('/user/support_api.php?action=candidates&lang='+encodeURIComponent(lang));
    const data = await res.json();
    const list = $('candidateList');
    list.innerHTML = '';
    (data.candidates||[]).forEach(c=>{
      const typeLabel = (c.type === 'admin')
        ? I18N.type_admin
        : (c.type === 'team_leader')
          ? I18N.type_team_leader
          : (c.type === 'partner')
            ? I18N.type_partner
            : I18N.type_agent;
      const btn = document.createElement('button');
      btn.className = 'list-group-item list-group-item-action';
      // 接待人员ID保密：前端不展示ID
      btn.innerText = `${typeLabel}：${c.name}`;
      btn.onclick = ()=> pick(c);
      list.appendChild(btn);
    });
    $('candidateBox').style.display = 'block';
    if((data.candidates||[]).length === 0){
      const d = document.createElement('div');
      d.className = 'text-muted small mt-2';
      d.innerText = I18N.no_online;
      list.appendChild(d);
    }
    countdown = 60;
    $('autoPickCountdown').innerText = String(countdown);
    if(autoTimer) clearInterval(autoTimer);
    autoTimer = setInterval(async ()=>{
      countdown--;
      $('autoPickCountdown').innerText = String(countdown);
      if(countdown <= 0){
        clearInterval(autoTimer);
        // 自动分配：按候选顺序（后端已按优先级拼装，这里取第一个）
        const first = (data.candidates||[])[0];
        if(first) pick(first);
      }
    }, 1000);
  }

  async function pick(c){
    if(!conversationId){ await startConversation(); }
    const res = await api('assign', {
      conversation_id: conversationId,
      to_actor_type: c.actor_type,
      to_type: c.type,
      to_id: c.id
    });
    if(res.success){
      beep();
      alert(I18N.connected + '：' + c.name);
      $('candidateBox').style.display = 'none';
      if(autoTimer) clearInterval(autoTimer);
    } else {
      alert(res.msg || I18N.connect_failed);
    }
  }

  $('btnToHuman').addEventListener('click', ()=>{
    if(!hasSearched){
      alert(I18N.need_search_alert);
      try { $('supportSearchInput').focus(); } catch(e) {}
      return;
    }
    // 发起人工：必须先填写问题，并自动作为会话第一句+会话标题
    openHumanQuestionModal();
  });
  startConversation();
})();
</script>
<?php
$pageContent = ob_get_clean();
require_once __DIR__ . '/includes/layout.php';


