feat: loading style
This commit is contained in:
parent
06fa41fffc
commit
0c678a013f
@ -16,7 +16,7 @@ export const AuthContext = createContext<AuthContextProps>(null);
|
||||
export const useCurrentUser = () => {
|
||||
const { currentUser } = useContext(AuthContext);
|
||||
return currentUser;
|
||||
}
|
||||
};
|
||||
|
||||
export function AuthProvider(props) {
|
||||
const service = useRequest('users:check', {
|
||||
@ -30,7 +30,11 @@ export function AuthProvider(props) {
|
||||
}
|
||||
return (
|
||||
<AuthContext.Provider value={{ service, currentUser: service.data }}>
|
||||
{service.loading ? <Spin /> : props.children}
|
||||
{service.loading ? (
|
||||
<Spin size={'large'} className={'nb-spin-center'} />
|
||||
) : (
|
||||
props.children
|
||||
)}
|
||||
</AuthContext.Provider>
|
||||
);
|
||||
}
|
||||
|
@ -25,7 +25,7 @@ const useOkAction = () => {
|
||||
async run() {
|
||||
console.log('system_settings.values', form.values);
|
||||
await resource.save(form.values);
|
||||
await service.refresh();
|
||||
await service.mutate(form.values);
|
||||
},
|
||||
};
|
||||
};
|
||||
|
@ -44,7 +44,7 @@ export const MenuPermissionTable = observer((props) => {
|
||||
},
|
||||
});
|
||||
if (loading) {
|
||||
return <Spin />;
|
||||
return <Spin size={'large'} className={'nb-spin-center'} />;
|
||||
}
|
||||
return (
|
||||
<div>
|
||||
|
@ -25,7 +25,7 @@ export function SystemSettingsProvider(props) {
|
||||
);
|
||||
return (
|
||||
<SystemSettingsContext.Provider value={{ service, resource }}>
|
||||
{service.loading ? <Spin /> : props.children}
|
||||
{service.loading ? <Spin size={'large'} className={'nb-spin-center'} /> : props.children}
|
||||
</SystemSettingsContext.Provider>
|
||||
);
|
||||
}
|
||||
|
@ -76,7 +76,7 @@ function LayoutWithMenu(props: LayoutWithMenuProps) {
|
||||
const history = useHistory();
|
||||
const { title } = useSystemSettings();
|
||||
const [activeKey, setActiveKey] = useState(match.params.name);
|
||||
const [, setPageTitle] = usePageTitleContext();
|
||||
const { setPageTitle } = usePageTitleContext();
|
||||
const onSelect = (info) => {
|
||||
if (!info.schema) {
|
||||
setActiveKey(null);
|
||||
@ -149,7 +149,7 @@ function Content({ activeKey }) {
|
||||
);
|
||||
|
||||
if (loading) {
|
||||
return <Spin />;
|
||||
return <Spin size={'large'} className={'nb-spin-center'} />;
|
||||
}
|
||||
|
||||
return <SchemaRenderer schema={data} />;
|
||||
@ -166,7 +166,7 @@ export function AdminLayout({ route, ...others }: any) {
|
||||
);
|
||||
|
||||
if (loading) {
|
||||
return <Spin />;
|
||||
return <Spin size={'large'} className={'nb-spin-center'} />;
|
||||
}
|
||||
|
||||
const findProperties = (schema: Schema): Schema[] => {
|
||||
|
@ -33,6 +33,18 @@
|
||||
// }
|
||||
// }
|
||||
|
||||
.nb-spin-center {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
max-height: inherit !important;
|
||||
}
|
||||
|
||||
.database-sider {
|
||||
background: #fafafa;
|
||||
padding-top: 16px;
|
||||
|
@ -59,7 +59,7 @@ export function RouteSchemaRenderer({ route }) {
|
||||
);
|
||||
const { title } = useSystemSettings();
|
||||
if (loading) {
|
||||
return <Spin />;
|
||||
return <Spin size={'large'} className={'nb-spin-center'} />;
|
||||
}
|
||||
return (
|
||||
<div>
|
||||
|
@ -6,10 +6,13 @@ export interface PageTitleProviderProps {
|
||||
defaultPageTitle?: string;
|
||||
}
|
||||
|
||||
const [PageTitleProvider, usePageTitleContext] = constate(({ defaultPageTitle }: PageTitleProviderProps) => {
|
||||
const { title } = useSystemSettings();
|
||||
const [pageTitle, setPageTitle] = useState(defaultPageTitle);
|
||||
return [title ? `${pageTitle} - ${title}` : pageTitle, setPageTitle];
|
||||
});
|
||||
const [PageTitleProvider, usePageTitleContext] = constate(
|
||||
({ defaultPageTitle }: PageTitleProviderProps) => {
|
||||
const { title } = useSystemSettings();
|
||||
const [pageTitle, setPageTitle] = useState(defaultPageTitle);
|
||||
const documentTitle = title ? `${pageTitle} - ${title}` : pageTitle;
|
||||
return { documentTitle, pageTitle, setPageTitle };
|
||||
},
|
||||
);
|
||||
|
||||
export { PageTitleProvider, usePageTitleContext };
|
||||
|
@ -46,7 +46,7 @@ const App = () => {
|
||||
});
|
||||
|
||||
if (loading) {
|
||||
return <Spin/>
|
||||
return <Spin size={'large'} className={'nb-spin-center'} />
|
||||
}
|
||||
|
||||
return (
|
||||
|
@ -6,11 +6,11 @@ import { Helmet } from 'react-helmet';
|
||||
|
||||
export const Page = observer((props) => {
|
||||
const { children, ...others } = props;
|
||||
const [pageTitle] = usePageTitleContext();
|
||||
const { documentTitle, pageTitle } = usePageTitleContext();
|
||||
return (
|
||||
<>
|
||||
<Helmet>
|
||||
<title>{pageTitle}</title>
|
||||
<title>{documentTitle}</title>
|
||||
</Helmet>
|
||||
<AntdPageHeader ghost={false} title={pageTitle} {...others} />
|
||||
<div style={{margin: 24}}>
|
||||
|
Loading…
Reference in New Issue
Block a user