"use client";

import React from "react";
import { useRouter } from "next/navigation";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import {
  faAngleLeft,
  faTv,
  faImages,
  faSpa,
} from "@fortawesome/free-solid-svg-icons";
export default function Editprofile() {
  const router = useRouter();

  return (
    <div>
      {/* 头部标题 */}
      <div className="p-4 fixed top-0 z-10 w-full bg-black">
        <div className="w-9 h-9 flex items-center justify-center bg-[#FFFFFF1A] rounded-full absolute">
          <FontAwesomeIcon
            icon={faAngleLeft}
            style={{ maxWidth: "12px" }}
            size="xl"
            onClick={() => {
              router.back();
            }}
          />
        </div>
        <p className="text-base text-center leading-9">编辑资源</p>
      </div>
      {/* 内容 */}
      <div className="mt-16 pt-6 p-4 grid grid-cols-2 gap-6">
        <div
          className="flex flex-col justify-center items-center"
          onClick={() => {
            router.push("editprofile/editHome");
          }}
        >
          <FontAwesomeIcon
            icon={faSpa}
            style={{ maxWidth: "34px", height: "40px" }}
            size="2xl"
          />
          <span className="text-[#FFFFFF80] font-medium text-sm mt-2">
            编辑主页
          </span>
        </div>
        <div
          className="flex flex-col justify-center items-center"
          onClick={() => {
            router.push("editprofile/editPlace");
          }}
        >
          <FontAwesomeIcon
            icon={faTv}
            style={{ maxWidth: "34px", height: "40px" }}
            size="2xl"
          />
          <span className="text-[#FFFFFF80] font-medium text-sm mt-2">
            编辑平台
          </span>
        </div>
        <div
          className="flex flex-col justify-center items-center"
          onClick={() => {
            router.push("/space/setting/spaceIntroSetting/editStreamerMedia");
          }}
        >
          <FontAwesomeIcon
            icon={faImages}
            style={{ maxWidth: "34px", height: "40px" }}
            size="2xl"
          />
          <span className="text-[#FFFFFF80] font-medium text-sm mt-2">
            照片墙
          </span>
        </div>
      </div>
    </div>
  );
}