Home Explore Help
Register Sign In
chenguilong
/
aihub-web
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

Merge branch 'dev_20220524' of https://e.coding.yili.com/yldc/aiplatform/aihub-web into dev_20220524

* 'dev_20220524' of https://e.coding.yili.com/yldc/aiplatform/aihub-web:
  fix视频标注
  项目使用资源展示BUG修复
  项目使用资源展示BUG修复
  项目使用资源展示BUG修复
  项目使用资源展示BUG修复
zouzz 2 years ago
parent
c8e6f5af65 43521d0e41
commit
359b0b6054
18 changed files with 140 additions and 81 deletions
Split View Show Diff Stats
  1. 2 2
      ai-modules/labeling-tool-front/.env.development
  2. 2 2
      ai-modules/labeling-tool-front/.env.production
  3. 2 1
      ai-modules/labeling-tool-front/.eslintrc.js
  4. 16 16
      ai-modules/labeling-tool-front/prettier.config.js
  5. 0 0
      ai-modules/labeling-tool-front/public/asiainfo.ico
  6. 6 6
      ai-modules/labeling-tool-front/public/index.html
  7. 1 1
      ai-modules/labeling-tool-front/src/Page.tsx
  8. 1 1
      ai-modules/labeling-tool-front/src/components/login/LoginPage.tsx
  9. 1 1
      ai-modules/labeling-tool-front/src/modules/home/HeaderCustom.tsx
  10. 7 5
      ai-modules/labeling-tool-front/src/modules/jobs/JobsListPage.tsx
  11. 3 3
      ai-modules/labeling-tool-front/src/modules/jobs/utils.ts
  12. 32 14
      ai-modules/labeling-tool-front/src/modules/markTool/DataMarkPage.tsx
  13. 19 17
      ai-modules/labeling-tool-front/src/modules/markTool/styled.css
  14. 4 1
      ai-modules/labeling-tool-front/src/styles/global.ts
  15. 5 4
      src/module/homePage/components/resourceUsage/ItemCard.jsx
  16. 4 5
      src/module/homePage/components/resourceUsage/ResourceItem.jsx
  17. 33 0
      src/module/homePage/components/resourceUsage/ResourceUsageCards.jsx
  18. 2 2
      src/redux/services/homePage.js

+ 2 - 2
ai-modules/labeling-tool-front/.env.development
View File 

@@ -4,7 +4,7 @@ NODE_ENV=development
 
 _SETTING_API_BASE_PATH='aiSquare/openApi'
 
 #_SETTING_WEB_SERVICE_URL='http://192.168.2.176:8199'
 
 #标题
 
-#_SETTING_SYS_TITLE='科技联邦学习平台'
 
+#_SETTING_SYS_TITLE='亚信科技联邦学习平台'
 
 #是否开启mock数据 开启mock必须开启代理才有作用
 
 _SETTING_ENABLE_MOCK_API=false
 
 
@@ -15,7 +15,7 @@ _SETTING_ENABLE_PROXY_API=true
 
 _SETTING_SERVER_PROXY='http://10.19.85.81:32182'
 
 
 #_SETTING_WEB_SERVICE_URL='http://localhost:9090'
 
-_SETTING_WEB_SERVICE_URL='http://ai-test-dev.com'
 
+_SETTING_WEB_SERVICE_URL='http://ai-test-dev.asiainfo.com'
 
 #_SETTING_WEB_SERVICE_URL='http://10.1.251.213:32182'

+ 2 - 2
ai-modules/labeling-tool-front/.env.production
View File 

@@ -4,7 +4,7 @@ NODE_ENV=development
 
 _SETTING_API_BASE_PATH='aiSquare/openApi'
 
 #_SETTING_WEB_SERVICE_URL='http://192.168.2.176:8199'
 
 #标题
 
-#_SETTING_SYS_TITLE='科技联邦学习平台'
 
+#_SETTING_SYS_TITLE='亚信科技联邦学习平台'
 
 #是否开启mock数据 开启mock必须开启代理才有作用
 
 _SETTING_ENABLE_MOCK_API=false
 
 
@@ -31,4 +31,4 @@ _SETTING_SERVER_PROXY_UC='http://10.1.251.213:32182'
 
 #_SETTING_SERVER_PROXY_UC='http://10.19.85.81:32182'
 
 
 #联调环境
 
-_SETTING_SERVER_PROXY_TRAIN_TASK='http://10.1.251.213:32182'
 
+_SETTING_SERVER_PROXY_TRAIN_TASK='http://10.1.251.213:32182'

+ 2 - 1
ai-modules/labeling-tool-front/.eslintrc.js
View File 

@@ -101,7 +101,7 @@ module.exports = {
 
 
     'lines-between-class-members': [ERROR, 'always'],
 
     // indent: [ERROR, 2, { SwitchCase: 1 }],
 
-    'linebreak-style': [ERROR, 'unix'],
 
+    'linebreak-style': OFF,
 
     quotes: [ERROR, 'single'],
 
     'no-unused-expressions': OFF,
 
     'no-plusplus': OFF,
 
@@ -131,6 +131,7 @@ module.exports = {
 
       rules: {
 
         // use @typescript-eslint/no-shadow
 
         'no-shadow': [OFF],
 
+        'no-console': WARN,
 
       },
 
     },
 
   ],

+ 16 - 16
ai-modules/labeling-tool-front/prettier.config.js
View File 

@@ -1,17 +1,17 @@
 
 module.exports = {
 
-    printWidth: 120,
 
-    tabWidth: 2,
 
-    useTabs: false,
 
-    semi: true,
 
-    singleQuote: true,
 
-    quoteProps: 'as-needed',
 
-    jsxSingleQuote: false,
 
-    trailingComma: 'es5',
 
-    bracketSpacing: true,
 
-    jsxBracketSameLine: false,
 
-    arrowParens: 'always',
 
-    htmlWhitespaceSensitivity: 'ignore',
 
-    vueIndentScriptAndStyle: true,
 
-    endOfLine: 'auto',
 
-    eslintIntegration: false,
 
-};
 
+  printWidth: 120,
 
+  tabWidth: 2,
 
+  useTabs: false,
 
+  semi: true,
 
+  singleQuote: true,
 
+  quoteProps: 'as-needed',
 
+  jsxSingleQuote: false,
 
+  trailingComma: 'es5',
 
+  bracketSpacing: true,
 
+  jsxBracketSameLine: false,
 
+  arrowParens: 'always',
 
+  htmlWhitespaceSensitivity: 'ignore',
 
+  vueIndentScriptAndStyle: true,
 
+  endOfLine: 'auto',
 
+  eslintIntegration: false,
 
+};

+ 0 - 0
ai-modules/labeling-tool-front/public/ai.ico → ai-modules/labeling-tool-front/public/asiainfo.ico
View File


+ 6 - 6
ai-modules/labeling-tool-front/public/index.html
View File 

@@ -3,11 +3,11 @@
 
   <head>
 
     <meta charset="UTF-8" />
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
-        <link rel="shortcut icon" href="./ai.ico" type="image/x-icon" />
 
-        <title>欢迎使用</title>
 
-    </head>
 
+    <link rel="shortcut icon" href="./asiainfo.ico" type="image/x-icon" />
 
+    <title>欢迎使用</title>
 
+  </head>
 
 
-    <body>
 
-        <div id="root"></div>
 
-    </body>
 
+  <body>
 
+    <div id="root"></div>
 
+  </body>
 
 </html>

+ 1 - 1
ai-modules/labeling-tool-front/src/Page.tsx
View File 

@@ -14,7 +14,7 @@ type Iprops = {
 
 };
 
 
 const Page = ({ qiankun, parentState }: Iprops) => {
 
-  const serverUrl = get(parentState, 'parentData.serverUrl', null);
 
+  const serverUrl = get(parentState, 'parentData.serverUrl', 'http://ai-test-dev.asiainfo.com');
 
   localStorage.setItem('POWERED_BY_QIANKUN', qiankun);
 
   localStorage.setItem('serverUrl', serverUrl);
 
   return (

+ 1 - 1
ai-modules/labeling-tool-front/src/components/login/LoginPage.tsx
View File 

@@ -17,7 +17,7 @@ const LoginPage = () => {
 
           <div className="company-logo-container">
 
             <IconSvg type="icon-logo" size={16} marginRight={0} />
 
             <span style={{ color: '#ffffff', fontSize: '16px', padding: '0px 0px 0px 8px' }}>
 
-              {process.env._SETTING_SYS_TITLE ? process.env._SETTING_SYS_TITLE : '科技数据标注工具'}
 
+              {process.env._SETTING_SYS_TITLE ? process.env._SETTING_SYS_TITLE : '亚信科技数据标注工具'}
 
             </span>
 
           </div>
 
         </LoginLeftWrapper>

+ 1 - 1
ai-modules/labeling-tool-front/src/modules/home/HeaderCustom.tsx
View File 

@@ -43,7 +43,7 @@ const HeaderCustom = () => (
 
       <div className="logo__wrapper">
 
         <IconSvg type="icon-logo" size={16} marginRight={0} />
 
         <span style={{ color: '#ffffff', fontSize: '16px', padding: '0px 0px 0px 8px' }}>
 
-          {process.env._SETTING_SYS_TITLE ? process.env._SETTING_SYS_TITLE : '科技数据标注工具'}
 
+          {process.env._SETTING_SYS_TITLE ? process.env._SETTING_SYS_TITLE : '亚信科技数据标注工具'}
 
         </span>
 
       </div>
 
       <div className="header-menu__container">

+ 7 - 5
ai-modules/labeling-tool-front/src/modules/jobs/JobsListPage.tsx
View File 

@@ -275,15 +275,15 @@ const JobsListPage = () => {
 
   const [denominatorIntelligence, setDenominatorIntelligence]: any = useState(); //智能标注分母
 
 
   useEffect(() => {
 
-    fetchData(params);
 
+    fetchData();
 
     // 获取查看修改数据;
 
     getTaskInfoById(taskId).then((response) => {
 
       setTaskInfo(response.data);
 
     });
 
   }, []);
 
 
-  const fetchData = (params: object) => {
 
-    getJobsList(params, taskId).then((response) => {
 
+  const fetchData = (curParams: any = params) => {
 
+    getJobsList(curParams, taskId).then((response) => {
 
       setJobData(response.data);
 
       setTotal(response.pagination.total);
 
 
@@ -405,13 +405,15 @@ const JobsListPage = () => {
 
       <ModalView
 
         title={`标注作业：[${jobName}]`}
 
         okText="保存"
 
-        centered
 
         visible={customVisible}
 
         onOk={() => setCustomVisible(false)}
 
         onCancel={() => {
 
           setCustomVisible(false);
 
+          fetchData();
 
         }}
 
-        width={document.documentElement.clientWidth}
 
+        bodyStyle={{ paddingBottom: 0 }}
 
+        width="100vw"
 
+        style={{ height: '100vh', top: 0, overflow: 'hidden' }}
 
         comp={<DataMarkPage taskId={taskId} jobId={jobId} action={actionType} />}
 
       />
 
       <TitlePanel>

+ 3 - 3
ai-modules/labeling-tool-front/src/modules/jobs/utils.ts
View File 

@@ -7,14 +7,14 @@
 
 // 发布失败: 查看 发布 删除 11
 
 
 export const getOptFqPermissions = (annotationBy: any, progressArr: any, status: any, userId: any, jobType: any) => ({
 
-  view: [2].includes(status) && [1, 2, 3].includes(jobType),
 
-  tagging: [1].includes(status) && [annotationBy].includes(userId) && [1, 2, 3].includes(jobType),
 
+  view: [2].includes(status) && [1, 2, 3, 4].includes(jobType),
 
+  tagging: [1].includes(status) && [annotationBy].includes(userId) && [1, 2, 3, 4].includes(jobType),
 
   // tagging: [1].includes(status),
 
   release:
 
     [1].includes(status) &&
 
     progressArr[0] == progressArr[1] &&
 
     [annotationBy].includes(userId) &&
 
-    [1, 2, 3].includes(jobType),
 
+    [1, 2, 3, 4].includes(jobType),
 
   // release: progressArr[0] == progressArr[1] && [1].includes(status),
 
   execution: [4].includes(jobType) && [2].includes(status),
 
 });

+ 32 - 14
ai-modules/labeling-tool-front/src/modules/markTool/DataMarkPage.tsx
View File 

@@ -33,25 +33,12 @@ const DataSetListPage: FC<IProps> = ({ taskId, jobId, action }: IProps) => {
 
   const operationSelectedDatas = async (data: any, type: string) => {
 
     if (type === 'add' && data) {
 
       let dataInfo = data;
 
-      let str = { 1: 'text', 2: 'image', 3: 'audio', 4: 'image' };
 
       const res = await getDataInfoById(taskId, jobId, data.id);
 
       dataInfo.id = data.id;
 
       dataInfo.annotationDesc = get(res.data, 'annotationDesc');
 
       dataInfo.config = get(res.data, 'template.config');
 
       dataInfo.task = {
 
-        // data: {
 
-        //   image:
 
-        //     'https://htx-misc.s3.amazonaws.com/opensource/label-studio/examples/images/nick-owuor-astro-nic-visuals-wDifg5xc9Z4-unsplash.jpg',
 
-        // },
 
-        // predictions: get(tasks, 'predictions'),
 
-        // completions: get(tasks, 'completions'),
 
-        data: {
 
-          [get(res.data, 'annotationObject') === 2 && get(res.data, 'annotationTitle') === 'OCR识别'
 
-            ? 'ocr'
 
-            : str[get(res.data, 'annotationObject', 3)]]:
 
-            `${localStorage.getItem('serverUrl')}/${BASE_CONSTS._SETTING_API_BASE_PATH}/labeling` +
 
-            get(res.data, 'data'),
 
-        },
 
+        data: formatTaskData(res.data),
 
         annotations: get(res.data, 'annotations'),
 
         predictions: get(res.data, 'predictions'),
 
       };
 
@@ -160,6 +147,37 @@ const DataSetListPage: FC<IProps> = ({ taskId, jobId, action }: IProps) => {
 
     });
 
   };
 
 
+  const formatTaskData = (data) => {
 
+    let annotationObject = get(data, 'annotationObject', 3);
 
+    let annotationTitle = get(data, 'annotationTitle', 3);
 
+    let dataText = get(data, 'data');
 
+    let str = { 1: 'text', 2: 'image', 3: 'audio', 4: 'video' };
 
+    let dataKey = str[annotationObject];
 
+    switch (annotationTitle) {
 
+      case 'OCR识别':
 
+        dataKey = 'ocr';
 
+        break;
 
+      case '机器翻译':
 
+        dataKey = dataText.match(/toName=\"(.*?)\"/g)[0]?.replace(/toName=|"/g, '') ?? 'english';
 
+        break;
 
+    }
 
+    let dataValue = dataText;
 
+    switch (annotationObject) {
 
+      case 2:
 
+      case 3:
 
+        dataValue = `${localStorage.getItem('serverUrl')}/${BASE_CONSTS._SETTING_API_BASE_PATH}/labeling${dataText}`;
 
+        break;
 
+      case 4:
 
+        dataValue = `<video src="${localStorage.getItem('serverUrl')}/${
 
+          BASE_CONSTS._SETTING_API_BASE_PATH
 
+        }/labeling${dataText}" width=100% controls>`;
 
+        break;
 
+      default:
 
+        dataValue = dataText;
 
+    }
 
+    return { [dataKey]: dataValue };
 
+  };
 
+
 
   return (
 
     <div className="label_div" style={{ height: document.documentElement.clientHeight }}>
 
       <LeftDataPage

+ 19 - 17
ai-modules/labeling-tool-front/src/modules/markTool/styled.css
View File 

@@ -3,15 +3,16 @@
 
 }
 
 .label_data_page {
 
   margin-top: 5px;
 
-  &:hover {
 
-    color: rgb(24, 144, 255);
 
-    cursor: pointer;
 
-  }
 
-  &.active {
 
-    color: rgb(24, 144, 255);
 
-    box-shadow: 0px 0px 10px #7e7e7e;
 
-    cursor: pointer;
 
-  }
 
+}
 
+
 
+.label_data_page:hover {
 
+  color: rgb(24, 144, 255);
 
+  cursor: pointer;
 
+}
 
+.label_data_page.active {
 
+  color: rgb(24, 144, 255);
 
+  box-shadow: 0px 0px 10px #7e7e7e;
 
+  cursor: pointer;
 
 }
 
 .rhap_additional-controls {
 
   display: none;
 
@@ -22,14 +23,15 @@
 
 .rhap_forward-button {
 
   display: none;
 
 }
 
+
 
 .lab_div {
 
-  height: 600px;
 
   overflow-x: auto;
 
-  .ant-spin-nested-loading > div > .ant-spin .ant-spin-dot {
 
-    position: absolute;
 
-    top: 50%;
 
-    left: 50%;
 
-    margin: -10 px;
 
-    display: none;
 
-  }
 
+}
 
+
 
+.lab_div .ant-spin-nested-loading > div > .ant-spin .ant-spin-dot {
 
+  position: absolute;
 
+  top: 50%;
 
+  left: 50%;
 
+  margin: -10 px;
 
+  display: none;
 
 }

+ 4 - 1
ai-modules/labeling-tool-front/src/styles/global.ts
View File 

@@ -129,6 +129,9 @@ export const GlobalStyle = createGlobalStyle`
 
     display:flex;
 
     flex-grow: 1;
 
   }
 
+  .ant-modal{
 
+    max-width: 100vw !important;
 
+  }
 
   .ant-row {
 
       line-height: 55px;
 
   }
 
@@ -190,7 +193,7 @@ export const GlobalStyle = createGlobalStyle`
 
 `;
 
 /** 颜色常量 */
 
 const colorMap = {
 
-  main: '#147BD1', // 主色 蓝
 
+  main: '#147BD1', // 主色 亚信蓝
 
 
   // 状态色
 
   success: '#6dc41f', // 成功色

+ 5 - 4
src/module/homePage/components/resourceUsage/ItemCard.jsx
View File 

@@ -35,10 +35,11 @@ const CardWrapper = styled.div`
 
 `;
 
 
 let resources = [
 
-  { title: 'CPU (core）', used: 'cpuUsable', total: 'cpu' },
 
-  { title: '内存 (GB）', used: 'memUsable', total: 'mem' },
 
-  // { title: '存储 (GB）', key: 'storage' },
 
-  { title: 'GPU (卡）', used: 'gpuUsable', total: 'gpu' },
 
+  { title: 'CPU (core）', used: 'cpuUsed', total: 'cpu' },
 
+  { title: '内存 (GB）', used: 'memUsed', total: 'mem' },
 
+  // { title: 'GPU专用 (卡）', used: 'gpuUsed', total: 'gpu' },
 
+  // { title: 'GPU共享 (GB）', used: 'gpuMemUsed', total: 'gpuMem' },
 
+  { title: 'GPU (卡）', used: 'gpuUsed', total: 'gpu' },
 
 ];
 
 
 const ItemCard = ({ title, dataSource }) => (

+ 4 - 5
src/module/homePage/components/resourceUsage/ResourceItem.jsx
View File 

@@ -26,19 +26,18 @@ const ItemWrapper = styled.div`
 
 `;
 
 
 const ResourceItem = ({ item, dataSource }) => {
 
-  let useableResource = _.get(dataSource, item.used, 0) || 0;
 
+  let usedResource = _.get(dataSource, item.used, 0) || 0;
 
   let totalResource = _.get(dataSource, item.total, 0) || 0;
 
-  let usageResource = totalResource - useableResource;
 
   let usageRate =
 
-    isNaN(usageResource) || isNaN(totalResource) || totalResource === 0
 
+    isNaN(usedResource) || isNaN(totalResource) || totalResource === 0
 
       ? 0
 
-      : Math.round((usageResource / totalResource) * 100);
 
+      : Math.round((usedResource / totalResource) * 100);
 
   return (
 
     <ItemWrapper>
 
       <div className="item-top">
 
         <div className="item-left">{item.title}</div>
 
         <div className="item-right">
 
-          <span className="item-used">{usageResource ? parseFloat(usageResource.toFixed(2)) : usageResource}</span>
 
+          <span className="item-used">{usedResource ? _.round(usedResource, 2) : usedResource}</span>
 
           <span className="item-total">/{totalResource}</span>
 
         </div>
 
       </div>

+ 33 - 0
src/module/homePage/components/resourceUsage/ResourceUsageCards.jsx
View File 

@@ -1,6 +1,7 @@
 
 /** 项目使用情况列表card */
 
 import React from 'react';
 
 import { Radio } from 'antd';
 
+import { get } from 'lodash';
 
 import styled from 'styled-components';
 
 import { PropTypes } from 'prop-types';
 
 import ItemCard from './ItemCard';
 
@@ -37,16 +38,48 @@ class ResourceUsageCards extends React.PureComponent {
 
   fetchData = (checkedValue = this.state.checkedValue) => {
 
     getProjectResUsage(this.props.projectId).then(res => {
 
       let resourcesRate = _.get(res, 'data', []);
 
+      resourcesRate = this.formatUsRate(resourcesRate);
 
       let resourcesRateMap = _.groupBy(resourcesRate, 'profile');
 
       this.setState({ resourcesRateMap, resourcesRate: _.get(resourcesRateMap, `${checkedValue}[0]`, {}) });
 
     });
 
     getProjectResAssign(this.props.projectId).then(res => {
 
       let resourcesAssign = _.get(res, 'data', []);
 
+      resourcesAssign = this.formatAssignData(resourcesAssign);
 
       let resourcesAssignMap = _.groupBy(resourcesAssign, 'profile');
 
       this.setState({ resourcesAssignMap, resourcesAssign: _.get(resourcesAssignMap, `${checkedValue}[0]`, {}) });
 
     });
 
   };
 
 
+  formatUsRate = data => {
 
+    if (!Array.isArray(data)) return [];
 
+    return data.map(item => ({
 
+      profile: item.profile,
 
+      cpu: get(item, 'cpu', 0),
 
+      mem: get(item, 'mem', 0),
 
+      gpu: get(item, 'gpu', 0),
 
+      gpuMem: get(item, 'gpuMem', 0),
 
+      cpuUsed: Math.max(Number(get(item, 'cpu', 0)) - Number(get(item, 'cpuUsable', 0)), 0),
 
+      memUsed: Math.max(Number(get(item, 'mem', 0)) - Number(get(item, 'memUsable', 0)), 0),
 
+      gpuUsed: Math.max(Number(get(item, 'gpu', 0)) - Number(get(item, 'gpuUsable', 0)), 0),
 
+      gpuMemUsed: Math.max(Number(get(item, 'gpuMem', 0)) - Number(get(item, 'gpuMemUsable', 0)), 0),
 
+    }));
 
+  };
 
+
 
+  formatAssignData = data => {
 
+    if (!Array.isArray(data)) return [];
 
+    return data.map(item => ({
 
+      profile: item.profile,
 
+      cpu: get(item, 'totalResource.cpu', 0),
 
+      mem: get(item, 'totalResource.memory', 0),
 
+      gpu: get(item, 'totalResource.gpu', 0),
 
+      gpuMem: get(item, 'totalResource.gpuMem', 0),
 
+      cpuUsed: get(item, 'assignedResource.cpu', 0),
 
+      memUsed: get(item, 'assignedResource.memory', 0),
 
+      gpuUsed: get(item, 'assignedResource.gpu', 0),
 
+      gpuMemUsed: get(item, 'assignedResource.gpuMem', 0),
 
+    }));
 
+  };
 
+
 
   handleEnvChange = e => {
 
     let checkedValue = e.target.value;
 
     let { resourcesRateMap, resourcesAssignMap } = this.state;

+ 2 - 2
src/redux/services/homePage.js
View File 

@@ -26,7 +26,7 @@ const getProjectOverview = projectId =>
 
 const getProjectResAssign = projectId =>
 
   request({
 
     basePath: ServicePath.MC_SERVICE,
 
-    url: `/projects/${projectId}/stats/res-usage-overview`,
 
+    url: `/projects/${projectId}/stats/res-assign-overview`,
 
     method: 'get',
 
   });
 
 
@@ -34,7 +34,7 @@ const getProjectResAssign = projectId =>
 
 const getProjectResUsage = projectId =>
 
   request({
 
     basePath: ServicePath.MC_SERVICE,
 
-    url: `/projects/${projectId}/stats/res-assign-overview`,
 
+    url: `/projects/${projectId}/stats/res-usage-overview`,
 
     method: 'get',
 
   });