fix 一些问题

2021-06-20 21:06:50 +08:00
parent c694078569
commit ada758e4db
10 changed files with 188 additions and 133 deletions
--- a/web-react/src/assets/style/lib/modal.less
+++ b/web-react/src/assets/style/lib/modal.less
@@ -1,6 +1,6 @@
@import (reference) '../extend.less';
 .ant-modal-content {
-  background-color: fade(@white, 90%);
+  background-color: fade(@primary-color, 50%);

  backdrop-filter: blur(5px);
 }
@@ -9,15 +9,29 @@

  background-color: transparent;
 }
+.ant-modal-title {
+  color: fade(@white, 85%);
+}
 .ant-modal-body {
  background-color: @white;
 }
 .ant-modal-footer {
  background-color: @white;
 }
-.ant-modal-close-x {
-  line-height: 46px;
+.ant-modal-close {
+  top: 10px;
+  right: 10px;

-  width: 46px;
-  height: 46px;
+  color: fade(@white, 75%);
+  background-color: @error-color;
+  &:hover,
+  &:focus {
+    color: @white;
+  }
+}
+.ant-modal-close-x {
+  line-height: 26px;
+
+  width: 26px;
+  height: 26px;
 }
--- a/web-react/src/components/authorized/handler.js
+++ b/web-react/src/components/authorized/handler.js
@@ -113,6 +113,10 @@ const auth = (auth) => {

    const permissions = info.permissions

+    if (!permissions) {
+        return false
+    }
+
    let flag = false

    if (auth) {
--- a/web-react/src/pages/business/house/member/index.jsx
+++ b/web-react/src/pages/business/house/member/index.jsx
@@ -185,10 +185,10 @@ export default class index extends Component {
            <List.Item
                key={record.id}
                actions={[
-                    <Auth auth="sysUser:edit">
+                    <Auth auth="houseMember:edit">
                        <a onClick={() => this.onOpen(this.editForm, record)}>编辑</a>
                    </Auth>,
-                    <Auth auth="sysOrg:delete">
+                    <Auth auth="houseMember:delete">
                        <Popconfirm
                            placement="topRight"
                            title="是否确认删除"
@@ -197,7 +197,7 @@ export default class index extends Component {
                            <a>删除</a>
                        </Popconfirm>
                    </Auth>,
-                    <Auth aut="sysUser:resetPwd">
+                    <Auth aut="houseMember:resetPwd">
                        <a onClick={() => this.onResetPassword(record)}>重置密码</a>
                    </Auth>,
                ]}
@@ -247,7 +247,7 @@ export default class index extends Component {
                    <Descriptions.Item label="邮箱">{record.email || '未设置'}</Descriptions.Item>
                </Descriptions>
                <div className="yo-list-content--h">
-                    <Auth auth="sysUser:changeStatus">
+                    <Auth auth="houseMember:changeStatus">
                        <div className="yo-list-content--h--item text-center">
                            <Switch
                                checked={!record.status}
@@ -292,7 +292,7 @@ export default class index extends Component {
                            autoLoad={false}
                            loadData={this.loadData}
                            query={
-                                <Auth auth="sysApp:page">
+                                <Auth auth="houseMember:page">
                                    <Form.Item label="关键词" name="searchValue">
                                        <Input
                                            autoComplete="off"
--- a/web-react/src/store/reducer/nav.js
+++ b/web-react/src/store/reducer/nav.js
@@ -1,9 +1,13 @@
-const nav = (state = { nav: [] }, action) => {
+const defaultState = { nav: [] }
+
+const nav = (state = defaultState, action) => {
    // 写入各种action对应的操作
    switch (action.type) {
-        case 'SET_ANV':
+        case 'SET_NAV':
            const _state = { ...state, nav: action.nav }
            return _state
+        case 'RESET_NAV':
+            return defaultState
        default:
            return state
    }
--- a/web-react/src/store/reducer/user.js
+++ b/web-react/src/store/reducer/user.js
@@ -1,9 +1,13 @@
-const user = (state = {}, action) => {
+const defaultState = {}
+
+const user = (state = defaultState, action) => {
    // 写入各种action对应的操作
    switch (action.type) {
        case 'SET_USER_ACCOUNT':
            const _state = { ...state, ...action.user }
            return _state
+        case 'RESET_USER_ACCOUNT':
+            return defaultState
        default:
            return state
    }
--- a/web-react/src/views/main/_layout/header/index.jsx
+++ b/web-react/src/views/main/_layout/header/index.jsx
@@ -9,15 +9,14 @@ import store from 'store'
 const { getState, subscribe, dispatch } = store

 export default class index extends Component {
-
    state = {
-        ...getState('layout')
+        ...getState('layout'),
    }

    constructor(props) {
        super(props)

-        this.unsubscribe = subscribe('layout', (state) => {
+        this.unsubscribe = subscribe('layout', state => {
            this.setState(state)
        })
    }
@@ -29,7 +28,7 @@ export default class index extends Component {
    onCollapsed() {
        dispatch({
            type: 'TOGGLE_COLLAPSED',
-            siderCollapsed: !this.state.siderCollapsed
+            siderCollapsed: !this.state.siderCollapsed,
        })
    }

@@ -45,7 +44,10 @@ export default class index extends Component {
                        <Search />
                    </div>
                    <div className="header-actions">
-                        <span className="header-action" onClick={() => window.realodContentWindow()}>
+                        <span
+                            className="header-action"
+                            onClick={() => window.realodContentWindow()}
+                        >
                            <AntIcon type="reload" />
                        </span>
                        <span className="header-action">
--- a/web-react/src/views/main/_layout/header/search.jsx
+++ b/web-react/src/views/main/_layout/header/search.jsx
@@ -6,30 +6,47 @@ import { concat } from 'lodash'

 const { getState, subscribe } = store

-const unZip = (menus) => {
+function unZip(menus) {
    const result = []
    menus.forEach(item => {
        if (item.children) {
            result.push({
                parent: item.meta.title,
-                children: item.children
+                children: item.children,
            })
        } else {
            result.push({
                parent: item.meta.title,
-                children: [item]
+                children: [item],
            })
        }
    })
    return result
 }

-export default class search extends Component {
+function renderTitle(title) {
+    return <span>{title}</span>
+}

+function renderItem(title, menu) {
+    return {
+        value: title,
+        component: menu.component,
+        menu,
+        label: (
+            <>
+                {title}
+                <div className="text-normal">{menu.component}</div>
+            </>
+        ),
+    }
+}
+
+export default class search extends Component {
    state = {
        options: [],

-        searchValue: ''
+        searchValue: '',
    }

    nav = getState('nav').nav
@@ -54,8 +71,10 @@ export default class search extends Component {

    onSearch(searchValue, option) {
        searchValue = searchValue.toLowerCase()
-        return (option.value && option.value.toLowerCase().indexOf(searchValue) > -1)
-            || (option.component && option.component.toLowerCase().indexOf(searchValue) > -1)
+        return (
+            (option.value && option.value.toLowerCase().includes(searchValue)) ||
+            (option.component && option.component.toLowerCase().includes(searchValue))
+        )
    }

    onSelect(value, option) {
@@ -74,50 +93,33 @@ export default class search extends Component {
    }

    getOptions(nav) {
-
-        const menus = unZip(concat.apply(this, nav.map(p => p.menu)))
+        const menus = unZip(
+            concat.apply(
+                this,
+                nav.map(p => p.menu)
+            )
+        )

        const options = menus.map(item => {
            if (item.parent) {
                return {
-                    label: this.renderTitle(item.parent),
+                    label: renderTitle(item.parent),
                    options: item.children.map(menu => {
-                        return this.renderItem(menu.meta.title, menu)
-                    })
+                        return renderItem(menu.meta.title, menu)
+                    }),
                }
            } else {
                return {
                    options: item.children.map(menu => {
                        return this.renderItem(menu.meta.title, menu)
-                    })
+                    }),
                }
            }
        })
        this.setState({ options })
    }

-    renderTitle(title) {
-        return <span>
-            {title}
-        </span>
-    }
-
-    renderItem(title, menu) {
-        return {
-            value: title,
-            component: menu.component,
-            menu,
-            label: (
-                <>
-                    {title}
-                    <div className="text-normal">{menu.component}</div>
-                </>
-            ),
-        }
-    }
-
    render() {
-
        const { options, searchValue } = this.state

        return (
@@ -128,10 +130,10 @@ export default class search extends Component {
                dropdownMatchSelectWidth={false}
                dropdownStyle={{ width: '300px' }}
                dropdownClassName="certain-category-search-dropdown"
-                optionLabelProp="value"
+                optionFilterProp="value"
                filterOption={(searchValue, option) => this.onSearch(searchValue, option)}
                onSelect={(value, option) => this.onSelect(value, option)}
-                onChange={(value) => this.setState({ searchValue: value })}
+                onChange={value => this.setState({ searchValue: value })}
            >
                <Input
                    allowClear
@@ -141,4 +143,4 @@ export default class search extends Component {
            </AutoComplete>
        )
    }
-}
+}
--- a/web-react/src/views/main/_layout/header/user.jsx
+++ b/web-react/src/views/main/_layout/header/user.jsx
@@ -7,7 +7,7 @@ import { api } from 'common/api'
 import { token } from 'common/token'
 import { AntIcon, Image } from 'components'

-const { getState, subscribe } = store
+const { getState, dispatch, subscribe } = store

 const storePath = 'user'

@@ -15,10 +15,9 @@ let userOpenTimer, userCloseTimer
 let initDropdownHeight

 class User extends Component {
-
    state = {
        dropdownHeight: 0,
-        user: getState(storePath)
+        user: getState(storePath),
    }

    constructor(props) {
@@ -26,7 +25,7 @@ class User extends Component {

        this.unsubscribe = subscribe(storePath, () => {
            this.setState({
-                user: getState(storePath)
+                user: getState(storePath),
            })
        })
    }
@@ -43,29 +42,29 @@ class User extends Component {
        this.unsubscribe()
    }

-    onOpen = (e) => {
+    onOpen = e => {
        clearTimeout(userCloseTimer)
        this.refs.container.classList.add('open')
        userOpenTimer = setTimeout(() => {
            this.refs.container.classList.add('drop')
            this.setState({
-                dropdownHeight: initDropdownHeight
+                dropdownHeight: initDropdownHeight,
            })
        }, 300)
    }

-    onClose = (e) => {
+    onClose = e => {
        clearTimeout(userOpenTimer)
        this.refs.container.classList.remove('drop')
        this.setState({
-            dropdownHeight: 0
+            dropdownHeight: 0,
        })
        userCloseTimer = setTimeout(() => {
            this.refs.container.classList.remove('open')
        }, 300)
    }

-    onAccountSetting = () => { }
+    onAccountSetting = () => {}

    onLogout = () => {
        Modal.confirm({
@@ -75,11 +74,13 @@ class User extends Component {
                const { success, message } = await api.logout()
                if (success) {
                    token.value = ''
+                    dispatch({ type: 'RESET_USER_ACCOUNT' })
+                    dispatch({ type: 'RESET_NAV' })
                    this.props.history.replace('/login')
                } else {
                    Message.error(message)
                }
-            }
+            },
        })
    }

@@ -87,16 +88,32 @@ class User extends Component {
        return (
            <div
                className="user-container"
-                onMouseEnter={(e) => { this.onOpen(e) }}
-                onMouseLeave={(e) => { this.onClose(e) }}
+                onMouseEnter={e => {
+                    this.onOpen(e)
+                }}
+                onMouseLeave={e => {
+                    this.onClose(e)
+                }}
                ref="container"
            >
                <div className="user-container-inner">
                    <div className="user--base">
-                        <Image width="32" type="avatar" className="user--avatar" icon={<AntIcon type="user" />} id={this.state.user.avatar} />
-                        <span className="user--name">{this.state.user.nickName || this.state.user.name}</span>
+                        <Image
+                            width="32"
+                            type="avatar"
+                            className="user--avatar"
+                            icon={<AntIcon type="user" />}
+                            id={this.state.user.avatar}
+                        />
+                        <span className="user--name">
+                            {this.state.user.nickName || this.state.user.name}
+                        </span>
                    </div>
-                    <div className="user--dropdown" ref="dropdown" style={{ height: `${this.state.dropdownHeight}px` }}>
+                    <div
+                        className="user--dropdown"
+                        ref="dropdown"
+                        style={{ height: `${this.state.dropdownHeight}px` }}
+                    >
                        <ul className="ant-dropdown-menu ant-dropdown-menu-vertical">
                            <li className="ant-dropdown-menu-item" onClick={this.onAccountSetting}>
                                <AntIcon type="user" />
@@ -110,10 +127,9 @@ class User extends Component {
                        </ul>
                    </div>
                </div>
-            </div >
+            </div>
        )
    }
 }

-
-export default withRouter(User)
+export default withRouter(User)
--- a/web-react/src/views/main/index.jsx
+++ b/web-react/src/views/main/index.jsx
@@ -12,12 +12,12 @@ import Content from './_layout/content'

 const { dispatch } = store

-const serializeMenu = (menus) => {
+const serializeMenu = menus => {
    const menu = cloneDeep(menus)
    const children = groupBy(menu, 'pid')

-    const serialize = (m) => {
-        m.forEach((p) => {
+    const serialize = m => {
+        m.forEach(p => {
            if (children[p.id]) {
                p.children = serialize(children[p.id])
            }
@@ -28,9 +28,9 @@ const serializeMenu = (menus) => {
    return children[EMPTY_ID] ? serialize(children[EMPTY_ID]) : []
 }

-const setNav = async (nav) => {
+const setNav = async nav => {
    const getNav = []
-    nav.apps.forEach((app) => {
+    nav.apps.forEach(app => {
        getNav.push({
            app,
        })
@@ -48,16 +48,14 @@ const getNewID = () => {
 }

 export default class index extends Component {
-
    state = {
        loading: true,
        panes: [],
        actived: '',
-        test: 0
+        test: 0,
    }

    componentDidMount() {
-
        window.openContentWindow = this.onOpenContentWindow
        window.closeContentWindow = this.onCloseContentWindow
        window.closeOtherContentWindow = this.onCloseOtherContentWindow
@@ -68,12 +66,12 @@ export default class index extends Component {

            dispatch({
                type: 'SET_USER_ACCOUNT',
-                user: data
+                user: data,
            })

            dispatch({
-                type: 'SET_ANV',
-                nav
+                type: 'SET_NAV',
+                nav,
            })

            this.setState({ loading: false }, () => {
@@ -89,23 +87,23 @@ export default class index extends Component {

    /**
     * 打开窗口
-     * @param {*} settings 
-     * @returns 
+     * @param {*} settings
+     * @returns
     */
-    onOpenContentWindow = (settings) => {
+    onOpenContentWindow = settings => {
        if (settings.path) {
-            const key = settings.key || getNewID();
+            const key = settings.key || getNewID()

            /**
             * 如果当前标签页已打开,则只需要选中
             */
-            const pane = this.state.panes.find((p) => p.key === key);
+            const pane = this.state.panes.find(p => p.key === key)
            if (pane) {
-                this.onChangeContentWindow(key);
-                return;
+                this.onChangeContentWindow(key)
+                return
            }

-            const path = settings.path.startsWith('/') ? settings.path : `/${settings.path}`;
+            const path = settings.path.startsWith('/') ? settings.path : `/${settings.path}`

            /**
             * 向标签页队列中添加一个新的标签页
@@ -122,44 +120,47 @@ export default class index extends Component {
                loaded: false,
            }
            this.setState({
-                panes: [...this.state.panes, newPane]
+                panes: [...this.state.panes, newPane],
            })

-            this.onChangeContentWindow(key);
+            this.onChangeContentWindow(key)

            //this.$refs.content.onLoadContentWindow(key);
        } else {
-            console.warn('wrong component path');
+            console.warn('wrong component path')
        }
    }

    /**
     * 关闭窗口
-     * @param {*} key 
+     * @param {*} key
     */
-    onCloseContentWindow = (key) => {
+    onCloseContentWindow = key => {
        key = key || this.state.actived
        const panes = this.state.panes
-        const i = findIndex(panes, (p) => p.key === key)
+        const i = findIndex(panes, p => p.key === key)
        panes.splice(i, 1)

-        this.setState({
-            panes
-        }, () => {
-            if (panes.length) {
-                if (key === this.state.actived) {
-                    const pane = panes[i]
-                    if (pane) {
-                        this.onChangeContentWindow(pane.key)
-                    } else {
-                        this.onChangeContentWindow(panes[i - 1].key)
+        this.setState(
+            {
+                panes,
+            },
+            () => {
+                if (panes.length) {
+                    if (key === this.state.actived) {
+                        const pane = panes[i]
+                        if (pane) {
+                            this.onChangeContentWindow(pane.key)
+                        } else {
+                            this.onChangeContentWindow(panes[i - 1].key)
+                        }
                    }
                }
            }
-        })
+        )
    }

-    onCloseOtherContentWindow = (key) => {
+    onCloseOtherContentWindow = key => {
        if (!key) return

        const panes = this.state.panes
@@ -168,23 +169,25 @@ export default class index extends Component {
            const p = panes[i]
            if (p.key !== key && p.closable) {
                if (p.key === this.state.actived) {
-                    flag = true;
+                    flag = true
                }
-                panes.splice(i, 1);
+                panes.splice(i, 1)
            }
        }

-        this.setState({
-            panes
-        }, () => {
-            if (flag) {
-                this.onChangeContentWindow(last(panes).key);
+        this.setState(
+            {
+                panes,
+            },
+            () => {
+                if (flag) {
+                    this.onChangeContentWindow(last(panes).key)
+                }
            }
-        })
-
+        )
    }

-    onCloseRightContentWindow = (key) => {
+    onCloseRightContentWindow = key => {
        if (!key) return

        const panes = this.state.panes
@@ -201,32 +204,34 @@ export default class index extends Component {
            }
        }

-        this.setState({
-            panes
-        }, () => {
-            if (flag) {
-                this.onChangeContentWindow(last(panes).key);
+        this.setState(
+            {
+                panes,
+            },
+            () => {
+                if (flag) {
+                    this.onChangeContentWindow(last(panes).key)
+                }
            }
-        })
+        )
    }

-    onReloadContentWindow = (key) => {
+    onReloadContentWindow = key => {
        if (!key) key = this.state.actived
        //this.$refs.content.onLoadContentWindow(key);
    }

    /**
     * 选中窗口
-     * @param {*} key 
+     * @param {*} key
     */
-    onChangeContentWindow = (key) => {
+    onChangeContentWindow = key => {
        this.setState({
-            actived: key
+            actived: key,
        })
    }

    render() {
-
        const antIcon = <LoadingOutlined style={{ fontSize: 24 }} spin />

        return (
@@ -237,7 +242,11 @@ export default class index extends Component {
                            <Header />
                            <Layout className="yo-nav-theme--light">
                                <Sider />
-                                <Content parent={this} panes={this.state.panes} actived={this.state.actived} />
+                                <Content
+                                    parent={this}
+                                    panes={this.state.panes}
+                                    actived={this.state.actived}
+                                />
                            </Layout>
                        </Layout>
                    </Layout>