From e0ca2f57253312c874bc3051c724d464a141d41f Mon Sep 17 00:00:00 2001
From: yujiangping <yujiangping@taofen8.com>
Date: Tue, 13 Jan 2026 18:17:21 +0800
Subject: [PATCH] feat(version-card): update version information display
 structure

- Update versionResponse interface to include structured introduction object with releaseDate, upgradePosition, and coreUpgrades fields
- Refactor VersionCard component to display version details as separate paragraphs with improved layout
- Change introduction from string to object with nested properties for better data organization
- Remove unused Button and arrowRight imports from VersionCard component
- Add file header documentation comment to VersionCard component
- Remove debugger statement from TopCardList component
- Update styling to use flex-col layout and improve spacing with gap-2 class
- Map through coreUpgrades array to display each upgrade as individual paragraph items
- Improve version information presentation with clearer visual hierarchy
---
 web/src/api/common.ts                         |  6 ++-
 .../Index/components/TopCardList/index.tsx    |  1 -
 .../views/Index/components/VersionCard.tsx    | 42 +++++++++++++++----
 3 files changed, 38 insertions(+), 11 deletions(-)

diff --git a/web/src/api/common.ts b/web/src/api/common.ts
index 025dcb4d..18ad43be 100644
--- a/web/src/api/common.ts
+++ b/web/src/api/common.ts
@@ -25,7 +25,11 @@ export interface DataResponse {
 }
 export interface versionResponse{
   version: string;
-  introduction: string;
+  introduction: {
+    releaseDate: string;
+    upgradePosition: string;
+    coreUpgrades: string[];
+  };
 }
 // 首页数据统计
 export const getDashboardData = `/home-page/workspaces`
diff --git a/web/src/views/Index/components/TopCardList/index.tsx b/web/src/views/Index/components/TopCardList/index.tsx
index fbc434fd..273ce936 100644
--- a/web/src/views/Index/components/TopCardList/index.tsx
+++ b/web/src/views/Index/components/TopCardList/index.tsx
@@ -59,7 +59,6 @@ const list = [
 ]
 const TopCardList: FC<{data?: DataResponse}> = ({ data }) => {
   const { t } = useTranslation()
-  debugger
   return (
     <div className="rb:grid rb:grid-cols-4 rb:gap-[16px]">
       {list.map((item) => {
diff --git a/web/src/views/Index/components/VersionCard.tsx b/web/src/views/Index/components/VersionCard.tsx
index 9b7af54a..234a8f3e 100644
--- a/web/src/views/Index/components/VersionCard.tsx
+++ b/web/src/views/Index/components/VersionCard.tsx
@@ -1,7 +1,15 @@
+/*
+ * @Description: 
+ * @Version: 0.0.1
+ * @Author: yujiangping
+ * @Date: 2026-01-12 16:34:59
+ * @LastEditors: yujiangping
+ * @LastEditTime: 2026-01-13 17:23:31
+ */
 import React, { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import { Button } from 'antd';
-import arrowRight from '@/assets/images/index/arrow_right.svg'
+// import { Button } from 'antd';
+// import arrowRight from '@/assets/images/index/arrow_right.svg'
 import { getVersion, type versionResponse } from '@/api/common'
 
 const GuideCard: React.FC = () => {
@@ -27,20 +35,36 @@ const GuideCard: React.FC = () => {
     
   return (
     <div className='rb:w-full rb:p-4 rb:border-1 rb:border-[#DFE4ED] rb:bg-[#FBFDFF] rb:rounded-xl'>
-        <div className='rb:flex rb:items-center rb:justify-start rb:text-[#5B6167] rb:text-base rb:font-semibold'>
+        <div className='rb:flex rb:items-center rb:justify-start rb:text-[#5B6167] rb:text-base rb:font-semibold rb:gap-2'>
             { t('index.latestUpdate')}
-            {versionInfo && (
-              <span className='rb:ml-2 rb:text-sm rb:text-[#1890FF]'>
+            {versionInfo && (<>              
+              <span className='rb:text-sm rb:text-[#1890FF]'>
                 {versionInfo.version}
               </span>
-            )}
+              
+            </>)}
         </div>
-        <div className='rb:flex rb:text-xs rb:text-[#5B6167] rb:leading-[18px] rb:mt-3 rb:pl-2'>
-            {loading ? (
+        <div className='rb:flex rb:flex-col rb:text-xs rb:text-[#5B6167] rb:leading-[18px] rb:mt-3 rb:pl-2'>
+            {versionInfo && (<>  
+              <p className='rb:text-xs rb:text-[#5B6167]'>
+                  {/* <span className='rb:text-sm rb:text-[#1890FF]'> */}
+                    {versionInfo.introduction?.releaseDate}
+                  {/* </span> */}
+              </p>
+              <p className='rb:text-xs rb:text-[#5B6167]'>  
+                  {versionInfo.introduction?.upgradePosition}
+              </p>
+              {versionInfo.introduction?.coreUpgrades?.map((item) => (
+                  <p className='rb:text-xs rb:text-[#5B6167]'>
+                    {item}
+                  </p>
+              ))}
+            </>)}
+            {/* {loading ? (
               t('index.loading')
             ) : (
               versionInfo?.introduction || t('index.latestUpdateDesc')
-            )}
+            )} */}
         </div>
         {/* <div className='rb:flex rb:w-full rb:items-center rb:justify-between rb:gap-3 rb:mt-4'>
             <Button className='rb:gap-2 rb:flex rb:items-center rb:text-[#212332] '>