fix: json-schema editor

This commit is contained in:
suxiaoxin 2018-03-20 17:27:09 +08:00
parent babbec4e61
commit 8c3a72c5c5
3 changed files with 70 additions and 91 deletions

View File

@ -285,11 +285,11 @@ class InterfaceEditForm extends Component {
} else if (values.req_body_type === "json") {
values.req_headers
? values.req_headers.map(item => {
if (item.name === "Content-Type") {
item.value = "application/json";
isHavaContentType = true;
}
})
if (item.name === "Content-Type") {
item.value = "application/json";
isHavaContentType = true;
}
})
: [];
if (isHavaContentType === false) {
values.req_headers = values.req_headers || [];
@ -369,7 +369,7 @@ class InterfaceEditForm extends Component {
mockEditor({
container: "req_body_json",
data: that.state.req_body_other,
onChange: function(d) {
onChange: function (d) {
that.setState({
req_body_other: d.text
});
@ -381,7 +381,7 @@ class InterfaceEditForm extends Component {
this.resBodyEditor = mockEditor({
container: "res_body_json",
data: that.state.res_body,
onChange: function(d) {
onChange: function (d) {
that.setState({
res_body: d.text
});
@ -486,7 +486,7 @@ class InterfaceEditForm extends Component {
}
if (val && val.length > 3) {
val.replace(/\{(.+?)\}/g, function(str, match) {
val.replace(/\{(.+?)\}/g, function (str, match) {
insertParams(match);
});
}
@ -543,15 +543,18 @@ class InterfaceEditForm extends Component {
let res_body = '';
let req_body_other = '';
try{
res_body = this.state.res_body ? JSON.stringify(json5.parse(this.state.res_body), null,2) : ''
}catch(e){
try {
res_body = this.state.res_body ? JSON.stringify(json5.parse(this.state.res_body), null, 2) : ''
} catch (e) {
res_body = '';
}
try{
req_body_other = this.state.req_body_other ? JSON.stringify(json5.parse(this.state.req_body_other), null,2) : '';
}catch(e){
console.log(res_body)
try {
req_body_other = this.state.req_body_other ? JSON.stringify(json5.parse(this.state.req_body_other), null, 2) : '';
} catch (e) {
req_body_other = ''
}
@ -761,8 +764,8 @@ class InterfaceEditForm extends Component {
const headerList = this.state.req_headers
? this.state.req_headers.map((item, index) => {
return headerTpl(item, index);
})
return headerTpl(item, index);
})
: [];
const requestBodyList = this.state.req_body_form.map((item, index) => {
@ -857,7 +860,7 @@ class InterfaceEditForm extends Component {
disabled
value={this.props.basepath}
readOnly
onChange={() => {}}
onChange={() => { }}
style={{ width: "25%" }}
/>
</Tooltip>
@ -1056,48 +1059,47 @@ class InterfaceEditForm extends Component {
style={{ color: "#086dbf" }}
/>
</Tooltip>
全局编辑 退出全屏 请按{" "}F9</span>
): (
<ReqBodySchema onChange={(text)=>{
全局编辑 退出全屏 请按{" "}F9</span>
) : <ReqBodySchema onChange={(text)=>{
this.setState({
req_body_other: text
})
}} data={req_body_other} />
)}
}} data={req_body_other} />}
</Col>
<Col id="req_body_json" style={{ minHeight: "300px", display: !this.props.form.getFieldValue("req_body_is_json_schema") ? 'block': 'none' }} />
<Col id="req_body_json" style={{ minHeight: "300px", display: !this.props.form.getFieldValue("req_body_is_json_schema") ? 'block' : 'none' }} />
</Row>
{this.props.form.getFieldValue("req_body_type") === "file" &&
this.state.hideTabs.req.body !== "hide" ? (
<Row className="interface-edit-item">
<Col className="interface-edit-item-other-body">
{getFieldDecorator("req_body_other", {
initialValue: this.state.req_body_other
})(<TextArea placeholder="" autosize={true} />)}
</Col>
</Row>
) : null}
this.state.hideTabs.req.body !== "hide" ? (
<Row className="interface-edit-item">
<Col className="interface-edit-item-other-body">
{getFieldDecorator("req_body_other", {
initialValue: this.state.req_body_other
})(<TextArea placeholder="" autosize={true} />)}
</Col>
</Row>
) : null}
{this.props.form.getFieldValue("req_body_type") === "raw" &&
this.state.hideTabs.req.body !== "hide" ? (
<Row>
<Col>
{getFieldDecorator("req_body_other", {
initialValue: this.state.req_body_other
})(<TextArea placeholder="" autosize={{ minRows: 8 }} />)}
</Col>
</Row>
) : null}
this.state.hideTabs.req.body !== "hide" ? (
<Row>
<Col>
{getFieldDecorator("req_body_other", {
initialValue: this.state.req_body_other
})(<TextArea placeholder="" autosize={{ minRows: 8 }} />)}
</Col>
</Row>
) : null}
</div>
{/* ----------- Response ------------- */}
<h2 className="interface-title">返回数据设置&nbsp;
{getFieldDecorator("res_body_is_json_schema", {
valuePropName: "checked",
initialValue: this.state.res_body_is_json_schema
})(<Switch checkedChildren="json-schema" unCheckedChildren="json" />)}
valuePropName: "checked",
initialValue: this.state.res_body_is_json_schema
})(<Switch checkedChildren="json-schema" unCheckedChildren="json" />)}
</h2>
<div className="container-radiogroup">
{getFieldDecorator("res_body_type", {
@ -1119,7 +1121,7 @@ class InterfaceEditForm extends Component {
: "none"
}}
>
<Col>
<Col>
<div style={{ marginTop: "10px" }}>
{!this.props.form.getFieldValue("res_body_is_json_schema") ? (
@ -1147,36 +1149,21 @@ class InterfaceEditForm extends Component {
</span>
全局编辑 退出全屏 请按{" "}
<span style={{ fontWeight: "500" }}>F9</span>
</div>
) :
(
<ResBodySchema onChange={(text)=>{
this.setState({
res_body: text
})
}} data={res_body} />
)}
<div
id="res_body_json"
style={{
minHeight: "300px",
display: !this.props.form.getFieldValue("res_body_is_json_schema") && this.state.jsonType === "tpl" ? "block" : "none"
}}
/>
{/*
<div
id="mock-preview"
style={{
backgroundColor: "#eee",
lineHeight: "20px",
minHeight: "300px",
display:
this.state.jsonType === "preview" ? "block" : "none"
}}
/> */}
</div>
) : <ResBodySchema onChange={(text) => {
this.setState({
res_body: text
})
}} data={res_body} />}
<div
id="res_body_json"
style={{
minHeight: "300px",
display: !this.props.form.getFieldValue("res_body_is_json_schema") && this.state.jsonType === "tpl" ? "block" : "none"
}}
/>
</div>
</Col>
</Row>

25
package-lock.json generated
View File

@ -7707,7 +7707,6 @@
"version": "2.6.0",
"resolved": "http://registry.npm.taobao.org/generate-schema/download/generate-schema-2.6.0.tgz",
"integrity": "sha1-msA3VQ/UJDeDqfdoHTm+6IcLzsI=",
"dev": true,
"requires": {
"commander": "2.14.1",
"type-of-is": "3.5.1"
@ -10375,8 +10374,7 @@
"js-tokens": {
"version": "3.0.2",
"resolved": "http://registry.npm.taobao.org/js-tokens/download/js-tokens-3.0.2.tgz",
"integrity": "sha1-mGbfOVECEw449/mWvOtlRDIJwls=",
"dev": true
"integrity": "sha1-mGbfOVECEw449/mWvOtlRDIJwls="
},
"js-yaml": {
"version": "3.10.0",
@ -10460,7 +10458,7 @@
"antd": "3.2.2",
"brace": "0.10.0",
"generate-schema": "2.6.0",
"moox": "1.0.0-beta6",
"moox": "1.0.2",
"react-redux": "5.0.7",
"underscore": "1.8.3"
}
@ -11111,8 +11109,7 @@
"lodash-es": {
"version": "4.17.5",
"resolved": "http://registry.npm.taobao.org/lodash-es/download/lodash-es-4.17.5.tgz",
"integrity": "sha1-n8bnN7HE0VHY+criJHMF1VLOdI8=",
"dev": true
"integrity": "sha1-n8bnN7HE0VHY+criJHMF1VLOdI8="
},
"lodash._arraycopy": {
"version": "3.0.0",
@ -11431,7 +11428,6 @@
"version": "1.3.1",
"resolved": "http://registry.npm.taobao.org/loose-envify/download/loose-envify-1.3.1.tgz",
"integrity": "sha1-0aitM/qc4OcT1l/dCsi3SNR4yEg=",
"dev": true,
"requires": {
"js-tokens": "3.0.2"
}
@ -12030,10 +12026,9 @@
}
},
"moox": {
"version": "1.0.0-beta6",
"resolved": "http://registry.npm.taobao.org/moox/download/moox-1.0.0-beta6.tgz",
"integrity": "sha1-Lbay6ckG+yktAr4sQyeKEWhjPlE=",
"dev": true,
"version": "1.0.2",
"resolved": "http://registry.npm.taobao.org/moox/download/moox-1.0.2.tgz",
"integrity": "sha1-lDxR8Mgbx8lR8rhKbC7zj8tF/1k=",
"requires": {
"flux-standard-action": "2.0.1",
"immer": "1.1.1",
@ -12044,7 +12039,6 @@
"version": "2.0.1",
"resolved": "http://registry.npm.taobao.org/flux-standard-action/download/flux-standard-action-2.0.1.tgz",
"integrity": "sha1-nilH9ZBO3Uj5+rdRbduN6m9hIHU=",
"dev": true,
"requires": {
"lodash": "4.17.5"
}
@ -18192,7 +18186,6 @@
"version": "3.7.2",
"resolved": "http://registry.npm.taobao.org/redux/download/redux-3.7.2.tgz",
"integrity": "sha1-BrcxIyFZAdJdBlvjQusCa8HIU3s=",
"dev": true,
"requires": {
"lodash": "4.17.5",
"lodash-es": "4.17.5",
@ -18203,8 +18196,7 @@
"symbol-observable": {
"version": "1.2.0",
"resolved": "http://registry.npm.taobao.org/symbol-observable/download/symbol-observable-1.2.0.tgz",
"integrity": "sha1-wiaIrtTqs83C3+rLtWFmBWCgCAQ=",
"dev": true
"integrity": "sha1-wiaIrtTqs83C3+rLtWFmBWCgCAQ="
}
}
},
@ -20830,8 +20822,7 @@
"type-of-is": {
"version": "3.5.1",
"resolved": "http://registry.npm.taobao.org/type-of-is/download/type-of-is-3.5.1.tgz",
"integrity": "sha1-7sL8ibgo2/mQDrZBbu4w9P4PzTE=",
"dev": true
"integrity": "sha1-7sL8ibgo2/mQDrZBbu4w9P4PzTE="
},
"typedarray": {
"version": "0.0.6",

View File

@ -63,6 +63,7 @@
"moment": "2.18.1",
"mongoose": "4.7.0",
"mongoose-auto-increment": "5.0.1",
"moox": "^1.0.2",
"nodemailer": "4.0.1",
"os": "0.1.1",
"request": "2.81.0",