Files
schisandra-cloud-storage-fr…/src/components/LoadingPage/index.tsx
2024-05-29 21:33:58 +08:00

73 lines
2.2 KiB
TypeScript

/** @format */
import { useEffect } from "react";
import "./index.less";
import { useNavigate, useSearchParams } from "react-router-dom";
import useStore from "@/utils/store/useStore.tsx";
import { observer } from "mobx-react";
import { setStorage } from "@/utils/localStorage/config.ts";
const LoadingPage = () => {
const [search] = useSearchParams();
const navigate = useNavigate();
const token: any = search.get("token");
const userId: any = search.get("userId");
const store = useStore("user");
store.setToken(token);
store.setUserId(userId);
setStorage("token", token, 24 * 60 * 30);
useEffect(() => {
document.body.classList.add("loading-body");
if (store.getToken() !== null && store.getUserId() !== null) {
navigate("/main");
}
return () => {
document.body.classList.remove("loading-body");
};
}, []);
return (
<>
<svg className="gegga">
<defs>
<filter id="gegga">
<feGaussianBlur
in="SourceGraphic"
stdDeviation="7"
result="blur"></feGaussianBlur>
<feColorMatrix
in="blur"
mode="matrix"
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 20 -10"
result="inreGegga"></feColorMatrix>
<feComposite
in="SourceGraphic"
in2="inreGegga"
operator="atop"></feComposite>
</filter>
</defs>
</svg>
<svg className="snurra" width="200" height="200" viewBox="0 0 200 200">
<defs>
<linearGradient id="linjärGradient">
<stop className="stopp1" offset="0"></stop>
<stop className="stopp2" offset="1"></stop>
</linearGradient>
<linearGradient
y2="160"
x2="160"
y1="40"
x1="40"
gradientUnits="userSpaceOnUse"
id="gradient"
xlinkHref="#linjärGradient"></linearGradient>
</defs>
<path
className="halvan"
d="m 164,100 c 0,-35.346224 -28.65378,-64 -64,-64 -35.346224,0 -64,28.653776 -64,64 0,35.34622 28.653776,64 64,64 35.34622,0 64,-26.21502 64,-64 0,-37.784981 -26.92058,-64 -64,-64 -37.079421,0 -65.267479,26.922736 -64,64 1.267479,37.07726 26.703171,65.05317 64,64 37.29683,-1.05317 64,-64 64,-64"></path>
<circle className="strecken" cx="100" cy="100" r="64"></circle>
</svg>
</>
);
};
export default observer(LoadingPage);