feat:css整理

src/components/ItemTree/index.jsx

@@ -307,16 +307,14 @@ const ItemTree = (prop) => {
             <Menu.Item key='6' onClick={() => {setState("")}}>关闭菜单</Menu.Item>
         ]
         return (
-            <div>
                 <Menu style={tmpStyle}>
                     {menuItem}
                 </Menu>
-            </div>
         )
     }
 
     return (
-        <div style={{height: "100%"}}>
+        <div style={{height: "100%",width:"200px"}}>
             {getNodeTreeRightClickMenu()}
             <Search
                 style={{marginBottom: 8,}}
@@ -332,11 +330,13 @@ const ItemTree = (prop) => {
                 autoExpandParent={autoExpandParent}
                 showIcon={true}
                 selectedKeys={[useSelector(state => state.tableBarItem.activeKey)]}
-                defaultExpandedKeys={useSelector(state => state.tableBarItem.expandedKeyList)}
+                // defaultExpandedKeys={useSelector(state => state.tableBarItem.expandedKeyList)}
                 // treeNodes 数据，如果设置则不需要手动构造 TreeNode 节点（key 在整个树范围内唯一）
                 treeData={defaultValueState}
                 onSelect={onSelect}
                 onRightClick={treeNodeOnRightClick}
+                // 占据一整行
+                blockNode
             />
         </div>
     );

src/components/ItemTree/index.less

@@ -1,30 +1,25 @@
 @import '~antd/dist/antd.less';
+.ant-tree{
+  overflow: auto scroll;
+  height: 95.7%;
+}
 .ant-tree-node-content-wrapper {
   display: inline-block;
-  width: 200px;
   white-space: nowrap;
-  overflow: hidden;
+}
+.ant-tree-treenode-switcher-close{
+  display: inline-block;
+  white-space: nowrap;
   text-overflow: ellipsis;
 }
 .ant-tree-treenode-switcher-close{
   display: inline-block;
-  width: 200px;
   white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-.ant-tree-treenode-switcher-close{
-  display: inline-block;
-  width: 200px;
-  white-space: nowrap;
-  overflow: hidden;
   text-overflow: ellipsis;
 }
 .ant-tree-treenode-switcher-open{
   display: inline-block;
-  width: 200px;
   white-space: nowrap;
-  overflow: hidden;
   text-overflow: ellipsis;
 }
 .ant-tabs{

src/pages/Note/Hlexical/index.jsx

@@ -73,7 +73,6 @@ function ImportFilePlugin(props) {
     useEffect(() => {
         if (props.filePath){
             importFile(props.filePath).then(value => {
-                console.log("value",value,isEmpty(value))
                 if (isEmpty(value)){
                     return
                 }
@@ -174,10 +173,10 @@ export default function Hlexical(props) {
 
     return (
         <LexicalComposer initialConfig={editorConfig}>
-            <div className="editor-container" style={{height:"100%"}}>
+            <div className="editor-container">
                 {/* 富文本插件 */}
                 <ToolbarPlugin/>
-                <div className="editor-inner"  style={{height:"100%"}}>
+                <div className="editor-inner">
                     <RichTextPlugin
                         contentEditable={<ContentEditable className="editor-input"/>}
                         placeholder={<Placeholder/>}

src/pages/Note/Hlexical/index.less

@@ -50,12 +50,16 @@ body {
     text-align: left;
     border-top-left-radius: 10px;
     border-top-right-radius: 10px;
-    height: auto;
+    height: 100%;
+  }
+  .toolbar{
+    height:4.9%;
+    margin-bottom:0.1%
   }
-  
   .editor-inner {
     background: #fff;
     position: relative;
+    height:95%
   }
   
   .editor-input {

src/pages/Note/index.jsx

@@ -75,7 +75,7 @@ const Note = () => {
                     <p style={{color: colorBgContainer, 'fontSize': 60}}>上善若水</p>
                 </div>
             </Sider>
-            <Sider trigger={null} collapsedWidth={0} width={217} collapsible collapsed={collapsed}
+            <Sider trigger={null} collapsedWidth={0} collapsible collapsed={collapsed}
                    style={{overflow:"auto"}}>
                 <ItemTree filePath={filePath}></ItemTree>
             </Sider>

src/pages/Note/index.less

@@ -1,6 +1,6 @@
 .HlexicalName {
   // 顶上有标题设置100h后下面会多处一部分
-  // height: 100vh;
+  height: 100%;
   width: auto;
 }
 .ant-tabs-top .ant-tabs-nav{

src/redux/dirMessage_reducer.js

@@ -157,6 +157,7 @@ export const dirMessageSlice = createSlice({
             })
         },
         dirFileRemove:(state,action)=>{
+            console.log("dirMessage:dirFileRemove", state, action)
             let filePath = action.payload.filePath;
             state.data = state.data.filter(file=>{
                 if (file.filePath === filePath && !file.dirFlag) {
@@ -177,7 +178,7 @@ function dirFileRemoveChild(fileList, selectDirKey) {
         if (file.filePath === selectDirKey && !file.dirFlag) {
             return false
         }else if (file.dirFlag && selectDirKey.startsWith(file.filePath) && Array.isArray(file.children) && file.children.length > 0) {
-            dirFileRemoveChild(file.children, selectDirKey)
+            file.children = dirFileRemoveChild(file.children, selectDirKey)
             return true
         }else {
             return true

src/redux/tableBarItem_reducer.js

@@ -77,6 +77,7 @@ export const tableBarItemSlice = createSlice({
             state.expandedKeyList=Array.from(new Set([...state.expandedKeyList]))
         },
         setExpandedKeys:(state, action)=>{
+            console.log("tableBarItemSlice:setExpandedKeys",action.payload)
             state.expandedKeyList=action.payload
         },
         removeExpandedKeys:(state, action)=>{

src/utils/PathOperate/index.jsx

@@ -8,7 +8,7 @@ export function getFileFullNameByPath(fileName){
 }
 
 export function replaceFileNameByFilePath(filePath,fileName){
-    let parsedPath = pathOperate.parse(fileName);
+    let parsedPath = pathOperate.parse(filePath);
     return pathOperate.format({"dir":parsedPath.dir,"base":fileName+parsedPath.ext})
 }
 export function getFileDirByPath(fileName){