mirror of
https://github.com/YMFE/yapi.git
synced 2024-12-15 05:10:47 +08:00
Merge branch 'dev' of http://gitlab.corp.qunar.com/mfe/yapi into dev
This commit is contained in:
commit
72e4bea3ce
@ -18,7 +18,7 @@ export default class Group extends Component {
|
||||
|
||||
const GroupContent = (
|
||||
<Layout>
|
||||
<Sider style={{ height: '100vh', marginLeft: '24px', marginTop: '24px' }} width={300}>
|
||||
<Sider style={{ height: 'auto', marginLeft: '24px', marginTop: '24px' }} width={300}>
|
||||
<div className="logo" />
|
||||
<GroupList></GroupList>
|
||||
</Sider>
|
||||
|
@ -83,7 +83,7 @@ class Interface extends Component {
|
||||
// console.log(matchPath(this.props.location.pathname, contentRouter));
|
||||
return (
|
||||
<Layout style={{marginTop: '-24px'}}>
|
||||
<Sider style={{ height: '100vh', marginLeft: '24px', marginTop: '24px' }} width={300}>
|
||||
<Sider style={{ height: 'auto', marginLeft: '24px', marginTop: '24px' }} width={300}>
|
||||
<div className="left-menu">
|
||||
<Tabs type="card" activeKey={activeKey} onChange={this.onChange}>
|
||||
<Tabs.TabPane tab="接口列表" key="api">
|
||||
|
@ -318,7 +318,12 @@ class InterfaceColContent extends Component {
|
||||
property: 'casename',
|
||||
header: {
|
||||
label: '用例名称'
|
||||
},
|
||||
},
|
||||
props: {
|
||||
style:{
|
||||
width: '250px'
|
||||
}
|
||||
},
|
||||
cell: {
|
||||
formatters: [
|
||||
(text, { rowData }) => {
|
||||
@ -335,6 +340,11 @@ class InterfaceColContent extends Component {
|
||||
Key</Tooltip>
|
||||
}]
|
||||
},
|
||||
props: {
|
||||
style:{
|
||||
width: '100px'
|
||||
}
|
||||
},
|
||||
cell: {
|
||||
formatters: [
|
||||
(value, { rowData }) => {
|
||||
@ -346,6 +356,11 @@ class InterfaceColContent extends Component {
|
||||
header: {
|
||||
label: '状态'
|
||||
},
|
||||
props: {
|
||||
style:{
|
||||
width: '100px'
|
||||
}
|
||||
},
|
||||
cell: {
|
||||
formatters: [(value, { rowData }) => {
|
||||
switch (rowData.test_status) {
|
||||
@ -384,8 +399,16 @@ class InterfaceColContent extends Component {
|
||||
label: '测试报告'
|
||||
|
||||
},
|
||||
props: {
|
||||
style:{
|
||||
width: '100px'
|
||||
}
|
||||
},
|
||||
cell: {
|
||||
formatters: [(text, { rowData }) => {
|
||||
if(!this.reports[rowData.id]){
|
||||
return null;
|
||||
}
|
||||
return <Button onClick={() => this.openReport(rowData.id)}>报告</Button>
|
||||
}]
|
||||
}
|
||||
@ -416,14 +439,15 @@ class InterfaceColContent extends Component {
|
||||
<Table.Provider
|
||||
components={components}
|
||||
columns={resolvedColumns}
|
||||
style={{ width: '100%', lineHeight: '36px' }}
|
||||
style={{ width: '100%',borderCollapse: 'collapse' }}
|
||||
>
|
||||
<Table.Header
|
||||
style={{ textAlign: 'left' }}
|
||||
className="interface-col-table-header"
|
||||
headerRows={resolve.headerRows({ columns })}
|
||||
/>
|
||||
|
||||
<Table.Body
|
||||
className="interface-col-table-body"
|
||||
rows={resolvedRows}
|
||||
rowKey="id"
|
||||
onRow={this.onRow}
|
||||
|
@ -90,4 +90,24 @@
|
||||
|
||||
.interface-col{
|
||||
padding: 16px;
|
||||
.interface-col-table-header{
|
||||
background-color: rgb(238, 238, 238);
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
font-size:14px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.interface-col-table-body{
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
}
|
||||
|
||||
.interface-col-table-header th{
|
||||
padding-left:5px;
|
||||
}
|
||||
|
||||
.interface-col-table-body td{
|
||||
padding-left:5px;
|
||||
}
|
||||
}
|
||||
|
249
client/containers/Project/Setting/ProjectEnv/ProjectEnv.js
Normal file
249
client/containers/Project/Setting/ProjectEnv/ProjectEnv.js
Normal file
@ -0,0 +1,249 @@
|
||||
import React, { Component } from 'react'
|
||||
import { Form, Input, Icon, Select, Button, Row, Col, message } from 'antd';
|
||||
import PropTypes from 'prop-types';
|
||||
import { updateEnv, delProject, getProjectMsg, upsetProject } from '../../../../reducer/modules/project';
|
||||
import { fetchGroupMsg } from '../../../../reducer/modules/group';
|
||||
import { connect } from 'react-redux';
|
||||
import { withRouter } from 'react-router';
|
||||
const FormItem = Form.Item;
|
||||
const Option = Select.Option;
|
||||
import '../Setting.scss';
|
||||
// layout
|
||||
const formItemLayout = {
|
||||
wrapperCol: {
|
||||
sm: { span: 24 }
|
||||
},
|
||||
className: 'form-item'
|
||||
};
|
||||
let uuid = 0; // 环境配置的计数
|
||||
|
||||
@connect(
|
||||
state => {
|
||||
return {
|
||||
projectList: state.project.projectList,
|
||||
projectMsg: state.project.projectMsg
|
||||
}
|
||||
},
|
||||
{
|
||||
updateEnv,
|
||||
delProject,
|
||||
getProjectMsg,
|
||||
fetchGroupMsg,
|
||||
upsetProject
|
||||
}
|
||||
)
|
||||
@withRouter
|
||||
class PrpjectEnv extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
protocol: 'http:\/\/',
|
||||
envProtocolChange: 'http:\/\/',
|
||||
projectMsg: {}
|
||||
}
|
||||
}
|
||||
static propTypes = {
|
||||
projectId: PropTypes.number,
|
||||
form: PropTypes.object,
|
||||
updateEnv: PropTypes.func,
|
||||
delProject: PropTypes.func,
|
||||
getProjectMsg: PropTypes.func,
|
||||
history: PropTypes.object,
|
||||
fetchGroupMsg: PropTypes.func,
|
||||
upsetProject: PropTypes.func,
|
||||
projectList: PropTypes.array,
|
||||
projectMsg: PropTypes.object
|
||||
}
|
||||
|
||||
// 项目的修改操作 - 删除一项环境配置
|
||||
remove = (id) => {
|
||||
const { form } = this.props;
|
||||
// can use data-binding to get
|
||||
const envs = form.getFieldValue('envs');
|
||||
// We need at least one passenger
|
||||
if (envs.length === 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
// can use data-binding to set
|
||||
form.setFieldsValue({
|
||||
envs: envs.filter(key => {
|
||||
const realKey = key._id ? key._id : key
|
||||
return realKey !== id;
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
// 项目的修改操作 - 添加一项环境配置
|
||||
add = () => {
|
||||
uuid++;
|
||||
const { form } = this.props;
|
||||
// can use data-binding to get
|
||||
const envs = form.getFieldValue('envs');
|
||||
const nextKeys = envs.concat(uuid);
|
||||
// can use data-binding to set
|
||||
// important! notify form to detect changes
|
||||
form.setFieldsValue({
|
||||
envs: nextKeys
|
||||
});
|
||||
}
|
||||
|
||||
// 确认修改
|
||||
handleOk = (e) => {
|
||||
e.preventDefault();
|
||||
const { form, updateEnv, projectMsg } = this.props;
|
||||
form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
let assignValue = Object.assign(projectMsg, values);
|
||||
values.protocol = this.state.protocol.split(':')[0];
|
||||
assignValue.env = assignValue.envs.map((item, index) => {
|
||||
return {
|
||||
name: values['envs-name-' + index],
|
||||
domain: values['envs-protocol-' + index] + values['envs-domain-' + index]
|
||||
}
|
||||
});
|
||||
console.log(assignValue);
|
||||
|
||||
updateEnv(assignValue).then((res) => {
|
||||
if (res.payload.data.errcode == 0) {
|
||||
this.props.getProjectMsg(this.props.projectId);
|
||||
message.success('修改成功! ');
|
||||
// this.props.history.push('/group');
|
||||
}
|
||||
}).catch(() => {
|
||||
});
|
||||
form.resetFields();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// async componentWillMount() {
|
||||
// // await this.props.getProjectMsg(this.props.projectId);
|
||||
// }
|
||||
|
||||
render() {
|
||||
const { getFieldDecorator, getFieldValue } = this.props.form;
|
||||
const { projectMsg } = this.props;
|
||||
let envMessage = [];
|
||||
const { env } = projectMsg;
|
||||
if (env && env.length !== 0) {
|
||||
envMessage = env;
|
||||
}
|
||||
|
||||
getFieldDecorator('envs', { initialValue: envMessage });
|
||||
const envs = getFieldValue('envs');
|
||||
const envSettingItems = envs.map((k, index) => {
|
||||
const secondIndex = 'next' + index; // 为保证key的唯一性
|
||||
return (
|
||||
<Row key={index} type="flex" justify="space-between" align={index === 0 ? 'middle' : 'top'}>
|
||||
<Col span={11}>
|
||||
<FormItem
|
||||
label={index === 0 ? (
|
||||
<span>环境名称</span>) : ''}
|
||||
required={false}
|
||||
key={index}
|
||||
>
|
||||
{getFieldDecorator(`envs-name-${index}`, {
|
||||
validateTrigger: ['onChange', 'onBlur'],
|
||||
initialValue: envMessage.length !== 0 ? k.name : '',
|
||||
rules: [{
|
||||
required: false,
|
||||
whitespace: true,
|
||||
validator(rule, value, callback) {
|
||||
if (value) {
|
||||
if (value.length === 0) {
|
||||
callback('请输入环境名称');
|
||||
} else if (!/\S/.test(value)) {
|
||||
callback('请输入环境名称');
|
||||
} else {
|
||||
return callback();
|
||||
}
|
||||
} else {
|
||||
callback('请输入环境名称');
|
||||
}
|
||||
}
|
||||
}]
|
||||
})(
|
||||
<Input placeholder="请输入环境名称" style={{ width: '90%', marginRight: 8 }} />
|
||||
)}
|
||||
</FormItem>
|
||||
</Col>
|
||||
<Col span={11}>
|
||||
<FormItem
|
||||
label={index === 0 ? (
|
||||
<span>环境域名</span>) : ''}
|
||||
required={false}
|
||||
key={secondIndex}
|
||||
>
|
||||
{getFieldDecorator(`envs-domain-${index}`, {
|
||||
validateTrigger: ['onChange', 'onBlur'],
|
||||
initialValue: envMessage.length !== 0 && k.domain ? k.domain.split('\/\/')[1] : '',
|
||||
rules: [{
|
||||
required: false,
|
||||
whitespace: true,
|
||||
validator(rule, value, callback) {
|
||||
if (value) {
|
||||
if (value.length === 0) {
|
||||
callback('请输入环境域名!');
|
||||
} else if (/\s/.test(value)) {
|
||||
callback('环境域名不允许出现空格!');
|
||||
} else {
|
||||
return callback();
|
||||
}
|
||||
} else {
|
||||
callback('请输入环境域名!');
|
||||
}
|
||||
}
|
||||
}]
|
||||
})(
|
||||
<Input placeholder="请输入环境域名" style={{ width: '90%', marginRight: 8 }} addonBefore={
|
||||
getFieldDecorator(`envs-protocol-${index}`, {
|
||||
initialValue: envMessage.length !== 0 && k.domain ? k.domain.split('\/\/')[0] + '\/\/' : 'http\:\/\/',
|
||||
rules: [{
|
||||
required: true
|
||||
}]
|
||||
})(
|
||||
<Select>
|
||||
<Option value="http://">{'http:\/\/'}</Option>
|
||||
<Option value="https://">{'https:\/\/'}</Option>
|
||||
</Select>
|
||||
)} />
|
||||
)}
|
||||
</FormItem>
|
||||
</Col>
|
||||
<Col span={2}>
|
||||
{/* 新增的项中,只有最后一项有删除按钮 */}
|
||||
{(envs.length > 0 && k._id) || (envs.length == index + 1) ? (
|
||||
<Icon
|
||||
className="dynamic-delete-button"
|
||||
type="minus-circle-o"
|
||||
onClick={() => {
|
||||
return this.remove(k._id ? k._id : k);
|
||||
}}
|
||||
/>
|
||||
) : null}
|
||||
</Col>
|
||||
</Row>
|
||||
);
|
||||
});
|
||||
return (
|
||||
<div className="m-panel">
|
||||
<div className="panel-title">
|
||||
<h2 className="title">在这里添加项目的环境配置</h2>
|
||||
<p className="desc">你可以添加多个环境,用于区分不同的使用场景。</p>
|
||||
</div>
|
||||
<FormItem {...formItemLayout}>
|
||||
{envSettingItems}
|
||||
<Button type="default" onClick={this.add} >
|
||||
<Icon type="plus" /> 添加环境配置
|
||||
</Button>
|
||||
</FormItem>
|
||||
<div className="btnwrap-changeproject">
|
||||
<Button className="m-btn btn-save" icon="save" type="primary" size="large" onClick={this.handleOk} >保 存</Button>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
export default Form.create()(PrpjectEnv);
|
@ -1,5 +1,5 @@
|
||||
import React, { Component } from 'react'
|
||||
import { Form, Input, Icon, Tooltip, Select, Button, Row, Col, message, Card, Radio, Alert, Modal, Popover, Tabs, Affix } from 'antd';
|
||||
import { Form, Input, Icon, Tooltip, Button, Row, Col, message, Card, Radio, Alert, Modal, Popover } from 'antd';
|
||||
import PropTypes from 'prop-types';
|
||||
import { updateProject, delProject, getProjectMsg, upsetProject } from '../../../../reducer/modules/project';
|
||||
import { fetchGroupMsg } from '../../../../reducer/modules/group';
|
||||
@ -7,14 +7,12 @@ import { connect } from 'react-redux';
|
||||
const { TextArea } = Input;
|
||||
import { withRouter } from 'react-router';
|
||||
const FormItem = Form.Item;
|
||||
const Option = Select.Option;
|
||||
const RadioGroup = Radio.Group;
|
||||
const RadioButton = Radio.Button;
|
||||
import constants from '../../../../constants/variable.js';
|
||||
const confirm = Modal.confirm;
|
||||
import { nameLengthLimit } from '../../../../common';
|
||||
import '../Setting.scss';
|
||||
const TabPane = Tabs.TabPane;
|
||||
// layout
|
||||
const formItemLayout = {
|
||||
labelCol: {
|
||||
@ -29,7 +27,6 @@ const formItemLayout = {
|
||||
},
|
||||
className: 'form-item'
|
||||
};
|
||||
let uuid = 0; // 环境配置的计数
|
||||
|
||||
@connect(
|
||||
state => {
|
||||
@ -52,7 +49,6 @@ class ProjectMessage extends Component {
|
||||
super(props);
|
||||
this.state = {
|
||||
protocol: 'http:\/\/',
|
||||
envProtocolChange: 'http:\/\/',
|
||||
projectMsg: {}
|
||||
}
|
||||
}
|
||||
@ -69,14 +65,6 @@ class ProjectMessage extends Component {
|
||||
projectMsg: PropTypes.object
|
||||
}
|
||||
|
||||
// 修改线上域名的协议类型 (http/https)
|
||||
protocolChange = (value) => {
|
||||
this.setState({
|
||||
protocol: value,
|
||||
currGroup: ''
|
||||
})
|
||||
}
|
||||
|
||||
// 确认修改
|
||||
handleOk = (e) => {
|
||||
e.preventDefault();
|
||||
@ -85,12 +73,6 @@ class ProjectMessage extends Component {
|
||||
if (!err) {
|
||||
let assignValue = Object.assign(projectMsg, values);
|
||||
values.protocol = this.state.protocol.split(':')[0];
|
||||
assignValue.env = assignValue.envs.map((item, index) => {
|
||||
return {
|
||||
name: values['envs-name-' + index],
|
||||
domain: values['envs-protocol-' + index] + values['envs-domain-' + index]
|
||||
}
|
||||
});
|
||||
|
||||
updateProject(assignValue).then((res) => {
|
||||
if (res.payload.data.errcode == 0) {
|
||||
@ -105,39 +87,6 @@ class ProjectMessage extends Component {
|
||||
});
|
||||
}
|
||||
|
||||
// 项目的修改操作 - 删除一项环境配置
|
||||
remove = (id) => {
|
||||
const { form } = this.props;
|
||||
// can use data-binding to get
|
||||
const envs = form.getFieldValue('envs');
|
||||
// We need at least one passenger
|
||||
if (envs.length === 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
// can use data-binding to set
|
||||
form.setFieldsValue({
|
||||
envs: envs.filter(key => {
|
||||
const realKey = key._id ? key._id : key
|
||||
return realKey !== id;
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
// 项目的修改操作 - 添加一项环境配置
|
||||
add = () => {
|
||||
uuid++;
|
||||
const { form } = this.props;
|
||||
// can use data-binding to get
|
||||
const envs = form.getFieldValue('envs');
|
||||
const nextKeys = envs.concat(uuid);
|
||||
// can use data-binding to set
|
||||
// important! notify form to detect changes
|
||||
form.setFieldsValue({
|
||||
envs: nextKeys
|
||||
});
|
||||
}
|
||||
|
||||
showConfirm = () => {
|
||||
let that = this;
|
||||
confirm({
|
||||
@ -199,113 +148,13 @@ class ProjectMessage extends Component {
|
||||
}
|
||||
|
||||
render() {
|
||||
const { getFieldDecorator, getFieldValue } = this.props.form;
|
||||
const { getFieldDecorator } = this.props.form;
|
||||
const { projectMsg } = this.props;
|
||||
const mockUrl = location.protocol + '//' + location.hostname + (location.port !== "" ? ":" + location.port : "") + `/mock/${projectMsg._id}${projectMsg.basepath}+$接口请求路径`
|
||||
let initFormValues = {};
|
||||
let envMessage = [];
|
||||
const { name, basepath, desc, env, project_type } = projectMsg;
|
||||
initFormValues = { name, basepath, desc, env, project_type };
|
||||
if (env && env.length !== 0) {
|
||||
envMessage = env;
|
||||
}
|
||||
const { name, basepath, desc, project_type } = projectMsg;
|
||||
initFormValues = { name, basepath, desc, project_type };
|
||||
|
||||
getFieldDecorator('envs', { initialValue: envMessage });
|
||||
const envs = getFieldValue('envs');
|
||||
const envSettingItems = envs.map((k, index) => {
|
||||
const secondIndex = 'next' + index; // 为保证key的唯一性
|
||||
return (
|
||||
<Row key={index} type="flex" justify="space-between" align={index === 0 ? 'middle' : 'top'}>
|
||||
<Col span={11}>
|
||||
<FormItem
|
||||
label={index === 0 ? (
|
||||
<span>环境名称</span>) : ''}
|
||||
required={false}
|
||||
key={index}
|
||||
>
|
||||
{getFieldDecorator(`envs-name-${index}`, {
|
||||
validateTrigger: ['onChange', 'onBlur'],
|
||||
initialValue: envMessage.length !== 0 ? k.name : '',
|
||||
rules: [{
|
||||
required: false,
|
||||
whitespace: true,
|
||||
validator(rule, value, callback) {
|
||||
if (value) {
|
||||
if (value.length === 0) {
|
||||
callback('请输入环境名称');
|
||||
} else if (!/\S/.test(value)) {
|
||||
callback('请输入环境名称');
|
||||
} else {
|
||||
return callback();
|
||||
}
|
||||
} else {
|
||||
callback('请输入环境名称');
|
||||
}
|
||||
}
|
||||
}]
|
||||
})(
|
||||
<Input placeholder="请输入环境名称" style={{ width: '90%', marginRight: 8 }} />
|
||||
)}
|
||||
</FormItem>
|
||||
</Col>
|
||||
<Col span={11}>
|
||||
<FormItem
|
||||
label={index === 0 ? (
|
||||
<span>环境域名</span>) : ''}
|
||||
required={false}
|
||||
key={secondIndex}
|
||||
>
|
||||
{getFieldDecorator(`envs-domain-${index}`, {
|
||||
validateTrigger: ['onChange', 'onBlur'],
|
||||
initialValue: envMessage.length !== 0 && k.domain ? k.domain.split('\/\/')[1] : '',
|
||||
rules: [{
|
||||
required: false,
|
||||
whitespace: true,
|
||||
validator(rule, value, callback) {
|
||||
if (value) {
|
||||
if (value.length === 0) {
|
||||
callback('请输入环境域名!');
|
||||
} else if (/\s/.test(value)) {
|
||||
callback('环境域名不允许出现空格!');
|
||||
} else {
|
||||
return callback();
|
||||
}
|
||||
} else {
|
||||
callback('请输入环境域名!');
|
||||
}
|
||||
}
|
||||
}]
|
||||
})(
|
||||
<Input placeholder="请输入环境域名" style={{ width: '90%', marginRight: 8 }} addonBefore={
|
||||
getFieldDecorator(`envs-protocol-${index}`, {
|
||||
initialValue: envMessage.length !== 0 && k.domain ? k.domain.split('\/\/')[0] + '\/\/' : 'http\:\/\/',
|
||||
rules: [{
|
||||
required: true
|
||||
}]
|
||||
})(
|
||||
<Select>
|
||||
<Option value="http://">{'http:\/\/'}</Option>
|
||||
<Option value="https://">{'https:\/\/'}</Option>
|
||||
</Select>
|
||||
)} />
|
||||
)}
|
||||
</FormItem>
|
||||
</Col>
|
||||
<Col span={2}>
|
||||
{/* 新增的项中,只有最后一项有删除按钮 */}
|
||||
{(envs.length > 0 && k._id) || (envs.length == index + 1) ? (
|
||||
<Icon
|
||||
className="dynamic-delete-button"
|
||||
type="minus-circle-o"
|
||||
onClick={() => {
|
||||
return this.remove(k._id ? k._id : k);
|
||||
}}
|
||||
/>
|
||||
) : null}
|
||||
</Col>
|
||||
</Row>
|
||||
);
|
||||
});
|
||||
const colorArr = Object.entries(constants.PROJECT_COLOR);
|
||||
const colorSelector = (<RadioGroup onChange={this.changeProjectColor} value={projectMsg.color} className="color">
|
||||
{colorArr.map((item, index) => {
|
||||
@ -319,156 +168,140 @@ class ProjectMessage extends Component {
|
||||
</RadioGroup>);
|
||||
return (
|
||||
<div>
|
||||
<Tabs type="card" className="has-affix-footer">
|
||||
<TabPane tab="项目配置" key="1">
|
||||
<div className="m-panel">
|
||||
<Row className="project-setting">
|
||||
<Col xs={6} lg={{offset: 1, span: 3}} className="setting-logo">
|
||||
<Popover placement="bottom" title={colorSelector} content={iconSelector} trigger="click" overlayClassName="change-project-container">
|
||||
<Icon type={projectMsg.icon || 'star-o'} className="ui-logo" style={{ backgroundColor: constants.PROJECT_COLOR[projectMsg.color] || constants.PROJECT_COLOR.blue }} />
|
||||
</Popover>
|
||||
</Col>
|
||||
<Col xs={18} sm={15} lg={19} className="setting-intro">
|
||||
<h2 className="ui-title">{this.state.currGroup + ' / ' + projectMsg.name}</h2>
|
||||
{/* <p className="ui-desc">{projectMsg.desc}</p> */}
|
||||
</Col>
|
||||
</Row>
|
||||
<hr className="breakline" />
|
||||
<Form>
|
||||
<FormItem
|
||||
{...formItemLayout}
|
||||
label="项目ID"
|
||||
>
|
||||
<span >{this.props.projectMsg._id}</span>
|
||||
<div className="m-panel">
|
||||
<Row className="project-setting">
|
||||
<Col xs={6} lg={{offset: 1, span: 3}} className="setting-logo">
|
||||
<Popover placement="bottom" title={colorSelector} content={iconSelector} trigger="click" overlayClassName="change-project-container">
|
||||
<Icon type={projectMsg.icon || 'star-o'} className="ui-logo" style={{ backgroundColor: constants.PROJECT_COLOR[projectMsg.color] || constants.PROJECT_COLOR.blue }} />
|
||||
</Popover>
|
||||
</Col>
|
||||
<Col xs={18} sm={15} lg={19} className="setting-intro">
|
||||
<h2 className="ui-title">{this.state.currGroup + ' / ' + projectMsg.name}</h2>
|
||||
{/* <p className="ui-desc">{projectMsg.desc}</p> */}
|
||||
</Col>
|
||||
</Row>
|
||||
<hr className="breakline" />
|
||||
<Form>
|
||||
<FormItem
|
||||
{...formItemLayout}
|
||||
label="项目ID"
|
||||
>
|
||||
<span >{this.props.projectMsg._id}</span>
|
||||
|
||||
</FormItem>
|
||||
<FormItem
|
||||
{...formItemLayout}
|
||||
label="项目名称"
|
||||
>
|
||||
{getFieldDecorator('name', {
|
||||
initialValue: initFormValues.name,
|
||||
rules: nameLengthLimit('项目')
|
||||
})(
|
||||
<Input />
|
||||
)}
|
||||
</FormItem>
|
||||
</FormItem>
|
||||
<FormItem
|
||||
{...formItemLayout}
|
||||
label="项目名称"
|
||||
>
|
||||
{getFieldDecorator('name', {
|
||||
initialValue: initFormValues.name,
|
||||
rules: nameLengthLimit('项目')
|
||||
})(
|
||||
<Input />
|
||||
)}
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
{...formItemLayout}
|
||||
label="所属分组"
|
||||
>
|
||||
<Input value={this.state.currGroup} disabled={true} />
|
||||
</FormItem>
|
||||
<FormItem
|
||||
{...formItemLayout}
|
||||
label="所属分组"
|
||||
>
|
||||
<Input value={this.state.currGroup} disabled={true} />
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
{...formItemLayout}
|
||||
label={(
|
||||
<span>
|
||||
接口基本路径
|
||||
<Tooltip title="基本路径为空表示根路径">
|
||||
<Icon type="question-circle-o" />
|
||||
</Tooltip>
|
||||
</span>
|
||||
)}
|
||||
>
|
||||
{getFieldDecorator('basepath', {
|
||||
initialValue: initFormValues.basepath,
|
||||
rules: [{
|
||||
required: false, message: '请输入基本路径! '
|
||||
}]
|
||||
})(
|
||||
<Input />
|
||||
)}
|
||||
</FormItem>
|
||||
<FormItem
|
||||
{...formItemLayout}
|
||||
label={(
|
||||
<span>
|
||||
接口基本路径
|
||||
<Tooltip title="基本路径为空表示根路径">
|
||||
<Icon type="question-circle-o" />
|
||||
</Tooltip>
|
||||
</span>
|
||||
)}
|
||||
>
|
||||
{getFieldDecorator('basepath', {
|
||||
initialValue: initFormValues.basepath,
|
||||
rules: [{
|
||||
required: false, message: '请输入基本路径! '
|
||||
}]
|
||||
})(
|
||||
<Input />
|
||||
)}
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
{...formItemLayout}
|
||||
label={(
|
||||
<span>
|
||||
MOCK地址
|
||||
<Tooltip title="具体使用方法请查看文档">
|
||||
<Icon type="question-circle-o" />
|
||||
</Tooltip>
|
||||
</span>
|
||||
)}
|
||||
>
|
||||
<FormItem
|
||||
{...formItemLayout}
|
||||
label={(
|
||||
<span>
|
||||
MOCK地址
|
||||
<Tooltip title="具体使用方法请查看文档">
|
||||
<Icon type="question-circle-o" />
|
||||
</Tooltip>
|
||||
</span>
|
||||
)}
|
||||
>
|
||||
|
||||
<Input disabled value={mockUrl} onChange={()=>{}} />
|
||||
<Input disabled value={mockUrl} onChange={()=>{}} />
|
||||
|
||||
</FormItem>
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
{...formItemLayout}
|
||||
label="描述"
|
||||
>
|
||||
{getFieldDecorator('desc', {
|
||||
initialValue: initFormValues.desc,
|
||||
rules: [{
|
||||
required: false
|
||||
}]
|
||||
})(
|
||||
<TextArea rows={8} />
|
||||
)}
|
||||
</FormItem>
|
||||
<FormItem
|
||||
{...formItemLayout}
|
||||
label="描述"
|
||||
>
|
||||
{getFieldDecorator('desc', {
|
||||
initialValue: initFormValues.desc,
|
||||
rules: [{
|
||||
required: false
|
||||
}]
|
||||
})(
|
||||
<TextArea rows={8} />
|
||||
)}
|
||||
</FormItem>
|
||||
|
||||
<FormItem
|
||||
{...formItemLayout}
|
||||
label="权限"
|
||||
>
|
||||
{getFieldDecorator('project_type', {
|
||||
rules: [{
|
||||
required: true
|
||||
}],
|
||||
initialValue: initFormValues.project_type
|
||||
})(
|
||||
<RadioGroup>
|
||||
<Radio value="private" className="radio">
|
||||
<Icon type="lock" />私有<br /><span className="radio-desc">只有组长和项目开发者可以索引并查看项目信息</span>
|
||||
</Radio>
|
||||
<br />
|
||||
<Radio value="public" className="radio">
|
||||
<Icon type="unlock" />公开<br /><span className="radio-desc">任何人都可以索引并查看项目信息</span>
|
||||
</Radio>
|
||||
</RadioGroup>
|
||||
)}
|
||||
</FormItem>
|
||||
</Form>
|
||||
<FormItem
|
||||
{...formItemLayout}
|
||||
label="权限"
|
||||
>
|
||||
{getFieldDecorator('project_type', {
|
||||
rules: [{
|
||||
required: true
|
||||
}],
|
||||
initialValue: initFormValues.project_type
|
||||
})(
|
||||
<RadioGroup>
|
||||
<Radio value="private" className="radio">
|
||||
<Icon type="lock" />私有<br /><span className="radio-desc">只有组长和项目开发者可以索引并查看项目信息</span>
|
||||
</Radio>
|
||||
<br />
|
||||
<Radio value="public" className="radio">
|
||||
<Icon type="unlock" />公开<br /><span className="radio-desc">任何人都可以索引并查看项目信息</span>
|
||||
</Radio>
|
||||
</RadioGroup>
|
||||
)}
|
||||
</FormItem>
|
||||
</Form>
|
||||
|
||||
<FormItem
|
||||
{...formItemLayout}
|
||||
label="危险操作"
|
||||
className="danger-container"
|
||||
>
|
||||
<Card noHovering={true} className="card-danger">
|
||||
<div className="card-danger-content">
|
||||
<h3>删除项目</h3>
|
||||
<p>项目一旦删除,将无法恢复数据,请慎重操作!</p>
|
||||
</div>
|
||||
<Button type="danger" ghost className="card-danger-btn" onClick={this.showConfirm}>删除</Button>
|
||||
</Card>
|
||||
</FormItem>
|
||||
</div>
|
||||
</TabPane>
|
||||
<TabPane tab="环境配置" key="2">
|
||||
<div className="m-panel">
|
||||
<FormItem
|
||||
{...formItemLayout}
|
||||
>
|
||||
{envSettingItems}
|
||||
<Button type="default" onClick={this.add} style={{ width: '50%' }}>
|
||||
<Icon type="plus" /> 添加环境配置
|
||||
</Button>
|
||||
</FormItem>
|
||||
</div>
|
||||
</TabPane>
|
||||
</Tabs>
|
||||
|
||||
<Affix offsetBottom={0}>
|
||||
<div className="btnwrap-changeproject">
|
||||
<Button className="m-btn btn-save" icon="save" type="primary" size="large" onClick={this.handleOk} >保 存</Button>
|
||||
</div>
|
||||
</Affix>
|
||||
|
||||
{/* 只有组长和管理员有权限删除项目 */}
|
||||
{projectMsg.role === 'owner' || projectMsg.role === 'admin' ?
|
||||
<FormItem
|
||||
{...formItemLayout}
|
||||
label="危险操作"
|
||||
className="danger-container"
|
||||
>
|
||||
<Card noHovering={true} className="card-danger">
|
||||
<div className="card-danger-content">
|
||||
<h3>删除项目</h3>
|
||||
<p>项目一旦删除,将无法恢复数据,请慎重操作!</p>
|
||||
</div>
|
||||
<Button type="danger" ghost className="card-danger-btn" onClick={this.showConfirm}>删除</Button>
|
||||
</Card>
|
||||
</FormItem> : null}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
@ -1,6 +1,9 @@
|
||||
import React, { Component } from 'react'
|
||||
import { Tabs } from 'antd';
|
||||
import PropTypes from 'prop-types';
|
||||
import ProjectMessage from './ProjectMessage/ProjectMessage.js';
|
||||
import ProjectEnv from './ProjectEnv/ProjectEnv.js';
|
||||
const TabPane = Tabs.TabPane;
|
||||
|
||||
import './Setting.scss';
|
||||
|
||||
@ -12,7 +15,14 @@ class Setting extends Component {
|
||||
const id = this.props.match.params.id;
|
||||
return (
|
||||
<div className="g-row">
|
||||
<ProjectMessage projectId={+id}/>
|
||||
<Tabs type="card" className="has-affix-footer">
|
||||
<TabPane tab="项目配置" key="1">
|
||||
<ProjectMessage projectId={+id}/>
|
||||
</TabPane>
|
||||
<TabPane tab="环境配置" key="2">
|
||||
<ProjectEnv projectId={+id} />
|
||||
</TabPane>
|
||||
</Tabs>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
@ -8,6 +8,7 @@ const PROJECT_ADD = 'yapi/project/PROJECT_ADD';
|
||||
const PROJECT_DEL = 'yapi/project/PROJECT_DEL';
|
||||
// const CHANGE_TABLE_LOADING = 'yapi/project/CHANGE_TABLE_LOADING';
|
||||
const PROJECT_UPDATE = 'yapi/project/PROJECT_UPDATE';
|
||||
const PROJECT_UPDATE_ENV = 'yapi/project/PROJECT_UPDATE_ENV';
|
||||
const PROJECT_UPSET = 'yapi/project/PROJECT_UPSET';
|
||||
const GET_CURR_PROJECT = 'yapi/project/GET_CURR_PROJECT'
|
||||
const GET_PEOJECT_MEMBER = 'yapi/project/GET_PEOJECT_MEMBER';
|
||||
@ -176,6 +177,19 @@ export function updateProject(data) {
|
||||
};
|
||||
}
|
||||
|
||||
// 修改项目环境配置
|
||||
export function updateEnv(data) {
|
||||
const { env, _id } = data;
|
||||
const param = {
|
||||
id: _id,
|
||||
env
|
||||
};
|
||||
return {
|
||||
type: PROJECT_UPDATE_ENV,
|
||||
payload: axios.post('/api/project/up_env', param)
|
||||
};
|
||||
}
|
||||
|
||||
// 修改项目头像
|
||||
export function upsetProject(param) {
|
||||
return {
|
||||
|
@ -115,6 +115,20 @@ em {
|
||||
min-height: 5rem;
|
||||
}
|
||||
|
||||
.panel-title {
|
||||
margin-bottom: .16rem;
|
||||
border-left: 3px solid #2395f1;
|
||||
padding-left: 8px;
|
||||
.title {
|
||||
font-weight: normal;
|
||||
}
|
||||
.desc {
|
||||
font-size: 13px;
|
||||
color: #919191;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
html {
|
||||
width: min-content !important;
|
||||
|
@ -517,9 +517,6 @@ class projectController extends baseController {
|
||||
* @param {String} name 项目名称,不能为空
|
||||
* @param {String} basepath 项目基本路径,不能为空
|
||||
* @param {String} [desc] 项目描述
|
||||
* @param {Array} [env] 项目环境配置
|
||||
* @param {String} [env[].name] 环境名称
|
||||
* @param {String} [env[].domain] 环境域名
|
||||
* @returns {Object}
|
||||
* @example ./api/project/up.json
|
||||
*/
|
||||
@ -540,7 +537,7 @@ class projectController extends baseController {
|
||||
return ctx.body = yapi.commons.resReturn(null, 405, '项目id不能为空');
|
||||
}
|
||||
|
||||
if (await this.checkAuth(id, 'project', 'edit') !== true) {
|
||||
if (await this.checkAuth(id, 'project', 'danger') !== true) {
|
||||
return ctx.body = yapi.commons.resReturn(null, 405, '没有权限');
|
||||
}
|
||||
|
||||
@ -572,7 +569,6 @@ class projectController extends baseController {
|
||||
if (!_.isUndefined(params.name)) data.name = params.name;
|
||||
if (!_.isUndefined(params.desc)) data.desc = params.desc;
|
||||
data.basepath = params.basepath;
|
||||
if (!_.isUndefined(params.env)) data.env = params.env;
|
||||
if (!_.isUndefined(params.color)) data.color = params.color;
|
||||
if (!_.isUndefined(params.icon)) data.icon = params.icon;
|
||||
let result = await this.Model.up(id, data);
|
||||
@ -588,7 +584,58 @@ class projectController extends baseController {
|
||||
} catch (e) {
|
||||
ctx.body = yapi.commons.resReturn(null, 402, e.message);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* 编辑项目
|
||||
* @interface /project/up_env
|
||||
* @method POST
|
||||
* @category project
|
||||
* @foldnumber 10
|
||||
* @param {Number} id 项目id,不能为空
|
||||
* @param {Array} [env] 项目环境配置
|
||||
* @param {String} [env[].name] 环境名称
|
||||
* @param {String} [env[].domain] 环境域名
|
||||
* @returns {Object}
|
||||
* @example
|
||||
*/
|
||||
async upEnv(ctx) {
|
||||
try {
|
||||
let id = ctx.request.body.id;
|
||||
let params = ctx.request.body;
|
||||
if (!id) {
|
||||
return ctx.body = yapi.commons.resReturn(null, 405, '项目id不能为空');
|
||||
}
|
||||
|
||||
if (await this.checkAuth(id, 'project', 'edit') !== true) {
|
||||
return ctx.body = yapi.commons.resReturn(null, 405, '没有权限');
|
||||
}
|
||||
|
||||
if(!params.env || !Array.isArray(params.env)){
|
||||
return ctx.body = yapi.commons.resReturn(null, 405, 'env参数格式有误');
|
||||
}
|
||||
|
||||
let projectData = await this.Model.get(id);
|
||||
let data = {
|
||||
up_time: yapi.commons.time()
|
||||
};
|
||||
|
||||
data.env = params.env;
|
||||
let result = await this.Model.up(id, data);
|
||||
let username = this.getUsername();
|
||||
yapi.commons.saveLog({
|
||||
content: `用户 "${username}" 更新了项目 "${projectData.name}" 环境`,
|
||||
type: 'project',
|
||||
uid: this.getUid(),
|
||||
username: username,
|
||||
typeid: id
|
||||
});
|
||||
ctx.body = yapi.commons.resReturn(result);
|
||||
} catch (e) {
|
||||
ctx.body = yapi.commons.resReturn(null, 402, e.message);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 模糊搜索项目名称或者组名称
|
||||
|
@ -228,9 +228,9 @@ let routerConfig = {
|
||||
"method": "get"
|
||||
},
|
||||
{
|
||||
"action": "download",
|
||||
"path": "download",
|
||||
"method": "get"
|
||||
"action": "upEnv",
|
||||
"path": "up_env",
|
||||
"method": "post"
|
||||
}
|
||||
],
|
||||
"interface": [
|
||||
|
Loading…
Reference in New Issue
Block a user