Skip to content

B
bkunyun
Commit 4a4e2d07 authored by chenshouchao's avatar chenshouchao
Browse files
Options

Merge branch 'feat-20220801' into 'staging' 

cn-Feat 20220801

See merge request !89
parents ccb10292 c01e4fb8
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1441 additions and 826 deletions
src/api/api_manager.ts
View file @ 4a4e2d07
......@@ -2,7 +2,7 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-06-13 09:56:57
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-15 17:10:49
* @LastEditTime: 2022-09-01 15:30:28
* @FilePath: /bkunyun/src/api/api_manager.ts
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -45,6 +45,9 @@ const RESTAPI = {
API_TASK_OVERVIEW_LIST:`${BACKEND_API_URI_PREFIX}/cpp/workflowJobInformation`, // 查询任务概览
API_OPERATOR_LISTSTREAMACTORS:`${BACKEND_API_URI_PREFIX}/cpp/workflow/liststreamactors`, // 获取流算子列表，可用于模糊查询，返回所有版本流算子
API_SAVE_BATCHACTOR:`${BACKEND_API_URI_PREFIX}/cpp/workflow/savebatchactor`, // 保存批算子
API_PROJECT_USERS_LIST:`${BACKEND_API_URI_PREFIX}/cpp/project/listusers`, // 获取项目成员
API_ADD_PROJECT_USER:`${BACKEND_API_URI_PREFIX}/cpp/project/updatemember`, // 添加项目成员
API_GET_PROJECT_POWER:`${BACKEND_API_URI_PREFIX}/cpp/project/listroles`, // 获取项目权限
};
export default RESTAPI;
src/api/api_prefix.ts
View file @ 4a4e2d07
/*
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-05-31 10:17:48
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-07-18 15:44:35
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-30 16:22:15
* @FilePath: /bkunyun/src/api/api_prefix.ts
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -36,7 +36,7 @@ switch (process.env.REACT_APP_ENV) {
BACKEND_API_URI_PREFIX = "https://www.cloudam.cn";
}
else {
BACKEND_API_URI_PREFIX = "http://47.57.4.97";
BACKEND_API_URI_PREFIX = "http://47.75.104.171";
}
break;
}
......
src/api/project_api.ts
View file @ 4a4e2d07
......@@ -318,6 +318,34 @@ const saveBatchActor = (params: saveBatchParams) => {
});
};
// 获取项目成员
const fetchProjectUsersList = (params: {id: string}) => {
return request({
url: Api.API_PROJECT_USERS_LIST,
method: "get",
params,
});
};
// 修改项目成员信息
const addProjectUser = (id: string, params: any) => {
return request({
url: `${Api.API_ADD_PROJECT_USER}?id=${id}`,
method: "put",
data: params,
});
};
// 获取项目权限
const fetchProjectPower = (params: {id: string}) => {
return request({
url: Api.API_GET_PROJECT_POWER,
method: "get",
params,
});
};
export {
current,
menu,
......@@ -342,5 +370,8 @@ export {
getTaskOverview,
getOperatorList,
saveBatchActor,
fetchFlowOutputNumber
fetchFlowOutputNumber,
fetchProjectUsersList,
addProjectUser,
fetchProjectPower
};
src/assets/project/goback.svg 0 → 100644
View file @ 4a4e2d07
<?xml version="1.0" encoding="UTF-8"?>
<svg width="22px" height="22px" viewBox="0 0 22 22" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>编组</title>
<g id="上线UI" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="点击算子" transform="translate(-24.000000, -133.000000)">
<g id="编组-12" transform="translate(24.000000, 133.000000)">
<g id="编组-16" transform="translate(11.000000, 11.000000) scale(-1, 1) rotate(-90.000000) translate(-11.000000, -11.000000) ">
<rect id="矩形" x="0" y="0" width="22" height="22"></rect>
<g id="编组-14" transform="translate(5.500000, 8.250000)" stroke="#8A9099" stroke-linejoin="round" stroke-width="2">
<polyline id="路径-7备份" transform="translate(5.500000, 2.750000) scale(1, -1) translate(-5.500000, -2.750000) " points="0 5.5 5.5 2.98949133e-16 11 5.5"></polyline>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
src/assets/project/refresh.svg 0 → 100644
View file @ 4a4e2d07
<?xml version="1.0" encoding="UTF-8"?>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>刷新备份</title>
<g id="上线UI" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="刷新备份">
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<path d="M14.1034483,5.0750097 L12.3103448,6.87501758 C11.862069,4.9250128 10.0689767,3.42499873 7.97701897,3.42499873 C5.51150172,3.42499873 3.49426034,5.45000759 3.49426034,7.92501842 C3.49426034,10.3999842 5.51150172,12.4249931 7.97701897,12.4249931 C10.3678534,12.4249931 12.3850948,10.5500599 12.4597328,8.15001941 L13.8045603,6.8000135 C13.8793103,7.17501139 13.9540603,7.55002053 13.9540603,8.0000225 C13.9540603,11.2999882 11.2644052,14 7.97701897,14 C4.68965517,14 2,11.2999882 2,8.0000225 C2,4.70001181 4.68965517,2 7.97701897,2 C9.91954397,2 11.712681,2.97499677 12.7586207,4.40000675 L12.9080086,4.17500577 L15,4.17500577 L14.1034483,5.0750097 Z" id="路径" fill="#8A9099"></path>
</g>
</g>
</svg>
\ No newline at end of file
src/assets/project/selectActive.svg 0 → 100644
View file @ 4a4e2d07
<?xml version="1.0" encoding="UTF-8"?>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>编组 4</title>
<g id="上线UI" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="切换产品" transform="translate(-337.000000, -190.000000)">
<g id="编组-37" transform="translate(223.000000, 172.000000)">
<g id="编组-34" transform="translate(0.000000, 8.000000)">
<g id="编组-4" transform="translate(114.000000, 10.000000)">
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<polyline id="路径-26" stroke="#1370FF" stroke-width="1.5" stroke-linejoin="round" points="4 8.33740166 7.27434245 11 12 5"></polyline>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
src/assets/project/successIcon.svg 0 → 100644
View file @ 4a4e2d07
<?xml version="1.0" encoding="UTF-8"?>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>check-circle-outline备份</title>
<g id="云平台视觉规范" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="check-circle-outline备份" fill="#0DD09B" fill-rule="nonzero">
<path d="M8,0 C3.6,0 0,3.6 0,8 C0,12.4 3.6,16 8,16 C12.4,16 16,12.4 16,8 C16,3.6 12.4,0 8,0 M8,14.4 C4.472,14.4 1.6,11.528 1.6,8 C1.6,4.472 4.472,1.6 8,1.6 C11.528,1.6 14.4,4.472 14.4,8 C14.4,11.528 11.528,14.4 8,14.4 M11.672,4.464 L6.4,9.736 L4.328,7.672 L3.2,8.8 L6.4,12 L12.8,5.6 L11.672,4.464 Z" id="形状"></path>
</g>
</g>
</svg>
\ No newline at end of file
src/assets/project/triangle.svg 0 → 100644
View file @ 4a4e2d07
<?xml version="1.0" encoding="UTF-8"?>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>编组 12备份</title>
<g id="上线UI" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="编组-12备份">
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<polygon id="路径-53备份-2" fill="#8A9099" points="4.5 6 11.5 6 8 11"></polygon>
</g>
</g>
</svg>
\ No newline at end of file
src/assets/project/workbenchList.svg
View file @ 4a4e2d07
<?xml version="1.0" encoding="UTF-8"?>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>1.Base基础/Icon图标/任务列表</title>
<defs>
<filter color-interpolation-filters="auto" id="filter-1">
<feColorMatrix in="SourceGraphic" type="matrix" values="0 0 0 0 0.760000 0 0 0 0 0.776000 0 0 0 0 0.800000 0 0 0 1.000000 0"></feColorMatrix>
</filter>
</defs>
<title>1.Base基础/Icon图标/任务列表备份</title>
<g id="上线UI" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="工作台（管理员）空" transform="translate(-370.000000, -245.000000)">
<g id="编组-5" transform="translate(370.000000, 242.000000)">
<g id="1.Base基础/Icon图标/任务列表" transform="translate(0.000000, 3.000000)">
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<g filter="url(#filter-1)" id="编组-4">
<g transform="translate(0.500000, 0.000000)">
<path d="M7.38809691,0.889939751 C7.45764437,0.855744844 7.53911808,0.85573765 7.60867158,0.889920274 L7.60867158,0.889920274 L14.1102244,4.08516037 C14.1529938,4.10617975 14.187927,4.13844408 14.2121677,4.17736742 C14.2364085,4.21629077 14.2499569,4.26187312 14.2499569,4.30952854 L14.2499569,4.30952854 L14.2499569,11.9840447 C14.2499569,12.0332683 14.2355127,12.0802004 14.2098426,12.119868 C14.1841726,12.1595356 14.1472766,12.1919385 14.1023731,12.2121037 L14.1023731,12.2121037 L7.60081331,15.1318104 C7.53565621,15.161071 7.46109499,15.1610648 7.39594277,15.1317934 L7.39594277,15.1317934 L0.897545722,12.2122049 C0.852652465,12.1920353 0.815766035,12.1596329 0.790102919,12.1199688 C0.764439802,12.0803047 0.75,12.033379 0.75,11.984163 L0.75,11.984163 L0.75,4.30940599 C0.75,4.26175853 0.763543923,4.21618307 0.78777749,4.17726362 L0.78777749,4.17726362 Z" id="路径-15" stroke="#979797" stroke-width="1.5"></path>
<polyline id="路径-20" stroke="#979797" stroke-width="1.5" points="1.29720478 4.56847209 7.47016174 7.45 13.6431187 4.56847209"></polyline>
<line x1="7.47016174" y1="7.39513959" x2="7.47016174" y2="14.8580198" id="路径-21" stroke="#979797" stroke-width="1.5"></line>
</g>
</g>
</g>
<g id="1.Base基础/Icon图标/任务列表备份">
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<g id="编组-4" transform="translate(0.500000, 0.000000)" stroke="#C2C6CC" stroke-width="1.5">
<path d="M7.38809691,0.889939751 L14.1102244,4.08516037 L14.2499569,11.9840447 L7.60081331,15.1318104 L0.897545722,12.2122049 L0.75,4.30940599 L7.38809691,0.889939751 Z" id="路径-15"></path>
<polyline id="路径-20" points="1.29720478 4.56847209 7.47016174 7.45 13.6431187 4.56847209"></polyline>
<line x1="7.47016174" y1="7.39513959" x2="7.47016174" y2="14.8580198" id="路径-21"></line>
</g>
</g>
</g>
......
src/assets/project/workbenchList_hover.svg 0 → 100644
View file @ 4a4e2d07
<?xml version="1.0" encoding="UTF-8"?>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>1.Base基础/Icon图标/任务列表备份 3</title>
<g id="上线UI" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="1.Base基础/Icon图标/任务列表备份">
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<g id="编组-4" transform="translate(0.500000, 0.000000)" stroke="#1E2633" stroke-width="1.5">
<path d="M7.38809691,0.889939751 L14.1102244,4.08516037 L14.2499569,11.9840447 L7.60081331,15.1318104 L0.897545722,12.2122049 L0.75,4.30940599 L7.38809691,0.889939751 Z" id="路径-15"></path>
<polyline id="路径-20" points="1.29720478 4.56847209 7.47016174 7.45 13.6431187 4.56847209"></polyline>
<line x1="7.47016174" y1="7.39513959" x2="7.47016174" y2="14.8580198" id="路径-21"></line>
</g>
</g>
</g>
</svg>
\ No newline at end of file
src/assets/project/workbenchList_select.svg
View file @ 4a4e2d07
<?xml version="1.0" encoding="UTF-8"?>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>1.Base基础/Icon图标/任务列表</title>
<defs>
<filter color-interpolation-filters="auto" id="filter-1">
<feColorMatrix in="SourceGraphic" type="matrix" values="0 0 0 0 0.076000 0 0 0 0 0.440000 0 0 0 0 1.000000 0 0 0 1.000000 0"></feColorMatrix>
</filter>
</defs>
<title>1.Base基础/Icon图标/任务列表备份 2</title>
<g id="上线UI" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="任务列表" transform="translate(-370.000000, -245.000000)">
<g id="编组-5" transform="translate(370.000000, 242.000000)">
<g id="1.Base基础/Icon图标/任务列表" transform="translate(0.000000, 3.000000)">
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<g filter="url(#filter-1)" id="编组-4">
<g transform="translate(0.500000, 0.000000)">
<path d="M7.38809691,0.889939751 C7.45764437,0.855744844 7.53911808,0.85573765 7.60867158,0.889920274 L7.60867158,0.889920274 L14.1102244,4.08516037 C14.1529938,4.10617975 14.187927,4.13844408 14.2121677,4.17736742 C14.2364085,4.21629077 14.2499569,4.26187312 14.2499569,4.30952854 L14.2499569,4.30952854 L14.2499569,11.9840447 C14.2499569,12.0332683 14.2355127,12.0802004 14.2098426,12.119868 C14.1841726,12.1595356 14.1472766,12.1919385 14.1023731,12.2121037 L14.1023731,12.2121037 L7.60081331,15.1318104 C7.53565621,15.161071 7.46109499,15.1610648 7.39594277,15.1317934 L7.39594277,15.1317934 L0.897545722,12.2122049 C0.852652465,12.1920353 0.815766035,12.1596329 0.790102919,12.1199688 C0.764439802,12.0803047 0.75,12.033379 0.75,11.984163 L0.75,11.984163 L0.75,4.30940599 C0.75,4.26175853 0.763543923,4.21618307 0.78777749,4.17726362 L0.78777749,4.17726362 Z" id="路径-15" stroke="#979797" stroke-width="1.5"></path>
<polyline id="路径-20" stroke="#979797" stroke-width="1.5" points="1.29720478 4.56847209 7.47016174 7.45 13.6431187 4.56847209"></polyline>
<line x1="7.47016174" y1="7.39513959" x2="7.47016174" y2="14.8580198" id="路径-21" stroke="#979797" stroke-width="1.5"></line>
</g>
</g>
</g>
<g id="1.Base基础/Icon图标/任务列表备份-2">
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<g id="编组-4" transform="translate(0.500000, 0.000000)" stroke="#1370FF" stroke-width="1.5">
<path d="M7.38809691,0.889939751 L14.1102244,4.08516037 L14.2499569,11.9840447 L7.60081331,15.1318104 L0.897545722,12.2122049 L0.75,4.30940599 L7.38809691,0.889939751 Z" id="路径-15"></path>
<polyline id="路径-20" points="1.29720478 4.56847209 7.47016174 7.45 13.6431187 4.56847209"></polyline>
<line x1="7.47016174" y1="7.39513959" x2="7.47016174" y2="14.8580198" id="路径-21"></line>
</g>
</g>
</g>
......
src/assets/project/workbenchTemplate.svg
View file @ 4a4e2d07
<?xml version="1.0" encoding="UTF-8"?>
<svg width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>1.Base基础/Icon图标/工作流模版</title>
<defs>
<filter color-interpolation-filters="auto" id="filter-1">
<feColorMatrix in="SourceGraphic" type="matrix" values="0 0 0 0 0.760000 0 0 0 0 0.776000 0 0 0 0 0.800000 0 0 0 1.000000 0"></feColorMatrix>
</filter>
</defs>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>1.Base基础/Icon图标/工作流模版备份 3</title>
<g id="上线UI" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="任务列表" transform="translate(-245.000000, -246.000000)">
<g id="编组-4" transform="translate(244.000000, 242.000000)">
<g id="编组-5" transform="translate(0.000000, 3.000000)" filter="url(#filter-1)">
<g>
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<g id="编组-4" transform="translate(1.000000, 1.000000)" stroke="#979797" stroke-width="1.5">
<rect id="矩形" x="0.75" y="0.75" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份-2" x="0.75" y="8.5" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份" x="8.5" y="0.75" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份-3" x="8.5" y="8.5" width="4.75" height="4.75" rx="1"></rect>
</g>
</g>
</g>
<g id="编组-5">
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<g id="编组-4" transform="translate(1.000000, 1.000000)" stroke="#C2C6CC" stroke-width="1.5">
<rect id="矩形" x="0.75" y="0.75" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份-2" x="0.75" y="8.5" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份" x="8.5" y="0.75" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份-3" x="8.5" y="8.5" width="4.75" height="4.75" rx="1"></rect>
</g>
</g>
</g>
......
src/assets/project/workbenchTemplate_hover.svg 0 → 100644
View file @ 4a4e2d07
<?xml version="1.0" encoding="UTF-8"?>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>1.Base基础/Icon图标/工作流模版备份 2</title>
<g id="上线UI" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="编组-5">
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<g id="编组-4" transform="translate(1.000000, 1.000000)" stroke="#1E2633" stroke-width="1.5">
<rect id="矩形" x="0.75" y="0.75" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份-2" x="0.75" y="8.5" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份" x="8.5" y="0.75" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份-3" x="8.5" y="8.5" width="4.75" height="4.75" rx="1"></rect>
</g>
</g>
</g>
</svg>
\ No newline at end of file
src/assets/project/workbenchTemplate_select.svg
View file @ 4a4e2d07
<?xml version="1.0" encoding="UTF-8"?>
<svg width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>1.Base基础/Icon图标/工作流模版</title>
<defs>
<filter color-interpolation-filters="auto" id="filter-1">
<feColorMatrix in="SourceGraphic" type="matrix" values="0 0 0 0 0.076000 0 0 0 0 0.440000 0 0 0 0 1.000000 0 0 0 1.000000 0"></feColorMatrix>
</filter>
</defs>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>1.Base基础/Icon图标/工作流模版备份</title>
<g id="上线UI" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="工作台（管理员）空" transform="translate(-245.000000, -246.000000)">
<g id="编组-4" transform="translate(244.000000, 242.000000)">
<g id="编组-5" transform="translate(0.000000, 3.000000)" filter="url(#filter-1)">
<g>
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<g id="编组-4" transform="translate(1.000000, 1.000000)" stroke="#979797" stroke-width="1.5">
<rect id="矩形" x="0.75" y="0.75" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份-2" x="0.75" y="8.5" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份" x="8.5" y="0.75" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份-3" x="8.5" y="8.5" width="4.75" height="4.75" rx="1"></rect>
</g>
</g>
</g>
<g id="编组-5">
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<g id="编组-4" transform="translate(1.000000, 1.000000)" stroke="#1370FF" stroke-width="1.5">
<rect id="矩形" x="0.75" y="0.75" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份-2" x="0.75" y="8.5" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份" x="8.5" y="0.75" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份-3" x="8.5" y="8.5" width="4.75" height="4.75" rx="1"></rect>
</g>
</g>
</g>
......
src/assets/style/public.css
View file @ 4a4e2d07
/* 修改滚动条样式 */
div::-webkit-scrollbar,
main::-webkit-scrollbar {
width: 4px;
height: 5px !important;
width: 6px;
height: 5px !important;
}
div::-webkit-scrollbar-track,
main::-webkit-scrollbar-track {
background-color: #fff;
-webkit-border-radius: 2em;
-moz-border-radius: 2em;
border-radius: 2em;
background-color: transparent;
-webkit-border-radius: 3em;
-moz-border-radius: 3em;
border-radius: 3em;
}
div::-webkit-scrollbar-thumb,
main::-webkit-scrollbar-thumb {
background-color: #C2C6CC;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
height: 5px !important;
width: 4px!important;
background-color: rgba(138, 144, 153, 0.55);
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
height: 5px !important;
width: 6px !important;
}
div::-webkit-scrollbar-thumb:hover {
background-color: rgba(138, 144, 153, 0.8);
}
main::-webkit-scrollbar-thumb:hover {
background-color: rgba(138, 144, 153, 0.8);
}
body,
......@@ -48,15 +55,15 @@ input,
textarea,
th,
td {
margin: 0;
padding: 0;
margin: 0;
padding: 0;
}
body,
button,
input,
select,
textarea {
font: 12px/1.5tahoma, arial, \5b8b\4f53;
font: 12px/1.5tahoma, arial, \5b8b\4f53;
}
h1,
h2,
......@@ -64,73 +71,73 @@ h3,
h4,
h5,
h6 {
font-size: 100%;
font-size: 100%;
}
address,
cite,
dfn,
em,
var {
font-style: normal;
font-style: normal;
}
code,
kbd,
pre,
samp {
font-family: couriernew, courier, monospace;
font-family: couriernew, courier, monospace;
}
small {
font-size: 12px;
font-size: 12px;
}
ul,
ol {
list-style: none;
list-style: none;
}
a {
text-decoration: none;
text-decoration: none;
}
a:hover {
text-decoration: underline;
text-decoration: underline;
}
sup {
vertical-align: text-top;
vertical-align: text-top;
}
sub {
vertical-align: text-bottom;
vertical-align: text-bottom;
}
legend {
color: #000;
color: #000;
}
fieldset,
img {
border: 0;
border: 0;
}
button,
input,
select,
textarea {
font-size: 100%;
font-size: 100%;
}
table {
border-collapse: collapse;
border-spacing: 0;
border-collapse: collapse;
border-spacing: 0;
}
input::-webkit-input-placeholder {
color: #c2c6cc;
color: #c2c6cc;
}
input::-moz-placeholder {
/* Mozilla Firefox 19+ */
color: #c2c6cc;
/* Mozilla Firefox 19+ */
color: #c2c6cc;
}
input:-moz-placeholder {
/* Mozilla Firefox 4 to 18 */
color: #c2c6cc;
/* Mozilla Firefox 4 to 18 */
color: #c2c6cc;
}
input:-ms-input-placeholder {
/* Internet Explorer 10-11 */
color: #c2c6cc;
/* Internet Explorer 10-11 */
color: #c2c6cc;
}
src/components/BusinessComponents/FileSelect/index.module.css
View file @ 4a4e2d07
.FSBox {
width: 900px;
height: 650px;
max-height: 550px;
position: relative;
}
......
src/components/BusinessComponents/FileSelect/index.tsx
View file @ 4a4e2d07
......@@ -447,6 +447,7 @@ const FileSelect = observer((props: FileSelectProps) => {
)}
</div>
<Table
tableContainerStyle={{height: 470}}
footer={false}
rowHover={true}
nopadding={true}
......
src/components/BusinessComponents/SearchInput/index.tsx
View file @ 4a4e2d07
......@@ -38,6 +38,9 @@ const SearchInput = (props: SearchInputProps) => {
height: "32px",
fontSize: "14px",
paddingRight: "8px",
"&.Mui-focused .MuiOutlinedInput-notchedOutline": {
borderWidth: "1px",
},
"& .MuiOutlinedInput-notchedOutline": {
borderColor: '#DDE1E6',
},
......
src/components/CommonComponents/FullScreenDrawer/index.module.css
View file @ 4a4e2d07
......@@ -38,7 +38,7 @@
background-color: #fff;
border-radius: 16px 0 0 0;
box-sizing: border-box;
overflow: scroll;
overflow: overlay;
animation: showDrawer 0.31s ease;
-webkit-animation: showDrawer 0.31s ease;
margin: 0 auto;
......
src/components/CommonComponents/RadioGroupOfButtonStyle/index.module.css
View file @ 4a4e2d07
......@@ -33,3 +33,11 @@
background-color: #fff;
box-shadow: 2px 4px 12px 0px rgba(0, 27, 63, 0.06);
}
.border {
width: 1px;
height: 16px;
background-color: rgba(209, 214, 222, 1);
}
.borderHidden {
visibility: hidden;
}
src/components/CommonComponents/RadioGroupOfButtonStyle/index.tsx
View file @ 4a4e2d07
......@@ -8,6 +8,7 @@
*/
// 按钮样式的单选组
import classnames from "classnames";
import { useMemo } from "react";
import style from "./index.module.css";
type radioOption = {
......@@ -27,21 +28,43 @@ const RadioGroupOfButtonStyle = (props: IRadioGroupOfButtonStyleProps) => {
const { radioOptions, value, handleRadio, RadiosBoxStyle, radioStyle } =
props;
const activeIndex: any = useMemo(() => {
let res = 0;
radioOptions.forEach((item, index) => {
if (item.value === value) {
res = index;
}
});
return res;
}, [value, radioOptions]);
return (
<div className={style.RadiosBox} style={RadiosBoxStyle}>
{radioOptions.map((options) => {
{radioOptions.map((options, index) => {
return (
<div
key={options.value}
className={classnames({
[style.radio]: true,
[style.radioActive]: value === options.value,
})}
onClick={() => handleRadio(options.value)}
style={radioStyle}
>
{options.label}
</div>
<>
<div
key={options.value}
className={classnames({
[style.radio]: true,
[style.radioActive]: value === options.value,
})}
onClick={() => handleRadio(options.value)}
style={radioStyle}
>
{options.label}
</div>
<div
className={classnames({
[style.border]: true,
[style.borderHidden]: !(
index !== radioOptions.length - 1 &&
index !== activeIndex &&
index !== activeIndex - 1
),
})}
></div>
</>
);
})}
</div>
......
src/components/Material.Ui/SearchSelectCheckBox.jsx
View file @ 4a4e2d07
......@@ -38,7 +38,7 @@ const useStyles = makeStyles({
contentWrap: {
padding: "8px 0", height: 0, transition: "all 1s", position: "absolute", zIndex: 9, width: "100%",
backgroundColor: "#FFFFFF", boxShadow: "0px 2px 3px 0px rgba(0, 0, 0, 0.16)", borderRadius: "4px",
overflowY: "scroll",
overflowY: "overlay",
maxHeight: "398px"
},
contentWrapOpenPosition:{top:"-400px"},
......
src/components/Material.Ui/Select.jsx
View file @ 4a4e2d07
......@@ -32,7 +32,7 @@ const useStyles = makeStyles({
contentWrap: {
padding: "8px 0", height: 0, transition: "all 1s", position: "absolute", zIndex: 9, width: "100%",
backgroundColor: "#FFFFFF", boxShadow: "0px 2px 3px 0px rgba(0, 0, 0, 0.16)", borderRadius: "4px",
overflowY: "auto",
overflowY: "overlay",
maxHeight: "400px"
},
contentWrapOpen: { height: "auto" },
......
src/components/Material.Ui/SelectCheckBox.jsx
View file @ 4a4e2d07
......@@ -42,7 +42,7 @@ const useStyles = makeStyles({
contentWrap: {
padding: "8px 0", transition: "all 1s", position: "fixed", zIndex: 9, width: "552px",
backgroundColor: "#FFFFFF", boxShadow: "0px 2px 3px 0px rgba(0, 0, 0, 0.16)", borderRadius: "4px",
overflowY: "scroll",
overflowY: "overlay",
maxHeight: "398px",
// position: "fixed",
// width: "552px"
......
src/components/MySnackbar/MySnackbarProvider.tsx
View file @ 4a4e2d07
import React, { Fragment, ReactNode, useMemo } from "react";
import React, { Fragment, ReactNode } from "react";
import { Snackbar, Alert, Fade, Grow } from "@mui/material";
import useMySnackbar from "./useMySnackbar";
import snackbarContext from "./snackbarContext";
import { ThemeProvider, createTheme } from "@mui/material/styles";
import successIconSrc from "../../assets/project/successIcon.svg";
type MySnackbarProviderProp = {
vertical?: "bottom" | "top";
......@@ -22,7 +23,6 @@ type MySnackbarProviderProp = {
variant?: "filled" | "outlined" | "standard";
errorIcon?: ReactNode;
infoIcon?: ReactNode;
successIcon?: ReactNode;
warningIcon?: ReactNode;
elevation?: number;
alertSx?: object;
......@@ -58,7 +58,6 @@ const MySnackbarProvider = ({
variant = "standard",
errorIcon,
infoIcon,
successIcon,
warningIcon,
elevation = 3,
alertSx,
......@@ -66,6 +65,7 @@ const MySnackbarProvider = ({
}: MySnackbarProviderProp) => {
const {
open,
setOpen,
messageInfo,
handleExited,
success,
......@@ -74,31 +74,46 @@ const MySnackbarProvider = ({
info,
close,
} = useMySnackbar();
// .MuiAlert-filledInfo
const getColorStyle = useMemo(() => {
if (messageInfo.severity === "success") {
return "#02AB83";
}
if (messageInfo.severity === "info") {
return "#1370FF";
}
if (messageInfo.severity === "warning") {
return "#FFB919";
}
if (messageInfo.severity === "error") {
return "#FF4E4E";
}
}, [messageInfo.severity]);
const theme = createTheme({
components: {
MuiAlert: {
styleOverrides: {
root: {
color: getColorStyle,
"& .MuiAlert-icon": {
color: getColorStyle,
minWidth: "360px",
maxWidth: "542px",
minHeight: "38px",
boxShadow: "none",
"& .MuiAlert-action": {
paddingLeft: "32px",
},
"&.MuiAlert-standardError": {
color: "#FF4E4E",
background: "rgba(255, 237, 237, 1)",
"& .MuiAlert-icon": {
color: "#FF4E4E",
},
},
"&.MuiAlert-standardInfo": {
color: "rgba(19, 112, 255, 1)",
background: "rgba(235, 243, 255, 1)",
"& .MuiAlert-icon": {
color: "rgba(19, 112, 255, 1)",
},
},
"&.MuiAlert-standardSuccess": {
color: "rgba(2, 171, 131, 1)",
background: "rgba(217, 255, 238, 1)",
"& .MuiAlert-icon": {
color: "rgba(2, 171, 131, 1)",
},
},
"&.MuiAlert-standardWarning": {
color: "rgba(255, 185, 25, 1)",
background: "rgba(255, 246, 226, 1)",
"& .MuiAlert-icon": {
color: "rgba(255, 185, 25, 1)",
},
},
},
},
......@@ -106,6 +121,14 @@ const MySnackbarProvider = ({
},
});
const successIcon = (
<img
src={successIconSrc}
style={{ width: "16px", height: "16px", margin: "3px 0" }}
alt=""
/>
);
return (
<Fragment>
<ThemeProvider theme={theme}>
......@@ -137,7 +160,10 @@ const MySnackbarProvider = ({
severity={messageInfo?.severity}
variant={variant}
elevation={elevation}
sx={{ boxShadow: "unset", ...alertSx }}
sx={{ ...alertSx }}
onClose={() => {
setOpen(false);
}}
>
{messageInfo?.content}
</Alert>
......
src/components/MySnackbar/useMySnackbar.ts
View file @ 4a4e2d07
......@@ -69,6 +69,7 @@ const useMySnackbar = () => {
return {
open,
setOpen,
messageInfo,
handleExited,
success,
......
src/components/mui/MyButton.tsx
View file @ 4a4e2d07
......@@ -46,7 +46,7 @@ const theme = createTheme({
MuiButton: {
styleOverrides: {
root: {
minWidth: "48px",
minWidth: "68px",
boxShadow: "none !important",
"&.MuiButton-textError": {
color: "rgba(255, 78, 78, 1)",
......@@ -54,11 +54,17 @@ const theme = createTheme({
"&.MuiButton-outlinedError": {
color: "rgba(255, 78, 78, 1)",
border: "1px solid rgba(255, 78, 78, 1)",
"&:hover": { backgroundColor: 'transparent' },
"&:hover": { backgroundColor: "#FFEDED" },
},
"& .MuiLoadingButton-loadingIndicator": {
color: "#fff",
},
"&.MuiButton-containedError": {
backgroundColor: "#FF4E4E",
"&:hover": {
backgroundColor: "rgba(217, 54, 54, 1)",
},
},
},
contained: {
backgroundColor: "#1370FF",
......@@ -101,6 +107,9 @@ const theme = createTheme({
border: "1px solid rgba(221, 225, 230, 1)",
},
},
// outlinedError: {
// "&:hover": { backgroundColor: "#FFEDED " },
// },
textSecondary: {
backgroundColor: "transparent",
color: "#FF4E4E",
......@@ -110,16 +119,19 @@ const theme = createTheme({
"& p": { fontSize: "12px" },
height: "28px",
padding: "0 12px",
minWidth: "60px",
},
sizeMedium: {
"& p": { fontSize: "14px" },
height: "32px",
padding: "0 16px",
minWidth: "68px",
},
sizeLarge: {
"& p": { fontSize: "16px" },
height: "36px",
padding: "0 16px",
minWidth: "80px",
},
},
},
......
src/components/mui/MyCheckBox.tsx
View file @ 4a4e2d07
......@@ -12,6 +12,7 @@ import FormControlLabel from "@mui/material/FormControlLabel";
import Checkbox from "@mui/material/Checkbox";
import FormControl from "@mui/material/FormControl";
import FormHelperText from "@mui/material/FormHelperText";
import { ThemeProvider, createTheme } from "@mui/material/styles";
import _ from "lodash";
interface IMyCheckBoxProps extends FormGroupProps {
......@@ -44,6 +45,33 @@ export const optionsTransform = (
});
};
const theme = createTheme({
components: {
MuiFormControlLabel: {
styleOverrides: {
label: {
fontSize: "14px",
},
},
},
MuiSvgIcon: {
styleOverrides: {
root: {
fontSize: "19px",
},
},
},
MuiCheckbox: {
styleOverrides: {
colorPrimary: {
color: "rgba(209, 214, 222, 1)",
},
},
},
// MuiCheckbox-colorPrimary
},
});
export default function MyCheckBox(props: IMyCheckBoxProps) {
const {
value,
......@@ -76,27 +104,29 @@ export default function MyCheckBox(props: IMyCheckBoxProps) {
};
return (
<FormControl fullWidth variant={variant} error={error}>
<FormGroup {...props} row>
{options.map((option) => {
return (
<FormControlLabel
key={option.value}
control={
<Checkbox
checked={getCheckedStatus(option.value, value)}
value={option.value}
/>
}
label={option.label}
name={option.value}
onChange={handleMyCheckBoxOnChange}
disabled={option.disabled}
/>
);
})}
</FormGroup>
{helperText && error && <FormHelperText>{helperText}</FormHelperText>}
</FormControl>
<ThemeProvider theme={theme}>
<FormControl fullWidth variant={variant} error={error}>
<FormGroup {...props} row>
{options.map((option) => {
return (
<FormControlLabel
key={option.value}
control={
<Checkbox
checked={getCheckedStatus(option.value, value)}
value={option.value}
/>
}
label={option.label}
name={option.value}
onChange={handleMyCheckBoxOnChange}
disabled={option.disabled}
/>
);
})}
</FormGroup>
{helperText && error && <FormHelperText>{helperText}</FormHelperText>}
</FormControl>
</ThemeProvider>
);
}
src/components/mui/MyDialog.tsx
View file @ 4a4e2d07
import React from "react";
import React, { useMemo } from "react";
import {
Dialog,
......@@ -42,7 +42,14 @@ export interface IDialogProps {
/** 点击遮罩是否关闭 默认为false*/
clickMaskClose?: boolean;
/** 确认按钮样式*/
okSx?: any;
okColor?:
| "inherit"
| "primary"
| "secondary"
| "success"
| "error"
| "info"
| "warning"; //按钮颜色风格
loading?: boolean; // 确认按钮是否处于loading状态
}
......@@ -66,7 +73,7 @@ const MyDialog: React.FunctionComponent<IDialogProps> = (props) => {
disabledConfirm,
clickMaskClose = false,
loading = false,
okSx = {},
okColor = "primary",
} = props;
const handelClose = (
......@@ -79,7 +86,7 @@ const MyDialog: React.FunctionComponent<IDialogProps> = (props) => {
onClose && onClose();
};
const Footer = () => {
const Footer = useMemo(() => {
if (isHideFooter) return null;
return footerRender ? (
footerRender()
......@@ -90,7 +97,6 @@ const MyDialog: React.FunctionComponent<IDialogProps> = (props) => {
text={cancelText || "取消"}
onClick={onClose}
variant="outlined"
// size="small"
color="secondary"
/>
) : null}
......@@ -99,16 +105,28 @@ const MyDialog: React.FunctionComponent<IDialogProps> = (props) => {
text={okText || "确定"}
onClick={onConfirm}
variant="contained"
// size="small"
color={okColor}
disabled={disabledConfirm}
isLoadingButton={true}
loading={loading}
style={{ marginLeft: '12px', ...okSx }}
style={{ marginLeft: "12px" }}
/>
) : null}
</DialogActions>
);
};
}, [
disabledConfirm,
okColor,
okText,
onConfirm,
onClose,
cancelText,
showCancel,
footerRender,
isHideFooter,
loading,
showConfirm,
]);
return (
<Dialog
open={open}
......@@ -122,16 +140,13 @@ const MyDialog: React.FunctionComponent<IDialogProps> = (props) => {
"& .MuiPaper-root": {
// 设置最大宽度， 实际宽度让子元素撑大
maxWidth: "1920px",
borderRadius: "8px"
borderRadius: "8px",
},
},
}}
>
{isHideHeader ? null : (
<DialogTitle
id="alert-dialog-title"
sx={{ padding: "20px 24px" }}
>
<DialogTitle id="alert-dialog-title" sx={{ padding: "20px 24px" }}>
<div
style={{
display: "flex",
......@@ -140,16 +155,25 @@ const MyDialog: React.FunctionComponent<IDialogProps> = (props) => {
fontWeight: 600,
}}
>
<span style={{ fontSize: 16, lineHeight: '24px', color: '#1E2633' }}>{title}</span>
<span
style={{ fontSize: 16, lineHeight: "24px", color: "#1E2633" }}
>
{title}
</span>
<CloseIcon
onClick={onClose}
sx={{ color: "#C2C6CC", cursor: "pointer", ":hover": { background: "#f0f2f5", borderRadius: '2px' } }}
sx={{
fontSize: "18px",
color: "#C2C6CC",
cursor: "pointer",
":hover": { background: "#f0f2f5", borderRadius: "2px" },
}}
/>
</div>
</DialogTitle>
)}
<DialogContent style={{ minWidth: 388 }}>{children}</DialogContent>
{Footer()}
{Footer}
</Dialog>
);
};
......
src/components/mui/MyInput.tsx
View file @ 4a4e2d07
......@@ -35,9 +35,18 @@ const MyInput = (props: MyInputProps) => {
root: {
height: "36px",
fontSize: "14px",
border: "rgba(221, 225, 230, 1)",
padding: "7px 12px",
"&.MuiInputBase-sizeSmall": {
height: "32px",
},
"&.Mui-disabled": {
background: "rgba(247, 248, 250, 1)",
cursor: "not-allowed",
"& .MuiOutlinedInput-notchedOutline": {
borderColor: "#DDE1E6",
},
},
},
multiline: {
height: "auto",
......@@ -45,13 +54,19 @@ const MyInput = (props: MyInputProps) => {
padding: 0,
},
},
input: {},
input: {
"&.Mui-disabled": {
background: "rgba(247, 248, 250, 1)",
cursor: "not-allowed",
},
},
},
},
MuiInputLabel: {
styleOverrides: {
root: {
top: "-9px",
fontSize: "14px",
},
shrink: {
top: 0,
......@@ -64,11 +79,19 @@ const MyInput = (props: MyInputProps) => {
MuiOutlinedInput: {
styleOverrides: {
root: {
padding: "7px 12px",
"&.Mui-focused .MuiOutlinedInput-notchedOutline": {
borderWidth: "1px",
},
"& .MuiOutlinedInput-notchedOutline": {
borderColor: '#DDE1E6',
borderColor: "#DDE1E6",
},
"&.Mui-disabled": {
background: "rgba(247, 248, 250, 1)",
cursor: "not-allowed",
"& .MuiOutlinedInput-notchedOutline": {
borderColor: "#DDE1E6",
},
},
":hover": {
"& .MuiOutlinedInput-notchedOutline": error
......@@ -76,14 +99,28 @@ const MyInput = (props: MyInputProps) => {
: {
borderColor: "#1370ff",
},
"&.Mui-disabled": {
background: "rgba(247, 248, 250, 1)",
cursor: "not-allowed",
"& .MuiOutlinedInput-notchedOutline": {
borderColor: "#DDE1E6",
},
},
},
},
input: {
padding: "6.5px 12px",
padding: "0",
verticalAlign: "middle",
},
},
},
MuiTypography: {
styleOverrides: {
root: {
marginRight: "-5px",
},
},
},
},
});
......
src/components/mui/MyMenu.tsx
View file @ 4a4e2d07
......@@ -23,7 +23,7 @@ const theme = createTheme({
MuiMenu: {
styleOverrides: {
root: {
overflowY: "scroll",
overflow: "overlay",
},
},
},
......
src/components/mui/MyMultipleMenu.tsx
View file @ 4a4e2d07
......@@ -14,7 +14,7 @@ const theme = createTheme({
MuiMenu: {
styleOverrides: {
root: {
overflowY: "scroll",
overflow: "overlay",
},
},
},
......
src/components/mui/MyPopconfirm.tsx
View file @ 4a4e2d07
......@@ -68,43 +68,52 @@ const MyPopconfirm = (props: IMyPopconfirmProps) => {
placement={placement}
sx={{
zIndex: 2000,
bgcolor: "#fff",
bgcolor: "transparent",
minWidth: "200px",
borderRadius: "4px",
fontSize: "14px",
padding: "20px 16px",
boxShadow: "0px 3px 10px 0px rgba(0, 24, 57, 0.14)",
}}
>
<Box sx={{ marginBottom: "16px" }}>
<img
style={{
width: "16px",
marginRight: "12px",
position: "relative",
top: "3px",
}}
src={tipsIcon}
alt=""
/>
{title}
</Box>
<Box sx={{ display: "flex", justifyContent: "flex-end" }}>
{showCancel && (
<Box
sx={{
bgcolor: "#fff",
minWidth: "200px",
borderRadius: "4px",
fontSize: "14px",
padding: "20px 16px",
boxShadow: "0px 3px 10px 0px rgba(0, 24, 57, 0.14)",
}}
>
<Box sx={{ marginBottom: "16px" }}>
<img
style={{
width: "16px",
marginRight: "12px",
position: "relative",
top: "3px",
}}
src={tipsIcon}
alt=""
/>
{title}
</Box>
<Box sx={{ display: "flex", justifyContent: "flex-end" }}>
{showCancel && (
<MyButton
text={cancelText}
variant="outlined"
color="inherit"
onClick={handleCancel}
style={{ marginRight: "12px" }}
/>
)}
<MyButton
text={cancelText}
variant="outlined"
color="inherit"
onClick={handleCancel}
style={{ marginRight: "12px" }}
text={okText}
onClick={handleOk}
loading={loading}
isLoadingButton={true}
/>
)}
<MyButton
text={okText}
onClick={handleOk}
loading={loading}
isLoadingButton={true}
/>
</Box>
</Box>
</Popper>
);
......
src/components/mui/MyPopover.tsx
View file @ 4a4e2d07
/*
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-06-11 09:33:46
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-06-16 14:21:00
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-09-01 19:34:26
* @FilePath: /bkunyun/src/components/mui/MyPopover.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
import * as React from "react";
import { useRef, useEffect, useState } from "react";
import Popover, { PopoverProps } from "@mui/material/Popover";
import Typography from "@mui/material/Typography";
......@@ -17,10 +17,15 @@ interface IProps extends Omit<PopoverProps, "open"> {
children: React.ReactNode;
/** 显示内容 */
content: React.ReactNode;
/** 是否打开 */
open?: boolean;
/** open 修改 */
changeOpen: (val: boolean) => void;
}
const MyPopover = (props: IProps) => {
const [anchorEl, setAnchorEl] = React.useState<any | null>(null);
const [anchorEl, setAnchorEl] = useState<any | null>(null);
const ref = useRef(null);
const {
trigger = "click",
......@@ -28,26 +33,37 @@ const MyPopover = (props: IProps) => {
content,
anchorOrigin,
transformOrigin,
open = false,
changeOpen,
} = props;
const handlePopoverOpen = (event: any) => {
changeOpen(true);
setAnchorEl(event.currentTarget);
};
const handelClick = (event: any) => {
changeOpen(true);
setAnchorEl(event?.currentTarget);
};
const handlePopoverClose = () => {
changeOpen(false);
setAnchorEl(null);
};
const open = Boolean(anchorEl);
useEffect(() => {
if (open) {
setAnchorEl(ref.current);
}
}, [open]);
const id = open ? "simple-popover" : undefined;
return (
<div>
<Typography
ref={ref}
aria-owns={id}
onClick={trigger === "click" ? handelClick : undefined}
onMouseEnter={trigger === "hover" ? handlePopoverOpen : undefined}
......
src/components/mui/MyRadio.tsx
View file @ 4a4e2d07
......@@ -12,6 +12,7 @@ import RadioGroup, { RadioGroupProps } from "@mui/material/RadioGroup";
import FormControlLabel from "@mui/material/FormControlLabel";
import FormControl from "@mui/material/FormControl";
import FormHelperText from "@mui/material/FormHelperText";
import { ThemeProvider, createTheme } from "@mui/material/styles";
interface IMyRadioProps extends RadioGroupProps {
value: any;
......@@ -44,6 +45,25 @@ export const optionsTransform = (
});
};
const theme = createTheme({
components: {
MuiFormControlLabel: {
styleOverrides: {
label: {
fontSize: "14px",
},
},
},
MuiSvgIcon: {
styleOverrides: {
root: {
fontSize: "19px",
},
},
},
},
});
export default function MyRadio(props: IMyRadioProps) {
const {
value,
......@@ -55,28 +75,30 @@ export default function MyRadio(props: IMyRadioProps) {
} = props;
return (
<FormControl fullWidth variant={variant} error={error}>
<RadioGroup
{...props}
row
aria-labelledby="demo-row-radio-buttons-group-label"
name="row-radio-buttons-group"
value={value}
onChange={onChange}
>
{options.map((option) => {
return (
<FormControlLabel
key={option.value}
value={option.value}
control={<Radio sx={{ color: "rgba(209, 214, 222, 1)" }} />}
label={option.label}
disabled={option.disabled}
/>
);
})}
</RadioGroup>
{helperText && error && <FormHelperText>{helperText}</FormHelperText>}
</FormControl>
<ThemeProvider theme={theme}>
<FormControl fullWidth variant={variant} error={error}>
<RadioGroup
{...props}
row
aria-labelledby="demo-row-radio-buttons-group-label"
name="row-radio-buttons-group"
value={value}
onChange={onChange}
>
{options.map((option) => {
return (
<FormControlLabel
key={option.value}
value={option.value}
control={<Radio sx={{ color: "rgba(209, 214, 222, 1)" }} />}
label={option.label}
disabled={option.disabled}
/>
);
})}
</RadioGroup>
{helperText && error && <FormHelperText>{helperText}</FormHelperText>}
</FormControl>
</ThemeProvider>
);
}
src/components/mui/MySelect.tsx
View file @ 4a4e2d07
......@@ -12,6 +12,7 @@ import FormControl from "@mui/material/FormControl";
import FormHelperText from "@mui/material/FormHelperText";
import Select, { SelectChangeEvent, SelectProps } from "@mui/material/Select";
import { createTheme, ThemeProvider } from "@mui/material";
import selectActive from "@/assets/project/selectActive.svg";
export interface IOption {
label: string;
......@@ -71,6 +72,35 @@ export default function MySelect(props: IProps) {
styleOverrides: {
root: {
height: "36px",
"& .Mui-disabled": {
background: "rgba(247, 248, 250, 1)",
cursor: "not-allowed",
"& .MuiOutlinedInput-notchedOutline": {
borderColor: "#DDE1E6",
},
},
},
input: {
fontSize: "14px",
"&.Mui-disabled": {
background: "rgba(247, 248, 250, 1)",
cursor: "not-allowed",
},
img: {
display: "none",
},
},
},
},
MuiList: {
styleOverrides: {
root: {
"& .MuiButtonBase-root": {
"&.Mui-selected": {
backgroundColor: "#fff",
color: "#1370FF",
},
},
},
},
},
......@@ -78,9 +108,12 @@ export default function MySelect(props: IProps) {
MuiMenuItem: {
styleOverrides: {
root: {
paddingRight: "46px",
fontSize: "14px",
lineHeight: "24px",
":hover": {
backgroundColor: "#ECF4FF ",
color: "#1370FF",
backgroundColor: "#F0F2F5 ",
color: "#1E2633",
},
},
},
......@@ -89,10 +122,30 @@ export default function MySelect(props: IProps) {
MuiOutlinedInput: {
styleOverrides: {
root: {
"&.Mui-focused .MuiOutlinedInput-notchedOutline": {
borderWidth: "1px",
},
"& .MuiOutlinedInput-notchedOutline": {
borderColor: "#DDE1E6",
},
"&.Mui-disabled": {
background: "rgba(247, 248, 250, 1)",
cursor: "not-allowed",
"& .MuiOutlinedInput-notchedOutline": {
borderColor: "#DDE1E6",
},
},
":hover": {
"& .MuiOutlinedInput-notchedOutline": {
borderColor: "#1370ff",
},
"&.Mui-disabled": {
background: "rgba(247, 248, 250, 1)",
cursor: "not-allowed",
"& .MuiOutlinedInput-notchedOutline": {
borderColor: "#DDE1E6",
},
},
},
},
},
......@@ -119,6 +172,14 @@ export default function MySelect(props: IProps) {
},
},
},
MuiPaper: {
styleOverrides: {
root: {
boxShadow: "0px 3px 10px 0px rgba(0,24,57,0.14)",
},
},
},
},
});
......@@ -153,6 +214,19 @@ export default function MySelect(props: IProps) {
key={index}
>
{item.label}
{value === item.value && (
<img
style={{
width: "16px",
height: "16px",
position: "absolute",
top: "10px",
right: "12px",
}}
src={selectActive}
alt=""
/>
)}
</MenuItem>
);
})
......
src/components/mui/MySwitch.tsx
View file @ 4a4e2d07
......@@ -6,7 +6,7 @@
* @FilePath: /bkunyun/src/components/mui/MySwitch.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
import * as React from "react";
import React, { useMemo } from "react";
import Switch, { SwitchProps } from "@mui/material/Switch";
import { ThemeProvider, createTheme } from "@mui/material/styles";
......@@ -17,43 +17,57 @@ interface IMySwitchProps extends SwitchProps {
disabled?: boolean;
}
const theme = createTheme({
components: {
MuiSwitch: {
styleOverrides: {
root: {
boxSizing: "border-box",
padding: "0",
},
switchBase: {
top: "4px",
left: "4px",
padding: 0,
"&.Mui-checked": {
left: "2px",
"& + .MuiSwitch-track": {
backgroundColor: "#1370ff",
const MySwitch = (props: IMySwitchProps) => {
const {
value,
defaultChecked,
onChange,
disabled = false,
size,
...other
} = props;
const theme = useMemo(() => {
return createTheme({
components: {
MuiSwitch: {
styleOverrides: {
root: {
boxSizing: "border-box",
padding: "0",
},
switchBase: {
top: "4px",
left: "4px",
padding: 0,
"&.Mui-checked": {
left: "2px",
"& + .MuiSwitch-track": {
backgroundColor: disabled
? "rgba(166, 211, 255, 1)"
: "rgba(19, 112, 255, 1)",
opacity: 1,
},
},
},
thumb: {
width: "14px",
height: "14px",
color: "#fff",
},
track: {
borderRadius: "11px",
backgroundColor: disabled
? "RGBA(240, 242, 245, 1)"
: "RGBA(221, 225, 230, 1)",
opacity: 1,
},
},
},
thumb: {
width: "14px",
height: "14px",
color: "#fff",
},
track: {
borderRadius: "11px",
backgroundColor: "#E6E8EB",
opacity: 1,
},
},
},
},
});
});
}, [disabled]);
const MySwitch = (props: IMySwitchProps) => {
const { value, defaultChecked, onChange, disabled = false, size, ...other } = props;
return (
<ThemeProvider theme={theme}>
<Switch
......@@ -64,13 +78,13 @@ const MySwitch = (props: IMySwitchProps) => {
sx={
size === "medium"
? {
width: 44,
height: 24,
}
width: 44,
height: 24,
}
: {
width: 40,
height: 22,
}
width: 40,
height: 22,
}
}
{...other}
/>
......
src/components/mui/MyTable/index.tsx
View file @ 4a4e2d07
This diff is collapsed.
src/components/mui/MyTable/interface.ts
View file @ 4a4e2d07
......@@ -2,7 +2,7 @@
* @Author: 吴永生 15770852798@163.com
* @Date: 2022-07-26 10:23:43
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-07-26 11:53:00
* @LastEditTime: 2022-09-01 16:00:34
* @FilePath: /bkunyun/src/components/mui/MyTable/interface.ts
* @Description: 这是默认设置,请设置`customMade`,打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -32,7 +32,7 @@ export interface ITableProps {
/** 每行双击事件 */
onDoubleClick?: any,
/** 是否loading */
load?: boolean,
loading?: boolean,
/** table size */
size?: any,
/** 选中的checkbox数据 */
......@@ -71,4 +71,6 @@ export interface ITableProps {
onRef?: any;
/** 手型 */
cursor?: string
/** 没有数据文案 */
noDataText?: string
}
\ No newline at end of file
src/components/mui/Tabs.tsx
View file @ 4a4e2d07
......@@ -2,11 +2,11 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-05-31 10:18:13
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-16 15:53:31
* @LastEditTime: 2022-09-01 19:34:35
* @FilePath: /bkunyun/src/views/Project/ProjectSetting/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
import { memo } from "react";
import { memo, useCallback } from "react";
import { isEqual } from "lodash";
import { useState } from "react";
import { Box } from "@mui/system";
......@@ -21,11 +21,14 @@ interface ITabList {
component: JSX.Element | React.ReactNode;
icon?: string;
iconed?: string;
iconHover?: string;
hide?: boolean;
disabled?: boolean;
}
interface IProps {
value?: string;
onChange?: (val: string) => void;
tabList: ITabList[];
defaultValue?: string;
tabPanelSx?: any;
......@@ -70,11 +73,14 @@ const theme = createTheme({
const Tabs = (props: IProps) => {
const {
tabList,
value,
defaultValue,
onChange,
allowNullValue = false,
tabPanelSx = { padding: "24px 0 0 0" },
} = props;
const [value, setValue] = useState(
const [tabValue, setTabValue] = useState(
defaultValue
? defaultValue
: allowNullValue
......@@ -82,17 +88,38 @@ const Tabs = (props: IProps) => {
: tabList.filter((e) => !e.hide)[0].value
);
const onChange = (val: string) => {
setValue(val);
const [hoverValue, setHoverValue] = useState("");
const onTabChange = (val: string) => {
setTabValue(val);
onChange && onChange(val);
};
const getImgSrc = useCallback(
(item: ITabList) => {
let result = item.icon;
if (value === item.value || tabValue === item.value) {
result = item.iconed;
}
if (hoverValue === item.value) {
result = item.iconHover;
}
return result;
},
[hoverValue, value, tabValue]
);
const labelRender = (item: ITabList, key: number) => {
return (
<Box style={{ display: "flex", alignItems: "center" }}>
<div
style={{ display: "flex", alignItems: "center" }}
onMouseOver={() => setHoverValue(item.value)}
onMouseOut={() => setHoverValue("")}
>
{item.icon ? (
<img
style={{ width: "16px", marginRight: "8px" }}
src={value === item.value ? item.iconed : item.icon}
src={getImgSrc(item)}
alt=""
/>
) : (
......@@ -108,17 +135,17 @@ const Tabs = (props: IProps) => {
>
{item.label}
</Typography>
</Box>
</div>
);
};
return (
<ThemeProvider theme={theme}>
<TabContext value={value}>
<Box sx={{ borderBottom: 1, borderColor: "#dde1e6" }}>
<TabContext value={value || tabValue}>
<Box sx={{ borderBottom: 1, borderColor: "#EDEFF2" }}>
<TabList
onChange={(e: any, val: string) => {
onChange(val);
onTabChange(val);
}}
>
{tabList
......
src/hooks/usePass.ts
View file @ 4a4e2d07
......@@ -9,6 +9,13 @@ const roleList: any[] = [
{ OWNER: 4 }
]
export const roleMap = {
VIEWER: '查看者',
USER: '研究员',
MANAGER: '管理员',
OWNER: '所有者',
}
const usePass = () => {
const { permissionStore } = useStores();
const { currentProjectStore } = useStores();
......
src/index.tsx
View file @ 4a4e2d07
......@@ -41,9 +41,7 @@ root.render(
<React.StrictMode>
<ThemeProvider theme={theme}>
<Provider {...stores}>
<MySnackbarProvider
alertSx={{ boxShadow: "0px 2px 4px 0px rgb(0 0 0 / 8%)" }}
>
<MySnackbarProvider>
<MyRouter></MyRouter>
</MySnackbarProvider>
</Provider>
......
src/store/modules/currentProject.ts
View file @ 4a4e2d07
......@@ -18,6 +18,7 @@ type projectInfo = {
type productInfo = {
id?: string;
name?: string;
path?: string;
};
/** 用户信息 */
......
src/store/modules/fileList.ts
View file @ 4a4e2d07
/*
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-06-13 17:00:19
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-06-16 09:43:42
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-09-01 19:34:46
* @FilePath: /bkunyun/src/store/modules/upload.ts
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -24,7 +24,9 @@ class FileList {
/** 文件上传列表 */
fileList: IUploadInfo[] = [];
/** 是否打开传输列表 */
openFileList: boolean = false
// setFileList (val: IUploadInfo[]) {
// this.fileList = val
......@@ -39,6 +41,10 @@ class FileList {
this.newFileList = val
}
/** 打开关闭文件列表 */
setOpenFileList = (val: boolean) => {
this.openFileList = val
}
/** 设置文件上传信息 */
setUploadInfo = (id: string, val: IUploadInfo) => {
......
src/views/ConsoleLayout/components/FileItem/index.module.css
View file @ 4a4e2d07
.itemBox {
height: 50px;
padding: 16px 0;
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid #f0f2f5;
height: 50px;
padding: 16px 0;
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid #f0f2f5;
}
.fileNameBox {
white-space: nowrap;
display: inline-block;
vertical-align: middle;
color: #1e2633;
max-width: 260px;
overflow: hidden;
text-overflow: ellipsis;
font-size: 14px;
white-space: nowrap;
display: inline-block;
vertical-align: middle;
color: #1e2633;
max-width: 260px;
overflow: hidden;
text-overflow: ellipsis;
font-size: 14px;
}
.contentBox {
display: flex;
flex-direction: column;
justify-content: space-between;
}
.speedBox {
display: flex;
justify-content: space-between;
align-items: center;
display: flex;
justify-content: space-between;
align-items: center;
}
.rightBox {
cursor: pointer;
font-size: 12px;
color: #1370ff;
cursor: pointer;
font-size: 12px;
color: #1370ff;
}
.leftBox {
display: flex;
display: flex;
}
.span {
color: #8a9099;
font-size: 12px;
color: #8a9099;
font-size: 12px;
}
src/views/ConsoleLayout/components/FileItem/index.tsx
View file @ 4a4e2d07
......@@ -88,17 +88,17 @@ const FileItem = observer((props: IProps) => {
const speed = useMemo(() => {
let val = 0;
const time = Math.floor((itemInfo?.endTime - itemInfo.startTime) / 1000);
const time = Math.floor((itemInfo?.endTime - itemInfo?.startTime) / 1000);
if (time > 0) {
val = Math.floor(itemInfo?.bytesUploaded / time);
}
return val;
}, [itemInfo?.bytesUploaded, itemInfo?.endTime, itemInfo.startTime]);
}, [itemInfo?.bytesUploaded, itemInfo?.endTime, itemInfo?.startTime]);
return (
<div className={styles.itemBox}>
<div className={styles.leftBox}>
<img src={bkunyunFile} alt="" style={{ marginRight: 16 }} />
<div>
<div className={styles.contentBox}>
<div>
<b className={styles.fileNameBox} title={itemInfo?.name || ""}>
{itemInfo?.name || ""}
......
src/views/ConsoleLayout/components/TransferList/index.tsx
View file @ 4a4e2d07
/*
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-06-10 18:05:21
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-07-21 11:28:21
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-09-02 10:47:33
* @FilePath: /bkunyun/src/views/ConsoleLayout/components/TransferList/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -20,16 +20,19 @@ const TranSferList = observer(() => {
const uploadInfoStore = toJS(useGlobalStore("fileListStore"));
return (
<Box style={{ width: 520, padding: 20 }}>
<MyTitle title="传输列表" />
<Box style={{ width: 520 }}>
<MyTitle style={{ padding: "12px 16px" }} title="传输列表" />
<Box
style={{
display: "flex",
justifyContent: "space-between",
alignItems: "center",
padding: "0 16px",
}}
>
<Box style={{ color: "#8A9099" }}>请勿在上传过程中刷新页面！</Box>
<Box style={{ color: "#8A9099", fontSize: 14 }}>
请勿在上传过程中刷新页面！
</Box>
<MySelect
variant="standard"
value={"default"}
......@@ -43,11 +46,11 @@ const TranSferList = observer(() => {
size="small"
/>
</Box>
<Box style={{ height: 400, overflowY: "auto" }}>
<div style={{ height: 400, overflow: "overlay", padding: "0 16px" }}>
{uploadInfoStore?.fileList.map((item) => {
return <FileItem fileItemInfo={item} key={item.id} />;
})}
</Box>
</div>
</Box>
);
});
......
src/views/ConsoleLayout/index.module.css
View file @ 4a4e2d07
......@@ -13,10 +13,70 @@
}
.logo {
padding: 0px 16px 0px 20px;
padding: 0px 32px 0px 20px;
margin-top: -10px;
}
.menuBox {
line-height: 57px;
height: 57px;
font-size: 14px;
color: rgba(86, 92, 102, 1);
margin-right: 24px;
cursor: pointer;
position: relative;
}
.menuTitle:hover {
color: #1e2633;
}
.menuBox:hover .productList {
display: block;
}
.triangle {
width: 16px;
height: 16px;
position: relative;
top: 4px;
transition: width 1s;
-webkit-transition: width 1s;
}
.menuBox:hover .triangle {
transform: rotateX(180deg);
}
.productList {
position: absolute;
top: 57px;
left: -16px;
padding: 8px 0;
display: none;
background: #ffffff;
box-shadow: 0px 3px 10px 0px rgba(0, 24, 57, 0.14);
border-radius: 4px;
z-index: 1002;
}
.productLi {
min-width: 142px;
height: 36px;
padding: 7px 50px 7px 16px;
font-size: 14px;
color: rgba(30, 38, 51, 1);
line-height: 22px;
cursor: pointer;
position: relative;
box-sizing: border-box;
}
.productLi:hover {
color: rgba(19, 112, 255, 1);
}
.productLiActive {
color: rgba(19, 112, 255, 1);
}
.selectActive {
width: 16px;
height: 16px;
position: absolute;
top: 10px;
right: 12px;
}
.uploadIconBox {
width: 32px;
height: 32px;
......@@ -39,16 +99,14 @@
}
.topRightItem {
margin-right: 20px;
margin-right: 24px;
}
.ArrowDropDownIconRoot {
.topRightTriangle {
color: #8a9099;
transition: all 0.2s !important;
transform: rotate(0);
}
.ArrowDropDownIconRootOpen {
.topRightTriangleOpen {
color: #8a9099;
transform: rotate(180deg);
}
......
src/views/ConsoleLayout/index.tsx
View file @ 4a4e2d07
import React, { useEffect, useState } from "react";
import { Outlet, useLocation, useNavigate } from "react-router-dom";
import cx from "classnames";
import { observer } from "mobx-react-lite";
import ArrowDropDownIcon from "@mui/icons-material/ArrowDropDown";
import Avatar from "@mui/material/Avatar";
import { Box, Menu, MenuItem } from "@mui/material";
import classNames from "classnames";
import uploadIcon from "@/assets/img/uploadIcon.svg";
import triangle from "@/assets/project/triangle.svg";
import selectActive from "@/assets/project/selectActive.svg";
import globalText from "@/utils/globalText_CN";
import useIndex from "./useIndex";
import { useStores } from "@/store/index";
import MyButton from "@/components/mui/MyButton";
import logo from "@/assets/img/logo.svg";
import MyPopover from "@/components/mui/MyPopover";
import TranSferList from "./components/TransferList";
import { getProjectList } from "@/api/project_api";
import useMyRequest from "@/hooks/useMyRequest";
import { toJS } from "mobx";
import {
setFileServerEndPointLocalStorage,
getFiletokenAccordingToId,
......@@ -25,29 +25,19 @@ import {
import style from "./index.module.css";
const ConsoleLayout = observer(() => {
const {
productAnchorEl,
utilityAnchorEl,
productOpen,
utilityOpen,
handleProductClick,
handleUtilityClick,
handleClose,
} = useIndex();
const { utilityAnchorEl, utilityOpen, handleUtilityClick, handleClose } =
useIndex();
const [currentProduct, setCurrentProduct] = useState<{
path: string;
name: string;
}>();
const { currentProjectStore } = useStores();
const { currentProjectStore, fileListStore } = useStores();
const { openFileList, setOpenFileList } = fileListStore;
const productInfo = toJS(currentProjectStore.currentProductInfo);
const { run: runGetProjectList } = useMyRequest(getProjectList, {
onSuccess: (res) => {
let list = res.data;
if (list.length === 0) {
currentProjectStore.setProjectList([]);
currentProjectStore.changeProject({});
navigate(currentProduct?.path as string);
navigate(productInfo?.path as string);
} else {
currentProjectStore.setProjectList(list);
currentProjectStore.changeProject(list[0]);
......@@ -56,15 +46,18 @@ const ConsoleLayout = observer(() => {
list[0].filetoken = res;
currentProjectStore.changeProject(list[0]);
});
navigate(currentProduct?.path as string);
navigate(productInfo?.path as string);
}
},
});
// 切换产品
const getProduct = (item: any) => {
currentProjectStore.changeProductInfo({ id: item.id, name: item.name });
setCurrentProduct(item);
currentProjectStore.changeProductInfo({
id: item.id,
name: item.name,
path: item.path,
});
runGetProjectList({
product: item.id,
});
......@@ -83,62 +76,54 @@ const ConsoleLayout = observer(() => {
<Box className={style.topApp}>
<Box className={style.topLeftBox}>
<img src={logo} alt="" className={style.logo} />
<MyButton
{/* <MyButton
text={globalText.console}
variant={"text"}
style={{ color: "#565C66" }}
onClick={() => navigate("/home")}
/>
/> */}
<div className={style.menuBox} onClick={() => navigate("/home")}>
<div className={style.menuTitle}>{globalText.console}</div>
</div>
<Box sx={{ display: "flex", alignItems: "center" }}>
<MyButton
text={globalText.product}
variant={"text"}
style={{ color: "#565C66", paddingLeft: '8px' }}
onClick={handleProductClick}
dropValue={productOpen}
drop={true}
/>
{/* <ArrowDropDownIcon classes={{
root: cx({
[style.ArrowDropDownIconRoot]: true,
[style.ArrowDropDownIconRootOpen]: Boolean(productOpen)
})
}} /> */}
<Menu
id="product-menu"
anchorEl={productAnchorEl}
open={productOpen}
onClose={handleClose}
classes={{
paper: style.menuPaper,
}}
MenuListProps={{
"aria-labelledby": "product-button",
}}
>
<div className={style.menuBox}>
<div className={style.menuTitle}>
<span>{globalText.product}</span>
<img className={style.triangle} src={triangle} alt="" />
</div>
<div className={style.productList}>
{menuStore.productList.map((item) => {
return (
<MenuItem
<div
key={item.path}
classes={{
root: style.menuItemRoot,
}}
className={classNames({
[style.productLi]: true,
[style.productLiActive]: productInfo.path === item.path,
})}
onClick={() => {
getProduct(item);
handleClose();
}}
>
{item.name}
</MenuItem>
{productInfo.path === item.path && (
<img
className={style.selectActive}
src={selectActive}
alt=""
/>
)}
</div>
);
})}
</Menu>
</Box>
</div>
</div>
</Box>
<Box className={style.topRightBox}>
<MyPopover
open={openFileList}
changeOpen={(val) => setOpenFileList(val)}
content={<TranSferList />}
transformOrigin={{
vertical: "top",
......@@ -152,7 +137,6 @@ const ConsoleLayout = observer(() => {
style={{ verticalAlign: "middle" }}
/>
</div>
</MyPopover>
<Box className={style.topRightItem}>
<Box
......@@ -170,13 +154,13 @@ const ConsoleLayout = observer(() => {
>
H
</Avatar>
<ArrowDropDownIcon
classes={{
root: cx({
[style.ArrowDropDownIconRoot]: true,
[style.ArrowDropDownIconRootOpen]: Boolean(utilityOpen),
}),
}}
<img
className={classNames({
[style.topRightTriangle]: true,
[style.topRightTriangleOpen]: Boolean(utilityOpen),
})}
src={triangle}
alt=""
/>
</Box>
......@@ -213,4 +197,4 @@ const ConsoleLayout = observer(() => {
);
});
export default ConsoleLayout;
\ No newline at end of file
export default ConsoleLayout;
src/views/CustomOperator/components/OperatorList/index.module.css
View file @ 4a4e2d07
......@@ -32,7 +32,7 @@
}
.list {
height: calc(100% - 55px);
overflow-y: auto;
overflow-y: overlay;
padding: 15px 20px;
box-sizing: border-box;
}
......
src/views/CustomOperator/components/SaveOperator/index.tsx
View file @ 4a4e2d07
......@@ -202,6 +202,7 @@ const SaveOperator = (props: IProps) => {
<span
style={{
position: "absolute",
fontSize: "14px",
bottom: "7px",
right: "12px",
color: description.length >= 300 ? "#d32f2f" : "#C2C6CC",
......
src/views/CustomOperator/index.tsx
View file @ 4a4e2d07
......@@ -27,18 +27,14 @@ const CustomOperator = observer((props: IProps) => {
/** 设置选中唯一标识符 */
const handleNodeClick = useCallback((val: string) => {
// setSelectTaskId(val);
// console.log(val);
}, []);
// 判断 每个流算子必须至少有一条连接线。
const checkHasOneLine = (sourceArr: string[], targetArr: string[]) => {
console.log("checkHasOneLine");
const all = _.uniq([...sourceArr, ...targetArr]);
if (all.length === operatorList.length) {
console.log("checkHasOneLine1");
return true;
} else {
console.log("checkHasOneLine2");
return false;
}
// _.uniq([2, 1, 2]);
......@@ -46,7 +42,6 @@ const CustomOperator = observer((props: IProps) => {
// 判断 每个起始算子（可以有多个起始点）的输入必须为文件的路径输入或数据集的路径输入。
const checkIn = (targetArr: string[]) => {
console.log("checkIn");
const uniqTargetArr = _.uniq(targetArr);
if (uniqTargetArr.length === operatorList.length) {
// 流节点连成一个圈了
......@@ -82,7 +77,6 @@ const CustomOperator = observer((props: IProps) => {
// 判断 起码有一个结尾算子（可以有多个结尾点）的输出必须为文件保存或数据集保存。
const checkOut = (sourceArr: string[]) => {
console.log("checkOut");
const uniqSourceArr = _.uniq(sourceArr);
if (uniqSourceArr.length === operatorList.length) {
// 流节点连成一个圈了
......@@ -134,22 +128,18 @@ const CustomOperator = observer((props: IProps) => {
edge.target && targetArr.push(edge.target);
});
});
console.log("operatorList", operatorList);
console.log("sourceArr", sourceArr);
console.log("targetArr", targetArr);
if (!checkHasOneLine([...sourceArr], [...targetArr])) {
console.log("checkHasOneLine");
Message.error("内容校验未通过，请检查！");
Message.error("部分算子没有流程线，请检查流程！");
return;
}
if (!checkIn([...targetArr])) {
console.log("checkIn");
Message.error("内容校验未通过，请检查！");
Message.error("每个流程第一步需读取文件/数据集，请检查流程！");
return;
}
if (!checkOut([...sourceArr])) {
console.log("checkOut");
Message.error("内容校验未通过，请检查！");
Message.error(
"每个流程最后一步必须将数据写入为文件/数据集，请检查流程！"
);
return;
}
setSaveFormDialog(true);
......
src/views/Home/index.module.css 0 → 100644
View file @ 4a4e2d07
.parentBox {
height: calc(100vh - 57px);
position: relative;
}
.centerBox {
position: absolute;
top: 40%;
left: 50%;
transform: translate(-50%, -50%);
}
.centerImg{
width: 186px;
height: 114px;
}
.centerText {
font-size: 14px;
color: #565C66;
line-height: 22px;
margin-top: 20px;
text-align: center;
}
.bottomText {
font-size: 14px;
color: #8A9099;
line-height: 22px;
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 20px;
}
\ No newline at end of file
src/views/Home/index.tsx
View file @ 4a4e2d07
import React from "react";
import style from "./index.module.css";
import building from "@/assets/img/building.png";
const Home = () => {
return <div>Home</div>;
return <div className={style.parentBox}>
<div className={style.centerBox}>
<img src={building} className={style.centerImg} />
<div className={style.centerText}>平台正在努力建设中…</div>
</div>
<div className={style.bottomText}>平台当前为beta版本，非最终品质</div>
</div>
};
export default Home;
src/views/MenuLayout/index.module.css
View file @ 4a4e2d07
......@@ -13,7 +13,7 @@
.content {
flex: 1;
height: calc(100vh - 57px);
overflow: scroll;
overflow: overlay;
}
.listItem {
padding: 8px 25px;
......@@ -27,6 +27,7 @@
}
.listItem:hover {
background-color: #eef1f5;
border-left: 3px solid #eef1f5;
}
.routerIcon {
vertical-align: middle;
......
src/views/MenuLayout/index.tsx
View file @ 4a4e2d07
......@@ -2,7 +2,7 @@
* @Author: 吴永生 15770852798@163.com
* @Date: 2022-08-02 11:43:28
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-03 19:05:48
* @LastEditTime: 2022-09-02 12:01:12
* @FilePath: /bkunyun/src/views/MenuLayout/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -17,64 +17,80 @@ import classnames from "classnames";
import { toJS } from "mobx";
const MenuLayout = observer(() => {
const { permissionStore, currentProjectStore } = useStores();
let pathname = new URL(window.location.href).pathname;
const { permissionStore, currentProjectStore } = useStores();
let pathname = new URL(window.location.href).pathname;
const navigate = useNavigate();
const navigate = useNavigate();
const productInfo = toJS(currentProjectStore.currentProductInfo);
const productInfo = toJS(currentProjectStore.currentProductInfo);
// 未选择产品时 直接跳转home页面
if (!productInfo.name) {
navigate("/home");
}
// 未选择产品时 直接跳转home页面
if (!productInfo.name) {
navigate("/home");
}
const routerIcon = (id: string, isSelect: boolean) => {
try {
const result = require(`../../assets/project/${id}${isSelect ? '_BLUE' : ''}.svg`)
return result || ''
} catch (error) {
console.log(error)
}
}
const routerIcon = (id: string, isSelect: boolean) => {
try {
const result = require(`../../assets/project/${id}${
isSelect ? "_BLUE" : ""
}.svg`);
return result || "";
} catch (error) {
console.log(error);
}
};
return (
<Box className={style.container}>
<Box className={style.aside}>
{
pathname.indexOf('userCenter') < 0 && <CurrentProject />
}
<List
sx={{
paddingTop: 0,
paddingBottom: 0,
}}
>
{permissionStore.sidebarRouters.map((item, index) => {
if (item.show) {
return (
<li
key={"sidebar" + index}
className={classnames({
[style.listItem]: true,
[style.active]: `/v3${item.path}` === pathname,
})}
onClick={() => item.type === "page" && navigate(item.path)}
>
<img className={style.routerIcon} src={routerIcon(item.id || '', `/v3${item.path}` === pathname) || undefined} alt='' />
<span style={{ verticalAlign: 'middle', fontWeight: '500' }}>{item.name}</span>
</li>
);
}
return null;
})}
</List>
</Box>
<Box className={style.content}>
<Outlet></Outlet>
</Box>
</Box>
);
return (
<Box className={style.container}>
<Box className={style.aside}>
{pathname.indexOf("userCenter") < 0 && <CurrentProject />}
<List
sx={{
paddingTop: 0,
paddingBottom: 0,
}}
>
{permissionStore.sidebarRouters.map((item, index) => {
if (item.show) {
return (
<li
key={"sidebar" + index}
className={classnames({
[style.listItem]: true,
[style.active]: `/v3${item.path}` === pathname,
})}
style={
`/v3${item.path}` === pathname
? { borderLeft: "3px solid #1370ff" }
: undefined
}
onClick={() => item.type === "page" && navigate(item.path)}
>
<img
className={style.routerIcon}
src={
routerIcon(
item.id || "",
`/v3${item.path}` === pathname
) || undefined
}
alt=""
/>
<span style={{ verticalAlign: "middle", fontWeight: "500" }}>
{item.name}
</span>
</li>
);
}
return null;
})}
</List>
</Box>
<Box className={style.content}>
<Outlet></Outlet>
</Box>
</Box>
);
});
export default MenuLayout;
src/views/Project/ProjectData/DeleteDialog/index.tsx
View file @ 4a4e2d07
......@@ -89,6 +89,7 @@ const DeleteDialog = (props: IDeleteFileProps) => {
open={deleteDialogOpen}
onClose={() => setDeleteDialogOpen(false)}
onConfirm={handleSubmit}
okColor="error"
>
{currentOperateFile
? "确认删除该数据吗？"
......
src/views/Project/ProjectData/MoveFile/index.module.css
View file @ 4a4e2d07
.rootTitle {
border-radius: 4px 4px 0 0;
background-color: rgba(25, 118, 210, 0.08);
/* background-color: rgba(25, 118, 210, 0.5); */
line-height: 44px;
color: rgba(30, 38, 51, 1);
font-size: 14px;
font-weight: 600;
display: flex;
justify-content: flex-start;
align-items: center;
border-radius: 4px 4px 0 0;
background-color: rgba(25, 118, 210, 0.08);
line-height: 44px;
color: rgba(30, 38, 51, 1);
font-size: 14px;
font-weight: 600;
display: flex;
justify-content: flex-start;
align-items: center;
}
.rootTitleActive {
background-color: rgba(25, 118, 210, 0.2);
background-color: rgba(25, 118, 210, 0.2);
}
.bigFolderIcon {
margin: 0 9px;
margin: 0 9px;
}
.treeLabel {
display: flex;
justify-content: flex-start;
align-items: center;
display: flex;
justify-content: flex-start;
align-items: center;
}
.treeLabelText{
line-height: 44px;
overflow: hidden;
text-overflow: ellipsis;
-o-text-overflow:ellipsis;
white-space: nowrap;
width: 320px;
.treeLabelText {
line-height: 44px;
overflow: hidden;
text-overflow: ellipsis;
-o-text-overflow: ellipsis;
white-space: nowrap;
width: 320px;
}
.labelFolderIcon {
margin-right: 9px;
margin-right: 9px;
}
src/views/Project/ProjectData/SeeDataset/index.module.css
View file @ 4a4e2d07
......@@ -42,7 +42,7 @@
}
.table {
flex: 1;
overflow-y: auto;
overflow-y: overlay;
display: flex;
flex-direction: column;
}
......@@ -101,7 +101,7 @@
}
.datasetLiDataList {
flex: 1;
overflow: auto;
overflow: overlay;
}
.noDataList {
flex: 1;
......
src/views/Project/ProjectData/SeeDataset/index.tsx
View file @ 4a4e2d07
......@@ -19,6 +19,7 @@ import classNames from "classnames";
import Save from "./save";
import NoData from "@/components/BusinessComponents/NoData";
import Download from "./download";
import MyTooltip from "@/components/mui/MyTooltip";
import style from "./index.module.css";
type ISeeDatasetProps = {
......@@ -117,14 +118,15 @@ const SeeDataset = observer((props: ISeeDatasetProps) => {
Object.keys(res.data.list[0]).forEach((item) => {
if (
![
"canonical_smiles",
"meta",
"id",
"mol",
"mol2",
"pdb",
"sdf",
"sdf2d",
"sdf3d",
// "canonical_smiles",
// "mol",
// "mol2",
// "pdb",
// "sdf",
// "sdf2d",
// "sdf3d",
// "smiles",
].includes(item)
) {
......@@ -156,6 +158,7 @@ const SeeDataset = observer((props: ISeeDatasetProps) => {
searchDataType,
sort,
keyword,
firstGetList,
// Message,
]
);
......@@ -219,11 +222,12 @@ const SeeDataset = observer((props: ISeeDatasetProps) => {
<div className={style.screensRight}>
<MySelect
options={dataTypes}
title="选择属性"
title={dataTypes.length === 0 ? "暂无属性" : "选择属性"}
isTitle={true}
value={searchDataType}
onChange={handleSearchDataTypeChange}
fullWidth={false}
disabled={dataTypes.length === 0}
sx={{
width: "160px",
marginRight: "16px",
......@@ -267,8 +271,8 @@ const SeeDataset = observer((props: ISeeDatasetProps) => {
sx={{
width: "340px",
marginRight: "16px",
height: "32px",
}}
size="small"
></MyInput>
<MyButton
text="确认"
......@@ -313,7 +317,7 @@ const SeeDataset = observer((props: ISeeDatasetProps) => {
</div>
{showData.length !== 0 && (
<div className={style.datasetLiDataList}>
{Object.keys(item.meta)
{Object.keys(item)
.filter((key) => showData.indexOf(key) !== -1)
.map((key, index) => {
return (
......@@ -326,11 +330,13 @@ const SeeDataset = observer((props: ISeeDatasetProps) => {
>
{key}
</span>
<span
className={style.datasetLiDataLiValue}
>
{item.meta[key]}
</span>
<MyTooltip title={item[key]}>
<span
className={style.datasetLiDataLiValue}
>
{item[key]}
</span>
</MyTooltip>
</div>
);
})}
......
src/views/Project/ProjectData/UpLoaderFile/index.module.css
View file @ 4a4e2d07
......@@ -50,10 +50,6 @@
box-sizing: border-box;
position: relative;
}
/* .tableBox {
height: 300px;
overflow: scroll;
} */
.fileIconBox {
display: flex;
justify-content: flex-start;
......
src/views/Project/ProjectData/UpLoaderFile/index.tsx
View file @ 4a4e2d07
......@@ -135,6 +135,7 @@ const UpLoaderFile = observer((props: IMoveFileProps) => {
};
}) || [];
toJS(fileListStore?.setNewFileList)(newFileList);
fileListStore?.setOpenFileList(true);
if (newFileList?.length) {
getFileToken(newFileList);
}
......@@ -172,14 +173,14 @@ const UpLoaderFile = observer((props: IMoveFileProps) => {
const renderButtons = (item: any, index: number) => {
return (
<MyButton
text='删除'
style={{ position: "relative", left: "-18px" }}
variant="text"
size="small"
color="error"
onClick={() => handleRowDelete(index)}
/>
<MyButton
text="删除"
style={{ position: "relative", left: "-18px" }}
variant="text"
size="small"
color="error"
onClick={() => handleRowDelete(index)}
/>
);
};
......
src/views/Project/ProjectData/index.module.css
View file @ 4a4e2d07
......@@ -32,6 +32,9 @@
color: #1e2633;
line-height: 22px;
font-weight: 600;
display: flex;
justify-content: flex-start;
align-items: center;
}
.projectDataTabsAndBtton {
......@@ -40,6 +43,11 @@
align-items: center;
}
.refreshIcon {
width: 16px;
height: 16px;
}
.folderIconBox {
display: flex;
justify-content: flex-start;
......@@ -72,8 +80,9 @@
line-height: 22px;
font-size: 14px;
color: #1e2633;
/* display: flex;
align-items: center; */
display: flex;
justify-content: flex-start;
align-items: center;
}
.showPathI {
......
src/views/Project/ProjectData/index.tsx
View file @ 4a4e2d07
......@@ -2,9 +2,9 @@ import React, { useState, useCallback, useEffect, useMemo } from "react";
import style from "./index.module.css";
import classnames from "classnames";
import { IconButton } from "@mui/material";
import RefreshIcon from "@mui/icons-material/Refresh";
import MyTable from "@/components/mui/MyTable";
import dataSetIcon from "@/assets/project/dataSetIcon.svg";
import refresh from "@/assets/project/refresh.svg";
import fileIcon from "@/assets/project/fileIcon.svg";
import folderIcon from "@/assets/project/folderIcon.svg";
import noFile from "@/assets/project/noFile.svg";
......@@ -27,6 +27,7 @@ import SeeDataset from "./SeeDataset";
import { getDataFind, getDataFileSearch } from "@/api/project_api";
import MyButton from "@/components/mui/MyButton";
import SearchInput from "@/components/BusinessComponents/SearchInput";
import ChevronRightIcon from "@mui/icons-material/ChevronRight";
const ProjectData = observer(() => {
const isPass = usePass();
......@@ -68,7 +69,7 @@ const ProjectData = observer(() => {
useEffect(() => {
const locationInfo: any = location?.state;
setActiveTab(locationInfo?.dataType || 'file')
setActiveTab(locationInfo?.dataType || "file");
setPath(locationInfo?.pathName || "/");
}, [location]);
......@@ -462,7 +463,13 @@ const ProjectData = observer(() => {
>
{index === 0 ? "ProjectData" : item}{" "}
{index === pathArr.length - 1 ? null : (
<i className={style.showPathI}>{">"}</i>
<ChevronRightIcon
sx={{
fontSize: "16px",
color: "rgba(194, 198, 204, 1)",
margin: "0px 4px",
}}
/>
)}
</span>
);
......@@ -494,10 +501,24 @@ const ProjectData = observer(() => {
: ""}
{index === pathArr.length - 1 ||
(index <= pathArr.length - 4 && index > 0) ? null : (
<i className={style.showPathI}>{">"}</i>
<ChevronRightIcon
sx={{
fontSize: "16px",
color: "rgba(194, 198, 204, 1)",
margin: "0px 4px",
}}
/>
)}
{index === 1 && "..."}
{index === 1 && <i className={style.showPathI}>{">"}</i>}
{index === 1 && (
<ChevronRightIcon
sx={{
fontSize: "16px",
color: "rgba(194, 198, 204, 1)",
margin: "0px 4px",
}}
/>
)}
</span>
);
});
......@@ -557,12 +578,17 @@ const ProjectData = observer(() => {
size="small"
onClick={handleRefresh}
disabled={!isPass("PROJECT_DATA_REFRESH", "USER")}
sx={{ marginLeft: "17px", width: '32px', height: '32px', ":hover": {
backgroundColor: "#F0F2F5 ",
borderRadius: 2
} }}
sx={{
marginLeft: "12px",
width: "32px",
height: "32px",
":hover": {
backgroundColor: "rgba(240, 242, 245, 1)",
borderRadius: "4px",
},
}}
>
<RefreshIcon sx={{ fontSize: "18px" }} />
<img className={style.refreshIcon} src={refresh} alt="" />
</IconButton>
</div>
</div>
......@@ -597,10 +623,9 @@ const ProjectData = observer(() => {
{selectIds.length > 0 && (
<div className={style.projectDataStickyBox}>
<MyButton
text={`批量删除（${selectIds.length}）`}
text={`批量删除 (${selectIds.length})`}
color="error"
variant="outlined"
size="small"
style={{ marginRight: "12px" }}
onClick={() => {
setCurrentOperateFile(null);
......@@ -609,10 +634,9 @@ const ProjectData = observer(() => {
disabled={!isPass("PROJECT_DATA_DELETE", "USER")}
/>
<MyButton
text={`批量移动（${selectIds.length}）`}
text={`批量移动 (${selectIds.length})`}
// color="neutral"
variant="contained"
size="small"
style={{ marginRight: "24px" }}
onClick={() => {
setCurrentOperateFile(null);
......
src/views/Project/ProjectJobDetail/LogView/index.module.css
View file @ 4a4e2d07
.logView {
position: absolute;
top: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, .5);
z-index: 1002;
position: absolute;
top: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
z-index: 1002;
}
.logViewBox {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 900px;
height: 600px;
background: #282C34;
box-shadow: 2px 4px 20px 0px rgba(0, 15, 45, 0.1200);
border-radius: 8px;
background: #282c34;
}
.close {
position: absolute;
right: 0;
top: -28px;
cursor: pointer;
color: #fff;
position: absolute;
right: 0;
top: -28px;
cursor: pointer;
color: #fff;
}
.logViewTop {
/* height: 30px; */
background-color: #1D2126;
border-radius: 8px 8px 0 0;
display: flex;
font-size: 12px;
color: #8A9099;
overflow: auto;
/* height: 30px; */
width: 100vw;
background-color: #1d2126;
/* border-radius: 8px 8px 0 0; */
display: flex;
font-size: 12px;
color: #8a9099;
/* overflow: overlay; */
}
.logViewTop::-webkit-scrollbar-track {
background-color: #282C34;
}
background-color: #282c34;
}
.logTitle {
display: flex;
align-items: center;
height: 30px;
line-height: 20px;
padding: 0 24px;
cursor: pointer;
display: flex;
width: 0;
max-width: 200px;
overflow: hidden;
white-space: nowrap;
text-overflow:ellipsis;
flex: 1;
align-items: center;
height: 30px;
line-height: 20px;
padding: 0 24px;
cursor: pointer;
border-right: 1px solid #10141A;
}
.logTitleSelected {
background: #282C34;
color: #FFFFFF;
background: #282c34;
color: #ffffff;
}
.fileIcon{
width: 14px!important;
margin-right: 4px;
.fileIcon {
width: 14px !important;
margin-right: 4px;
}
.logViewContent {
position: relative;
box-sizing: border-box;
height: 510px;
padding: 16px 24px 0;
color: #D1D6DE;
white-space:pre-wrap;
word-break: break-word;
overflow: auto;
font-size: 14px;
line-height: 22px;
position: relative;
box-sizing: border-box;
height: calc(100vh - 148px);
padding: 24px 32px 0;
color: #d1d6de;
white-space: pre-wrap;
word-break: break-word;
overflow: overlay;
font-size: 14px;
line-height: 22px;
}
.logViewContentMask{
height: 16px;
width: 852px;
background-color: #282C34;
position: absolute;
top: 30px;
left: 24px;
z-index: 1005;
.logViewContentMask {
height: 24px;
width: calc(100vw - 64px);
background-color: #282c34;
position: absolute;
top: 30px;
left: 32px;
z-index: 1005;
}
.logViewContent::-webkit-scrollbar-track {
background-color: #282C34;
background-color: #282c34;
}
.logViewBottom {
display: flex;
align-items: center;
justify-content: end;
height: 60px;
padding-right: 24px;
display: flex;
align-items: center;
justify-content: end;
height: 76px;
padding-right: 24px;
}
\ No newline at end of file
src/views/Project/ProjectJobDetail/LogView/index.tsx
View file @ 4a4e2d07
......@@ -7,16 +7,18 @@ import InsertDriveFileOutlinedIcon from "@mui/icons-material/InsertDriveFileOutl
import CloudEController from "@/api/fileserver/CloudEController";
import { useStores } from "@/store";
import { toJS } from "mobx";
import FullScreenDrawer from "@/components/CommonComponents/FullScreenDrawer";
type LogViewProps = {
isshow: boolean;
handleClose: () => void;
logs: any[];
setShowAddTemplate: any;
};
const LogView = (props: LogViewProps) => {
const { isshow, handleClose, logs } = props;
const { isshow, handleClose, logs, setShowAddTemplate } = props;
const { currentProjectStore } = useStores();
const fileToken = toJS(currentProjectStore.currentProjectInfo.filetoken);
const projectId = toJS(currentProjectStore.currentProjectInfo.id);
......@@ -42,7 +44,7 @@ const LogView = (props: LogViewProps) => {
)?.then((res) => {
setLogText(res.data)
})
}else{
} else {
setLogText("")
}
}, [logPath]);
......@@ -53,41 +55,42 @@ const LogView = (props: LogViewProps) => {
}, [logCurrent]);
// 下载当前日志
const handleDownLoad=()=>{
const handleDownLoad = () => {
const path = logPath.slice(12)
CloudEController.JobFileDownload(
path,
fileToken as string,
projectId as string
);
path,
fileToken as string,
projectId as string
);
}
return <div className={style.logView} style={isshow ? {} : { display: "none" }}>
<div className={style.logViewBox}>
<CloseIcon onClick={handleClose} className={style.close} />
<div className={style.logViewContentMask}></div>
<div className={style.logViewTop}>
{logs.map((item: any, index: number) => {
return <div
key={index}
onClick={() => { setLogCurrent(index) }}
className={classnames({
[style.logTitle]: true,
[style.logTitleSelected]: index === logCurrent,
})}>
<InsertDriveFileOutlinedIcon className={style.fileIcon} />
<span>{item.logName}</span>
</div>
})}
return (
<FullScreenDrawer handleClose={setShowAddTemplate} zIndex={1002}>
<div className={style.logViewBox}>
<div className={style.logViewContentMask}></div>
<div className={style.logViewTop}>
{logs.map((item: any, index: number) => {
return <div
key={index}
onClick={() => { setLogCurrent(index) }}
className={classnames({
[style.logTitle]: true,
[style.logTitleSelected]: index === logCurrent,
})}>
<InsertDriveFileOutlinedIcon className={style.fileIcon} />
<span>{item.logName}</span>
</div>
})}
</div>
<div className={style.logViewContent}>
{logText}
</div>
<div className={style.logViewBottom}>
<MyButton text='下载当前日志' onClick={handleDownLoad} />
</div>
</div>
<div className={style.logViewContent}>
{logText}
</div>
<div className={style.logViewBottom}>
<MyButton text='下载当前日志' onClick={handleDownLoad} />
</div>
</div>
</div>
</FullScreenDrawer>
)
}
export default LogView
\ No newline at end of file
src/views/Project/ProjectJobDetail/index.module.css
View file @ 4a4e2d07
......@@ -6,7 +6,7 @@
width: 100vw;
height: 100vh;
background-color: RGBA(247, 248, 250, 1);
overflow-y: auto;
overflow-y: overlay;
}
.swHeader {
z-index: 1001;
......@@ -14,7 +14,7 @@
top: 0;
height: 56px;
background-color: #fff;
box-shadow: 0px 3px 10px 0px rgba(0, 24, 57, 0.04);
box-shadow: 0px 3px 10px 0px rgba(0, 24, 57, 0.06);
display: flex;
justify-content: space-between;
align-items: center;
......@@ -25,6 +25,9 @@
justify-content: flex-start;
align-items: center;
}
.goBackIcon {
cursor: pointer;
}
.swTemplateTitle {
margin: 0 19px 0 8px;
line-height: 22px;
......@@ -39,9 +42,9 @@
}
.swFormBox {
background-color: #fff;
border-right: 1xp solid rgba(235, 237, 240, 1);
border-right: 1px solid #ebedf0;
width: 360px;
overflow-y: scroll;
overflow-y: overlay;
box-sizing: border-box;
padding: 24px;
}
......@@ -74,7 +77,7 @@
color: rgba(19, 112, 255, 1);
font-size: 14px;
}
.outputItemName{
.outputItemName {
max-width: 172px;
white-space: nowrap;
display: block;
......@@ -107,8 +110,14 @@
color: rgba(138, 144, 153, 1);
font-size: 14px;
line-height: 22px;
width: 72px;
width: 80px;
margin-right: 44px;
overflow: hidden;
word-wrap: break-word;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.taskInfoValue {
color: rgba(30, 38, 51, 1);
......@@ -164,7 +173,7 @@
position: absolute;
top: 33px;
max-height: 230px;
overflow-y: scroll;
overflow-y: overlay;
padding: 8px 0px;
background: #ffffff;
box-shadow: 0px 3px 10px 0px rgba(0, 24, 57, 0.14);
......
src/views/Project/ProjectOverview/TaskCard/index.module.css
View file @ 4a4e2d07
.cardBox {
display: flex;
margin: 16px 16px 0;
height: 156px;
background: #FFFFFF;
box-shadow: 2px 2px 6px 0px rgba(0, 25, 57, 0.0300);
border-radius: 4px;
display: flex;
margin: 16px 16px 0;
height: 156px;
background: #ffffff;
box-shadow: 2px 2px 6px 0px rgba(0, 25, 57, 0.03);
border-radius: 4px;
}
.dividingLine {
height: 156px;
border-left: 1px solid #EBEDF0;
position: relative;
height: 156px;
border-left: 1px solid #ebedf0;
position: relative;
}
.arrow {
position: absolute;
top: 65px;
left: -13px;
width: 26px;
height: 26px;
background-color: #fff;
border-top: 1px solid #EBEDF0;
border-right: 1px solid #EBEDF0;
transform: rotate(45deg);
position: absolute;
top: 65px;
left: -13px;
width: 26px;
height: 26px;
background-color: #fff;
border-top: 1px solid #ebedf0;
border-right: 1px solid #ebedf0;
transform: rotate(45deg);
}
.cardLeft {
flex: 1;
padding: 16px 24px;
flex: 1;
cursor: pointer;
padding: 16px 24px;
}
.topLine {
display: flex;
justify-content: space-between;
display: flex;
justify-content: space-between;
}
.taskName {
min-width: 100px;
font-size: 14px;
line-height: 22px;
font-weight: 500;
cursor: pointer;
min-width: 100px;
font-size: 14px;
line-height: 22px;
font-weight: 500;
cursor: pointer;
}
.taskName:hover{
color: #1370FF;
.taskName:hover {
color: #1370ff;
}
.taskStatus {
display: flex;
align-items: center;
justify-content: center;
width: 78px;
height: 22px;
border-radius: 2px;
font-size: 12px;
display: flex;
align-items: center;
justify-content: center;
width: 78px;
height: 22px;
border-radius: 2px;
font-size: 12px;
}
.statusImg {
width: 10px;
height: 10px;
margin-right: 5px;
width: 10px;
height: 10px;
margin-right: 5px;
}
.taskCreator {
font-size: 12px;
line-height: 20px;
color: #1E2633;
margin-top: 4px;
font-size: 12px;
line-height: 20px;
color: #1e2633;
margin-top: 4px;
}
.taskProgress {
height: 32px;
margin: 12px 0;
height: 32px;
margin: 12px 0 16px;
}
.progressInfo {
display: flex;
justify-content: space-between;
margin-bottom: 8px;
font-size: 12px;
color: #565C66;
display: flex;
justify-content: space-between;
margin-bottom: 8px;
font-size: 12px;
color: #565c66;
}
.bottomLine {
display: flex;
font-size: 12px;
color: #565C66;
display: flex;
font-size: 12px;
color: #565c66;
}
.bottomInfo {
margin: 0 40px 0 4px;
margin: 0 40px 0 4px;
}
.cardRight {
flex: 1;
display: flex;
position: relative;
overflow: auto;
flex: 1;
display: flex;
position: relative;
overflow: overlay;
padding: 16px 24px 16px 42px;
}
.noResult {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 14px;
color: #8A9099;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 14px;
color: #8a9099;
}
.resultBox {
padding: 16px 24px 16px 42px;
width: 100%;
display: flex;
flex-wrap: wrap;
align-content: flex-start;
/* padding: 16px 24px 16px 42px; */
width: 100%;
display: flex;
flex-wrap: wrap;
align-content: flex-start;
box-sizing: border-box;
}
.result {
box-sizing: border-box;
font-size: 12px;
color: #1E2633;
cursor: pointer;
height: 30px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
padding-right: 8px;
box-sizing: border-box;
font-size: 12px;
align-items: center;
color: #1e2633;
cursor: pointer;
height: 30px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
padding-right: 8px;
}
@media screen and (max-width:1220px) {
.result {
width: 100%;
}
@media screen and (max-width: 1220px) {
.result {
width: 100%;
}
}
@media screen and (min-width:1220px) and (max-width:1600px) {
.result {
width: 50%;
}
@media screen and (min-width: 1220px) and (max-width: 1600px) {
.result {
width: 50%;
}
}
@media screen and (min-width:1600px) {
.result {
width: 33.33%;
}
@media screen and (min-width: 1600px) {
.result {
width: 33.33%;
}
}
.result:hover {
color: #1370FF;
color: #1370ff;
}
.outputLeftImg {
vertical-align: middle;
margin-right: 8px;
}
\ No newline at end of file
vertical-align: top;
margin-right: 8px;
}
.outputTitle {
display: inline-block;
height: 22px;
line-height: 22px;
width: calc(100% - 30px);
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
src/views/Project/ProjectOverview/index.tsx
View file @ 4a4e2d07
This diff is collapsed.
src/views/Project/ProjectSetting/BaseInfo/index.module.css
View file @ 4a4e2d07
.loadingBox {
width: 100%;
display: flex;
justify-content: center;
align-items: center;
height: 300px;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
height: 300px;
}
.projectInfoList {
background-color: #fff;
position: relative;
background-color: #fff;
position: relative;
}
.projectInfoListLi {
margin-bottom: 24px;
margin-bottom: 24px;
}
.projectInfoListLiLabel {
color: #1e2633;
line-height: 22px;
font-size: 14px;
font-weight: 550;
margin-bottom: 8px;
color: #1e2633;
line-height: 22px;
font-size: 14px;
font-weight: 550;
margin-bottom: 8px;
}
.projectInfoName::after {
content: "*";
color: red;
content: "*";
color: red;
}
.projectInfoListLiValue {
width: 560px;
height: 36px;
border: 1px solid #e6e8eb;
border-radius: 4px;
color: #565c66;
padding: 0 12px;
box-sizing: border-box;
outline: none;
width: 560px;
height: 36px;
border: 1px solid #e6e8eb;
border-radius: 4px;
color: #565c66;
padding: 0 12px;
box-sizing: border-box;
outline: none;
}
.projectInfoListLiValue:focus {
border: 2px solid #136efa;
border: 2px solid #136efa;
}
.projectInfoTextarea {
line-height: 22px;
height: 82px;
padding: 7px 12px;
resize: none;
font-size: 14px;
position: relative;
width: 560px;
}
.projectInfoSelect {
width: 560px;
padding: 0 12px;
width: 560px;
padding: 0 12px;
}
.disable {
background: #f7f8fa;
background: #f7f8fa;
}
.projectInfoListLiText {
margin-bottom: 16px;
color: #8a9099;
font-size: 12px;
line-height: 20px;
margin-bottom: 16px;
color: #8a9099;
font-size: 12px;
line-height: 20px;
}
.deleteBox {
width: 380px;
width: 380px;
}
.deleteText1 {
font-size: 14px;
line-height: 22px;
color: #ff4e4e;
margin-bottom: 20px;
font-size: 14px;
line-height: 22px;
color: #ff4e4e;
margin-bottom: 20px;
}
.deleteText2 {
color: #1e2633;
font-size: 14px;
line-height: 22px;
margin-bottom: 8px;
color: #1e2633;
font-size: 14px;
line-height: 22px;
margin-bottom: 8px;
}
.deleteText3 {
color: #1e2633;
font-size: 14px;
line-height: 22px;
margin-bottom: 20px;
color: #1e2633;
font-size: 14px;
line-height: 22px;
margin-bottom: 20px;
}
.deleteProjectName {
color: #1370ff;
color: #1370ff;
}
.deleteProjectInput {
width: 100%;
height: 36px;
border: 1px solid #e6e8eb;
border-radius: 4px;
color: #565c66;
padding: 0 12px;
box-sizing: border-box;
outline: none;
width: 100%;
height: 36px;
border: 1px solid #e6e8eb;
border-radius: 4px;
color: #565c66;
padding: 0 12px;
box-sizing: border-box;
outline: none;
}
.deleteProjectInput:focus {
border: 1px solid #136efa;
border: 1px solid #136efa;
}
src/views/Project/ProjectSubmitWork/ConfigForm/index.module.css
View file @ 4a4e2d07
......@@ -81,7 +81,7 @@
}
.taskConfigBox {
padding: 16px 24px 4px;
padding: 16px 0px 4px;
}
.flowTitle {
line-height: 16px;
......@@ -118,3 +118,13 @@
color: rgba(138, 144, 153, 1);
margin-left: 16px;
}
.bacthConfigBox {
padding: 0 24px 0;
}
.flowConfigBox {
border-bottom: 1px solid rgba(235, 237, 240, 1);
padding: 20px 24px 12px;
}
.flowConfigBox:nth-last-child(1) {
border-bottom: none;
}
src/views/Project/components/Flow/components/BatchNode/index.tsx
View file @ 4a4e2d07
......@@ -2,7 +2,7 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-07-12 11:20:29
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-22 16:41:54
* @LastEditTime: 2022-08-31 17:09:26
* @FilePath: /bkunyun/src/views/Project/components/Flow/components/BatchNode.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......
src/views/Project/components/Flow/components/FlowNode/index.module.css
View file @ 4a4e2d07
......@@ -44,3 +44,9 @@
width: 14px;
height: 14px;
}
.handleBox {
background: #fff;
width: 6px;
height: 6px;
}
src/views/Project/components/Flow/index.tsx
View file @ 4a4e2d07
This diff is collapsed.
src/views/WorkFlowEdit/index.module.css
View file @ 4a4e2d07
This diff is collapsed.
src/views/WorkFlowEdit/index.tsx
View file @ 4a4e2d07
This diff is collapsed.
src/views/mui_demo/button.tsx deleted 100644 → 0
View file @ ccb10292
This diff is collapsed.
src/views/mui_demo/input.tsx deleted 100644 → 0
View file @ ccb10292
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment