From 76e85fbfd8d9a847945379e3dee878f20ce59628 Mon Sep 17 00:00:00 2001 From: zwjamnsss Date: Fri, 29 Sep 2017 14:24:07 +0800 Subject: [PATCH 1/8] =?UTF-8?q?feat:=20=E6=8E=A5=E5=8F=A3=E5=AF=BC?= =?UTF-8?q?=E5=85=A5modal?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../UsernameAutoComplete.js | 2 +- .../Interface/InterfaceCol/ImportInterface.js | 126 ++++++++++++++++-- .../InterfaceCol/InterfaceColMenu.js | 55 +++++--- 3 files changed, 152 insertions(+), 31 deletions(-) diff --git a/client/components/UsernameAutoComplete/UsernameAutoComplete.js b/client/components/UsernameAutoComplete/UsernameAutoComplete.js index 19e83ac0..9fdf22b5 100755 --- a/client/components/UsernameAutoComplete/UsernameAutoComplete.js +++ b/client/components/UsernameAutoComplete/UsernameAutoComplete.js @@ -93,7 +93,7 @@ class UsernameAutoComplete extends Component { render () { - const { dataSource, fetching, value } = this.state; + const { dataSource, fetching } = this.state; const children = dataSource.map((item, index) => ( )) diff --git a/client/containers/Project/Interface/InterfaceCol/ImportInterface.js b/client/containers/Project/Interface/InterfaceCol/ImportInterface.js index 8317c2eb..31bcc749 100644 --- a/client/containers/Project/Interface/InterfaceCol/ImportInterface.js +++ b/client/containers/Project/Interface/InterfaceCol/ImportInterface.js @@ -1,7 +1,8 @@ import React, { Component } from 'react' import PropTypes from 'prop-types' // import { connect } from 'react-redux' -// import { Table } from 'antd' +import { Table } from 'antd' +import variable from '../../../../constants/variable'; // import { fetchInterfaceList } from '../../../../reducer/modules/interface.js'; // @connect( @@ -19,22 +20,125 @@ export default class ImportInterface extends Component { super(props) } - static propTypes = { - // colId: PropTypes.number, - // fetchInterfaceList: PropTypes.func, - // projectId: PropTypes.number, - list: PropTypes.array + state = { + selectedRowKeys: [], + categoryCount: {} } - // componentWillMount() { - // this.props.fetchInterfaceList(this.props.projectId); - // } + static propTypes = { + list: PropTypes.array, + onChange: PropTypes.func + } render() { - console.log(this.props.list) + const { list } = this.props; + // const { selectedRowKeys } = this.state; + const data = list.map(item => { + return { + key: 'category_' + item._id, + title: item.name, + isCategory: true, + children: item.list ? item.list.map(e => { + e.key = e._id + e.categoryKey = 'category_' + item._id + e.categoryLength = item.list.length + return e + }) : [] + } + }); + const rowSelection = { + onChange: (selectedRowKeys) => { + // console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows); + // if (selectedRows.isCategory) { + // const selectedRowKeys = selectedRows.children.map(item => item._id) + // this.setState({ selectedRowKeys }) + // } + this.props.onChange(selectedRowKeys.filter(id => id.indexOf('category') === -1)); + }, + onSelect: (record, selected) => { + // console.log(record, selected, selectedRows); + const oldSelecteds = this.state.selectedRowKeys; + const categoryCount = this.state.categoryCount; + const categoryKey = record.categoryKey; + const categoryLength = record.categoryLength; + let selectedRowKeys = []; + if (record.isCategory) { + selectedRowKeys = record.children.map(item => item._id).concat(record.key) + if (selected) { + selectedRowKeys = selectedRowKeys.filter(id => oldSelecteds.indexOf(id) === -1).concat(oldSelecteds) + categoryCount[categoryKey] = categoryLength; + } else { + selectedRowKeys = oldSelecteds.filter(id => selectedRowKeys.indexOf(id) === -1) + categoryCount[categoryKey] = 0; + } + } else { + if (selected) { + selectedRowKeys = oldSelecteds.concat(record._id) + if (categoryCount[categoryKey]) { + categoryCount[categoryKey] += 1; + } else { + categoryCount[categoryKey] = 1; + } + if (categoryCount[categoryKey] === record.categoryLength) { + selectedRowKeys.push(categoryKey) + } + } else { + selectedRowKeys = oldSelecteds.filter(id => id !== record._id) + if (categoryCount[categoryKey]) { + categoryCount[categoryKey] -= 1; + } + selectedRowKeys = selectedRowKeys.filter(id => id !== categoryKey) + } + } + this.setState({ selectedRowKeys, categoryCount }) + }, + onSelectAll: (selected) => { + // console.log(selected, selectedRows, changeRows); + let selectedRowKeys = []; + let categoryCount = this.state.categoryCount; + if (selected) { + data.forEach(item => { + if(item.children) { + categoryCount['category_' + item._id] = item.children.length; + selectedRowKeys = selectedRowKeys.concat(item.children.map(item => item._id)) + } + }); + selectedRowKeys = selectedRowKeys.concat(data.map(item => item.key)) + } else { + categoryCount = {}; + selectedRowKeys = []; + } + this.setState({ selectedRowKeys, categoryCount }) + }, + selectedRowKeys: this.state.selectedRowKeys + }; + + const columns = [{ + title: '接口名称', + dataIndex: 'title', + width: '30%' + }, { + title: '接口路径', + dataIndex: 'path', + width: '40%' + }, { + title: '请求方法', + dataIndex: 'method', + render: (item) => { + let methodColor = variable.METHOD_COLOR[item ? item.toLowerCase() : 'get']; + return {item} + } + }, { + title: '状态', + dataIndex: 'status', + render: (text) => { + return text && (text === 'done' ? 已完成 : 未完成) + } + }]; + return (
-
{this.props.list}
+ ) } diff --git a/client/containers/Project/Interface/InterfaceCol/InterfaceColMenu.js b/client/containers/Project/Interface/InterfaceCol/InterfaceColMenu.js index e2bb364a..70aad0e9 100755 --- a/client/containers/Project/Interface/InterfaceCol/InterfaceColMenu.js +++ b/client/containers/Project/Interface/InterfaceCol/InterfaceColMenu.js @@ -4,7 +4,6 @@ import { withRouter } from 'react-router' import PropTypes from 'prop-types' import { fetchInterfaceColList, fetchInterfaceCaseList, setColData } from '../../../../reducer/modules/interfaceCol' import { fetchInterfaceList } from '../../../../reducer/modules/interface.js'; -import { autobind } from 'core-decorators'; import axios from 'axios'; // import { Input, Icon, Button, Modal, message, Tooltip, Tree, Dropdown, Menu, Form } from 'antd'; import ImportInterface from './ImportInterface' @@ -82,8 +81,9 @@ export default class InterfaceColMenu extends Component { colModalVisible: false, editColId: 0, filterValue: '', - // importInterVisible: false, - importInterIds: [] + importInterVisible: false, + importInterIds: [], + importColId: 0 } constructor(props) { @@ -106,8 +106,7 @@ export default class InterfaceColMenu extends Component { this.setState({expandedKeys}) } - @autobind - async addorEditCol() { + addorEditCol = async () => { const { colName: name, colDesc: desc } = this.form.getFieldsValue(); const { colModalType, editColId: col_id } = this.state; const project_id = this.props.match.params.id; @@ -201,19 +200,28 @@ export default class InterfaceColMenu extends Component { this.setState({ importInterIds }) } - showImportInterface = async (colId) => { + showImportInterfaceModal = async (colId) => { const projectId = this.props.match.params.id; - await fetchInterfaceList(projectId) - confirm({ - title: '请选择添加到集合的接口', - content: , - onOk() { - console.log(colId); - }, - onCancel() { - console.log('Cancel'); - } - }); + await this.props.fetchInterfaceList(projectId) + this.setState({ importInterVisible: true, importColId: colId }) + // confirm({ + // title: '导入接口到集合', + // content: , + // onOk() { + // console.log(colId) + // console.log(this.state.importInterIds); + // }, + // onCancel() { + // console.log('Cancel'); + // }, + // width: 800 + // }); + } + handleImportOk = () => { + this.setState({ importInterVisible: false }) + } + handleImportCancel = () => { + this.setState({ importInterVisible: false }) } filterCol = (e) => { @@ -223,7 +231,7 @@ export default class InterfaceColMenu extends Component { render() { const { currColId, currCaseId, isShowCol } = this.props; - const { colModalType, colModalVisible, filterValue } = this.state; + const { colModalType, colModalVisible, filterValue, importInterVisible } = this.state; // const menu = (col) => { // return ( @@ -282,7 +290,7 @@ export default class InterfaceColMenu extends Component {
{this.showDelColConfirm(col._id)}} /> {this.showColModal('edit', col)}} /> - this.showImportInterface(col._id)} /> + this.showImportInterfaceModal(col._id)} />
{/* e.stopPropagation()}> @@ -320,6 +328,15 @@ export default class InterfaceColMenu extends Component { onCancel={() => { this.setState({ colModalVisible: false }) }} onCreate={this.addorEditCol} > + + + ) } From af28b434215eeaaf780b118882ec012776d05320 Mon Sep 17 00:00:00 2001 From: "wenbo.dong" Date: Fri, 29 Sep 2017 14:44:00 +0800 Subject: [PATCH 2/8] =?UTF-8?q?feat:=20=E6=96=B0=E6=89=8B=E6=8C=87?= =?UTF-8?q?=E5=BC=95=E6=B7=BB=E5=8A=A0=E9=81=AE=E7=BD=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/Application.js | 9 +++++++-- client/styles/common.scss | 10 ++++++++++ 2 files changed, 17 insertions(+), 2 deletions(-) diff --git a/client/Application.js b/client/Application.js index 09ed662f..1a50d50d 100755 --- a/client/Application.js +++ b/client/Application.js @@ -17,7 +17,8 @@ const LOADING_STATUS = 0; @connect( state => { return { - loginState: state.user.loginState + loginState: state.user.loginState, + study: state.user.study }; }, { @@ -34,7 +35,8 @@ export default class App extends Component { static propTypes = { checkLoginState: PropTypes.func, - loginState: PropTypes.number + loginState: PropTypes.number, + study: PropTypes.bool }; @@ -49,6 +51,8 @@ export default class App extends Component { } else { r = ( { + // 自定义 window.confirm + // http://reacttraining.cn/web/api/BrowserRouter/getUserConfirmation-func let container = document.createElement('div'); document.body.appendChild(container); ReactDOM.render(( @@ -69,6 +73,7 @@ export default class App extends Component {