@titaui/pc 1.9.45 → 1.9.49

package/src/components/task-relation-modal/tree/okr-tree/index.tsx

@@ -18,7 +18,7 @@ import "./index.scss";
 
 const precls = "rel-okr-tree";
 
-const OkrTree = () => {
+function OkrTree() {
   const { multiple, selected, selectedRoots } = useContext(Context);
   const [works, setWorks] = useState([]);
   const [treeNodes, setTreeNodes] = useState([]);
@@ -26,13 +26,11 @@ const OkrTree = () => {
   const [pageSize, setPageSize] = useState(10);
   const [pageNum, setPageNum] = useState(1);
   const [query, setQuery] = useState({});
-  const [toUserId] = useState(() => {
-    return getBSGlobal("loginUserInfo").Id;
-  });
-  const contentRef = useRef(document.createElement('div'))
+  const [toUserId] = useState(() => getBSGlobal("loginUserInfo").Id);
+  const contentRef = useRef(document.createElement("div"));
   const [isQuery, setIsQuery] = useState(false);
   const [isScorll, setIsScorll] = useState(false);
- 
+
   // useEffect(()=>{
   //   contentRef.current&&console.log(contentRef.current)
   // },[treeNodes])
@@ -42,50 +40,48 @@ const OkrTree = () => {
   const setScorll = (e) => {
     if (!e.target && timer) return;
     setIsScorll(true);
-    //@ts-ignore
+    // @ts-ignore
     timer = setTimeout(() => {
       setIsScorll(false);
     }, 1000);
   };
 
   useEffect(() => {
-    if(contentRef.current){
-      contentRef.current.addEventListener("scroll", setScorll, true);     
+    if (contentRef.current) {
+      contentRef.current.addEventListener("scroll", setScorll, true);
     }
     return () => {
-      contentRef.current&&contentRef.current.removeEventListener("scroll", setScorll, true);
+      contentRef.current && contentRef.current.removeEventListener("scroll", setScorll, true);
     };
   }, [treeNodes]);
 
-  const formatKrNodes = (krs,o) =>
-    krs.map((item, index) => {
-      const checked = !!selected.find((i) => i.id == item.feedId);
-      item['workName'] = o.workName
-      return {
-        key: `${item.feedId}`,
-        nodeType: "kr-node",
-        data: item,
-        title: "",
-        krIndex: index + 1,
-        checked,
-        disabled: !checked && selectedRoots.includes(item.workId),
-      };
-    });
+  const formatKrNodes = (krs, o) => krs.map((item, index) => {
+    const checked = !!selected.find((i) => i.id == item.feedId);
+    item.workName = o.workName;
+    return {
+      key: `${item.feedId}`,
+      nodeType: "kr-node",
+      data: item,
+      title: "",
+      krIndex: index + 1,
+      checked,
+      disabled: !checked && selectedRoots.includes(item.workId),
+    };
+  });
 
-  const transToTreeNode = (arr) =>
-    arr.map((item, _key) => {
-      const { Krs = [] } = item;
-      const checked = !!selected.find((i) => i.id == item.feedId);
-      return {
-        key: item.feedId,
-        nodeType: "o-node",
-        title: "",
-        children: formatKrNodes(Krs.filter((item) => item.mileStoneId !== 0),item),
-        data: item,
-        checked,
-        disabled: !checked && selectedRoots.includes(item.workId),
-      };
-    });
+  const transToTreeNode = (arr) => arr.map((item, _key) => {
+    const { Krs = [] } = item;
+    const checked = !!selected.find((i) => i.id == item.feedId);
+    return {
+      key: item.feedId,
+      nodeType: "o-node",
+      title: "",
+      children: formatKrNodes(Krs.filter((item) => item.mileStoneId !== 0), item),
+      data: item,
+      checked,
+      disabled: !checked && selectedRoots.includes(item.workId),
+    };
+  });
 
   const getTreeNodes = async () => {
     const { works, total } = await okrSearch({
@@ -124,18 +120,19 @@ const OkrTree = () => {
     <div className={precls}>
       <SearchForm onChange={onQueryChangeHandler} />
       {treeNodes.length == 0 && (
-        <div className={`${precls}__empty`}>{getLocale('Tasks_Tab_MyS_NoOKRilable')}</div>
+        <div className={`${precls}__empty`}>{getLocale("Tasks_Tab_MyS_NoOKRilable")}</div>
       )}
       {treeNodes.length > 0 && (
-        <Fragment>
+        <>
           <div className={`${precls}__header`}>
-            <span className={`${precls}__header-obj`}>{getLocale('Pro_detail_AssociatedObject')}</span>
-            <span className={`${precls}__header-principle`}>{getLocale('Mod_Owner')}</span>
-            <span className={`${precls}__header-time`}>{getLocale('Mod_Startendtime')}</span>
+            <span className={`${precls}__header-obj`}>{getLocale("Pro_detail_AssociatedObject")}</span>
+            <span className={`${precls}__header-principle`}>{getLocale("Mod_Owner")}</span>
+            <span className={`${precls}__header-time`}>{getLocale("Mod_Startendtime")}</span>
           </div>
-          <div  
+          <div
             ref={contentRef}
-            className={`${precls}__content`}>
+            className={`${precls}__content`}
+          >
             <Tree
               multiple={multiple}
               treeData={treeNodes}
@@ -143,7 +140,7 @@ const OkrTree = () => {
               checkStrictly
             />
           </div>
-        </Fragment>
+        </>
       )}
       {total !== 0 && (
         <div
@@ -162,5 +159,5 @@ const OkrTree = () => {
       )}
     </div>
   );
-};
+}
 export default OkrTree;

package/src/components/task-relation-modal/tree/okr-tree/search-form.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState,useRef } from "react";
+import React, { useEffect, useState, useRef } from "react";
 import SearchInput from "../../../search-input";
 import PeriodSelector from "../../../period-selector";
 import { formatPeriod } from "../../../period-selector/common";
@@ -13,7 +13,7 @@ interface IProps {
   onChange: Function;
 }
 
-const SearchForm = (props: IProps) => {
+function SearchForm(props: IProps) {
   const { onChange } = props;
   const [cycle, setCycle] = useState({
     annualNum: new Date().getFullYear(), // 默认当前年份全部周期
@@ -23,21 +23,21 @@ const SearchForm = (props: IProps) => {
   const [okrType, setOkrType] = useState("");
   const [users, setUsers] = useState([]);
   const [keyWords, setKeyWords] = useState("");
-  const [relation,setRelation] = useState(0)
-  const dilagRef = useRef(document.createElement('div'))
+  const [relation, setRelation] = useState(0);
+  const dilagRef = useRef(document.createElement("div"));
   useEffect(() => {
-      onChange({
-        okrType,
-        status: 0,
-        userIds: users.reduce(
-          (res, cur, index) => `${res}${index == 0 ? "" : ","}${cur.userId}`,
-          ""
-        ),
-        keyWords,
-        relation,
-        ...cycle,
-      });
-  }, [okrType, users, keyWords, cycle,relation]);
+    onChange({
+      okrType,
+      status: 0,
+      userIds: users.reduce(
+        (res, cur, index) => `${res}${index == 0 ? "" : ","}${cur.userId}`,
+        "",
+      ),
+      keyWords,
+      relation,
+      ...cycle,
+    });
+  }, [okrType, users, keyWords, cycle, relation]);
 
   return (
     <div ref={dilagRef}>
@@ -46,7 +46,7 @@ const SearchForm = (props: IProps) => {
           selected={cycle}
           yearsRange={[2019, 2030]}
           onChange={setCycle}
-          getPopupContainer={()=>dilagRef.current}
+          getPopupContainer={() => dilagRef.current}
           popClass="pull-screen-ignore"
         >
           <SearchDropDown>{formatPeriod(cycle)}</SearchDropDown>
@@ -56,19 +56,19 @@ const SearchForm = (props: IProps) => {
         <OkrTypeSelect onChange={setOkrType} initValue={okrType} />
       </div>
       <div className="rel-okr-tree__search-item">
-          <Principal onChange={setUsers} initValue={[]} setRelation={setRelation} />
+        <Principal onChange={setUsers} initValue={[]} setRelation={setRelation} />
       </div>
       <div className="rel-okr-tree__search-item">
-          <Relation onChange={setRelation} initValue={relation} />
+        <Relation onChange={setRelation} initValue={relation} />
       </div>
       <div className="rel-okr-tree__search-item-keyword">
         <SearchInput
           onSearch={setKeyWords}
-          placeholder={getLocale('Mod_Enterkeywords')}
+          placeholder={getLocale("Mod_Enterkeywords")}
           style={{ height: 32, width: 240 }}
         />
       </div>
     </div>
   );
-};
+}
 export default SearchForm;

package/src/components/task-relation-modal/tree/work-tree/index.tsx

@@ -1,4 +1,6 @@
-import React, { useState, useEffect, useContext, Fragment, useRef } from "react";
+import React, {
+  useState, useEffect, useContext, Fragment, useRef,
+} from "react";
 import classNames from "classnames";
 import Pagination from "../../../pagination";
 import Tree from "../../../tree";
@@ -10,7 +12,7 @@ import { getLocale } from "../../../../utils/getLocale";
 import "./index.scss";
 
 const precls = "rel-work-tree";
-const WorkTree = () => {
+function WorkTree() {
   const { multiple, selected, selectedRoots } = useContext(Context);
   const [works, setWorks] = useState([]);
   const [treeNodes, setTreeNodes] = useState([]);
@@ -21,56 +23,54 @@ const WorkTree = () => {
   const [isQuery, setIsQuery] = useState(false);
 
   const [isScorll, setIsScorll] = useState(false);
-  const contentRef = useRef(document.createElement('div'))
+  const contentRef = useRef(document.createElement("div"));
   let timer = null;
 
   const setScorll = (e) => {
     if (!e.target && timer) return;
     setIsScorll(true);
-    //@ts-ignore
+    // @ts-ignore
     timer = setTimeout(() => {
       setIsScorll(false);
     }, 1000);
   };
 
   useEffect(() => {
-    if(contentRef.current){
-      contentRef.current.addEventListener("scroll", setScorll, true);     
+    if (contentRef.current) {
+      contentRef.current.addEventListener("scroll", setScorll, true);
     }
     return () => {
-      contentRef.current&&contentRef.current.removeEventListener("scroll", setScorll, true);
+      contentRef.current && contentRef.current.removeEventListener("scroll", setScorll, true);
     };
   }, [treeNodes]);
 
-  const formatKrNodes = (krs,work) =>
-    krs.map((item,key) => {
-      const checked = !!selected.find((i) => i.id == `mileStoneId-${item.mileStoneId}`);
-      item['workName']  = work.WorkName
-      return {
-        key: `mileStoneId-${item.mileStoneId}`,
-        nodeType: "milestone",
-        data: item,
-        title: "",
-        checked,
-        index:key+1,
-        disabled: !checked && selectedRoots.includes(item.workId),
-      };
-    });
+  const formatKrNodes = (krs, work) => krs.map((item, key) => {
+    const checked = !!selected.find((i) => i.id == `mileStoneId-${item.mileStoneId}`);
+    item.workName = work.WorkName;
+    return {
+      key: `mileStoneId-${item.mileStoneId}`,
+      nodeType: "milestone",
+      data: item,
+      title: "",
+      checked,
+      index: key + 1,
+      disabled: !checked && selectedRoots.includes(item.workId),
+    };
+  });
 
-  const transToTreeNode = (arr) =>
-    arr.map((item, _key) => {
-      const { mileStones = [] } = item;
-      const checked = !!selected.find((i) => i.id == item.WorkId);
-      return {
-        key: item.WorkId,
-        nodeType: "work-node",
-        title: "",
-        children: formatKrNodes(mileStones || [],item),
-        data: item,
-        checked,
-        disabled: !checked && selectedRoots.includes(item.WorkId),
-      };
-    });
+  const transToTreeNode = (arr) => arr.map((item, _key) => {
+    const { mileStones = [] } = item;
+    const checked = !!selected.find((i) => i.id == item.WorkId);
+    return {
+      key: item.WorkId,
+      nodeType: "work-node",
+      title: "",
+      children: formatKrNodes(mileStones || [], item),
+      data: item,
+      checked,
+      disabled: !checked && selectedRoots.includes(item.WorkId),
+    };
+  });
 
   const getTreeNodes = async () => {
     const { works = [], total = 0 } = await getWorks({
@@ -107,20 +107,20 @@ const WorkTree = () => {
     <div className={precls}>
       <SearchForm onChange={onQueryChangeHandler} />
       {treeNodes.length == 0 && (
-        <div className={`${precls}__empty`}>{getLocale('Tasks_Tab_MyS_Noprojectilable')}</div>
+        <div className={`${precls}__empty`}>{getLocale("Tasks_Tab_MyS_Noprojectilable")}</div>
       )}
       {treeNodes.length > 0 && (
-        <Fragment>
+        <>
           <div className={`${precls}__header`}>
-            <span className={`${precls}__header-obj`}>{getLocale('Pro_detail_AssociatedObject')}</span>
-            <span className={`${precls}__header-status`}>{getLocale('Mod_States')}</span>
-            <span className={`${precls}__header-principle`}>{getLocale('Mod_Owner')}</span>
-            <span className={`${precls}__header-time`}>{getLocale('Mod_Startendtime')}</span>
+            <span className={`${precls}__header-obj`}>{getLocale("Pro_detail_AssociatedObject")}</span>
+            <span className={`${precls}__header-status`}>{getLocale("Mod_States")}</span>
+            <span className={`${precls}__header-principle`}>{getLocale("Mod_Owner")}</span>
+            <span className={`${precls}__header-time`}>{getLocale("Mod_Startendtime")}</span>
           </div>
           <div
             className={`${precls}__content`}
             ref={contentRef}
-            >
+          >
             <Tree
               multiple={multiple}
               treeData={treeNodes}
@@ -129,7 +129,7 @@ const WorkTree = () => {
             />
           </div>
 
-        </Fragment>
+        </>
       )}
       {total !== 0 && (
         <div
@@ -148,5 +148,5 @@ const WorkTree = () => {
       )}
     </div>
   );
-};
+}
 export default WorkTree;

package/src/components/task-relation-modal/tree/work-tree/search-form.tsx

@@ -3,34 +3,32 @@ import { getLocale } from "../../../../utils/getLocale";
 import SearchInput from "../../../search-input";
 import OkrStatusSelect from "../../search/okr-status-select";
 import Principal from "../../search/principal";
-import Relation from "../../search/relation"
+import Relation from "../../search/relation";
 import "./index.scss";
 
 interface IProps {
   onChange: Function;
 }
 
-const SearchForm = (props: IProps) => {
+function SearchForm(props: IProps) {
   const { onChange } = props;
 
   const [okrStatus, setOkrStatus] = useState(0);
   const [users, setUsers] = useState([]);
   const [keyWords, setKeyWords] = useState("");
-  const [relation,setRelation] = useState(0)
-
-
+  const [relation, setRelation] = useState(0);
 
   useEffect(() => {
-      onChange({
-        status: okrStatus,
-        userIds: users.reduce(
-          (res, cur, index) => `${res}${index == 0 ? "" : ","}${cur.userId}`,
-          ""
-        ),
-        keyWords,
-        relation,
-      });
-  }, [okrStatus, users, keyWords,relation]);
+    onChange({
+      status: okrStatus,
+      userIds: users.reduce(
+        (res, cur, index) => `${res}${index == 0 ? "" : ","}${cur.userId}`,
+        "",
+      ),
+      keyWords,
+      relation,
+    });
+  }, [okrStatus, users, keyWords, relation]);
 
   return (
     <div>
@@ -38,19 +36,19 @@ const SearchForm = (props: IProps) => {
         <OkrStatusSelect onChange={setOkrStatus} initValue={okrStatus} />
       </div>
       <div className="rel-work-tree__search-item">
-          <Principal onChange={setUsers} position="bottomLeft" initValue={[]} setRelation={setRelation} />
+        <Principal onChange={setUsers} position="bottomLeft" initValue={[]} setRelation={setRelation} />
       </div>
       <div className="rel-okr-tree__search-item">
-          <Relation onChange={setRelation} initValue={relation} />
+        <Relation onChange={setRelation} initValue={relation} />
       </div>
       <div className="rel-work-tree__search-item-keyword">
         <SearchInput
           onSearch={setKeyWords}
-          placeholder={getLocale('Mod_Enterkeywords')}
+          placeholder={getLocale("Mod_Enterkeywords")}
           style={{ height: 32, width: 240 }}
         />
       </div>
     </div>
   );
-};
+}
 export default SearchForm;

package/src/components/task-relation-modal/tree-node/category-node/index.tsx

@@ -15,13 +15,15 @@ interface IProps {
   isParent?: boolean;
 }
 
-const CategoryNode = (props: IProps) => {
-  const { data, level, checked = false, disabled ,isParent=true} = props;
+function CategoryNode(props: IProps) {
+  const {
+    data, level, checked = false, disabled, isParent = true,
+  } = props;
   const { multiple, addSelected, removeSelected } = useContext(Context);
 
   const onCheckHandler = (checked) => {
-    checked &&
-      addSelected({
+    checked
+      && addSelected({
         type: "lable",
         workId: data.id,
         krId: 0,
@@ -48,7 +50,7 @@ const CategoryNode = (props: IProps) => {
           <Radio onChange={onCheckHandler} id={data.id} checked={checked} />
         </span>
       )}
-      {!isParent&& <span className={`${precls}__pointer`}></span>}
+      {!isParent && <span className={`${precls}__pointer`} />}
       <span className={`${precls}__name`}>
         <span
           className={classNames(`${precls}__name-icon`, {
@@ -60,5 +62,5 @@ const CategoryNode = (props: IProps) => {
       </span>
     </div>
   );
-};
+}
 export default CategoryNode;

package/src/components/task-relation-modal/tree-node/index.js

@@ -8,7 +8,7 @@ import CategoryNode from "./category-node";
 
 import "./index.scss";
 
-const NodeRender = (node, level) => {
+function NodeRender(node, level) {
   switch (node.nodeType) {
     case "o-node":
       return <ONode {...node} level={level} />;
@@ -21,7 +21,6 @@ const NodeRender = (node, level) => {
     case "category":
       return <CategoryNode {...node} level={level} />;
     default:
-      return;
   }
-};
+}
 export default NodeRender;

package/src/components/task-relation-modal/tree-node/kr-node/index.tsx

@@ -4,7 +4,7 @@ import Checkbox from "../../../checkbox";
 import drawerManager from "../../../drawer-manager";
 import { Context } from "../../context";
 import Radio from "../../radio";
-import Tooltip from '../../../tooltip';
+import Tooltip from "../../../tooltip";
 import { OpenUserName } from "../../../../utils/open-data";
 import { formatDateStr } from "../../helper";
 import "./index.scss";
@@ -17,8 +17,10 @@ interface IProps {
   disabled?: boolean;
 }
 
-const KrNode = (props: IProps) => {
-  const { data, krIndex, checked = false, disabled } = props;
+function KrNode(props: IProps) {
+  const {
+    data, krIndex, checked = false, disabled,
+  } = props;
   const { user } = data;
   const { multiple, addSelected, removeSelected } = useContext(Context);
 
@@ -26,18 +28,18 @@ const KrNode = (props: IProps) => {
     drawerManager.open(
       "krDetail",
       { krId: data.mileStoneId },
-      { zIndex: 1350 }
+      { zIndex: 1350 },
     );
   };
   const onCheckHandler = (checked) => {
-    checked &&
-      addSelected({
+    checked
+      && addSelected({
         type: "kr",
         workId: data.workId,
         krId: data.mileStoneId,
         id: data.feedId,
         name: data.mileStoneName,
-        workName: data.workName 
+        workName: data.workName,
       });
     !checked && removeSelected(data.feedId);
   };
@@ -61,9 +63,12 @@ const KrNode = (props: IProps) => {
           />
         </span>
       )}
-      <span className={classNames(`${precls}__pointer`,{[`${precls}__pointer-first`]:krIndex===1})}></span>
+      <span className={classNames(`${precls}__pointer`, { [`${precls}__pointer-first`]: krIndex === 1 })} />
       <span className={`${precls}__name`}>
-        <span className={`${precls}__name-index`}>KR{krIndex}</span>
+        <span className={`${precls}__name-index`}>
+          KR
+          {krIndex}
+        </span>
         <span onClick={openKrDrawer}>{data.mileStoneName}</span>
       </span>
       <span className={`${precls}__principle`}>
@@ -73,9 +78,11 @@ const KrNode = (props: IProps) => {
         />
       </span>
       <span className={`${precls}__time`}>
-        {formatDateStr(data.startDate)}-{formatDateStr(data.endDate)}
+        {formatDateStr(data.startDate)}
+        -
+        {formatDateStr(data.endDate)}
       </span>
     </div>
   );
-};
+}
 export default KrNode;

package/src/components/task-relation-modal/tree-node/milestone-node/index.tsx

@@ -4,7 +4,7 @@ import Checkbox from "../../../checkbox";
 import { Context } from "../../context";
 import Radio from "../../radio";
 import { OpenUserName } from "../../../../utils/open-data";
-import Tooltip from '../../../tooltip';
+import Tooltip from "../../../tooltip";
 import { formatDateStr } from "../../helper";
 import { getLocale } from "../../../../utils/getLocale";
 import "./index.scss";
@@ -17,8 +17,10 @@ interface IProps {
   disabled?: boolean;
 }
 
-const MileStone = (props: IProps) => {
-  const { data, checked = false, disabled ,index} = props;
+function MileStone(props: IProps) {
+  const {
+    data, checked = false, disabled, index,
+  } = props;
   const { user } = data;
   const { multiple, addSelected, removeSelected } = useContext(Context);
   const openKrDrawer = () => {
@@ -32,24 +34,24 @@ const MileStone = (props: IProps) => {
         width: 465,
         zIndex: 1310,
         top: 0,
-      }
+      },
     );
   };
 
   const statusMap = {
-    1: getLocale('OKR_MyO_E_From_NotStarted'),
-    2: getLocale('Per_Ma_form_detail_Incomplete'),
-    3: getLocale('OKR_MyO_E_From_Completed'),
+    1: getLocale("OKR_MyO_E_From_NotStarted"),
+    2: getLocale("Per_Ma_form_detail_Incomplete"),
+    3: getLocale("OKR_MyO_E_From_Completed"),
   };
   const onCheckHandler = (checked, id) => {
-    checked &&
-      addSelected({
+    checked
+      && addSelected({
         type: "milestone",
         workId: data.workId,
         krId: data.mileStoneId,
         id: `mileStoneId-${data.mileStoneId}`,
         name: data.mileStoneName,
-        workName:data.workName
+        workName: data.workName,
       });
     !checked && removeSelected(`mileStoneId-${data.mileStoneId}`);
   };
@@ -77,10 +79,10 @@ const MileStone = (props: IProps) => {
         className={classNames(`${precls}__pointer`, {
           [`${precls}__pointer-first`]: index === 1,
         })}
-      ></span>
+      />
       <span className={`${precls}__name`}>
         <span
-          className={classNames('tu-icon-licheng-s', `${precls}__name-icon`)}
+          className={classNames("tu-icon-licheng-s", `${precls}__name-icon`)}
         />
         <span onClick={openKrDrawer}>{data.mileStoneName}</span>
       </span>
@@ -93,9 +95,11 @@ const MileStone = (props: IProps) => {
         />
       </span>
       <span className={`${precls}__time`}>
-        {formatDateStr(data.startDate)}-{formatDateStr(data.endDate)}
+        {formatDateStr(data.startDate)}
+        -
+        {formatDateStr(data.endDate)}
       </span>
     </div>
   );
-};
+}
 export default MileStone;