feat:clickFile改为添加tableBarItem和设置activeKey
This commit is contained in:
parent
ed8ce9ae79
commit
399fabd282
|
@ -4,8 +4,8 @@ import {FolderOutlined, FileMarkdownOutlined,FileOutlined} from '@ant-design/ico
|
|||
import "./index.less"
|
||||
const {Search} = Input;
|
||||
import {store} from "../../redux/store";
|
||||
import {clickFile} from "../../redux/clickFile_reducer";
|
||||
import {useSelector} from "react-redux";
|
||||
import {useSelector,useDispatch} from "react-redux";
|
||||
import {addTableBarItem} from "../../redux/tableBarItem_reducer";
|
||||
|
||||
const defaultData = [];
|
||||
// 将树平铺用于查找
|
||||
|
@ -59,7 +59,7 @@ function generateChildList(fileList) {
|
|||
const ItemTree = () => {
|
||||
const [expandedKeys, setExpandedKeys] = useState([]);
|
||||
const [searchValue, setSearchValue] = useState('');
|
||||
|
||||
const dispatch = useDispatch()
|
||||
const [autoExpandParent, setAutoExpandParent] = useState(true);
|
||||
|
||||
const defaultValueStateSet = [];
|
||||
|
@ -109,7 +109,14 @@ const ItemTree = () => {
|
|||
const onSelect = (selectedKeys, e) => {
|
||||
if (e.selected && !e.node.dirFlag) {
|
||||
console.log('onSelect.selectedKeys', selectedKeys, e)
|
||||
store.dispatch(clickFile({"fileName": e.node.title, "filePath": e.node.key}))
|
||||
dispatch(addTableBarItem(
|
||||
{
|
||||
label: e.node.title,
|
||||
children: e.node.key,
|
||||
key: e.node.key,
|
||||
activeKey:e.node.key
|
||||
}
|
||||
))
|
||||
}
|
||||
}
|
||||
// const treeData = useMemo(() => {
|
||||
|
|
|
@ -9,7 +9,7 @@ import './index.less'
|
|||
import {store} from "../../redux/store";
|
||||
import {isEmpty} from "../../utils/ObjectUtils";
|
||||
import {useSelector, useDispatch} from "react-redux";
|
||||
import {addTableBarItem, removeTableBarItem} from "../../redux/tableBarItem_reducer"
|
||||
import {addTableBarItem, removeTableBarItem, setActiveKey} from "../../redux/tableBarItem_reducer"
|
||||
|
||||
const {Header, Sider, Content} = Layout;
|
||||
const Note = () => {
|
||||
|
@ -19,29 +19,14 @@ const Note = () => {
|
|||
// token: { colorBgContainer },
|
||||
// } = theme.useToken();
|
||||
const colorBgContainer = '#800080'
|
||||
const [activeKey, setActiveKey] = useState();
|
||||
const newTabIndex = useRef(0);
|
||||
const items = useSelector(state => state.tableBarItem.data)
|
||||
const openFile = useSelector(state => state.clickFileMessage.data)
|
||||
console.log("store.getState().clickFileMessage.data:",openFile)
|
||||
if (!isEmpty(openFile) && activeKey !== openFile.filePath&&isEmpty(activeKey)) {
|
||||
setActiveKey(openFile.filePath)
|
||||
}
|
||||
if (items.filter(fileItem => fileItem.key === openFile.filePath).length === 0 && !isEmpty(openFile)) {
|
||||
console.log("items.filter(fileItem => fileItem.key === openFile.filePath)",items)
|
||||
dispatch(addTableBarItem(
|
||||
{
|
||||
label: openFile.fileName,
|
||||
children: openFile.filePath,
|
||||
key: openFile.filePath,
|
||||
}
|
||||
))
|
||||
}
|
||||
|
||||
const activeKey=useSelector(state => state.tableBarItem.activeKey);
|
||||
const items = useSelector(state => state.tableBarItem.data)
|
||||
|
||||
const onChange = (newActiveKey) => {
|
||||
console.log("setActiveKey(newActiveKey)",newActiveKey)
|
||||
setActiveKey(newActiveKey);
|
||||
dispatch(setActiveKey({"activeKey":newActiveKey}));
|
||||
};
|
||||
const add = () => {
|
||||
const newActiveKey = `newTab${newTabIndex.current++}`;
|
||||
|
@ -59,7 +44,7 @@ const Note = () => {
|
|||
key: newActiveKey,
|
||||
}
|
||||
));
|
||||
setActiveKey(newActiveKey);
|
||||
dispatch(setActiveKey({"activeKey":newActiveKey}));
|
||||
};
|
||||
const remove = (targetKey) => {
|
||||
console.log("remove = (targetKey):",targetKey)
|
||||
|
@ -81,7 +66,7 @@ const Note = () => {
|
|||
}
|
||||
console.log("remove = (newActiveKey):",newActiveKey)
|
||||
// setItems(newPanes);
|
||||
setActiveKey(newActiveKey);
|
||||
dispatch(setActiveKey({"activeKey":newActiveKey}));
|
||||
};
|
||||
const onEdit = (targetKey, action) => {
|
||||
if (action === 'add') {
|
||||
|
|
|
@ -1,18 +0,0 @@
|
|||
import { createSlice } from '@reduxjs/toolkit'
|
||||
|
||||
export const clickFileSlice = createSlice({
|
||||
name: 'clickFile',
|
||||
initialState: {
|
||||
type:"clickFile",
|
||||
data: {}
|
||||
},
|
||||
reducers: {
|
||||
// 点击文件添加item,设置单前文件
|
||||
clickFile: (state, action) => {
|
||||
console.log("clickFileSlice:clickFile", state, action)
|
||||
state.data=action.payload
|
||||
}
|
||||
}
|
||||
})
|
||||
export const { clickFile } = clickFileSlice.actions
|
||||
export default clickFileSlice.reducer
|
|
@ -2,7 +2,6 @@ import {configureStore} from '@reduxjs/toolkit'
|
|||
import historyReducer from './historyRecord_reducer'
|
||||
import redirectReducer from './redirectUrl_reducer'
|
||||
import dirMessageReducer from './dirMessage_reducer'
|
||||
import clickFileReducer from './clickFile_reducer'
|
||||
import pushHotkeysReducer from "./pushHotkeys_reducer";
|
||||
import tableBarItemReducer from "./tableBarItem_reducer";
|
||||
import {electronStorage} from "../utils/LocalStorage";
|
||||
|
@ -25,10 +24,6 @@ const pushHotkeysPersistConfig = {
|
|||
key: 'pushHotkeys',
|
||||
storage: electronStorage()
|
||||
}
|
||||
const clickFileMessagePersistConfig = {
|
||||
key: 'clickFileMessage',
|
||||
storage: electronStorage()
|
||||
}
|
||||
const tableBarItemPersistConfig = {
|
||||
key: 'tableBarItem',
|
||||
storage: electronStorage()
|
||||
|
@ -39,7 +34,6 @@ const historyRecordPersistedReducer = persistReducer(historyRecordPersistConfig,
|
|||
const redirectUrlPersistedReducer = persistReducer(redirectUrlPersistConfig, redirectReducer)
|
||||
const dirMessagePersistedReducer = persistReducer(dirMessagePersistConfig, dirMessageReducer)
|
||||
const pushHotkeysPersistedReducer = persistReducer(pushHotkeysPersistConfig, pushHotkeysReducer)
|
||||
const clickFileMessagePersistedReducer = persistReducer(clickFileMessagePersistConfig, clickFileReducer)
|
||||
const tableBarItemPersistedReducer = persistReducer(tableBarItemPersistConfig, tableBarItemReducer)
|
||||
|
||||
export const store = configureStore({
|
||||
|
@ -48,7 +42,6 @@ export const store = configureStore({
|
|||
redirectUrl:redirectUrlPersistedReducer,
|
||||
dirMessage:dirMessagePersistedReducer,
|
||||
pushHotkeys:pushHotkeysPersistedReducer,
|
||||
clickFileMessage:clickFileMessagePersistedReducer,
|
||||
tableBarItem:tableBarItemPersistedReducer,
|
||||
},
|
||||
middleware: (getDefaultMiddleware) =>
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
import { createSlice } from '@reduxjs/toolkit'
|
||||
import {isEmpty} from "../utils/ObjectUtils";
|
||||
|
||||
export const tableBarItemSlice = createSlice({
|
||||
name: 'tableBarItem',
|
||||
|
@ -13,15 +14,22 @@ export const tableBarItemSlice = createSlice({
|
|||
if (state.data.filter(file=>file.key===action.payload.key).length===0){
|
||||
state.data.push(action.payload)
|
||||
}
|
||||
if (action.payload.activeKey){
|
||||
state.activeKey=action.payload.activeKey
|
||||
}
|
||||
},
|
||||
removeTableBarItem: (state, action) => {
|
||||
console.log("tableBarItemSlice:removeTableBarItem",action.payload)
|
||||
state.data=state.data.filter(file=>file.key!==action.payload)
|
||||
},
|
||||
if (action.payload.activeKey){
|
||||
state.activeKey=action.payload.activeKey
|
||||
}
|
||||
}
|
||||
,
|
||||
setActiveKey: (state, action) => {
|
||||
console.log("tableBarItemSlice:setActiveKey",action.payload)
|
||||
if (state.activeKey!==action.payload){
|
||||
state.activeKey=action.payload;
|
||||
if (action.payload.activeKey){
|
||||
state.activeKey=action.payload.activeKey
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue