| @@ -35,4 +35,9 @@ | |||||
| } | } | ||||
| } | } | ||||
| } | } | ||||
| &__empty { | |||||
| margin-top: 10px; | |||||
| text-align: center; | |||||
| } | |||||
| } | } | ||||
| @@ -23,34 +23,38 @@ function ExperimentResult({ results }: ExperimentResultProps) { | |||||
| return ( | return ( | ||||
| <div className={styles['experiment-result']}> | <div className={styles['experiment-result']}> | ||||
| <div className={styles['experiment-result__content']}> | <div className={styles['experiment-result__content']}> | ||||
| {results?.map((item) => ( | |||||
| <div key={item.name} className={styles['experiment-result__item']}> | |||||
| <div className={styles['experiment-result__item__name']}> | |||||
| <span>{item.name}</span> | |||||
| <Button | |||||
| size="small" | |||||
| type="link" | |||||
| onClick={() => { | |||||
| exportResult(item.path); | |||||
| }} | |||||
| > | |||||
| 下载 | |||||
| </Button> | |||||
| {/* <a style={{ marginRight: '10px' }}>导出到模型库</a> | |||||
| {results && results.length > 0 ? ( | |||||
| results.map((item) => ( | |||||
| <div key={item.name} className={styles['experiment-result__item']}> | |||||
| <div className={styles['experiment-result__item__name']}> | |||||
| <span>{item.name}</span> | |||||
| <Button | |||||
| size="small" | |||||
| type="link" | |||||
| onClick={() => { | |||||
| exportResult(item.path); | |||||
| }} | |||||
| > | |||||
| 下载 | |||||
| </Button> | |||||
| {/* <a style={{ marginRight: '10px' }}>导出到模型库</a> | |||||
| <a style={{ marginRight: '10px' }}>导出到数据集</a> */} | <a style={{ marginRight: '10px' }}>导出到数据集</a> */} | ||||
| </div> | |||||
| <div style={{ margin: '15px 0' }} className={styles['experiment-result__item__file']}> | |||||
| <span>文件名称</span> | |||||
| <span>文件大小</span> | |||||
| </div> | |||||
| {item.value?.map((ele) => ( | |||||
| <div className={styles['experiment-result__item__file']} key={ele.name}> | |||||
| <span>{ele.name}</span> | |||||
| <span>{ele.size}</span> | |||||
| </div> | </div> | ||||
| ))} | |||||
| </div> | |||||
| ))} | |||||
| <div style={{ margin: '15px 0' }} className={styles['experiment-result__item__file']}> | |||||
| <span>文件名称</span> | |||||
| <span>文件大小</span> | |||||
| </div> | |||||
| {item.value?.map((ele) => ( | |||||
| <div className={styles['experiment-result__item__file']} key={ele.name}> | |||||
| <span>{ele.name}</span> | |||||
| <span>{ele.size}</span> | |||||
| </div> | |||||
| ))} | |||||
| </div> | |||||
| )) | |||||
| ) : ( | |||||
| <div className={styles['experiment-result__empty']}>暂无结果</div> | |||||
| )} | |||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| ); | ); | ||||
| @@ -22,6 +22,20 @@ type Log = { | |||||
| log_content: string; // 日志内容 | log_content: string; // 日志内容 | ||||
| }; | }; | ||||
| const scrollToBottom = (smooth: boolean = true) => { | |||||
| const element = document.getElementsByClassName('ant-tabs-content-holder')?.[0]; | |||||
| if (element) { | |||||
| if (smooth) { | |||||
| element.scrollTo({ | |||||
| top: element.scrollHeight, | |||||
| behavior: 'smooth', | |||||
| }); | |||||
| } else { | |||||
| element.scrollTo({ top: element.scrollHeight }); | |||||
| } | |||||
| } | |||||
| }; | |||||
| function LogGroup({ | function LogGroup({ | ||||
| log_type = 'normal', | log_type = 'normal', | ||||
| pod_name = '', | pod_name = '', | ||||
| @@ -34,6 +48,7 @@ function LogGroup({ | |||||
| const [completed, setCompleted] = useState(false); | const [completed, setCompleted] = useState(false); | ||||
| useEffect(() => { | useEffect(() => { | ||||
| scrollToBottom(false); | |||||
| if (status === ExperimentStatus.Running) { | if (status === ExperimentStatus.Running) { | ||||
| const timerId = setInterval(() => { | const timerId = setInterval(() => { | ||||
| requestExperimentPodsLog(); | requestExperimentPodsLog(); | ||||
| @@ -56,6 +71,9 @@ function LogGroup({ | |||||
| const { log_detail } = res.data; | const { log_detail } = res.data; | ||||
| if (log_detail && log_detail.log_content) { | if (log_detail && log_detail.log_content) { | ||||
| setLogList((oldList) => oldList.concat(log_detail)); | setLogList((oldList) => oldList.concat(log_detail)); | ||||
| setTimeout(() => { | |||||
| scrollToBottom(); | |||||
| }, 100); | |||||
| } else { | } else { | ||||
| setCompleted(true); | setCompleted(true); | ||||
| } | } | ||||
| @@ -96,7 +114,9 @@ function LogGroup({ | |||||
| {collapse ? <DownOutlined /> : <UpOutlined />} | {collapse ? <DownOutlined /> : <UpOutlined />} | ||||
| </div> | </div> | ||||
| )} | )} | ||||
| {showLog && <div className={styles['log-group__detail']}>{logText}</div>} | |||||
| {showLog && ( | |||||
| <div className={styles['log-group__detail']}>{logText ? logText : '暂无日志'}</div> | |||||
| )} | |||||
| <div className={styles['log-group__more-button']}> | <div className={styles['log-group__more-button']}> | ||||
| {showMoreBtn && ( | {showMoreBtn && ( | ||||
| <Button | <Button | ||||
| @@ -1,3 +1,13 @@ | |||||
| .log-list { | .log-list { | ||||
| padding: 8px; | padding: 8px; | ||||
| &__empty { | |||||
| padding: 15px; | |||||
| color: white; | |||||
| font-size: 14px; | |||||
| white-space: pre-line; | |||||
| text-align: center; | |||||
| word-break: break-all; | |||||
| background: #19253b; | |||||
| } | |||||
| } | } | ||||
| @@ -11,9 +11,11 @@ type LogListProps = { | |||||
| function LogList({ list = [], status }: LogListProps) { | function LogList({ list = [], status }: LogListProps) { | ||||
| return ( | return ( | ||||
| <div className={styles['log-list']}> | <div className={styles['log-list']}> | ||||
| {list.map((v) => ( | |||||
| <LogGroup key={v.pod_name} {...v} status={status} /> | |||||
| ))} | |||||
| {list.length > 0 ? ( | |||||
| list.map((v) => <LogGroup key={v.pod_name} {...v} status={status} />) | |||||
| ) : ( | |||||
| <div className={styles['log-list__empty']}>暂无日志</div> | |||||
| )} | |||||
| </div> | </div> | ||||
| ); | ); | ||||
| } | } | ||||
| @@ -109,7 +109,8 @@ const Props = forwardRef((_, ref) => { | |||||
| // 获取实验日志和实验结果 | // 获取实验日志和实验结果 | ||||
| setExperimentLogList([]); | setExperimentLogList([]); | ||||
| setExperimentResults([]); | setExperimentResults([]); | ||||
| if (e.item && e.item.getModel()) { | |||||
| // 如果已经运行到了 | |||||
| if (e.item?.getModel()?.component_id) { | |||||
| const model = e.item.getModel(); | const model = e.item.getModel(); | ||||
| const start_time = dayjs(model.experimentStartTime).valueOf() * 1.0e6; | const start_time = dayjs(model.experimentStartTime).valueOf() * 1.0e6; | ||||
| const params = { | const params = { | ||||