Commit a0bd3079 authored by jiangzijing's avatar jiangzijing

Merge branch 'feat-20220801' of http://120.77.149.83/root/bkunyun into feat-20220801

parents cba70674 ad039d33
...@@ -7,7 +7,7 @@ main::-webkit-scrollbar { ...@@ -7,7 +7,7 @@ main::-webkit-scrollbar {
div::-webkit-scrollbar-track, div::-webkit-scrollbar-track,
main::-webkit-scrollbar-track { main::-webkit-scrollbar-track {
background-color: #fff; background-color: transparent;
-webkit-border-radius: 3em; -webkit-border-radius: 3em;
-moz-border-radius: 3em; -moz-border-radius: 3em;
border-radius: 3em; border-radius: 3em;
......
...@@ -66,6 +66,7 @@ const MyInput = (props: MyInputProps) => { ...@@ -66,6 +66,7 @@ const MyInput = (props: MyInputProps) => {
styleOverrides: { styleOverrides: {
root: { root: {
top: "-9px", top: "-9px",
fontSize: "14px",
}, },
shrink: { shrink: {
top: 0, top: 0,
......
...@@ -9,6 +9,13 @@ const roleList: any[] = [ ...@@ -9,6 +9,13 @@ const roleList: any[] = [
{ OWNER: 4 } { OWNER: 4 }
] ]
export const roleMap = {
VIEWER: '查看者',
USER: '研究员',
MANAGER: '管理员',
OWNER: '所有者',
}
const usePass = () => { const usePass = () => {
const { permissionStore } = useStores(); const { permissionStore } = useStores();
const { currentProjectStore } = useStores(); const { currentProjectStore } = useStores();
......
...@@ -54,6 +54,7 @@ ...@@ -54,6 +54,7 @@
z-index: 1002; z-index: 1002;
} }
.productLi { .productLi {
min-width: 142px;
height: 36px; height: 36px;
padding: 7px 50px 7px 16px; padding: 7px 50px 7px 16px;
font-size: 14px; font-size: 14px;
...@@ -109,16 +110,6 @@ ...@@ -109,16 +110,6 @@
color: #8a9099; color: #8a9099;
transform: rotate(180deg); transform: rotate(180deg);
} }
/* .ArrowDropDownIconRoot {
color: #8a9099;
transition: all 0.2s !important;
transform: rotate(0);
}
.ArrowDropDownIconRootOpen {
color: #8a9099;
transform: rotate(180deg);
} */
.menuPaper { .menuPaper {
border: 1px solid #f0f2f5; border: 1px solid #f0f2f5;
......
...@@ -72,7 +72,7 @@ ...@@ -72,7 +72,7 @@
.taskProgress { .taskProgress {
height: 32px; height: 32px;
margin: 12px 0; margin: 12px 0 16px;
} }
.progressInfo { .progressInfo {
...@@ -157,7 +157,7 @@ ...@@ -157,7 +157,7 @@
margin-right: 8px; margin-right: 8px;
} }
.outputTitle{ .outputTitle {
display: inline-block; display: inline-block;
height: 22px; height: 22px;
line-height: 22px; line-height: 22px;
......
.topFixed { .topFixed {
position: sticky; position: sticky;
top: 0; top: 0;
z-index: 10; z-index: 10;
background-color: #fff; background-color: #fff;
} }
.basicInformation { .basicInformation {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
margin: 0 24px; margin: 0 24px;
padding: 20px 0; padding: 24px 0 20px;
border-bottom: 1px solid #EDEFF2; border-bottom: 1px solid #edeff2;
} }
.basicInformationRight { .basicInformationRight {
display: flex; display: flex;
align-items: center; align-items: center;
font-size: 12px; font-size: 12px;
} }
.titleBox { .titleBox {
display: flex; display: flex;
align-items: flex-end; align-items: flex-end;
} }
.projectName { .projectName {
margin-left: 12px; margin-left: 12px;
font-size: 18px; font-size: 18px;
line-height: 26px; line-height: 26px;
font-weight: 600; font-weight: 600;
} }
.otherInformation { .otherInformation {
display: flex; display: flex;
font-size: 12px; font-size: 12px;
margin-top: 16px; margin-top: 16px;
} }
.informationcolor { .informationcolor {
color: #8A9099; color: #8a9099;
} }
.otherInformationBox { .otherInformationBox {
margin-right: 24px; margin-right: 24px;
color: #565C66; color: #565c66;
} }
.otherInformationBoxRight { .otherInformationBoxRight {
line-height: 22px; line-height: 22px;
margin-bottom: 4px; margin-bottom: 4px;
color: #565C66; color: #565c66;
} }
.numberDisplay { .numberDisplay {
font-size: 20px; font-size: 20px;
font-weight: 600; font-weight: 600;
color: #1E2633; color: #1e2633;
margin-right: 8px; margin-right: 8px;
} }
.verticalLine { .verticalLine {
height: 32px; height: 32px;
border-right: 1px solid #EBEDF0; border-right: 1px solid #ebedf0;
margin-left: 28px; margin-left: 28px;
margin-right: 28px; margin-right: 28px;
} }
.searchBox { .searchBox {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
margin: 24px 24px 0 24px; margin: 24px 24px 0 24px;
padding-bottom: 20px; padding-bottom: 20px;
} }
.searchLineLeft { .searchLineLeft {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.taskOverview { .taskOverview {
font-size: 16px; font-size: 16px;
font-weight: 500; font-weight: 500;
margin-right: 18px; margin-right: 18px;
} }
.projectDataSearch { .projectDataSearch {
padding-left: 12px; padding-left: 12px;
padding-right: 8px; padding-right: 8px;
border-radius: 4px; border-radius: 4px;
border: 1px solid #ebedf0; border: 1px solid #ebedf0;
} }
.taskDisplay { .taskDisplay {
position: relative; position: relative;
margin: 0 24px 20px; margin: 0 24px 20px;
padding-bottom: 16px; padding-bottom: 16px;
overflow: hidden; overflow: hidden;
background: #F7F8FA; background: #f7f8fa;
border-radius: 8px; border-radius: 8px;
min-height: calc(100vh - 291px); min-height: calc(100vh - 291px);
} }
.noDataBox { .noDataBox {
position: absolute; position: absolute;
top: 50%; top: 50%;
left: 50%; left: 50%;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} }
.noDataText { .noDataText {
margin-top: 8px; margin-top: 8px;
font-size: 14px; font-size: 14px;
line-height: 22px; line-height: 22px;
color: #8a9099; color: #8a9099;
} }
.loadingBox { .loadingBox {
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
height: calc(100vh - 100px); height: calc(100vh - 100px);
} }
\ No newline at end of file
This diff is collapsed.
...@@ -2,14 +2,6 @@ ...@@ -2,14 +2,6 @@
width: calc(100vw - 220px); width: calc(100vw - 220px);
height: calc(100vh - 57px); height: calc(100vh - 57px);
background-color: rgba(0, 0, 0, 0.5); background-color: rgba(0, 0, 0, 0.5);
/* width: 260px;
height: calc(100vh - 57px); */
/* width: 260px;
height: calc(100vh - 57px);
background-color: #fff;
border-right: 1px solid #ebedf0;
display: flex;
flex-direction: column; */
} }
.mainBox { .mainBox {
...@@ -25,10 +17,11 @@ ...@@ -25,10 +17,11 @@
.searchBox { .searchBox {
box-sizing: border-box; box-sizing: border-box;
height: 56px; height: 56px;
padding: 17px; padding: 12px 8px 12px 24px;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: space-between; justify-content: space-between;
align-items: center;
} }
.searchButton { .searchButton {
width: 22px; width: 22px;
...@@ -48,8 +41,11 @@ ...@@ -48,8 +41,11 @@
} }
.add { .add {
padding: 0 15px; padding: 0 15px;
width: 22px; width: 32px;
height: 22px; height: 32px;
}
.add:hover {
border-radius: 4px;
} }
.addIcon { .addIcon {
color: #1e2633; color: #1e2633;
...@@ -96,13 +92,14 @@ ...@@ -96,13 +92,14 @@
overflow: hidden; overflow: hidden;
} }
.projectOwnerTime { .projectOwnerTime {
font-size: 12px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
.projectOwner { .projectOwner {
font-size: 12px;
color: #565c66; color: #565c66;
line-height: 20px; line-height: 20px;
font-size: 14px;
margin-right: 32px; margin-right: 32px;
max-width: 60px; max-width: 60px;
white-space: nowrap; white-space: nowrap;
...@@ -113,5 +110,5 @@ ...@@ -113,5 +110,5 @@
.projectTime { .projectTime {
color: #8a9099; color: #8a9099;
line-height: 20px; line-height: 20px;
font-size: 14px; font-size: 12px;
} }
...@@ -14,8 +14,8 @@ import AddIcon from "@mui/icons-material/Add"; ...@@ -14,8 +14,8 @@ import AddIcon from "@mui/icons-material/Add";
import classNames from "classnames"; import classNames from "classnames";
import { useStores } from "@/store/index"; import { useStores } from "@/store/index";
import moment from "moment"; import moment from "moment";
import React, { useMemo, useState } from "react"; import React, { useMemo, useState } from "react";
import { useClickAway } from 'ahooks'; import { useClickAway } from "ahooks";
import { toJS } from "mobx"; import { toJS } from "mobx";
import { observer } from "mobx-react-lite"; import { observer } from "mobx-react-lite";
...@@ -31,26 +31,52 @@ const ProjectListPopper = observer((props: any) => { ...@@ -31,26 +31,52 @@ const ProjectListPopper = observer((props: any) => {
setName(e.target.value); setName(e.target.value);
}; };
const getPower = (projectRole: string) => {
if (projectRole === "VIEWER") {
return "查看者";
} else if (projectRole === "USER") {
return "研究员";
} else if (projectRole === "MANAGER") {
return "管理员";
} else if (projectRole === "OWNER") {
return "所有者";
} else {
return "";
}
};
const list = useMemo(() => { const list = useMemo(() => {
return projectList.filter((item: any) => { return projectList
return item.name?.indexOf(name) !== -1; .filter((item: any) => {
}); return item.name?.indexOf(name) !== -1;
})
.map((item) => {
return {
...item,
power: getPower(item.projectRole || ""),
};
});
}, [projectList, name]); }, [projectList, name]);
console.log(list);
const handleProjectBox = (e: React.SyntheticEvent) => { const handleProjectBox = (e: React.SyntheticEvent) => {
setProjectListOpen(false); setProjectListOpen(false);
}; };
useClickAway( useClickAway(
() => { () => {
setProjectListOpen(false); setProjectListOpen(false);
}, },
() => document.getElementById('use-click-projectList-mainBox'), () => document.getElementById("use-click-projectList-mainBox")
); );
return ( return (
<div className={style.projectBox} onClick={handleProjectBox}> <div className={style.projectBox} onClick={handleProjectBox}>
<div className={style.mainBox} id="use-click-projectList-mainBox" onClick={(e: any)=>e.stopPropagation()}> <div
className={style.mainBox}
id="use-click-projectList-mainBox"
onClick={(e: any) => e.stopPropagation()}
>
<div className={style.searchBox}> <div className={style.searchBox}>
<IconButton <IconButton
type="submit" type="submit"
...@@ -59,7 +85,7 @@ const ProjectListPopper = observer((props: any) => { ...@@ -59,7 +85,7 @@ const ProjectListPopper = observer((props: any) => {
> >
<SearchIcon <SearchIcon
className={style.searchIcon} className={style.searchIcon}
style={{ color: "rgba(153, 153, 153, 1)" }} style={{ color: "#8A9099", fontSize: "22px" }}
/> />
</IconButton> </IconButton>
<InputBase <InputBase
...@@ -68,6 +94,11 @@ const ProjectListPopper = observer((props: any) => { ...@@ -68,6 +94,11 @@ const ProjectListPopper = observer((props: any) => {
inputProps={{ "aria-label": "请输入项目名称" }} inputProps={{ "aria-label": "请输入项目名称" }}
value={name} value={name}
onChange={nameChange} onChange={nameChange}
sx={{
fontSize: "14px",
// color: "rgba(194, 198, 204, 1)",
height: "22px",
}}
/> />
<IconButton <IconButton
onClick={handleClickOpen} onClick={handleClickOpen}
...@@ -95,7 +126,7 @@ const ProjectListPopper = observer((props: any) => { ...@@ -95,7 +126,7 @@ const ProjectListPopper = observer((props: any) => {
<div className={style.projectName}>{item.name}</div> <div className={style.projectName}>{item.name}</div>
<div className={style.projectOwnerTime}> <div className={style.projectOwnerTime}>
<span className={style.projectOwner} title={item.owner}> <span className={style.projectOwner} title={item.owner}>
{item.owner} {item.power}
</span> </span>
<span className={style.projectTime}> <span className={style.projectTime}>
{moment(item.createdAt).format("YYYY-MM-DD")} {moment(item.createdAt).format("YYYY-MM-DD")}
......
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