Ver Fonte

feat(components): 添加荣誉资质组件- 新增 Honor 组件用于展示荣誉资质信息
- 实现了荣誉资质的分页和轮播功能
- 添加了荣誉资质相关类型定义

nahida há 8 meses atrás
pai
commit
37e347f7fc
2 ficheiros alterados com 96 adições e 0 exclusões
  1. 57 0
      src/components/about/Honor.tsx
  2. 39 0
      src/types/index.ts

+ 57 - 0
src/components/about/Honor.tsx

@@ -0,0 +1,57 @@
+'use client'
+import React from 'react';
+import {Carousel, Tabs, TabsProps} from "antd";
+import Image from "next/image";
+
+function Honor({honorList}: {honorList: HonorInfo[]}) {
+  const BASE_URL = process.env.NEXT_PUBLIC_BASE_URL;
+  function CategoryCarousel({ images }: { images: Array<{ id: string; url: string;}> }) {
+    // 将图片按每页3个分组
+    const imageGroups = []
+    for (let i = 0; i < images.length; i += 3) {
+      imageGroups.push(images.slice(i, i + 3))
+    }
+
+    return (
+      <div className="relative">
+        <Carousel arrows dots={true} infinite={false}>
+          {imageGroups.map((group, groupIndex) => (
+            <div key={groupIndex}>
+              <div className="grid grid-cols-1 sm:grid-cols-3 gap-6 p-4">
+                {group.map((image) => (
+                  <div key={image.id} className="relative group">
+                    <div className="bg-white rounded-lg shadow-md overflow-hidden hover:shadow-lg transition-shadow duration-300">
+                      <Image
+                        src={ BASE_URL + image.url || "/placeholder.svg"}
+                        alt={"证书"}
+                        width={400}
+                        height={300}
+                        className="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300"
+                      />
+                      <div className="p-4">
+                        <p className="text-sm text-gray-600 text-center">证书</p>
+                      </div>
+                    </div>
+                  </div>
+                ))}
+              </div>
+            </div>
+          ))}
+        </Carousel>
+      </div>
+    )
+  }
+
+  const tabItems: TabsProps["items"] = honorList.map((honor,index) => ({
+    key: honor.id || index.toString(),
+    label: honor.certificateType || "未知",
+    children: <CategoryCarousel images={honor.fileList || []} />,
+  }))
+  return (
+    <>
+      <Tabs defaultActiveKey="honor" items={tabItems} className="w-full" centered/>
+    </>
+  );
+}
+
+export default Honor;

+ 39 - 0
src/types/index.ts

@@ -7,4 +7,43 @@ interface Feature {
   title: string
   subtitle: string
   href: string
+}
+interface Page<T>{
+  records: T[];
+  total: number;
+  size: number;
+  current: number;
+}
+interface RecruitmentInfo {
+  id: string;
+  jobOpenings: string;        // 职位名称
+  keyTerms: string;           // 关键词
+  jobRequirements: string;    // 职位要求
+  numberRecruits: number;     // 招聘人数 (改为数字类型)
+  salary: string;             // 薪资
+  workLocation: string;       // 工作地点
+  contact: string;            // 联系人
+  contactInformation: string; // 联系方式
+  remarks: string;            // 备注
+  createBy: string | null;    // 创建人
+  createTime: string;         // 创建时间 (ISO 8601 格式)
+  updateBy: string | null;    // 更新人
+  updateTime: string;         // 更新时间 (ISO 8601 格式)
+}
+
+interface HonorInfo {
+  /**
+   * 荣誉资质ID
+   */
+  id?: string;
+
+  /**
+   * 证书类型
+   */
+  certificateType?: string;
+
+  /**
+   * 文件列表
+   */
+  fileList?: {id: string; url: string;}[];
 }