Merge branch 'milestone-20251013-宣传夺宝奇兵' into dev

2 months ago · 02d0308cde
1 changed files with 474 additions and 424 deletions
--- a/hcdbqb-management.html
+++ b/hcdbqb-management.html
@ -1,5 +1,6 @@
 <!DOCTYPE html>
 <html lang="zh-CN">
+
 <head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width,initial-scale=1" />
@ -11,6 +12,7 @@
      background: #f7f8fb;
      color: #222;
    }
+
    .card {
      background: #fff;
      padding: 16px;
@ -18,11 +20,13 @@
      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
      margin: auto;
    }
+
    table {
      width: 100%;
      border-collapse: collapse;
      margin-top: 12px;
    }
+
    th,
    td {
      padding: 10px 12px;
@ -30,16 +34,19 @@
      text-align: left;
      font-size: 14px;
    }
+
    th {
      background: #fafafa;
      font-weight: 600;
    }
+
    .controls {
      display: flex;
      gap: 12px;
      align-items: center;
      flex-wrap: wrap;
    }
+
    .pagination {
      display: flex;
      gap: 6px;
@ -47,6 +54,7 @@
      margin-left: auto;
      flex-wrap: wrap;
    }
+
    .btn {
      padding: 6px 10px;
      border-radius: 6px;
@ -55,54 +63,71 @@
      cursor: pointer;
      user-select: none;
    }
+
    .btn:disabled {
      opacity: 0.5;
      cursor: default;
    }
+
    .btn.primary {
      background: #007bff;
      color: #fff;
      border-color: #007bff;
    }
+
+    .btn.whatsapp {
+      background: #25D366;
+      color: #fff;
+      border-color: #25D366;
+    }
+
    .status-btn {
      padding: 4px 8px;
      border-radius: 6px;
      border: 1px solid #ccc;
      cursor: pointer;
    }
+
    .status-0 {
      background: red;
      color: #fff;
    }
+
    .status-1 {
      background: #2f9e44;
      color: #fff;
      border-color: #2f9e44;
    }
+
    .btn.active {
      background: #007bff;
      color: #fff;
      border-color: #007bff;
    }
+
    select,
    input[type="number"] {
      padding: 6px;
      border-radius: 6px;
      border: 1px solid #ddd;
    }
+
    .small {
      font-size: 13px;
      color: #666;
    }
+
    @media (max-width: 640px) {
      .controls {
        flex-direction: column;
        align-items: flex-start;
      }
+
      .pagination {
        margin-left: 0;
      }
    }
+
    #noteModal {
      display: none;
      position: fixed;
@ -112,6 +137,7 @@
      justify-content: center;
      z-index: 9999;
    }
+
    #noteModal .dialog {
      background: #fff;
      padding: 16px;
@ -120,6 +146,7 @@
      max-width: 520px;
      box-sizing: border-box;
    }
+
    #noteModal textarea {
      width: 100%;
      min-width: 60%;
@ -131,6 +158,7 @@
      border: 1px solid #ddd;
      font-size: 14px;
    }
+
    .toast {
      position: fixed;
      top: -20px;
@ -147,16 +175,19 @@
      z-index: 10000;
      pointer-events: none;
    }
+
    .toast.show {
      opacity: 1;
      top: 20px;
    }
+
    table th,
    table td {
      text-align: center;
    }
  </style>
 </head>
+
 <body>
  <div class="card">
    <table aria-describedby="tableDesc">
@ -164,6 +195,7 @@
        <tr>
          <th style="width: 40px">#</th>
          <th style="width: 100px">姓名</th>
+          <th style="width: 100px">WhatsApp</th>
          <th style="width: 90px">国家/地区代码</th>
          <th style="width: 120px">电话号码</th>
          <th style="width: 120px">微信ID</th>
@ -196,19 +228,13 @@
    <div id="noteModal">
      <div class="dialog">
        <h3 style="margin: 0 0 8px">编辑备注</h3>
-          <textarea
-            id="noteTextarea"
-            rows="6"
-            placeholder="输入备注..."
-          ></textarea>
-          <div
-            style="
+        <textarea id="noteTextarea" rows="6" placeholder="输入备注..."></textarea>
+        <div style="
              margin-top: 10px;
              display: flex;
              justify-content: flex-end;
              gap: 8px;
-            "
-          >
+            ">
          <button class="btn" id="noteCancelBtn">取消</button>
          <button class="btn primary" id="noteSaveBtn">保存</button>
        </div>
@ -274,24 +300,30 @@
          const serial = startIndex + idx + 1;
          const statusClass = item.isRelated ? "status-1" : "status-0";
          const statusText = item.isRelated ? "已联系" : "未联系";
+
+          // 构建WhatsApp链接
+          const whatsappPhone = (item.code || '') + (item.telephone || '');
+          const whatsappUrl = `https://api.whatsapp.com/send?phone=${encodeURIComponent(whatsappPhone)}&text=${encodeURIComponent('hello欢迎来到赢在美股')}`;
+
          return `
        <tr>
            <td>${serial}</td>
            <td>${escapeHtml(item.name || "")}</td>
+            <td>
+              <button class="btn whatsapp" data-action="whatsapp" data-id="${item.id}">WhatsApp</button>
+            </td>
            <td>${escapeHtml(item.code || "")}</td>
            <td>${escapeHtml(item.telephone || "")}</td>
            <td>${escapeHtml(item.wechat || "")}</td>
            <td>${escapeHtml(item.email || "")}</td>
            <td>${escapeHtml(item.createdAt || "")}</td>
            <td>
-              <button class="status-btn ${statusClass}" data-action="toggle" data-id="${
-              item.id
+              <button class="status-btn ${statusClass}" data-action="toggle" data-id="${item.id
            }">${statusText}</button>
            </td>
            <td>${escapeHtml(item.note || "")}</td>
             <td>
-              <button class="btn" data-action="editNote" data-id="${
-                item.id
+              <button class="btn" data-action="editNote" data-id="${item.id
            }">编辑备注</button>
            </td>
        </tr>
@ -302,6 +334,14 @@
    }

    tableBody.addEventListener("click", async (e) => {
+      // WhatsApp跳转
+      const whatsappBtn = e.target.closest('[data-action="whatsapp"]');
+      if (whatsappBtn) {
+        const id = whatsappBtn.getAttribute("data-id");
+        handleWhatsApp(id);
+        return;
+      }
+
      // 切换状态
      const toggler = e.target.closest('[data-action="toggle"]');
      if (toggler) {
@ -317,6 +357,18 @@
        return;
      }
    });
+
+    // ---------- WhatsApp跳转 ----------
+    function handleWhatsApp(id) {
+      const item = state.items.find((it) => String(it.id) === String(id));
+      if (!item) return;
+
+      const whatsappPhone = (item.code || '') + (item.telephone || '');
+      const whatsappUrl = `https://api.whatsapp.com/send?phone=${encodeURIComponent(whatsappPhone)}&text=${encodeURIComponent('hello欢迎来到赢在美股')}`;
+
+      window.open(whatsappUrl, '_blank');
+    }
+
    // ---------- 切换联系状态 ----------
    async function handleToggle(id, btnEl) {
      const item = state.items.find((it) => String(it.id) === String(id));
@ -389,20 +441,17 @@
      const pages = buildPageList(current, totalPages, 2);

      let html = "";
-        html += `<button class="btn" data-action="prev" ${
-          current === 1 ? "disabled" : ""
+      html += `<button class="btn" data-action="prev" ${current === 1 ? "disabled" : ""
        }>上一页</button>`;
      pages.forEach((p) => {
        if (p === "...") {
          html += `<span class="small" style="padding:6px 8px">...</span>`;
        } else {
-            html += `<button class="btn ${
-              p === current ? "active" : ""
+          html += `<button class="btn ${p === current ? "active" : ""
            }" data-page="${p}">${p}</button>`;
        }
      });
-        html += `<button class="btn" data-action="next" ${
-          current === totalPages ? "disabled" : ""
+      html += `<button class="btn" data-action="next" ${current === totalPages ? "disabled" : ""
        }>下一页</button>`;

      paginationEl.innerHTML = html;
@ -478,4 +527,5 @@
    update();
  </script>
 </body>
+
 </html>