对接友情链接

src/pages/index/Link.tsx

@@ -1,14 +1,30 @@
 import React from 'react';
-const LinkComponent: React.FC = () => {
+import { Select } from 'antd';
+
+const LinkComponent: React.FC<{ links: API.CoscoPortalsLinksClassification }> = ({ links }) => {
+  console.log(links);
   return (
     <div className="link">
       <div>友情链接</div>
       <div className="flex">
-        <a href="https://www.baidu.com">百度</a>
-        <a href="https://www.baidu.com">百度</a>
-        <a href="https://www.baidu.com">百度</a>
-        <a href="https://www.baidu.com">百度</a>
-        <a href="https://www.baidu.com">百度</a>
+        {links.map((link) => (
+          <>
+            {link.links.length > 0 && (
+              <Select
+                style={{ width: 200 }}
+                size="small"
+                placeholder={link.name}
+                options={link.links.map((item) => ({
+                  label: item.name,
+                  value: item.url,
+                }))}
+                onChange={(value) => {
+                  window.open(value as string, '_blank');
+                }}
+              />
+            )}
+          </>
+        ))}
       </div>
     </div>
   );

src/pages/index/index.less

@@ -42,6 +42,7 @@
 .link {
   display: flex;
   margin-top: 10px;
+  align-items: center;
   .flex {
     margin-left: 10px;
     display: flex;

src/pages/index/index.tsx

@@ -8,6 +8,7 @@ import { getCoscoPortalsLinksClassification } from '@/servers/api';
 const IndexPage: React.FC = () => {
   const intl = useIntl();
   const [noticeLoading, setNoticeLoading] = useState(false);
+  const [links, setLinks] = useState<API.CoscoPortalsLinksClassification>([]);
   const [noticeList, setNoticeList] = useState([
     {
       title: 'CA使用通知',
@@ -155,7 +156,8 @@ const IndexPage: React.FC = () => {
 
   useEffect(() => {
     getCoscoPortalsLinksClassification().then((res) => {
-      console.log(res);
+      setLinks(res.data);
+      console.log(res.data);
     });
   }, []);
 
@@ -249,7 +251,7 @@ const IndexPage: React.FC = () => {
       </div>
 
       <div>
-        <LinkComponent />
+        <LinkComponent links={links} />
       </div>
     </div>
   );