Feat/UI enhancement (#28)

* feat: logo title update

* feat: add app table in home screen

* feat: bind status

app/(tourist)/layout.tsx

@@ -1,22 +1,7 @@
-"use client";
-
 import { ReactNode, useEffect } from "react";
-import { useRouter } from "next/navigation";
-import { getUserInfo } from "@/lib/apis/user";
 
 const AuthGuard = (props: { children: ReactNode }) => {
   const { children } = props;
-  // const router = useRouter();
-
-  // useEffect(() => {
-  //   if (localStorage.getItem("Token")) {
-  //     getUserInfo()
-  //       .then((res) => {
-  //         if (res.data.Success) router.replace("/home");
-  //       })
-  //       .catch();
-  //   }
-  // }, [router]);
 
   return <>{children}</>;
 };

app/(user)/home/@appPanel/page.module.scss

@@ -94,7 +94,6 @@
   justify-items: center;
   width: 100%;
   max-height: calc(100vh - 270px);
-  overflow-y: auto;
   @media screen and (min-width: 500px) {
     grid-template-columns: 1fr 1fr 1fr 1fr;
   }

app/(user)/home/@getInfo/default.tsx

@@ -31,11 +31,6 @@ const GetInfo = () => {
     if (localStorage.getItem("Token") === null) {
       return router.replace("/login");
     }
-    // getUserProfile().then((res) => {
-    //   if (res.data.Success === true) {
-    //     dispatch(setUserBasicInfo(res.data.Data));
-    //   } else router.replace("/login");
-    // });
   }, [dispatch, router]);
   return <></>;
 };

app/(user)/home/@infoPanel/page.module.scss

@@ -33,7 +33,7 @@
   position: fixed;
   top: 150px;
   right: 0;
-  z-index: 10;
+  z-index: 50;
 
   display: flex;
   flex-direction: column;

app/(user)/home/@profilePanel/default.tsx

@@ -16,11 +16,15 @@ import { BindAppItem } from "@/components/bindItem";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
 import { useAppSelector } from "@/redux";
+import useSWR from "swr";
+import { getUserBindStatus } from "@/lib/apis/user";
 
 const ProfilePanel = () => {
   const userBasicInfo = useAppSelector((state) => state.userBasicInfo);
-  // console.log(userBasicInfo);
   const pathname = usePathname();
+  const { data } = useSWR("bindStatus", () =>
+    getUserBindStatus().then((res) => res.data.Data),
+  );
   return (
     <>
       <div
@@ -79,25 +83,25 @@ const ProfilePanel = () => {
         <BindAppItem
           bindAppIconProps={qqIcon}
           bindAppTitle={"QQ"}
-          binded={false}
+          binded={data?.includes("qq") ?? false}
         />
 
         <BindAppItem
           bindAppIconProps={feishuIcon}
           bindAppTitle={"SAST 飞书"}
-          binded={false}
+          binded={data?.includes("lark") ?? false}
         />
 
         <BindAppItem
           bindAppIconProps={msIcon}
           bindAppTitle={"Microsoft"}
-          binded={false}
+          binded={data?.includes("microsoft") ?? false}
         />
 
         <BindAppItem
           bindAppIconProps={githubIcon}
           bindAppTitle={"GutHub"}
-          binded={false}
+          binded={data?.includes("github") ?? false}
         />
       </div>
     </>

app/(user)/home/layout.tsx

@@ -4,6 +4,12 @@ import { TopBar } from "@/components/topbar";
 import classNames from "classnames";
 import styles from "./page.module.scss";
 import PageTransition from "@/components/pageTransition";
+import { Metadata } from "next";
+
+export const metadata: Metadata = {
+  title: "用户中心 | SAST Link",
+  description: "OAuth of SAST",
+};
 
 const Layout = (props: {
   children: ReactNode;
@@ -19,7 +25,7 @@ const Layout = (props: {
       <TopBar />
       {getInfo}
       <PageTransition
-        className="flex w-full justify-center px-5"
+        className="flex w-screen justify-center px-5"
         position="bottomToTop"
       >
         <div className={classNames(styles.homeContainer)}>

app/(user)/home/page.tsx

@@ -36,23 +36,23 @@ const Home = () => {
           <Link href="https://fc.sast.fun">
             <MagicCard className="p-4 grid place-content-center">
               <div className="flex flex-col gap-2 items-center">
-                <Image src={fc} alt={"approve system"} />
+                <Image width={45} height={45} src={fc} alt={"sastoj"} />
                 <span className={styles.appName}>SASTOJ</span>
               </div>
             </MagicCard>
           </Link>
           <Link href="https://sastimg.mxte.cc">
             <MagicCard className="p-4 grid place-content-center">
               <div className="flex flex-col gap-2 items-center">
-                <Image src={seeing} alt={"approve system"} />
+                <Image src={seeing} alt={"sast image"} />
                 <span className={styles.appName}>视觉科协</span>
               </div>
             </MagicCard>
           </Link>
           <Link href="https://evento.sast.fun">
             <MagicCard className="p-4 grid place-content-center">
               <div className="flex flex-col gap-2 items-center">
-                <Image src={evento} alt={"approve system"} />
+                <Image src={evento} alt={"sast evento"} />
                 <span className={styles.appName}>SAST Evento</span>
               </div>
             </MagicCard>

app/layout.tsx

@@ -5,7 +5,7 @@ import { ReduxProvider } from "@/redux/reduxProvider";
 import { SWRProvider } from "@/components/swrProvider";
 import "./globals.scss";
 
-const metadata = {
+export const metadata: Metadata = {
   title: "SAST Link",
   description: "OAuth of SAST",
 };

lib/apis/user.ts

@@ -94,3 +94,9 @@ export function uploadAvatar(file: Blob) {
     { headers: { Token: JSON.parse(localStorage.getItem("Token") ?? "") } },
   );
 }
+
+export function getUserBindStatus() {
+  return apis.get<ResType<string[]>>("/apis/profile/bindStatus", {
+    headers: { Token: JSON.parse(localStorage.getItem("Token") ?? "") },
+  });
+}

next.config.mjs

@@ -6,7 +6,7 @@ const nextConfig = {
     return [
       {
         source: "/apis/:slug*",
-        destination: `http://81.68.225.220:8080/api/v1/:slug*`,
+        destination: `http://localhost:8080/api/v1/:slug*`,
       },
     ];
   },