Skip to content

V
VisualDL

PaddlePaddle / VisualDL
大约 1 年 前同步成功

通知 88
Star 4655
Fork 642
V
VisualDL
未验证 提交 acd6c6df 编写于 作者: R RotPublic 提交者： GitHub
浏览文件
操作

fasdeploy frontend (#1198) 

* end

* end2

* end3

* end4

* end5

* end6

* end7
Co-authored-by: Nchenjian <chenjian26@baidu.com>
上级 9583bf7c
展开全部 隐藏空白更改
内联 并排
Showing with 7581 addition and 160 deletion
frontend/packages/core/package.json
浏览文件 @ acd6c6df
......@@ -39,6 +39,18 @@
"dist"
],
"dependencies": {
"@antv/layout": "^0.3.7",
"@antv/x6": "^2.0.2",
"@antv/x6-plugin-clipboard": "^2.0.1",
"@antv/x6-plugin-dnd": "^2.0.2",
"@antv/x6-plugin-export": "^2.1.5",
"@antv/x6-plugin-history": "^2.1.1",
"@antv/x6-plugin-keyboard": "^2.1.2",
"@antv/x6-plugin-selection": "^2.1.3",
"@antv/x6-plugin-snapline": "^2.1.2",
"@antv/x6-plugin-stencil": "^2.0.1",
"@antv/x6-plugin-transform": "^2.0.1",
"@antv/x6-react-shape": "^2.0.0",
"@material-ui/core": "^4.12.4",
"@snowpack/plugin-sass": "^1.4.0",
"@tippyjs/react": "4.2.5",
......@@ -60,7 +72,6 @@
"i18next-browser-languagedetector": "6.1.2",
"i18next-fetch-backend": "3.0.0",
"jszip": "3.7.1",
"lodash": "4.17.21",
"mime-types": "2.1.32",
"moment": "2.29.1",
"nprogress": "0.2.0",
......@@ -127,6 +138,7 @@
"dotenv": "10.0.0",
"enhanced-resolve": "5.8.2",
"html-minifier": "4.0.0",
"lodash": "^4.17.21",
"snowpack": "3.8.8",
"snowpack-plugin-copy": "1.0.1",
"typescript": "4.4.2"
......
frontend/packages/core/public/locales/en/Fastdeploy.json 0 → 100644
浏览文件 @ acd6c6df
{
"Load-model": "Please select a model repository",
"Current-model": "Current model repository",
"ensemble-pipeline": "ensemble pipeline",
"variable": "variable",
"instance": "instance",
"Pre-trained": "Pre-trained model name",
"The-config": "The config file chosen as startup config will overwrite config.pbtxt, and a backup config.pbtxt will be created first, please check to confirm",
"Confirm": "Confirm to shutdown server",
"Confirm-delete-config": "Confirm to delete config file",
"Confirm-delete-resource": "Confirm to delete resource file",
"load-model-repository": "load model repository",
"ensemble-configuration": "ensemble configuration",
"launch-server": "launch server",
"cancel": "cancel",
"launch": "launch",
"set-as-launch-config": "set as start up config",
"update": "update",
"log": "log",
"metric": "metric",
"ok": "ok",
"model-repository": "model repository",
"open-client": "open client",
"shutdown": "shutdown",
"updates": "update",
"Load-model-repository": "Load model repository",
"Download-pre-trained-model": "Download pre-trained model",
"Model-configuration": "Model configuration",
"Ensemble-configuration": "Ensemble configuration",
"Launch-parameters-configuration": "Launch parameters configuration",
"Delete-config-file": "Delete config file",
"Delete-resource-file": "Delete resource file",
"Rename-resource-file": "Rename resource file",
"Shutdown-server": "Shutdown server",
"Update-configuration-successfully": "update configuration successfully",
"Launch-server-successfully": "Launch server successfully",
"Update-successfully": "Update log and metric for successfully",
"Shutdown-server-successfully": "Shutdown server successfully",
"Download-successfully": "Download pre-trained model successfully",
"Set-successfully": "Set as startup config file successfully",
"Rename-successfully": "Rename resource file successfully",
"Delete-config-successfully": "Delete config file successfully",
"Delete-resource-successfully": "Delete resource file successfully",
"Backup-config": "Backup config file is not permitted to modify, please re-select",
"Model-name": "Model name",
"Execution-metric": "Execution metric",
"inference-request-success": "inference request success",
"inference-request-failure": "inference request failure",
"inference-count": "inference count",
"inference-exec-count": "inference exec count",
"inference-request-duration": "inference request duration",
"inference-queue-duration": "inference queue duration",
"inference-comput-input-duration": "inference comput input duration",
"inference-compute-infer-duration": "inference compute infer duration",
"inference-compute-output-duration": "inference compute output duration",
"Delay-metric": "Delay metric",
"Device-name": "Device name",
"Performance-metric": "Performance metric",
"Memory": "Memory",
"utilization": "utilization",
"power-usage": "power usage",
"power-limit": "power limit",
"energy-consumption": "energy consumption",
"total": "total",
"used": "used",
"Model-metrics": "Model metrics",
"GPU-metrics": "GPU metrics"
}
frontend/packages/core/public/locales/zh/Fastdeploy.json 0 → 100644
浏览文件 @ acd6c6df
{
"Load-model": "请载入模型库",
"Current-model": "当前模型库",
"ensemble-pipeline": "ensemble模型结构",
"variable": "变量",
"instance": "实例",
"Pre-trained": "预训练模型名",
"The-config": "设为启动配置文件即会将当前文件作为config.pbtxt,并覆盖之前的config.pbtxt的内容,被覆盖前的config.pbtxt会自动进行备份,是否继续",
"Confirm": "请确认是否关闭所启动服务",
"Confirm-delete-config": "请确认是否删除配置文件",
"Confirm-delete-resource": "请确认是否删除资源文件",
"load-model-repository": "载入模型库",
"ensemble-configuration": "ensemble配置",
"launch-server": "启动服务",
"cancel": "取消",
"launch": "启动",
"set-as-launch-config": "设为启动配置文件",
"update": "更新",
"log": "日志",
"metric": "性能",
"ok": "确定",
"model-repository": "模型库配置",
"open-client": "打开客户端",
"shutdown": "关闭服务",
"updates": "更新数据",
"Load-model-repository": "载入模型库",
"Download-pre-trained-model": "预训练模型下载",
"Model-configuration": "配置模型",
"Ensemble-configuration": "配置ensemble",
"Launch-parameters-configuration": "配置启动参数",
"Delete-config-file": "删除配置文件",
"Delete-resource-file": "删除资源文件",
"Rename-resource-file": "重命名文件",
"Shutdown-server": "关闭服务",
"Update-configuration-successfully": "更新配置成功",
"Launch-server-successfully": "启动服务成功",
"Update-successfully": "更新日志和性能数据成功",
"Shutdown-server-successfully": "关闭服务成功",
"Download-successfully": "下载预训练模型成功",
"Set-successfully": "设为启动配置成功",
"Rename-successfully": "重命名资源文件成功",
"Delete-config-successfully": "删除配置文件成功",
"Delete-resource-successfully": "删除资源文件成功",
"Backup-config": "该文件为备份配置文件不允许修改，请重新选择",
"Model-name": "模型名称",
"Execution-metric": "执行统计",
"inference-request-success": "请求处理成功数",
"inference-request-failure": "请求处理失败数",
"inference-count": "推理batch数",
"inference-exec-count": "推理样本数",
"inference-request-duration": "请求处理时间",
"inference-queue-duration": "任务队列等待时间",
"inference-comput-input-duration": "输入处理时间",
"inference-compute-infer-duration": "模型推理时间",
"inference-compute-output-duration": "输出处理时间",
"Delay-metric": "延迟统计",
"Device-name": "GPU",
"Performance-metric": "性能指标",
"Memory": "显存",
"utilization": "利用率",
"power-usage": "功率",
"power-limit": "功率限制",
"energy-consumption": "耗电量",
"total": "总量",
"used": "已使用",
"Model-metrics": "模型服务监控",
"GPU-metrics": "GPU监控"
}
frontend/packages/core/snowpack.config.js
浏览文件 @ acd6c6df
......@@ -37,6 +37,8 @@ function isWorkspace() {
const iconsPath = path.dirname(resolve.sync(cwd, '@visualdl/icons'));
const netronPath = path.dirname(resolve.sync(cwd, '@visualdl/netron'));
const netronPath2 = path.dirname(resolve.sync(cwd, '@visualdl/netron2'));
// const netronPath3 = path.dirname(resolve.sync(cwd, '@visualdl/netron3'));
const TracePath = path.dirname(resolve.sync(cwd, './public/static'));
const wasmPath = path.dirname(resolve.sync(cwd, '@visualdl/wasm'));
const dest = path.resolve(cwd, './dist/__snowpack__/link/packages');
......@@ -102,6 +104,10 @@ export default {
source: [path.join(netronPath2, '**/*')],
destination: path.join(dest, 'netron2/dist')
},
// {
// source: [path.join(netronPath3, '**/*')],
// destination: path.join(dest, 'netron3/dist')
// },
{
source: [path.join(TracePath, '**/*')],
destination: path.join(dest, 'trace/dist')
......@@ -120,7 +126,7 @@ export default {
},
packageOptions: {
polyfillNode: true,
namedExports: ['gl-vec2', 'dagre'],
namedExports: [],
// knownEntrypoints: ['chai', '@testing-library/react', 'fetch-mock/esm/client']
knownEntrypoints: ['chai', '@testing-library/react']
},
......
frontend/packages/core/src/App.tsx
浏览文件 @ acd6c6df
......@@ -16,11 +16,11 @@
// cSpell:words pageview inited
import 'antd/dist/antd.css';
import React, {FunctionComponent, Suspense, useCallback, useEffect, useMemo, useState} from 'react';
import {Redirect, Route, BrowserRouter as Router, Switch, useLocation, useHistory} from 'react-router-dom';
import React, {FunctionComponent, Suspense, useCallback, useEffect, useMemo} from 'react';
import {Redirect, Route, BrowserRouter as Router, Switch, useLocation} from 'react-router-dom';
import {THEME, matchMedia} from '~/utils/theme';
import {actions, selectors} from '~/store';
import {headerHeight, position, size, zIndexes, setRem} from '~/utils/style';
import {headerHeight, position, size, zIndexes} from '~/utils/style';
import {useDispatch, useSelector} from 'react-redux';
import ErrorBoundary from '~/components/ErrorBoundary';
import ErrorPage from '~/pages/error';
......@@ -32,12 +32,19 @@ import {ToastContainer} from 'react-toastify';
import {fetcher} from '~/utils/fetch';
import routes from '~/routes';
import styled from 'styled-components';
import {setDefaults, useTranslation} from 'react-i18next';
import {useTranslation} from 'react-i18next';
const BASE_URI: string = import.meta.env.SNOWPACK_PUBLIC_BASE_URI;
const Main = styled.main`
padding-top: ${headerHeight};
.ant-select-selector {
.ant-select-selection-item {
.select_icon {
display: none;
}
}
}
`;
const Header = styled.header`
......@@ -74,10 +81,9 @@ const Telemetry: FunctionComponent = () => {
}, [location.pathname]);
return null;
};
const defaultRoute = '';
const App: FunctionComponent = () => {
const {t, i18n} = useTranslation('errors');
const [defaultRoute, setDefaultRoute] = useState('');
const dir = useMemo(() => (i18n.language ? i18n.dir(i18n.language) : ''), [i18n]);
const dispatch = useDispatch();
......
frontend/packages/core/src/components/BarsChart.tsx
浏览文件 @ acd6c6df
......@@ -14,9 +14,6 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import * as chart from '~/utils/chart';
import React, {useEffect, useImperativeHandle} from 'react';
import {primaryColor} from '~/utils/style';
import useECharts, {Options, Wrapper, useChartTheme} from '~/hooks/useECharts';
......@@ -219,6 +216,7 @@ const Charts = React.forwardRef<BarChartRef, BarsChartProps>(
});
echart?.setOption(chartOptions, {notMerge: true});
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [options, data, title, theme, i18n.language, echart, isLegend, units, text]);
return (
<Wrapper ref={wrapper} className={className}>
......
frontend/packages/core/src/components/Check.tsx
浏览文件 @ acd6c6df
/* eslint-disable react-hooks/exhaustive-deps */
/**
* Copyright 2020 Baidu Inc. All Rights Reserved.
*
......
frontend/packages/core/src/components/CurvesPage/CurveChart.tsx
浏览文件 @ acd6c6df
......@@ -23,7 +23,6 @@ import {rem, size} from '~/utils/style';
import Chart from '~/components/Chart';
import {Chart as ChartLoader} from '~/components/Loader/ChartPage';
import ChartToolbox from '~/components/ChartToolbox';
import type {EChartsOption} from 'echarts';
import TooltipTable from '~/components/TooltipTable';
import {cycleFetcher} from '~/utils/fetch';
import {format} from 'd3-format';
......
frontend/packages/core/src/components/DistributedChart.tsx
浏览文件 @ acd6c6df
......@@ -14,7 +14,7 @@
* limitations under the License.
*/
import * as chart from '~/utils/chart';
// import * as chart from '~/utils/chart';
import React, {useEffect, useCallback} from 'react';
import {primaryColor} from '~/utils/style';
......@@ -59,6 +59,7 @@ export type LineChartRef = {
const DistributedChart = React.forwardRef<LineChartRef, DistributedChartProps>(
({options, data, titles, loading, zoom, className, onInit}, ref) => {
console.log(ref);
const {t} = useTranslation(['profiler', 'common']);
const {i18n} = useTranslation();
......
frontend/packages/core/src/components/FastdeployGraph/CPUTables.tsx 0 → 100644
浏览文件 @ acd6c6df
import {Table} from 'antd';
import type {ColumnsType} from 'antd/es/table';
import React, {FunctionComponent, useEffect, useState} from 'react';
import {useTranslation} from 'react-i18next';
interface DataType {
key: string;
name: string;
money: string;
address: string;
}
type ArgumentProps = {
Datas: any;
};
const App: FunctionComponent<ArgumentProps> = ({Datas}) => {
const {t} = useTranslation(['Fastdeploy']);
const columns: ColumnsType<DataType> = [
{
title: t('Fastdeploy:Device-name'),
dataIndex: 'name',
key: 'name',
width: 100,
fixed: 'left'
},
{
title: t('Fastdeploy:Performance-metric'),
children: [
{
title: `${t('Fastdeploy:utilization')}(%)`,
dataIndex: 'nv_gpu_utilization',
key: 'nv_gpu_utilization',
width: 150
},
{
title: `${t('Fastdeploy:power-usage')}(W)`,
dataIndex: 'nv_gpu_power_usage',
key: 'nv_gpu_power_usage',
width: 150
},
{
title: `${t('Fastdeploy:power-limit')}(W)`,
dataIndex: 'nv_gpu_power_limit',
key: 'nv_gpu_power_limit',
width: 150
},
{
title: `${t('Fastdeploy:energy-consumption')}(W)`,
dataIndex: 'nv_energy_consumption',
key: 'nv_energy_consumption',
width: 150
}
]
},
{
title: t('Fastdeploy:Memory'),
children: [
{
title: `${t('Fastdeploy:total')}(GB)`,
dataIndex: 'nv_gpu_memory_total_bytes',
key: 'nv_gpu_memory_total_bytes',
width: 150
},
{
title: `${t('Fastdeploy:total')}(GB)`,
dataIndex: 'nv_gpu_memory_used_bytes',
key: 'nv_gpu_memory_used_bytes',
width: 150
}
]
}
];
const [tabelData, setTabelData] = useState<any>();
useEffect(() => {
if (!Datas) {
return;
}
const arrays = Object.keys(Datas);
const data = arrays.map((name: string) => {
const model = Datas[name];
return {
...model,
key: name,
name: name
};
});
setTabelData(data);
}, [Datas]);
return <Table columns={columns} dataSource={tabelData} bordered pagination={false} />;
};
export default App;
frontend/packages/core/src/components/FastdeployGraph/Clinet.tsx 0 → 100644
浏览文件 @ acd6c6df
import React, {FunctionComponent} from 'react';
import {useTranslation} from 'react-i18next';
const PUBLIC_PATH: string = import.meta.env.SNOWPACK_PUBLIC_PATH;
// type ArgumentProps = {
// };
console.log('PUBLIC_PATH', PUBLIC_PATH, PUBLIC_PATH + '/api/fastdeploy/fastdeploy_client');
const ServerBox: FunctionComponent = () => {
// const {t} = useTranslation(['Fastdeploy']);
const {i18n} = useTranslation(['Fastdeploy']);
const language: string = i18n.language;
return (
<div
style={{
width: '100%',
height: '100%'
}}
>
<iframe
style={{
width: '100%',
height: '100%'
}}
src={PUBLIC_PATH + `/api/fastdeploy/fastdeploy_client?lang=${language}`}
// src={'https://www.baidu.com/'}
frameBorder={0}
scrolling="true"
marginWidth={0}
marginHeight={0}
></iframe>
</div>
);
};
export default ServerBox;
frontend/packages/core/src/components/FastdeployGraph/ModelTables.tsx 0 → 100644
浏览文件 @ acd6c6df
import {Table} from 'antd';
import type {ColumnsType} from 'antd/es/table';
import React, {FunctionComponent, useEffect, useState} from 'react';
import {useTranslation} from 'react-i18next';
interface DataType {
key: string;
name: string;
money: string;
address: string;
}
type ArgumentProps = {
Datas: any;
};
const App: FunctionComponent<ArgumentProps> = ({Datas}) => {
const [tabelData, setTabelData] = useState<any>();
const {t} = useTranslation(['Fastdeploy']);
const columns: ColumnsType<DataType> = [
{
title: t('Fastdeploy:Model-name'),
dataIndex: 'name',
key: 'name',
width: 100,
fixed: 'left'
},
{
title: t('Fastdeploy:Execution-metric'),
children: [
{
title: t('Fastdeploy:inference-request-success'),
dataIndex: 'nv_inference_request_success',
key: 'nv_inference_request_success',
width: 150
},
{
title: t('Fastdeploy:inference-request-failure'),
dataIndex: 'nv_inference_request_failure',
key: 'nv_inference_request_failure',
width: 150
},
{
title: t('Fastdeploy:inference-count'),
dataIndex: 'nv_inference_count',
key: 'nv_inference_count',
width: 150
},
{
title: t('Fastdeploy:inference-exec-count'),
dataIndex: 'nv_inference_exec_count',
key: 'nv_inference_exec_count',
width: 150
}
]
},
{
title: t('Fastdeploy:Delay-metric'),
children: [
{
title: `${t('Fastdeploy:inference-request-duration')}(ms)`,
dataIndex: 'nv_inference_request_duration_us',
key: 'nv_inference_request_duration_us',
width: 150
},
{
title: `${t('Fastdeploy:inference-queue-duration')}(ms)`,
dataIndex: 'nv_inference_queue_duration_us',
key: 'nv_inference_queue_duration_us',
width: 150
},
{
title: `${t('Fastdeploy:inference-comput-input-duration')}(ms)`,
dataIndex: 'nv_inference_compute_input_duration_us',
key: 'nv_inference_compute_input_duration_us',
width: 150
},
{
title: `${t('Fastdeploy:inference-compute-infer-duration')}(ms)`,
dataIndex: 'nv_inference_compute_infer_duration_us',
key: 'nv_inference_compute_infer_duration_us',
width: 150
},
{
title: `${t('Fastdeploy:inference-compute-output-duration')}(ms)`,
dataIndex: 'nv_inference_compute_output_duration_us',
key: 'nv_inference_compute_output_duration_us',
width: 150
}
]
}
];
useEffect(() => {
if (!Datas) {
return;
}
const arrays = Object.keys(Datas);
const data = arrays.map((name: string) => {
const model = Datas[name];
return {
...model,
key: name,
name: name
};
});
setTabelData(data);
// for (let i = 0; i < 100; i++) {
// data.push({
// key: i,
// name: 'John Brown',
// age: i + 1,
// street: 'Lake Park',
// building: 'C',
// number: 2035,
// companyAddress: 'Lake Street 42',
// companyName: 'SoftLake Co',
// gender: 'M',
// });
}, [Datas]);
return <Table columns={columns} dataSource={tabelData} bordered pagination={false} />;
};
export default App;
frontend/packages/core/src/components/FastdeployGraph/serverBox.tsx 0 → 100644
浏览文件 @ acd6c6df
/* eslint-disable react-hooks/exhaustive-deps */
import React, {useEffect, useState, useRef, forwardRef, ForwardRefRenderFunction} from 'react';
import styled from 'styled-components';
import ModelTables from './ModelTables';
import CPUTables from './CPUTables';
import ServerConfig from './ServerConfig';
import {fetcher} from '~/utils/fetch';
import {rem} from '~/utils/style';
import {toast} from 'react-toastify';
import {useTranslation} from 'react-i18next';
// import type {left} from '@antv/x6/lib/registry/port-label-layout/side';
const TableTitle = styled.div`
margin-bottom: 20px;
margin-top: 20px;
font-size: 18px;
font-weight: 900;
`;
const Buttons = styled.div`
height: ${rem(36)};
line-height: ${rem(36)};
text-align: center;
font-size: 16px;
margin-left: 20px;
min-width: 100px;
width: auto;
border: 1px solid;
padding-left: 5px;
padding-right: 5px;
`;
const ButtonContent = styled.div`
display: flex;
justify-content: space-between;
padding-top: 20px;
padding-bottom: 20px;
`;
const ButtonLeft = styled.div`
display: flex;
justify-content: flex-end;
padding-top: 20px;
padding-bottom: 20px;
.backgrounds {
background-color: var(--navbar-background-color);
color: white;
border: none;
}
`;
const ButtonRight = styled.div`
display: flex;
justify-content: flex-end;
padding-top: 20px;
padding-bottom: 20px;
`;
type ArgumentProps = {
server_id: any;
Flag: number;
onEdit: () => any;
};
const PUBLIC_PATH: string = import.meta.env.SNOWPACK_PUBLIC_PATH;
// type ArgumentProps = {
// };
export type serverBoxRef = {
outDatas(type: number): void;
};
console.log('PUBLIC_PATH', PUBLIC_PATH, PUBLIC_PATH + '/api/fastdeploy/fastdeploy_client');
const ServerBox: ForwardRefRenderFunction<serverBoxRef, ArgumentProps> = ({Flag, server_id, onEdit}) => {
const [flag, setFlag] = useState(0);
const [Datas, setDatas] = useState<any>({
text: '',
lengths: 0,
metric: null
});
const [configs, setConfigs] = useState<any>();
const {i18n, t} = useTranslation(['Fastdeploy']);
// const {i18n} = useTranslation(['Fastdeploy']);
const language: string = i18n.language;
useEffect(() => {
if (Flag === undefined) {
return;
}
isAlive();
}, [Flag]);
// useEffect(() => {
// const timer = setInterval(() => {
// setCount(count + 1);
// }, 10000);
// console.log('更新了', timer);
// return () => clearInterval(timer);
// }, [count]);
// Datas.metric
const isAlive = () => {
const serverId = server_id;
// const length = Datas.text.length;
fetcher(`/fastdeploy/check_server_alive?server_id=${serverId}`, {
method: 'GET'
}).then(
(res: any) => {
// debugger;
console.log('check_server_alive', res);
outDatas();
},
res => {
console.log('error_check_server_alive', res);
}
);
};
const outDatas = () => {
const serverId = server_id;
const length = Datas.text.length;
fetcher(`/fastdeploy/get_server_output?server_id=${serverId}` + `&length=${length}`, {
method: 'GET'
}).then(
(res: any) => {
console.log('get_server_output', res);
metricDatas(serverId, res);
getServe(serverId);
},
res => {
console.log('get_server_output', res);
}
);
};
const clickOutDatas = () => {
const serverId = server_id;
const length = Datas.text.length;
fetcher(`/fastdeploy/get_server_output?server_id=${serverId}` + `&length=${length}`, {
method: 'GET'
}).then(
(res: any) => {
console.log('get_server_output', res);
metricDatas(serverId, res);
getServe(serverId);
const message =
language === 'zh'
? `${serverId} 更新日志和性能数据成功`
: `Update log and metric for ${serverId} successfully`;
toast.success(message, {
autoClose: 2000
});
},
res => {
console.log('get_server_output', res);
}
);
};
const metricDatas = async (serverId: number, texts: any) => {
await fetcher(`/fastdeploy/get_server_metric?server_id=${serverId}`, {
method: 'GET'
}).then(
(res: any) => {
console.log('get_server_metric', res);
setDatas({
...Datas,
text: Datas.text + texts,
lengths: Datas.text.length + texts.length,
metric: res
});
},
res => {
console.log('get_server_output', res);
}
);
};
const getServe = async (serverId: number) => {
await fetcher(`/fastdeploy/get_server_config?server_id=${serverId}`, {
method: 'GET'
}).then(
(res: any) => {
console.log('get_server_config', res);
setConfigs(res);
},
res => {
console.log('get_server_output', res);
}
);
};
const cbRef: any = useRef();
useEffect(() => {
cbRef.current = outDatas;
});
useEffect(() => {
const callback = () => {
cbRef.current?.();
};
const timer = setInterval(() => {
callback();
}, 10000);
return () => clearInterval(timer);
}, []);
// useImperativeHandle(ref, () => ({
// outData(serverId: number) {
// outDatas(serverId);
// }
// }));
return (
<div>
{flag === 0 ? (
<div
style={{
whiteSpace: 'pre-wrap',
background: 'black',
color: 'white',
padding: '20px',
height: '650px',
overflowY: 'auto'
}}
>
{Datas.text}
</div>
) : flag === 1 ? (
<div
style={{
whiteSpace: 'pre-wrap',
// background: 'black',
// color: 'white',
padding: '20px',
height: '650px',
overflowY: 'auto'
}}
>
<div>
<TableTitle>{t('Fastdeploy:Model-metrics')}</TableTitle>
<ModelTables Datas={Datas?.metric?.Model}></ModelTables>
</div>
<div>
<TableTitle>{t('Fastdeploy:GPU-metrics')}</TableTitle>
<CPUTables Datas={Datas?.metric?.GPU}></CPUTables>
</div>
</div>
) : (
<div
style={{
whiteSpace: 'pre-wrap',
// background: 'black',
// color: 'white',
padding: '20px',
height: '650px',
overflowY: 'auto'
}}
>
<ServerConfig serverId={server_id} modelData={configs}></ServerConfig>
</div>
)}
<ButtonContent>
<ButtonLeft>
<Buttons
className={flag === 0 ? 'backgrounds' : ''}
onClick={() => {
setFlag(0);
}}
>
{t('Fastdeploy:log')}
</Buttons>
<Buttons
className={flag === 1 ? 'backgrounds' : ''}
onClick={() => {
setFlag(1);
}}
>
{t('Fastdeploy:metric')}
</Buttons>
<Buttons
className={flag === 2 ? 'backgrounds' : ''}
onClick={() => {
setFlag(2);
}}
>
{t('Fastdeploy:model-repository')}
</Buttons>
</ButtonLeft>
<ButtonRight>
<Buttons
onClick={() => {
const url =
PUBLIC_PATH +
`/api/fastdeploy/fastdeploy_client?server_id=${server_id}` +
`&lang=${language}`;
window.open(url);
}}
>
{t('Fastdeploy:open-client')}
</Buttons>
<Buttons onClick={onEdit}>{t('Fastdeploy:shutdown')}</Buttons>
<Buttons
onClick={() => {
clickOutDatas();
}}
>
{t('Fastdeploy:updates')}
</Buttons>
</ButtonRight>
</ButtonContent>
</div>
);
};
export default forwardRef(ServerBox);
frontend/packages/core/src/components/GraphPage/GraphDynamic.tsx
浏览文件 @ acd6c6df
/* eslint-disable react-hooks/exhaustive-deps */
/**
* Copyright 2020 Baidu Inc. All Rights Reserved.
*
......
frontend/packages/core/src/components/GraphPage/GraphStatic.tsx
浏览文件 @ acd6c6df
......@@ -209,6 +209,7 @@ const Graph = React.forwardRef<GraphRef, GraphProps>(
}, [handler, dispatch]);
useEffect(() => {
console.log('GraphStaticss', files, ready);
(ready && dispatch('change-files', files)) || undefined;
}, [dispatch, files, ready]);
useEffect(
......
frontend/packages/core/src/components/GraphPage/GraphStatic2.tsx
浏览文件 @ acd6c6df
/* eslint-disable react-hooks/exhaustive-deps */
/**
* Copyright 2020 Baidu Inc. All Rights Reserved.
*
......@@ -26,6 +27,7 @@ import styled from 'styled-components';
import {toast} from 'react-toastify';
import useTheme from '~/hooks/useTheme';
import {useTranslation} from 'react-i18next';
console.log('netron2', netron2);
const PUBLIC_PATH: string = import.meta.env.SNOWPACK_PUBLIC_PATH;
......
frontend/packages/core/src/components/GraphPage/Uploader.tsx
浏览文件 @ acd6c6df
......@@ -120,12 +120,27 @@ const Uploader: FunctionComponent<UploaderProps> = ({onClickUpload, onDropFiles,
</DropZone>
<SupportTable>
{Xpaddlae ? (
<tbody>
<tr>
<td>{t('graph:supported-model')}</td>
<td>{t('graph:supported-model-list-xpaddle')}</td>
</tr>
</tbody>
// <tbody>
// <tr>
// <td>{t('graph:supported-model')}</td>
// <td>{t('graph:supported-model-list-xpaddle')}</td>
// </tr>
// </tbody>
<div
style={{
display: 'flex',
fontSize: '18px'
}}
>
<div
// style={{
// fontSize: '1.1428571428571428em'
// }}
>
{t('graph:supported-model')}
</div>
<div>{t('graph:supported-model-list-xpaddle')}</div>
</div>
) : (
<tbody>
<tr>
......
frontend/packages/core/src/components/LineChart.tsx
浏览文件 @ acd6c6df
......@@ -17,7 +17,7 @@
import * as chart from '~/utils/chart';
import React, {useEffect, useImperativeHandle, useState} from 'react';
import React, {useEffect, useImperativeHandle} from 'react';
import {WithStyled, primaryColor} from '~/utils/style';
import useECharts, {Options, Wrapper, useChartTheme} from '~/hooks/useECharts';
......
frontend/packages/core/src/components/ProfilerPage/MemoryView/MemoryView.tsx
浏览文件 @ acd6c6df
......@@ -28,8 +28,8 @@ import SearchInput from '~/components/searchInput2';
import GridLoader from 'react-spinners/GridLoader';
import {Wraper, Title, FullWidthSelect, Configure, EchartPie} from '../../components';
import type {devicesType, curveType, memory_events_type, Datum, op_memory_events_type, op_datum} from './type';
import {number} from 'echarts';
import NumberInput from '../NumberInput';
// import {number} from 'echarts';
// import NumberInput from '../NumberInput';
interface DataType {
key: React.Key;
MemoryType: string;
......@@ -178,6 +178,7 @@ const MemoryView: FunctionComponent<MemoryViewProps> = ({runs, workers, spans, u
const result = res as devicesType[];
const itemsLists = result.map(element => {
const regex1 = /\((.+?)\)/g;
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
const label: string = element.device.match(regex1)![0];
const labels = label.substring(1, label.length - 1);
return {label: labels, value: element.device};
......
frontend/packages/core/src/components/ProfilerPage/OperatorView/tools.tsx
浏览文件 @ acd6c6df
import type {ColumnsType} from 'antd/lib/table';
import React from 'react';
// import type {ColumnsType} from 'antd/lib/table';
// import React from 'react';
import type {EChartsOption} from 'echarts';
export const options: EChartsOption = {
grid: {
......
frontend/packages/core/src/components/ProfilerPage/overview/PerformanceContent.tsx
浏览文件 @ acd6c6df
......@@ -2,7 +2,7 @@
/* eslint-disable sort-imports */
import React, {Fragment, FunctionComponent} from 'react';
import {rem} from '~/utils/style';
import {useTranslation} from 'react-i18next';
// import {useTranslation} from 'react-i18next';
import styled from 'styled-components';
import BarsChart from '~/components/BarsChart';
import {Tabs} from 'antd';
......
frontend/packages/core/src/components/ProfilerPage/overview/overview.tsx
浏览文件 @ acd6c6df
......@@ -14,7 +14,7 @@
* limitations under the License.
*/
import React, {FunctionComponent, useCallback, useEffect, useMemo, useState} from 'react';
import React, {FunctionComponent, useCallback, useEffect, useState} from 'react';
import type {ColumnsType} from 'antd/lib/table';
import PieChart from '~/components/pieChart';
import StackColumnChart from '~/components/StackColumnChart';
......@@ -129,10 +129,10 @@ interface chartDataType {
gpu: cpuData[];
cpu: cpuData[];
}
type SelectListItem<T> = {
value: T;
label: string;
};
// type SelectListItem<T> = {
// value: T;
// label: string;
// };
const OverView: FunctionComponent<overViewProps> = ({runs, views, workers, spans, units, descriptions}) => {
const {t} = useTranslation(['profiler', 'common']);
......@@ -144,10 +144,10 @@ const OverView: FunctionComponent<overViewProps> = ({runs, views, workers, spans
const [isExpend, setIsExpend] = useState(false);
const [tableData, setTableData] = useState<tableType[] | Cpu[]>();
const [tableLoading, settableLoading] = useState(true);
const [stepsList, setStepsList] = useState<SelectListItem<string>[]>([
{label: 'cpu', value: 'cpu'},
{label: 'gpu', value: 'gpu'}
]);
// const [stepsList, setStepsList] = useState<SelectListItem<string>[]>([
// {label: 'cpu', value: 'cpu'},
// {label: 'gpu', value: 'gpu'}
// ]);
const [TrainType, setTrainType] = useState<string>('cpu');
const [PerformanceType, setPerformanceType] = useState<string>('cpu');
const [tableData2, setTableData2] = useState<Event[]>();
......
frontend/packages/core/src/components/ScalarChart.tsx
浏览文件 @ acd6c6df
......@@ -21,7 +21,7 @@ import {rem, size} from '~/utils/style';
import Chart from '~/components/Chart';
import ChartToolbox from '~/components/ChartToolbox';
import type {EChartsOption, LineSeriesOption} from 'echarts';
import type {EChartsOption} from 'echarts';
import TooltipTable from '~/components/TooltipTable';
import {format} from 'd3-format';
import {renderToStaticMarkup} from 'react-dom/server';
......
frontend/packages/core/src/components/StackColumnChart.tsx
浏览文件 @ acd6c6df
/* eslint-disable react-hooks/exhaustive-deps */
/**
* Copyright 2020 Baidu Inc. All Rights Reserved.
*
......
frontend/packages/core/src/pages/Fastdeploy.tsx 0 → 100644
浏览文件 @ acd6c6df
此差异已折叠。
frontend/packages/core/src/pages/FastdeployClient.tsx 0 → 100644
浏览文件 @ acd6c6df
此差异已折叠。
frontend/packages/core/src/utils/fetch.ts
浏览文件 @ acd6c6df
......@@ -89,6 +89,7 @@ export async function fetcher<T = unknown>(url: string, options?: RequestInit):
// res = await fetch('http://10.181.196.14:8040/app/api/deploy/convert?format=onnx', addApiToken(options));
res = await fetch(API_URL + url, addApiToken(options));
console.log('ressponse', res);
} catch (e) {
const t = await logErrorAndReturnT(e);
throw new Error(t('errors:network-error'));
......
frontend/packages/mock/data/component_tabs.js 0 → 100644
浏览文件 @ acd6c6df
此差异已折叠。
frontend/packages/mock/data/fastdeploy/config_update.js 0 → 100644
浏览文件 @ acd6c6df
此差异已折叠。
frontend/packages/mock/data/fastdeploy/get_config.js 0 → 100644
浏览文件 @ acd6c6df
此差异已折叠。
frontend/packages/mock/data/fastdeploy/get_directory.js 0 → 100644
浏览文件 @ acd6c6df
此差异已折叠。
frontend/packages/mock/data/fastdeploy/start_server.js 0 → 100644
浏览文件 @ acd6c6df
此差异已折叠。
frontend/packages/mock/data/fastdeploy/stop_server.js 0 → 100644
浏览文件 @ acd6c6df
此差异已折叠。
frontend/packages/mock/data/graph_runs.js
浏览文件 @ acd6c6df
......@@ -14,4 +14,4 @@
* limitations under the License.
*/
export default {status: 0, msg: '', data: ['test_add_graph/', 'test_add_graph/test1']};
export default {status: 0, msg: '', data: ['dynamic_graph', 'x2paddle', 'fastdeploy_server']};
frontend/packages/netron3/.browserslistrc 0 → 100644
浏览文件 @ acd6c6df
此差异已折叠。
frontend/packages/netron3/README.md 0 → 100644
浏览文件 @ acd6c6df
此差异已折叠。
frontend/packages/netron3/package.json 0 → 100644
浏览文件 @ acd6c6df
此差异已折叠。
frontend/packages/netron3/postcss.config.js 0 → 100644
浏览文件 @ acd6c6df
此差异已折叠。
frontend/packages/netron3/src/index.html 0 → 100644
浏览文件 @ acd6c6df
此差异已折叠。
frontend/packages/netron3/src/index.js 0 → 100644
浏览文件 @ acd6c6df
此差异已折叠。
frontend/packages/netron3/webpack.config.js 0 → 100644
浏览文件 @ acd6c6df
此差异已折叠。
frontend/yarn.lock
浏览文件 @ acd6c6df
此差异已折叠。
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或