feat(components): 添加开发历程组件- 新增 Development 组件，用于展示网站的发展历程

- 通过 serverGet 请求获取发展历史数据- 实现时间轴布局，展示每个年份的重要事件和描述- 添加背景图案和样式，提升视觉效果

src/components/about/Development.tsx

@@ -0,0 +1,58 @@
+import React from 'react';
+import {serverGet} from "@/utils/request";
+
+async function Development() {
+  const res = await serverGet<{year:number,processDescription:string}[]>("/webSite/getDevelopmentHistory")
+  const list = res.data.map(item => ({
+    year: item.year,
+    description: item.processDescription
+  }))
+  return (
+    <>
+      <div
+        className="relative overflow-hidden backdrop-blur-sm bg-gradient-to-r from-gray-200/20 to-gray-300/20 rounded-lg">
+        {/* Background geometric patterns */}
+        <div className="absolute inset-0 opacity-10">
+          <div className="absolute top-20 left-10 w-32 h-32 border-2 border-white/20 rotate-45"></div>
+          <div className="absolute top-40 right-20 w-24 h-24 border-2 border-white/15 rotate-12"></div>
+          <div className="absolute bottom-32 left-1/4 w-40 h-40 border-2 border-white/10 -rotate-12"></div>
+          <div className="absolute bottom-20 right-1/3 w-28 h-28 border-2 border-white/15 rotate-45"></div>
+          <div
+            className="absolute top-1/2 left-1/2 w-36 h-36 border-2 border-white/10 -rotate-45 transform -translate-x-1/2 -translate-y-1/2"></div>
+        </div>
+
+        {/* Timeline container */}
+        <div className="relative z-10 flex items-center justify-center px-8 py-16">
+          <div className="w-full max-w-7xl">
+            {/* Timeline line and dots */}
+            <div className="relative mb-16">
+              {/* Horizontal line */}
+              {/*<div className="absolute top-1/2 left-0 right-0 h-0.5 bg-white/30 transform -translate-y-1/2"></div>*/}
+
+              {/* Timeline items */}
+              <div className="flex justify-between items-center relative flex-wrap">
+                {list.map((item, index) => (
+                  <div key={index} className="flex flex-col items-center relative w-1/4">
+                    {/* Dot */}
+                    <div
+                      className="w-4 h-4 bg-white rounded-full border-4 border-blue-600 relative z-10 mb-8"></div>
+
+                    {/* Year */}
+                    <div className="text-white text-2xl font-bold mb-4 text-center">{item.year}</div>
+
+                    {/* Description */}
+                    <div className="text-white/90 w-full h-40 text-sm leading-relaxed max-w-xs text-center px-4 border-t-2 border-solid border-gray-300 pt-2">
+                      {item.description}
+                    </div>
+                  </div>
+                ))}
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </>
+  );
+}
+
+export default Development;