huayu-web
/
assistant-note
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat:打开文件

This commit is contained in:
shixiaohua 2024-01-25 15:26:23 +08:00
parent ef1aa74011
commit 34fb22536f
7 changed files with 71 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/App.js
View File

@ -3,6 +3,7 @@ import routes from './routes'
import {Outlet, useNavigate, useRoutes} from 'react-router-dom'
import useIpcRenderer from '../src/utils/useIpcRenderer'
import {dirAdd} from "./redux/dirMessage_reducer";
import {openFile} from "./redux/clickFile_reducer"
import {store} from "./redux/store";
function App() {

15
src/comment/TopMenu.js
View File

@ -47,11 +47,16 @@ exports.menuRebuild = (mainWindow) => {
})
for (let i = 0; i < files.length; i++) {
const state = await stat(result.filePaths[0] + '/' + files[i]);
fileChildList.push({
'fileName': files[i],
"filePath": result.filePaths[0]+ '/' +files[i],
'dirFlag': state.isDirectory()
})
if (state.isDirectory()
||files[i].endsWith(".md")
||files[i].endsWith(".html")
||files[i].endsWith(".lexical")){
fileChildList.push({
'fileName': files[i],
"filePath": result.filePaths[0]+ '/' +files[i],
'dirFlag': state.isDirectory()
})
}
}
mainWindow.webContents.send('openDirectory', fileStateList)
} catch (err) {

51
src/components/ItemTree/index.jsx
View File

@ -3,33 +3,9 @@ import { Input, Tree } from 'antd';
import {FolderOutlined,FileMarkdownOutlined} from '@ant-design/icons';
const { Search } = Input;
import store from "../../redux/store";
const defaultData = [
// {
// "title": "/media/shixiaohua/homedisk",
// "key": "0-0",
// "icon": <FolderOutlined />,
// "children": [
// {
// "title": "electron",
// "key": "0-0-0",
// "icon": <FolderOutlined />,
// "children": [
// {
// "title": "leaf",
// "key": "0-0-0-0",
// "icon": <FileMarkdownOutlined />
// }
// ]
// }
// ]
// },
// {
// "title": "media",
// "key": "0-1",
// "icon": <FolderOutlined />,
// "children": []
// }
];
import {clickFile} from "../../redux/clickFile_reducer";
const defaultData = [];
// 将树平铺用于查找
const dataList = [];
const generateList = (data) => {
@ -65,17 +41,22 @@ const getParentKey = (key, tree) => {
function generateChildList(fileList){
const result = []
for (let i = 0; i < fileList.length; i++) {
const {fileName,filePath}=fileList[i];
const {fileName,filePath,dirFlag}=fileList[i];
result.push({
"key":filePath,
"title":fileName,
"icon":<FolderOutlined />,
"dirFlag":dirFlag,
"children":[]
});
}
return result;
}
const ItemTree = () => {
const [expandedKeys, setExpandedKeys] = useState([]);
const [searchValue, setSearchValue] = useState('');
const [defaultValueState, setDefaultValueState] = useState([]);
const [autoExpandParent, setAutoExpandParent] = useState(true);
useEffect(()=>{
store.subscribe(() =>{
@ -84,7 +65,7 @@ const ItemTree = () => {
for (let i = 0; i < fileDirDate.length; i++) {
const node = fileDirDate[i];
console.log("node:",node)
const { fileName,filePath,childList } = node;
const { fileName,filePath,childList,dirFlag } = node;
const childListM=[]
if (childList.length>0) {
childListM.push(...generateChildList(childList));
@ -96,6 +77,7 @@ const ItemTree = () => {
"key":filePath,
"title":fileName,
"icon":<FolderOutlined />,
"dirFlag":dirFlag,
"children":childListM
});
}
@ -105,10 +87,6 @@ const ItemTree = () => {
})
},[])
const [expandedKeys, setExpandedKeys] = useState([]);
const [searchValue, setSearchValue] = useState('');
const [defaultValueState, setDefaultValueState] = useState([]);
const [autoExpandParent, setAutoExpandParent] = useState(true);
const onExpand = (newExpandedKeys) => {
setExpandedKeys(newExpandedKeys);
setAutoExpandParent(false);
@ -127,6 +105,12 @@ const ItemTree = () => {
setSearchValue(value);
setAutoExpandParent(true);
};
const onSelect = (selectedKeys,e) =>{
if (e.selected){
console.log('onSelect.selectedKeys',selectedKeys,e)
store.dispatch(clickFile({"fileName":e.node.title,"filePath":e.node.key}))
}
}
// const treeData = useMemo(() => {
// const loop = (data) =>
// data.map((item) => {
@ -174,6 +158,7 @@ const ItemTree = () => {
showIcon ={true}
// treeNodes 数据，如果设置则不需要手动构造 TreeNode 节点（key 在整个树范围内唯一）
treeData={defaultValueState}
onSelect={onSelect}
/>
</div>
);

54
src/pages/Note/index.jsx
View File

@ -1,4 +1,4 @@
import React, {useRef, useState } from 'react';
import React, {useEffect, useRef, useState} from 'react';
import {
MenuFoldOutlined,
MenuUnfoldOutlined,
@ -6,43 +6,35 @@ import {
UserOutlined,
VideoCameraOutlined,
} from '@ant-design/icons';
import { Layout, Menu, Button, theme, Avatar,Tabs } from 'antd';
import {Layout, Menu, Button, theme, Avatar, Tabs} from 'antd';
import Hlexical from './Hlexical';
import ItemTree from "../../components/ItemTree";
import './index.less'
const { Header, Sider, Content } = Layout;
const initialItems = [
{
label: 'Tab 1',
children: <div className="HlexicalName"><Hlexical/></div>,
key: '1',
},
{
label: 'Tab 2',
children: 'Content of Tab 2',
key: '2',
},
{
label: 'Tab 3',
children: 'Content of Tab 3',
key: '3',
closable: false,
},
];
import store from "../../redux/store";
const {Header, Sider, Content} = Layout;
const Note = () => {
const [collapsed, setCollapsed] = useState(false);
// const {
// token: { colorBgContainer },
// } = theme.useToken();
const colorBgContainer = '#800080'
const [activeKey, setActiveKey] = useState(initialItems[0].key);
const [items, setItems] = useState(initialItems);
const [activeKey, setActiveKey] = useState();
const [items, setItems] = useState([]);
const newTabIndex = useRef(0);
store.subscribe(() => {
const openFile = store.getState().clickFileMessage.data;
console.log("store.getState().clickFileMessage.data:",openFile,items)
if (items.filter(fileItem => fileItem.key === openFile.filePath).length === 0) {
setItems([...items,
{
label: openFile.fileName,
children: <div className="HlexicalName"><Hlexical/></div>,
key: openFile.filePath,
}
])
}
}
)
const onChange = (newActiveKey) => {
setActiveKey(newActiveKey);
};
@ -88,13 +80,13 @@ const Note = () => {
<Layout>
<Sider margin='5' collapsed='true'>
<div>
<Avatar size={60} src='http://localhost/20231114150555.jpg' icon={<UserOutlined />} />
<Avatar size={60} src='http://localhost/20231114150555.jpg' icon={<UserOutlined/>}/>
</div>
<div>
<p style={{ color: colorBgContainer, 'fontSize': 60 }}>上善若水</p>
<p style={{color: colorBgContainer, 'fontSize': 60}}>上善若水</p>
</div>
</Sider>
<Sider trigger={null} collapsedWidth={0} collapsible collapsed={collapsed}>
<Sider trigger={null} collapsedWidth={0} collapsible collapsed={collapsed}>
<ItemTree></ItemTree>
</Sider>
<Layout>

16
src/redux/clickFile_reducer.js Normal file
View File

@ -0,0 +1,16 @@
import { createSlice } from '@reduxjs/toolkit'
export const clickFileSlice = createSlice({
name: 'clickFile',
initialState: {
data: {}
},
reducers: {
clickFile: (state, action) => {
console.log("clickFileSlice:clickFile", state, action)
state.data=action.payload
}
}
})
export const { clickFile } = clickFileSlice.actions
export default clickFileSlice.reducer

2
src/redux/dirMessage_reducer.js
View File

@ -21,9 +21,7 @@ export const dirMessageSlice = createSlice({
state.data=[...new Set([...state.data,...action.payload])];
console.log('state.data:',state.data)
}
}
}
}
})

4
src/redux/store.js
View File

@ -2,12 +2,14 @@ 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'
// 用于支持异步函数
export const store = configureStore({
reducer: {
historyRecord:historyReducer,
redirectUrl:redirectReducer,
dirMessage:dirMessageReducer
dirMessage:dirMessageReducer,
clickFileMessage:clickFileReducer
}
})
export default store