feat:文件-标题

This commit is contained in:
shixiaohua 2024-02-21 15:47:08 +08:00
parent ef209357c6
commit 4a163039a8
3 changed files with 43 additions and 5 deletions

View File

@ -314,10 +314,10 @@ const ItemTree = (prop) => {
} }
return ( return (
<div style={{height: "100%",width:"200px"}}> <div style={{height: "100%"}}>
{getNodeTreeRightClickMenu()} {getNodeTreeRightClickMenu()}
<Search <Search
style={{marginBottom: 8,}} style={{marginBottom: "4px",}}
placeholder="Search" placeholder="Search"
onChange={onChange} onChange={onChange}
/> />

View File

@ -2,7 +2,7 @@ import React, {useRef, useState} from 'react';
import { import {
UserOutlined, UserOutlined,
} from '@ant-design/icons'; } from '@ant-design/icons';
import {Layout, Avatar, Tabs} from 'antd'; import {Layout, Avatar, Tabs, Button} from 'antd';
import Hlexical from './Hlexical'; import Hlexical from './Hlexical';
import ItemTree from "../../components/ItemTree"; import ItemTree from "../../components/ItemTree";
import './index.less' import './index.less'
@ -22,6 +22,18 @@ const Note = () => {
const activeKey=useSelector(state => state.tableBarItem.activeKey); const activeKey=useSelector(state => state.tableBarItem.activeKey);
const items = useSelector(state => state.tableBarItem.data) const items = useSelector(state => state.tableBarItem.data)
let filePath = useSelector(state => state.dirMessage.data); let filePath = useSelector(state => state.dirMessage.data);
const itemTreeTab=[
{
key: '1',
label: '文件',
children: <ItemTree filePath={filePath}></ItemTree>,
}, {
key: '2',
label: '标题',
children: '开发中,尽情期待。。',
}
]
const onChange = (newActiveKey) => { const onChange = (newActiveKey) => {
console.log("setActiveKey(newActiveKey)",newActiveKey) console.log("setActiveKey(newActiveKey)",newActiveKey)
dispatch(setActiveKey({"activeKey":newActiveKey})); dispatch(setActiveKey({"activeKey":newActiveKey}));
@ -76,8 +88,12 @@ const Note = () => {
</div> </div>
</Sider> </Sider>
<Sider trigger={null} collapsedWidth={0} collapsible collapsed={collapsed} <Sider trigger={null} collapsedWidth={0} collapsible collapsed={collapsed}
style={{overflow:"auto"}}> // style={{overflow:"auto"}}
<ItemTree filePath={filePath}></ItemTree> >
<Tabs id="itemTreeTabs" defaultActiveKey="1" items={itemTreeTab}
// onChange={itemTreeOnChange}
style ={{background:"#fff"}}
/>
</Sider> </Sider>
<Layout> <Layout>
<Tabs <Tabs

View File

@ -5,4 +5,26 @@
} }
.ant-tabs-top .ant-tabs-nav{ .ant-tabs-top .ant-tabs-nav{
margin-bottom: 0; margin-bottom: 0;
}
#itemTreeTabs{
margin: 0;
height: 100%;
}
#itemTreeTabs .ant-tabs-nav{
height: 6%;
}
#itemTreeTabs .ant-tabs-content-holder{
height: 94%;
}
#itemTreeTabs .ant-tabs-tab{
margin: 0;
font-size: 36px;
width: 50%;
text-align: center;
}
#itemTreeTabs .ant-tabs-nav-list{
width: 100%;
}
#itemTreeTabs .ant-tabs-tab-btn{
width: 100%;
} }