Release

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kne-components/components-admin",
-  "version": "1.1.26",
+  "version": "1.1.28",
   "description": "用于实现一个后台管理系统的必要组件",
   "scripts": {
     "init": "husky",

src/components/Account/Account/DoLogin.js

@@ -9,7 +9,7 @@ import { useIntl } from '@kne/react-intl';
 import withLocale from '../withLocale';
 
 const DoLoginInner = createWithRemoteLoader({
-  modules: ['component-core:Global@usePreset']
+  modules: ['components-core:Global@usePreset']
 })(({ remoteModules, children }) => {
   const [usePreset] = remoteModules;
   const { formatMessage } = useIntl();

src/components/Account/Account/Forget.js

@@ -5,7 +5,7 @@ import { createWithRemoteLoader } from '@kne/remote-loader';
 import { useProps } from './context';
 
 const Forget = createWithRemoteLoader({
-  modules: ['component-core:Global@usePreset']
+  modules: ['components-core:Global@usePreset']
 })(({ remoteModules }) => {
   const [usePreset] = remoteModules;
   const { apis: presetApis, ajax } = usePreset();

src/components/Account/Account/Modify.js

@@ -10,7 +10,7 @@ import { useIntl } from '@kne/react-intl';
 import withLocale from '../withLocale';
 
 const ModifyInner = createWithRemoteLoader({
-  modules: ['component-core:Global@usePreset']
+  modules: ['components-core:Global@usePreset']
 })(({ remoteModules }) => {
   const [usePreset] = remoteModules;
   const { apis: presetApis, ajax } = usePreset();

src/components/Account/Account/Register.js

@@ -9,7 +9,7 @@ import { useIntl } from '@kne/react-intl';
 import withLocale from '../withLocale';
 
 const RegisterInner = createWithRemoteLoader({
-  modules: ['component-core:Global@usePreset']
+  modules: ['components-core:Global@usePreset']
 })(({ remoteModules }) => {
   const [usePreset] = remoteModules;
   const { formatMessage } = useIntl();

src/components/Account/Login/index.js

@@ -9,7 +9,7 @@ import withLocale from '../withLocale';
 
 export const LOGIN_REMEMBER_ACCOUNT = 'LOGIN_REMEMBER_ACCOUNT';
 const LoginInner = createWithRemoteLoader({
-  modules: ['component-core:FormInfo']
+  modules: ['components-core:FormInfo']
 })(({ remoteModules, ...p }) => {
   const { formatMessage } = useIntl();
   const { title, registerUrl, forgetUrl, type, onSubmit } = Object.assign(

src/components/Authenticate/Authenticate.js

@@ -1,6 +1,7 @@
 import { createWithRemoteLoader } from '@kne/remote-loader';
 import { Navigate, useLocation } from 'react-router-dom';
 import Fetch from '@kne/react-fetch';
+import merge from 'lodash/merge';
 
 const CheckAccountIsInit = ({ data, baseUrl, children }) => {
   const location = useLocation();
@@ -18,12 +19,12 @@ const CheckAccountIsInit = ({ data, baseUrl, children }) => {
 
 export const CustomUserInfo = createWithRemoteLoader({
   modules: ['components-core:Global@SetGlobal']
-})(({ remoteModules, cache, baseUrl, children, api }) => {
+})(({ remoteModules, cache, baseUrl, children, api, ...props }) => {
   const [SetGlobal] = remoteModules;
   return (
     <Fetch
       cache={cache}
-      {...Object.assign({}, api)}
+      {...merge({}, api, props)}
       render={({ data, reload }) => {
         return (
           <CheckAccountIsInit baseUrl={baseUrl} data={data}>

src/components/Authenticate/MainLayout.js

@@ -1,9 +1,10 @@
 import { createWithRemoteLoader } from '@kne/remote-loader';
 import { Outlet } from 'react-router-dom';
+import { LoginOutlined } from '@ant-design/icons';
 import { SuperAdminInfo, UserInfo, CustomUserInfo } from './Authenticate';
 import UserTool from '@components/UserTool';
 import Language from '@components/Account/Language';
-import { Flex } from 'antd';
+import { Flex, Button } from 'antd';
 
 export const MainLayout = createWithRemoteLoader({
   modules: ['components-core:Layout']
@@ -82,6 +83,36 @@ export const AfterUserLoginLayout = ({ baseUrl, navigation, children, ...props }
   );
 };
 
+export const Layout = props => {
+  return (
+    <UserInfo
+      options={{
+        ignoreRedirect: true
+      }}
+      error={() => (
+        <MainLayout
+          {...props}
+          navigation={Object.assign({}, props.navigation, {
+            rightOptions: props.login && (
+              <Button className="right-options-login"
+                type="link"
+                icon={<LoginOutlined />}
+                onClick={() => {
+                  props.login();
+                }}
+                iconPosition="end">
+                登录
+              </Button>
+            )
+          })}>
+          <Outlet />
+        </MainLayout>
+      )}>
+      <AfterUserLoginLayout {...props} />
+    </UserInfo>
+  );
+};
+
 export const AfterUserLogin = ({ baseUrl, children, ...props }) => {
   return <UserInfo baseUrl={baseUrl || '/account'}>{children || <Outlet />}</UserInfo>;
 };

src/components/UserTool/UserTool.js

@@ -4,61 +4,62 @@ import { useLogout } from '@components/Account';
 import style from './style.module.scss';
 import withLocale from './withLocale';
 import { useIntl } from '@kne/react-intl';
+import classnames from 'classnames';
 
 const UserTool = createWithRemoteLoader({
   modules: ['components-core:Image', 'components-core:Icon']
-})(withLocale(({ remoteModules, avatar, name, email, storeKeys = { token: 'X-User-Token' }, domain, list, children = null }) => {
-  const [Image, Icon] = remoteModules;
-  const logout = useLogout({ storeKeys, domain });
-  const { formatMessage } = useIntl();
-  return (
-    <Dropdown
-      trigger="click"
-      rootClassName={style['overlay']}
-      popupRender={() => (
-        <Space direction={'vertical'} className={style['content']}>
-          <Space className={style['info']}>
-            <Image.Avatar id={avatar} size={48} />
-            <div>
-              <div className={style['line']}>{name || formatMessage({ id: 'UserToolUnnamed' })}</div>
-              <div className={style['line']}>{email || '-'}</div>
-            </div>
+})(
+  withLocale(({ remoteModules, avatar, name, email, storeKeys = { token: 'X-User-Token' }, domain, list, children = null }) => {
+    const [Image, Icon] = remoteModules;
+    const logout = useLogout({ storeKeys, domain });
+    const { formatMessage } = useIntl();
+    return (
+      <Dropdown
+        trigger="click"
+        rootClassName={style['overlay']}
+        popupRender={() => (
+          <Space direction={'vertical'} className={style['content']}>
+            <Space className={style['info']}>
+              <Image.Avatar id={avatar} size={48} />
+              <div>
+                <div className={style['line']}>{name || formatMessage({ id: 'UserToolUnnamed' })}</div>
+                <div className={style['line']}>{email || '-'}</div>
+              </div>
+            </Space>
+            <Divider className={style['divider']} />
+            {children}
+            <List className={style['options-list']}>
+              {list &&
+                list.length > 0 &&
+                list.map((item, index) => {
+                  return (
+                    <List.Item key={index} className={style['options-list-item']} onClick={item.onClick}>
+                      <Flex gap={8} flex={1}>
+                        {item.iconType && <Icon type={item.iconType} />}
+                        <Flex flex={1}>{item.label}</Flex>
+                      </Flex>
+                    </List.Item>
+                  );
+                })}
+              <List.Item className={style['options-list-item']} onClick={logout}>
+                <Flex gap={8} flex={1}>
+                  <Icon type="icon-tuichudenglu" />
+                  <span>{formatMessage({ id: 'UserToolLogout' })}</span>
+                </Flex>
+              </List.Item>
+            </List>
           </Space>
-          <Divider className={style['divider']} />
-          {children}
-          <List className={style['options-list']}>
-            {list &&
-              list.length > 0 &&
-              list.map((item, index) => {
-                return (
-                  <List.Item key={index} className={style['options-list-item']} onClick={item.onClick}>
-                    <Flex gap={8} flex={1}>
-                      {item.iconType && <Icon type={item.iconType} />}
-                      <Flex flex={1}>{item.label}</Flex>
-                    </Flex>
-                  </List.Item>
-                );
-              })}
-            <List.Item
-              className={style['options-list-item']}
-              onClick={logout}>
-              <Flex gap={8} flex={1}>
-                <Icon type="icon-tuichudenglu" />
-                <span>{formatMessage({ id: 'UserToolLogout' })}</span>
-              </Flex>
-            </List.Item>
-          </List>
+        )}
+        arrow={false}
+        transitionName={'ant-slide-up'}>
+        <Space className={style['user-tool']}>
+          <Image.Avatar id={avatar} size={32} />
+          <div className={classnames(style['user-name'], 'user-tool-username')}>{name || formatMessage({ id: 'UserToolUnnamed' })}</div>
+          <Icon className={style['icon']} type="triangle-down" size={12} />
         </Space>
-      )}
-      arrow={false}
-      transitionName={'ant-slide-up'}>
-      <Space className={style['user-tool']}>
-        <Image.Avatar id={avatar} size={32} />
-        <div className={style['user-name']}>{name || formatMessage({ id: 'UserToolUnnamed' })}</div>
-        <Icon className={style['icon']} type="triangle-down" size={12} />
-      </Space>
-    </Dropdown>
-  );
-}));
+      </Dropdown>
+    );
+  })
+);
 
 export default UserTool;