Feat login page (#1473)

* feat: login

* feat: recommmit remove node-module

---------

Co-authored-by: yikai <yikai@didiglobal.com>
pull/1495/head
bobowiki 1 year ago committed by GitHub
parent 69648dfe1f
commit d645c49450
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

12
node_modules/.yarn-integrity generated vendored

@ -0,0 +1,12 @@
{
"systemParams": "darwin-arm64-93",
"modulesFolders": [
"node_modules"
],
"flags": [],
"linkedModules": [],
"topLevelPatterns": [],
"lockfileEntries": {},
"files": [],
"artifacts": {}
}

@ -26,5 +26,7 @@ module.exports = {
'@typescript-eslint/no-explicit-any': 0, '@typescript-eslint/no-explicit-any': 0,
'@typescript-eslint/no-non-null-assertion': 0, '@typescript-eslint/no-non-null-assertion': 0,
'@typescript-eslint/no-var-requires': 0, '@typescript-eslint/no-var-requires': 0,
'import/no-anonymous-default-export': 0,
'jsx-a11y/anchor-is-valid': 0,
}, },
}; };

@ -1,3 +1,4 @@
/.git /.git
node_modules node_modules
build build
src/lib/*

@ -1,4 +1,3 @@
// craco.config.js
const CracoLessPlugin = require('craco-less'); const CracoLessPlugin = require('craco-less');
const lessModuleRegex = /\.module\.less$/; const lessModuleRegex = /\.module\.less$/;
const path = require('path'); const path = require('path');
@ -33,25 +32,28 @@ module.exports = {
}, },
}, },
], ],
// style: {
// modules: {
// localIdentName: '[local]_[hash:base64:5]', // 可以自定义你的类名生成规则
// },
// },
webpack: { webpack: {
alias: { alias: {
'@': resolve('src'), '@': resolve('src'),
}, },
}, },
devServer: { devServer: {
port: 3001, port: 3000,
headers: { headers: {
'Access-Control-Allow-Origin': '*', 'Access-Control-Allow-Origin': '*',
}, },
proxy: { proxy: {
'/hippo4j': { '/hippo4j/v1/cs': {
target: 'http://console.hippo4j.cn', target: 'http://console.hippo4j.cn:6691/hippo4j/v1/cs',
pathRewrite: { '^/hippo4j/v1/cs': '' },
changeOrigin: true, changeOrigin: true,
secure: false,
onProxyReq: proxyReq => {
console.log(`Proxying request to: ${proxyReq.path}`);
},
onProxyRes: proxyRes => {
console.log(`Received response with status: ${proxyRes.statusCode}`);
},
}, },
}, },
}, },

@ -11,6 +11,7 @@
"@testing-library/user-event": "^13.5.0", "@testing-library/user-event": "^13.5.0",
"ahooks": "^3.7.8", "ahooks": "^3.7.8",
"antd": "^5.4.7", "antd": "^5.4.7",
"classnames": "^2.3.2",
"dayjs": "^1.11.9", "dayjs": "^1.11.9",
"i18next": "^23.5.1", "i18next": "^23.5.1",
"i18next-browser-languagedetector": "^7.1.0", "i18next-browser-languagedetector": "^7.1.0",
@ -69,6 +70,7 @@
"eslint-plugin-jsx-a11y": "^6.7.1", "eslint-plugin-jsx-a11y": "^6.7.1",
"eslint-plugin-prettier": "^4.2.1", "eslint-plugin-prettier": "^4.2.1",
"eslint-plugin-react": "^7.32.2", "eslint-plugin-react": "^7.32.2",
"http-proxy-middleware": "^2.0.6",
"husky": "^8.0.0", "husky": "^8.0.0",
"less-loader": "^11.1.0", "less-loader": "^11.1.0",
"lint-staged": "^13.2.2", "lint-staged": "^13.2.2",

@ -1,9 +1,6 @@
// import { Suspense } from 'react';
import LayoutCom from './components/layout-com'; import LayoutCom from './components/layout-com';
import { Routes, Route, Link } from 'react-router-dom'; import { Routes, Route, Link } from 'react-router-dom';
import routeList from './route'; import routeList from './route';
import Login from '@/page/login';
import { MenuProps } from 'antd'; import { MenuProps } from 'antd';
import { useTran } from './hooks'; import { useTran } from './hooks';
import { STR_MAP } from './config/i18n/locales/constants'; import { STR_MAP } from './config/i18n/locales/constants';
@ -24,9 +21,8 @@ const App = () => {
]; ];
return ( return (
<LayoutCom sideMenuList={sideMenuList} isSider={true} isHeader={true}> <LayoutCom sideMenuList={sideMenuList}>
<Routes> <Routes>
<Route path="/Login" Component={Login}></Route>
{routeList.map(item => ( {routeList.map(item => (
<Route key={item.path} path={item.path} Component={item.component} /> <Route key={item.path} path={item.path} Component={item.component} />
))} ))}

@ -5,7 +5,7 @@
.logo { .logo {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
width: 200px; width: 50px;
img { img {
flex: 1; flex: 1;
object-fit: contain; object-fit: contain;

@ -2,13 +2,16 @@ import React, { useContext } from 'react';
import style from './index.module.less'; import style from './index.module.less';
import { UserOutlined } from '@ant-design/icons'; import { UserOutlined } from '@ant-design/icons';
import { Avatar, Button, Col, Dropdown, Row, Switch } from 'antd'; import { Avatar, Button, Col, Dropdown, Row, Switch } from 'antd';
import { useThemeMode } from '@/hooks';
import { MyContext } from '@/context'; import { MyContext } from '@/context';
import IconFont from '@/components/icon'; import IconFont from '@/components/icon';
import { LANG_NAME, MyStoreValues, THEME_NAME } from '@/typings';
import { useNavigate } from 'react-router-dom';
const HeaderChild = () => { const HeaderChild = () => {
const { isDark, setIsDark } = useThemeMode(); const { lang, themeName, setLang, setThemeName } = useContext<MyStoreValues>(MyContext);
const { lang, setLang } = useContext<any>(MyContext); const navigate = useNavigate();
// console.log('setLang:::', setLang);
// setLang && setLang(LANG_NAME.EN);
const items = [ const items = [
{ {
@ -29,18 +32,14 @@ const HeaderChild = () => {
}, },
{ {
key: '3', key: '3',
label: ( label: <a onClick={() => navigate('/login')}></a>,
<a target="_blank" rel="noopener noreferrer" href="https://www.luohanacademy.com">
</a>
),
}, },
]; ];
return ( return (
<div className={style['header-wrapper']}> <div className={style['header-wrapper']}>
<div className={style['logo']}> <div className={style['logo']} onClick={() => navigate('/home')}>
<img src="https://demo.knowstreaming.com/layout/assets/image/ks-logo.png" alt="" /> <img src="https://nageoffer.com/img/logo3.png" alt="" />
</div> </div>
<div className={style['edit-container']}> <div className={style['edit-container']}>
<Row gutter={[16, 16]}> <Row gutter={[16, 16]}>
@ -51,18 +50,10 @@ const HeaderChild = () => {
</Dropdown> </Dropdown>
</Col> </Col>
<Col> <Col>
{/* <Tag
onClick={() => {
lang === 'zh' ? setLang('en') : setLang('zh');
}}
style={{ cursor: 'pointer' }}
>
{lang === 'zh' ? 'zh' : 'en'}
</Tag> */}
<Button <Button
type="link" type="link"
onClick={() => { onClick={() => {
lang === 'zh' ? setLang('en') : setLang('zh'); lang === LANG_NAME.EN ? setLang && setLang(LANG_NAME.ZH) : setLang && setLang(LANG_NAME.EN);
}} }}
> >
<IconFont type="icon-qiehuanyuyan"></IconFont> <IconFont type="icon-qiehuanyuyan"></IconFont>
@ -72,9 +63,9 @@ const HeaderChild = () => {
<Switch <Switch
checkedChildren={'🌞'} checkedChildren={'🌞'}
unCheckedChildren={'🌛'} unCheckedChildren={'🌛'}
defaultChecked={isDark} defaultChecked={themeName === THEME_NAME.DARK}
onChange={e => { onChange={e => {
setIsDark(e); setThemeName && setThemeName(e ? THEME_NAME.DARK : THEME_NAME.DEFAULT);
}} }}
></Switch> ></Switch>
</Col> </Col>

@ -12,10 +12,14 @@
padding-top: 24px; padding-top: 24px;
} }
.content { .content {
margin: 0;
border-radius: 12px 12px 0 0; border-radius: 12px 12px 0 0;
flex: 1; flex: 1;
padding: 16px; padding: 16px;
overflow-y: auto; overflow-y: auto;
} }
.pureContent {
border-radius: unset;
padding: 0;
}
} }

@ -1,10 +1,10 @@
import { useState, useContext, ReactNode, useEffect } from 'react'; import { useState, useContext, ReactNode, useEffect, useMemo } from 'react';
import { DefaultTheme, ThemeContext } from 'styled-components'; import { DefaultTheme, ThemeContext } from 'styled-components';
import { Layout, Menu, MenuProps } from 'antd'; import { Layout, Menu, MenuProps } from 'antd';
import HeaderChild from '../header'; import HeaderChild from '../header';
import style from './index.module.less'; import style from './index.module.less';
import { useLocation } from 'react-router-dom'; import { useLocation } from 'react-router-dom';
import { useThemeMode } from '@/hooks'; import classNames from 'classnames';
type MenuItem = Required<MenuProps>['items'][number]; type MenuItem = Required<MenuProps>['items'][number];
const { Header, Sider, Content } = Layout; const { Header, Sider, Content } = Layout;
@ -12,14 +12,11 @@ const { Header, Sider, Content } = Layout;
interface ILayoutCom { interface ILayoutCom {
children?: ReactNode; children?: ReactNode;
sideMenuList: MenuItem[]; sideMenuList: MenuItem[];
isSider?: boolean;
isHeader?: boolean;
} }
const LayoutCom = (props: ILayoutCom) => { const LayoutCom = (props: ILayoutCom) => {
const { sideMenuList, children, isSider = true, isHeader = true } = props; const { sideMenuList, children } = props;
const myThemes: DefaultTheme = useContext<any>(ThemeContext); const myThemes: DefaultTheme = useContext<any>(ThemeContext);
const [currentKey, setCurrentKey] = useState<string>(''); const [currentKey, setCurrentKey] = useState<string>('');
const { isDark } = useThemeMode();
const location = useLocation(); const location = useLocation();
useEffect(() => { useEffect(() => {
@ -32,7 +29,17 @@ const LayoutCom = (props: ILayoutCom) => {
useEffect(() => { useEffect(() => {
document.body.style.backgroundColor = myThemes.backgroundColor.bg1; document.body.style.backgroundColor = myThemes.backgroundColor.bg1;
}, [isDark, myThemes]); }, [myThemes]);
const isHeader = useMemo(() => {
const isHeader = location.pathname !== '/login';
return isHeader;
}, [location]);
const isSider = useMemo(() => {
const isSider = location.pathname !== '/login';
return isSider;
}, [location]);
return ( return (
<main className={style.container} style={{ backgroundColor: myThemes.backgroundColor.bg1 }}> <main className={style.container} style={{ backgroundColor: myThemes.backgroundColor.bg1 }}>
@ -42,7 +49,11 @@ const LayoutCom = (props: ILayoutCom) => {
</Header> </Header>
)} )}
<Layout <Layout
style={{ backgroundColor: myThemes.backgroundColor.bg1, height: `calc(100vh - ${isHeader ? '64px' : 0})` }} style={{
backgroundColor: myThemes.backgroundColor.bg1,
height: `calc(100vh - ${isHeader ? '64px' : '0px'})`,
margin: isHeader ? '10px 10px 0px' : '0px',
}}
> >
{isSider && ( {isSider && (
<Sider className={style.sider} style={{ backgroundColor: myThemes.backgroundColor.bg1 }} collapsible> <Sider className={style.sider} style={{ backgroundColor: myThemes.backgroundColor.bg1 }} collapsible>
@ -50,7 +61,9 @@ const LayoutCom = (props: ILayoutCom) => {
</Sider> </Sider>
)} )}
<Content <Content
className={style.content} className={classNames(style.content, {
[style.pureContent]: location.pathname === '/login',
})}
style={{ style={{
backgroundColor: myThemes.backgroundColor.bgContent, backgroundColor: myThemes.backgroundColor.bgContent,
height: `calc(100vh - ${isHeader ? '64px' : 0})`, height: `calc(100vh - ${isHeader ? '64px' : 0})`,

@ -1,12 +1,12 @@
import React, { useContext, useEffect, useState } from 'react'; import React, { useContext, useEffect, useState } from 'react';
import { DefaultTheme, ThemeProvider } from 'styled-components'; import { DefaultTheme, ThemeProvider } from 'styled-components';
import { ConfigProvider, theme } from 'antd'; import { ConfigProvider, theme } from 'antd';
import { darkAlgorithm } from '../../config/theme/dark-algorithm'; import { darkAlgorithm } from '../../config/theme/dark-algorithm';
import { defaultAlgorithm } from '../../config/theme/default-algnorithm'; import { defaultAlgorithm } from '../../config/theme/default-algnorithm';
import { lightDefaultTheme, darkDefaultTheme } from '../../config/theme'; import { lightDefaultTheme, darkDefaultTheme } from '../../config/theme';
import { MyContext, THEME_NAME } from '../../context'; import { MyContext } from '../../context';
import zhCN from 'antd/es/locale/zh_CN'; import zhCN from 'antd/es/locale/zh_CN';
import { THEME_NAME } from '@/typings';
interface ThemeProps { interface ThemeProps {
children: React.ReactNode; children: React.ReactNode;

@ -18,7 +18,7 @@ i18n
translation: en, translation: en,
}, },
}, },
debug: true, // debug: true,
fallbackLng: 'zh', // 默认语言 fallbackLng: 'zh', // 默认语言
interpolation: { interpolation: {
escapeValue: false, // 不转义HTML标签 escapeValue: false, // 不转义HTML标签

@ -7,31 +7,23 @@ import { darkDefaultTheme, lightDefaultTheme } from '@/config/theme';
import { defaultAlgorithm } from '@/config/theme/default-algnorithm'; import { defaultAlgorithm } from '@/config/theme/default-algnorithm';
import { darkAlgorithm } from '@/config/theme/dark-algorithm'; import { darkAlgorithm } from '@/config/theme/dark-algorithm';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { useLocalStorageState } from 'ahooks';
import { LANG_NAME, MyStoreValues, THEME_NAME } from '@/typings';
export enum THEME_NAME { export const MyContext = createContext<MyStoreValues>({});
DEFAULT = 'default',
DARK = 'dark',
}
export enum LANG_NAME {
ZH = 'zh',
EN = 'en',
}
export const MyContext = createContext<{
themeName: string;
lang: LANG_NAME;
setThemeName: (name: THEME_NAME) => void;
setLang: (lang: LANG_NAME) => void;
} | null>(null);
export const MyStore: React.FC<{ export const MyStore: React.FC<{
children: ReactNode; children: ReactNode;
}> = ({ children }) => { }> = ({ children }) => {
const [themeName, setThemeName] = useState<THEME_NAME>(THEME_NAME.DEFAULT); const [themeName, setThemeName] = useLocalStorageState<THEME_NAME>('current-mode', {
const [lang, setLang] = useState<LANG_NAME>(LANG_NAME.ZH); defaultValue: THEME_NAME.DEFAULT,
});
const [lang, setLang] = useLocalStorageState<LANG_NAME>('current-lang', {
defaultValue: LANG_NAME.ZH,
});
const [themes, setThemes] = useState(defaultAlgorithm); const [themes, setThemes] = useState(defaultAlgorithm);
const [myThemes, setMyThemes] = useState<DefaultTheme>(lightDefaultTheme); const [myThemes, setMyThemes] = useState<DefaultTheme>(lightDefaultTheme);
const { i18n } = useTranslation(); const { i18n } = useTranslation();
const changeMode = (themeName: THEME_NAME) => { const changeMode = (themeName: THEME_NAME) => {
@ -49,11 +41,10 @@ export const MyStore: React.FC<{
}; };
useEffect(() => { useEffect(() => {
changeMode(themeName); changeMode(themeName as THEME_NAME);
}, [themeName]); }, [themeName]);
useEffect(() => { useEffect(() => {
// change lang
i18n.changeLanguage(lang); i18n.changeLanguage(lang);
}, [lang, i18n]); }, [lang, i18n]);

@ -1,3 +1,2 @@
export * from './useThemeMode';
export * from './useTransLate'; export * from './useTransLate';
export * from './useFormToUrl'; export * from './useFormToUrl';

@ -1,14 +0,0 @@
import { useContext, useEffect } from 'react';
import { useLocalStorageState } from 'ahooks';
import { MyContext, THEME_NAME } from '@/context';
export const useThemeMode = (): { isDark: boolean | undefined; setIsDark: (isDark: boolean) => void } => {
const [isDark, setIsDark] = useLocalStorageState<boolean>('current-mode', { defaultValue: false });
const { setThemeName } = useContext<any>(MyContext);
useEffect(() => {
isDark ? setThemeName(THEME_NAME.DARK) : setThemeName(THEME_NAME.DEFAULT);
}, [isDark, setThemeName]);
return { isDark, setIsDark };
};

@ -1,16 +1,9 @@
import { Button, Calendar } from 'antd'; import { Button, Calendar } from 'antd';
import dayjs from 'dayjs'; import dayjs from 'dayjs';
import request from '@/utils';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
const Home = () => { const Home = () => {
const { t } = useTranslation(); const { t } = useTranslation();
const fetchdata = (body: { duid: string }) => {
return request<{ phone: string }>('https://mock.xiaojukeji.com/mock/16635/am/marketing/mis/member/archive/phone', {
method: 'post',
body,
});
};
return ( return (
<div style={{ color: 'red' }}> <div style={{ color: 'red' }}>

@ -0,0 +1,37 @@
.login-wrapper {
display: grid;
grid-template-columns: 1fr 550px;
grid-template-rows: 1fr;
height: 100%;
.login-bgi {
background: url('https://gw.alipayobjects.com/zos/rmsportal/FfdJeJRQWjEeGTpqgBKj.png') no-repeat fixed center center;
background-size: contain;
}
.login-form-wrapper {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
.img-wrapper {
width: 50px;
display: flex;
flex-direction: column;
img {
flex: 1;
object-fit: contain;
}
}
.tip {
margin-block-start: 12px;
margin-block-end: 36px;
}
.form-content {
width: 330px;
.login-edit {
display: flex;
justify-content: space-between;
align-items: center;
}
}
}
}

@ -1,6 +1,143 @@
import React from 'react'; import { useCallback, useMemo, useState } from 'react';
import { Typography, Tabs, TabsProps, Form, Input, Checkbox, Button, message } from 'antd';
import service from './service';
import { LockOutlined, UserOutlined } from '@ant-design/icons';
import style from './index.module.less';
import { useRequest } from 'ahooks';
import { setToken } from '@/utils';
import { useNavigate } from 'react-router-dom';
const { Paragraph } = Typography;
enum TABS_KEY {
LOGIN = 'login',
PHONE = 'phoneLogin',
}
const Login = () => { const Login = () => {
return <></>; const [form] = Form.useForm();
const navigate = useNavigate();
const { validateFields } = form;
const [remenberMe, setRemenberMe] = useState(0);
const { run, loading } = useRequest(service.fetchLogin, {
manual: true,
onSuccess: res => {
if (res) {
message.success('登陆成功');
navigate('/thread-poll/index');
setToken(res?.data);
}
},
});
const handleLogin = useCallback(() => {
validateFields()
.then(values => {
console.log('value:::', values, remenberMe);
run({
password: '1BsL68bUgS52alKirqFprU1QfWJyPFlb3dA2AzEMc6kMTpTHN1doEN4=',
rememberMe: 1,
tag: 'lw4xNmj6QuamOFsy',
username: 'baoxinyi_user',
});
})
.catch(err => console.log('err:::', err));
}, [remenberMe, validateFields, run]);
const formNode = useMemo(
() => (
<Form form={form}>
<Form.Item
name="username"
initialValue={'baoxinyi_user'}
rules={[
{
required: true,
message: '请输入用户名!',
},
]}
>
<Input
placeholder="用户名"
prefix={<UserOutlined className={'prefixIcon'} />}
size="large"
allowClear
></Input>
</Form.Item>
<Form.Item
name="password"
initialValue={'baoxinyi_user'}
rules={[
{
required: true,
message: '请输入密码!',
},
]}
>
<Input.Password
placeholder="密码"
prefix={<LockOutlined className={'prefixIcon'} />}
size="large"
allowClear
></Input.Password>
</Form.Item>
<Form.Item name="rememberMe">
<div className={style['login-edit']}>
<Checkbox
value={1}
checked
onChange={e => {
setRemenberMe(e.target.checked ? 1 : 0);
}}
>
</Checkbox>
<Button type="link"></Button>
</div>
</Form.Item>
<Form.Item>
<Button
htmlType="submit"
type="primary"
style={{ width: '100%' }}
size="large"
onClick={handleLogin}
loading={loading}
>
</Button>
</Form.Item>
</Form>
),
[form, loading, handleLogin]
);
const items: TabsProps['items'] = [
{
key: TABS_KEY.LOGIN,
label: '账号密码登陆',
children: formNode,
},
{
key: TABS_KEY.PHONE,
label: '手机号登陆',
children: formNode,
},
];
return (
<div className={style['login-wrapper']}>
<div className={style['login-bgi']}></div>
<div className={style['login-form-wrapper']}>
<div className={style['img-wrapper']}>
<img src="https://nageoffer.com/img/logo3.png" alt="" />
</div>
<Paragraph className={style['tip']}>线</Paragraph>
<div className={style['form-content']}>
<Tabs centered defaultActiveKey={TABS_KEY.LOGIN} items={items} />
</div>
</div>
</div>
);
}; };
export default Login; export default Login;

@ -0,0 +1,6 @@
import { IRouterList } from '@/typings';
import Login from '.';
const routerList: IRouterList[] = [{ path: '/login', component: Login }];
export default routerList;

@ -0,0 +1,13 @@
import request from '@/utils';
const fetchLogin = async (body: any) => {
const { data } = await request<{ data: string; roles: string[] }>('/hippo4j/v1/cs/auth/login', {
method: 'POST',
body,
});
return data;
};
export default {
fetchLogin,
};

@ -1,2 +1,3 @@
/// <reference types="react-scripts" /> /// <reference types="react-scripts" />
declare module '*.less'; declare module '*.less';
declare module 'crypto-browserify' {}

@ -3,9 +3,10 @@ import homeRouter from '@/page/home/router';
import aboutRouter from '@/page/about/router'; import aboutRouter from '@/page/about/router';
import ThreadPoolRouter from '@/page/thread-pool/router'; import ThreadPoolRouter from '@/page/thread-pool/router';
import tenantRouter from '@/page/tenant/router'; import tenantRouter from '@/page/tenant/router';
import LoginRouter from '@/page/login/router';
// import itemRouter from '@/page/item/router'; // import itemRouter from '@/page/item/router';
// import userRouter from '@/page/user/router'; // import userRouter from '@/page/user/router';
// import logRouter from '@/page/log/router'; // import logRouter from '@/page/log/router';
const routerList: IRouterList[] = [...homeRouter, ...aboutRouter, ...tenantRouter, ...ThreadPoolRouter]; const routerList: IRouterList[] = [...homeRouter, ...aboutRouter, ...tenantRouter, ...ThreadPoolRouter, ...LoginRouter];
export default routerList; export default routerList;

@ -1,6 +1,16 @@
import { ReactNode } from 'react'; import { ReactNode } from 'react';
import React from 'react'; import React from 'react';
export enum THEME_NAME {
DEFAULT = 'default',
DARK = 'dark',
}
export enum LANG_NAME {
ZH = 'zh',
EN = 'en',
}
export type IRouterList = { export type IRouterList = {
path: string; path: string;
component: () => React.JSX.Element; component: () => React.JSX.Element;
@ -11,3 +21,10 @@ export type IMenuList = {
key: string; key: string;
icon?: ReactNode; icon?: ReactNode;
}; };
export interface MyStoreValues {
themeName?: THEME_NAME | undefined;
lang?: LANG_NAME;
setThemeName?: (name: THEME_NAME) => void;
setLang?: (lang: LANG_NAME) => void;
}

@ -1,6 +1,44 @@
import Cookie from 'js-cookie';
// import { Buffer } from 'buffer';
// import crypto from 'crypto-browserify';
// /**
// * generate key
// * @returns {string} key(length 16)
// */
// export function genKey() {
// let chars = 'abcdefghijklmnopqrstuvwxyz0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ';
// let result = '';
// for (let i = 16; i > 0; --i) result += chars[Math.floor(Math.random() * chars.length)];
// return result;
// }
// /**
// * encode message
// * @param msg message
// * @param key key
// * @returns {string} encoded message
// */
// export function encrypt(msg: string, key: string) {
// try {
// let pwd = Buffer.from(key);
// let iv = (crypto as any).randomBytes(12);
// let cipher = (crypto as any).createCipheriv('aes-128-gcm', pwd, iv);
// let enc = cipher.update(msg, 'utf8', 'base64');
// enc += cipher.final('base64');
// let tags = cipher.getAuthTag();
// enc = Buffer.from(enc, 'base64') as any;
// let totalLength = iv.length + enc.length + tags.length;
// let bufferMsg = Buffer.concat([iv, enc as any, tags], totalLength);
// return bufferMsg.toString('base64');
// } catch (e) {
// console.log('Encrypt is error', e);
// return null;
// }
// }
import _ from 'lodash'; import _ from 'lodash';
// is plain object // is plain object
const TokenKey = 'Admin-Token';
const isPlainObject = (obj: { [key: string]: any }): boolean => { const isPlainObject = (obj: { [key: string]: any }): boolean => {
let proto, Ctor; let proto, Ctor;
if (!obj || typeof obj !== 'object') return false; if (!obj || typeof obj !== 'object') return false;
@ -10,6 +48,10 @@ const isPlainObject = (obj: { [key: string]: any }): boolean => {
return typeof Ctor === 'function' && Ctor === Object; // insure is new by Object or {} return typeof Ctor === 'function' && Ctor === Object; // insure is new by Object or {}
}; };
const setToken = (token: string) => {
Cookie.set(TokenKey, token);
};
/** /**
* @description object value * @description object value
* @param obj * @param obj
@ -37,4 +79,4 @@ const isEmpty = (value: any) => {
return typeof value === 'object' ? _.isEmpty(value) : isNilValue(value); return typeof value === 'object' ? _.isEmpty(value) : isNilValue(value);
}; };
export { isPlainObject, isEmpty, filterEmptyField }; export { isPlainObject, isEmpty, filterEmptyField, setToken };

@ -32,7 +32,7 @@ type Response<T = any> = {
code?: string | number; code?: string | number;
}; };
let baseURL = 'http://console.hippo4j.cn'; let baseURL = '';
const inital: RequestOptions = { const inital: RequestOptions = {
method: 'GET', method: 'GET',
@ -40,6 +40,8 @@ const inital: RequestOptions = {
body: null, body: null,
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
Authorization:
'Bearer eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiIxMCxiYW94aW55aV91c2VyIiwiaXNzIjoiYWRtaW4iLCJleHAiOjE2OTU3MzAwNzYsImlhdCI6MTY5NTEyNTI3Niwicm9sIjoiUk9MRV9VU0VSIn0.4cWyhllP7u-aoRAIHs3nMggsgl4-LUCVBas8WE0FJYIe-YNS0wGf1_0RJq3TUGw00KmSaSRPKdoPgRTFqEphZA',
}, },
credentials: true, credentials: true,
responseType: 'JSON', responseType: 'JSON',
@ -117,6 +119,7 @@ function request<T>(url: string, config: RequestOptions): Promise<Response<T>> {
return fetch(url, config as any).then(function onfulfilled(response) { return fetch(url, config as any).then(function onfulfilled(response) {
let { status, statusText } = response; let { status, statusText } = response;
console.log('status:::', status, response);
if (status >= 200 && status < 400) { if (status >= 200 && status < 400) {
let result; let result;
switch (responseType) { switch (responseType) {

@ -1196,7 +1196,7 @@
resolved "https://registry.npmmirror.com/@babel/regjsgen/-/regjsgen-0.8.0.tgz#f0ba69b075e1f05fb2825b7fad991e7adbb18310" resolved "https://registry.npmmirror.com/@babel/regjsgen/-/regjsgen-0.8.0.tgz#f0ba69b075e1f05fb2825b7fad991e7adbb18310"
integrity sha512-x/rqGMdzj+fWZvCOYForTghzbtqPDZ5gPwaoNGHdgDfF2QA/XZbCBp4Moo5scrkAMPhB7z26XM/AaHuIJdgauA== integrity sha512-x/rqGMdzj+fWZvCOYForTghzbtqPDZ5gPwaoNGHdgDfF2QA/XZbCBp4Moo5scrkAMPhB7z26XM/AaHuIJdgauA==
"@babel/runtime@^7.10.1", "@babel/runtime@^7.10.4", "@babel/runtime@^7.11.1", "@babel/runtime@^7.11.2", "@babel/runtime@^7.12.5", "@babel/runtime@^7.16.3", "@babel/runtime@^7.16.7", "@babel/runtime@^7.18.0", "@babel/runtime@^7.18.3", "@babel/runtime@^7.19.4", "@babel/runtime@^7.20.0", "@babel/runtime@^7.20.7", "@babel/runtime@^7.21.0", "@babel/runtime@^7.22.5", "@babel/runtime@^7.8.4", "@babel/runtime@^7.9.2": "@babel/runtime@^7.10.1", "@babel/runtime@^7.10.4", "@babel/runtime@^7.11.1", "@babel/runtime@^7.11.2", "@babel/runtime@^7.12.5", "@babel/runtime@^7.16.3", "@babel/runtime@^7.16.7", "@babel/runtime@^7.18.0", "@babel/runtime@^7.18.3", "@babel/runtime@^7.19.4", "@babel/runtime@^7.20.0", "@babel/runtime@^7.20.7", "@babel/runtime@^7.21.0", "@babel/runtime@^7.22.15", "@babel/runtime@^7.22.5", "@babel/runtime@^7.8.4", "@babel/runtime@^7.9.2":
version "7.22.15" version "7.22.15"
resolved "https://registry.npmmirror.com/@babel/runtime/-/runtime-7.22.15.tgz#38f46494ccf6cf020bd4eed7124b425e83e523b8" resolved "https://registry.npmmirror.com/@babel/runtime/-/runtime-7.22.15.tgz#38f46494ccf6cf020bd4eed7124b425e83e523b8"
integrity sha512-T0O+aa+4w0u06iNmapipJXMV4HoUir03hpx3/YqXXhu9xim3w+dVphjFWl1OH8NbZHw5Lbm9k45drDkgq2VNNA== integrity sha512-T0O+aa+4w0u06iNmapipJXMV4HoUir03hpx3/YqXXhu9xim3w+dVphjFWl1OH8NbZHw5Lbm9k45drDkgq2VNNA==
@ -2060,6 +2060,14 @@
"@svgr/plugin-svgo" "^5.5.0" "@svgr/plugin-svgo" "^5.5.0"
loader-utils "^2.0.0" loader-utils "^2.0.0"
"@tanem/react-nprogress@^5.0.51":
version "5.0.51"
resolved "https://registry.npmmirror.com/@tanem/react-nprogress/-/react-nprogress-5.0.51.tgz#6cbdb52a0a27ecf845f61d809ef6fd45b063662d"
integrity sha512-YxNUCpznuBVA+PhjEzFmxaa1czXgU+5Ojchw5JBK7DQS6SHIgNudpFohWpNBWMu2KWByGJ2OLH2OwbM/XyP18Q==
dependencies:
"@babel/runtime" "^7.22.15"
hoist-non-react-statics "^3.3.2"
"@testing-library/dom@^8.5.0": "@testing-library/dom@^8.5.0":
version "8.20.1" version "8.20.1"
resolved "https://registry.npmmirror.com/@testing-library/dom/-/dom-8.20.1.tgz#2e52a32e46fc88369eef7eef634ac2a192decd9f" resolved "https://registry.npmmirror.com/@testing-library/dom/-/dom-8.20.1.tgz#2e52a32e46fc88369eef7eef634ac2a192decd9f"
@ -2332,6 +2340,11 @@
resolved "https://registry.npmmirror.com/@types/json5/-/json5-0.0.29.tgz#ee28707ae94e11d2b827bcbe5270bcea7f3e71ee" resolved "https://registry.npmmirror.com/@types/json5/-/json5-0.0.29.tgz#ee28707ae94e11d2b827bcbe5270bcea7f3e71ee"
integrity sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ== integrity sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==
"@types/lodash@^4.14.198":
version "4.14.198"
resolved "https://registry.npmmirror.com/@types/lodash/-/lodash-4.14.198.tgz#4d27465257011aedc741a809f1269941fa2c5d4c"
integrity sha512-trNJ/vtMZYMLhfN45uLq4ShQSw0/S7xCTLLVM+WM1rmFpba/VS42jVUgaO3w/NOLiWR/09lnYk0yMaA/atdIsg==
"@types/mime@*": "@types/mime@*":
version "3.0.1" version "3.0.1"
resolved "https://registry.npmmirror.com/@types/mime/-/mime-3.0.1.tgz#5f8f2bca0a5863cb69bc0b0acd88c96cb1d4ae10" resolved "https://registry.npmmirror.com/@types/mime/-/mime-3.0.1.tgz#5f8f2bca0a5863cb69bc0b0acd88c96cb1d4ae10"
@ -5598,6 +5611,13 @@ he@^1.2.0:
resolved "https://registry.npmmirror.com/he/-/he-1.2.0.tgz#84ae65fa7eafb165fddb61566ae14baf05664f0f" resolved "https://registry.npmmirror.com/he/-/he-1.2.0.tgz#84ae65fa7eafb165fddb61566ae14baf05664f0f"
integrity sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw== integrity sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==
hoist-non-react-statics@^3.3.2:
version "3.3.2"
resolved "https://registry.npmmirror.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45"
integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==
dependencies:
react-is "^16.7.0"
hoopy@^0.1.4: hoopy@^0.1.4:
version "0.1.4" version "0.1.4"
resolved "https://registry.npmmirror.com/hoopy/-/hoopy-0.1.4.tgz#609207d661100033a9a9402ad3dea677381c1b1d" resolved "https://registry.npmmirror.com/hoopy/-/hoopy-0.1.4.tgz#609207d661100033a9a9402ad3dea677381c1b1d"
@ -5711,7 +5731,7 @@ http-proxy-agent@^4.0.1:
agent-base "6" agent-base "6"
debug "4" debug "4"
http-proxy-middleware@^2.0.3: http-proxy-middleware@^2.0.3, http-proxy-middleware@^2.0.6:
version "2.0.6" version "2.0.6"
resolved "https://registry.npmmirror.com/http-proxy-middleware/-/http-proxy-middleware-2.0.6.tgz#e1a4dd6979572c7ab5a4e4b55095d1f32a74963f" resolved "https://registry.npmmirror.com/http-proxy-middleware/-/http-proxy-middleware-2.0.6.tgz#e1a4dd6979572c7ab5a4e4b55095d1f32a74963f"
integrity sha512-ya/UeJ6HVBYxrgYotAZo1KvPWlgB48kUJLDePFeneHsVujFaW5WNj2NgWCAE//B1Dl02BIfYlpNgBy8Kf8Rjmw== integrity sha512-ya/UeJ6HVBYxrgYotAZo1KvPWlgB48kUJLDePFeneHsVujFaW5WNj2NgWCAE//B1Dl02BIfYlpNgBy8Kf8Rjmw==
@ -8996,7 +9016,7 @@ react-i18next@^13.2.2:
"@babel/runtime" "^7.22.5" "@babel/runtime" "^7.22.5"
html-parse-stringify "^3.0.1" html-parse-stringify "^3.0.1"
react-is@^16.12.0, react-is@^16.13.1: react-is@^16.12.0, react-is@^16.13.1, react-is@^16.7.0:
version "16.13.1" version "16.13.1"
resolved "https://registry.npmmirror.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4" resolved "https://registry.npmmirror.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ== integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==

Loading…
Cancel
Save