✨ feat(homepage): 优化服务分类展示逻辑

- 移除静态分类数据，仅使用动态数据渲染分类列表
- 修改分类图标展示方式，使用动态图片代替固定图标
- 更新图片路径为fullUrl以正确显示图片
- 添加图片加载失败处理，显示默认占位符
- 为分类名称添加文本溢出控制
- 统一分类背景色为蓝色主题色
- 优化导航路径处理，添加默认值

src/client/mobile/pages/NewHomePage.tsx

@@ -303,53 +303,14 @@ const NewHomePage: React.FC = () => {
     link: banner.linkUrl || '#'
   }));
 
-  // 转换分类图标数据
-  const categories = dynamicCategories.length > 0
-    ? dynamicCategories.map(category => ({
-        name: category.title,
-        icon: BriefcaseIcon, // 默认图标，后续可根据需要扩展
-        path: category.linkUrl || '/',
-        color: COLORS.accent.blue,
-        image: category.file?.path
-      }))
-    : [
-        {
-          name: '银龄岗位',
-          icon: BriefcaseIcon,
-          path: '/silver-jobs',
-          color: COLORS.accent.blue
-        },
-        {
-          name: '银龄人才',
-          icon: UserGroupIcon,
-          path: '/silver-talents',
-          color: COLORS.accent.green
-        },
-        {
-          name: '银龄智库',
-          icon: BookOpenIcon,
-          path: '/silver-wisdom',
-          color: COLORS.accent.red
-        },
-        {
-          name: '老年大学',
-          icon: AcademicCapIcon,
-          path: '/elderly-university',
-          color: COLORS.ink.dark
-        },
-        {
-          name: '时间银行',
-          icon: ClockIcon,
-          path: '/time-bank',
-          color: '#7c5c4a'
-        },
-        {
-          name: '政策资讯',
-          icon: NewspaperIcon,
-          path: '/policy-news',
-          color: COLORS.ink.deep
-        }
-      ];
+  // 转换分类图标数据 - 只使用动态数据
+  const categories = dynamicCategories.map(category => ({
+    name: category.title,
+    icon: BriefcaseIcon, // 默认图标，后续可根据需要扩展
+    path: category.linkUrl || '/',
+    color: COLORS.accent.blue,
+    image: category.file?.fullUrl
+  }));
 
   return (
     <div className="min-h-screen" style={{ backgroundColor: COLORS.ink.light }}>
@@ -466,10 +427,10 @@ const NewHomePage: React.FC = () => {
         {/* 服务分类 */}
         <div className="mt-4 px-4">
           <div className="grid grid-cols-3 gap-3">
-            {serviceCategories.map((category, index) => (
+            {categories.map((category, index) => (
               <button
                 key={index}
-                onClick={() => navigate(category.path)}
+                onClick={() => navigate(category.path || '/')}
                 className="flex flex-col items-center p-4 rounded-xl transition-all duration-300 hover:shadow-lg backdrop-blur-sm"
                 style={{
                   backgroundColor: 'rgba(255,255,255,0.7)',
@@ -479,11 +440,19 @@ const NewHomePage: React.FC = () => {
               >
                 <div
                   className="w-14 h-14 rounded-full flex items-center justify-center shadow-sm"
-                  style={{ backgroundColor: category.color, color: 'white' }}
+                  style={{ backgroundColor: COLORS.accent.blue, color: 'white' }}
                 >
-                  <category.icon className="w-6 h-6" />
+                  <img
+                    src={category.image || '/images/placeholder.jpg'}
+                    alt={category.name}
+                    className="w-8 h-8 object-cover rounded-full"
+                    onError={(e) => {
+                      (e.target as HTMLImageElement).style.display = 'none';
+                      (e.target as HTMLImageElement).parentElement!.innerHTML = '📱';
+                    }}
+                  />
                 </div>
-                <span className={`${FONT_STYLES.caption} mt-2`}>{category.name}</span>
+                <span className={`${FONT_STYLES.caption} mt-2 line-clamp-1`}>{category.name}</span>
               </button>
             ))}
           </div>