Skip to content

B
bkunyun
Commit d94d3db3 authored by 吴永生#A02208's avatar 吴永生#A02208
Browse files
Options

fix: 提交任务添加全屏显示

parent deb97f9f
Hide whitespace changes
Inline Side-by-side
Showing with 176 additions and 30 deletions
src/views/Project/ProjectSubmitWork/index.module.css
View file @ d94d3db3
......@@ -60,3 +60,16 @@
flex: 1;
height: calc(100vh - 56px);
}
.fullScreenBox {
position: absolute;
background-color: #fff;
cursor: pointer;
z-index: 1000;
right: 24px;
bottom: 24px;
padding: 8px;
}
.fullScreenBox:hover {
opacity: 0.6;
}
\ No newline at end of file
src/views/Project/ProjectSubmitWork/index.tsx
View file @ d94d3db3
......@@ -2,31 +2,35 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-06-21 20:03:56
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-06-26 17:24:46
* @LastEditTime: 2022-07-05 18:14:13
* @FilePath: /bkunyun/src/views/Project/ProjectSubmitWork/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
import { toJS } from "mobx";
import React, { useEffect, useState } from "react";
import styles from "./index.module.css";
import ArrowBackIosNewIcon from "@mui/icons-material/ArrowBackIosNew";
import IconButton from "@mui/material/IconButton";
import _ from "lodash";
import { useLocation, useNavigate } from "react-router-dom";
import moment from "moment";
import ConfigForm from "./ConfigForm";
import WorkFlow from "./WorkFlow";
import ButtonComponent from "@/components/mui/Button";
import ArrowBackIosNewIcon from "@mui/icons-material/ArrowBackIosNew";
import IconButton from "@mui/material/IconButton";
import { ITemplateConfig } from "./interface";
import _ from "lodash";
import useMyRequest from "@/hooks/useMyRequest";
import { fetchTemplateConfigInfo, submitWorkFlow } from "@/api/project_api";
import { useLocation, useNavigate } from "react-router-dom";
import { getCheckResult } from "./util";
import { IResponse } from "@/api/http";
import { templateConfigJson } from "./mock";
import fullScreen from "@/assets/project/fullScreen.svg";
import partialScreen from "@/assets/project/partialScreen.svg";
import { useMessage } from "@/components/MySnackbar";
import { toJS } from "mobx";
import { useStores } from "@/store";
import moment from "moment";
import MyPopconfirm from "@/components/mui/MyPopconfirm";
import styles from "./index.module.css";
const ProjectSubmitWork = () => {
const Message = useMessage();
const { currentProjectStore } = useStores();
......@@ -36,6 +40,8 @@ const ProjectSubmitWork = () => {
const location: any = useLocation();
const navigate = useNavigate();
let configFormRef: any = React.createRef();
/** 是否全屏 */
const [fullScreenShow, setFullScreenShow] = useState<boolean>(false);
// 前往工作台
const goToWorkbench = (toWorkbenchList = false) => {
......@@ -172,7 +178,7 @@ const ProjectSubmitWork = () => {
return (
<div className={styles.swBox}>
<div className={styles.swHeader}>
{ fullScreenShow ? null : <div className={styles.swHeader}>
<div className={styles.swHeaderLeft}>
<MyPopconfirm
title="返回后，当前页面已填写内容将不保存，确认返回吗？"
......@@ -201,7 +207,7 @@ const ProjectSubmitWork = () => {
<div className={styles.swTemplateVersionBox}>
<span className={styles.swHeaderLable}>版本：</span>
<span className={styles.swHeaderValue}>
{templateConfigInfo?.version}
{templateConfigInfo?.languageVersion}
</span>
</div>
<div className={styles.swTemplateUpdateTimeBox}>
......@@ -227,19 +233,25 @@ const ProjectSubmitWork = () => {
></ButtonComponent>
</MyPopconfirm>
</div>
</div>
</div>}
<div className={styles.swContent}>
<div className={styles.swFormBox}>
{fullScreenShow ? null : <div className={styles.swFormBox}>
<ConfigForm
onRef={configFormRef}
templateConfigInfo={templateConfigInfo}
setParameter={setParameter}
/>
</div>
<div className={styles.swFlowBox}>
</div>}
<div className={styles.swFlowBox} style={fullScreenShow ? { height: "100vh" } : undefined}>
<WorkFlow templateConfigInfo={templateConfigInfo} />
</div>
</div>
<img
className={styles.fullScreenBox}
src={fullScreenShow ? partialScreen : fullScreen}
onClick={() => setFullScreenShow(!fullScreenShow)}
alt="全屏"
/>
</div>
);
};
......
src/views/Project/ProjectWorkbench/workbenchTemplate/index.tsx
View file @ d94d3db3
......@@ -2,18 +2,20 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-05-31 10:18:13
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-06-07 21:39:30
* @LastEditTime: 2022-07-05 18:06:17
* @FilePath: /bkunyun/src/views/Project/ProjectSetting/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
import { memo, SetStateAction, useCallback, useEffect, useMemo, useState } from "react";
import { memo, useEffect, useState } from "react";
import { Box, Typography } from "@mui/material";
import styles from "./index.module.css";
import OutlinedInput from "@mui/material/OutlinedInput";
import SearchIcon from "@mui/icons-material/Search";
import Button from "@/components/mui/Button";
import { toJS } from "mobx";
import { observer } from "mobx-react-lite";
// import Button from "@mui/material/Button";
import Add from "@mui/icons-material/Add";
import Button from "@/components/mui/Button";
import useMyRequest from "@/hooks/useMyRequest";
import TemplateBox from "./components/templateBox"
import SimpleDialog from "./components/simpleDialog"
......@@ -25,12 +27,12 @@ import {
getAddWorkbenchTemplate,
addWorkbenchTemplate
} from "@/api/workbench_api";
import _ from "lodash";
import { IResponse, useHttp } from "@/api/http";
import { useStores } from "@/store";
import usePass from "@/hooks/usePass";
import { toJS } from "mobx";
import { observer } from "mobx-react-lite";
import ReactFlowEdit from '@/views/WorkFlowEdit'
import { useStores } from "@/store";
import styles from "./index.module.css";
const ProjectMembers = observer(() => {
const { currentProjectStore } = useStores();
......@@ -101,12 +103,6 @@ const ProjectMembers = observer(() => {
console.log('projectIdData: ', projectIdData);
}, [projectIdData])
/** 点击添加工作流模版 */
const onAddMember = () => {
// setAddMemberDialog(true);
};
/** 删除模板 */
const deleteTemplate = () => {
delTemplate({
......@@ -241,6 +237,8 @@ const ProjectMembers = observer(() => {
addTemplateCallback={addTemplateCallback}
searchTemplateNameCallback={searchTemplateNameCallback}
/>
{/* <ReactFlowEdit/> */}
<SimpleDialog
text={'确认移除该模板吗？'}
......
src/views/WorkFlowEdit/index.module.css 0 → 100644
View file @ d94d3db3
.swBox {
position: fixed;
z-index: 1000;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background-color: RGBA(247, 248, 250, 1);
overflow-y: scroll;
}
.swHeader {
z-index: 1001;
position: sticky;
top: 0;
height: 56px;
background-color: #fff;
box-shadow: 0px 3px 10px 0px rgba(0, 24, 57, 0.04);
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 24px;
}
.swHeaderLeft {
display: flex;
justify-content: flex-start;
align-items: center;
}
.swContent {
display: flex;
height: calc(100vh - 56px);
}
.swFormBox {
background-color: #fff;
border-right: 1xp solid rgba(235, 237, 240, 1);
width: 608px;
overflow-y: scroll;
box-sizing: border-box;
padding: 36px;
}
.swFlowBox {
flex: 1;
height: calc(100vh - 56px);
}
\ No newline at end of file
src/views/WorkFlowEdit/index.tsx 0 → 100644
View file @ d94d3db3
/*
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-06-21 20:03:56
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-07-05 16:31:28
* @FilePath: /bkunyun/src/views/Project/ProjectSubmitWork/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
import React, { useState } from "react";
import ArrowBackIosNewIcon from "@mui/icons-material/ArrowBackIosNew";
import IconButton from "@mui/material/IconButton";
import { useLocation, useNavigate } from "react-router-dom";
import MyPopconfirm from "@/components/mui/MyPopconfirm";
import ButtonComponent from "@/components/mui/Button";
import { ITemplateConfig } from "../Project/ProjectSubmitWork/interface";
import styles from './index.module.css'
const WorkFlowEdit = () => {
const [templateConfigInfo, setTemplateConfigInfo] =
useState<ITemplateConfig>();
const location: any = useLocation();
const navigate = useNavigate();
return (
<div className={styles.swBox}>
<div className={styles.swHeader}>
<div className={styles.swHeaderLeft}>
<MyPopconfirm
title="返回后，当前页面已填写内容将不保存，确认返回吗？"
onConfirm={()=>console.log(11)}
>
<IconButton
color="primary"
// onClick={() => handleGoBack()}
aria-label="upload picture"
component="span"
size="small"
>
<ArrowBackIosNewIcon
sx={{
color: "rgba(194, 198, 204, 1)",
width: "12px",
height: "12px",
}}
/>
</IconButton>
</MyPopconfirm>
</div>
<div className={styles.swHeaderRight}>
<MyPopconfirm
title="提交前请先确认参数填写无误，确认提交吗？"
onConfirm={()=>console.log(2)}
>
<ButtonComponent
text="保存"
// click={handleSubmitForm}
></ButtonComponent>
</MyPopconfirm>
</div>
</div>
<div className={styles.swContent}>
<div className={styles.swFormBox}>
左侧
</div>
<div className={styles.swFlowBox}>
右侧
</div>
</div>
</div>
);
};
export default WorkFlowEdit;
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