diff --git a/public/site/css/ad.css b/public/site/css/ad.css index 08785c73b..754618d5a 100644 --- a/public/site/css/ad.css +++ b/public/site/css/ad.css @@ -139,6 +139,8 @@ footer.ad-footer .footer-layout { .ad-wrapper .topics .topics-btn { gap: 16px; + + margin-bottom: 240px; } .ad-wrapper .topics .topics-btn .btn { @@ -169,10 +171,15 @@ footer.ad-footer .footer-layout { } .ad-wrapper main { - background-image: url(../img/ad/plan.png); + /* background-image: url(../img/ad/plan.png); background-size: cover; background-position: center; - background-repeat: no-repeat; + background-repeat: no-repeat; */ + position: relative; +} + +.ad-plan { + margin-top: -240px; } .ad-plan, @@ -183,7 +190,7 @@ footer.ad-footer .footer-layout { .section-wrapper { max-width: 1280px; margin: 0 auto; - padding: 96px 0 64px; + padding: 0 0 96px 64px; display: flex; @@ -210,8 +217,8 @@ footer.ad-footer .footer-layout { .ad-plan .section-content { width: 100%; display: grid; - grid-template-columns: repeat(4, 1fr); - gap: 24px; + grid-template-columns: repeat(3, 1fr); + gap: 32px; } .ad-plan .section-content .plan-item { @@ -222,6 +229,8 @@ footer.ad-footer .footer-layout { min-height: 360px; padding: 32px 24px; border: 2px solid transparent; + + position: relative; } .ad-plan .section-content .plan-item:hover, @@ -230,6 +239,24 @@ footer.ad-footer .footer-layout { box-shadow: 0px 24px 32px 16px #0000001f; } +.ad-plan .section-content .plan-item .plan-item-tag { + position: absolute; + top: -12px; + right: -12px; + width: 88px; + height: 32px; + background-image: url(../img/ad/tag.png); + background-size: cover; + background-position: center; + background-repeat: no-repeat; + display: flex; + justify-content: center; + align-items: center; + font-size: 14px; + font-weight: 500; + color: #fff; +} + .ad-plan .section-content .plan-item .plan-item-title { font-size: 18px; font-weight: 600; @@ -245,10 +272,18 @@ footer.ad-footer .footer-layout { } .ad-plan .section-content .plan-item .plan-item-price .plan-item-price-current { - font-size: 24px; + font-size: 32px; font-weight: 900; } +.ad-plan + .section-content + .plan-item + .plan-item-price + .plan-item-price-current.price { + color: #f3474c; +} + .ad-plan .section-content .plan-item .plan-item-price .plan-item-price-payment { font-size: 14px; font-weight: 500; @@ -269,7 +304,6 @@ footer.ad-footer .footer-layout { .plan-item .plan-item-price .plan-item-price-original.price { - color: #f3474c; text-decoration: line-through; } diff --git a/public/site/en/ad.html b/public/site/en/ad.html index aeae39608..2de93181c 100644 --- a/public/site/en/ad.html +++ b/public/site/en/ad.html @@ -16,7 +16,7 @@ - + @@ -27,7 +27,6 @@ -
@@ -35,10 +34,13 @@
- Please scan the QR code to add our WeChat customer service representative for purchase + Please scan the QR code to add our WeChat customer service + representative for purchase
- +
@@ -278,7 +280,7 @@
-
+
-
-
- Unlimited Pro -
-
- - ¥16,800 - - - - - - ¥18,888 - -
-
- - - -
-
-
    -
  • - - undefined - - - Support private deployment - -
    • -
  • - - undefined - - - Technical Advisory Services - -
    • -
  • - - undefined - - - Custom logo design - -
    • -
  • - - undefined - - - Dedicated operations customer service - -
    • -
  • - - undefined - - - 12-Hour service response - -
    • -
  • - - undefined - - - Free 1-Year Technical Maintenance Included - -
    • -
-
-
-
-
- 50-License Pro -
-
- - ¥13,800 - - - - - - ￥16,800 - -
-
- - - -
-
-
    -
  • - - undefined - - - Support private deployment - -
    • -
  • - - undefined - - - Technical Advisory Services - -
    • -
  • - - undefined - - - Custom logo design - -
    • -
  • - - undefined - - - Dedicated operations customer service - -
    • -
  • - - undefined - - - 12-Hour service response - -
    • -
  • - - undefined - - - Free 1-Year Technical Maintenance Included - -
    • -
-
-
-
-
- 30-License Pro -
-
- - ¥11,800 - - - - - - ￥15,800 - -
-
- - - -
-
-
    -
  • - - undefined - - - Support private deployment - -
    • -
  • - - undefined - - - Technical Advisory Services - -
    • -
  • - - undefined - - - Custom logo design - -
    • -
  • - - undefined - - - Dedicated operations customer service - -
    • -
  • - - undefined - - - 12-Hour service response - -
    • -
  • - - undefined - - - Free 1-Year Technical Maintenance Included - -
    • -
-
-
-
-
- 10-License Pro -
-
- - ￥5,800 - - - - - - ¥8,800 - -
-
- - - -
-
-
    -
  • - - undefined - - - Support private deployment - -
    • -
  • - - undefined - - - Technical Advisory Services - -
    • -
  • - - undefined - - - Dedicated operations customer service - -
    • -
  • - - undefined - - - 12-Hour service response - -
    • -
  • - - undefined - - - Free 1-Year Technical Maintenance Included - -
    • -
-
-
-
-
- 5-License Pro -
-
- - ¥3,800 - - - - - - ¥6,800 - -
-
- - - -
-
-
    -
  • - - undefined - - - Support private deployment - -
    • -
  • - - undefined - - - Technical Advisory Services - -
    • -
  • - - undefined - - - Dedicated operations customer service - -
    • -
  • - - undefined - - - 12-Hour service response - -
    • -
  • - - undefined - - - Free 1-Year Technical Maintenance Included - -
    • -
-
-
-
-
- Annual Pro -
-
- - ¥200 - - /per/year - - - - ¥288 - -
-
- - - -
-
-
    -
  • - - undefined - - - Support private deployment - -
    • -
  • - - undefined - - - Technical Advisory Services - -
    • -
  • - - undefined - - - Dedicated operations customer service - -
    • -
  • - - undefined - - - 12-Hour service response - -
    • -
  • - - undefined - - - Free 1-Year Technical Maintenance Included - -
    • -
-
-
-
-
- Supported Pro -
-
- - ¥600 - - /per/year - - - - ¥680 - -
-
- - - -
-
-
    -
  • - - undefined - - - For businesses established within 1 year - -
    • -
  • - - undefined - - - Free for 5 or fewer people - -
    • -
  • - - undefined - - - Valid for 1 year - -
    • -
  • - - undefined - - - Support private deployment - -
    • -
  • - - undefined - - - Custom logo design - -
    • -
-
-
-
+
Free
- + 0 /month - + Up to 3 People
- + @@ -808,39 +317,198 @@
  • - undefined + undefined - + Support private deployment
    • +
  • - undefined + undefined - + Technical Advisory Services
    • +
  • - undefined + undefined - - Dedicated operations customer service + + Dedicated operations customer + service
    • +
  • - undefined + undefined - + 12-Hour service response
+
+
Popular
+
+ 10-License Pro +
+
+ + ￥5,800 + + + + + ¥8,800 + +
+
+ + + +
+
+
    +
  • + + undefined + + + Support private deployment + +
    • + +
  • + + undefined + + + Technical Advisory Services + +
    • + +
  • + + undefined + + + Dedicated operations customer + service + +
    • + +
  • + + undefined + + + 12-Hour service response + +
    • + +
  • + + undefined + + + Free 1-Year Technical + Maintenance Included + +
    • +
+
+
+
+
Hot
+
+ Unlimited Pro +
+
+ + ¥16,800 + + + + + ¥18,888 + +
+
+ + + +
+
+
    +
  • + + undefined + + + Support private deployment + +
    • + +
  • + + undefined + + + Technical Advisory Services + +
    • + +
  • + + undefined + + + Custom logo design + +
    • + +
  • + + undefined + + + Dedicated operations customer + service + +
    • + +
  • + + undefined + + + 12-Hour service response + +
    • + +
  • + + undefined + + + Free 1-Year Technical + Maintenance Included + +
    • +
+
+
diff --git a/public/site/img/ad/tag.png b/public/site/img/ad/tag.png new file mode 100644 index 000000000..29062aca6 Binary files /dev/null and b/public/site/img/ad/tag.png differ diff --git a/public/site/js/ad.js b/public/site/js/ad.js index bdb1da634..7fee3513b 100644 --- a/public/site/js/ad.js +++ b/public/site/js/ad.js @@ -307,12 +307,32 @@ function handleAdBannerSelfHostButton({ "ad-banner-self-host-button" ); if (selfHostButtonEl) { - selfHostButtonEl.innerHTML = ` - - - `; + if (href === "#") { + selfHostButtonEl.innerHTML = ` + + + `; + function showDialog(e) { + e.preventDefault(); + e.stopPropagation(); + + const dialogEl = document.querySelector(".ad-dialog"); + if (!dialogEl) return; + dialogEl.classList.add("show"); + lockBodyScroll(true); + handleDialogAnimate(true) + } + selfHostButtonEl.addEventListener("click", showDialog); + } else { + selfHostButtonEl.innerHTML = ` + + + `; + } selfHostButtonEl.style = getStyle(style); } } @@ -373,11 +393,12 @@ async function handleAdPlanPlans(plans) { planItemEl.className = `plan-item ${plan.activated ? "active" : "" }`; planItemEl.innerHTML = ` + ${plan.tag ? `
${plan.tag}
` : ""}
${plan.title}
- + ${plan.price.current} ${plan.price.payment ?? ""} diff --git a/public/site/zh/ad.html b/public/site/zh/ad.html index 2fddc1c54..9e6b4c6ef 100644 --- a/public/site/zh/ad.html +++ b/public/site/zh/ad.html @@ -14,7 +14,7 @@ - + @@ -25,7 +25,6 @@ -
@@ -36,7 +35,9 @@ 如需购买请扫码添加微信客服专员
- +
@@ -274,523 +275,30 @@
-
+
-
-
- 无限专业版 -
-
- - ¥16,800 - - - - - - ¥18,888 - -
-
- - - -
-
-
    -
  • - - undefined - - - 支持私有化部署 - -
    • -
  • - - undefined - - - 技术咨询服务 - -
    • -
  • - - undefined - - - LOGO定制 - -
    • -
  • - - undefined - - - 专属运营客服 - -
    • -
  • - - undefined - - - 12小时服务响应 - -
    • -
  • - - undefined - - - 赠1年免费技术维护 - -
    • -
-
-
-
-
- 50人专业版 -
-
- - ¥13,800 - - - - - - ￥16,800 - -
-
- - - -
-
-
    -
  • - - undefined - - - 支持私有化部署 - -
    • -
  • - - undefined - - - 技术咨询服务 - -
    • -
  • - - undefined - - - LOGO定制 - -
    • -
  • - - undefined - - - 专属运营客服 - -
    • -
  • - - undefined - - - 12小时服务响应 - -
    • -
  • - - undefined - - - 赠1年免费技术维护 - -
    • -
-
-
-
-
- 30人专业版 -
-
- - ¥11,800 - - - - - - ￥15,800 - -
-
- - - -
-
-
    -
  • - - undefined - - - 支持私有化部署 - -
    • -
  • - - undefined - - - 技术咨询服务 - -
    • -
  • - - undefined - - - LOGO定制 - -
    • -
  • - - undefined - - - 专属运营客服 - -
    • -
  • - - undefined - - - 12小时服务响应 - -
    • -
  • - - undefined - - - 赠1年免费技术维护 - -
    • -
-
-
-
-
- 10人专业版 -
-
- - ￥5,800 - - - - - - ¥8,800 - -
-
- - - -
-
-
    -
  • - - undefined - - - 支持私有化部署 - -
    • -
  • - - undefined - - - 技术咨询服务 - -
    • -
  • - - undefined - - - 专属运营客服 - -
    • -
  • - - undefined - - - 12小时服务响应 - -
    • -
  • - - undefined - - - 赠1年免费技术维护 - -
    • -
-
-
-
-
- 5人专业版 -
-
- - ¥3,800 - - - - - - ¥6,800 - -
-
- - - -
-
-
    -
  • - - undefined - - - 支持私有化部署 - -
    • -
  • - - undefined - - - 技术咨询服务 - -
    • -
  • - - undefined - - - 专属运营客服 - -
    • -
  • - - undefined - - - 12小时服务响应 - -
    • -
  • - - undefined - - - 赠1年免费技术维护 - -
    • -
-
-
-
-
- 年度专业版 -
-
- - ¥200 - - /人/年 - - - - ¥288 - -
-
- - - -
-
-
    -
  • - - undefined - - - 支持私有化部署 - -
    • -
  • - - undefined - - - 技术咨询服务 - -
    • -
  • - - undefined - - - 专属运营客服 - -
    • -
  • - - undefined - - - 12小时服务响应 - -
    • -
  • - - undefined - - - 赠1年免费技术维护 - -
    • -
-
-
-
-
- 扶持专业版 -
-
- - ¥600 - - /人/年 - - - - ¥680 - -
-
- - - -
-
-
    -
  • - - undefined - - - 适用于成立1年内企业 - -
    • -
  • - - undefined - - - 限5人内（含）免费 - -
    • -
  • - - undefined - - - 有效期一年 - -
    • -
  • - - undefined - - - 支持私有化部署 - -
    • -
  • - - undefined - - - 专属运营客服 - -
    • -
-
-
-
+
免费版
- + 0 /月 - + 最多3人
- + @@ -800,39 +308,193 @@
  • - undefined + undefined - + 支持私有化部署
    • +
  • - undefined + undefined - + 技术咨询服务
    • +
  • - undefined + undefined - + 专属运营客服
    • +
  • - undefined + undefined - + 12小时服务响应
+
+
最受欢迎
+
+ 10人专业版 +
+
+ + ￥5,800 + + + + + ¥8,800 + +
+
+ + + +
+
+
    +
  • + + undefined + + + 支持私有化部署 + +
    • + +
  • + + undefined + + + 技术咨询服务 + +
    • + +
  • + + undefined + + + 专属运营客服 + +
    • + +
  • + + undefined + + + 12小时服务响应 + +
    • + +
  • + + undefined + + + 赠1年免费技术维护 + +
    • +
+
+
+
+
热销
+
+ 无限专业版 +
+
+ + ¥16,800 + + + + + ¥18,888 + +
+
+ + + +
+
+
    +
  • + + undefined + + + 支持私有化部署 + +
    • + +
  • + + undefined + + + 技术咨询服务 + +
    • + +
  • + + undefined + + + LOGO定制 + +
    • + +
  • + + undefined + + + 专属运营客服 + +
    • + +
  • + + undefined + + + 12小时服务响应 + +
    • + +
  • + + undefined + + + 赠1年免费技术维护 + +
    • +
+
+
@@ -856,7 +518,8 @@ 项目管理
- 支持多种项目管理模式，如敏捷开发、水晶计划、看板等，适用于各种规模和类型的项目管理。用户可以使用DooTask里的项目管理工具，例如任务分配、进度跟踪、资源分配等来管理整个项目。 + 支持多种项目管理模式，如敏捷开发、水晶计划、看板等，适用于各种规模和类型的项目管理。用户可以使用DooTask里的项目管理工具，例如任务分配、进度跟踪、资源分配等来管理整个项目。 +
@@ -870,7 +533,8 @@ 团队协作
- DooTask的丰富实用的工具可以方便团队成员之间的沟通和协作，提高工作效率。例如，团队成员可以使用DooTask里的文档协作工具、在线思维导图、流程图等工具进行协作。 + DooTask的丰富实用的工具可以方便团队成员之间的沟通和协作，提高工作效率。例如，团队成员可以使用DooTask里的文档协作工具、在线思维导图、流程图等工具进行协作。 +
@@ -899,7 +563,8 @@ 自由定制
- DooTask是一款完全开源的工具，用户可以自由修改和定制，避免了商业软件订阅费用带来的额外成本。 + DooTask是一款完全开源的工具，用户可以自由修改和定制，避免了商业软件订阅费用带来的额外成本。 +