feat(detail): update Antv home update dumi-theme-antv

antvis · Nov 17, 2023 · 2b3553c · 2b3553c
1 parent fb173a7
commit 2b3553c
Show file tree

Hide file tree

Showing 6 changed files with 813 additions and 316 deletions.
diff --git a/.dumi/theme/locales/en.json b/.dumi/theme/locales/en.json
@@ -330,7 +330,7 @@
   "蚂蚁企业级数据可视化解决方案，让用户轻松看数收获工作意义": "Ant enterprise data visualization solution, so that users can easily see the number of harvest work significance.",
   "柱形图、饼图、关系图、地图、多维表格等260+丰富图表随心选用": "Column、Pie、Graph、Map、Dimensions Table and other 260+ rich chart choice at will.",
 
-  "设计语言与研发框架": "设计语言与研发框架",
+  "设计语言与研发框架": "Design language and R&D framework",
   "资产一览，让你快速搭建网站应用": "Assets list, let you quickly build a website application.",
   "Ant Design / AntV 设计负责人": "Ant Design / AntV Design Leader"
 }
diff --git a/.dumi/theme/locales/zh.json b/.dumi/theme/locales/zh.json
@@ -322,7 +322,7 @@
   "蚂蚁企业级数据可视化解决方案，让用户轻松看数收获工作意义": "蚂蚁企业级数据可视化解决方案，让用户轻松看数收获工作意义",
   "柱形图、饼图、关系图、地图、多维表格等260+丰富图表随心选用": "柱形图、饼图、关系图、地图、多维表格等260+丰富图表随心选用",
 
-  "设计语言与研发框架": "Design language and R&D framework",
+  "设计语言与研发框架": "设计语言与研发框架",
   "资产一览，让你快速搭建网站应用": "资产一览，让你快速搭建网站应用",
   "Ant Design / AntV 设计负责人": "Ant Design / AntV 设计负责人"
 }
diff --git a/site/components/ProjectCard/index.tsx b/site/components/ProjectCard/index.tsx
@@ -55,7 +55,7 @@ const PROJECT_DATAS: PrejectData = [
       classNames: styles.antd,
       icon: 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*OWM6RLft2VIAAAAAAAAAAAAADmJ7AQ/original',
       url: 'https://charts.ant.design',
-      img: 'https://gw.alipayobjects.com/zos/antfincdn/ABozcNxHpq/a2219011-3e9b-47d2-82a3-376fc779a065.png',
+      img: 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*IJE_TYeUtEUAAAAAAAAAAAAADmJ7AQ/original',
     },
     {
       title: '267全系F版',
@@ -145,7 +145,7 @@ const PROJECT_DATAS: PrejectData = [
 
 // 丰富图表，选用自如
 export function ProjectCard() {
-  const locale = useLocale()
+  const locale = useLocale();
   const [isChinaMirrorHost] = useChinaMirrorHost();
   const [products, setProducts] = useState<ProductType[]>([]);
 
@@ -166,7 +166,8 @@ export function ProjectCard() {
   }, [language, isChinaMirrorHost]);
 
   // 弹出框内容
-  const getContent = useCallback((title, subTitle, img, links) => {
+  const getContent = useCallback(({ title, subTitle, img, links, url }) => {
+
     return <div className={styles.content}>
       <div className={styles.msg}>
         <div className={styles.msgTitle}>{title}</div>
@@ -175,9 +176,16 @@ export function ProjectCard() {
       <div className={styles.msgChart} style={{ backgroundImage: `url(${img})` }} />
       <div className={styles.links}>
         {
-          ANTV_LINKS.map((link) =>
-            <a
-              href={links[link.href]?.url}
+          ANTV_LINKS.map((link) => {
+            let href = links[link.href]?.url;
+
+            // Ant Design Charts 本身跳转 https://charts.ant.design/api 为 404, 修改为 https://ant-design-charts.antgroup.com
+            if (title === 'Ant Design Charts' && !href) {
+              href = `https://ant-design-charts.antgroup.com/${language}/${link.href}`;
+            }
+
+            return <a
+              href={href}
               target='_black'
             >
               <ActiveIcon
@@ -187,6 +195,7 @@ export function ProjectCard() {
                 activeImg={link.activeImg}
               />
             </a>
+          }
           )
         }
       </div>
@@ -208,6 +217,7 @@ export function ProjectCard() {
                   const { span, img, title, subTitle, isSort, icon, url } = col;
 
                   const product = products.find((product) => product.title === title);
+
                   const links = product?.links;
                   const newTitle = useT(title);
                   const newSubTitle = subTitle && useT(subTitle);
@@ -233,7 +243,14 @@ export function ProjectCard() {
                   >
                     {links ?
                       <ConfigProvider prefixCls="antd5">
-                        <Popover content={getContent(newTitle, newSubTitle, img, links)} >
+                        <Popover
+                          content={getContent({
+                            img,
+                            links,
+                            title: newTitle,
+                            subTitle: newSubTitle,
+                          })}
+                        >
                           {children}
                         </Popover>
                       </ConfigProvider> :