"use client";

import Link from "next/link";
import React, { useState, useEffect } from "react";
import InOtherApp from "@/components/InOtherApp";
import Image from "next/image";
import download_lefttop from "@/public/images/download_lefttop.png";
import download_righttop from "@/public/images/download_righttop.png";
import download_rightmedium from "@/public/images/download_rightmedium.png";
import download_leftbottom from "@/public/images/download_leftbottom.png";
import download_rightbottom from "@/public/images/download_rightbottom.png";
import slogan from "@/public/images/slogan.png";
import qrcode from "@/public/images/qrcode.png";
import Footer from "@/components/Footer";

export default function Home() {
  const [deviceType, setDeviceType] = useState("");
  useEffect(() => {
    const userAgent = navigator.userAgent;
    //区分设备类型
    if (/Android/i.test(userAgent)) {
      setDeviceType("Android");
    } else if (/iPhone|iPad|iPod/i.test(userAgent)) {
      setDeviceType("ios");
    } else {
      setDeviceType("pc");
    }
  }, []);
  return (
    <section className="flex flex-col container">
      <InOtherApp />
      <div className="absolute top-0 left-0 w-full h-full z-0">
        <Image
          className="absolute top-0 left-0 w-36"
          src={download_lefttop}
          alt=""
        />
        <Image
          className="absolute top-10 right-0 w-28"
          src={download_righttop}
          alt=""
        />
        <Image
          className="absolute top-64 right-0 w-24"
          src={download_rightmedium}
          alt=""
        />
        <Image
          className="absolute bottom-[17rem] left-0 w-32"
          src={download_leftbottom}
          alt=""
        />
        <Image
          className="absolute bottom-0 right-0 w-[21rem]"
          src={download_rightbottom}
          alt=""
        />
      </div>
      <div className="flex flex-col flex-1 items-center mt-48 gap-10 z-10">
        <Image className="w-96" src={slogan} priority alt="" />
        <p className="text-white text-xl font-medium">
          系统维护升级中，请耐心等待。
        </p>
      </div>
      <Footer />
    </section>
  );
}
