Merge branch 'feat-20220530-project' of http://120.77.149.83/sunyihao/bkunyun…

Merge branch 'feat-20220530-project' of http://120.77.149.83/sunyihao/bkunyun into feat-20220530-project

src/components/Material.Ui/Input.jsx

@@ -5,7 +5,7 @@ import { makeStyles } from "@mui/styles";
 import cx from "classnames"
 const useStyles = makeStyles({
     MuiOutlinedInputInputLarge: { padding: "13.5px 15px", MozAppearance: 'textfield' },
-    MuiOutlinedInputInput: { padding: "6px 15px", "&::placeholder": { fontSize: "14px" }, MozAppearance: 'textfield' },
+    MuiOutlinedInputInput: { padding: "12px 15px", "&::placeholder": { fontSize: "14px" }, MozAppearance: 'textfield' },
     MuiOutlinedInputInputSmall: { padding: "10px 15px", "&::placeholder": { fontSize: "13px" }, MozAppearance: 'textfield' },
     MuiOutlinedInputInputXsmall: { padding: "8px 15px", "&::placeholder": { fontSize: "12px" }, MozAppearance: 'textfield' },
     outlinedLarge: { transform: "translate(14px, 15.5px) scale(1)", fontSize: '14px', fontWeight: '400', color: '#707070' },

src/views/Project/ProjectSetting/ProjectMembers/components/AddMember.tsx

@@ -2,7 +2,7 @@
  * @Author: 吴永生#A02208 yongsheng.wu@wholion.com
  * @Date: 2022-05-31 10:18:13
  * @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
- * @LastEditTime: 2022-06-06 20:02:38
+ * @LastEditTime: 2022-06-07 10:47:31
  * @FilePath: /bkunyun/src/views/Project/ProjectSetting/index.tsx
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
@@ -18,19 +18,24 @@ import SearchIcon from "@mui/icons-material/Search";
 import Input from "@/components/Material.Ui/Input";
 import { IResponse, useHttp } from "@/api/http";
 import { useStores } from "@/store";
+import { useMessage } from "@/components/MySnackbar";
 // import Select from "@/components/Material.Ui/Select";
 interface IProps {
   setAddMemberDialog: (val: boolean) => void;
   addMemberDialog: boolean;
+  getTableList: () => void;
 }
 
 const AddMember = observer((props: IProps) => {
-  const { addMemberDialog, setAddMemberDialog } = props;
+  const { addMemberDialog, setAddMemberDialog, getTableList } = props;
 
   const http = useHttp();
   const { currentProjectStore } = useStores();
 
   const [tableData, setTableData] = useState([]);
+  const [projectMember, setProjectMember] = useState("");
+  const [filterTableData, setFilterTableData] = useState([]);
+  const Message = useMessage();
 
   const selectOption = useMemo(() => {
     return [
@@ -49,19 +54,8 @@ const AddMember = observer((props: IProps) => {
       width: 160,
       render: () => {
         return (
-          //   <SelectComponent
-          //     fullWidth={true}
-          //     option={selectOption}
-          //     type={"select"}
-          //     changeType={"select"}
-          //     // textAlign={"right"}
-          //     // value={nodeNum}
-          //     onChange={(val: any) => console.log(val, 1111)}
-          //     // customClass={classes.SelectComponentCustomClass}
-          //   />
           <SelectComponent
             option={selectOption}
-            //   value={this.state.selectRegionValue ? this.state.selectRegionValue.name : ""}
             size={"xsmall"}
             callback={(value: any) => console.log(value)}
             rootStyle={{
@@ -86,6 +80,19 @@ const AddMember = observer((props: IProps) => {
     },
   ];
 
+  useEffect(() => {
+    if (!!projectMember) {
+      const newVal =
+        tableData.filter((item: any) => {
+          return item?.username?.includes(projectMember);
+        }) || [];
+      setFilterTableData(newVal || []);
+    } else {
+      console.log(2222);
+      setFilterTableData(tableData);
+    }
+  }, [projectMember, tableData]);
+
   useEffect(() => {
     if (!addMemberDialog) return;
     const projectInfo = toJS(currentProjectStore?.currentProjectInfo);
@@ -103,9 +110,23 @@ const AddMember = observer((props: IProps) => {
   const onClose = () => {
     setAddMemberDialog(false);
   };
+
   const onConfirm = () => {
-    setAddMemberDialog(false);
+    const projectInfo = toJS(currentProjectStore?.currentProjectInfo);
+    http
+      .put<IResponse<any>>("/cpp/project/updatemember", {
+        id: projectInfo?.id || "",
+      })
+      .then((res) => {
+        const { errorCode } = res;
+        if (errorCode === 0) {
+          Message.success("新增成功！");
+          getTableList();
+          setAddMemberDialog(false);
+        }
+      });
   };
+
   return (
     <>
       <Dialog
@@ -117,6 +138,7 @@ const AddMember = observer((props: IProps) => {
         <Box>
           <Input
             onChange={(e: any) => {
+              setProjectMember(e.target.value);
               console.log(e);
             }}
             fullWidth={true}
@@ -128,7 +150,7 @@ const AddMember = observer((props: IProps) => {
         <Table
           rowHover={true}
           stickyheader={true}
-          rows={tableData}
+          rows={filterTableData}
           rowsPerPage="99"
           headCells={columns}
           footer={false}

src/views/Project/ProjectSetting/ProjectMembers/components/ChangePermission.tsx

@@ -2,7 +2,7 @@
  * @Author: 吴永生#A02208 yongsheng.wu@wholion.com
  * @Date: 2022-05-31 10:18:13
  * @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
- * @LastEditTime: 2022-06-06 20:37:26
+ * @LastEditTime: 2022-06-07 10:45:42
  * @FilePath: /bkunyun/src/views/Project/ProjectSetting/index.tsx
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
@@ -21,10 +21,11 @@ import { useMessage } from "@/components/MySnackbar";
 interface IProps {
   setPermissionDialog: (val: IDialogInfo) => void;
   permissionDialog: IDialogInfo;
+  getTableList: () => void;
 }
 
 const ChangePermission = observer((props: IProps) => {
-  const { permissionDialog, setPermissionDialog } = props;
+  const { permissionDialog, setPermissionDialog, getTableList } = props;
 
   const { currentProjectStore } = useStores();
   const Message = useMessage();
@@ -57,7 +58,6 @@ const ChangePermission = observer((props: IProps) => {
   };
   const onConfirm = () => {
     const projectInfo = toJS(currentProjectStore?.currentProjectInfo);
-
     http
       .put<IResponse<any>>("/cpp/project/updateuserrole", {
         id: projectInfo?.id || "",
@@ -68,6 +68,7 @@ const ChangePermission = observer((props: IProps) => {
         const { errorCode } = res;
         if (errorCode === 0) {
           Message.success("更改成功！");
+          getTableList();
           setPermissionDialog({ isShow: false, username: "" });
         }
       });

src/views/Project/ProjectSetting/ProjectMembers/components/RemoveItem.tsx

@@ -2,7 +2,7 @@
  * @Author: 吴永生#A02208 yongsheng.wu@wholion.com
  * @Date: 2022-05-31 10:18:13
  * @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
- * @LastEditTime: 2022-06-06 18:09:33
+ * @LastEditTime: 2022-06-07 10:45:47
  * @FilePath: /bkunyun/src/views/Project/ProjectSetting/index.tsx
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
@@ -19,10 +19,11 @@ import { IDialogInfo } from "../interface";
 interface IProps {
   setRemoveDialog: (val: IDialogInfo) => void;
   removeDialog: IDialogInfo;
+  getTableList: () => void;
 }
 
 const RemoveItem = observer((props: IProps) => {
-  const { removeDialog, setRemoveDialog } = props;
+  const { removeDialog, setRemoveDialog, getTableList } = props;
 
   const http = useHttp();
   const Message = useMessage();
@@ -47,6 +48,7 @@ const RemoveItem = observer((props: IProps) => {
         const { errorCode } = res;
         if (errorCode === 0) {
           Message.success("删除成功！");
+          getTableList();
           setRemoveDialog({ isShow: false, username: "" });
         }
       });

src/views/Project/ProjectSetting/ProjectMembers/index.tsx

@@ -2,11 +2,11 @@
  * @Author: 吴永生#A02208 yongsheng.wu@wholion.com
  * @Date: 2022-05-31 10:18:13
  * @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
- * @LastEditTime: 2022-06-06 21:40:48
+ * @LastEditTime: 2022-06-07 11:13:26
  * @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, useEffect, useState } from "react";
+import { memo, useCallback, useEffect, useState } from "react";
 import _ from "lodash";
 import { Box } from "@mui/material";
 import Button from "@mui/material/Button";
@@ -76,10 +76,11 @@ const ProjectMembers = () => {
   const [addMemberDialog, setAddMemberDialog] = useState<boolean>(false);
 
   const [tableData, setTableData] = useState([]);
-  const [projectName, setProjectName] = useState("");
+  const [projectName, setProjectMember] = useState("");
   const [filterTableData, setFilterTableData] = useState([]);
 
-  useEffect(() => {
+  /** 获取表格数据 */
+  const getTableList = useCallback(() => {
     const projectInfo = toJS(currentProjectStore?.currentProjectInfo);
     if (!projectInfo?.id) return;
     http
@@ -91,6 +92,10 @@ const ProjectMembers = () => {
       });
   }, [currentProjectStore?.currentProjectInfo, http]);
 
+  useEffect(() => {
+    getTableList();
+  }, [getTableList]);
+
   useEffect(() => {
     if (!!projectName) {
       const newVal =
@@ -125,10 +130,11 @@ const ProjectMembers = () => {
         <Input
           onChange={(e: any) => {
             _.debounce(() => {
-              setProjectName(e.target.value);
+              setProjectMember(e.target.value);
             }, 200)();
           }}
           placeholder="搜索项目成员"
+          size="xsmall"
           endAdornment={<SearchIcon style={{ color: "#8A9099" }} />}
         />
         <Button
@@ -155,14 +161,17 @@ const ProjectMembers = () => {
       <RemoveItem
         removeDialog={removeDialog}
         setRemoveDialog={setRemoveDialog}
+        getTableList={getTableList}
       />
       <ChangePermission
         permissionDialog={permissionDialog}
+        getTableList={getTableList}
         setPermissionDialog={setPermissionDialog}
       />
       <AddMember
         addMemberDialog={addMemberDialog}
         setAddMemberDialog={setAddMemberDialog}
+        getTableList={getTableList}
       />
     </>
   );