mirror/yapi
2
0
Fork 0
mirror of https://github.com/YMFE/yapi.git synced 2025-01-24 13:14:16 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'dev' of gitlab.corp.qunar.com:mfe/yapi into dev

Browse Source
This commit is contained in:
yhui.yang 2017-07-26 21:24:11 +08:00
commit e12c61c40b
15 changed files with 191 additions and 102 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
client/containers/AddInterface/AddInterface.js
View File

@ -254,9 +254,6 @@ class AddInterface extends Component {
<Result isSave={isSave} mockJson={mockJson} />
<MockUrl mockURL={mockURL} />
</TabPane>
{
// <TabPane tab="Mock" key="2">mock</TabPane>
}
<TabPane tab="请求接口" key="3">
<InterfaceTest />
</TabPane>

132
client/containers/AddInterface/InterfaceTest/InterfaceTest.js
View File

@ -1,7 +1,7 @@
import React, { Component } from 'react'
import PropTypes from 'prop-types'
import { connect } from 'react-redux'
import { Button, Input } from 'antd'
import { Button, Input, Select, Card } from 'antd'
import { autobind } from 'core-decorators';
import crossRequest from 'cross-request';
import { withRouter } from 'react-router';
@ -13,6 +13,8 @@ import {
import './InterfaceTest.scss'
const { TextArea } = Input;
const InputGroup = Input.Group;
const Option = Select.Option;
@connect(
state => ({
@ -40,7 +42,7 @@ export default class InterfaceTest extends Component {
}
state = {
res: {},
res: '',
header: {}
}
@ -57,9 +59,8 @@ export default class InterfaceTest extends Component {
const { method, url, seqGroup, interfaceProject } = this.props;
const { prd_host, basepath, protocol } = interfaceProject;
const reqParams = JSON.parse(this.props.reqParams);
const headers = {}
let query = {};
const query = {};
if (method === 'GET') {
Object.keys(reqParams).forEach(key => {
const value = typeof reqParams[key] === 'object' ? JSON.stringify(reqParams) : reqParams.toString();
@ -67,8 +68,11 @@ export default class InterfaceTest extends Component {
})
}
const headers = {}
seqGroup.forEach((headerItem) => {
headers[headerItem.name] = headerItem.value;
if (headerItem.name) {
headers[headerItem.name] = headerItem.value;
}
})
const href = URL.format({
@ -85,8 +89,7 @@ export default class InterfaceTest extends Component {
data: {
a:1
},
success: (res, header) => {
console.log(header)
success: (res) => {
this.setState({res})
}
})
@ -95,10 +98,16 @@ export default class InterfaceTest extends Component {
render () {
const { method, url, seqGroup, interfaceName, interfaceProject } = this.props;
const { prd_host, basepath, protocol } = interfaceProject;
const reqParams = JSON.parse(this.props.reqParams);
let query = {};
const { prd_host, basepath, protocol, env } = interfaceProject;
const reqParams = this.props.reqParams ? JSON.parse(this.props.reqParams) : [];
const pathname = (basepath + url).replace(/\/+/g, '/');
const domains = [{name: 'prd', domain: protocol + '://' + prd_host}];
env.forEach(item => {
domains.push({name: item.name, domain: item.domain});
})
const query = {};
if (method === 'GET') {
Object.keys(reqParams).forEach(key => {
const value = typeof reqParams[key] === 'object' ? JSON.stringify(reqParams[key]) : reqParams[key].toString();
@ -106,10 +115,14 @@ export default class InterfaceTest extends Component {
})
}
const href = URL.format({
protocol: protocol || 'http',
host: prd_host,
pathname: (basepath + url).replace(/\/+/g, '/'),
const headers = {}
seqGroup.forEach((headerItem) => {
if (headerItem.name) {
headers[headerItem.name] = headerItem.value;
}
})
const search = URL.format({
query
});
@ -118,45 +131,62 @@ export default class InterfaceTest extends Component {
<div className="interface-test">
<div className="interface-name">{interfaceName}</div>
<div className="req-part">
<div className="req-row method">
METHOD：<Input value={method} disabled style={{display: 'inline-block', width: 200}} />
</div>
<div className="req-row url">
URL：<Input value={href} style={{display: 'inline-block', width: 800, margin: 10}} />
<Button onClick={this.testInterface} type="primary">发送</Button>
</div>
<div className="req-row headers">
HEADERS：
{
seqGroup.map((headerItem, index) => {
return (
<div key={index}>
<Input disabled value={headerItem.name} style={{display: 'inline-block', width: 200, margin: 10}} />{' = '}
<Input value={headerItem.value} style={{display: 'inline-block', width: 200, margin: 10}} />
</div>
)
})
}
</div>
<div className="req-row params">
请求参数：
{
Object.keys(reqParams).map((key, index) => {
const value = typeof reqParams[key] === 'object' ? JSON.stringify(reqParams[key]) : reqParams[key].toString();
return (
<div key={index}>
<Input disabled value={key} style={{display: 'inline-block', width: 200, margin: 10}} />{' = '}
<Input value={value} style={{display: 'inline-block', width: 200, margin: 10}} />
</div>
)
})
}
<div className="req-row href">
<InputGroup compact style={{display: 'inline-block', width: 680}}>
<Input value={method} disabled style={{display: 'inline-block', width: 80}} />
<Select defaultValue="prd" style={{display: 'inline-block', width: 300}}>
{
domains.map((item, index) => (<Option value={item.name} key={index}>{item.domain}</Option>))
}
</Select>
<Input value={pathname+search} style={{display: 'inline-block', width: 300}} />
</InputGroup>
<Button onClick={this.testInterface} type="primary" style={{marginLeft: 10}}>发送</Button>
</div>
<Card noHovering style={{marginTop: 10}} className={Object.keys(headers).length ? '' : 'hidden'}>
<div className="req-row headers">
HEADERS：
{
Object.keys(headers).map((key, index) => {
return (
<div key={index}>
<Input disabled value={key} style={{display: 'inline-block', width: 200, margin: 10}} />{' = '}
<Input value={headers[key]} style={{display: 'inline-block', width: 200, margin: 10}} />
</div>
)
})
}
</div>
</Card>
<Card noHovering style={{marginTop: 10}} className={Object.keys(reqParams).length ? '' : 'hidden'}>
<div className="req-row params">
请求参数：
{
Object.keys(reqParams).map((key, index) => {
const value = typeof reqParams[key] === 'object' ? JSON.stringify(reqParams[key]) : reqParams[key].toString();
return (
<div key={index}>
<Input disabled value={key} style={{display: 'inline-block', width: 200, margin: 10}} />{' = '}
<Input value={value} style={{display: 'inline-block', width: 200, margin: 10}} />
</div>
)
})
}
</div>
</Card>
</div>
<div className="res-part">
返回结果：
<TextArea value={JSON.stringify(this.state.res, 2)}></TextArea>
</div>
<Card noHovering style={{marginTop: 10}}>
<div className="res-part">
返回结果：
<div>
<TextArea
value={this.state.res ? JSON.stringify(this.state.res, 2) : ''}
style={{margin: 10}}
autosize={{ minRows: 2, maxRows: 6 }}
></TextArea>
</div>
</div>
</Card>
</div>
)
}

2
client/containers/AddInterface/MockUrl/MockUrl.js
View File

@ -24,7 +24,7 @@ class MockUrl extends Component {
clipboard () {
const btn = document.querySelector('#mock-clipboard')
const txt = document.querySelector('#mock-p').innerHTML
console.log('txt', txt)
new Clipboard(btn, {
text: () => txt,
target () {

51
client/containers/AddInterface/ReqHeader/ReqList.js
View File

@ -6,7 +6,8 @@ import { autobind } from 'core-decorators'
import {
reqTagValue,
reqHeaderValue,
deleteReqHeader
deleteReqHeader,
addReqHeader
} from '../../../actions/addInterface.js'
@connect(
@ -20,7 +21,8 @@ import {
{
reqTagValue,
reqHeaderValue,
deleteReqHeader
deleteReqHeader,
addReqHeader
}
)
@ -30,6 +32,7 @@ class ReqList extends Component {
reqTagValue: PropTypes.func,
reqHeaderValue: PropTypes.func,
deleteReqHeader: PropTypes.func,
addReqHeader: PropTypes.func,
_id: PropTypes.number,
dataNum: PropTypes.number,
value: PropTypes.object
@ -43,12 +46,32 @@ class ReqList extends Component {
handleChange (value) {
const dir = 'AddInterface/edit'
const url = location.href
const newObject = []
if (url.includes(dir)) {
const { seqGroup, value: { id } } = this.props
seqGroup[id].name = value
seqGroup.forEach(v => {
if (id == v.id) {
v.name = value
}
})
seqGroup.forEach(v => {
const {id, name, value} = v
newObject.push({id, name, value})
})
this.props.addReqHeader( newObject )
} else {
const { seqGroup, dataNum } = this.props
seqGroup[dataNum].name = value
seqGroup.forEach(v => {
if (dataNum == v.id) {
v.name = value
}
})
seqGroup.forEach(v => {
const {id, name, value} = v
newObject.push({id, name, value})
})
this.props.addReqHeader(newObject)
}
}
@ -56,7 +79,17 @@ class ReqList extends Component {
handleBlur (e) {
const value = e.target.value
const { seqGroup, value: { id } } = this.props
seqGroup[id].value = value
const newObject = []
seqGroup.forEach(v => {
if (id == v.id) {
v.value = value
}
})
seqGroup.forEach(v => {
const {id, name, value} = v
newObject.push({id, name, value})
})
this.props.addReqHeader(newObject)
}
@autobind
@ -76,13 +109,13 @@ class ReqList extends Component {
render () {
const propsValue = this.props.value
const Option = Select.Option
const value = propsValue.value
const value = propsValue.value || ''
const name = propsValue.name || ''
console.log(name)
return (
<li>
<em className="title">头部标签</em>
<Select defaultValue={name} style={{ width: 220 }} onChange={this.handleChange} size="large">
<Select value={name} style={{ width: 220 }} onChange={this.handleChange} size="large">
<Option value="">选择请求头</Option>
<Option value="Accept">Accept</Option>
<Option value="Accept-Charset">Accept-Charset</Option>
@ -91,7 +124,7 @@ class ReqList extends Component {
<Option value="Accept-Ranges">Accept-Ranges</Option>
</Select>
<em className="title">头部内容</em>
<Input defaultValue={value} placeholder="Basic usage" className="req-content" size="large" onBlur={this.handleBlur} />
<Input value={value} placeholder="Basic usage" className="req-content" size="large" onInput={this.handleBlur} />
<Icon className="dynamic-delete-button" type="minus-circle-o" onClick={this.deleteReqHeader} />
</li>
)

3
client/containers/AddInterface/ReqMethod/ReqMethod.js
View File

@ -58,6 +58,7 @@ class ReqMethod extends Component {
render () {
const { Option } = Select
const { url, interfaceName, method } = this.props
return (
<table>
<tbody>
@ -65,7 +66,7 @@ class ReqMethod extends Component {
<th>协议 :</th>
<td>
<span className="h3">请求方式</span>
<Select defaultValue={method} style={{ width: 220 }} onChange={this.handleChange} size="large">
<Select value={method} style={{ width: 220 }} onChange={this.handleChange} size="large">
<Option value="POST">POST</Option>
<Option value="GET">GET</Option>
<Option value="PUT">PUT</Option>

2
client/containers/AddInterface/Result/Result.js
View File

@ -27,7 +27,7 @@ class Result extends Component {
render () {
const TabPane = Tabs.TabPane
const { mockJson } = this.props
console.log('mockJson', typeof mockJson, mockJson)
return (
<div className="result">
<Tabs defaultActiveKey="1">

2
client/containers/Interface/Interface.js
View File

@ -58,7 +58,7 @@ class Interface extends Component {
.then(result => {
result = result.data.data
result.map(value => {
value.add_time = moment(value.add_time).format('YYYY-MM-DD HH:mm:ss')
value.add_time = moment(value.add_time*1000).format('YYYY-MM-DD HH:mm:ss')
return value
})
this.props.fetchInterfaceData(result)

7
client/containers/Interface/InterfaceTable/InterfaceTable.js
View File

@ -65,10 +65,14 @@ class InterfaceTable extends Component {
title: '接口名称',
dataIndex: 'title',
key: 'title'
}, {
},{
title: '接口URL',
dataIndex: 'path',
key: 'path'
},{
title: '请求方式',
dataIndex: 'method',
key: 'method'
},{
title: '更新日期',
dataIndex: 'add_time',
@ -77,7 +81,6 @@ class InterfaceTable extends Component {
title: '功能',
'key': 'action',
render: (data) => {
// const deleteInterface = this.deleteInterface.bind(this, data._id)
const confirm = this.confirm.bind(this, data._id)
return (
<span>

4
client/styles/common.scss
View File

@ -48,3 +48,7 @@ em {
min-height:calc(100% - 2.47rem);
}
}
.hidden {
display: none;
}

65
gulpfile.js
View File

@ -1,11 +1,12 @@
const fs = require('fs-extra');
const path = require('path');
const gulp = require('gulp');
const watch = require('gulp-watch');
const babel = require('gulp-babel');
const ora = require('ora');
const chalk = require('chalk');
const { spawn } = require('child_process');
let spinner = ora('请稍等...').start();
let spinner = null;
const DIST = 'server_dist/';
const SRC = 'server/**/*.js';
@ -30,21 +31,18 @@ function generateBabel(status) {
}
function excuteCmd(cmd, args, opts) {
const command = spawn(cmd, args, opts);
const NAME = cmd === 'ykit' ? chalk.cyan('[ykit]') : chalk.blue('[dev-server]');
let command = spawn(cmd, args, opts);
command.stdout.on('data', data => {
output('log', `${cmd}: ${data.toString()}`, true);
output('log', `${NAME} ${data.toString()}`, true);
});
command.stderr.on('data', data => {
output('log', `${cmd}: ${data.toString()}`, true);
output('log', `${NAME} ${data.toString()}`, true);
});
command.on('close', code => {
if (code !== 0) {
output('log', `${cmd}: ${data.toString()}`);
}
});
return command;
}
function output(type, message, restart = false) {
@ -64,25 +62,29 @@ function output(type, message, restart = false) {
}
}
function waitingSpinner() {
spinner = ora({
text: '等待文件变更...',
spinner: 'circleQuarters',
color: 'cyan'
}).start();
}
gulp.task('removeDist', [], function () {
return fs.removeSync(DIST)
});
gulp.task('initialBuild', ['removeDist'], () => {
spinner.text = '初始编译...';
spinner = ora('初始编译...').start();
return gulp.src(SRC)
.pipe(generateBabel())
.pipe(gulp.dest(DIST))
.on('end', () => {
output('success', '初始编译成功！');
spinner = ora({
text: '等待文件变更...',
spinner: 'pong',
color: 'green'
}).start();
waitingSpinner();
excuteCmd('node_modules/.bin/nodemon', ['-q', 'server_dist/app.js', 'dev'], {
excuteCmd('node_modules/.bin/nodemon', ['-q', 'server_dist/app.js'], {
cwd: __dirname
});
@ -94,28 +96,41 @@ gulp.task('initialBuild', ['removeDist'], () => {
gulp.task('default', ['initialBuild'], () => {
gulp.watch(SRC, (event) => {
let originFilePath = path.relative(path.join(__dirname, 'server'), event.path)
let distPath = path.resolve(DIST, path.join(originFilePath))
spinner.text = `正在编译 ${event.path}...`;
gulp.src(event.path).pipe(generateBabel())
.pipe(gulp.dest(DIST)).on('end', () => {
output('success', `成功编译 ${event.path}`);
spinner = ora({
text: 'waiting changes...',
spinner: 'pong',
color: 'green'
});
spinner.start();
.pipe(gulp.dest(path.parse(distPath).dir)).on('end', () => {
output('success', `成功编译 ${originFilePath}`);
output('success', '正在重启服务器...');
waitingSpinner();
});
});
});
gulp.task('buildNode', () => {
return gulp.src(SRC)
.pipe(generateBabel())
.pipe(gulp.dest(DIST));
});
gulp.task('watchNode', ['buildNode'], () => {
return watch(SRC, {
verbose: true,
ignoreInitial: false
})
.pipe(generateBabel())
.pipe(gulp.dest(DIST));
});
gulp.task('build', () => {
let status = {
count: 0
};
let ykitOutput = '';
spinner.text = '正在编译...';
spinner = ora('请稍等...').start();
gulp.src(SRC)
.pipe(generateBabel(status))

5
package.json
View File

@ -5,10 +5,11 @@
"main": "index.js",
"scripts": {
"build-server": "babel server -d server_dist",
"dev-server": "nodemon server_dist/app.js",
"dev-server": "nodemon server_dist/app.js -L",
"install-server" : "node server_dist/install.js",
"dev": "gulp --silent",
"build": "gulp build --silent"
"build": "gulp build --silent",
"only-watch": "gulp watchNode"
},
"repository": {
"type": "git",

6
server/controllers/interface.js
View File

@ -38,6 +38,7 @@ class interfaceController extends baseController{
async add(ctx){
let params = ctx.request.body;
params = yapi.commons.handleParams(params, {
project_id: 'number',
title: 'string',
path: 'string',
method: 'string',
@ -57,8 +58,9 @@ class interfaceController extends baseController{
if(!yapi.commons.verifyPath(params.path)){
return ctx.body = yapi.commons.resReturn(null, 400, '接口path第一位必须是/，最后一位不能为/')
}
let checkRepeat = await this.Model.checkRepeat(params.project_id, params.path, params.method);
let checkRepeat = await this.Model.checkRepeat(params.path, params.method);
if(checkRepeat > 0){
return ctx.body = yapi.commons.resReturn(null, 401, '已存在的接口:' + params.path + '[' + params.method + ']');
}
@ -184,7 +186,7 @@ class interfaceController extends baseController{
}
if(params.path && params.path !== interfaceData.path && params.method !== interfaceData.method){
let checkRepeat = await this.Model.checkRepeat(params.path, params.method);
let checkRepeat = await this.Model.checkRepeat(interfaceData.project_id,params.path, params.method);
if(checkRepeat > 0){
return ctx.body = yapi.commons.resReturn(null, 401, '已存在的接口:' + params.path + '[' + params.method + ']');
}

3
server/models/interface.js
View File

@ -54,8 +54,9 @@ class interfaceModel extends baseModel{
}).exec()
}
checkRepeat(path, method){
checkRepeat(id, path, method){
return this.model.count({
project_id: id,
path: path,
method: method
})

5
server_dist/controllers/interface.js
View File

@ -95,6 +95,7 @@ var interfaceController = function (_baseController) {
params = ctx.request.body;
params = _yapi2.default.commons.handleParams(params, {
project_id: 'number',
title: 'string',
path: 'string',
method: 'string',
@ -129,7 +130,7 @@ var interfaceController = function (_baseController) {
case 11:
_context.next = 13;
return this.Model.checkRepeat(params.path, params.method);
return this.Model.checkRepeat(params.project_id, params.path, params.method);
case 13:
checkRepeat = _context.sent;
@ -393,7 +394,7 @@ var interfaceController = function (_baseController) {
}
_context4.next = 15;
return this.Model.checkRepeat(params.path, params.method);
return this.Model.checkRepeat(interfaceData.project_id, params.path, params.method);
case 15:
checkRepeat = _context4.sent;

3
server_dist/models/interface.js
View File

@ -96,8 +96,9 @@ var interfaceModel = function (_baseModel) {
}
}, {
key: 'checkRepeat',
value: function checkRepeat(path, method) {
value: function checkRepeat(id, path, method) {
return this.model.count({
project_id: id,
path: path,
method: method
});