@titaui/pc 1.9.64 → 1.9.68

package/.eslintignore

@@ -0,0 +1,3 @@
+**/*.scss
+
+**/*.css

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@titaui/pc",
-  "version": "1.9.64",
+  "version": "1.9.68",
   "nameCN": "",
   "description": "",
   "main": "src/index.js",
@@ -116,6 +116,7 @@
     "react-cropper": "^2.1.8",
     "react-custom-scrollbars": "^4.2.1",
     "react-grid-layout": "^1.2.5",
+    "react-perfect-scrollbar": "^1.5.8",
     "react-sizeme": "^3.0.1",
     "react-slick": "^0.28.1",
     "react-spring": "^9.2.4",

package/src/components/form/form-fields/input/index.tsx

@@ -58,6 +58,7 @@ export default forwardRef((props: Props, ref) => {
     onCheckSuccess,
     className = "",
     tail,
+    ...restProps
   } = props;
 
   const inputRef = useRef<any>();
@@ -171,6 +172,7 @@ export default forwardRef((props: Props, ref) => {
             onBlur={onBlurHandler}
             onChange={onChangeHandler}
             autoComplete="off"
+            {...restProps}
           />
         </ToolTip>
         {typeof tail === "string" ? (

package/src/components/hr-header/index.scss

@@ -26,11 +26,12 @@
     justify-content: center;
     margin: 0 5px;
     position: relative;
+    color: #ffffff;
     & > a {
-      color: #FFF!important;
+      color: #ffffff !important;
     }
-    &--active::after{
-      content: "";
+    &--active::after {
+      content: '';
       position: absolute;
       top: 50%;
       left: 50%;

package/src/components/hr-header/index.tsx

@@ -2,7 +2,7 @@ import React, { ReactElement, useState, useEffect } from "react";
 import classNames from "classnames";
 import axios from "axios";
 import Popup from "../popup";
-import { getLoginUserInfo } from "../../utils/helpers";
+import { getLoginUserInfo, getTenantInfo } from "../../utils/helpers";
 import ArrowImg from "./img/arrow.png";
 import "./index.scss";
 
@@ -22,7 +22,7 @@ function HrHeader(): ReactElement {
   }, []);
   return (
     <div className={preCls}>
-      <span className={`${preCls}__title`}>腾讯HR助手</span>
+      <span className={`${preCls}__title`}>{getTenantInfo().Name}</span>
       <div className={`${preCls}__menu-list`}>
         {menus.slice(0, 5).map((menu) => (
           <div

package/src/components/okr-detail/base-info/base-info.scss

@@ -1,6 +1,6 @@
 .base-info__divider {
   height: 8px;
-  background: #F0F2F5;
+  background: #f0f2f5;
   margin: 0 32px;
 }
 .base-info__participant-followers-wrapper {
@@ -9,17 +9,18 @@
   .base-info__person-block {
     font-size: 14px;
     font-weight: 600;
-    color: #141C28;
+    color: #141c28;
     line-height: 22px;
-    font-family: -apple-system, Arial, Verdana, Helvetica Neue, Helvetica, sans-serif, PingFang SC, Microsoft YaHei;
+    font-family: -apple-system, Arial, Verdana, Helvetica Neue, Helvetica,
+      sans-serif, PingFang SC, Microsoft YaHei;
     padding-left: 10px;
-    &:first-of-type{
+    &:first-of-type {
       margin-bottom: 4px;
     }
     .base-info__person-block-title {
       font-size: 14px;
       font-weight: 600;
-      color: #141C28;
+      color: #141c28;
       line-height: 22px;
       margin-bottom: 8px;
       display: block;
@@ -28,4 +29,4 @@
 }
 .base-info__infos-wrapper {
   padding: 0 42px 0 22px;
-}
+}

package/src/components/okr-detail/base-info/other-infos/visibility/index.tsx

@@ -8,19 +8,19 @@ import Tooltip from "../../../../tooltip";
 import { OpenDepartmentName, OpenUserName } from "../../../../../utils/open-data";
 import { getLocale } from "../../../../../utils/getLocale";
 
-const visibilityList = [
+const getVisibilityList = () => [
   { value: 1, label: getLocale("OKR_MyO_Pop_Public") },
   { value: 2, label: getLocale("OKR_MyO_From_Associatedmem") },
   { value: 3, label: getLocale("OKR_MyO_Pop_Directrep") },
   { value: 4, label: getLocale("OKR_MyO_Pop_Specified") },
 ];
 
-const visibilityMapText = {
+const getVisibilityMapText = () => ({
   1: getLocale("OKR_MyO_Pop_Public"),
   2: getLocale("OKR_MyO_From_Associatedmem"),
   3: getLocale("OKR_MyO_Pop_Directrep"),
   4: getLocale("OKR_MyO_Pop_Specified"),
-};
+});
 
 interface IVisibilityProps {
   visibility: any;
@@ -41,43 +41,59 @@ const Visibility: FC<IVisibilityProps> = ({
     const { departments, groups, users } = selectNodes;
     if (departments.length === 0 && groups.length === 0 && users.length === 0) {
       setVisibilityState(oldSelect.current);
-      // @ts-ignore
-      selectorRef.current && selectorRef.current.close();
+      if (selectorRef.current) {
+        // @ts-ignore
+        selectorRef.current.close();
+      }
       return;
     }
-    onChangeVisiableLimit && onChangeVisiableLimit(4, selectNodes);
-    // @ts-ignore
-    selectorRef.current && selectorRef.current.close();
+    if (onChangeVisiableLimit) {
+      onChangeVisiableLimit(4, selectNodes);
+    }
+    if (selectorRef.current) {
+      // @ts-ignore
+      selectorRef.current.close();
+    }
   }, [onChangeVisiableLimit]);
 
   const handleChangeVisibility = useCallback((data) => {
     setVisibilityState(data.value);
     if (data.value === 4) {
-      // @ts-ignore
-      selectorRef.current && selectorRef.current.open();
+      if (selectorRef.current) {
+        // @ts-ignore
+        selectorRef.current.open();
+      }
     } else {
       oldSelect.current = data.value;
-      onChangeVisiableLimit && onChangeVisiableLimit(data.value);
+      if (onChangeVisiableLimit) {
+        onChangeVisiableLimit(data.value);
+      }
     }
   }, [onChangeVisiableLimit]);
 
   const renderText = useMemo(() => {
     const result = [];
     if (visiableLimit) {
-      visiableLimit.users && visiableLimit.users.length > 0 && visiableLimit.users.forEach((item, index) => {
-        if (index !== 0) { result.push("、"); }
-        result.push(<OpenUserName name={item.name} id={item.userId} />);
-      });
-      visiableLimit.departments && visiableLimit.departments.length > 0 ? visiableLimit.departments.forEach((item, index) => {
-        result.push(index === 0 && result.length === 0 ? "" : "、");
-        result.push(<OpenDepartmentName name={item.name} id={item.id} />);
-      }) : "";
-      visiableLimit.groups && visiableLimit.groups.length > 0 ? visiableLimit.groups.forEach((item, index) => {
-        result.push(index === 0 && result.length === 0 ? "" : "、");
-        result.push(item.name);
-      }) : "";
+      if (visiableLimit.users && visiableLimit.users.length > 0) {
+        visiableLimit.users.forEach((item, index) => {
+          if (index !== 0) { result.push("、"); }
+          result.push(<OpenUserName name={item.name} id={item.userId} />);
+        });
+      }
+      if (visiableLimit.departments && visiableLimit.departments.length > 0) {
+        visiableLimit.departments.forEach((item, index) => {
+          result.push(index === 0 && result.length === 0 ? "" : "、");
+          result.push(<OpenDepartmentName name={item.name} id={item.id} />);
+        });
+      }
+      if (visiableLimit.groups && visiableLimit.groups.length > 0) {
+        visiableLimit.groups.forEach((item, index) => {
+          result.push(index === 0 && result.length === 0 ? "" : "、");
+          result.push(item.name);
+        });
+      }
     }
-    return result.length > 0 ? result : visibilityMapText[visibilityState];
+    return result.length > 0 ? result : getVisibilityMapText()[visibilityState];
   }, [visiableLimit, visibilityState]);
 
   useEffect(() => {
@@ -112,7 +128,7 @@ const Visibility: FC<IVisibilityProps> = ({
         textClass="base-info-other-infos__visibility-select-text"
         forceRenderText={visibility === 4}
         initText={renderText as any}
-        items={visibilityList}
+        items={getVisibilityList()}
         initValue={visibilityState}
         onChangeSelect={handleChangeVisibility}
       />
@@ -131,4 +147,8 @@ const Visibility: FC<IVisibilityProps> = ({
   );
 };
 
+Visibility.defaultProps = {
+  canEdit: false,
+};
+
 export default Visibility;

package/src/components/part-notice/index.scss

@@ -0,0 +1,37 @@
+.part-notice {
+  margin-left: 16px;
+  height: 36px;
+  background: #fcedd4;
+  display: flex;
+  align-items: center;
+  font-size: 12px;
+  font-weight: 400;
+  color: #3f4755;
+  line-height: 18px;
+  position: relative;
+  padding: 0 12px;
+  margin-bottom: 10px;
+  margin-top: 16px;
+  border-radius: 12px;
+
+  > .tu-icon-tishi {
+    color: #f0a326;
+    margin-right: 8px;
+  }
+  &__link {
+    color: #f6bd16;
+    cursor: pointer;
+  }
+  &__close {
+    color: #f6bd16;
+    cursor: pointer;
+    font-size: 16px;
+    position: absolute;
+    right: 12px;
+  }
+  &__image {
+    width: 16px;
+    height: 16px;
+    margin-right: 8px;
+  }
+}

package/src/components/part-notice/index.tsx

@@ -0,0 +1,50 @@
+import React, { FC, useState, useCallback } from "react";
+import { LocalStorage } from "../../utils/local-storage";
+import "./index.scss";
+
+interface Props {
+  text: any;
+  link: string;
+  storageName?: string;
+}
+
+const preCls = "part-notice";
+const storage = new LocalStorage();
+
+const PartNotice: FC<Props> = ({ storageName, text, link }) => {
+  const [visible, setVisible] = useState(() => {
+    const stopTaking: any = storage.getItem(storageName);
+    if (stopTaking?.date) {
+      const oldDate = new Date(stopTaking?.date).getDate();
+      const newDate = new Date().getDate();
+      if (newDate > oldDate) {
+        return true;
+      }
+      return false;
+    }
+    return true;
+  });
+
+  const handleClose = useCallback(() => {
+    setVisible(false);
+    storage.setItem(storageName, { bol: false, date: new Date() });
+  }, []);
+
+  const handleOpenLink = () => {
+    window.open(link, "_target");
+  };
+  if (!visible) return <span />;
+  return (
+    <div className={`${preCls}`}>
+      <span className="tu-icon-tishi" />
+      {text}
+      <span className={`${preCls}__link`} onClick={handleOpenLink}>了解详情</span>
+      <span className={`tu-icon-close  ${preCls}__close`} onClick={handleClose} />
+    </div>
+  );
+};
+PartNotice.defaultProps = {
+  storageName: "partNotice",
+};
+
+export default PartNotice;

package/src/components-v1/userSelector/components/MultiMode/index.tsx

@@ -29,6 +29,21 @@ interface Props {
 export default class MutiMode extends PureComponent<Props> {
   tab: any;
 
+  componentDidUpdate(prevProps: Props) {
+    const { searchTxt } = this.props;
+    if (prevProps.searchTxt !== searchTxt) {
+      if (searchTxt) {
+        this.tab.changeTab("common");
+      }
+    }
+  }
+
+  handleDepartment = (d: Dept) => {
+    const { selectedDept, onSelectDept } = this.props;
+    if (selectedDept.findIndex((sd) => sd.Id === d.Id) !== -1) return;
+    onSelectDept(d);
+  };
+
   handleSelectUser = (users: User[]) => {
     const { selectedUser, onSelectUser } = this.props;
     const m = {};
@@ -38,23 +53,16 @@ export default class MutiMode extends PureComponent<Props> {
     onSelectUser(filterdUsers);
   };
 
-  handleDepartment = (d: Dept) => {
-    const { selectedDept, onSelectDept } = this.props;
-    if (selectedDept.findIndex((sd) => sd.Id == d.Id) != -1) return;
-    onSelectDept(d);
-  };
-
-  componentDidUpdate(prevProps: Props) {
-    if (prevProps.searchTxt != this.props.searchTxt) {
-      if (this.props.searchTxt) {
-        this.tab.changeTab("common");
-      }
-    }
-  }
-
   render() {
     const {
-      selectedUser, selectedDept, onDeleteUser, onDeleteDept, onClear, deptSelectable, rootSelectable,
+      selectedUser,
+      selectedDept,
+      onDeleteUser,
+      onDeleteDept,
+      onClear,
+      deptSelectable,
+      rootSelectable,
+      searchTxt,
     } = this.props;
     const deptIsSelected = selectedDept.length > 0;
     const userIsSelected = selectedUser.length > 0;
@@ -62,7 +70,10 @@ export default class MutiMode extends PureComponent<Props> {
       {
         title: getLocale("OKR_MyO_Butt_Commonlyused"),
         name: "common",
-        component: <CommonList searchTxt={this.props.searchTxt} onSelect={(u: User[]) => this.handleSelectUser(u)} />,
+        component: <CommonList
+          searchTxt={searchTxt}
+          onSelect={(u: User[]) => this.handleSelectUser(u)}
+        />,
       },
       {
         title: getLocale("OKR_MyO_Butt_Subordinate"),
@@ -74,7 +85,11 @@ export default class MutiMode extends PureComponent<Props> {
     tabOptions.push({
       title: getLocale("Mod_Department"),
       name: "department",
-      component: <DepartmentList rootSelectable={rootSelectable} onSelectUser={(u: User[]) => this.handleSelectUser(u)} onSelectDept={deptSelectable ? (d: Dept) => this.handleDepartment(d) : undefined} />,
+      component: <DepartmentList
+        rootSelectable={rootSelectable}
+        onSelectUser={(u: User[]) => this.handleSelectUser(u)}
+        onSelectDept={deptSelectable ? (d: Dept) => this.handleDepartment(d) : undefined}
+      />,
     });
     // }
     return (
@@ -87,7 +102,7 @@ export default class MutiMode extends PureComponent<Props> {
             <span>
               {getLocale("Mod_Selecperson")}
               {selectedUser.length + getLocale("Mod_Number")}
-              {deptIsSelected && `,组${selectedDept.length}个`}
+              {deptIsSelected && `,${getLocale("Mod_departments").replace("XX", `${selectedDept.length}`)}`}
             </span>
             <ClearBtn active={deptIsSelected || userIsSelected} onMouseDown={() => onClear()}>
               {getLocale("OKR_MyO_Pop_Clearselected")}

package/src/index.js

@@ -1,5 +1,4 @@
 import "./index.scss";
-import { default as StopTakingModal } from "./components/stop-taking-modal";
 
 export { default as Dialog } from "./components/dialog";
 export { default as Switch } from "./components/switch";
@@ -58,6 +57,7 @@ export { default as OkrShare } from "./components/okr-share";
 export { default as OkrcaseLibrary } from "./components/okrcase-library";
 export { default as OkrcaseLibraryCard } from "./components/okrcase-library-card";
 export { default as OperationRecords } from "./components/operation-records";
+export { default as PartNotice } from "./components/part-notice";
 export { default as Pagination } from "./components/pagination";
 export { default as PasswordInput } from "./components/password-input";
 export { default as PhotoCard } from "./components/photo-card";

package/src/utils/open-data.js

@@ -32,12 +32,12 @@ function openData(p) {
       const ref = useRef(null);
 
       useEffect(() => {
-        let wWOpenData = window.WWOpenData;
+        let wWOpenData = window.top.WWOpenData;
 
-        // 如果当前页面中没有 WWOpenData 则去 top 上尝试获取
-        if (!wWOpenData && window.top.WWOpenData) {
-          wWOpenData = window.top.WWOpenData;
-        }
+        // // 如果当前页面中没有 WWOpenData 则去 top 上尝试获取
+        // if (!wWOpenData && window.top.WWOpenData) {
+        //   wWOpenData = window.top.WWOpenData;
+        // }
 
         wWOpenData && wWOpenData.bind(ref.current);
       });