caszl-next/app/(introduce)/talents/researcher/page.tsx

import styles from "./page.module.scss";
import Link from "next/link";
import ArticleHeading from "@/app/_components/ArticleHeading";

const academicians = [
  {
    picture:
      "/uploads/image/20231030/8dbabce9-3454-4dab-b66f-34b30849db90.jpeg",
    name: "任以伟",
    link: "",
  },
  {
    picture:
      "/uploads/image/20231030/5d3c322f-8163-4034-b01e-8897f3ba9a7a.jpeg",
    name: "张炜",
    link: "",
  },
  {
    picture:
      "/uploads/image/20231030/63c2d39e-21c1-466f-b5fd-6f27e4ff1d43.jpeg",
    name: "石宇",
    link: "",
  },
  {
    picture:
      "/uploads/image/20231030/4f0f8923-a72f-4ea7-8333-fc98878a4fb3.jpeg",
    name: "裴得胜",
    link: "",
  },
  {
    picture:
      "/uploads/image/20231030/5e6dd527-5311-4444-b8ad-be597b57a724.jpeg",
    name: "宋立岩",
    link: "",
  },
  {
    picture:
      "/uploads/image/20231030/b3ab92e4-391e-49f3-956e-97bd2f8ebf94.jpeg",
    name: "陆文强",
    link: "",
  },
  {
    picture:
      "/uploads/image/20231030/d55d1de5-6c14-489d-b2ee-d62dd78d3478.jpeg",
    name: "王德强",
    link: "",
  },
];

const Page = () => {
  return (
    <>
      <ArticleHeading text={"研究员"} />
      <div className={`${styles.academicians} flex flex-wrap`}>
        {academicians.map((academician) => (
          <div
            key={academician.name}
            className={`${styles.academician} mb-4 flex w-1/5 flex-col items-center`}
          >
            <img
              className={"h-[138px]"}
              src={`${process.env.NEXT_PUBLIC_CLIENT_ADMIN_BASE_URL}${academician.picture}`}
            />
            <Link href={academician.link}>{academician.name}</Link>
          </div>
        ))}
      </div>
    </>
  );
};

export default Page;