+
启动时间：{momnet(experimentAllMessage.create_time).format('YYYY-MM-DD HH:mm:ss')}
+
执行时长：{experimentAllMessage.finish_time?timers(new Date(experimentAllMessage.finish_time).getTime()-new Date(experimentAllMessage.create_time).getTime()):timers(new Date().getTime()-new Date(experimentAllMessage.create_time).getTime())}
+
状态：
+
+
{statusObj[experimentAllMessage.status]}
diff --git a/react-ui/src/pages/Experiment/experimentText/props.jsx b/react-ui/src/pages/Experiment/experimentText/props.jsx
index 3bf1029b..2b2fec99 100644
--- a/react-ui/src/pages/Experiment/experimentText/props.jsx
+++ b/react-ui/src/pages/Experiment/experimentText/props.jsx
@@ -3,19 +3,48 @@ import { Button, Drawer,Form, Input ,Tabs } from 'antd';
import Styles from './editPipeline.less'
import{getQueryByExperimentLog}from '@/services/experiment/index.js'
import { ProfileOutlined, DatabaseOutlined} from '@ant-design/icons';
+import momnet from 'moment'
const { TextArea } = Input;
const Props = forwardRef(({onParentChange}, ref) =>{
const [form] = Form.useForm();
const [stagingItem,setStagingItem]=useState({})
const [messageItem,setMessageItem]=useState('')
-
+ const statusObj={
+ "Running":'运行中',
+ "Succeeded":'成功',
+ "Pending":'等待中',
+ "Failed":'失败',
+ "Error":'错误',
+ "Terminated":'终止',
+ "Skipped":'未执行',
+ "Omitted":'未执行',
+ }
+ const statusColorObj={
+ "Running":'#165bff',
+ "Succeeded":'#63a728',
+ "Pending":'#f981eb',
+ "Failed":'#c73131',
+ "Error":'#c73131',
+ "Terminated":'#8a8a8a',
+ "Skipped":'#8a8a8a',
+ "Omitted":'#8a8a8ae',
+ }
+ const timers=(time)=>{
+ let timer=new Date(time)
+ let hours = timer.getHours(); //转换成时
+ let minutes = timer.getMinutes(); //转换成分
+ let secend = timer.getSeconds(); //转换成秒
+
+ let str = `${minutes}分${secend}秒`;
+ return str;
+ }
const items = [
{
key: '1',
label: '日志详情',
children:
,
icon:
@@ -226,11 +255,6 @@ const Props = forwardRef(({onParentChange}, ref) =>{
form.resetFields();
form.setFieldsValue({...e.item.getModel(),in_parameters:JSON.parse(e.item.getModel().in_parameters),out_parameters:JSON.parse(e.item.getModel().out_parameters),control_strategy:JSON.parse(e.item.getModel().control_strategy)})
setStagingItem({...e.item.getModel(),in_parameters:JSON.parse(e.item.getModel().in_parameters),out_parameters:JSON.parse(e.item.getModel().out_parameters),control_strategy:JSON.parse(e.item.getModel().control_strategy)})
- // form.setFieldsValue({...e.item.getModel(),in_parameters:JSON.parse(e.item.getModel().in_parameters),out_parameters:JSON.parse(e.item.getModel().out_parameters)})
- // setStagingItem({...e.item.getModel(),in_parameters:JSON.parse(e.item.getModel().in_parameters),out_parameters:JSON.parse(e.item.getModel().out_parameters)})
- // setTimeout(() => {
- // console.log(stagingItem);
- // }, (500));
setOpen(true);
})
}
@@ -238,11 +262,6 @@ const Props = forwardRef(({onParentChange}, ref) =>{
form.resetFields();
form.setFieldsValue({...e.item.getModel(),in_parameters:JSON.parse(e.item.getModel().in_parameters),out_parameters:JSON.parse(e.item.getModel().out_parameters),control_strategy:JSON.parse(e.item.getModel().control_strategy)})
setStagingItem({...e.item.getModel(),in_parameters:JSON.parse(e.item.getModel().in_parameters),out_parameters:JSON.parse(e.item.getModel().out_parameters),control_strategy:JSON.parse(e.item.getModel().control_strategy)})
- // form.setFieldsValue({...e.item.getModel(),in_parameters:JSON.parse(e.item.getModel().in_parameters),out_parameters:JSON.parse(e.item.getModel().out_parameters)})
- // setStagingItem({...e.item.getModel(),in_parameters:JSON.parse(e.item.getModel().in_parameters),out_parameters:JSON.parse(e.item.getModel().out_parameters)})
- // setTimeout(() => {
- // console.log(stagingItem);
- // }, (500));
setOpen(true);
}
// console.log(e.item.getModel().in_parameters);
@@ -252,7 +271,18 @@ const Props = forwardRef(({onParentChange}, ref) =>{
}));
return (
<>
-
+
+ 任务名称：{stagingItem.label}
+ 执行状态：
+
+
{statusObj[stagingItem.experimentStatus]}启动时间：{momnet(stagingItem.experimentStartTime).format('YYYY-MM-DD HH:mm:ss')}
+ 耗时：{stagingItem.experimentEndTime?timers(new Date(stagingItem.experimentEndTime).getTime()-new Date(stagingItem.experimentStartTime).getTime()):timers(new Date().getTime()-new Date(stagingItem.experimentStartTime).getTime())}
diff --git a/react-ui/src/pages/Experiment/index.jsx b/react-ui/src/pages/Experiment/index.jsx
index 91aa7704..2fd83114 100644
--- a/react-ui/src/pages/Experiment/index.jsx
+++ b/react-ui/src/pages/Experiment/index.jsx
@@ -1,8 +1,8 @@
import React ,{ useState,useEffect,useRef }from 'react';
import { Space, Table, Tag,Button,Modal, Form, Input ,message, Select,} from 'antd';
-import { PlusOutlined, EditOutlined ,PlayCircleOutlined} from '@ant-design/icons';
-import {getWorkflow,addWorkflow,removeWorkflow,cloneWorkflow} from '@/services/pipeline/index.js'
-import {getExperiment,runExperiments,getExperimentById,postExperiment,putExperiment,getQueryByExperimentId} from '@/services/experiment/index.js'
+import { PlusOutlined, EditOutlined ,PlayCircleOutlined,DeleteOutlined,FieldTimeOutlined} from '@ant-design/icons';
+import {getWorkflow,} from '@/services/pipeline/index.js'
+import {getExperiment,runExperiments,getExperimentById,postExperiment,putExperiment,getQueryByExperimentId,deleteExperimentById,deleteQueryByExperimentInsId,putQueryByExperimentInsId} from '@/services/experiment/index.js'
import Styles from './index.less'
import { useNavigate} from 'react-router-dom';
import momnet from 'moment'
@@ -14,9 +14,31 @@ const Experiment = React.FC = () => {
const statusObj={
"Running":'运行中',
"Succeeded":'成功',
+ "Pending":'等待中',
"Failed":'失败',
"Error":'错误',
- "Teminated":'终止'
+ "Terminated":'终止',
+ "Skipped":'未执行',
+ "Omitted":'未执行',
+ }
+ const statusColorObj={
+ "Running":'#165bff',
+ "Succeeded":'#63a728',
+ "Pending":'#f981eb',
+ "Failed":'#c73131',
+ "Error":'#c73131',
+ "Terminated":'#8a8a8a',
+ "Skipped":'#8a8a8a',
+ "Omitted":'#8a8a8ae',
+ }
+ const statusImgObj={
+ 'Running':'/assets/images/running-icon.png',
+ 'Succeeded':'/assets/images/success-icon.png',
+ 'Pending':'/assets/images/pending-icon.png',
+ 'Failed':'/assets/images/fail-icon.png',
+ 'Terminated':'/assets/images/omitted-icon.png',
+ 'Skipped':'/assets/images/omitted-icon.png',
+ 'Omitted':'/assets/images/omitted-icon.png',
}
const [experimentList, setExperimentList] = useState([]);
@@ -56,10 +78,11 @@ const Experiment = React.FC = () => {
setExpandedRowKeys(val)
if(ret.code==200&&ret.data&&ret.data.length>0){
setExperimentInList(ret.data)
-
+ getList()
}
else{
setExperimentInList([])
+ getList()
}
})
}
@@ -157,7 +180,6 @@ const Experiment = React.FC = () => {
if(ret.code==200){
message.success('运行成功')
getQueryByExperiment(id)
- getList()
}
else{
message.error('运行失败')
@@ -227,8 +249,14 @@ const Experiment = React.FC = () => {
},
{
title: '最近五次运行状态',
- dataIndex: 'state',
- key: 'state',
+ dataIndex: 'status_list',
+ key: 'status_list',
+ render: (text) => {
+
+ let newText=text&&text.replace(/\s+/g,'').split(',')
+ console.log(newText);
+ return <>{ newText&&newText.length>0?newText.map((item,index)=>{console.log(item,statusImgObj[item]); return 
}):null}
+ }
},
{
@@ -258,7 +286,41 @@ const Experiment = React.FC = () => {
>
编辑
-
+ }
+ onClick={async () => {
+ Modal.confirm({
+ title: '删除',
+ content: '确定删除该条实验吗？',
+ okText: '确认',
+ cancelText: '取消',
+ onOk: () => {
+ console.log(record);
+ deleteExperimentById(record.id).then(ret=>{
+ if(ret.code==200){
+ message.success('删除成功')
+ getList()
+ }
+ else{
+ message.error(ret.msg)
+ }
+ });
+
+ // if (success) {
+ // if (actionRef.current) {
+ // actionRef.current.reload();
+ // }
+ // }
+ },
+ });
+ }}
+ >
+ 删除
+
),
},
@@ -278,14 +340,66 @@ const Experiment = React.FC = () => {
状态
运行时长
开始时间
+ 操作
:''}
{experimentInList&&experimentInList.length>0?experimentInList.map((item,index)=>(
routerToText(e,item,record)}>{index+1}
-
{statusObj[item.status]}
-
{item.finish_time?timers(new Date(item.finish_time).getTime()-new Date(item.start_time).getTime()):timers(new Date().getTime()-new Date(item.start_time).getTime())}
-
{momnet(item.start_time).format('YYYY-MM-DD HH:mm:ss')}
+
{statusObj[item.status]}
+
{item.finish_time?timers(new Date(item.finish_time).getTime()-new Date(item.create_time).getTime()):timers(new Date().getTime()-new Date(item.create_time).getTime())}
+
{momnet(item.create_time).format('YYYY-MM-DD HH:mm:ss')}
+
+ }
+ onClick={async () => {
+ putQueryByExperimentInsId(item.id).then(ret=>{
+ if(ret.code==200){
+ message.success('终止成功')
+ getQueryByExperiment(record.id)
+ }
+ else{
+ message.error(ret.msg)
+ }
+ })
+ }}
+ >
+ 终止
+
+ }
+ onClick={async () => {
+ Modal.confirm({
+ title: '删除',
+ content: '确定删除该条实例吗？',
+ okText: '确认',
+ cancelText: '取消',
+ onOk: () => {
+ deleteQueryByExperimentInsId(item.id).then(ret=>{
+ if(ret.code==200){
+ message.success('删除成功')
+ getQueryByExperiment(record.id)
+ }
+ else{
+ message.error(ret.msg)
+ }
+ });
+ },
+ });
+ }}
+ >
+ 删除
+
+
)):''}
diff --git a/react-ui/src/pages/Experiment/index.less b/react-ui/src/pages/Experiment/index.less
index 701c4cbd..b015521e 100644
--- a/react-ui/src/pages/Experiment/index.less
+++ b/react-ui/src/pages/Experiment/index.less
@@ -32,4 +32,16 @@
font-size:15px;
padding: 0 65px 0 40px;
+}
+.statusBox{
+ display: flex;
+ align-items: center;
+
+ .statusIcon{
+ visibility: hidden;
+ transition: all 0.2s;
+ }
+}
+.statusBox:hover .statusIcon{
+ visibility: visible;
}
\ No newline at end of file
diff --git a/react-ui/src/pages/Pipeline/editPipeline/index.jsx b/react-ui/src/pages/Pipeline/editPipeline/index.jsx
index 087f26af..c3f37b14 100644
--- a/react-ui/src/pages/Pipeline/editPipeline/index.jsx
+++ b/react-ui/src/pages/Pipeline/editPipeline/index.jsx
@@ -13,6 +13,7 @@ import { useNavigate} from 'react-router-dom';
const editPipeline = React.FC = () => {
const propsRef=useRef()
const navgite=useNavigate();
+ const [contextMenu,setContextMenu]=useState({})
const locationParams =useParams () //新版本获取路由参数接口
let graph=null
const pipelineContainer = useEmotionCss(() => {
@@ -30,6 +31,7 @@ const editPipeline = React.FC = () => {
};
});
const graphRef=useRef()
+
const onDragEnd=(val)=>{
console.log(val,'eee');
const _x = val.x
@@ -117,9 +119,49 @@ const editPipeline = React.FC = () => {
// graph.render()
})
}
+ const handlerContextMenu=(e)=> {
+ e.stopPropagation();
+ // this.menuType = e.item._cfg.type;
+ }
+ const initMenu=()=> {
+ // const selectedNodes = this.selectedNodes;
+ setContextMenu(new G6.Menu({
+ getContent(evt) {
+ console.log(11111, evt);
+
+ let ul = `