Skip to content

B
bkunyun
Commit 95d8fd24 authored by wuyongsheng's avatar wuyongsheng
Browse files
Options

Merge branch 'feat-20220801' into 'master' 

Feat 20220801

See merge request !99
parents c7f631b9 3e773173
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1554 additions and 670 deletions
src/api/api_manager.ts
View file @ 95d8fd24
......@@ -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/project_api.ts
View file @ 95d8fd24
......@@ -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 @ 95d8fd24
<?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/selectActive.svg 0 → 100644
View file @ 95d8fd24
<?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 @ 95d8fd24
<?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 @ 95d8fd24
<?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/style/public.css
View file @ 95d8fd24
/* 修改滚动条样式 */
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/SearchInput/index.tsx
View file @ 95d8fd24
......@@ -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 @ 95d8fd24
......@@ -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 @ 95d8fd24
.RadiosBox {
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
......@@ -20,7 +21,6 @@
border-radius: 2px;
line-height: 20px;
padding: 6px 16px;
/* background-color: #e6e8eb; */
flex: 1;
display: flex;
align-items: center;
......@@ -30,8 +30,7 @@
.radioActive {
color: #1370ff;
background-color: #fff;
box-shadow: 2px 4px 12px 0px rgba(0, 27, 63, 0.06);
position: relative;
}
.border {
width: 1px;
......@@ -41,3 +40,19 @@
.borderHidden {
visibility: hidden;
}
.radioActiveBgBox {
width: calc(100% - 2px);
position: absolute;
left: 1px;
top: 1px;
height: 28px;
}
.radioActiveBg {
box-shadow: 2px 4px 12px 0px rgba(0, 27, 63, 0.06);
height: 100%;
background-color: #fff;
transition: transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
border-radius: 2px;
width: 50%;
transform: translateX(0px);
}
src/components/CommonComponents/RadioGroupOfButtonStyle/index.tsx
View file @ 95d8fd24
......@@ -22,11 +22,26 @@ type IRadioGroupOfButtonStyleProps = {
handleRadio: any;
RadiosBoxStyle?: object;
radioStyle?: object;
radioActiveBgBoxStyle?: object;
};
const RadioGroupOfButtonStyle = (props: IRadioGroupOfButtonStyleProps) => {
const { radioOptions, value, handleRadio, RadiosBoxStyle, radioStyle } =
props;
const {
radioOptions,
value,
handleRadio,
RadiosBoxStyle,
radioStyle,
radioActiveBgBoxStyle,
} = props;
const radioWidth = useMemo(() => {
if (radioOptions.length) {
return Number((100 / radioOptions.length).toFixed(2));
} else {
return 100;
}
}, [radioOptions]);
const activeIndex: any = useMemo(() => {
let res = 0;
......@@ -40,6 +55,16 @@ const RadioGroupOfButtonStyle = (props: IRadioGroupOfButtonStyleProps) => {
return (
<div className={style.RadiosBox} style={RadiosBoxStyle}>
<div className={style.radioActiveBgBox} style={radioActiveBgBoxStyle}>
<div
className={style.radioActiveBg}
style={{
width: `${radioWidth}%`,
transform: `translateX(${activeIndex * 100}%)`,
}}
></div>
</div>
{radioOptions.map((options, index) => {
return (
<>
......
src/components/Material.Ui/SearchSelectCheckBox.jsx
View file @ 95d8fd24
......@@ -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 @ 95d8fd24
......@@ -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 @ 95d8fd24
......@@ -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 @ 95d8fd24
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,
......@@ -86,7 +85,7 @@ const MySnackbarProvider = ({
minHeight: "38px",
boxShadow: "none",
"& .MuiAlert-action": {
paddingLeft: "60px",
paddingLeft: "32px",
},
"&.MuiAlert-standardError": {
color: "#FF4E4E",
......@@ -122,6 +121,14 @@ const MySnackbarProvider = ({
},
});
const successIcon = (
<img
src={successIconSrc}
style={{ width: "16px", height: "16px", margin: "3px 0" }}
alt=""
/>
);
return (
<Fragment>
<ThemeProvider theme={theme}>
......
src/components/mui/MyBorderlessSelect.tsx 0 → 100644
View file @ 95d8fd24
/*
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2021-12-04 15:46:25
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-07-21 18:00:58
* @FilePath: /lionet-slb-pc/src/components/SearchView/components/Collapse.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
import InputLabel from "@mui/material/InputLabel";
import MenuItem from "@mui/material/MenuItem";
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;
value: string;
disabled?: boolean;
}
export const optionsTransform = (
arr: Array<any>,
labelKey: string = "label",
valueKey: string = "value",
disabledKey: string = "disabled"
): Array<IOption> => {
return arr.map((item: any) => {
return {
label: item[labelKey],
value: item[valueKey],
disabled: item[disabledKey],
};
});
};
interface IProps
extends Omit<SelectProps, "value" | "options" | "onChange" | "title"> {
value?: string;
options: IOption[];
onChange?: (val: string) => void;
/** 类型变种 */
variant?: "standard" | "outlined" | "filled";
/** title */
title?: string;
/** 是否显示title */
isTitle?: boolean;
/** 是否显示提示文案 */
error?: boolean;
/** 提示文案 */
helpertext?: string;
}
export default function MyBorderlessSelect(props: IProps) {
const {
value,
options,
title,
isTitle = false,
variant = "outlined",
multiple = false,
onChange,
fullWidth,
error = false,
helpertext,
...other
} = props;
const theme = createTheme({
components: {
MuiInputBase: {
styleOverrides: {
root: {
height: "36px",
"& .Mui-disabled": {
background: "rgba(247, 248, 250, 1)",
cursor: "not-allowed",
"& .MuiOutlinedInput-notchedOutline": {
borderWidth: '0px'
},
},
},
input: {
fontSize: "14px",
"&.Mui-focused":{
color:"#1370FF",
},
"&.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",
},
},
},
},
},
MuiMenuItem: {
styleOverrides: {
root: {
paddingRight: "46px",
fontSize: "14px",
lineHeight: "24px",
":hover": {
backgroundColor: "#F0F2F5 ",
color: "#1E2633",
},
},
},
},
MuiOutlinedInput: {
styleOverrides: {
root: {
"&.Mui-focused .MuiOutlinedInput-notchedOutline": {
borderWidth: "0px",
color: '#1370FF'
},
"& .MuiOutlinedInput-notchedOutline": {
borderColor: "#DDE1E6",
borderWidth: "0px",
},
"&.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",
},
},
},
},
},
},
MuiInputLabel: {
styleOverrides: {
root: {
fontSize: "14px",
// 下拉框未选择时的label定位
top: "-9px",
},
shrink: {
// 下拉框已经选择时的label定位
top: 0,
},
},
},
MuiSelect: {
styleOverrides: {
select: {
padding: "6.5px 14px",
fontSize: "14px",
},
},
},
MuiPaper: {
styleOverrides: {
root: {
boxShadow: "0px 3px 10px 0px rgba(0,24,57,0.14)",
},
},
},
},
});
const handleChange = (e: SelectChangeEvent<unknown>) => {
onChange && onChange(e.target.value as string);
};
return (
<ThemeProvider theme={theme}>
<FormControl fullWidth={fullWidth} variant={variant} error={error}>
{isTitle ? (
<InputLabel id="demo-simple-select-label">
{title || "请选择"}
</InputLabel>
) : null}
<Select
labelId="demo-simple-select-label"
id="demo-simple-select"
label={title || ""}
size="small"
multiple={multiple}
{...other}
value={value || ""}
onChange={handleChange}
>
{options.length
? options?.map((item: IOption, index) => {
return (
<MenuItem
value={item.value}
disabled={item?.disabled}
key={index}
>
{item.label}
{value === item.value && (
<img
style={{
width: "16px",
height: "16px",
position: "absolute",
top: "10px",
right: "12px",
}}
src={selectActive}
alt=""
/>
)}
</MenuItem>
);
})
: null}
</Select>
{helpertext && error && <FormHelperText>{helpertext}</FormHelperText>}
</FormControl>
</ThemeProvider>
);
}
src/components/mui/MyButton.tsx
View file @ 95d8fd24
......@@ -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 @ 95d8fd24
......@@ -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,34 @@ export const optionsTransform = (
});
};
const theme = createTheme({
components: {
MuiFormControlLabel: {
styleOverrides: {
label: {
fontSize: "14px",
},
},
},
MuiSvgIcon: {
styleOverrides: {
root: {
fontSize: "19px",
},
},
},
MuiCheckbox: {
styleOverrides: {
root: {
"&.Mui-checked .MuiSvgIcon-root": {
color: "rgba(19, 110, 250, 1)",
},
},
},
},
},
});
export default function MyCheckBox(props: IMyCheckBoxProps) {
const {
value,
......@@ -76,27 +105,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 @ 95d8fd24
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 @ 95d8fd24
......@@ -36,11 +36,16 @@ const MyInput = (props: MyInputProps) => {
height: "36px",
fontSize: "14px",
border: "rgba(221, 225, 230, 1)",
padding: "7px 12px",
"&.MuiInputBase-sizeSmall": {
height: "32px",
},
"& .Mui-disabled": {
"&.Mui-disabled": {
background: "rgba(247, 248, 250, 1)",
cursor: "not-allowed",
"& .MuiOutlinedInput-notchedOutline": {
borderColor: "#DDE1E6",
},
},
},
multiline: {
......@@ -49,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,
......@@ -68,26 +79,48 @@ const MyInput = (props: MyInputProps) => {
MuiOutlinedInput: {
styleOverrides: {
root: {
padding: "7px 12px",
"&.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": error
? {}
: {
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 @ 95d8fd24
......@@ -23,7 +23,7 @@ const theme = createTheme({
MuiMenu: {
styleOverrides: {
root: {
overflowY: "scroll",
overflow: "overlay",
},
},
},
......
src/components/mui/MyMultipleMenu.tsx
View file @ 95d8fd24
......@@ -14,7 +14,7 @@ const theme = createTheme({
MuiMenu: {
styleOverrides: {
root: {
overflowY: "scroll",
overflow: "overlay",
},
},
},
......
src/components/mui/MyPopconfirm.tsx
View file @ 95d8fd24
......@@ -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)",
padding: "8px 0px",
}}
>
<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: "16px 20px",
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 @ 95d8fd24
/*
* @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 @ 95d8fd24
......@@ -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,34 @@ export const optionsTransform = (
});
};
const theme = createTheme({
components: {
MuiFormControlLabel: {
styleOverrides: {
label: {
fontSize: "14px",
},
},
},
MuiSvgIcon: {
styleOverrides: {
root: {
fontSize: "19px",
},
},
},
MuiRadio: {
styleOverrides: {
root: {
"&.Mui-checked span": {
color: "rgba(19, 110, 250, 1)",
},
},
},
},
},
});
export default function MyRadio(props: IMyRadioProps) {
const {
value,
......@@ -55,28 +84,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 @ 95d8fd24
......@@ -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;
......@@ -73,10 +74,31 @@ export default function MySelect(props: IProps) {
height: "36px",
"& .Mui-disabled": {
background: "rgba(247, 248, 250, 1)",
cursor: "not-allowed",
"& .MuiOutlinedInput-notchedOutline": {
borderColor: "#DDE1E6",
},
},
"& .MuiSelect-icon": {
"&.Mui-disabled": {
display: "none",
},
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",
},
},
},
......@@ -86,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",
},
},
},
......@@ -97,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",
},
},
},
},
},
......@@ -109,6 +154,7 @@ export default function MySelect(props: IProps) {
MuiInputLabel: {
styleOverrides: {
root: {
fontSize: "14px",
// 下拉框未选择时的label定位
top: "-9px",
},
......@@ -127,6 +173,22 @@ export default function MySelect(props: IProps) {
},
},
},
MuiPaper: {
styleOverrides: {
root: {
boxShadow: "0px 3px 10px 0px rgba(0,24,57,0.14)",
},
},
},
// MuiFormControl: {
// styleOverrides: {
// root: {
// width: fullWidth ? "100%" : "auto",
// },
// },
// },
},
});
......@@ -161,6 +223,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 @ 95d8fd24
......@@ -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/components/EnhancedTableHead.tsx
View file @ 95d8fd24
/*
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-06-01 16:53:15
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-07-25 12:04:49
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-09-06 16:30:56
* @FilePath: /bkunyun/src/components/Material.Ui/Table/EnhancedTableHead.jsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -54,7 +54,7 @@ const EnhancedTableHead = (props: any) => {
classes={{ head: (k && headTableCell) || classes.headTableCell }}
>
{
headCell.sort && <TableSortLabel active={orderBy === headCell.id} direction={order} onClick={createSortHandler(headCell.id)} >
headCell.sort && <TableSortLabel style={{fontSize: "16px", fontWeight: '400', color: 'rgba(0, 0, 0, 0.87)', fontFamily: 'Roboto,Helvetica,Tahoma,Arial,"PingFang SC","Hiragino Sans GB","Heiti SC","WenQuanYi Micro Hei",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"'}} active={orderBy === headCell.id} direction={order} onClick={createSortHandler(headCell.id)} >
{headCell.label}
</TableSortLabel>
}
......
src/components/mui/MyTable/index.tsx
View file @ 95d8fd24
This diff is collapsed.
src/components/mui/MyTable/interface.ts
View file @ 95d8fd24
......@@ -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/MyTooltip.tsx
View file @ 95d8fd24
/*
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-07-11 11:56:58
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-07-22 10:51:10
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-09-08 13:55:20
* @FilePath: /bkunyun/src/components/mui/MyTooltip.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -39,7 +39,7 @@ const MyTooltip = (props: IMyTooltipProps) => {
<Tooltip
// interactive={true}
arrow
title={title}
title={title || ''}
placement={placement}
{...other}
>
......
src/components/mui/Tabs.tsx
View file @ 95d8fd24
......@@ -2,7 +2,7 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-05-31 10:18:13
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-31 20:25:56
* @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
*/
......@@ -28,7 +28,7 @@ interface ITabList {
interface IProps {
value?: string;
onChange?: (val: string)=> void;
onChange?: (val: string) => void;
tabList: ITabList[];
defaultValue?: string;
tabPanelSx?: any;
......@@ -88,27 +88,34 @@ const Tabs = (props: IProps) => {
: tabList.filter((e) => !e.hide)[0].value
);
const [hoverValue, setHoverValue] = useState('')
const [hoverValue, setHoverValue] = useState("");
const onTabChange = (val: string) => {
setTabValue(val)
setTabValue(val);
onChange && onChange(val);
};
const getImgSrc = useCallback((item: ITabList)=>{
let result = item.icon
if(value === item.value){
result = item.iconed
}
if(hoverValue === item.value){
result = item.iconHover
}
return result
},[hoverValue, value])
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 (
<div style={{ display: "flex", alignItems: "center" }} onMouseOver={()=>setHoverValue(item.value)} onMouseOut={()=>setHoverValue('')}>
<div
style={{ display: "flex", alignItems: "center" }}
onMouseOver={() => setHoverValue(item.value)}
onMouseOut={() => setHoverValue("")}
>
{item.icon ? (
<img
style={{ width: "16px", marginRight: "8px" }}
......
src/hooks/useMyRequest.ts
View file @ 95d8fd24
......@@ -21,7 +21,7 @@ const useMyRequest = <TData, TParams>(
defaultParams?: TParams[];
onBefore?: (params: TParams[]) => void;
onSuccess?: (data: TData, params: TParams[]) => void;
onError?: (e: Error, params: TParams[]) => void;
onError?: (e: any, params: TParams[]) => void;
onFinally?: (params: TParams[], data?: TData, e?: Error) => void;
loadingDelay?: number;
pollingInterval?: number;
......@@ -51,9 +51,16 @@ const useMyRequest = <TData, TParams>(
const request = useRequest(api, {
...defaultOptions,
onSuccess: () => {},
onError: (data) => {
onSuccess: () => { },
onError: (data: any) => {
Message.error(data.message);
if (data.errorCode === '100003') {
setTimeout(() => {
localStorage.removeItem('token_key');
if (window.location.href && !window.location.href.includes("/login-page"))
window.location.href = '/v2/pages/login-page'
}, 4000);
}
},
...options,
});
......
src/hooks/usePass.ts
View file @ 95d8fd24
......@@ -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/store/modules/currentProject.ts
View file @ 95d8fd24
......@@ -18,6 +18,7 @@ type projectInfo = {
type productInfo = {
id?: string;
name?: string;
path?: string;
};
/** 用户信息 */
......
src/store/modules/fileList.ts
View file @ 95d8fd24
/*
* @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 @ 95d8fd24
.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 @ 95d8fd24
......@@ -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 @ 95d8fd24
/*
* @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 @ 95d8fd24
......@@ -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 @ 95d8fd24
import React, { useEffect, useState } from "react";
import React, { useEffect } 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,
});
......@@ -74,6 +67,15 @@ const ConsoleLayout = observer(() => {
const location = useLocation();
const { permissionStore, menuStore } = useStores();
// 不在产品页面下的时候清空当前产品
useEffect(() => {
if (location.pathname.slice(0, 8) !== "/product") {
currentProjectStore.setProjectList([]);
currentProjectStore.changeProject({});
currentProjectStore.changeProductInfo({});
}
}, [location, currentProjectStore]);
useEffect(() => {
permissionStore.setSidebarRouters(location.pathname);
}, [location, permissionStore]);
......@@ -83,62 +85,48 @@ const ConsoleLayout = observer(() => {
<Box className={style.topApp}>
<Box className={style.topLeftBox}>
<img src={logo} alt="" className={style.logo} />
<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 +140,6 @@ const ConsoleLayout = observer(() => {
style={{ verticalAlign: "middle" }}
/>
</div>
</MyPopover>
<Box className={style.topRightItem}>
<Box
......@@ -170,13 +157,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 +200,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 @ 95d8fd24
......@@ -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 @ 95d8fd24
......@@ -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 @ 95d8fd24
......@@ -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 @ 95d8fd24
.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 @ 95d8fd24
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 @ 95d8fd24
......@@ -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 @ 95d8fd24
......@@ -2,14 +2,14 @@
* @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
*/
import { Box, List } from "@mui/material";
import CurrentProject from "../Project/components/CurrentProject";
import React from "react";
import { Outlet, useNavigate } from "react-router-dom";
import { Outlet, useNavigate, useLocation } from "react-router-dom";
import style from "./index.module.css";
import { observer } from "mobx-react-lite";
import { useStores } from "@/store/index";
......@@ -17,64 +17,81 @@ 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);
const location = useLocation();
// 未选择产品时 直接跳转home页面
if (!productInfo.name) {
navigate("/home");
}
// 在产品页面下且未选择产品时 直接跳转home页面
if (!productInfo.name && location.pathname.slice(0, 8) === "/product") {
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 @ 95d8fd24
......@@ -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 @ 95d8fd24
.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 @ 95d8fd24
......@@ -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 @ 95d8fd24
......@@ -158,6 +158,7 @@ const SeeDataset = observer((props: ISeeDatasetProps) => {
searchDataType,
sort,
keyword,
firstGetList,
// Message,
]
);
......@@ -205,7 +206,7 @@ const SeeDataset = observer((props: ISeeDatasetProps) => {
},
]}
RadiosBoxStyle={{ width: "132px" }}
></RadioGroupOfButtonStyle>
/>
)}
<MyMultipleMenu
value={showData}
......@@ -221,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",
......@@ -269,8 +271,8 @@ const SeeDataset = observer((props: ISeeDatasetProps) => {
sx={{
width: "340px",
marginRight: "16px",
height: "32px",
}}
size="small"
></MyInput>
<MyButton
text="确认"
......
src/views/Project/ProjectData/UpLoaderFile/index.module.css
View file @ 95d8fd24
......@@ -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 @ 95d8fd24
......@@ -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 @ 95d8fd24
......@@ -32,6 +32,9 @@
color: #1e2633;
line-height: 22px;
font-weight: 600;
display: flex;
justify-content: flex-start;
align-items: center;
}
.projectDataTabsAndBtton {
......@@ -77,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 @ 95d8fd24
......@@ -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();
......@@ -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>
);
});
......@@ -551,7 +572,7 @@ const ProjectData = observer(() => {
{ value: "dataset", label: "数据集" },
]}
handleRadio={setActiveTab}
></RadioGroupOfButtonStyle>
/>
<IconButton
aria-label="refreshIcon"
size="small"
......@@ -602,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);
......@@ -614,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 @ 95d8fd24
.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;
position: relative;
width: 100vw;
background-color: #1d2126;
display: flex;
font-size: 12px;
color: #8a9099;
overflow: hidden;
}
.logViewTop::-webkit-scrollbar-track {
background-color: #282C34;
}
.leftButton {
width: 48px;
height: 32px;
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
border-right: 1px solid #10141A;
background-color: #1d2126;
}
.rightButton {
width: 48px;
height: 32px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
border-left: 1px solid #10141A;
background-color: #1d2126;
}
.middleFixed {
width: calc(100vw - 98px);
position: relative;
overflow: hidden;
}
.middleDynamic{
display: flex;
position: absolute;
left: 0;
}
.logTitle {
display: flex;
align-items: center;
height: 30px;
line-height: 20px;
padding: 0 24px;
cursor: pointer;
display: flex;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
flex-shrink: 0;
align-items: center;
height: 32px;
line-height: 20px;
padding: 0 20px;
cursor: pointer;
border-right: 1px solid #10141A;
}
.logName {
max-width: 90px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.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: 32px;
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 @ 95d8fd24
......@@ -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";
import ChevronLeftIcon from '@mui/icons-material/ChevronLeft';
import ChevronRightIcon from '@mui/icons-material/ChevronRight';
type LogViewProps = {
isshow: boolean;
handleClose: () => void;
logs: any[];
setShowLogView: any;
};
const LogView = (props: LogViewProps) => {
const { isshow, handleClose, logs } = props;
const { logs, setShowLogView } = 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,48 @@ 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>
return (
<FullScreenDrawer handleClose={setShowLogView} zIndex={1002}>
<div className={style.logViewBox}>
<div className={style.logViewContentMask}></div>
<div className={style.logViewTop}>
<div className={style.leftButton}><ChevronLeftIcon /></div>
<div className={style.middleFixed}>
<div className={style.middleDynamic}>
{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 className={style.logName}>{item.logName}</span>
</div>
})}
</div>
</div>
})}
<div className={style.rightButton}><ChevronRightIcon /></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 @ 95d8fd24
......@@ -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,9 +25,23 @@
justify-content: flex-start;
align-items: center;
}
.goBackIcon {
cursor: pointer;
}
.goBackIconBox {
width: 32px;
height: 32px;
border-radius: 4px;
display: flex;
align-items: center;
justify-content: center;
}
.goBackIconBox:hover {
background-color: rgb(240, 242, 245);
}
.swTemplateTitle {
margin: 0 19px 0 8px;
line-height: 22px;
margin: 0 19px 0 3px;
line-height: 20px;
font-size: 14px;
color: rgba(30, 38, 51, 1);
font-weight: 700;
......@@ -39,9 +53,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 +88,7 @@
color: rgba(19, 112, 255, 1);
font-size: 14px;
}
.outputItemName{
.outputItemName {
max-width: 172px;
white-space: nowrap;
display: block;
......@@ -107,8 +121,9 @@
color: rgba(138, 144, 153, 1);
font-size: 14px;
line-height: 22px;
width: 72px;
width: 80px;
margin-right: 44px;
word-wrap: break-word;
}
.taskInfoValue {
color: rgba(30, 38, 51, 1);
......@@ -121,6 +136,7 @@
word-break: break-all;
flex: 1;
justify-content: flex-end;
word-wrap: break-word;
}
.taskInfoValueClick {
cursor: pointer;
......@@ -164,7 +180,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);
......@@ -193,6 +209,7 @@
right: 24px;
bottom: 24px;
padding: 8px;
box-shadow: 0px 3px 10px 0px rgba(0, 24, 57, 0.06);
}
.fullScreenBox:hover {
opacity: 0.6;
......
src/views/Project/ProjectOverview/TaskCard/index.module.css
View file @ 95d8fd24
.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: 31px;
display: flex;
align-items: center;
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 @ 95d8fd24
This diff is collapsed.
src/views/Project/ProjectSetting/index.tsx
View file @ 95d8fd24
......@@ -39,7 +39,9 @@ const ProjectSetting = observer(() => {
if (currentProjectStore.currentProjectInfo.name) {
return (
<div style={{ padding: "28px 24px 24px" }}>
<div style={{ display: "flex", alignItems: "center" }}>
<div
style={{ display: "flex", alignItems: "center", marginBottom: "3px" }}
>
<span
style={{
fontSize: "18px",
......
src/views/Project/ProjectSubmitWork/ConfigForm/index.module.css
View file @ 95d8fd24
......@@ -2,7 +2,7 @@
position: relative;
}
.templateDescBox {
margin-bottom: 40px;
margin-bottom: 24px;
}
.templateDescTitle {
font-size: 16px;
......@@ -81,11 +81,10 @@
}
.taskConfigBox {
padding: 16px 24px 4px;
}
.flowTitle {
line-height: 16px;
margin: 3px 0 27px;
margin: 3px 0 25px;
color: rgba(19, 112, 255, 1);
font-size: 14px;
font-weight: 600;
......@@ -118,3 +117,13 @@
color: rgba(138, 144, 153, 1);
margin-left: 16px;
}
.bacthConfigBox {
padding: 16px 24px 4px;
}
.flowConfigBox {
border-bottom: 1px solid rgba(235, 237, 240, 1);
padding: 24px 24px 12px;
}
.flowConfigBox:nth-last-child(1) {
border-bottom: none;
}
src/views/Project/components/CurrentProject/index.tsx
View file @ 95d8fd24
......@@ -33,7 +33,6 @@ const CurrentProject = observer(() => {
const canBeOpen = projectListOpen && Boolean(anchorEl);
const id = canBeOpen ? "spring-popper" : undefined;
const handleChangeCurrentProject = (project: any) => {
currentProjectStore.changeProject(project);
setFileServerEndPointLocalStorage(project.zoneId);
getFiletokenAccordingToId(project.id).then((res) => {
project.filetoken = res;
......
src/views/Project/components/Flow/index.tsx
View file @ 95d8fd24
This diff is collapsed.
src/views/WorkFlowEdit/index.module.css
View file @ 95d8fd24
This diff is collapsed.
src/views/WorkFlowEdit/index.tsx
View file @ 95d8fd24
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