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';
|
} from '../../constants/action-types';
|
||||||
|
|
||||||
const initialState = {
|
const initialState = {
|
||||||
isLogin: true,
|
isLogin: false,
|
||||||
userName: null,
|
userName: null,
|
||||||
uid: null,
|
uid: null,
|
||||||
loginWrapActiveKey:"1"
|
loginWrapActiveKey:"1"
|
||||||
|
Loading…
Reference in New Issue
Block a user