pricing.html 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205
  1. <!DOCTYPE html>
  2. <html lang="vi">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>Pricing — DoTouch.AI</title>
  7. <link rel="stylesheet" href="style.css">
  8. </head>
  9. <body>
  10. <div class="dev-note" id="demoLoginBanner" style="bottom:56px;"></div>
  11. <div class="dev-note">v1.1.0 · 定价页(USD + VND 双币种)</div>
  12. <header>
  13. <div class="wrap nav">
  14. <a class="nav-logo" href="index.html">
  15. <svg viewBox="0 0 460 120" xmlns="http://www.w3.org/2000/svg">
  16. <defs><linearGradient id="g1" x1="0" y1="0" x2="1" y2="1"><stop offset="0" stop-color="#9B7BFF"/><stop offset="1" stop-color="#5C3DF0"/></linearGradient></defs>
  17. <g transform="translate(0,6) scale(0.92)"><circle cx="50" cy="50" r="33" stroke="rgba(124,92,255,.3)" stroke-width="1.5" stroke-dasharray="2 7" fill="none"/><g stroke="#00E5A0" stroke-width="1.8" opacity=".55"><line x1="50" y1="50" x2="76" y2="26"/><line x1="50" y1="50" x2="26" y2="76"/><line x1="50" y1="50" x2="78" y2="75"/></g><circle cx="50" cy="50" r="12" stroke="rgba(124,92,255,.4)" fill="none"/><circle cx="50" cy="50" r="7.5" fill="url(#g1)"/><circle cx="76" cy="26" r="4" fill="#00E5A0"/><circle cx="26" cy="76" r="4" fill="#00E5A0"/><circle cx="78" cy="75" r="4" fill="#00E5A0"/></g>
  18. <text x="128" y="78" font-size="50" font-weight="700" fill="#E8ECF8" font-family="inherit">DoTouch</text><text x="348" y="78" font-size="50" font-weight="700" fill="url(#g1)" font-family="inherit">.AI</text>
  19. </svg>
  20. </a>
  21. <nav class="nav-links">
  22. <a href="index.html" data-i18n="nav_home">Trang chủ</a>
  23. <a href="models.html" data-i18n="nav_models">Models</a>
  24. <a href="pricing.html" class="active" data-i18n="nav_pricing">Pricing</a>
  25. <a href="docs.html" data-i18n="nav_docs_ops">Hướng dẫn</a>
  26. <a href="../console-v1.0.0/user-console.html" data-i18n="nav_console">Console</a>
  27. </nav>
  28. <div class="nav-right">
  29. <div class="lang-switch">
  30. <button class="lang-btn active" data-lang="vi">VI</button><button class="lang-btn" data-lang="en">EN</button><button class="lang-btn" data-lang="zh-CN">简</button><button class="lang-btn" data-lang="zh-TW">繁</button>
  31. </div>
  32. <a class="btn btn-sm" href="#" data-open-auth="login" data-i18n="nav_login">Đăng nhập</a>
  33. <a class="btn btn-primary btn-sm" href="#" data-open-auth="register" data-i18n="nav_signup">Bắt đầu</a>
  34. </div>
  35. </div>
  36. </header>
  37. <div class="wrap">
  38. <div class="crumbs"><a href="index.html" data-i18n="crumb_home">Trang chủ</a><span class="sep">/</span><span data-i18n="nav_pricing">Bảng giá</span></div>
  39. <div class="page-hero">
  40. <h1 data-i18n="price_h1">Bảng giá</h1>
  41. <p data-i18n="price_sub">Tất cả giá đã bằng giá cực kỳ cạnh tranh. Hiển thị USD và VND theo tỷ giá hiện tại.</p>
  42. </div>
  43. <!-- 汇率提示 -->
  44. <div class="rate-box" data-i18n="rate_note">Tỷ giá tham khảo: 1 USD ≈ 25.400₫ (tự động cập nhật khi nạp tiền)</div>
  45. <!-- 完整价格表 -->
  46. <section>
  47. <div class="table-wrap">
  48. <table class="data">
  49. <thead>
  50. <tr>
  51. <th data-i18n="price_th_model">Mô hình</th>
  52. <th data-i18n="price_th_in">Đầu vào / 1M</th>
  53. <th data-i18n="price_th_out">Đầu ra / 1M</th>
  54. <th data-i18n="price_th_save">Tiết kiệm</th>
  55. </tr>
  56. </thead>
  57. <tbody>
  58. <tr style="cursor:pointer;" onclick="location.href='model-detail.html?m=glm-5.2'">
  59. <td><b>GLM 5.2</b> <span class="tag tag-purple" data-i18n="tag_flagship">Cao cấp</span></td>
  60. <td class="price"><span class="price-usd" data-usd="0.98">$0.98</span> <span class="cut"><span class="price-usd" data-usd="1.40">$1.40</span></span></td>
  61. <td class="price"><span class="price-usd" data-usd="3.08">$3.08</span> <span class="cut"><span class="price-usd" data-usd="4.40">$4.40</span></span></td>
  62. <td><span class="save-tag">-30%</span></td>
  63. </tr>
  64. <tr style="cursor:pointer;" onclick="location.href='model-detail.html?m=deepseek-v4'">
  65. <td><b>DeepSeek V4</b> <span class="tag tag-green" data-i18n="tag_best">Đáng giá</span></td>
  66. <td class="price"><span class="price-usd" data-usd="0.14">$0.14</span> <span class="cut"><span class="price-usd" data-usd="0.20">$0.20</span></span></td>
  67. <td class="price"><span class="price-usd" data-usd="0.28">$0.28</span> <span class="cut"><span class="price-usd" data-usd="0.40">$0.40</span></span></td>
  68. <td><span class="save-tag">-30%</span></td>
  69. </tr>
  70. <tr style="cursor:pointer;" onclick="location.href='model-detail.html?m=deepseek-v4-pro'">
  71. <td><b>DeepSeek V4 Pro</b> <span class="tag tag-gold" data-i18n="tag_reasoning">Suy luận</span></td>
  72. <td class="price"><span class="price-usd" data-usd="0.30">$0.30</span> <span class="cut"><span class="price-usd" data-usd="0.43">$0.43</span></span></td>
  73. <td class="price"><span class="price-usd" data-usd="0.60">$0.60</span> <span class="cut"><span class="price-usd" data-usd="0.86">$0.86</span></span></td>
  74. <td><span class="save-tag">-30%</span></td>
  75. </tr>
  76. <tr style="cursor:pointer;" onclick="location.href='model-detail.html?m=qwen-max'">
  77. <td><b>Qwen Max</b> <span class="tag tag-gray" data-i18n="tag_enterprise">Doanh nghiệp</span></td>
  78. <td class="price"><span class="price-usd" data-usd="1.96">$1.96</span> <span class="cut"><span class="price-usd" data-usd="2.80">$2.80</span></span></td>
  79. <td class="price"><span class="price-usd" data-usd="7.84">$7.84</span> <span class="cut"><span class="price-usd" data-usd="11.20">$11.20</span></span></td>
  80. <td><span class="save-tag">-30%</span></td>
  81. </tr>
  82. </tbody>
  83. </table>
  84. </div>
  85. <p style="color:var(--muted);font-size:12.5px;margin-top:10px;" data-i18n="price_note">* Giá đang là tạm tính, chờ xác nhận giá DashScope × 0.7.</p>
  86. <a href="pricing-full.html" style="display:inline-block;margin-top:14px;font-size:14px;color:var(--purple-l);font-weight:600;">📚 Xem toàn bộ 236 mô hình & giá → (Model Catalog)</a>
  87. </section>
  88. <!-- 扣费规则 -->
  89. <section>
  90. <div class="card" style="max-width:820px;">
  91. <h3 style="font-size:16px;margin-bottom:8px;" data-i18n="price_rule">Quy tắc tính phí</h3>
  92. <p style="color:var(--muted);font-size:14px;" data-i18n="price_rule_p">Phí = token × đơn giá, trừ từ số dư. Không thuê bao, không cam kết. Tỷ giá VND áp dụng tại thời điểm nạp tiền.</p>
  93. <div style="margin-top:14px;display:flex;gap:10px;flex-wrap:wrap;">
  94. <span class="tag tag-purple">MoMo</span><span class="tag tag-purple">ZaloPay</span><span class="tag tag-purple">Stripe</span><span class="tag tag-purple">PayPal</span><span class="tag tag-purple">Alipay</span><span class="tag tag-purple" data-i18n="pay_card">Thẻ ngân hàng</span>
  95. </div>
  96. </div>
  97. </section>
  98. <!-- 定价 FAQ -->
  99. <section style="max-width:820px;">
  100. <h2 style="font-size:18px;font-weight:800;margin-bottom:14px;" data-i18n="price_faq">Câu hỏi về giá</h2>
  101. <div class="faq-item open"><div class="faq-q" data-i18n="q1">Hóa đơn hoạt động thế nào?<span class="plus">+</span></div><div class="faq-a"><p data-i18n="a1">Chỉ trả trước. Nạp tín dụng, mỗi request được đo theo token và trừ từ số dư. Không thuê bao, không hóa đơn bất ngờ.</p></div></div>
  102. <div class="faq-item"><div class="faq-q" data-i18n="q3">Thanh toán bằng loại tiền nào?<span class="plus">+</span></div><div class="faq-a"><p data-i18n="a3">Hiển thị USD và VND. Thanh toán qua MoMo, ZaloPay, Stripe, PayPal, Alipay và thẻ ngân hàng. Tỷ giá áp dụng tại thời điểm nạp tiền.</p></div></div>
  103. <div class="faq-item"><div class="faq-q" data-i18n="q5">Có mức nạp tối thiểu không?<span class="plus">+</span></div><div class="faq-a"><p data-i18n="a5">Không. Bắt đầu với bất kỳ số tiền nào — thậm chí $1.</p></div></div>
  104. </section>
  105. </div>
  106. <footer>
  107. <div class="wrap">
  108. <div class="foot-grid">
  109. <div class="foot-brand">
  110. <svg viewBox="0 0 460 120" width="140" xmlns="http://www.w3.org/2000/svg">
  111. <defs><linearGradient id="fg" x1="0" y1="0" x2="1" y2="1"><stop offset="0" stop-color="#9B7BFF"/><stop offset="1" stop-color="#5C3DF0"/></linearGradient></defs>
  112. <g transform="translate(0,6) scale(0.92)"><circle cx="50" cy="50" r="33" stroke="rgba(124,92,255,.3)" stroke-width="1.5" stroke-dasharray="2 7" fill="none"/><g stroke="#00E5A0" stroke-width="1.8" opacity=".55"><line x1="50" y1="50" x2="76" y2="26"/><line x1="50" y1="50" x2="26" y2="76"/><line x1="50" y1="50" x2="78" y2="75"/></g><circle cx="50" cy="50" r="7.5" fill="url(#fg)"/><circle cx="76" cy="26" r="4" fill="#00E5A0"/><circle cx="26" cy="76" r="4" fill="#00E5A0"/><circle cx="78" cy="75" r="4" fill="#00E5A0"/></g>
  113. <text x="128" y="78" font-size="50" font-weight="700" fill="#E8ECF8" font-family="inherit">DoTouch</text><text x="348" y="78" font-size="50" font-weight="700" fill="url(#fg)" font-family="inherit">.AI</text>
  114. </svg>
  115. <p data-i18n="foot_p">AI Trung Quốc giá rẻ cho lập trình viên và doanh nghiệp nhỏ trên toàn thế giới.</p>
  116. </div>
  117. <div class="foot-col"><h4 data-i18n="foot_product">Sản phẩm</h4><a href="models.html" data-i18n="nav_models">Mô hình</a><a href="pricing.html" data-i18n="nav_pricing">Bảng giá</a><a href="#" data-i18n="foot_console">Console</a><a href="#" data-i18n="foot_status">Trạng thái</a></div>
  118. <div class="foot-col"><h4 data-i18n="foot_dev">Nhà phát triển</h4><a href="docs.html" data-i18n="foot_docs">Tài liệu</a><a href="docs.html" data-i18n="foot_quickstart">Bắt đầu nhanh</a><a href="#" data-i18n="foot_support">Hỗ trợ</a></div>
  119. <div class="foot-col"><h4 data-i18n="foot_legal">Pháp lý</h4><a href="#" data-i18n="foot_tos">Điều khoản dịch vụ</a><a href="#" data-i18n="foot_privacy">Chính sách bảo mật</a><a href="#" data-i18n="foot_refund">Chính sách hoàn tiền</a></div>
  120. </div>
  121. <div class="foot-bottom"><span>© 2026 DoTouch.AI — doTouch.ai</span><span data-i18n="foot_made">Tạo cho Việt Nam & thế giới · 算力普惠</span></div>
  122. </div>
  123. </footer>
  124. <div class="support-panel" id="supportPanel">
  125. <div class="support-head"><b data-i18n="chat_title">Trợ giúp & Hỗ trợ</b><span class="chat-status" data-i18n="chat_online">Trực tuyến</span></div>
  126. <div class="support-body">
  127. <p data-i18n="chat_hello">Xin chào! Chúng tôi có thể giúp gì cho bạn?</p>
  128. <div class="chat-sugg">
  129. <button data-i18n="chat_q_balance">Làm sao để nạp tiền?</button>
  130. <button data-i18n="chat_q_key">Tạo API key thế nào?</button>
  131. <button data-i18n="chat_q_model">Nên chọn mô hình nào?</button>
  132. </div>
  133. <div class="chat-input"><input placeholder="Nhập tin nhắn..." data-i18n="chat_input"><button>➤</button></div>
  134. <div class="chat-channels"><a class="tag tag-purple" href="#">Zalo</a><a class="tag tag-green" href="#">Telegram</a><a class="tag tag-gray" href="#">Email</a></div>
  135. </div>
  136. </div>
  137. <button class="support-fab" id="supportFab" aria-label="Support">
  138. <span class="pulse-ring"></span>
  139. <svg viewBox="0 0 24 24" width="26" height="26" fill="#fff"><path d="M12 3C7 3 3 6.6 3 11c0 2.3 1 4.3 2.7 5.8L5 20l3.4-1.5c1.1.4 2.3.5 3.6.5 5 0 9-3.6 9-8s-4-8-9-8z"/><circle cx="8.5" cy="11" r="1.2" fill="#0B1020"/><circle cx="12" cy="11" r="1.2" fill="#0B1020"/><circle cx="15.5" cy="11" r="1.2" fill="#0B1020"/></svg>
  140. </button>
  141. <div class="modal-mask" id="authModal">
  142. <div class="modal">
  143. <button class="modal-close" aria-label="Close">✕</button>
  144. <div id="viewLogin">
  145. <h3 data-i18n="auth_login_title">Đăng nhập</h3>
  146. <div class="auth-error" data-i18n="auth_err_email">Email không hợp lệ</div>
  147. <div class="field"><label data-i18n="auth_email">Email</label><input type="email" placeholder="you@example.com"></div>
  148. <div class="field"><label data-i18n="auth_password">Mật khẩu</label><input type="password"></div>
  149. <button class="btn btn-primary btn-block" data-i18n="auth_login_btn">Đăng nhập</button>
  150. <div class="auth-links"><a data-auth-view="reset" data-i18n="auth_forgot">Quên mật khẩu?</a><a data-auth-view="register" data-i18n="auth_to_register">Tạo tài khoản</a></div>
  151. </div>
  152. <div id="viewRegister" hidden>
  153. <h3 data-i18n="auth_register_title">Tạo tài khoản</h3>
  154. <div class="auth-error" data-i18n="auth_err_pwd">Mật khẩu không khớp</div>
  155. <div class="field"><label data-i18n="auth_email">Email</label><input type="email" placeholder="you@example.com"></div>
  156. <div class="field"><label data-i18n="auth_password">Mật khẩu</label><input type="password"></div>
  157. <div class="field"><label data-i18n="auth_confirm">Xác nhận mật khẩu</label><input type="password"></div>
  158. <div class="field">
  159. <label data-i18n="auth_code_label">Mã xác minh</label>
  160. <div class="code-row">
  161. <input class="code-cell" maxlength="1"><input class="code-cell" maxlength="1"><input class="code-cell" maxlength="1"><input class="code-cell" maxlength="1"><input class="code-cell" maxlength="1"><input class="code-cell" maxlength="1"><input class="code-cell" maxlength="1"><input class="code-cell" maxlength="1">
  162. <button class="btn btn-sm code-send" data-send-code data-i18n="auth_code_send">Gửi mã</button>
  163. </div>
  164. <p class="auth-note" data-code-note data-i18n="auth_code_note">Mã gồm 8 ký tự chữ hoa & số, hiệu lực 15 phút</p>
  165. </div>
  166. <button class="btn btn-primary btn-block" data-i18n="auth_register_btn">Đăng ký</button>
  167. <div class="auth-links"><a data-auth-view="login" data-i18n="auth_to_login">Đã có tài khoản? Đăng nhập</a></div>
  168. </div>
  169. <div id="viewReset" hidden>
  170. <h3 data-i18n="auth_reset_title">Đặt lại mật khẩu</h3>
  171. <div class="auth-error" data-i18n="auth_err_pwd">Mật khẩu không khớp</div>
  172. <div class="field"><label data-i18n="auth_email">Email</label><input type="email" placeholder="you@example.com"></div>
  173. <div class="field">
  174. <label data-i18n="auth_code_label">Mã xác minh</label>
  175. <div class="code-row">
  176. <input class="code-cell" maxlength="1"><input class="code-cell" maxlength="1"><input class="code-cell" maxlength="1"><input class="code-cell" maxlength="1"><input class="code-cell" maxlength="1"><input class="code-cell" maxlength="1"><input class="code-cell" maxlength="1"><input class="code-cell" maxlength="1">
  177. <button class="btn btn-sm code-send" data-send-code data-i18n="auth_code_send">Gửi mã</button>
  178. </div>
  179. <p class="auth-note" data-code-note data-i18n="auth_code_note">Mã gồm 8 ký tự chữ hoa & số, hiệu lực 15 phút</p>
  180. </div>
  181. <div class="field"><label data-i18n="auth_new_pwd">Mật khẩu mới</label><input type="password"></div>
  182. <div class="field"><label data-i18n="auth_confirm_new">Xác nhận mật khẩu mới</label><input type="password"></div>
  183. <button class="btn btn-primary btn-block" data-i18n="auth_reset_btn">Đặt lại mật khẩu</button>
  184. <div class="auth-links"><a data-auth-view="login" data-i18n="auth_back_login">Quay lại đăng nhập</a></div>
  185. </div>
  186. </div>
  187. </div>
  188. <script src="i18n.js"></script>
  189. </body>
  190. </html>