@jiangood/open-admin 2.0.1 → 2.2.4

package/src/layouts/index.jsx

@@ -1,185 +1,102 @@
-import React from "react";
-import {ConfigProvider} from "antd";
+import React, {useState, useEffect, useRef} from "react";
+import {App, ConfigProvider} from "antd";
 import zhCN from 'antd/locale/zh_CN';
 import dayjs from 'dayjs';
 import 'dayjs/locale/zh-cn';
-import {Outlet, withRouter} from "umi";
+import {Outlet, useLocation} from "umi";
 
 import AdminLayout from "./admin"
-import {
-    ArrayUtils,
-    HttpUtils,
-    MessageHolder,
-    PageLoading,
-    PageUtils, StringUtils,
-    SysUtils,
-    ThemeUtils,
-} from "../framework";
-import {Logger} from "../framework/utils/Logger";
+import {HttpUtils, PageLoading, PageUtils, SysUtils, ThemeUtils} from "../framework";
 
 import '../style/global.less'
 import './index.less'
 
 dayjs.locale('zh-cn');
 
-// 不需要登录的页面
-const SIMPLE_URLS = ['/login', '/test']
+// 不需要登录和布局的页面
+const PUBLIC_PAGES = ['/login', '/test']
 
-function checkIsSimplePage(pathname) {
-    if(pathname === '/' || pathname === '/index'){
-        return false;
-    }
-    // 测试页面
-    if(pathname.startsWith("/test/")){
-        return true
-    }
-    return ArrayUtils.contains(SIMPLE_URLS, pathname) ;
+function isPublicPage(pathname, search) {
+    if (pathname === '/' || pathname === '/index') return false;
+    if (pathname.startsWith("/test/")) return true;
+    if (PUBLIC_PAGES.includes(pathname)) return true;
+    if (search && new URLSearchParams(search).has('_noLayout')) return true;
+    return false;
 }
 
-function checkIsPurePage(pathname){
-    if(pathname.startsWith("/test/")){
-        return true
-    }
-    return false
+const configProps = {
+    input: {autoComplete: 'off'},
+    form: {validateMessages: {required: '必填项'}, colon: false},
+    button: {autoInsertSpace: false},
+    locale: zhCN,
+    theme: {
+        token: {
+            colorPrimary: ThemeUtils.getColor("primary-color"),
+            colorSuccess: ThemeUtils.getColor("success-color"),
+            colorWarning: ThemeUtils.getColor("warning-color"),
+            colorError: ThemeUtils.getColor("error-color"),
+            borderRadius: 4,
+        },
+        components: {
+            Menu: {
+                darkItemBg: ThemeUtils.getColor("primary-color"),
+                darkPopupBg: ThemeUtils.getColor("primary-color"),
+                darkItemSelectedBg: ThemeUtils.getColor("primary-color-click"),
+                darkItemHoverBg: ThemeUtils.getColor("primary-color-hover"),
+                darkSubMenuItemBg: ThemeUtils.getColor("primary-color"),
+            },
+            Layout: {
+                siderBg: ThemeUtils.getColor("primary-color"),
+                triggerBg: ThemeUtils.getColor("primary-color-click"),
+                headerBg: 'white',
+                triggerHeight: 32,
+            },
+        },
+    },
+};
+
+function initApp() {
+    return Promise.all([
+        HttpUtils.get("/admin/public/site-info"),
+        HttpUtils.get('/admin/public/check-login'),
+    ]).then(([siteInfo, loginRs]) => {
+        SysUtils.setSiteInfo(siteInfo);
+        const {needUpdatePwd, dictInfo, loginInfo} = loginRs;
+        SysUtils.setDictInfo(dictInfo);
+        SysUtils.setLoginInfo(loginInfo);
+        if (needUpdatePwd) {
+            PageUtils.open('/userCenter/ChangePassword', '修改密码');
+            return false;
+        }
+        return true;
+    }).catch(() => {
+        PageUtils.redirectToLogin();
+        return false;
+    });
 }
 
-class _Layouts extends React.Component {
+export function Layouts() {
+    const {pathname, search} = useLocation();
+    const [ready, setReady] = useState(false);
+    const loadedRef = useRef(false);
 
-    log = Logger.getLogger('Layouts')
+    useEffect(() => {
+        if (isPublicPage(pathname)) return;
+        if (loadedRef.current) return;
+        loadedRef.current = true;
+        initApp().then(ok => { if (ok) setReady(true); });
+    }, [pathname]);
 
-    state = {
-        messageHolderInit:false,
-        siteInfoLoading: true,
-        loginInfoFinish: false
+    if (isPublicPage(pathname, search)) {
+        return <ConfigProvider {...configProps}><App><Outlet/></App></ConfigProvider>;
     }
 
-    onMessageHolderFinish = () => {
-        this.loadSiteInfo()
-        this.setState({messageHolderInit:true});
+    if (!ready) {
+        return <ConfigProvider {...configProps}><App><PageLoading message='加载中...'/></App></ConfigProvider>;
     }
 
-
-    loadSiteInfo = () => {
-        HttpUtils.get("/admin/public/site-info").then(rs => {
-            SysUtils.setSiteInfo(rs)
-            this.setState({siteInfoLoading: false})
-            this.loadLoginInfo()
-        })
-    };
-
-    componentDidUpdate(prevProps, prevState, snapshot) {
-        const pre = prevProps.location.pathname
-        const cur = this.props.location.pathname
-        if (pre !== cur) {
-            this.loadLoginInfo()
-        }
-    }
-
-
-
-    loadLoginInfo = () => {
-        const {pathname} = this.props.location;
-        if (checkIsPurePage(pathname) || checkIsSimplePage(pathname) || this.state.loginInfoFinish) {
-            return;
-        }
-
-        HttpUtils.get('/admin/public/check-login')
-            .then(rs => {
-                const {needUpdatePwd, dictInfo, loginInfo} = rs
-                SysUtils.setDictInfo(dictInfo)
-                SysUtils.setLoginInfo(loginInfo)
-                if (!needUpdatePwd) {
-                    this.setState({loginInfoFinish: true});
-                    return;
-                }
-
-                if (needUpdatePwd) {
-                    PageUtils.open('/userCenter/ChangePassword', '修改密码')
-                    return;
-                }
-            })
-            .catch(async () => {
-                PageUtils.redirectToLogin()
-            })
-    }
-
-    render() {
-        return <ConfigProvider
-            input={{autoComplete: 'off'}}
-            form={{
-                validateMessages: {
-                    required: '必填项'
-                }, colon: false
-            }}
-            button={{
-                autoInsertSpace: false
-            }}
-            locale={zhCN}
-            theme={{
-                token: {
-                    colorPrimary: ThemeUtils.getColor("primary-color"),
-                    colorSuccess: ThemeUtils.getColor("success-color"),
-                    colorWarning: ThemeUtils.getColor("warning-color"),
-                    colorError: ThemeUtils.getColor("error-color"),
-                    borderRadius: 4,
-                },
-                components: {
-                    Menu: {
-                        darkItemBg: ThemeUtils.getColor("primary-color"),
-                        darkPopupBg: ThemeUtils.getColor("primary-color"),
-                        darkItemSelectedBg: ThemeUtils.getColor("primary-color-click"),
-                        darkItemHoverBg: ThemeUtils.getColor("primary-color-hover"),
-                        darkSubMenuItemBg: ThemeUtils.getColor("primary-color")
-                    },
-                    Layout: {
-                        siderBg: ThemeUtils.getColor("primary-color"),
-                        triggerBg: ThemeUtils.getColor("primary-color-click"),
-                        headerBg: 'white',
-                        triggerHeight: 32
-                    }
-                }
-            }}>
-
-            <MessageHolder onFinish={this.onMessageHolderFinish} />
-            {this.renderContent()}
-        </ConfigProvider>
-    }
-
-
-    renderContent = () => {
-        const {pathname} = this.props.location;
-
-        if(checkIsPurePage(pathname)){
-            return <Outlet/>
-        }
-
-        if(!this.state.messageHolderInit) {
-            this.log.info('加载message holder...')
-            return <PageLoading message='加载消息组件...'/>
-        }
-
-        const {params = {}} = this.props.location;
-        if (checkIsSimplePage(pathname) || params.hasOwnProperty('_noLayout')) {
-            return <Outlet/>
-        }
-
-
-
-        if (this.state.siteInfoLoading) {
-            return <PageLoading message='加载站点信息...'/>
-        }
-        
-
-
-        if (!this.state.loginInfoFinish) {
-            return <PageLoading message='加载登录信息...'/>
-        }
-
-        return <AdminLayout path={this.state.path} logo={this.props.logo}/>
-    };
+    return <ConfigProvider {...configProps}><App><AdminLayout/></App></ConfigProvider>;
 }
 
-
-export const Layouts = withRouter(_Layouts);
-export default Layouts
-export * from './PageRender'
+export default Layouts;
+export * from './PageRender'

package/src/pages/404.jsx

@@ -1,13 +1,15 @@
 import React from "react";
 import {Result} from "antd";
+import {Page} from "../framework";
 
 export default class extends React.Component {
 
     render() {
-        return <Result
-            status={404}
-            title='页面不存在'
-        />
-
+        return <Page>
+            <Result
+                status={404}
+                title='页面不存在'
+            />
+        </Page>
     }
 }

package/src/pages/about.jsx

@@ -1,12 +1,12 @@
 import React from "react";
+import {Page} from "../framework";
 
 export default class extends React.Component {
 
 
     render() {
-        return <>
+        return <Page>
             <h1>关于</h1>
-        </>
-
+        </Page>
     }
 }

package/src/pages/index.jsx

@@ -1,10 +1,9 @@
 import React from "react";
 import {Card} from "antd";
-
+import {Page} from "../framework";
 
 export default function () {
-
-    return <Card>
-        欢迎使用本系统
-    </Card>
+    return <Page>
+        <Card>欢迎使用本系统</Card>
+    </Page>
 }

package/src/pages/login.jsx

@@ -38,14 +38,19 @@ export default class extends React.Component {
     }
 
     async componentDidMount() {
-        if (localStorage.length === 0) {
-            MessageUtils.alert('站点数据缺失，刷新当前页面...')
-            window.location.reload()
+        const siteInfo = SysUtils.getSiteInfo()
+        if (siteInfo && siteInfo.rsaPublicKey) {
+            this.setState({siteInfo})
             return
         }
-
-        const siteInfo = SysUtils.getSiteInfo()
-        this.setState({siteInfo})
+        // localStorage 中无站点信息，从服务端重新加载
+        try {
+            const rs = await HttpUtils.get('/admin/public/site-info')
+            SysUtils.setSiteInfo(rs)
+            this.setState({siteInfo: rs})
+        } catch (e) {
+            message.error('加载站点信息失败，请刷新页面重试')
+        }
     }
 
     submit = values => {
@@ -69,9 +74,11 @@ export default class extends React.Component {
     render() {
         const {siteInfo} = this.state
 
-        const pageStyle = {}
+        const pageStyle = {
+            backgroundImage: `url("${SysUtils.contextPath('/admin/public/login_bg.jpg')}")`
+        }
         if (siteInfo.loginBackground) {
-            const url = 'admin/sysFile/preview/' + siteInfo.loginBackground;
+            const url = SysUtils.contextPath('/admin/sysFile/preview/' + siteInfo.loginBackground);
             pageStyle.backgroundImage = 'url("' + url + '")'
         }
 
@@ -110,7 +117,7 @@ export default class extends React.Component {
                         <Space style={{alignItems: 'center'}}>
                             <Input size='large' placeholder='验证码' prefix={<SafetyCertificateOutlined/>}/>
                             <img height={36} width={100}
-                                 src={"/admin/auth/captcha-image?_random=" + this.state.random}
+                                 src={SysUtils.contextPath("/admin/auth/captcha-image?_random=" + this.state.random)}
                                  onClick={() => this.setState({random: Math.random()})}/>
                         </Space>
                     </Form.Item>

package/src/pages/login.less

@@ -1,6 +1,5 @@
 .login-page {
   background-size: cover;
-  background-image: url("/admin/public/login_bg.jpg");
   background-repeat: no-repeat;
   background-position: bottom;
 

package/src/pages/system/dict/index.jsx

@@ -33,7 +33,9 @@ export default class extends React.Component {
     }
 
     onFinish = values => {
-        HttpUtils.post('admin/dict/save', values).then(rs => {
+        const isNew = !values.id;
+        const url = isNew ? 'admin/dict/create' : 'admin/dict/update';
+        HttpUtils.post(url, values).then(rs => {
             this.setState({formOpen: false})
             this.tableRef.current.reload()
         })
@@ -90,15 +92,11 @@ export default class extends React.Component {
             title: '操作',
             dataIndex: 'option',
             render: (_, record) => {
-                if(!record.id){ // 非数据库定义的不让修改
-                    return
-                }
-
                 return (
                     <ButtonList>
-                        <Button size='small' perm='sysDict:save'
+                        <Button size='small' perm='sys-dict:update'
                                 onClick={() => this.handleEdit(record)}> 编辑 </Button>
-                        <Popconfirm perm='sysDict:delete' title='是否确定删除字典项'
+                        <Popconfirm perm='sys-dict:delete' title='是否确定删除字典项'
                                     onConfirm={() => this.handleDelete(record)}>
                             <Button size='small'>删除</Button>
                         </Popconfirm>
@@ -109,13 +107,13 @@ export default class extends React.Component {
     ]
 
     render() {
-        return <Page padding>
+        return <Page>
             <ProTable
                 rowKey='uid'
                 actionRef={this.tableRef}
                 toolBarRender={() => {
                     return <ButtonList>
-                        <Button perm='sysDict:save' type='primary' onClick={this.handleAdd} >
+                        <Button perm='sys-dict:create' type='primary' onClick={this.handleAdd} >
                             <PlusOutlined/> 新增
                         </Button>
                     </ButtonList>
@@ -126,7 +124,6 @@ export default class extends React.Component {
                 }}
                 columns={this.columns}
                 showToolbarSearch={true}
-                scrollY={500}
             />
             <Modal
                 title='编辑数据字典项'

package/src/pages/system/file/index.jsx

@@ -2,7 +2,7 @@ import React from 'react'
 import {Button, Form, Input, Modal, Popconfirm} from 'antd'
 import {CloudUploadOutlined} from "@ant-design/icons";
 
-import {ButtonList, FieldDateRange, FieldDictSelect, FieldUploadFile, HttpUtils, ProTable} from "../../../framework";
+import {ButtonList, FieldDateRange, FieldDictSelect, FieldUploadFile, HttpUtils, Page, ProTable, SysUtils} from "../../../framework";
 
 export default class extends React.Component {
 
@@ -59,7 +59,7 @@ export default class extends React.Component {
             title: '预览',
             dataIndex: 'id',
             render(id, record) {
-                const nodes = [<a href={'/admin/sysFile/preview/' + record.id} target='_blank'>预览</a>]
+                const nodes = [<a href={SysUtils.contextPath('/admin/sysFile/preview/' + record.id)} target='_blank'>预览</a>]
 
 
                 if (record.imageUrls?.length > 0) {
@@ -79,7 +79,7 @@ export default class extends React.Component {
             dataIndex: 'option',
             render: (_, record) => (
                 <ButtonList>
-                    <Popconfirm perm='sysFile:delete' title='是否确定删除文件信息'
+                    <Popconfirm perm='sys-file:delete' title='是否确定删除文件信息'
                                 onConfirm={() => this.handleDelete(record)}>
                         <a>删除</a>
                     </Popconfirm>
@@ -89,7 +89,7 @@ export default class extends React.Component {
     ]
 
     render() {
-        return <>
+        return <Page>
             <ProTable
                 actionRef={this.tableRef}
                 toolBarRender={() => {
@@ -140,7 +140,7 @@ export default class extends React.Component {
                 </Form>
             </Modal>
 
-        </>
+        </Page>
     }
 }
 

package/src/pages/system/job/index.jsx

@@ -16,7 +16,7 @@ import {
 } from 'antd'
 import {PlusOutlined} from "@ant-design/icons";
 
-import {ButtonList, HttpUtils, Page, ProTable, StringUtils, ValueType} from "../../../framework";
+import {ButtonList, HttpUtils, Page, ProTable, StringUtils, SysUtils, ValueType} from "../../../framework";
 
 
 const cronOptions = [
@@ -85,7 +85,9 @@ export default class extends React.Component {
     }
 
     onFinish = (values) => {
-        HttpUtils.post('admin/job/save', values).then(rs => {
+        const isNew = !values.id;
+        const url = isNew ? 'admin/job/create' : 'admin/job/update';
+        HttpUtils.post(url, values).then(rs => {
             this.setState({formOpen: false})
             this.tableRef.current.reload();
         })
@@ -149,9 +151,9 @@ export default class extends React.Component {
                 return (
                     <Space>
                         <Button size='small' onClick={() => this.showExecuteRecord(record)}>执行记录</Button>
-                        <Button size='small' onClick={() => this.handleTriggerJob(record)}>执行一次</Button>
-                        <Button size='small' onClick={() => this.handleEdit(record)}> 编辑 </Button>
-                        <Popconfirm title='是否确定删除?' onConfirm={() => this.handleDelete(record)}>
+                        <Button size='small' perm='job:trigger' onClick={() => this.handleTriggerJob(record)}>执行一次</Button>
+                        <Button size='small' perm='job:update' onClick={() => this.handleEdit(record)}> 编辑 </Button>
+                        <Popconfirm perm='job:delete' title='是否确定删除?' onConfirm={() => this.handleDelete(record)}>
                             <Button size='small'>删除</Button>
                         </Popconfirm>
                     </Space>
@@ -174,7 +176,7 @@ export default class extends React.Component {
 
 
     render() {
-        return <Page padding>
+        return <Page>
             <ProTable
                 actionRef={this.tableRef}
                 toolBarRender={() => {
@@ -289,7 +291,7 @@ export default class extends React.Component {
                         title: '操作',
                         dataIndex: 'option',
                         render: (_, record) => {
-                            const url = '/admin/sys/log/' + record.id;
+                            const url = SysUtils.contextPath('/admin/sys/log/' + record.id);
                             return <a href={url} target='_blank'>日志</a>;
                         },
                     }

package/src/pages/system/log/index.jsx

@@ -1,6 +1,6 @@
-import React, {Fragment} from 'react';
+import React from 'react';
 import {Form, Input, Tag} from "antd";
-import {ViewText, FieldDateRange, HttpUtils, ProTable} from "../../../framework";
+import {ViewText, FieldDateRange, HttpUtils, Page, ProTable} from "../../../framework";
 
 export default class extends React.Component {
 
@@ -54,7 +54,7 @@ export default class extends React.Component {
 
 
     render() {
-        return <>
+        return <Page>
             <ProTable
                 request={(params) => HttpUtils.get('admin/sysLog/page', params)}
                 columns={this.columns}
@@ -66,8 +66,7 @@ export default class extends React.Component {
                     <FieldDateRange/>
                 </Form.Item>
             </ProTable>
-
-        </>
+        </Page>
     }
 
 

package/src/pages/system/manual/index.jsx

@@ -23,7 +23,9 @@ export default class extends React.Component {
     }
 
     onFinish = values => {
-        HttpUtils.post('admin/sysManual/save', values).then(rs => {
+        const isNew = !values.id;
+        const url = isNew ? 'admin/sysManual/create' : 'admin/sysManual/update';
+        HttpUtils.post(url, values).then(rs => {
             this.setState({formOpen: false})
             this.tableRef.current.reload()
         })
@@ -66,8 +68,8 @@ export default class extends React.Component {
             dataIndex: 'option',
             render: (_, record) => (
                 <ButtonList>
-                    <Button size='small' perm='sysManual:save' onClick={() => this.handleEdit(record)}>编辑</Button>
-                    <Popconfirm perm='sysManual:delete' title='是否确定删除操作手册'
+                    <Button size='small' perm='sys-manual:update' onClick={() => this.handleEdit(record)}>编辑</Button>
+                    <Popconfirm perm='sys-manual:delete' title='是否确定删除操作手册'
                                 onConfirm={() => this.handleDelete(record)}>
                         <Button size='small'>删除</Button>
                     </Popconfirm>
@@ -83,7 +85,7 @@ export default class extends React.Component {
                 actionRef={this.tableRef}
                 toolBarRender={(params, {selectedRows, selectedRowKeys}) => {
                     return <ButtonList>
-                        <Button perm='sysManual:save' type='primary' onClick={this.handleAdd}>
+                        <Button perm='sys-manual:create' type='primary' onClick={this.handleAdd}>
                             <PlusOutlined/> 新增
                         </Button>
                     </ButtonList>

package/src/pages/system/org/index.jsx

@@ -77,7 +77,9 @@ export default class extends React.Component {
 
     onFinish = (values) => {
         this.setState({submitLoading: true, formEditing: false})
-        HttpUtils.post('admin/sysOrg/save', values).then(rs => {
+        const isNew = !values.id;
+        const url = isNew ? 'admin/sysOrg/create' : 'admin/sysOrg/update';
+        HttpUtils.post(url, values).then(rs => {
             this.loadTree()
         }).finally(() => {
             this.setState({submitLoading: false})
@@ -94,7 +96,7 @@ export default class extends React.Component {
         const {formValues} = this.state;
         const disabled = formValues == null;
         const params = this.state.params;
-        return <Page padding>
+        return <Page>
             <Card>
                 <Space>
 

package/src/pages/system/role/index.jsx

@@ -45,7 +45,9 @@ export default class extends React.Component {
     }
 
     onFinish = values => {
-        HttpUtils.post('admin/sysRole/save', values).then(rs => {
+        const isNew = !values.id;
+        const url = isNew ? 'admin/sysRole/create' : 'admin/sysRole/update';
+        HttpUtils.post(url, values).then(rs => {
             this.setState({formOpen: false})
             this.tableRef.current.reload()
         })
@@ -130,15 +132,15 @@ export default class extends React.Component {
 
                 return (
                     <ButtonList>
-                        <Button size='small' perm='sysRole:manage'
+                        <Button size='small' perm='sys-role:grant-permission'
                                 onClick={() => this.handleEditUser(record)}>用户设置</Button>
 
-                        <Button size='small' perm='sysRole:manage' disabled={record.builtin}
+                        <Button size='small' perm='sys-role:grant-permission' disabled={record.builtin}
                                 onClick={() => PageUtils.open('/system/role/perm?id=' + record.id, '角色权限设置')}>权限设置</Button>
 
-                        <Button size='small' perm='sysRole:manage' disabled={record.builtin}
+                        <Button size='small' perm='sys-role:update' disabled={record.builtin}
                                 onClick={() => this.handleEdit(record)}>编辑</Button>
-                        <Popconfirm perm='sysRole:manage' disabled={record.builtin} title='是否确定删除系统角色'
+                        <Popconfirm perm='sys-role:delete' disabled={record.builtin} title='是否确定删除系统角色'
                                     onConfirm={() => this.handleDelete(record)}>
                             <Button size='small'>删除</Button>
                         </Popconfirm>
@@ -178,12 +180,12 @@ export default class extends React.Component {
     }
 
     render() {
-        return <Page padding>
+        return <Page>
             <ProTable
                 actionRef={this.tableRef}
                 toolBarRender={() => {
                     return <ButtonList>
-                        <Button perm='sysRole:manage' type='primary' onClick={this.handleAdd}>
+                        <Button perm='sys-role:create' type='primary' onClick={this.handleAdd}>
                             <PlusOutlined/> 新增
                         </Button>
                     </ButtonList>