码桶

发现社区成员的开源项目
DMFish / 简约米表-静态部署版公开
contact.html3.7 KB
<!DOCTYPE html>
<html lang="zh-Hant">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>聯絡我們 | Contact Us</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>

<button class="nav-toggle" onclick="var s=document.querySelector('.sidebar');s.classList.toggle('sidebar-open');this.querySelector('.hamburger').textContent=s.classList.contains('sidebar-open')?'✕':'☰';"><span class="hamburger">☰</span> 菜單</button>

<table class="main-table">
  <tr>
    <!-- 側邊導航 -->
    <td class="sidebar">
      <a class="nav-btn" href="index.html">域名</a>
      <a class="nav-btn" href="admin.html">管理後台</a>
      <a class="nav-btn active" href="contact.html">聯絡我們</a>
    </td>

    <!-- 主內容區 -->
    <td class="content">

      <!-- 標題區 -->
      <table style="width:100%;max-width:600px;margin:0 auto;" border="0">
        <tr>
          <td>
            <p class="title-en" id="contactTitleEn"></p>
            <p class="title-zh" id="contactTitleZh"></p>
            <div style="height:20px;"></div>

            <!-- 聯絡內容 -->
            <div id="contactContent"></div>

          </td>
        </tr>
      </table>

    </td>
  </tr>
</table>

<script src="js/sync.js"></script>
<script src="js/data.js"></script>
<script>
(async function() {
  await DataSync.init();
  const cfg = SiteConfig.get();

  // 標題
  document.getElementById('contactTitleEn').textContent = cfg.contactTitleEn;
  document.getElementById('contactTitleZh').textContent = cfg.contactTitleZh;

  // 聯絡內容
  const waText = encodeURIComponent('購買domain');
  const waLink = cfg.whatsappNumber
    ? `https://api.whatsapp.com/send?phone=${cfg.whatsappNumber}&text=${waText}`
    : '';

  let html = '';

  // 引言
  html += `<p class="intro-text">${cfg.contactIntro}</p>`;
  html += '<div style="height:15px;"></div>';

  // 聯絡人
  html += '<div style="font-size:16px;line-height:2.2;">';

  html += `<p>聯絡人︰<strong style="color:#990000;">${cfg.contactPerson}</strong>`;
  if (waLink) {
    html += ` <a href="${waLink}" target="_blank"><img src="https://www.hotelhk.com/images/icons/whaticon.png" class="whatsapp-icon" alt="WhatsApp"></a>`;
  }
  if (cfg.contactPerson2) {
    html += ` 或 <strong style="color:#990000;">${cfg.contactPerson2}</strong>`;
    if (cfg.contactPhone) {
      html += ` (電話: ${cfg.contactPhone})`;
    }
  }
  html += '</p>';

  // 電郵
  if (cfg.email1 || cfg.email2) {
    html += '<p>電 郵︰';
    if (cfg.email1) {
      html += `<a href="mailto:${cfg.email1}">${cfg.email1}</a>`;
    }
    if (cfg.email1 && cfg.email2) {
      html += ' 或 ';
    }
    if (cfg.email2) {
      html += `<a href="mailto:${cfg.email2}">${cfg.email2}</a>`;
    }
    html += '</p>';
  }

  // WhatsApp 號碼
  if (cfg.whatsappNumber) {
    html += `<p>WhatsApp︰<a href="${waLink}" target="_blank">${cfg.whatsappNumber}</a></p>`;
  }

  // 微信
  if (cfg.wechatId) {
    html += `<p>微信 ID︰<strong>${cfg.wechatId}</strong></p>`;
  }

  // Telegram
  if (cfg.telegramId) {
    html += `<p>Telegram︰<a href="https://t.me/${cfg.telegramId}" target="_blank">@${cfg.telegramId}</a></p>`;
  }

  // 地址
  if (cfg.address) {
    html += `<p>地址︰${cfg.address}</p>`;
  }

  // 營業時間
  if (cfg.businessHours) {
    html += `<p>營業時間︰${cfg.businessHours}</p>`;
  }

  html += '</div>';

  // 補充空白（保持與原站一致的頁面高度感）
  html += '<div style="height:120px;"></div>';

  document.getElementById('contactContent').innerHTML = html;
})();
</script>
</body>
</html>