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