Skip to content

B
bkunyun
Commit 9b5a2318 authored by chenshouchao's avatar chenshouchao
Browse files
Options

Merge branch 'feat-20220718' into 'release' 

Feat 20220718

See merge request !36
parents 8c034058 7843925c
Hide whitespace changes
Inline Side-by-side
Showing with 215 additions and 96 deletions
src/components/BusinessComponents/SearchInput/index.tsx
View file @ 9b5a2318
......@@ -17,7 +17,7 @@ interface SearchInputProps extends OutlinedInputProps {
const SearchInput = (props: SearchInputProps) => {
const {
size = "small",
placeholder = "输入关键词搜索",
placeholder = "输入关键词按回车搜索",
fullWidth = true,
...other
} = props;
......
src/components/mui/MyButton.tsx
View file @ 9b5a2318
......@@ -10,6 +10,7 @@ import {
ExtendButtonBase,
ButtonTypeMap,
} from "@mui/material";
import LoadingButton from "@mui/lab/LoadingButton";
import ArrowDropDownIcon from "@mui/icons-material/ArrowDropDown";
interface ButtonTagProps
......@@ -35,6 +36,8 @@ interface ButtonTagProps
disabled?: boolean; //是否禁用
style?: any; //按钮自定义样式
img?: JSX.Element; //图标按钮中的图标
isLoadingButton?: boolean; // 是否是loadingbutton
loading?: boolean; // 是否处于loading状态
selectCallBack?: (item: any, key: number) => void; //选择按钮的回调
}
......@@ -51,6 +54,9 @@ const theme = createTheme({
color: "rgba(255, 78, 78, 1)",
border: "1px solid rgba(255, 78, 78, 1)",
},
"& .MuiLoadingButton-loadingIndicator": {
color: "#fff",
},
},
contained: {
backgroundColor: "#1370FF",
......@@ -75,6 +81,12 @@ const theme = createTheme({
"&:hover": { backgroundColor: "#ECF4FF " },
},
containedPrimary: {
"&.Mui-disabled": {
backgroundColor: "#A6D3FF",
},
},
containedSecondary: {
backgroundColor: "#FF4E4E",
"&:hover": {
......@@ -126,10 +138,17 @@ const theme = createTheme({
},
},
},
MuiTypography: {
styleOverrides: {
root: {
whiteSpace: "nowrap",
},
},
},
},
});
const ButtonComponent = (props: ButtonTagProps) => {
const MyButton = (props: ButtonTagProps) => {
const {
size,
disabled,
......@@ -138,6 +157,8 @@ const ButtonComponent = (props: ButtonTagProps) => {
img,
select,
selectCallBack,
isLoadingButton,
loading,
...other
} = props;
const { classes, cx } = useStyles({});
......@@ -166,34 +187,68 @@ const ButtonComponent = (props: ButtonTagProps) => {
return (
<ThemeProvider theme={theme}>
<Button
size={size || "medium"}
variant={variant || "contained"}
color={color || "primary"}
disableRipple={true}
disableFocusRipple={true}
disabled={disabled || false}
style={{ ...props.style }}
onClick={props.select ? handleClick : props.onClick || defaultClick}
{...other}
>
{img || ""}
<Typography style={{ fontSize: props.fontSize }}>
{props.text}
</Typography>
{((props.select && props.select.length > 0) || props.drop) && (
<ArrowDropDownIcon
classes={{
root: cx({
[classes.ArrowDropDownIconRoot]: true,
[classes.ArrowDropDownIconRootOpen]: Boolean(
props.dropValue || anchorEl
),
}),
}}
/>
)}
</Button>
{isLoadingButton && (
<LoadingButton
size={size || "medium"}
variant={variant || "contained"}
color={color || "primary"}
disableRipple={true}
disableFocusRipple={true}
disabled={disabled || false}
style={{ ...props.style }}
onClick={props.select ? handleClick : props.onClick || defaultClick}
loading={loading}
{...other}
>
{img || ""}
<Typography style={{ fontSize: props.fontSize }}>
{props.text}
</Typography>
{((props.select && props.select.length > 0) || props.drop) && (
<ArrowDropDownIcon
classes={{
root: cx({
[classes.ArrowDropDownIconRoot]: true,
[classes.ArrowDropDownIconRootOpen]: Boolean(
props.dropValue || anchorEl
),
}),
}}
/>
)}
</LoadingButton>
)}
{!isLoadingButton && (
<Button
size={size || "medium"}
variant={variant || "contained"}
color={color || "primary"}
disableRipple={true}
disableFocusRipple={true}
disabled={disabled || false}
style={{ ...props.style }}
onClick={props.select ? handleClick : props.onClick || defaultClick}
{...other}
>
{img || ""}
<Typography style={{ fontSize: props.fontSize }}>
{props.text}
</Typography>
{((props.select && props.select.length > 0) || props.drop) && (
<ArrowDropDownIcon
classes={{
root: cx({
[classes.ArrowDropDownIconRoot]: true,
[classes.ArrowDropDownIconRootOpen]: Boolean(
props.dropValue || anchorEl
),
}),
}}
/>
)}
</Button>
)}
<Menu
id="simple-menu"
anchorEl={anchorEl}
......@@ -228,4 +283,4 @@ const useStyles = makeStyles<{}>()((theme) => ({
ArrowDropDownIconRootOpen: { color: "#8A9099", transform: "rotate(180deg)" },
}));
export default ButtonComponent;
export default MyButton;
src/components/mui/MyCircularProgress.tsx
View file @ 9b5a2318
// 局部loading组件 挂载在目标块下，目标块最少要添加一个position: relative; 或者absolute
// 局部loading组件
// 使用方法1 用一个div包裹children，在children上加一个蒙层和loading
// <MyCircularProgress loading={loading}>children</MyCircularProgress>
// 使用方法2 挂载在目标块下，目标块最少要添加一个position: relative; 或者absolute
// <div style={{ position: "relative", }} >
// <MyCircularProgress loading={loading}/>
// </div>
import CircularProgress from "@mui/material/CircularProgress";
type IMyCircularProgressProps = {
loading: boolean;
loading: boolean; // 是否处于loading状态
children?: React.ReactNode; // 包裹的子元素
minHeight?: string;
maxHeight?: string;
zIndex?: number;
......@@ -14,43 +23,86 @@ const MyCircularProgress = (props: IMyCircularProgressProps) => {
minHeight = "none",
maxHeight = "100vh",
zIndex = "100",
children,
} = props;
if (loading) {
return (
<div
style={{
minHeight: minHeight,
width: "100%",
height: "100%",
position: "absolute",
top: 0,
zIndex: zIndex,
}}
>
<div
style={{
width: "100%",
height: "100%",
position: "absolute",
top: 0,
opacity: 0.6,
background: "#fff",
}}
></div>
if (children) {
return (
<div
style={{
width: "100%",
height: "100%",
maxHeight: maxHeight,
display: "flex",
justifyContent: "center",
alignItems: "center",
position: "relative",
}}
>
<CircularProgress></CircularProgress>
<div
style={{
width: "100%",
height: "100%",
position: "absolute",
top: 0,
opacity: 0.6,
background: "#fff",
zIndex: zIndex,
}}
></div>
<div
style={{
width: "100%",
height: "100%",
display: "flex",
justifyContent: "center",
alignItems: "center",
position: "absolute",
top: 0,
zIndex: zIndex,
maxHeight: maxHeight,
}}
>
<CircularProgress></CircularProgress>
</div>
{children}
</div>
</div>
);
);
} else {
if (children) {
return children;
} else {
return (
<div
style={{
width: "100%",
height: "100%",
position: "absolute",
top: 0,
zIndex: zIndex,
minHeight: minHeight,
}}
>
<div
style={{
width: "100%",
height: "100%",
position: "absolute",
top: 0,
opacity: 0.6,
background: "#fff",
}}
></div>
<div
style={{
width: "100%",
height: "100%",
display: "flex",
justifyContent: "center",
alignItems: "center",
maxHeight: maxHeight,
}}
>
<CircularProgress></CircularProgress>
</div>
</div>
);
}
}
} else {
return null;
}
......
src/components/mui/MyDialog.tsx
View file @ 9b5a2318
......@@ -43,6 +43,7 @@ export interface IDialogProps {
clickMaskClose?: boolean;
/** 确认按钮样式*/
okSx?: any;
loading?: boolean; // 确认按钮是否处于loading状态
}
const MyDialog: React.FunctionComponent<IDialogProps> = (props) => {
......@@ -64,6 +65,7 @@ const MyDialog: React.FunctionComponent<IDialogProps> = (props) => {
okText,
disabledConfirm,
clickMaskClose = false,
loading = false,
okSx = {},
} = props;
......@@ -99,6 +101,8 @@ const MyDialog: React.FunctionComponent<IDialogProps> = (props) => {
variant="contained"
size="small"
disabled={disabledConfirm}
isLoadingButton={true}
loading={loading}
style={{ ...okSx }}
/>
) : null}
......@@ -140,7 +144,7 @@ const MyDialog: React.FunctionComponent<IDialogProps> = (props) => {
</div>
</DialogTitle>
)}
<DialogContent style={{ minWidth: 400 }}>{children}</DialogContent>
<DialogContent style={{ minWidth: 388 }}>{children}</DialogContent>
{Footer()}
</Dialog>
);
......
src/components/mui/MyPopconfirm.tsx
View file @ 9b5a2318
......@@ -6,7 +6,7 @@ import MyButton from "./MyButton";
import tipsIcon from "@/assets/project/information-outline.svg";
import Popper from "@mui/material/Popper";
interface IMyPopconfirmProps {
interface IMyPopconfirmProps {
title: string | ReactNode;
placement?:
| "auto-end"
......@@ -30,7 +30,7 @@ interface IMyPopconfirmProps {
showCancel?: boolean;
onCancel?: any;
onConfirm?: any;
};
}
const MyPopconfirm = (props: IMyPopconfirmProps) => {
const {
......@@ -75,7 +75,12 @@ const MyPopconfirm = (props: IMyPopconfirmProps) => {
>
<Box sx={{ marginBottom: "16px" }}>
<img
style={{ marginRight: "12px", position: "relative", top: "3px" }}
style={{
width: "16px",
marginRight: "12px",
position: "relative",
top: "3px",
}}
src={tipsIcon}
alt=""
/>
......@@ -85,18 +90,14 @@ const MyPopconfirm = (props: IMyPopconfirmProps) => {
{showCancel && (
<MyButton
text={cancelText}
variant='outlined'
variant="outlined"
size="small"
color="inherit"
onClick={handleCancel}
style={{ marginRight: "12px" }}
/>
)}
<MyButton
text={okText}
size="small"
onClick={handleOk}
/>
<MyButton text={okText} size="small" onClick={handleOk} />
</Box>
</Popper>
);
......
src/views/ConsoleLayout/components/FileItem/index.tsx
View file @ 9b5a2318
......@@ -120,7 +120,7 @@ const FileItem = observer((props: IProps) => {
width: 300,
margin: "6px 0",
}}
color="error"
color="success"
value={itemInfo?.percentage}
/>
) : null}
......
src/views/Project/ProjectData/SeeDataset/index.tsx
View file @ 9b5a2318
......@@ -4,7 +4,7 @@ import RadioGroupOfButtonStyle from "@/components/CommonComponents/RadioGroupOfB
import MyMultipleMenu, { IOption } from "@/components/mui/MyMultipleMenu";
import MySelect from "@/components/mui/MySelect";
import MyInput from "@/components/mui/MyInput";
import ButtonComponent from "@/components/mui/MyButton";
import MyButton from "@/components/mui/MyButton";
import SearchIcon from "@mui/icons-material/Search";
import MyPagination from "@/components/mui/MyPagination";
import NglView from "@/components/BusinessComponents/NglView";
......@@ -240,13 +240,13 @@ const SeeDataset = observer((props: ISeeDatasetProps) => {
height: "32px",
}}
></MyInput>
<ButtonComponent
<MyButton
text="确认"
style={{ width: "68px" }}
onClick={() => {
getList();
}}
></ButtonComponent>
></MyButton>
</div>
</div>
</div>
......@@ -366,19 +366,19 @@ const SeeDataset = observer((props: ISeeDatasetProps) => {
</div>
<div className={style.foot}>
{isCadd && (
<ButtonComponent
<MyButton
variant="outlined"
text={`下载(${selectItems.length})`}
style={{ marginRight: "12px" }}
disabled={selectItems.length === 0}
onClick={() => setDownloadOpen(true)}
></ButtonComponent>
></MyButton>
)}
<ButtonComponent
<MyButton
disabled={selectItems.length === 0}
text={`另存为(${selectItems.length})`}
onClick={() => setSaveOpen(true)}
></ButtonComponent>
></MyButton>
</div>
{saveOpen && (
<Save
......
src/views/Project/ProjectJobDetail/index.tsx
View file @ 9b5a2318
......@@ -14,7 +14,7 @@ import { useLocation, useNavigate } from "react-router-dom";
import ArrowBackIosNewIcon from "@mui/icons-material/ArrowBackIosNew";
import IconButton from "@mui/material/IconButton";
import ButtonComponent from "@/components/mui/MyButton";
import MyButton from "@/components/mui/MyButton";
import useMyRequest from "@/hooks/useMyRequest";
import { fetchWorkFlowJob, getworkFlowTaskInfo } from "@/api/project_api";
import { IResponse } from "@/api/http";
......@@ -352,7 +352,7 @@ const ProjectSubmitWork = observer(() => {
state === "RUNNING" ? onStopJob() : onDeleteJob();
}}
> */}
<ButtonComponent
<MyButton
text={state === "RUNNING" ? "终止" : "删除"}
variant="outlined"
color="secondary"
......@@ -365,7 +365,7 @@ const ProjectSubmitWork = observer(() => {
)
}
// click={onStopJob}
></ButtonComponent>
></MyButton>
{/* </MyPopconfirm> */}
</div>
)}
......
src/views/Project/ProjectSetting/BaseInfo/index.module.css
View file @ 9b5a2318
......@@ -41,6 +41,7 @@
height: 82px;
padding: 7px 12px;
resize: none;
font-size: 14px;
}
.projectInfoSelect {
width: 560px;
......
src/views/Project/ProjectSetting/BaseInfo/index.tsx
View file @ 9b5a2318
......@@ -395,6 +395,14 @@ const BaseInfo = observer(() => {
<InputAdornment position="start">¥</InputAdornment>
),
}}
sx={{
"& .MuiOutlinedInput-input": {
padding: "6.5px 2px",
},
"& .MuiTypography-root": {
fontSize: '14px'
}
}}
/>
</div>
<div className={style.projectInfoListLi}>
......
src/views/Project/ProjectSetting/ProjectMembers/components/ChangePermission.tsx
View file @ 9b5a2318
/*
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-05-31 10:18:13
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-07-21 11:34:55
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-07-29 11:28:09
* @FilePath: /bkunyun/src/views/Project/ProjectSetting/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -94,6 +94,7 @@ const ChangePermission = observer((props: IProps) => {
>
<div style={{ marginTop: 12 }}>
<MySelect
fullWidth
title="项目权限"
isTitle={true}
value={selectValue}
......
src/views/Project/ProjectSetting/ProjectMembers/index.tsx
View file @ 9b5a2318
......@@ -154,7 +154,7 @@ const ProjectMembers = observer(() => {
<Box className={styles.headerBox}>
<SearchInput
onKeyUp={handleKeyWordChangeKeyUp}
placeholder="搜索项目成员"
placeholder="输入项目成员按回车搜索"
sx={{ width: 340 }}
/>
{currentProjectStore?.currentProjectInfo?.projectRole === "OWNER" ? (
......
src/views/Project/ProjectSubmitWork/index.tsx
View file @ 9b5a2318
......@@ -16,7 +16,7 @@ import moment from "moment";
import ConfigForm from "./ConfigForm";
import WorkFlow from "./WorkFlow";
import ButtonComponent from "@/components/mui/MyButton";
import MyButton from "@/components/mui/MyButton";
import { ITemplateConfig } from "./interface";
import useMyRequest from "@/hooks/useMyRequest";
import { fetchTemplateConfigInfo, submitWorkFlow } from "@/api/project_api";
......@@ -272,12 +272,12 @@ const ProjectSubmitWork = observer(() => {
title="提交前请先确认参数填写无误，确认提交吗？"
onConfirm={handleSubmitForm}
> */}
<ButtonComponent
<MyButton
text="提交任务"
onClick={(e: any) =>
handleShowPopper(e, "提交前请先确认参数填写无误，确认提交吗？")
}
></ButtonComponent>
></MyButton>
{/* </MyPopconfirm> */}
</div>
</div>
......
src/views/Project/ProjectWorkbench/workbenchList/index.tsx
View file @ 9b5a2318
......@@ -395,7 +395,7 @@ const ProjectMembers = observer(() => {
</Box>
<Box className={styles.tabBoxMiddle}>
<img alt="" src={jobCost} />
<div className={styles.tabBoxTime}>{item.jobCost}</div>
<div className={styles.tabBoxTime}>{item.jobCost.toFixed(2)}元</div>
</Box>
<Box className={styles.tabBoxJobStatus}>
<img alt="" src={renderStatusIcon(item.state)} />
......
src/views/WorkFlowEdit/index.tsx
View file @ 9b5a2318
......@@ -14,7 +14,7 @@ import { observer } from "mobx-react-lite";
import MyPopconfirm from "@/components/mui/MyPopconfirm";
import RadioGroupOfButtonStyle from "@/components/CommonComponents/RadioGroupOfButtonStyle";
import ButtonComponent from "@/components/mui/MyButton";
import MyButton from "@/components/mui/MyButton";
import OperatorList from "./components/OperatorList";
import Flow from "../Project/components/Flow";
import ParameterSetting from "./components/ParameterSetting";
......@@ -181,10 +181,7 @@ const WorkFlowEdit = observer((props: IProps) => {
</IconButton>
</div>
<div className={styles.swHeaderRight}>
<ButtonComponent
text="保存"
onClick={() => handlePreserve()}
></ButtonComponent>
<MyButton text="保存" onClick={() => handlePreserve()}></MyButton>
</div>
</div>
<div className={styles.swContent}>
......
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