mirror of
https://github.com/YMFE/yapi.git
synced 2024-12-21 05:19:42 +08:00
feat: add user module
This commit is contained in:
parent
86142d9848
commit
d047389d97
55
client/containers/User/index.js
Normal file
55
client/containers/User/index.js
Normal file
@ -0,0 +1,55 @@
|
||||
import './index.scss'
|
||||
import React, { Component } from 'react'
|
||||
import { connect } from 'react-redux'
|
||||
import PropTypes from 'prop-types'
|
||||
import Header from '../../components/Header/Header.js'
|
||||
|
||||
|
||||
@connect(
|
||||
state => {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
{
|
||||
// fetchInterfaceData,
|
||||
// projectMember,
|
||||
// closeProjectMember
|
||||
}
|
||||
)
|
||||
|
||||
class user extends Component {
|
||||
static propTypes = {
|
||||
fetchInterfaceData: PropTypes.func,
|
||||
interfaceData: PropTypes.array,
|
||||
projectMember: PropTypes.func,
|
||||
closeProjectMember: PropTypes.func,
|
||||
modalVisible: PropTypes.bool
|
||||
}
|
||||
|
||||
constructor(props) {
|
||||
super(props)
|
||||
}
|
||||
|
||||
componentWillMount () {
|
||||
|
||||
}
|
||||
|
||||
render () {
|
||||
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Header />
|
||||
|
||||
<section className="user-box">
|
||||
<InterfaceList projectMember={projectMember} />
|
||||
<InterfaceMode modalVisible={modalVisible} closeProjectMember={this.props.closeProjectMember} />
|
||||
<InterfaceTable data={interfaceData} />
|
||||
</section>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
export default Interface
|
39
client/containers/User/index.scss
Normal file
39
client/containers/User/index.scss
Normal file
@ -0,0 +1,39 @@
|
||||
/* .user-box.css */
|
||||
.user-box {
|
||||
max-width: 11rem;
|
||||
display: -webkit-box;
|
||||
-webkit-box-flex: 1;
|
||||
margin: 15px auto 0 auto;
|
||||
font-size: 0.14rem;
|
||||
background: #FFF;
|
||||
|
||||
.user-list {
|
||||
width: 216px;
|
||||
line-height: 45px;
|
||||
background: #f9fafe;
|
||||
|
||||
li {
|
||||
padding: 0 0 0 30px;
|
||||
color: #344562;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover, &.active {
|
||||
background: #657289;
|
||||
color: #FFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.user-table {
|
||||
-webkit-box-flex: 1;
|
||||
margin: 0 0 0 20px;
|
||||
|
||||
.ant-table-wrapper table {
|
||||
font-size: .14rem;
|
||||
|
||||
button {
|
||||
margin: 0 10px 0 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
25
client/containers/User/userList/userList.js
Normal file
25
client/containers/User/userList/userList.js
Normal file
@ -0,0 +1,25 @@
|
||||
import React, { Component } from 'react'
|
||||
import PropTypes from 'prop-types'
|
||||
|
||||
class InterfaceList extends Component {
|
||||
static propTypes = {
|
||||
projectMember: PropTypes.func
|
||||
}
|
||||
|
||||
constructor(props) {
|
||||
super(props)
|
||||
}
|
||||
|
||||
render () {
|
||||
const { projectMember } = this.props
|
||||
|
||||
return (
|
||||
<ul className="interface-list">
|
||||
<li className="active">个人资料</li>
|
||||
<li onClick={projectMember}>用户管理</li>
|
||||
</ul>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
export default InterfaceList
|
56
client/containers/User/userTable/InterfaceTable.js
Normal file
56
client/containers/User/userTable/InterfaceTable.js
Normal file
@ -0,0 +1,56 @@
|
||||
import React, { Component } from 'react'
|
||||
import { Table, Button } from 'antd'
|
||||
import PropTypes from 'prop-types'
|
||||
|
||||
class InterfaceTable extends Component {
|
||||
static propTypes = {
|
||||
data: PropTypes.array
|
||||
}
|
||||
|
||||
constructor(props) {
|
||||
super(props)
|
||||
}
|
||||
|
||||
render () {
|
||||
const columns = [{
|
||||
title: 'Uid',
|
||||
dataIndex: 'uid',
|
||||
key: 'uid'
|
||||
}, {
|
||||
title: '用户名',
|
||||
dataIndex: 'username',
|
||||
key: 'username'
|
||||
}, {
|
||||
title: 'email',
|
||||
dataIndex: 'email',
|
||||
key: 'email'
|
||||
}, {
|
||||
title: '更新日期',
|
||||
dataIndex: 'up_time',
|
||||
key: 'up_time'
|
||||
}, {
|
||||
title: '功能',
|
||||
'key': 'action',
|
||||
render: () => {
|
||||
return (
|
||||
<span>
|
||||
<Button type="primary">编辑</Button>
|
||||
<Button type="danger">删除</Button>
|
||||
</span>
|
||||
)
|
||||
}
|
||||
}]
|
||||
|
||||
const data = [
|
||||
{uid: 1, username: 'admin', email: 'admin@admin.com', up_time: '2017.07.01'}
|
||||
];
|
||||
|
||||
return (
|
||||
<section className="interface-table">
|
||||
<Table columns={columns} dataSource={data} />
|
||||
</section>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
export default InterfaceTable
|
@ -4,7 +4,7 @@ import {
|
||||
} from '../../constants/action-types';
|
||||
|
||||
const initialState = {
|
||||
isLogin: true,
|
||||
isLogin: false,
|
||||
userName: null,
|
||||
uid: null,
|
||||
loginWrapActiveKey:"1"
|
||||
|
Loading…
Reference in New Issue
Block a user