zmh 2 years ago
parent
commit
2558f5f309
  1. 139
      web/client/src/sections/humanAffairs/containers/resourceRepository.jsx
  2. 12
      web/client/src/sections/humanAffairs/style.less

139
web/client/src/sections/humanAffairs/containers/resourceRepository.jsx

@ -1,10 +1,114 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import Empty from '../components/empty'; import { Button, Col, Row, Input, Tree, Space } from '@douyinfe/semi-ui';
import { IconSearch } from '@douyinfe/semi-icons';
import '../style.less' import '../style.less'
const ResourceRepository = (props) => { const ResourceRepository = (props) => {
const { dispatch, actions } = props const { dispatch, actions } = props;
const treeData = [
{
label: '亚洲',
value: 'Asia',
key: '0',
children: [
{
label: '中国',
value: 'China',
key: '0-0',
children: [
{
label: '北京',
value: 'Beijing',
key: '0-0-0',
},
{
label: '上海',
value: 'Shanghai',
key: '0-0-1',
},
],
},
],
},
{
label: '北美洲',
value: 'North America',
key: '1',
children: [
{
label: '中国',
value: 'China',
key: '0-0',
children: [
{
label: '北京',
value: 'Beijing',
key: '0-0-0',
},
{
label: '上海',
value: 'Shanghai',
key: '0-0-1',
},
],
},
],
}, {
label: '亚洲',
value: 'Asia',
key: '3',
children: [
{
label: '中国',
value: 'China',
key: '0-0',
children: [
{
label: '北京',
value: 'Beijing',
key: '0-0-0',
},
{
label: '上海',
value: 'Shanghai',
key: '0-0-1',
},
],
},
],
},
{
label: '北美洲',
value: 'North America',
key: '4',
children: [
{
label: '中国',
value: 'China',
key: '0-0',
children: [
{
label: '北京',
value: 'Beijing',
key: '0-0-0',
},
{
label: '上海',
value: 'Shanghai',
key: '0-0-1',
},
],
},
],
}
];
const style = {
width: 260,
height: 420,
border: '1px solid var(--semi-color-border)'
};
return ( return (
<> <>
@ -24,7 +128,35 @@ const ResourceRepository = (props) => {
<div style={{ marginLeft: 6, fontSize: 12, color: '#969799', fontFamily: "DINExp", }}>RESOURCE REPOSITORY</div> <div style={{ marginLeft: 6, fontSize: 12, color: '#969799', fontFamily: "DINExp", }}>RESOURCE REPOSITORY</div>
</div> </div>
</div> </div>
<Empty /> <Row className='resourceRepository'>
{/* 左侧 */}
<Col span={6}>
<Button theme='solid' type='primary' >新建文件夹</Button>
<br />
<Input suffix={<IconSearch />} showClear placeholder="请输入"></Input>
<Tree
treeData={treeData}
defaultExpandAll
style={style}
/>
</Col>
{/* 右侧内容 */}
<Col span={18}>
<Row gutter={16}>
<Col span={12}>
<Space>
<Button theme='solid' type='primary' >上传文件</Button>
<span><strong>当前文件夹公司培训资源/人力资源部2/2022-11</strong></span>
</Space>
</Col>
<Col span={12} justify="end">
<Input suffix={<IconSearch />} showClear placeholder="文件名称、更新时间"></Input>
</Col>
</Row>
<br />
</Col>
</Row>
</div> </div>
</div> </div>
</> </>
@ -36,6 +168,7 @@ function mapStateToProps(state) {
return { return {
user: auth.user, user: auth.user,
actions: global.actions, actions: global.actions,
clientHeight: global.clientHeight,
}; };
} }

12
web/client/src/sections/humanAffairs/style.less

@ -7,3 +7,15 @@
} }
} }
} }
.resourceRepository{
margin-top: 20px;
.semi-button{
margin-bottom: 20px;
}
.semi-input-wrapper{
width: 260px;
}
.semi-tree-wrapper{
margin-top: 20px;
}
}

Loading…
Cancel
Save