From 12b725d215182a0e70eb945d809338b1f391be96 Mon Sep 17 00:00:00 2001 From: tangjiang <465264938@qq.com> Date: Sun, 24 Nov 2019 10:01:54 +0800 Subject: [PATCH] =?UTF-8?q?=E5=BC=80=E5=8F=91=E8=80=85=E7=A4=BE=E5=8C=BA?= =?UTF-8?q?=E4=BB=A3=E7=A0=81=E4=BF=9D=E5=AD=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/react/package.json | 1 + public/react/src/App.js | 11 +- public/react/src/constants/index.js | 19 ++ .../src/modules/developer/DeveloperHome.js | 215 ++++++++----- public/react/src/modules/developer/St | 0 public/react/src/modules/developer/index.js | 4 +- public/react/src/modules/developer/index.scss | 7 +- .../src/modules/developer/meditor/MEditor.js | 201 ++++++++++++ .../modules/developer/newOrEditTask/index.js | 71 ++--- .../developer/newOrEditTask/index.scss | 80 +---- .../leftpane/editorTab/AddTestDemo.js | 159 ++++++++++ .../newOrEditTask/leftpane/editorTab/index.js | 295 ++++++++++++++++-- .../leftpane/editorTab/index.scss | 66 ++++ .../developer/newOrEditTask/leftpane/index.js | 4 +- .../newOrEditTask/leftpane/index.scss | 10 +- .../newOrEditTask/rightpane/index.js | 22 +- .../rightpane/initTabCtx/index.js | 13 +- .../modules/developer/split_pane_resizer.scss | 118 +++++++ .../modules/developer/studentStudy/index.js | 59 ++++ .../modules/developer/studentStudy/index.scss | 1 + .../developer/studentStudy/leftpane/index.js | 18 ++ .../developer/studentStudy/rightpane/index.js | 18 ++ public/react/src/redux/actions/actionTypes.js | 19 +- public/react/src/redux/actions/index.js | 34 +- public/react/src/redux/actions/ojForm.js | 234 ++++++++++++++ public/react/src/redux/actions/ojList.js | 23 ++ public/react/src/redux/reducers/index.js | 10 +- .../react/src/redux/reducers/ojFormReducer.js | 143 +++++++++ .../react/src/redux/reducers/ojListReducer.js | 29 ++ public/react/src/services/ojService.js | 36 +++ 30 files changed, 1672 insertions(+), 248 deletions(-) create mode 100644 public/react/src/constants/index.js delete mode 100644 public/react/src/modules/developer/St create mode 100644 public/react/src/modules/developer/meditor/MEditor.js create mode 100644 public/react/src/modules/developer/newOrEditTask/leftpane/editorTab/AddTestDemo.js create mode 100644 public/react/src/modules/developer/newOrEditTask/leftpane/editorTab/index.scss create mode 100644 public/react/src/modules/developer/split_pane_resizer.scss create mode 100644 public/react/src/modules/developer/studentStudy/index.js create mode 100644 public/react/src/modules/developer/studentStudy/index.scss create mode 100644 public/react/src/modules/developer/studentStudy/leftpane/index.js create mode 100644 public/react/src/modules/developer/studentStudy/rightpane/index.js create mode 100644 public/react/src/redux/actions/ojForm.js create mode 100644 public/react/src/redux/actions/ojList.js create mode 100644 public/react/src/redux/reducers/ojFormReducer.js create mode 100644 public/react/src/redux/reducers/ojListReducer.js create mode 100644 public/react/src/services/ojService.js diff --git a/public/react/package.json b/public/react/package.json index 61146f126..526041410 100644 --- a/public/react/package.json +++ b/public/react/package.json @@ -29,6 +29,7 @@ "dotenv": "4.0.0", "dotenv-expand": "4.2.0", "echarts": "^4.2.0-rc.2", + "editor.md": "^1.5.0", "eslint": "4.10.0", "eslint-config-react-app": "^2.1.0", "eslint-loader": "1.9.0", diff --git a/public/react/src/App.js b/public/react/src/App.js index c498b5859..8c3b6d3cc 100644 --- a/public/react/src/App.js +++ b/public/react/src/App.js @@ -305,6 +305,11 @@ const NewOrEditTask = Loadable({ loader: () => import('./modules/developer/newOrEditTask'), loading: Loading }); +// 学员学习 +const StudentStudy = Loadable({ + loader: () => import('./modules/developer/studentStudy'), + loading: Loading +}); // //个人竞赛报名 // const PersonalCompetit = Loadable({ // loader: () => import('./modules/competition/personal/PersonalCompetit.js'), @@ -483,8 +488,6 @@ class App extends Component { - - {/*题库*/} () }/> - + + + {name} }, { title: '分类', dataIndex: 'category', - width: '20%' + width: '20%', + align: 'center', + render: (category) => {category ? testMaps['category'][+category] : '-'} }, { title: '难度', - dataIndex: 'level', + dataIndex: 'difficult', align: 'center', - width: '10%' + width: '10%', + render: (difficult) => { + if (difficult) { + return {testMaps['difficult'][+difficult]} + } else { + return '-'; + } + } }, { title: '热度', - dataIndex: 'hot', + dataIndex: 'hack_user_lastest_codes_count', sorter: true, align: 'center', width: '10%' }, { title: '通过率', - dataIndex: 'pass', + dataIndex: 'passed_rate', sorter: true, align:'right', - width: '10%' + width: '10%', + render: val => {`${val}%`} } ]; @@ -130,52 +159,41 @@ class DeveloperHome extends PureComponent { state = { data: [], pagination: { + total: 1, // 总条数 + pageSize: 10, // 每页显示条数 + current: 1, // 当前页数 showQuickJumper: true }, loading: false, + searchParams: { + search: '', // 查询关键字 + 'come_from': '', // 来源 + difficult: '', // 难易度 + status: '', // 未做 + category: '', // 分类 + 'sort_by': '', // 排序 + 'sort_direction': '' // 排序方向 + } }; componentDidMount() { - this.fetch(); + this.fetchData(); + const {hacks_count} = this.props.ojListReducer; + this.setState({ + pagination: { + total: hacks_count + } + }); } handleTableChange = (pagination, filters, sorter) => { - const pager = { ...this.state.pagination }; - pager.current = pagination.current; - this.setState({ - pagination: pager, - }); - this.fetch({ - results: pagination.pageSize, - page: pagination.current, - sortField: sorter.field, - sortOrder: sorter.order, - ...filters, - }); + // console.log(pagination, filters, sorter); + const {field, order} = sorter; + this.handleFilterSearch({sort_by: field, sort_direction: order === 'descend' ? 'desc' : 'asc'}); }; - fetch = (params = {}) => { - console.log('params:', params); - this.setState({ loading: true }); - // reqwest({ - // url: 'https://randomuser.me/api', - // method: 'get', - // data: { - // results: 10, - // ...params, - // }, - // type: 'json', - // }).then(data => { - // const pagination = { ...this.state.pagination }; - // // Read total count from server - // // pagination.total = data.totalCount; - // pagination.total = 200; - // this.setState({ - // loading: false, - // data: data.results, - // pagination, - // }); - // }); + fetchData = () => { + this.props.fetchOJList(this.state.searchParams); }; /** @@ -198,27 +216,55 @@ class DeveloperHome extends PureComponent { ) }; - + getOptionsItem = (type) => { + return maps[type].map(item => { + return + }); + } + // 点击条件时加载数据 + handleFilterSearch = (obj) => { + const searchParams = Object.assign({}, this.state.searchParams, obj); + this.setState({ + searchParams: searchParams + }, () => { + this.fetchData(); + }); + } /** * 搜索输入框 * @param value 输入框值 */ handleInputSearch = (value) => { - console.log('搜索值==', value); + value = value.trim(); + // if (value.length === 0) return; + this.handleFilterSearch({search: value}); } + // handleSearchChange = (e) => { + // console.log(e.target.value); + // const value = e.target.value.trim(); + // } // 下拉类别菜单 - handleCategoryMenuClick = (e) => { - console.log('dropdown ==>>>', e); + handleCategoryMenuClick = (item) => { + this.handleFilterSearch({category: +item.key === 0 ? '' : +item.key}); } // 难度下拉 - handleHardMenuClick = (e) => {} + handleHardMenuClick = (item) => { + this.handleFilterSearch({difficult: +item.key}); + } // 状态下拉 - handleSatusMenuClick = (e) => {} + handleSatusMenuClick = (item) => { + this.handleFilterSearch({status: +item.key}); + } // 来源下拉 - handleOriginMenuClick = (e) => {} + handleOriginMenuClick = (item) => { + this.handleFilterSearch({come_from: item.key === 'all' ? '' : item.key}); + } render () { // const { testReducer, handleClick } = this.props; + const { ojListReducer: {hacks_list, top_data, hacks_count} } = this.props; + const {passed_count = 0, simple_count = 0, medium_count = 0, diff_count = 0} = top_data; + // console.log( '======>>>>>>', ojListReducer ); return (
@@ -226,11 +272,11 @@ class DeveloperHome extends PureComponent {
-

已解决 589 / 1800 题

+

已解决 {passed_count} / {hacks_count} 题

- - - + + +
- + 分类 - + 难度 - + 状态 - + 来源 this.handleInputSearch(value)} style={{ width: 320, float: 'right' }} /> @@ -263,7 +310,7 @@ class DeveloperHome extends PureComponent { Math.random()} - dataSource={this.state.data} + dataSource={hacks_list} pagination={this.state.pagination} onChange={this.handleTableChange} /> @@ -281,12 +328,14 @@ class DeveloperHome extends PureComponent { * @param {*} ownProps DeveloperHome 中的 props */ const mapStateToProps = (state, ownProps) => ({ - testReducer: state.testReducer + testReducer: state.testReducer, + ojListReducer: state.ojListReducer }); const mapDispatchToProps = (dispatch) => ({ - handleClick: () => dispatch(actions.toggleTodo()) + handleClick: () => dispatch(actions.toggleTodo()), + fetchOJList: (params) => dispatch(actions.getOJList(params)) }); export default connect( diff --git a/public/react/src/modules/developer/St b/public/react/src/modules/developer/St deleted file mode 100644 index e69de29bb..000000000 diff --git a/public/react/src/modules/developer/index.js b/public/react/src/modules/developer/index.js index 524dd6104..cf082fa70 100644 --- a/public/react/src/modules/developer/index.js +++ b/public/react/src/modules/developer/index.js @@ -11,9 +11,7 @@ import DeveloperHome from './DeveloperHome'; const App = () => { return ( -
- -
+ ); } diff --git a/public/react/src/modules/developer/index.scss b/public/react/src/modules/developer/index.scss index f041da670..ca7454092 100644 --- a/public/react/src/modules/developer/index.scss +++ b/public/react/src/modules/developer/index.scss @@ -9,7 +9,10 @@ } .developer-list{ - overflow: hidden; + // overflow: hidden; + .ant-spin-container{ + padding-bottom: 100px; + } .card-top { border-radius:4px; background:rgba(255,255,255,1); @@ -50,4 +53,4 @@ } } } -} \ No newline at end of file +} diff --git a/public/react/src/modules/developer/meditor/MEditor.js b/public/react/src/modules/developer/meditor/MEditor.js new file mode 100644 index 000000000..7ab7129fd --- /dev/null +++ b/public/react/src/modules/developer/meditor/MEditor.js @@ -0,0 +1,201 @@ +/* + * @Description: + * @Author: tangjiang + * @Github: + * @Date: 2019-11-21 16:57:34 + * @LastEditors: tangjiang + * @LastEditTime: 2019-11-21 20:11:05 + */ +import React from 'react'; +import { getUrl } from 'educoder'; + +const $ = window.$; +const path = getUrl("/editormd/lib/") +const imageUrl = `/api/attachments.json`; +// 恢复数据 +function md_rec_data(k,mdu,id, editor){ + if(window.sessionStorage.getItem(k+mdu) !== null){ + editor.setValue(window.sessionStorage.getItem(k+mdu)); + md_clear_data(k,mdu,id); + } +} + +// 保存数据 +function md_add_data(k,mdu,d){ + window.sessionStorage.setItem(k+mdu,d); +} + +// 清空保存的数据 +function md_clear_data(k,mdu,id){ + window.sessionStorage.removeItem(k+mdu); + var id1 = "#e_tip_"+id; + var id2 = "#e_tips_"+id; + if(k == 'content'){ + $(id2).html(""); + }else{ + $(id1).html(""); + } +} + +function md_elocalStorage(editor,mdu,id){ + if (window.sessionStorage){ + var oc = window.sessionStorage.getItem('content'+mdu); + if(oc !== null ){ + console.log("#e_tips_"+id) + $("#e_tips_"+id).data('editor', editor); + var h = '您上次有已保存的数据，是否恢复 ? / 不恢复'; + $("#e_tips_"+id).html(h); + } + setInterval(function() { + var d = new Date(); + var h = d.getHours(); + var m = d.getMinutes(); + var s = d.getSeconds(); + h = h < 10 ? '0' + h : h; + m = m < 10 ? '0' + m : m; + s = s < 10 ? '0' + s : s; + if(editor.getValue().trim() != ""){ + md_add_data("content",mdu,editor.getValue()); + var id1 = "#e_tip_"+id; + var id2 = "#e_tips_"+id; + + $(id1).html(" 数据已于 " + h + ':' + m + ':' + s +" 保存 "); + $(id2).html(""); + } + },10000); + + }else{ + $("#e_tip_"+id).after('您的浏览器不支持localStorage.无法开启自动保存草稿服务,请升级浏览器！'); + } +} + + +function create_editorMD(id, width, high, placeholder, imageUrl, callback) { + var editorName = window.editormd(id, { + width: width, + height: high, + path: path, // "/editormd/lib/" + + syncScrolling: "single", + tex: true, + tocm: true, + emoji: true, + taskList: true, + codeFold: true, + searchReplace: true, + htmlDecode: "style,script,iframe", + sequenceDiagram: true, + autoFocus: false, + toolbarIcons: function () { + // Or return editormd.toolbarModes[name]; // full, simple, mini + // Using "||" set icons align right. + return ["bold", "italic", "|", "list-ul", "list-ol", "|", "code", "code-block", "|", "testIcon", "testIcon1", '|', "image", "table", '|', "watch", "clear"] + }, + toolbarCustomIcons: { + testIcon: "
", + testIcon1: "
" + }, + //这个配置在simple.html中并没有，但是为了能够提交表单，使用这个配置可以让构造出来的HTML代码直接在第二个隐藏的textarea域中，方便post提交表单。 + saveHTMLToTextarea: true, + // 用于增加自定义工具栏的功能，可以直接插入HTML标签，不使用默认的元素创建图标 + dialogMaskOpacity: 0.6, + placeholder: placeholder, + imageUpload: true, + imageFormats: ["jpg", "jpeg", "gif", "png", "bmp", "webp", "JPG", "JPEG", "GIF", "PNG", "BMP", "WEBP"], + imageUploadURL: imageUrl,//url + onload: function () { + // this.previewing(); + $("#" + id + " [type=\"latex\"]").bind("click", function () { + editorName.cm.replaceSelection("```latex"); + editorName.cm.replaceSelection("\n"); + editorName.cm.replaceSelection("\n"); + editorName.cm.replaceSelection("```"); + var __Cursor = editorName.cm.getDoc().getCursor(); + editorName.cm.setCursor(__Cursor.line - 1, 0); + }); + + $("#" + id + " [type=\"inline\"]").bind("click", function () { + editorName.cm.replaceSelection("`$$$$`"); + var __Cursor = editorName.cm.getDoc().getCursor(); + editorName.cm.setCursor(__Cursor.line, __Cursor.ch - 3); + editorName.cm.focus(); + }); + $("[type=\"inline\"]").attr("title", "行内公式"); + $("[type=\"latex\"]").attr("title", "多行公式"); + + md_elocalStorage(editorName, `answers__${id}`, "Memoanswers"); + + callback && callback() + } + }); + return editorName; +} + +function initialEditorMd(id, width, height, placeholder, imageUrl, callback) { + + const testEditor = window.editormd(id, { + width: width, + height: height, + path : path, + // theme : "light", + // previewTheme : "light", + // editorTheme : "pastel-on-dark", + markdown : '/test code', + codeFold : true, + //syncScrolling : false, + saveHTMLToTextarea : true, // 保存 HTML 到 Textarea + searchReplace : true, + //watch : false, // 关闭实时预览 + htmlDecode : "style,script,iframe|on*", // 开启 HTML 标签解析，为了安全性，默认不开启 + //toolbar : false, //关闭工具栏 + //previewCodeHighlight : false, // 关闭预览 HTML 的代码块高亮，默认开启 + emoji : true, + taskList : true, + tocm : true, // Using [TOCM] + tex : true, // 开启科学公式TeX语言支持，默认关闭 + flowChart : true, // 开启流程图支持，默认关闭 + sequenceDiagram : true, // 开启时序/序列图支持，默认关闭, + //dialogLockScreen : false, // 设置弹出层对话框不锁屏，全局通用，默认为true + //dialogShowMask : false, // 设置弹出层对话框显示透明遮罩层，全局通用，默认为true + //dialogDraggable : false, // 设置弹出层对话框不可拖动，全局通用，默认为true + //dialogMaskOpacity : 0.4, // 设置透明遮罩层的透明度，全局通用，默认值为0.1 + //dialogMaskBgColor : "#000", // 设置透明遮罩层的背景颜色，全局通用，默认为#fff + imageUpload : true, + imageFormats : ["jpg", "jpeg", "gif", "png", "bmp", "webp"], + imageUploadURL : imageUrl, + onload : function() { + $("#" + id + " [type=\"latex\"]").bind("click", function () { + testEditor.cm.replaceSelection("```latex"); + testEditor.cm.replaceSelection("\n"); + testEditor.cm.replaceSelection("\n"); + testEditor.cm.replaceSelection("```"); + var __Cursor = testEditor.cm.getDoc().getCursor(); + testEditor.cm.setCursor(__Cursor.line - 1, 0); + }); + + $("#" + id + " [type=\"inline\"]").bind("click", function () { + testEditor.cm.replaceSelection("`$$$$`"); + var __Cursor = testEditor.cm.getDoc().getCursor(); + testEditor.cm.setCursor(__Cursor.line, __Cursor.ch - 3); + testEditor.cm.focus(); + }); + $("[type=\"inline\"]").attr("title", "行内公式"); + $("[type=\"latex\"]").attr("title", "多行公式"); + } + }); + + return testEditor; +} + +export default class MEditor extends React.Component { + + componentDidMount () { + // create_editorMD('editormd_area', '100%', 400, '', imageUrl); + initialEditorMd('editormd_area', '100%', 400, '', imageUrl); + } + render () { + return ( +
+ ) + } +} diff --git a/public/react/src/modules/developer/newOrEditTask/index.js b/public/react/src/modules/developer/newOrEditTask/index.js index 6d9a14663..3a2c11728 100644 --- a/public/react/src/modules/developer/newOrEditTask/index.js +++ b/public/react/src/modules/developer/newOrEditTask/index.js @@ -6,45 +6,37 @@ * @Last Modified time: 2019-11-19 23:23:41 */ import './index.scss'; -import React from 'react'; +import React, { useCallback, useEffect } from 'react'; import { connect } from 'react-redux'; import SplitPane from 'react-split-pane';// import { Form } from 'antd'; import { Button, Icon } from 'antd'; import { Link } from 'react-router-dom'; import LeftPane from './leftpane'; import RightPane from './rightpane/index'; +import actions from '../../../redux/actions'; -// class NewOrEditTask extends React.Component { -// render() { -// return ( -//
-//
-// -// 后退 -// -// 标题内容 -// -//
-//
-// -//
-// -//
-// -// -//
-// -// -//
-//
-// ) -// } -// } - -const NewOrEditTask = () => { +const NewOrEditTask = (props) => { // 表单提交 - const handleSubmitForm = () => {} + const handleSubmitForm = (code) => { + props.saveOjFormCode(code); // 保存代码块值 + props.handleFormSubmit(); // 提交表单 + }; + + useEffect(() => { + console.log('获取路由参数： ====', props.match.params); + const id = props.match.params.id; + // 保存OJForm的id号，指明是编辑还是新增 + props.saveOJFormId(id); + if (id) { // id号即 identifier + // TODO id 存在时, 编辑, 获取 store 中的记录数 + // props.getOJFormById(id); + } else { + // 清空store中的测试用例集合 + props.clearOJFormStore(); + } + }, []); + return (
@@ -57,12 +49,10 @@ const NewOrEditTask = () => {
- +
- +
@@ -75,7 +65,18 @@ const mapStateToProps = (state) => ({ }); -const mapDispatchToProps = (dispatch) => ({}); +const mapDispatchToProps = (dispatch) => ({ + // 保存提交的代码值 + saveOjFormCode: (value) => dispatch(actions.saveOjFormCode(value)), + // 表单提交时，调用表单验证功能 + handleFormSubmit: () => dispatch(actions.validateOjForm()), + // 根据id号获取表单信息 + getOJFormById: (id) => dispatch(actions.getOJFormById(id)), + // 保存 OJ form id值 + saveOJFormId: (id) => dispatch(actions.saveOJFormId(id)), + // 清空测试用例的集合 + clearOJFormStore: () => dispatch(actions.clearOJFormStore()), +}); export default connect( mapStateToProps, diff --git a/public/react/src/modules/developer/newOrEditTask/index.scss b/public/react/src/modules/developer/newOrEditTask/index.scss index 1d5c6e2a4..75646c4db 100644 --- a/public/react/src/modules/developer/newOrEditTask/index.scss +++ b/public/react/src/modules/developer/newOrEditTask/index.scss @@ -1,80 +1,2 @@ -.new_add_task_wrap{ - height: 100vh; - .task_header{ - display: flex; - align-items: center; - // justify-content: space-between; - height: 65px; - background:rgba(34,34,34,1); - padding:0 30px; +@import '../split_pane_resizer.scss'; - .header_btn, - .header_title{ - color: #fff; - } - .header_btn{ - width: 88px; - } - .header_title{ - flex: 1; - text-align: center; - } - } - .split-pane-area{ - position: relative; - height: calc(100% - 65px); - .left_pane, - .right_pane{ - height: 100%; - } - } -} -.Resizer { - background: #000; - opacity: 0.2; - z-index: 1; - -moz-box-sizing: border-box; - -webkit-box-sizing: border-box; - box-sizing: border-box; - -moz-background-clip: padding; - -webkit-background-clip: padding; - background-clip: padding-box; -} - -.Resizer:hover { - -webkit-transition: all 2s ease; - transition: all 2s ease; -} - -.Resizer.horizontal { - height: 11px; - margin: -5px 0; - border-top: 5px solid rgba(255, 255, 255, 0); - border-bottom: 5px solid rgba(255, 255, 255, 0); - cursor: row-resize; - width: 100%; -} - -.Resizer.horizontal:hover { - border-top: 5px solid rgba(0, 0, 0, 0.5); - border-bottom: 5px solid rgba(0, 0, 0, 0.5); -} - -.Resizer.vertical { - width: 11px; - margin: 0 -5px; - border-left: 5px solid rgba(255, 255, 255, 0); - border-right: 5px solid rgba(255, 255, 255, 0); - cursor: col-resize; -} - -.Resizer.vertical:hover { - border-left: 5px solid rgba(0, 0, 0, 0.5); - border-right: 5px solid rgba(0, 0, 0, 0.5); -} -.Resizer.disabled { - cursor: not-allowed; -} -.Resizer.disabled:hover { - border-color: transparent; -} diff --git a/public/react/src/modules/developer/newOrEditTask/leftpane/editorTab/AddTestDemo.js b/public/react/src/modules/developer/newOrEditTask/leftpane/editorTab/AddTestDemo.js new file mode 100644 index 000000000..8930bfc63 --- /dev/null +++ b/public/react/src/modules/developer/newOrEditTask/leftpane/editorTab/AddTestDemo.js @@ -0,0 +1,159 @@ +/* + * @Description: 添加测试用例 + * @Author: tangjiang + * @Github: + * @Date: 2019-11-21 09:19:38 + * @LastEditors: tangjiang + * @LastEditTime: 2019-11-22 19:45:48 + */ +import './index.scss'; +import React, { useEffect, useState } from 'react'; +import { Collapse, Icon, Input, Form, Button, Modal } from 'antd'; +import { connect } from 'react-redux'; +const { Panel } = Collapse; +const { TextArea } = Input; +const FormItem = Form.Item; +const AddTestDemo = (props) => { + const { + form: { getFieldDecorator }, + onSubmitTest, + onDeleteTest, + testCase, + key + } = props; + + const [isEditor, setIsEditor] = useState(false); + const [loading, setLoading] = useState(false); + // console.log('测试用例属性: ====>>>>', props); + // 删除操作 + const handleDeletePanel = (e) => { + e.stopPropagation(); + e.preventDefault(); + // console.log('点击的删除按钮') + Modal.confirm({ + title: '删除', + content: '确定要删除当前测试用例吗?', + okText: '确定', + cancelText: '取消', + onOk() { + console.log('确定删除'); + onDeleteTest(testCase); + } + }) + } + + // 右侧删除图标 + const genExtra = () => ( + + ) + + // 取消操作 + const handleReset = (e) => { + e.preventDefault(); + props.form.resetFields(); + } + + // 保存 + const handleSubmit = (e) => { + e.preventDefault(); + props.form.validateFields((err, values) => { + if (err) { + return; + } + console.log('提交表单: ', values); + onSubmitTest(values); + }); + } + // 编辑后保存 + const handleEditorOrSave = (e) => { + if (!isEditor) { + setIsEditor(true); + } else { + // TODO 调用修改测试用例接口 + setIsEditor(false); // 保存后 设置 false + setLoading(true); + } + } + + const renderSubmitBtn = () => { + const { identifier, testCase } = props; + // console.log('========', identifier); + // 1. 新增时，不显示按钮 + if (identifier) { + if (testCase.isAdd) { + return ( + + + + + ); + } else { + return ( + + + + ); + } + } + } + + // 指定文本框是否可编辑 + const isDisabled = (testCase) => { + return testCase.isAdd && !isEditor; + }; + + return ( + + +
+ + { + getFieldDecorator('input', { + rules: [ + { required: true, message: '输入值不能为空'} + ], + initialValue: testCase && testCase.input + })(