fix 一些问题
This commit is contained in:
@@ -134,7 +134,7 @@ export default class index extends Component {
|
|||||||
name = toCamelCase(name)
|
name = toCamelCase(name)
|
||||||
const codes = this.state.codes[name]
|
const codes = this.state.codes[name]
|
||||||
if (codes) {
|
if (codes) {
|
||||||
const c = codes.find(p => p.code === code)
|
const c = codes.find(p => p.code == code)
|
||||||
if (c) {
|
if (c) {
|
||||||
return c.value
|
return c.value
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
@import (reference) '../extend.less';
|
@import (reference) '../extend.less';
|
||||||
.ant-modal-content {
|
.ant-modal-content {
|
||||||
background-color: fade(@white, 90%);
|
background-color: fade(@primary-color, 50%);
|
||||||
|
|
||||||
backdrop-filter: blur(5px);
|
backdrop-filter: blur(5px);
|
||||||
}
|
}
|
||||||
@@ -9,15 +9,29 @@
|
|||||||
|
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
}
|
}
|
||||||
|
.ant-modal-title {
|
||||||
|
color: fade(@white, 85%);
|
||||||
|
}
|
||||||
.ant-modal-body {
|
.ant-modal-body {
|
||||||
background-color: @white;
|
background-color: @white;
|
||||||
}
|
}
|
||||||
.ant-modal-footer {
|
.ant-modal-footer {
|
||||||
background-color: @white;
|
background-color: @white;
|
||||||
}
|
}
|
||||||
.ant-modal-close-x {
|
.ant-modal-close {
|
||||||
line-height: 46px;
|
top: 10px;
|
||||||
|
right: 10px;
|
||||||
|
|
||||||
width: 46px;
|
color: fade(@white, 75%);
|
||||||
height: 46px;
|
background-color: @error-color;
|
||||||
|
&:hover,
|
||||||
|
&:focus {
|
||||||
|
color: @white;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.ant-modal-close-x {
|
||||||
|
line-height: 26px;
|
||||||
|
|
||||||
|
width: 26px;
|
||||||
|
height: 26px;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -113,6 +113,10 @@ const auth = (auth) => {
|
|||||||
|
|
||||||
const permissions = info.permissions
|
const permissions = info.permissions
|
||||||
|
|
||||||
|
if (!permissions) {
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
|
||||||
let flag = false
|
let flag = false
|
||||||
|
|
||||||
if (auth) {
|
if (auth) {
|
||||||
|
|||||||
@@ -185,10 +185,10 @@ export default class index extends Component {
|
|||||||
<List.Item
|
<List.Item
|
||||||
key={record.id}
|
key={record.id}
|
||||||
actions={[
|
actions={[
|
||||||
<Auth auth="sysUser:edit">
|
<Auth auth="houseMember:edit">
|
||||||
<a onClick={() => this.onOpen(this.editForm, record)}>编辑</a>
|
<a onClick={() => this.onOpen(this.editForm, record)}>编辑</a>
|
||||||
</Auth>,
|
</Auth>,
|
||||||
<Auth auth="sysOrg:delete">
|
<Auth auth="houseMember:delete">
|
||||||
<Popconfirm
|
<Popconfirm
|
||||||
placement="topRight"
|
placement="topRight"
|
||||||
title="是否确认删除"
|
title="是否确认删除"
|
||||||
@@ -197,7 +197,7 @@ export default class index extends Component {
|
|||||||
<a>删除</a>
|
<a>删除</a>
|
||||||
</Popconfirm>
|
</Popconfirm>
|
||||||
</Auth>,
|
</Auth>,
|
||||||
<Auth aut="sysUser:resetPwd">
|
<Auth aut="houseMember:resetPwd">
|
||||||
<a onClick={() => this.onResetPassword(record)}>重置密码</a>
|
<a onClick={() => this.onResetPassword(record)}>重置密码</a>
|
||||||
</Auth>,
|
</Auth>,
|
||||||
]}
|
]}
|
||||||
@@ -247,7 +247,7 @@ export default class index extends Component {
|
|||||||
<Descriptions.Item label="邮箱">{record.email || '未设置'}</Descriptions.Item>
|
<Descriptions.Item label="邮箱">{record.email || '未设置'}</Descriptions.Item>
|
||||||
</Descriptions>
|
</Descriptions>
|
||||||
<div className="yo-list-content--h">
|
<div className="yo-list-content--h">
|
||||||
<Auth auth="sysUser:changeStatus">
|
<Auth auth="houseMember:changeStatus">
|
||||||
<div className="yo-list-content--h--item text-center">
|
<div className="yo-list-content--h--item text-center">
|
||||||
<Switch
|
<Switch
|
||||||
checked={!record.status}
|
checked={!record.status}
|
||||||
@@ -292,7 +292,7 @@ export default class index extends Component {
|
|||||||
autoLoad={false}
|
autoLoad={false}
|
||||||
loadData={this.loadData}
|
loadData={this.loadData}
|
||||||
query={
|
query={
|
||||||
<Auth auth="sysApp:page">
|
<Auth auth="houseMember:page">
|
||||||
<Form.Item label="关键词" name="searchValue">
|
<Form.Item label="关键词" name="searchValue">
|
||||||
<Input
|
<Input
|
||||||
autoComplete="off"
|
autoComplete="off"
|
||||||
|
|||||||
@@ -1,9 +1,13 @@
|
|||||||
const nav = (state = { nav: [] }, action) => {
|
const defaultState = { nav: [] }
|
||||||
|
|
||||||
|
const nav = (state = defaultState, action) => {
|
||||||
// 写入各种action对应的操作
|
// 写入各种action对应的操作
|
||||||
switch (action.type) {
|
switch (action.type) {
|
||||||
case 'SET_ANV':
|
case 'SET_NAV':
|
||||||
const _state = { ...state, nav: action.nav }
|
const _state = { ...state, nav: action.nav }
|
||||||
return _state
|
return _state
|
||||||
|
case 'RESET_NAV':
|
||||||
|
return defaultState
|
||||||
default:
|
default:
|
||||||
return state
|
return state
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,9 +1,13 @@
|
|||||||
const user = (state = {}, action) => {
|
const defaultState = {}
|
||||||
|
|
||||||
|
const user = (state = defaultState, action) => {
|
||||||
// 写入各种action对应的操作
|
// 写入各种action对应的操作
|
||||||
switch (action.type) {
|
switch (action.type) {
|
||||||
case 'SET_USER_ACCOUNT':
|
case 'SET_USER_ACCOUNT':
|
||||||
const _state = { ...state, ...action.user }
|
const _state = { ...state, ...action.user }
|
||||||
return _state
|
return _state
|
||||||
|
case 'RESET_USER_ACCOUNT':
|
||||||
|
return defaultState
|
||||||
default:
|
default:
|
||||||
return state
|
return state
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -9,15 +9,14 @@ import store from 'store'
|
|||||||
const { getState, subscribe, dispatch } = store
|
const { getState, subscribe, dispatch } = store
|
||||||
|
|
||||||
export default class index extends Component {
|
export default class index extends Component {
|
||||||
|
|
||||||
state = {
|
state = {
|
||||||
...getState('layout')
|
...getState('layout'),
|
||||||
}
|
}
|
||||||
|
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props)
|
super(props)
|
||||||
|
|
||||||
this.unsubscribe = subscribe('layout', (state) => {
|
this.unsubscribe = subscribe('layout', state => {
|
||||||
this.setState(state)
|
this.setState(state)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
@@ -29,7 +28,7 @@ export default class index extends Component {
|
|||||||
onCollapsed() {
|
onCollapsed() {
|
||||||
dispatch({
|
dispatch({
|
||||||
type: 'TOGGLE_COLLAPSED',
|
type: 'TOGGLE_COLLAPSED',
|
||||||
siderCollapsed: !this.state.siderCollapsed
|
siderCollapsed: !this.state.siderCollapsed,
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -45,7 +44,10 @@ export default class index extends Component {
|
|||||||
<Search />
|
<Search />
|
||||||
</div>
|
</div>
|
||||||
<div className="header-actions">
|
<div className="header-actions">
|
||||||
<span className="header-action" onClick={() => window.realodContentWindow()}>
|
<span
|
||||||
|
className="header-action"
|
||||||
|
onClick={() => window.realodContentWindow()}
|
||||||
|
>
|
||||||
<AntIcon type="reload" />
|
<AntIcon type="reload" />
|
||||||
</span>
|
</span>
|
||||||
<span className="header-action">
|
<span className="header-action">
|
||||||
|
|||||||
@@ -6,30 +6,47 @@ import { concat } from 'lodash'
|
|||||||
|
|
||||||
const { getState, subscribe } = store
|
const { getState, subscribe } = store
|
||||||
|
|
||||||
const unZip = (menus) => {
|
function unZip(menus) {
|
||||||
const result = []
|
const result = []
|
||||||
menus.forEach(item => {
|
menus.forEach(item => {
|
||||||
if (item.children) {
|
if (item.children) {
|
||||||
result.push({
|
result.push({
|
||||||
parent: item.meta.title,
|
parent: item.meta.title,
|
||||||
children: item.children
|
children: item.children,
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
result.push({
|
result.push({
|
||||||
parent: item.meta.title,
|
parent: item.meta.title,
|
||||||
children: [item]
|
children: [item],
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
return result
|
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 = {
|
state = {
|
||||||
options: [],
|
options: [],
|
||||||
|
|
||||||
searchValue: ''
|
searchValue: '',
|
||||||
}
|
}
|
||||||
|
|
||||||
nav = getState('nav').nav
|
nav = getState('nav').nav
|
||||||
@@ -54,8 +71,10 @@ export default class search extends Component {
|
|||||||
|
|
||||||
onSearch(searchValue, option) {
|
onSearch(searchValue, option) {
|
||||||
searchValue = searchValue.toLowerCase()
|
searchValue = searchValue.toLowerCase()
|
||||||
return (option.value && option.value.toLowerCase().indexOf(searchValue) > -1)
|
return (
|
||||||
|| (option.component && option.component.toLowerCase().indexOf(searchValue) > -1)
|
(option.value && option.value.toLowerCase().includes(searchValue)) ||
|
||||||
|
(option.component && option.component.toLowerCase().includes(searchValue))
|
||||||
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
onSelect(value, option) {
|
onSelect(value, option) {
|
||||||
@@ -74,50 +93,33 @@ export default class search extends Component {
|
|||||||
}
|
}
|
||||||
|
|
||||||
getOptions(nav) {
|
getOptions(nav) {
|
||||||
|
const menus = unZip(
|
||||||
const menus = unZip(concat.apply(this, nav.map(p => p.menu)))
|
concat.apply(
|
||||||
|
this,
|
||||||
|
nav.map(p => p.menu)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
|
||||||
const options = menus.map(item => {
|
const options = menus.map(item => {
|
||||||
if (item.parent) {
|
if (item.parent) {
|
||||||
return {
|
return {
|
||||||
label: this.renderTitle(item.parent),
|
label: renderTitle(item.parent),
|
||||||
options: item.children.map(menu => {
|
options: item.children.map(menu => {
|
||||||
return this.renderItem(menu.meta.title, menu)
|
return renderItem(menu.meta.title, menu)
|
||||||
})
|
}),
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
return {
|
return {
|
||||||
options: item.children.map(menu => {
|
options: item.children.map(menu => {
|
||||||
return this.renderItem(menu.meta.title, menu)
|
return this.renderItem(menu.meta.title, menu)
|
||||||
})
|
}),
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
this.setState({ options })
|
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() {
|
render() {
|
||||||
|
|
||||||
const { options, searchValue } = this.state
|
const { options, searchValue } = this.state
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@@ -128,10 +130,10 @@ export default class search extends Component {
|
|||||||
dropdownMatchSelectWidth={false}
|
dropdownMatchSelectWidth={false}
|
||||||
dropdownStyle={{ width: '300px' }}
|
dropdownStyle={{ width: '300px' }}
|
||||||
dropdownClassName="certain-category-search-dropdown"
|
dropdownClassName="certain-category-search-dropdown"
|
||||||
optionLabelProp="value"
|
optionFilterProp="value"
|
||||||
filterOption={(searchValue, option) => this.onSearch(searchValue, option)}
|
filterOption={(searchValue, option) => this.onSearch(searchValue, option)}
|
||||||
onSelect={(value, option) => this.onSelect(value, option)}
|
onSelect={(value, option) => this.onSelect(value, option)}
|
||||||
onChange={(value) => this.setState({ searchValue: value })}
|
onChange={value => this.setState({ searchValue: value })}
|
||||||
>
|
>
|
||||||
<Input
|
<Input
|
||||||
allowClear
|
allowClear
|
||||||
@@ -141,4 +143,4 @@ export default class search extends Component {
|
|||||||
</AutoComplete>
|
</AutoComplete>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -7,7 +7,7 @@ import { api } from 'common/api'
|
|||||||
import { token } from 'common/token'
|
import { token } from 'common/token'
|
||||||
import { AntIcon, Image } from 'components'
|
import { AntIcon, Image } from 'components'
|
||||||
|
|
||||||
const { getState, subscribe } = store
|
const { getState, dispatch, subscribe } = store
|
||||||
|
|
||||||
const storePath = 'user'
|
const storePath = 'user'
|
||||||
|
|
||||||
@@ -15,10 +15,9 @@ let userOpenTimer, userCloseTimer
|
|||||||
let initDropdownHeight
|
let initDropdownHeight
|
||||||
|
|
||||||
class User extends Component {
|
class User extends Component {
|
||||||
|
|
||||||
state = {
|
state = {
|
||||||
dropdownHeight: 0,
|
dropdownHeight: 0,
|
||||||
user: getState(storePath)
|
user: getState(storePath),
|
||||||
}
|
}
|
||||||
|
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
@@ -26,7 +25,7 @@ class User extends Component {
|
|||||||
|
|
||||||
this.unsubscribe = subscribe(storePath, () => {
|
this.unsubscribe = subscribe(storePath, () => {
|
||||||
this.setState({
|
this.setState({
|
||||||
user: getState(storePath)
|
user: getState(storePath),
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
@@ -43,29 +42,29 @@ class User extends Component {
|
|||||||
this.unsubscribe()
|
this.unsubscribe()
|
||||||
}
|
}
|
||||||
|
|
||||||
onOpen = (e) => {
|
onOpen = e => {
|
||||||
clearTimeout(userCloseTimer)
|
clearTimeout(userCloseTimer)
|
||||||
this.refs.container.classList.add('open')
|
this.refs.container.classList.add('open')
|
||||||
userOpenTimer = setTimeout(() => {
|
userOpenTimer = setTimeout(() => {
|
||||||
this.refs.container.classList.add('drop')
|
this.refs.container.classList.add('drop')
|
||||||
this.setState({
|
this.setState({
|
||||||
dropdownHeight: initDropdownHeight
|
dropdownHeight: initDropdownHeight,
|
||||||
})
|
})
|
||||||
}, 300)
|
}, 300)
|
||||||
}
|
}
|
||||||
|
|
||||||
onClose = (e) => {
|
onClose = e => {
|
||||||
clearTimeout(userOpenTimer)
|
clearTimeout(userOpenTimer)
|
||||||
this.refs.container.classList.remove('drop')
|
this.refs.container.classList.remove('drop')
|
||||||
this.setState({
|
this.setState({
|
||||||
dropdownHeight: 0
|
dropdownHeight: 0,
|
||||||
})
|
})
|
||||||
userCloseTimer = setTimeout(() => {
|
userCloseTimer = setTimeout(() => {
|
||||||
this.refs.container.classList.remove('open')
|
this.refs.container.classList.remove('open')
|
||||||
}, 300)
|
}, 300)
|
||||||
}
|
}
|
||||||
|
|
||||||
onAccountSetting = () => { }
|
onAccountSetting = () => {}
|
||||||
|
|
||||||
onLogout = () => {
|
onLogout = () => {
|
||||||
Modal.confirm({
|
Modal.confirm({
|
||||||
@@ -75,11 +74,13 @@ class User extends Component {
|
|||||||
const { success, message } = await api.logout()
|
const { success, message } = await api.logout()
|
||||||
if (success) {
|
if (success) {
|
||||||
token.value = ''
|
token.value = ''
|
||||||
|
dispatch({ type: 'RESET_USER_ACCOUNT' })
|
||||||
|
dispatch({ type: 'RESET_NAV' })
|
||||||
this.props.history.replace('/login')
|
this.props.history.replace('/login')
|
||||||
} else {
|
} else {
|
||||||
Message.error(message)
|
Message.error(message)
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -87,16 +88,32 @@ class User extends Component {
|
|||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className="user-container"
|
className="user-container"
|
||||||
onMouseEnter={(e) => { this.onOpen(e) }}
|
onMouseEnter={e => {
|
||||||
onMouseLeave={(e) => { this.onClose(e) }}
|
this.onOpen(e)
|
||||||
|
}}
|
||||||
|
onMouseLeave={e => {
|
||||||
|
this.onClose(e)
|
||||||
|
}}
|
||||||
ref="container"
|
ref="container"
|
||||||
>
|
>
|
||||||
<div className="user-container-inner">
|
<div className="user-container-inner">
|
||||||
<div className="user--base">
|
<div className="user--base">
|
||||||
<Image width="32" type="avatar" className="user--avatar" icon={<AntIcon type="user" />} id={this.state.user.avatar} />
|
<Image
|
||||||
<span className="user--name">{this.state.user.nickName || this.state.user.name}</span>
|
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>
|
||||||
<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">
|
<ul className="ant-dropdown-menu ant-dropdown-menu-vertical">
|
||||||
<li className="ant-dropdown-menu-item" onClick={this.onAccountSetting}>
|
<li className="ant-dropdown-menu-item" onClick={this.onAccountSetting}>
|
||||||
<AntIcon type="user" />
|
<AntIcon type="user" />
|
||||||
@@ -110,10 +127,9 @@ class User extends Component {
|
|||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div >
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export default withRouter(User)
|
||||||
export default withRouter(User)
|
|
||||||
|
|||||||
@@ -12,12 +12,12 @@ import Content from './_layout/content'
|
|||||||
|
|
||||||
const { dispatch } = store
|
const { dispatch } = store
|
||||||
|
|
||||||
const serializeMenu = (menus) => {
|
const serializeMenu = menus => {
|
||||||
const menu = cloneDeep(menus)
|
const menu = cloneDeep(menus)
|
||||||
const children = groupBy(menu, 'pid')
|
const children = groupBy(menu, 'pid')
|
||||||
|
|
||||||
const serialize = (m) => {
|
const serialize = m => {
|
||||||
m.forEach((p) => {
|
m.forEach(p => {
|
||||||
if (children[p.id]) {
|
if (children[p.id]) {
|
||||||
p.children = serialize(children[p.id])
|
p.children = serialize(children[p.id])
|
||||||
}
|
}
|
||||||
@@ -28,9 +28,9 @@ const serializeMenu = (menus) => {
|
|||||||
return children[EMPTY_ID] ? serialize(children[EMPTY_ID]) : []
|
return children[EMPTY_ID] ? serialize(children[EMPTY_ID]) : []
|
||||||
}
|
}
|
||||||
|
|
||||||
const setNav = async (nav) => {
|
const setNav = async nav => {
|
||||||
const getNav = []
|
const getNav = []
|
||||||
nav.apps.forEach((app) => {
|
nav.apps.forEach(app => {
|
||||||
getNav.push({
|
getNav.push({
|
||||||
app,
|
app,
|
||||||
})
|
})
|
||||||
@@ -48,16 +48,14 @@ const getNewID = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export default class index extends Component {
|
export default class index extends Component {
|
||||||
|
|
||||||
state = {
|
state = {
|
||||||
loading: true,
|
loading: true,
|
||||||
panes: [],
|
panes: [],
|
||||||
actived: '',
|
actived: '',
|
||||||
test: 0
|
test: 0,
|
||||||
}
|
}
|
||||||
|
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
|
|
||||||
window.openContentWindow = this.onOpenContentWindow
|
window.openContentWindow = this.onOpenContentWindow
|
||||||
window.closeContentWindow = this.onCloseContentWindow
|
window.closeContentWindow = this.onCloseContentWindow
|
||||||
window.closeOtherContentWindow = this.onCloseOtherContentWindow
|
window.closeOtherContentWindow = this.onCloseOtherContentWindow
|
||||||
@@ -68,12 +66,12 @@ export default class index extends Component {
|
|||||||
|
|
||||||
dispatch({
|
dispatch({
|
||||||
type: 'SET_USER_ACCOUNT',
|
type: 'SET_USER_ACCOUNT',
|
||||||
user: data
|
user: data,
|
||||||
})
|
})
|
||||||
|
|
||||||
dispatch({
|
dispatch({
|
||||||
type: 'SET_ANV',
|
type: 'SET_NAV',
|
||||||
nav
|
nav,
|
||||||
})
|
})
|
||||||
|
|
||||||
this.setState({ loading: false }, () => {
|
this.setState({ loading: false }, () => {
|
||||||
@@ -89,23 +87,23 @@ export default class index extends Component {
|
|||||||
|
|
||||||
/**
|
/**
|
||||||
* 打开窗口
|
* 打开窗口
|
||||||
* @param {*} settings
|
* @param {*} settings
|
||||||
* @returns
|
* @returns
|
||||||
*/
|
*/
|
||||||
onOpenContentWindow = (settings) => {
|
onOpenContentWindow = settings => {
|
||||||
if (settings.path) {
|
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) {
|
if (pane) {
|
||||||
this.onChangeContentWindow(key);
|
this.onChangeContentWindow(key)
|
||||||
return;
|
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,
|
loaded: false,
|
||||||
}
|
}
|
||||||
this.setState({
|
this.setState({
|
||||||
panes: [...this.state.panes, newPane]
|
panes: [...this.state.panes, newPane],
|
||||||
})
|
})
|
||||||
|
|
||||||
this.onChangeContentWindow(key);
|
this.onChangeContentWindow(key)
|
||||||
|
|
||||||
//this.$refs.content.onLoadContentWindow(key);
|
//this.$refs.content.onLoadContentWindow(key);
|
||||||
} else {
|
} else {
|
||||||
console.warn('wrong component path');
|
console.warn('wrong component path')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 关闭窗口
|
* 关闭窗口
|
||||||
* @param {*} key
|
* @param {*} key
|
||||||
*/
|
*/
|
||||||
onCloseContentWindow = (key) => {
|
onCloseContentWindow = key => {
|
||||||
key = key || this.state.actived
|
key = key || this.state.actived
|
||||||
const panes = this.state.panes
|
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)
|
panes.splice(i, 1)
|
||||||
|
|
||||||
this.setState({
|
this.setState(
|
||||||
panes
|
{
|
||||||
}, () => {
|
panes,
|
||||||
if (panes.length) {
|
},
|
||||||
if (key === this.state.actived) {
|
() => {
|
||||||
const pane = panes[i]
|
if (panes.length) {
|
||||||
if (pane) {
|
if (key === this.state.actived) {
|
||||||
this.onChangeContentWindow(pane.key)
|
const pane = panes[i]
|
||||||
} else {
|
if (pane) {
|
||||||
this.onChangeContentWindow(panes[i - 1].key)
|
this.onChangeContentWindow(pane.key)
|
||||||
|
} else {
|
||||||
|
this.onChangeContentWindow(panes[i - 1].key)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
})
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
onCloseOtherContentWindow = (key) => {
|
onCloseOtherContentWindow = key => {
|
||||||
if (!key) return
|
if (!key) return
|
||||||
|
|
||||||
const panes = this.state.panes
|
const panes = this.state.panes
|
||||||
@@ -168,23 +169,25 @@ export default class index extends Component {
|
|||||||
const p = panes[i]
|
const p = panes[i]
|
||||||
if (p.key !== key && p.closable) {
|
if (p.key !== key && p.closable) {
|
||||||
if (p.key === this.state.actived) {
|
if (p.key === this.state.actived) {
|
||||||
flag = true;
|
flag = true
|
||||||
}
|
}
|
||||||
panes.splice(i, 1);
|
panes.splice(i, 1)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
this.setState({
|
this.setState(
|
||||||
panes
|
{
|
||||||
}, () => {
|
panes,
|
||||||
if (flag) {
|
},
|
||||||
this.onChangeContentWindow(last(panes).key);
|
() => {
|
||||||
|
if (flag) {
|
||||||
|
this.onChangeContentWindow(last(panes).key)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
})
|
)
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
onCloseRightContentWindow = (key) => {
|
onCloseRightContentWindow = key => {
|
||||||
if (!key) return
|
if (!key) return
|
||||||
|
|
||||||
const panes = this.state.panes
|
const panes = this.state.panes
|
||||||
@@ -201,32 +204,34 @@ export default class index extends Component {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
this.setState({
|
this.setState(
|
||||||
panes
|
{
|
||||||
}, () => {
|
panes,
|
||||||
if (flag) {
|
},
|
||||||
this.onChangeContentWindow(last(panes).key);
|
() => {
|
||||||
|
if (flag) {
|
||||||
|
this.onChangeContentWindow(last(panes).key)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
})
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
onReloadContentWindow = (key) => {
|
onReloadContentWindow = key => {
|
||||||
if (!key) key = this.state.actived
|
if (!key) key = this.state.actived
|
||||||
//this.$refs.content.onLoadContentWindow(key);
|
//this.$refs.content.onLoadContentWindow(key);
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 选中窗口
|
* 选中窗口
|
||||||
* @param {*} key
|
* @param {*} key
|
||||||
*/
|
*/
|
||||||
onChangeContentWindow = (key) => {
|
onChangeContentWindow = key => {
|
||||||
this.setState({
|
this.setState({
|
||||||
actived: key
|
actived: key,
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
|
|
||||||
const antIcon = <LoadingOutlined style={{ fontSize: 24 }} spin />
|
const antIcon = <LoadingOutlined style={{ fontSize: 24 }} spin />
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@@ -237,7 +242,11 @@ export default class index extends Component {
|
|||||||
<Header />
|
<Header />
|
||||||
<Layout className="yo-nav-theme--light">
|
<Layout className="yo-nav-theme--light">
|
||||||
<Sider />
|
<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>
|
</Layout>
|
||||||
</Layout>
|
</Layout>
|
||||||
|
|||||||
Reference in New Issue
Block a user