✨ 更换web界面

web/src/contexts/StatusContext.js

@@ -0,0 +1,63 @@
+import { useEffect, useCallback, createContext } from 'react';
+import { API } from 'utils/api';
+import { showNotice } from 'utils/common';
+import { SET_SITE_INFO } from 'store/actions';
+import { useDispatch } from 'react-redux';
+
+export const LoadStatusContext = createContext();
+
+// eslint-disable-next-line
+const StatusProvider = ({ children }) => {
+  const dispatch = useDispatch();
+
+  const loadStatus = useCallback(async () => {
+    const res = await API.get('/api/status');
+    const { success, data } = res.data;
+    let system_name = '';
+    if (success) {
+      if (!data.chat_link) {
+        delete data.chat_link;
+      }
+      localStorage.setItem('siteInfo', JSON.stringify(data));
+      localStorage.setItem('quota_per_unit', data.quota_per_unit);
+      localStorage.setItem('display_in_currency', data.display_in_currency);
+      dispatch({ type: SET_SITE_INFO, payload: data });
+      if (
+        data.version !== process.env.REACT_APP_VERSION &&
+        data.version !== 'v0.0.0' &&
+        data.version !== '' &&
+        process.env.REACT_APP_VERSION !== ''
+      ) {
+        showNotice(`新版本可用：${data.version}，请使用快捷键 Shift + F5 刷新页面`);
+      }
+      if (data.system_name) {
+        system_name = data.system_name;
+      }
+    } else {
+      const backupSiteInfo = localStorage.getItem('siteInfo');
+      if (backupSiteInfo) {
+        const data = JSON.parse(backupSiteInfo);
+        if (data.system_name) {
+          system_name = data.system_name;
+        }
+        dispatch({
+          type: SET_SITE_INFO,
+          payload: data
+        });
+      }
+      showError('无法正常连接至服务器！');
+    }
+
+    if (system_name) {
+      document.title = system_name;
+    }
+  }, [dispatch]);
+
+  useEffect(() => {
+    loadStatus().then();
+  }, [loadStatus]);
+
+  return <LoadStatusContext.Provider value={loadStatus}> {children} </LoadStatusContext.Provider>;
+};
+
+export default StatusProvider;

web/src/contexts/UserContext.js

@@ -0,0 +1,29 @@
+// contexts/User/index.jsx
+import React, { useEffect, useCallback, createContext, useState } from 'react';
+import { LOGIN } from 'store/actions';
+import { useDispatch } from 'react-redux';
+
+export const UserContext = createContext();
+
+// eslint-disable-next-line
+const UserProvider = ({ children }) => {
+  const dispatch = useDispatch();
+  const [isUserLoaded, setIsUserLoaded] = useState(false);
+
+  const loadUser = useCallback(() => {
+    let user = localStorage.getItem('user');
+    if (user) {
+      let data = JSON.parse(user);
+      dispatch({ type: LOGIN, payload: data });
+    }
+    setIsUserLoaded(true);
+  }, [dispatch]);
+
+  useEffect(() => {
+    loadUser();
+  }, [loadUser]);
+
+  return <UserContext.Provider value={{ loadUser, isUserLoaded }}> {children} </UserContext.Provider>;
+};
+
+export default UserProvider;