diff --git a/react-ui/src/components/DisabledInput/index.less b/react-ui/src/components/DisabledInput/index.less new file mode 100644 index 00000000..2eb28917 --- /dev/null +++ b/react-ui/src/components/DisabledInput/index.less @@ -0,0 +1,9 @@ +.disabled-input { + padding: 4px 11px; + color: rgba(0, 0, 0, 0.25); + font-size: @font-size-input; + background-color: rgba(0, 0, 0, 0.04); + border: 1px solid #d9d9d9; + border-radius: 6px; + cursor: not-allowed; +} diff --git a/react-ui/src/components/DisabledInput/index.tsx b/react-ui/src/components/DisabledInput/index.tsx new file mode 100644 index 00000000..a3c67b7d --- /dev/null +++ b/react-ui/src/components/DisabledInput/index.tsx @@ -0,0 +1,20 @@ +import { Typography } from 'antd'; +import styles from './index.less'; + +type DisabledInputProps = { + value?: any; + valuePropName?: string; +}; + +function DisabledInput({ value, valuePropName }: DisabledInputProps) { + const data = valuePropName ? value[valuePropName] : value; + return ( +
+ + {data} + +
+ ); +} + +export default DisabledInput; diff --git a/react-ui/src/pages/Experiment/components/AddExperimentModal/index.tsx b/react-ui/src/pages/Experiment/components/AddExperimentModal/index.tsx index 2b7e80c5..38a88b3a 100644 --- a/react-ui/src/pages/Experiment/components/AddExperimentModal/index.tsx +++ b/react-ui/src/pages/Experiment/components/AddExperimentModal/index.tsx @@ -41,7 +41,7 @@ export const getParamComponent = (paramType: number, isSensitive?: number): JSX. ); } if (isSensitive && Number(isSensitive) === 1) { - return ; + return ; } return ; }; diff --git a/react-ui/src/pages/Experiment/components/ExperimentInstance/index.less b/react-ui/src/pages/Experiment/components/ExperimentInstance/index.less index a5bc8eb3..3201581f 100644 --- a/react-ui/src/pages/Experiment/components/ExperimentInstance/index.less +++ b/react-ui/src/pages/Experiment/components/ExperimentInstance/index.less @@ -33,7 +33,7 @@ } .status { - width: 200px; + width: 160px; } .operation { @@ -54,7 +54,7 @@ .statusBox { display: flex; align-items: center; - width: 200px; + width: 160px; .statusIcon { visibility: visible; diff --git a/react-ui/src/pages/Experiment/components/ExperimentInstance/index.tsx b/react-ui/src/pages/Experiment/components/ExperimentInstance/index.tsx index 98817e9f..4d68d93c 100644 --- a/react-ui/src/pages/Experiment/components/ExperimentInstance/index.tsx +++ b/react-ui/src/pages/Experiment/components/ExperimentInstance/index.tsx @@ -161,6 +161,9 @@ function ExperimentInstanceComponent({ checkSingle(item.id)} + disabled={ + item.status === ExperimentStatus.Running || item.status === ExperimentStatus.Pending + } > { const newText = text && text.replace(/\s+/g, '').split(','); return (