Skip to content

B
bkunyun
Commit 53d8d5e5 authored by wuyongsheng's avatar wuyongsheng
Browse files
Options

feat: 点击遮罩关闭

parent e475c840
Hide whitespace changes
Inline Side-by-side
Showing with 129 additions and 124 deletions
src/views/Project/ProjectData/UpLoaderFile/index.module.css
View file @ 53d8d5e5
.uploderBox { .uploderBox {
width: 900px; width: 900px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
.uploderBoxLeft { .uploderBoxLeft {
width: 300px; width: 300px;
} }
.dropTitle { .dropTitle {
line-height: 22px; line-height: 22px;
font-size: 14px; font-size: 14px;
color: #1e2633; color: #1e2633;
margin-bottom: 14px; margin-bottom: 14px;
font-weight: 600; font-weight: 600;
} }
.dropBox { .dropBox {
height: 300px; cursor: pointer;
display: flex; height: 300px;
flex-direction: column; display: flex;
justify-content: center; flex-direction: column;
align-items: center; justify-content: center;
border: 1px dashed #d1d6de; align-items: center;
border-radius: 4px; border: 1px dashed #d1d6de;
border-radius: 4px;
}
.dropBox:hover {
background-color: #f7f8fa;
} }
.dropBoxDragActive { .dropBoxDragActive {
background-color: #f7f8fa; background-color: #f7f8fa;
} }
.uploaderIcon { .uploaderIcon {
width: 56px; width: 56px;
margin-bottom: 24px; margin-bottom: 24px;
} }
.uploderText1 { .uploderText1 {
line-height: 22px; line-height: 22px;
font-size: 14px; font-size: 14px;
color: #565c66; color: #565c66;
margin-bottom: 2px; margin-bottom: 2px;
} }
.uploderText2 { .uploderText2 {
line-height: 20px; line-height: 20px;
font-size: 12px; font-size: 12px;
color: #8a9099; color: #8a9099;
} }
.fileListBox { .fileListBox {
width: 528px; width: 528px;
box-sizing: border-box; box-sizing: border-box;
position: relative; position: relative;
} }
/* .tableBox { /* .tableBox {
height: 300px; height: 300px;
overflow: scroll; overflow: scroll;
} */ } */
.fileIconBox { .fileIconBox {
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
} }
.fileIconBoxText{ .fileIconBoxText {
display: block; display: block;
width: 260px; width: 260px;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
-o-text-overflow:ellipsis; -o-text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
} }
.noFile { .noFile {
position: absolute; position: absolute;
top: 92px; top: 92px;
height: 200px; height: 200px;
width: 100%; width: 100%;
background-color: #fff; background-color: #fff;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} }
.noFileIcon { .noFileIcon {
width: 83px; width: 83px;
height: 70px; height: 70px;
height: auto; height: auto;
margin-bottom: 6px; margin-bottom: 6px;
} }
.noFileText { .noFileText {
line-height: 18px; line-height: 18px;
font-size: 12px; font-size: 12px;
color: rgba(34, 34, 34, 0.45); color: rgba(34, 34, 34, 0.45);
} }
.fileIcon { .fileIcon {
margin-right: 12px; margin-right: 12px;
} }
.red { .red {
color: #ff4e4e; color: #ff4e4e;
} }
src/views/Project/ProjectData/index.module.css
View file @ 53d8d5e5
...@@ -59,7 +59,7 @@ ...@@ -59,7 +59,7 @@
width: calc(100vw - 220px); width: calc(100vw - 220px);
position: fixed; position: fixed;
bottom: 0px; bottom: 0px;
border: 1px solid #ebedf0; border-top: 1px solid #ebedf0;
z-index: 100; z-index: 100;
background-color: #fff; background-color: #fff;
display: flex; display: flex;
......
src/views/Project/ProjectJobDetail/index.tsx
View file @ 53d8d5e5
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com * @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-06-21 20:03:56 * @Date: 2022-06-21 20:03:56
* @LastEditors: 吴永生 15770852798@163.com * @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-09 18:28:39 * @LastEditTime: 2022-08-11 17:13:52
* @FilePath: /bkunyun/src/views/Project/ProjectSubmitWork/index.tsx * @FilePath: /bkunyun/src/views/Project/ProjectSubmitWork/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/ */
......
src/views/Project/ProjectSetting/ProjectMembers/components/ChangePermission.tsx
View file @ 53d8d5e5
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com * @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-05-31 10:18:13 * @Date: 2022-05-31 10:18:13
* @LastEditors: 吴永生 15770852798@163.com * @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-08 18:17:20 * @LastEditTime: 2022-08-11 18:05:06
* @FilePath: /bkunyun/src/views/Project/ProjectSetting/index.tsx * @FilePath: /bkunyun/src/views/Project/ProjectSetting/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/ */
...@@ -37,15 +37,7 @@ const ChangePermission = observer((props: IProps) => { ...@@ -37,15 +37,7 @@ const ChangePermission = observer((props: IProps) => {
useEffect(() => { useEffect(() => {
if (permissionDialog?.isShow) { if (permissionDialog?.isShow) {
http.get<IResponse<any>>("/cpp/project/listroles").then((res) => { http.get<IResponse<any>>("/cpp/project/listroles").then((res) => {
const arr = []; setSelectOptions(res.data);
const { data } = res;
for (const key in data) {
arr.push({
label: String(data[key]),
value: key,
});
}
setSelectOptions(arr);
}); });
} }
}, [http, permissionDialog]); }, [http, permissionDialog]);
......
src/views/Project/components/CurrentProject/index.tsx
View file @ 53d8d5e5
...@@ -21,6 +21,11 @@ const CurrentProject = observer(() => { ...@@ -21,6 +21,11 @@ const CurrentProject = observer(() => {
document.addEventListener("click", (e) => { document.addEventListener("click", (e) => {
setProjectListOpen(false); setProjectListOpen(false);
}); });
return () => {
document.removeEventListener("click", (e) => {
setProjectListOpen(false);
});
};
}, []); }, []);
const handleShowProjectList = (event: React.MouseEvent<HTMLElement>) => { const handleShowProjectList = (event: React.MouseEvent<HTMLElement>) => {
...@@ -85,6 +90,7 @@ const CurrentProject = observer(() => { ...@@ -85,6 +90,7 @@ const CurrentProject = observer(() => {
<Fade {...TransitionProps} timeout={350}> <Fade {...TransitionProps} timeout={350}>
<div> <div>
<ProjectListPopper <ProjectListPopper
setProjectListOpen={setProjectListOpen}
handleClickOpen={openAddProject} handleClickOpen={openAddProject}
handleChangeCurrentProject={handleChangeCurrentProject} handleChangeCurrentProject={handleChangeCurrentProject}
/> />
......
src/views/Project/components/ProjectListPopper/index.tsx
View file @ 53d8d5e5
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: 吴永生 15770852798@163.com * @Author: 吴永生 15770852798@163.com
* @Date: 2022-08-02 11:43:28 * @Date: 2022-08-02 11:43:28
* @LastEditors: 吴永生 15770852798@163.com * @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-02 19:36:32 * @LastEditTime: 2022-08-11 18:50:31
* @FilePath: /bkunyun/src/views/Project/components/ProjectListPopper/index.tsx * @FilePath: /bkunyun/src/views/Project/components/ProjectListPopper/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/ */
...@@ -19,7 +19,8 @@ import { toJS } from "mobx"; ...@@ -19,7 +19,8 @@ import { toJS } from "mobx";
import { observer } from "mobx-react-lite"; import { observer } from "mobx-react-lite";
const ProjectListPopper = observer((props: any) => { const ProjectListPopper = observer((props: any) => {
const { handleChangeCurrentProject, handleClickOpen } = props; const { handleChangeCurrentProject, handleClickOpen, setProjectListOpen } =
props;
const { currentProjectStore } = useStores(); const { currentProjectStore } = useStores();
const projectList = toJS(currentProjectStore.projectList); const projectList = toJS(currentProjectStore.projectList);
const currentProjectId = toJS(currentProjectStore.currentProjectInfo.id); const currentProjectId = toJS(currentProjectStore.currentProjectInfo.id);
...@@ -36,68 +37,69 @@ const ProjectListPopper = observer((props: any) => { ...@@ -36,68 +37,69 @@ const ProjectListPopper = observer((props: any) => {
}, [projectList, name]); }, [projectList, name]);
const handleProjectBox = (e: React.SyntheticEvent) => { const handleProjectBox = (e: React.SyntheticEvent) => {
setProjectListOpen(false);
e.nativeEvent.stopImmediatePropagation(); e.nativeEvent.stopImmediatePropagation();
}; };
return ( return (
<div className={style.projectBox} onClick={handleProjectBox}> <div className={style.projectBox} onClick={handleProjectBox}>
<div className={style.mainBox}> <div className={style.mainBox}>
<div className={style.searchBox}> <div className={style.searchBox}>
<IconButton <IconButton
type="submit" type="submit"
className={style.searchButton} className={style.searchButton}
aria-label="search" aria-label="search"
> >
<SearchIcon <SearchIcon
className={style.searchIcon} className={style.searchIcon}
style={{ color: "rgba(153, 153, 153, 1)" }} style={{ color: "rgba(153, 153, 153, 1)" }}
/>
</IconButton>
<InputBase
className={style.searchInput}
placeholder="请输入项目名称"
inputProps={{ "aria-label": "请输入项目名称" }}
value={name}
onChange={nameChange}
/> />
</IconButton> <IconButton
<InputBase onClick={handleClickOpen}
className={style.searchInput} type="submit"
placeholder="请输入项目名称" className={style.add}
inputProps={{ "aria-label": "请输入项目名称" }} aria-label="search"
value={name} >
onChange={nameChange} <AddIcon className={style.addIcon} />
/> </IconButton>
<IconButton </div>
onClick={handleClickOpen} <div className={style.projectlist}>
type="submit" {list.map((item: any) => {
className={style.add} return (
aria-label="search" <div
> className={classNames({
<AddIcon className={style.addIcon} /> [style.projectli]: true,
</IconButton> [style.projectliActive]: item.id === currentProjectId,
</div> })}
<div className={style.projectlist}> key={item.id}
{list.map((item: any) => { onClick={() => handleChangeCurrentProject(item)}
return ( >
<div <div className={style.projectliBorderBox}>
className={classNames({ <img src={smallLogo} alt="" className={style.projectliLogo} />
[style.projectli]: true, <div className={style.projectliInfo}>
[style.projectliActive]: item.id === currentProjectId, <div className={style.projectName}>{item.name}</div>
})} <div className={style.projectOwnerTime}>
key={item.id} <span className={style.projectOwner} title={item.owner}>
onClick={() => handleChangeCurrentProject(item)} {item.owner}
> </span>
<div className={style.projectliBorderBox}> <span className={style.projectTime}>
<img src={smallLogo} alt="" className={style.projectliLogo} /> {moment(item.createdAt).format("YYYY-MM-DD")}
<div className={style.projectliInfo}> </span>
<div className={style.projectName}>{item.name}</div> </div>
<div className={style.projectOwnerTime}>
<span className={style.projectOwner} title={item.owner}>
{item.owner}
</span>
<span className={style.projectTime}>
{moment(item.createdAt).format("YYYY-MM-DD")}
</span>
</div> </div>
</div> </div>
</div> </div>
</div> );
); })}
})} </div>
</div>
</div> </div>
</div> </div>
); );
......
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