From 3f3279a7386bafcc64dad0d359c5e0f3d2b8957e Mon Sep 17 00:00:00 2001
From: lanlan <lan.lan@chaitin.com>
Date: Thu, 22 Feb 2024 19:14:56 +0800
Subject: [PATCH 1/2] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=E4=B8=93?=
 =?UTF-8?q?=E4=B8=9A=E7=89=88?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 website/public/images/discount.svg            |  23 ++++
 website/src/components/Footer.tsx             |   8 +-
 .../src/components/Version/FunctionTable.tsx  |  88 +++++++-----
 website/src/components/Version/index.tsx      | 129 ++++++++++--------
 4 files changed, 155 insertions(+), 93 deletions(-)
 create mode 100644 website/public/images/discount.svg

diff --git a/website/public/images/discount.svg b/website/public/images/discount.svg
new file mode 100644
index 0000000..5ad8803
--- /dev/null
+++ b/website/public/images/discount.svg
@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="76px" height="20px" viewBox="0 0 76 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>编组 4</title>
+    <defs>
+        <linearGradient x1="-4.93008412e-13%" y1="46.5373961%" x2="90.5986697%" y2="53.4626039%" id="linearGradient-1">
+            <stop stop-color="#FFC193" offset="0%"></stop>
+            <stop stop-color="#FF5A5E" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="官网设计" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="版本（专业版特惠）" transform="translate(-1012.000000, -737.000000)">
+            <g id="编组-4" transform="translate(1012.000000, 737.000000)">
+                <path d="M8,0 L66,0 C71.5228475,-1.01453063e-15 76,4.4771525 76,10 C76,15.5228475 71.5228475,20 66,20 L0,20 L0,20 L0,8 C-5.41083001e-16,3.581722 3.581722,8.11624501e-16 8,0 Z" id="矩形" fill="url(#linearGradient-1)"></path>
+                <g id="人气、热度" transform="translate(8.000000, 5.000000)" fill="#FFDF00" fill-rule="nonzero">
+                    <path d="M6.40193705,3.27637496 C6.08232446,3.79522657 5.66447596,4.06226219 5.66447596,4.06226219 C6.43652715,0.986509858 3.28052577,0 3.28052577,0 C4.21445866,3.40781736 0,3.66793497 0,6.41438948 C0,9.160844 3.22241439,9.63818748 3.22241439,9.63818748 C0.437218955,6.56658596 4,4.82324455 4,4.82324455 C4,4.82324455 3.37737807,5.72120374 4.83708059,7.12002767 C5.86786579,8.10653753 4.73607748,9.63403667 4.73607748,9.63403667 C5.78623314,9.64787271 8,8.26565202 8,6.388101 C8,4.51193359 6.40193705,3.27637496 6.40193705,3.27637496 Z" id="路径"></path>
+                </g>
+                <text id="限时特惠" font-family="PingFangSC-Regular, PingFang SC" font-size="12" font-weight="normal" line-spacing="20" fill="#FFFFFF">
+                    <tspan x="20" y="14">限时特惠</tspan>
+                </text>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/website/src/components/Footer.tsx b/website/src/components/Footer.tsx
index ddaba24..81bb379 100644
--- a/website/src/components/Footer.tsx
+++ b/website/src/components/Footer.tsx
@@ -40,9 +40,9 @@ const LINKS = [
 ];
 
 export const items = [
-  { to: "/community", label: "开发计划" },
-  { to: "/version", label: "付费版本" },
-  { to: "", label: "用户协议" },
+  { to: "/community", label: "开发计划", target: "_self" },
+  { to: "/version", label: "付费版本", target: "_self" },
+  { to: "https://github.com/chaitin/SafeLine/blob/main/LICENSE.md", label: "用户协议", target: "_blank" },
 ];
 
 export default function Footer() {
@@ -88,7 +88,7 @@ export default function Footer() {
                 {items.map((item, index) => (
                   <Box key={index} component="span" mr={5}>
                     {item.to ? (
-                      <Link sx={{ fontSize: '16px', fontWeight: 600, color: "common.white" }} href={item.to} rel={item.label}>
+                      <Link sx={{ fontSize: '16px', fontWeight: 600, color: "common.white" }} href={item.to} rel={item.label} target={item.target}>
                         {item.label}
                       </Link>
                     ) : (
diff --git a/website/src/components/Version/FunctionTable.tsx b/website/src/components/Version/FunctionTable.tsx
index f0344e2..c83286b 100644
--- a/website/src/components/Version/FunctionTable.tsx
+++ b/website/src/components/Version/FunctionTable.tsx
@@ -33,11 +33,11 @@ const Illustrate = ({ text }: { text: string }) => {
 
 const versions = [
   { title: '社区版', key: 'experience' },
-  // { title: '专业版', key: 'major' },
+  { title: '专业版', key: 'major' },
   { title: '企业版', key: 'basics' },
 ]
 
-const colors = ['light', 'main'] // 'lighter', 
+const colors = ['lighter', 'light', 'main']
 
 const FunctionTable = () => {
   const [open, setOpen] = useState<string[]>([
@@ -77,7 +77,7 @@ const FunctionTable = () => {
           basics: <Support />,
         },
         {
-          name: "人机验证",
+          name: "爬虫防护 / 人机验证",
           experience: <Support />,
           major: <Support />,
           basics: <Support />,
@@ -91,31 +91,43 @@ const FunctionTable = () => {
         {
           name: "威胁情报",
           experience: <Illustrate text="社区共享威胁 IP" />,
-          major: <Support />,
+          major: <Illustrate text="专业版威胁 IP" />,
           basics: <Illustrate text="高级威胁情报" />,
         },
+        {
+          name: "商业地理位置封禁",
+          experience: <NotSupport />,
+          major: <Support />,
+          basics: <Support />,
+        },
+        {
+          name: "应急补充规则",
+          experience: <NotSupport />,
+          major: <Support />,
+          basics: <Support />,
+        },
         {
           name: "高级 Bot 防护、API 防护",
           experience: <NotSupport />,
-          major: <Support />,
+          major: <NotSupport />,
           basics: <Support />,
         },
         {
           name: "网页防篡改",
           experience: <NotSupport />,
-          major: <Support />,
+          major: <NotSupport />,
           basics: <Support />,
         },
         {
           name: "灵活可编程插件",
           experience: <NotSupport />,
-          major: <Support />,
+          major: <NotSupport />,
           basics: <Support />,
         },
         {
           name: "精细化引擎调节",
           experience: <NotSupport />,
-          major: <Support />,
+          major: <NotSupport />,
           basics: <Support />,
         },
       ],
@@ -133,13 +145,13 @@ const FunctionTable = () => {
         {
           name: "高级统计分析与报告",
           experience: <NotSupport />,
-          major: <Support />,
+          major: <NotSupport />,
           basics: <Support />,
         },
         {
           name: "实时可视化大屏",
           experience: <NotSupport />,
-          major: <Support />,
+          major: <NotSupport />,
           basics: <Support />,
         },
       ],
@@ -147,23 +159,29 @@ const FunctionTable = () => {
     {
       title: "系统管理",
       data: [
+        {
+          name: "自定义拦截页面",
+          experience: <NotSupport />,
+          major: <Support />,
+          basics: <Support />,
+        },
         {
           name: "多设备集中管理",
           tip: "",
           experience: <NotSupport />,
-          major: <Support />,
+          major: <NotSupport />,
           basics: <Support />,
         },
         {
           name: "多租户管理",
           experience: <NotSupport />,
-          major: <Support />,
+          major: <NotSupport />,
           basics: <Support />,
         },
         {
           name: "安全合规与审计",
           experience: <NotSupport />,
-          major: <Support />,
+          major: <NotSupport />,
           basics: <Support />,
         },
       ],
@@ -177,40 +195,40 @@ const FunctionTable = () => {
           major: <Support />,
           basics: <Support />,
         },
-        {
-          name: "旁路、透明代理、路由等复杂接入方式",
-          experience: <NotSupport />,
-          major: <Support />,
-          basics: <Support />,
-        },
-        {
-          name: "集群式可扩展部署",
-          experience: <NotSupport />,
-          major: <Support />,
-          basics: <Support />,
-        },
         {
           name: "负载均衡",
           experience: <NotSupport />,
           major: <Support />,
           basics: <Support />,
         },
+        {
+          name: "旁路、透明代理、路由等复杂接入方式",
+          experience: <NotSupport />,
+          major: <NotSupport />,
+          basics: <Support />,
+        },
+        {
+          name: "集群式可扩展部署",
+          experience: <NotSupport />,
+          major: <NotSupport />,
+          basics: <Support />,
+        },
         {
           name: "紧急模式 / Bypass",
           experience: <NotSupport />,
-          major: <Support />,
+          major: <NotSupport />,
           basics: <Support />,
         },
         {
           name: "硬件形态交付",
           experience: <NotSupport />,
-          major: <Support />,
+          major: <NotSupport />,
           basics: <Support />,
         },
         {
           name: "高可用 / HA",
           experience: <NotSupport />,
-          major: <Support />,
+          major: <NotSupport />,
           basics: <Support />,
         },
       ],
@@ -227,19 +245,19 @@ const FunctionTable = () => {
         {
           name: "漏洞应急服务",
           experience: <NotSupport />,
-          major: <Support />,
+          major: <NotSupport />,
           basics: <Support />,
         },
         {
           name: "产品销售许可证",
           experience: <NotSupport />,
-          major: <Support />,
+          major: <NotSupport />,
           basics: <Support />,
         },
         {
           name: "定制化",
           experience: <NotSupport />,
-          major: <Support />,
+          major: <NotSupport />,
           basics: <Support />,
         },
       ],
@@ -271,9 +289,9 @@ const FunctionTable = () => {
         >
           <TableHead sx={{ background: "transparent" }}>
             <TableRow sx={{ border: "0" }}>
-              <TableCell sx={{ width: { xs: "50%", sm: "33%" }}}/>
+              <TableCell sx={{ width: { xs: "25%" }}}/>
               {versions.map((item, index) => (
-                <TableCell key={item.title} align="center" sx={{ width: { xs: "25%", sm: "33%" }, fontSize: "16px" }}>
+                <TableCell key={item.title} align="center" sx={{ width: { xs: "25%" }, fontSize: "16px" }}>
                   <Box
                     sx={(theme) => ({
                       display: "flex",
@@ -354,13 +372,13 @@ const FunctionTable = () => {
                 >
                   {data.data.map((item) => (
                     <TableRow key={item.name}>
-                      <TableCell sx={{ width: { xs: "50%", sm: "33%" }}}>
+                      <TableCell sx={{ width: { xs: "25%" }}}>
                         <Box>
                           <Typography variant="h6" sx={{ fontWeight: 400 }}>{item.name}</Typography>
                         </Box>
                       </TableCell>
                       {versions.map((v, index) => (
-                        <TableCell key={index} sx={{ width: { xs: "25%", sm: "33%" } }} align="center">
+                        <TableCell key={index} sx={{ width: { xs: "25%" } }} align="center">
                          {item[v.key as 'experience' | 'major' | 'basics']}
                        </TableCell>
                       ))}
diff --git a/website/src/components/Version/index.tsx b/website/src/components/Version/index.tsx
index 5127b5e..59dd52e 100644
--- a/website/src/components/Version/index.tsx
+++ b/website/src/components/Version/index.tsx
@@ -1,7 +1,8 @@
 import React from "react";
-import { alpha, Box, Button, Typography } from "@mui/material";
+import { alpha, Box, Button, Typography, Stack } from "@mui/material";
 import dynamic from 'next/dynamic';
 import FunctionTable from "./FunctionTable";
+import Image from "next/image";
 
 const Consultation = dynamic(() => import('./Consultation'), {
   ssr: false,
@@ -14,7 +15,7 @@ const VERSION_LIST = [
     apply_desc: "适合小型个人网站或业余爱好项目",
     fee: "免费",
     fee_desc: "",
-    desc: "无限站点，无限规则",
+    desc: "",
     operation: (
       <Button
         variant="contained"
@@ -30,58 +31,73 @@ const VERSION_LIST = [
       </Button>
     ),
     functions: [
-      "语义分析防护",
-      "自定义规则",
-      "访问频率限制",
-      "人机验证",
-      "社区 IP 情报",
+      "Web 攻击防护",
+      "爬虫防护 / 人机验证",
+      "Web 访问控制 / Web 身份认证",
+      "CC 攻击防护 / 频率限制",
+      "黑 IP 情报防护",
+      "0 Day 漏洞情报防护",
+    ],
+  },
+  {
+    name: "专业版",
+    name_bg: "/images/professional-version.png",
+    apply_desc: "适合专业网站与小微企业",
+    fee: "¥1799",
+    fee_desc: "/年",
+    desc: (
+      <Stack direction="row" justifyContent="center">
+        <Typography variant="subtitle2" mr={1} sx={{ color: alpha("#000", 0.5), textDecoration: "line-through", lineHeight: "20px" }}>
+          原价 ¥3600 /年
+        </Typography>
+        <Image
+          src="/images/discount.svg"
+          alt="限时特惠"
+          width={76}
+          height={20}
+        />
+      </Stack>
+    ),
+    operation: (
+      <Button
+        variant="contained"
+        // target="_blank"
+        sx={{
+          width: 146,
+          my: 4,
+          boxShadow: "0px 15px 25px 0px rgba(15,198,194,0.3)",
+        }}
+        // href="https://rivers.chaitin.cn/app/safeline-cloud-12338/auth"
+      >
+        即将开放
+      </Button>
+    ),
+    functions: [
+      "所有社区版能力",
+      "Web 攻击加强防护",
+      "黑 IP 加强情报防护",
+      "自定义拦截页面",
+      "基于地理位置的访问控制",
+      "上游服务器负载均衡",
     ],
   },
-  // {
-  //   name: "专业版",
-  //   name_bg: "/images/professional-version.png",
-  //   apply_desc: "适合专业网站与关键业务",
-  //   fee: "¥88",
-  //   fee_desc: "/月 按年订阅",
-  //   desc: "¥118 按月订阅",
-  //   operation: (
-  //     <Button
-  //       variant="contained"
-  //       target="_blank"
-  //       sx={{
-  //         width: 146,
-  //         my: 4,
-  //         boxShadow: "0px 15px 25px 0px rgba(15,198,194,0.3)",
-  //       }}
-  //       href="https://stack.chaitin.com/tool/detail?id=717"
-  //     >
-  //       立即购买
-  //     </Button>
-  //   ),
-  //   functions: [
-  //     "所有社区版能力",
-  //     "自定义阻断页面",
-  //     "自定义相应动作",
-  //     "根据地区封禁",
-  //     "......",
-  //   ],
-  // },
   {
     name: "企业版",
     name_bg: "/images/enterprise-version.svg",
-    apply_desc: "适合小微到中大型企业",
-    fee: "按需定制",
+    apply_desc: "适合中大型企业",
+    fee: "定制包价",
     fee_desc: "",
     desc: "",
     operation: (
       <Consultation />
     ),
     functions: [
-      "所有社区版能力",
-      "高级统计分析与报告",
-      "智能业务建模",
-      "高级 Bot 防护、API 防护",
-      "......",
+      "所有专业版能力",
+      "软件、硬件、云原生等交付形式",
+      "反代、透明、路由、桥接、旁挂等方式部署",
+      "多活、主备、Bypass 等高可用形式",
+      "动态防护、拟态防护等高级防护形式",
+      "分布式集群部署，检测超大规模流量",
     ],
   },
 ]
@@ -101,7 +117,7 @@ const Version = () => {
           <Box
             key={item.name}
             sx={{
-              width: { xs: "100%", sm: "42%" },
+              width: { xs: "100%", md: "30.7%" },
               flexShrink: 0,
               height: { xs: "auto" },
               borderRadius: "12px",
@@ -151,6 +167,9 @@ const Version = () => {
                   </Typography>
                 )}
               </Typography>
+              <Box sx={{ height: "20px" }}>
+                {item.desc}
+              </Box>
               <Box>{item.operation}</Box>
               <FunctionItems items={item.functions} />
             </Box>
@@ -185,16 +204,18 @@ const FunctionItems: React.FC<{ items: any[] }> = ({ items }) => {
             py: 2,
             position: "relative",
             pl: 2,
-            "&:before": {
-              content: "' '",
-              position: "absolute",
-              left: 0,
-              top: "22px",
-              width: 4,
-              height: 4,
-              borderRadius: "50%",
-              backgroundColor: "success.main",
-            },
+            fontSize: "14px",
+            textAlign: "center",
+            // "&:before": {
+            //   content: "' '",
+            //   position: "absolute",
+            //   left: 0,
+            //   top: "22px",
+            //   width: 4,
+            //   height: 4,
+            //   borderRadius: "50%",
+            //   backgroundColor: "success.main",
+            // },
           }}
         >
           {f}

From f447a350e46c16972b62bc82f265bbc2614d0ca0 Mon Sep 17 00:00:00 2001
From: lanlan <lan.lan@chaitin.com>
Date: Thu, 22 Feb 2024 19:34:55 +0800
Subject: [PATCH 2/2] fix: update function name

---
 website/src/components/Version/FunctionTable.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/website/src/components/Version/FunctionTable.tsx b/website/src/components/Version/FunctionTable.tsx
index c83286b..522ed9f 100644
--- a/website/src/components/Version/FunctionTable.tsx
+++ b/website/src/components/Version/FunctionTable.tsx
@@ -249,7 +249,7 @@ const FunctionTable = () => {
           basics: <Support />,
         },
         {
-          name: "产品销售许可证",
+          name: "等保合规",
           experience: <NotSupport />,
           major: <NotSupport />,
           basics: <Support />,