feat: 新增特征、策略新增编辑页面；部分文件移动；

package.json

@@ -29,6 +29,7 @@
     "eslint-plugin-standard": "^4.0.1",
     "less-vars-to-js": "^1.3.0",
     "lint-staged": "^9.3.0",
+    "react-ace": "^8.1.0",
     "react-test-renderer": "^16.9.0",
     "umi": "^2.9.6",
     "umi-plugin-react": "^1.15.2"

src/conf/config.js

@@ -1,50 +1,49 @@
-let dc = 'http://localhost:8080';
-let tc = 'http://localhost:8080';
-let apiCdn = 'http://cdn01t.weipaitang.com/img/';
-let auth = 'https://back-autht.weipaitang.com';
-let hostDev = 'http://back-admint.weipaitang.com';
-let us = 'http://back-apit.weipaitang.com';
-let sTaskJobLog = "http://10.3.7.11:16686"; // 定时任务日志跳转
-let thanos = "http://thanos-admint.wpt.la";
+let dc = 'http://localhost:8080'
+let tc = 'http://localhost:8080'
+const apiCdn = 'http://cdn01t.weipaitang.com/img/'
+let auth = 'https://back-autht.weipaitang.com'
+let hostDev = 'http://back-admint.weipaitang.com'
+let us = 'http://back-apit.weipaitang.com'
+let sTaskJobLog = 'http://10.3.7.11:16686' // 定时任务日志跳转
+let thanos = 'http://thanos-admint.wpt.la'
 
 if (document.domain === 'localhost') {
-
   // dc = 'http://localhost:8000/api'
   // dc = 'http://backend.wpt.local:8087'
-  dc = 'http://back-apit.weipaitang.com';
-  thanos = "http://thanos-admint.wpt.la";
+  dc = 'http://back-apit.weipaitang.com'
+  thanos = 'http://thanos-admint.wpt.la'
 } else if (document.domain === 'back-admint.wpt.la') {
-  dc = 'http://back-apit.weipaitang.com';
-  us = 'http://back-apit.weipaitang.com';
-  tc = 'http://back-apit.weipaitang.com';
-  auth = 'https://back-autht.weipaitang.com';
-  hostDev = 'http://back-admint.weipaitang.com';
-  sTaskJobLog = "http://10.3.7.11:16686"; // 定时任务日志跳转
-  thanos = "http://thanos-admint.wpt.la";
+  dc = 'http://back-apit.weipaitang.com'
+  us = 'http://back-apit.weipaitang.com'
+  tc = 'http://back-apit.weipaitang.com'
+  auth = 'https://back-autht.weipaitang.com'
+  hostDev = 'http://back-admint.weipaitang.com'
+  sTaskJobLog = 'http://10.3.7.11:16686' // 定时任务日志跳转
+  thanos = 'http://thanost.weipaitang.la'
 } else if (document.domain === 'back-admint.weipaitang.com') {
-  dc = 'http://back-apit.weipaitang.com';
-  tc = 'http://back-apit.weipaitang.com';
-  auth = 'https://back-autht.weipaitang.com';
-  us = 'http://back-apit.weipaitang.com';
-  hostDev = 'http://back-admint.weipaitang.com';
-  sTaskJobLog = "http://10.3.7.11:16686"; // 定时任务日志跳转
-  thanos = "http://thanos-admint.wpt.la";
+  dc = 'http://back-apit.weipaitang.com'
+  tc = 'http://back-apit.weipaitang.com'
+  auth = 'https://back-autht.weipaitang.com'
+  us = 'http://back-apit.weipaitang.com'
+  hostDev = 'http://back-admint.weipaitang.com'
+  sTaskJobLog = 'http://10.3.7.11:16686' // 定时任务日志跳转
+  thanos = 'http://thanost.weipaitang.la'
 } else if (document.domain === 'back-admin.wpt.la') {
-  dc = 'http://back-admin.wpt.la/api';
-  tc = 'http://back-admin.wpt.la/api';
-  auth = 'https://back-auth.weipaitang.com';
-  us = 'http://back-api.weipaitang.com';
-  hostDev = 'http://back-admin.wpt.la';
-  sTaskJobLog = "http://10.3.7.11:16686"; // 定时任务日志跳转
-  thanos = "http://thanos-admint.wpt.la";
+  dc = 'http://back-admin.wpt.la/api'
+  tc = 'http://back-admin.wpt.la/api'
+  auth = 'https://back-auth.weipaitang.com'
+  us = 'http://back-api.weipaitang.com'
+  hostDev = 'http://back-admin.wpt.la'
+  sTaskJobLog = 'http://10.3.7.11:16686' // 定时任务日志跳转
+  thanos = 'http://thanost.weipaitang.la'
 } else if (document.domain === 'back-admin.weipaitang.com') {
-  dc = 'http://back-api.weipaitang.com';
-  tc = 'http://back-api.weipaitang.com';
-  auth = 'https://back-auth.weipaitang.com';
-  us = 'http://back-api.weipaitang.com';
-  hostDev = 'http://back-admin.weipaitang.com';
-  sTaskJobLog = "http://ms-trace.weipaitang.com"; // 定时任务日志跳转
-  thanos = "http://thanos-admint.wpt.la";
+  dc = 'http://back-api.weipaitang.com'
+  tc = 'http://back-api.weipaitang.com'
+  auth = 'https://back-auth.weipaitang.com'
+  us = 'http://back-api.weipaitang.com'
+  hostDev = 'http://back-admin.weipaitang.com'
+  sTaskJobLog = 'http://ms-trace.weipaitang.com' // 定时任务日志跳转
+  thanos = 'http://thanos-inside.wptqc.com'
 }
 
 export {

src/pages/fengkong/features/group/add/index.js

@@ -0,0 +1,156 @@
+import React from 'react'
+import { Form, Input, Row, Col, Switch, Button, Modal, message } from 'antd'
+import AceEditor from 'react-ace'
+import { create, test } from '../../service'
+
+import 'ace-builds/src-noconflict/mode-java'
+import 'ace-builds/src-noconflict/theme-monokai'
+
+const formItemLayout = {
+  layout: 'vertical'
+}
+
+@Form.create()
+class Add extends React.PureComponent {
+  state = {
+    content: '',
+    showTest: false, // 是否展示测试内容
+    testContent: '', // 测试数据
+    testResult: '' // 测试结果
+  }
+
+  create = () => {
+    this.props.form.validateFields((err, values) => {
+      if (!err) {
+        create({
+          ...values,
+          createUser: '马喆诚', // 创建人
+          updateUser: '马喆诚' // 最后修改人
+        }).then(res => {
+          if (res.code === 0) {
+            this.setState({ ...values })
+            Modal.success({
+              title: '提交成功',
+              content: '策略代码编译正常，点击“测试按钮”可以继续测试策略逻辑'
+            })
+          }
+        })
+      }
+    })
+  }
+
+  test =() => {
+    if (!this.state.name) {
+      message.warn('请先提交策略内容!')
+      return false
+    }
+    test({
+      name: this.state.name,
+      content: this.state.testContent
+    }).then(res => {
+      if (res.code === 0) {
+        this.setState({ testResult: res.data })
+      }
+    })
+  }
+
+  render () {
+    const { getFieldDecorator } = this.props.form
+
+    return (
+      <div>
+        <h1>新增分组</h1>
+        <Row>
+          <Col span={12}>
+            <Form {...formItemLayout}>
+              <Form.Item label="策略名称">
+                {getFieldDecorator('name')(<Input placeholder="全英文或英文带下划线" />)}
+              </Form.Item>
+              <Form.Item label="策略描述">
+                {getFieldDecorator('description')(<Input.TextArea placeholder="多行输入" />)}
+              </Form.Item>
+              <Form.Item label="是否启用">
+                {getFieldDecorator('enabled')(<Switch />)}
+              </Form.Item>
+              <Form.Item label="策略逻辑开发">
+                {getFieldDecorator('content')(
+                  <AceEditor
+                    style={{ width: this.state.showTest ? '100%' : '200%' }}
+                    mode="java"
+                    theme="monokai"
+                    name="content"
+                    onChange={(value) => this.setState({ content: value })}
+                    fontSize={14}
+                    showPrintMargin={true}
+                    showGutter={true}
+                    highlightActiveLine={true}
+                    value={''}
+                    setOptions={{
+                      enableBasicAutocompletion: true,
+                      enableLiveAutocompletion: true,
+                      enableSnippets: true,
+                      showLineNumbers: true,
+                      tabSize: 2
+                    }}
+                  />
+                )}
+              </Form.Item>
+              <Form.Item>
+                <Button type="primary" onClick={this.create}>提交</Button>&emsp;
+                <Button onClick={() => this.setState({ showTest: true })}>测试</Button>
+              </Form.Item>
+            </Form>
+          </Col>
+          <Col span={12}>
+            <div style={{ paddingLeft: '20px', display: this.state.showTest ? 'block' : 'none' }}>
+              <Form.Item label="输入数据">
+                <AceEditor
+                  mode="json"
+                  theme="monokai"
+                  onChange={(value) => this.setState({ testContent: value })}
+                  fontSize={14}
+                  showPrintMargin={true}
+                  showGutter={true}
+                  highlightActiveLine={true}
+                  value={this.state.testContent}
+                  height="300px"
+                  setOptions={{
+                    enableBasicAutocompletion: true,
+                    enableLiveAutocompletion: true,
+                    enableSnippets: true,
+                    showLineNumbers: true,
+                    tabSize: 2
+                  }}
+                />
+              </Form.Item>
+
+              <Button type="primary" onClick={this.test}>执行测试</Button>&emsp;
+              <Form.Item label="输出结果">
+                <AceEditor
+                  mode="json"
+                  theme="monokai"
+                  fontSize={14}
+                  showPrintMargin={true}
+                  showGutter={true}
+                  highlightActiveLine={true}
+                  value={this.state.testResult}
+                  setOptions={{
+                    enableBasicAutocompletion: true,
+                    enableLiveAutocompletion: true,
+                    enableSnippets: true,
+                    showLineNumbers: true,
+                    tabSize: 2
+                  }}
+                />
+              </Form.Item>
+            </div>
+
+          </Col>
+        </Row>
+
+      </div>
+    )
+  }
+}
+
+export default Add

src/pages/fengkong/features/group/edit/$id.js

@@ -0,0 +1,139 @@
+import React from 'react'
+import { Form, Input, Row, Col, Switch, Button, Modal, message } from 'antd'
+import AceEditor from 'react-ace'
+import { create, test } from '../../service'
+
+import 'ace-builds/src-noconflict/mode-java'
+import 'ace-builds/src-noconflict/theme-monokai'
+
+const formItemLayout = {
+  layout: 'vertical'
+}
+
+@Form.create()
+class Add extends React.PureComponent {
+  state = {
+    content: '',
+    showTest: false, // 是否展示测试内容
+    testContent: '', // 测试数据
+    testResult: '' // 测试结果
+  }
+
+  create = () => {
+    this.props.form.validateFields((err, values) => {
+      if (!err) {
+        create({
+          ...values,
+          createUser: '马喆诚', // 创建人
+          updateUser: '马喆诚' // 最后修改人
+        }).then(res => {
+          if (res.code === 0) {
+            this.setState({ ...values })
+            Modal.success({
+              title: '提交成功',
+              content: '策略代码编译正常，点击“测试按钮”可以继续测试策略逻辑'
+            })
+          }
+        })
+      }
+    })
+  }
+
+  test =() => {
+    if (!this.state.name) {
+      message.warn('请先提交策略内容!')
+      return false
+    }
+    test({
+      name: this.state.name,
+      content: this.state.testContent
+    }).then(res => {
+      if (res.code === 0) {
+        this.setState({ testResult: res.data })
+      }
+    })
+  }
+
+  render () {
+    const { getFieldDecorator } = this.props.form
+
+    return (
+      <div>
+        <h1>编辑分组</h1>
+        <Row>
+          <Col span={12}>
+            <Form {...formItemLayout}>
+              <Form.Item label="分组名称">
+                {getFieldDecorator('name')(<Input placeholder="全英文或英文带下划线" />)}
+              </Form.Item>
+              <Form.Item label="特征列表">
+                {getFieldDecorator('features')(<Input placeholder="，号分割" />)}
+              </Form.Item>
+              <Form.Item label="分组描述">
+                {getFieldDecorator('description')(<Input.TextArea placeholder="多行输入" />)}
+              </Form.Item>
+              <Form.Item label="前置函数">
+                {getFieldDecorator('preScript')(<Input placeholder="预处理分组函数" />)}
+              </Form.Item>
+              <Form.Item label="后置函数">
+                {getFieldDecorator('postScript')(<Input placeholder="后处理分组函数" />)}
+              </Form.Item>
+              <Form.Item>
+                <Button type="primary" onClick={this.create}>提交</Button>&emsp;
+                <Button onClick={() => this.setState({ showTest: true })}>测试</Button>
+              </Form.Item>
+            </Form>
+          </Col>
+          <Col span={12}>
+            <div style={{ paddingLeft: '20px', display: this.state.showTest ? 'block' : 'none' }}>
+              <Form.Item label="输入数据">
+                <AceEditor
+                  mode="json"
+                  theme="monokai"
+                  onChange={(value) => this.setState({ testContent: value })}
+                  fontSize={14}
+                  showPrintMargin={true}
+                  showGutter={true}
+                  highlightActiveLine={true}
+                  value={this.state.testContent}
+                  height="300px"
+                  setOptions={{
+                    enableBasicAutocompletion: true,
+                    enableLiveAutocompletion: true,
+                    enableSnippets: true,
+                    showLineNumbers: true,
+                    tabSize: 2
+                  }}
+                />
+              </Form.Item>
+
+              <Button type="primary" onClick={this.test}>执行测试</Button>&emsp;
+              <Form.Item label="输出结果">
+                <AceEditor
+                  mode="json"
+                  theme="monokai"
+                  fontSize={14}
+                  showPrintMargin={true}
+                  showGutter={true}
+                  highlightActiveLine={true}
+                  value={this.state.testResult}
+                  setOptions={{
+                    enableBasicAutocompletion: true,
+                    enableLiveAutocompletion: true,
+                    enableSnippets: true,
+                    showLineNumbers: true,
+                    tabSize: 2
+                  }}
+                />
+              </Form.Item>
+            </div>
+
+          </Col>
+        </Row>
+
+      </div>
+    )
+  }
+}
+
+export default Add

src/pages/fengkong/strategies/add/index.js

@@ -0,0 +1,156 @@
+import React from 'react'
+import { Form, Input, Row, Col, Switch, Button, Modal, message } from 'antd'
+import AceEditor from 'react-ace'
+import { create, test } from '../service'
+
+import 'ace-builds/src-noconflict/mode-java'
+import 'ace-builds/src-noconflict/theme-monokai'
+
+const formItemLayout = {
+  layout: 'vertical'
+}
+
+@Form.create()
+class Add extends React.PureComponent {
+  state = {
+    content: '',
+    showTest: false, // 是否展示测试内容
+    testContent: '', // 测试数据
+    testResult: '' // 测试结果
+  }
+
+  create = () => {
+    this.props.form.validateFields((err, values) => {
+      if (!err) {
+        create({
+          ...values,
+          createUser: '马喆诚', // 创建人
+          updateUser: '马喆诚' // 最后修改人
+        }).then(res => {
+          if (res.code === 0) {
+            this.setState({ ...values })
+            Modal.success({
+              title: '提交成功',
+              content: '策略代码编译正常，点击“测试按钮”可以继续测试策略逻辑'
+            })
+          }
+        })
+      }
+    })
+  }
+
+  test =() => {
+    if (!this.state.name) {
+      message.warn('请先提交策略内容!')
+      return false
+    }
+    test({
+      name: this.state.name,
+      content: this.state.testContent
+    }).then(res => {
+      if (res.code === 0) {
+        this.setState({ testResult: res.data })
+      }
+    })
+  }
+
+  render () {
+    const { getFieldDecorator } = this.props.form
+
+    return (
+      <div>
+        <h1>新增策略</h1>
+        <Row>
+          <Col span={12}>
+            <Form {...formItemLayout}>
+              <Form.Item label="策略名称">
+                {getFieldDecorator('name')(<Input placeholder="全英文或英文带下划线" />)}
+              </Form.Item>
+              <Form.Item label="策略描述">
+                {getFieldDecorator('description')(<Input.TextArea placeholder="多行输入" />)}
+              </Form.Item>
+              <Form.Item label="是否启用">
+                {getFieldDecorator('enabled')(<Switch />)}
+              </Form.Item>
+              <Form.Item label="策略逻辑开发">
+                {getFieldDecorator('content')(
+                  <AceEditor
+                    style={{ width: this.state.showTest ? '100%' : '200%' }}
+                    mode="java"
+                    theme="monokai"
+                    name="content"
+                    onChange={(value) => this.setState({ content: value })}
+                    fontSize={14}
+                    showPrintMargin={true}
+                    showGutter={true}
+                    highlightActiveLine={true}
+                    value={''}
+                    setOptions={{
+                      enableBasicAutocompletion: true,
+                      enableLiveAutocompletion: true,
+                      enableSnippets: true,
+                      showLineNumbers: true,
+                      tabSize: 2
+                    }}
+                  />
+                )}
+              </Form.Item>
+              <Form.Item>
+                <Button type="primary" onClick={this.create}>提交</Button>&emsp;
+                <Button onClick={() => this.setState({ showTest: true })}>测试</Button>
+              </Form.Item>
+            </Form>
+          </Col>
+          <Col span={12}>
+            <div style={{ paddingLeft: '20px', display: this.state.showTest ? 'block' : 'none' }}>
+              <Form.Item label="输入数据">
+                <AceEditor
+                  mode="json"
+                  theme="monokai"
+                  onChange={(value) => this.setState({ testContent: value })}
+                  fontSize={14}
+                  showPrintMargin={true}
+                  showGutter={true}
+                  highlightActiveLine={true}
+                  value={this.state.testContent}
+                  height="300px"
+                  setOptions={{
+                    enableBasicAutocompletion: true,
+                    enableLiveAutocompletion: true,
+                    enableSnippets: true,
+                    showLineNumbers: true,
+                    tabSize: 2
+                  }}
+                />
+              </Form.Item>
+
+              <Button type="primary" onClick={this.test}>执行测试</Button>&emsp;
+              <Form.Item label="输出结果">
+                <AceEditor
+                  mode="json"
+                  theme="monokai"
+                  fontSize={14}
+                  showPrintMargin={true}
+                  showGutter={true}
+                  highlightActiveLine={true}
+                  value={this.state.testResult}
+                  setOptions={{
+                    enableBasicAutocompletion: true,
+                    enableLiveAutocompletion: true,
+                    enableSnippets: true,
+                    showLineNumbers: true,
+                    tabSize: 2
+                  }}
+                />
+              </Form.Item>
+            </div>
+
+          </Col>
+        </Row>
+
+      </div>
+    )
+  }
+}
+
+export default Add

src/pages/fengkong/strategies/edit.js

@@ -1,21 +0,0 @@
-import React from 'react'
-
-class GroupList extends React.PureComponent {
-  state = {
-    showModal: false,
-    params: {}
-  }
-
-  render () {
-    const { location } = this.props
-    console.log(location, '----')
-    return (
-      <div>
-        hhhh
-        {location.state.name}
-      </div>
-    )
-  }
-}
-
-export default GroupList

src/pages/fengkong/strategies/edit/$id.js

@@ -0,0 +1,156 @@
+import React from 'react'
+import { Form, Input, Row, Col, Switch, Button, Modal, message } from 'antd'
+import AceEditor from 'react-ace'
+import { create, test } from '../service'
+
+import 'ace-builds/src-noconflict/mode-java'
+import 'ace-builds/src-noconflict/theme-monokai'
+
+const formItemLayout = {
+  layout: 'vertical'
+}
+
+@Form.create()
+class Add extends React.PureComponent {
+  state = {
+    content: '',
+    showTest: false, // 是否展示测试内容
+    testContent: '', // 测试数据
+    testResult: '' // 测试结果
+  }
+
+  create = () => {
+    this.props.form.validateFields((err, values) => {
+      if (!err) {
+        create({
+          ...values,
+          createUser: '马喆诚', // 创建人
+          updateUser: '马喆诚' // 最后修改人
+        }).then(res => {
+          if (res.code === 0) {
+            this.setState({ ...values })
+            Modal.success({
+              title: '提交成功',
+              content: '策略代码编译正常，点击“测试按钮”可以继续测试策略逻辑'
+            })
+          }
+        })
+      }
+    })
+  }
+
+  test =() => {
+    if (!this.state.name) {
+      message.warn('请先提交策略内容!')
+      return false
+    }
+    test({
+      name: this.state.name,
+      content: this.state.testContent
+    }).then(res => {
+      if (res.code === 0) {
+        this.setState({ testResult: res.data })
+      }
+    })
+  }
+
+  render () {
+    const { getFieldDecorator } = this.props.form
+
+    return (
+      <div>
+        <h1>新增策略</h1>
+        <Row>
+          <Col span={12}>
+            <Form {...formItemLayout}>
+              <Form.Item label="策略名称">
+                {getFieldDecorator('name')(<Input placeholder="全英文或英文带下划线" />)}
+              </Form.Item>
+              <Form.Item label="策略描述">
+                {getFieldDecorator('description')(<Input.TextArea placeholder="多行输入" />)}
+              </Form.Item>
+              <Form.Item label="是否启用">
+                {getFieldDecorator('enabled')(<Switch />)}
+              </Form.Item>
+              <Form.Item label="策略逻辑开发">
+                {getFieldDecorator('content')(
+                  <AceEditor
+                    style={{ width: this.state.showTest ? '100%' : '200%' }}
+                    mode="java"
+                    theme="monokai"
+                    name="content"
+                    onChange={(value) => this.setState({ content: value })}
+                    fontSize={14}
+                    showPrintMargin={true}
+                    showGutter={true}
+                    highlightActiveLine={true}
+                    value={''}
+                    setOptions={{
+                      enableBasicAutocompletion: true,
+                      enableLiveAutocompletion: true,
+                      enableSnippets: true,
+                      showLineNumbers: true,
+                      tabSize: 2
+                    }}
+                  />
+                )}
+              </Form.Item>
+              <Form.Item>
+                <Button type="primary" onClick={this.create}>提交</Button>&emsp;
+                <Button onClick={() => this.setState({ showTest: true })}>测试</Button>
+              </Form.Item>
+            </Form>
+          </Col>
+          <Col span={12}>
+            <div style={{ paddingLeft: '20px', display: this.state.showTest ? 'block' : 'none' }}>
+              <Form.Item label="输入数据">
+                <AceEditor
+                  mode="json"
+                  theme="monokai"
+                  onChange={(value) => this.setState({ testContent: value })}
+                  fontSize={14}
+                  showPrintMargin={true}
+                  showGutter={true}
+                  highlightActiveLine={true}
+                  value={this.state.testContent}
+                  height="300px"
+                  setOptions={{
+                    enableBasicAutocompletion: true,
+                    enableLiveAutocompletion: true,
+                    enableSnippets: true,
+                    showLineNumbers: true,
+                    tabSize: 2
+                  }}
+                />
+              </Form.Item>
+
+              <Button type="primary" onClick={this.test}>执行测试</Button>&emsp;
+              <Form.Item label="输出结果">
+                <AceEditor
+                  mode="json"
+                  theme="monokai"
+                  fontSize={14}
+                  showPrintMargin={true}
+                  showGutter={true}
+                  highlightActiveLine={true}
+                  value={this.state.testResult}
+                  setOptions={{
+                    enableBasicAutocompletion: true,
+                    enableLiveAutocompletion: true,
+                    enableSnippets: true,
+                    showLineNumbers: true,
+                    tabSize: 2
+                  }}
+                />
+              </Form.Item>
+            </div>
+
+          </Col>
+        </Row>
+
+      </div>
+    )
+  }
+}
+
+export default Add

src/pages/fengkong/strategies/service.js

@@ -0,0 +1,14 @@
+import { fetchApi } from '@/apis/'
+import { thanos } from '@/conf/config'
+
+// 新增策略
+export async function create (params) {
+  const url = `${thanos}/thanos-admin/api/v1/dsl/create`
+  return fetchApi(url, params)
+}
+
+// 测试策略
+export async function test (params) {
+  const url = `${thanos}/gamora/api/v1/exec/${params.name}`
+  return fetchApi(url, params)
+}

src/pages/fengkong/strategies/strategies.js

@@ -69,7 +69,7 @@ class GroupList extends React.PureComponent {
           <span>
             <Link
               to={{
-                pathname: './edit',
+                pathname: './edit/' + record.id,
                 state: record
               }}
             >编辑</Link>