2017-07-18 12:53:53 +08:00
|
|
|
import React, { Component } from 'react'
|
2017-07-19 15:12:10 +08:00
|
|
|
import PropTypes from 'prop-types'
|
|
|
|
import { connect } from 'react-redux'
|
2017-07-27 19:32:08 +08:00
|
|
|
// import wangEditor from 'wangeditor'
|
2017-07-20 14:48:29 +08:00
|
|
|
import { getReqParams } from '../../../actions/addInterface.js'
|
2017-07-26 12:31:42 +08:00
|
|
|
|
2017-07-27 19:32:08 +08:00
|
|
|
//const editor = new wangEditor('#req-cover')
|
2017-07-26 12:31:42 +08:00
|
|
|
|
2017-07-19 15:12:10 +08:00
|
|
|
@connect(
|
|
|
|
state => {
|
|
|
|
return {
|
2017-07-19 19:29:18 +08:00
|
|
|
reqParams: state.addInterface.reqParams
|
2017-07-19 15:12:10 +08:00
|
|
|
}
|
|
|
|
},
|
|
|
|
{
|
2017-07-20 14:48:29 +08:00
|
|
|
getReqParams
|
2017-07-19 15:12:10 +08:00
|
|
|
}
|
|
|
|
)
|
2017-07-18 12:53:53 +08:00
|
|
|
|
|
|
|
class ReqParams extends Component {
|
2017-07-19 15:12:10 +08:00
|
|
|
static propTypes = {
|
2017-07-20 14:48:29 +08:00
|
|
|
reqParams: PropTypes.string,
|
|
|
|
getReqParams: PropTypes.func
|
2017-07-19 15:12:10 +08:00
|
|
|
}
|
|
|
|
|
2017-07-18 12:53:53 +08:00
|
|
|
constructor(props) {
|
|
|
|
super(props)
|
|
|
|
}
|
|
|
|
|
2017-07-27 19:32:08 +08:00
|
|
|
// initParams () {
|
|
|
|
// const { reqParams } = this.props
|
|
|
|
// if (reqParams) {
|
|
|
|
// editor.txt.html(reqParams)
|
|
|
|
// }
|
|
|
|
// }
|
2017-07-24 10:59:17 +08:00
|
|
|
|
2017-07-20 14:48:29 +08:00
|
|
|
componentDidMount () {
|
2017-07-27 19:32:08 +08:00
|
|
|
function json_parse(json){
|
|
|
|
try{
|
|
|
|
return JSON.stringify(JSON.parse(json), null, "\t");
|
|
|
|
}catch(e){
|
|
|
|
return json
|
|
|
|
}
|
2017-07-19 15:12:10 +08:00
|
|
|
}
|
2017-07-27 19:32:08 +08:00
|
|
|
let editor2 = this.editor = window.ace.edit("req-cover")
|
|
|
|
editor2.getSession().setMode("ace/mode/json");
|
|
|
|
setTimeout( () => {
|
|
|
|
editor2.setValue(json_parse(this.props.reqParams))
|
|
|
|
} ,400)
|
|
|
|
|
|
|
|
editor2.getSession().on('change', ()=> {
|
|
|
|
this.props.getReqParams(editor2.getValue())
|
|
|
|
});
|
|
|
|
// const reg = /(<p>)|(<\/p>)| |(<br>)|\s+/g
|
|
|
|
// let json = ''
|
|
|
|
// editor.customConfig.menus = []
|
|
|
|
// editor.customConfig.onchange = html => {
|
|
|
|
// json = html.replace(reg, '')
|
|
|
|
// this.props.getReqParams(json)
|
|
|
|
// }
|
|
|
|
// setTimeout(() => {
|
|
|
|
// this.initParams()
|
|
|
|
// }, 500)
|
|
|
|
// editor.create()
|
2017-07-19 15:12:10 +08:00
|
|
|
}
|
2017-07-20 14:48:29 +08:00
|
|
|
|
2017-07-18 12:53:53 +08:00
|
|
|
render () {
|
|
|
|
return (
|
2017-07-26 12:31:42 +08:00
|
|
|
<section className="req-params-box">
|
2017-07-18 12:53:53 +08:00
|
|
|
<div className="req-params">
|
|
|
|
<strong className="req-h3">请求参数 :</strong>
|
2017-07-20 14:48:29 +08:00
|
|
|
<div id="req-cover"></div>
|
2017-07-18 12:53:53 +08:00
|
|
|
</div>
|
|
|
|
</section>
|
|
|
|
)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2017-07-20 14:48:29 +08:00
|
|
|
export default ReqParams
|