@titaui/pc 1.9.27 → 1.9.31

package/src/components/dynamic/dynamic-item/dynamic-share-to-dynamic/index.tsx

@@ -9,6 +9,7 @@ import { getFeedTypeAndTypeColor } from '../../util';
 import { highLightWord } from '../../../../utils/tools';
 import { getUserInfo } from '../../../../utils/bs-global';
 import Guanlian from './img/guanlian.png';
+import { getLocale } from '../../../../utils/getLocale';
 import './index.scss';
 
 const prefix = 'titaui-dynamic-share-to-dynamic';
@@ -27,7 +28,7 @@ const DynamicShare: FC<IDynamicItemContentProps> = ({ data, hasDynamicOpereateAu
 	const renderDesc = useMemo(() => {
 		return (
 			<Fragment>
-				<span className={prefix + '__operate-desc'}>分享了一堂好课</span>
+				<span className={prefix + '__operate-desc'}>{getLocale('Feed_sharedexcelle')}</span>
 				<span className={prefix + '-desc-operate-type'} style={{ background: feedTypeColor }} />
 			</Fragment>
 		);

package/src/components/grid-layout/commen-components/scroll-tips.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useState, Fragment } from 'react';
-import { testDayChange } from '../../../utils/date-test-change';
+import { judgeTimeSpaceFromNow } from '../../../utils/date-test-change';
 import Avatar from '../../avatar';
 import { OpenUserName } from '../../../utils/open-data';
 
@@ -27,11 +27,11 @@ export default function ScrollTips(props: Props) {
   } = props;
 
   const [updateTime, setUpdateTime] = useState(
-    message && testDayChange(message.date)
+    message && judgeTimeSpaceFromNow(message.date)
   );
 
   useEffect(() => {
-    setUpdateTime(message && testDayChange(message.date));
+    setUpdateTime(message && judgeTimeSpaceFromNow(message.date));
   }, [message && message.date]);
 
   return (
@@ -50,11 +50,11 @@ export default function ScrollTips(props: Props) {
 
 export const AvatarTips = ({ message, content, styles = {} }: Props) => {
   const [updateTime, setUpdateTime] = useState(
-    message && testDayChange(message.date)
+    message && judgeTimeSpaceFromNow(message.date)
   );
 
   useEffect(() => {
-    setUpdateTime(message && testDayChange(message.date));
+    setUpdateTime(message && judgeTimeSpaceFromNow(message.date));
   }, [message && message.date]);
   console.log(updateTime);
 

package/src/components/grid-layout/near-visitors/visitor.tsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useState, useRef } from 'react';
 import Tooltip from '../../tooltip';
 import Avatar from '../../avatar';
-import { testDayChange } from '../../../utils/date-test-change';
+import { judgeTimeSpaceFromNow } from '../../../utils/date-test-change';
 import { OpenUserName } from '../../../utils/open-data';
 
 interface Props {
@@ -15,11 +15,11 @@ interface Props {
 export default function Visitor(props: Props) {
   const { iconSrc, name, dateTime, avatarColor, userId } = props;
 
-  const [visitTime, setVisitTime] = useState(testDayChange(dateTime));
+  const [visitTime, setVisitTime] = useState(judgeTimeSpaceFromNow(dateTime));
   const toolTipRef = useRef<any>();
 
   useEffect(() => {
-    setVisitTime(testDayChange(dateTime));
+    setVisitTime(judgeTimeSpaceFromNow(dateTime));
   }, [dateTime]);
 
   return (

package/src/components/grid-layout/sub-employee-okr/person-okr.tsx

@@ -2,7 +2,7 @@ import React, { useState, useEffect, useRef } from 'react';
 import Progress from '../../progress/index'
 import Tooltip from '../../tooltip'
 import Avatar from '../../avatar';
-import { testDayChange } from '../../../utils/date-test-change';
+import { judgeTimeSpaceFromNow } from '../../../utils/date-test-change';
 import { OpenUserName } from '../../../utils/open-data';
 
 import './index.scss';
@@ -19,10 +19,10 @@ interface Props {
 export default function PersonalOkr(props: Props) {
   const { iconSrc, name, updateTime, num, avatarColor, userId } = props;
 
-  const [subUpdateTime, setSubUpdateTime] = useState(testDayChange(updateTime));
+  const [subUpdateTime, setSubUpdateTime] = useState(judgeTimeSpaceFromNow(updateTime));
   const toolTipRef = useRef<any>();
   useEffect(() => {
-    setSubUpdateTime(testDayChange(updateTime));
+    setSubUpdateTime(judgeTimeSpaceFromNow(updateTime));
   }, [updateTime]);
   return (
     <div className="subOKRComponents-PersonalOkr">

package/src/components/grid-page/commen-components/scroll-tips.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useState, Fragment } from 'react';
-import { testDayChange } from '../../../utils/date-test-change';
+import { judgeTimeSpaceFromNow } from '../../../utils/date-test-change';
 import Avatar from '../../avatar';
 import { OpenUserName } from '../../../utils/open-data';
 
@@ -27,11 +27,11 @@ export default function ScrollTips(props: Props) {
   } = props;
 
   const [updateTime, setUpdateTime] = useState(
-    message && testDayChange(message.date)
+    message && judgeTimeSpaceFromNow(message.date)
   );
 
   useEffect(() => {
-    setUpdateTime(message && testDayChange(message.date));
+    setUpdateTime(message && judgeTimeSpaceFromNow(message.date));
   }, [message && message.date]);
 
   return (
@@ -50,11 +50,11 @@ export default function ScrollTips(props: Props) {
 
 export const AvatarTips = ({ message, content, styles = {} }: Props) => {
   const [updateTime, setUpdateTime] = useState(
-    message && testDayChange(message.date)
+    message && judgeTimeSpaceFromNow(message.date)
   );
 
   useEffect(() => {
-    setUpdateTime(message && testDayChange(message.date));
+    setUpdateTime(message && judgeTimeSpaceFromNow(message.date));
   }, [message && message.date]);
   console.log(updateTime);
 

package/src/components/grid-page/near-visitors/visitor.tsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useState, useRef } from 'react';
 import Tooltip from '../../tooltip';
 import Avatar from '../../avatar';
-import { testDayChange } from '../../../utils/date-test-change';
+import { judgeTimeSpaceFromNow } from '../../../utils/date-test-change';
 import { OpenUserName } from '../../../utils/open-data';
 
 interface Props {
@@ -15,11 +15,11 @@ interface Props {
 export default function Visitor(props: Props) {
   const { iconSrc, name, dateTime, avatarColor, userId } = props;
 
-  const [visitTime, setVisitTime] = useState(testDayChange(dateTime));
+  const [visitTime, setVisitTime] = useState(judgeTimeSpaceFromNow(dateTime));
   const toolTipRef = useRef<any>();
 
   useEffect(() => {
-    setVisitTime(testDayChange(dateTime));
+    setVisitTime(judgeTimeSpaceFromNow(dateTime));
   }, [dateTime]);
 
   return (

package/src/components/help-card/image/liaojie.svg

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="240px" height="240px" viewBox="0 0 240 240" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>liaojie</title>
+    <g id="liaojie" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <path d="M120,20 C64.771525,20 20,64.771525 20,120 C20,175.228475 64.771525,220 120,220 C175.228475,220 220,175.228475 220,120 C220,64.771525 175.228475,20 120,20 Z M120,36 C166.391919,36 204,73.608081 204,120 C204,166.391919 166.391919,204 120,204 C73.608081,204 36,166.391919 36,120 C36,73.608081 73.608081,36 120,36 Z" id="椭圆形" fill="#141C28" fill-rule="nonzero"></path>
+        <path d="M120.008756,67 C111.978786,67 104.365434,69.5751522 98.5581514,74.2740154 C92.5462972,79.1476855 89.1380286,85.7464547 89.0041026,92.8525998 L89,93.4421688 C89,98.0147412 92.7048728,101.721543 97.275065,101.721543 C101.845257,101.721543 105.55013,98.0147412 105.55013,93.4421688 L105.55013,93.2882935 C105.55013,87.633082 111.918127,82.717229 120.008756,82.717229 C128.099386,82.717229 134.467382,87.633082 134.467382,93.2882935 C134.467382,97.3618411 131.236598,101.705432 126.529119,103.512236 L126.226653,103.624092 C121.998705,105.120732 118.37505,107.759616 115.76761,111.242806 C113.200769,114.69201 111.71593,119.721641 111.71593,124.292547 L111.71593,134.720625 C111.71593,139.293198 115.420803,143 119.990995,143 C124.561188,143 128.26606,139.293198 128.26606,134.720625 L128.26606,124.095087 C128.26606,121.733292 129.969128,119.083428 132.030331,118.350524 C143.332617,114.321686 151.000085,104.106804 151.000085,93.2882935 C151.0197,86.0248852 147.599248,79.251479 141.461239,74.2755365 C135.666971,69.5693086 128.057111,67 120.008756,67 Z" id="路径" fill="#2879FF" fill-rule="nonzero"></path>
+        <path d="M109,162 C109,168.075132 113.924868,173 120,173 C126.075132,173 131,168.075132 131,162 C131,155.924868 126.075132,151 120,151 C113.924868,151 109,155.924868 109,162 Z" id="路径" fill="#000000" fill-rule="nonzero"></path>
+    </g>
+</svg>

package/src/components/help-card/index.scss

@@ -14,7 +14,8 @@
   &-image {
     width: 24px;
     height: 24px;
-    background: url("./image/kefu.svg") 50% 50% no-repeat;
+    background: url("./image/liaojie.svg") 50% 50% no-repeat;
+    background-size: 24px 24px;
   }
 
   &-canceled {
@@ -206,20 +207,20 @@
   }
 
   100% {
-    transform: rotate(90deg);
+    transform: rotate(-90deg);
   }
 }
 
 @keyframes titaZoomInLB {
   0% {
     opacity: 0;
-    transform-origin: 0 100%;
+    transform-origin: 100% 100%;
     transform: scale(0, 0);
   }
 
   100% {
     opacity: 1;
-    transform-origin: 0 100%;
+    transform-origin: 100% 100%;
     transform: scale(1, 1);
   }
 }
@@ -227,13 +228,13 @@
 @keyframes titaZoomOutLB {
   0% {
     opacity: 1;
-    transform-origin: 0 100%;
+    transform-origin: 100% 100%;
     transform: scale(1, 1);
   }
 
   100% {
     opacity: 0;
-    transform-origin: 0 100%;
+    transform-origin: 100% 100%;
     transform: scale(0, 0);
   }
 }

package/src/components/help-card/index.tsx

@@ -209,7 +209,7 @@ const HelpCard: FC<HelpCardProps> = ({ ...restProps }) => {
     <div {...restProps}>
       <Popup
         popupTransitionName="tita-popup-zoom-left-bottom"
-        placement="topRight"
+        placement="topLeft"
         popupAlign={{
           offset: [-32, -10],
           overflow: {

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

@@ -0,0 +1,82 @@
+.tencent-hr-header {
+  width: 100%;
+  height: 60px;
+  display: flex;
+  align-items: center;
+  box-sizing: border-box;
+  padding: 0 30px;
+  flex-shrink: 0;
+  background-color: #3464E0;
+  &__title {
+    font-size: 14px;
+    font-weight: bold;
+    color: #FFFFFF;
+    margin-right: 98px;
+  }
+  &__menu-list{
+    display: flex;
+    align-items: stretch;
+    flex: 1;
+  }
+  &__item {
+    height: 100%;
+    width: 120px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin: 0 5px;
+    & > a {
+      color: #FFF;
+    }
+    img {
+      width: 12px;
+      height: 12px;
+      margin-left: 4px;
+      transition: transform .2s ease;
+    }
+  }
+  &__user {
+    font-size: 14px;
+    color: #FFFFFF;
+    cursor: pointer;
+    & > img {
+      width: 10px;
+      height: 10px;
+      margin-left: 4px;
+      transition: transform .2s ease;
+    }
+  }
+}
+.tencent-hr-header-popup {
+  position: relative;
+  background-color: #fff;
+  box-shadow: 0px 4px 24px 0px rgba(127, 145, 180, 0.2);
+  border-radius: 12px;
+  min-width: 104px;
+  padding: 16px 0;
+  margin-top: 6px;
+  &__item {
+    display: flex;
+    height: 32px;
+    padding: 0 24px;
+    align-items: center;
+    justify-content: flex-start;
+    color: #666666;
+    &:hover{
+      background: #F5F7F9;
+      color: #3464E0;
+    }
+    
+  }
+  &::before {
+    display: block;
+    content: '';
+    position: absolute;
+    top: -6px;
+    left: calc(50% - 6px);
+    border-top: none;
+    border-left: 6px solid transparent;
+    border-right: 6px solid transparent;
+    border-bottom: 6px solid #FFF;
+  }
+}

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

@@ -0,0 +1,117 @@
+import React, { ReactElement, useState } from 'react';
+import { useEffect } from 'react';
+import classNames from 'classnames';
+import axios from 'axios';
+import  Popup  from '../popup';
+import { getLoginUserInfo } from '../../utils/helpers';
+import './index.scss';
+
+interface Props {}
+const preCls = 'tencent-hr-header';
+function HrHeader({}: Props): ReactElement {
+  const [menus, setMenus] = useState<any[]>([]);
+  const [isShowMore, setIsShowMore] = useState(false);
+  const [isShowUserMenu, setIsShowUserMenu] = useState(false);
+  useEffect(() => {
+    if (true) {
+      axios.get('/_caagw/getNavInfoByCorpKey').then((res) => {
+        const data = res.data.data;
+        setMenus(data.menus);
+      });
+    } else {
+      setMenus([
+        {
+          appKey: 'contacts',
+          appName: '人事通讯录',
+          appUrl: 'http://contacts-wxvendor.test-caagw.yunassess.com/',
+        },
+        {
+          appKey: 'regist',
+          appName: '入职管理',
+          appUrl: 'http://regist-wxvendor.test-caagw.yunassess.com/pc/',
+        },
+        {
+          appKey: 'jixiaobao',
+          appName: '绩效考核',
+          appUrl: 'http://contacts-wxvendor.test-caagw.yunassess.com/',
+        },
+        {
+          appKey: 'regist1',
+          appName: '入职管理1',
+          appUrl: 'http://regist-wxvendor.test-caagw.yunassess.com/pc/',
+        },
+        {
+          appKey: 'contacts2',
+          appName: '人事通讯录2',
+          appUrl: 'http://contacts-wxvendor.test-caagw.yunassess.com/',
+        },
+        {
+          appKey: 'regist2',
+          appName: '入职管理2',
+          appUrl: 'http://regist-wxvendor.test-caagw.yunassess.com/pc/',
+        },
+        {
+          appKey: 'regist3',
+          appName: '入职管理3',
+          appUrl: 'http://regist-wxvendor.test-caagw.yunassess.com/pc/',
+        },
+      ]);
+    }
+  }, []);
+  return (
+    <div className={preCls}>
+      <span className={preCls + '__title'}>腾讯HR助手</span>
+      <div className={preCls + '__menu-list'}>
+        {menus.slice(0, 5).map((menu) => (
+          <div
+            key={menu.appKey}
+            className={classNames(preCls + '__item', {
+              [preCls + '__item--active']: menu.appKey == 'jixiaobao',
+            })}
+          >
+            <a href={menu.appUrl}>{menu.appName}</a>
+          </div>
+        ))}
+        {menus.length > 5 && (
+          <Popup
+            popupVisible={isShowMore}
+            onPopupVisibleChange={setIsShowMore}
+            popupPlacement="bottom"
+            popup={
+                  <div className='tencent-hr-header-popup'>
+                    {menus.slice(6).map((menu) => (
+                      <a className='tencent-hr-header-popup__item' href={menu.appUrl}>{menu.appName}</a>
+                    ))}
+                  </div>
+                }
+          >
+            <div key='more' className={classNames(preCls + '__item')}>
+              <a>更多</a>
+              <img
+                src={require('./arrow.png')}
+                style={{ transform: `rotate(${isShowMore ? 180 : 0}deg)` }}
+              />
+            </div>
+          </Popup>
+        )}
+      </div>
+      <Popup
+        popupVisible={isShowUserMenu}
+        onPopupVisibleChange={setIsShowUserMenu}
+        popupPlacement="bottom"
+        popup={
+          <div className='tencent-hr-header-popup'>
+            <a className='tencent-hr-header-popup__item' href={'/_logout?r='+(new Date().getTime())}>退出</a>
+          </div>
+        }
+      >
+        <span className={preCls + '__user'}>
+          {getLoginUserInfo().Name}
+          <img src={require('./arrow.png')} style={{ transform: `rotate(${isShowUserMenu ? 180 : 0}deg)` }}/>
+        </span>
+      </Popup>
+    </div>
+  );
+}
+
+export default HrHeader;

package/src/components/menus/components/flip-menu-card/index.scss

@@ -130,6 +130,7 @@
     background-repeat: no-repeat;
     background-position: 50% 4px;
     animation: hasMoreLight 0.5s 0.2s linear infinite;
+    cursor: pointer;
   }
 }
 @keyframes hasMoreLight {

package/src/components/menus/components/flip-menu-card/index.tsx

@@ -159,6 +159,13 @@ export default forwardRef((props: Props, ref) => {
       } else {
         setShowMore(false);
       }
+      scrollArea.addEventListener('scroll', () => {
+        if(scrollArea.scrollHeight - scrollArea.offsetHeight == scrollArea.scrollTop) {
+          setShowMore(false)
+        } else {
+          setShowMore(true);
+        }
+      })
     };
     const observer = new MutationObserver(callback);
 

package/src/components/menus/export-modules/appraisal-menus/index.tsx

@@ -1,7 +1,8 @@
 import React, { useState, useRef, useEffect } from "react";
 import classNames from "classnames";
 import { withRouter } from "react-router";
-import { ResizeObserver } from '@juggle/resize-observer';
+// import { ResizeObserver } from '@juggle/resize-observer';
+import ResizeObserver from 'resize-observer-polyfill';
 import FlipCard, { flipRefIns } from "../../components/flip-menu-card";
 import MenuTree from "../../components/menu-tree";
 import Scrollbar from '../../../scrollbar';
@@ -22,7 +23,7 @@ const AppraisalMenus = (props: Props) => {
   const { onSelect = () => { }, history } = props;
 
   const [maxHeight, setMaxHeight] = useState<number>(() => {
-    return document.body.offsetHeight - (220 + 28 * 2);
+    return document.body.offsetHeight - 170;
   });
   const [selectedMenuKeys, setSelectedMenuKeys] = useState<string[]>([]);
 
@@ -74,7 +75,7 @@ const AppraisalMenus = (props: Props) => {
     const obs = new ResizeObserver(entries => {
       for (let entry of entries) {
         const cr = entry.contentRect;
-        setMaxHeight(cr.height - (220 + 28 * 2));
+        setMaxHeight(cr.height - 170);
       }
     })
     obs.observe(document.body);

package/src/components/menus/export-modules/okr-menus/depart-menus/index.tsx

@@ -1,7 +1,8 @@
 import React, { useState, useEffect, useRef } from "react";
 import classNames from 'classnames';
 import { locale } from '../../../i18n';
-import { ResizeObserver } from '@juggle/resize-observer';
+// import { ResizeObserver } from '@juggle/resize-observer';
+import ResizeObserver from 'resize-observer-polyfill';
 import MenuTree from "../../../components/menu-tree";
 import { getDepsAndUsers } from "../../../request-apis";
 import { DEPART_NODE, USER_NODE } from '../../../components/menu-tree/tree-node/index';

package/src/components/menus/export-modules/okr-menus/okr-front-menus.tsx

@@ -1,6 +1,7 @@
 import React, { useState, useRef, useEffect, forwardRef, useImperativeHandle } from "react";
 // import classNames from "classnames";
-import { ResizeObserver } from '@juggle/resize-observer';
+// import { ResizeObserver } from '@juggle/resize-observer';
+import ResizeObserver from 'resize-observer-polyfill';
 import { flipRefIns } from "../../components/flip-menu-card";
 import Scrollbar from '../../../scrollbar';
 import MenuTree from "../../components/menu-tree";
@@ -31,7 +32,7 @@ export default forwardRef((props: Props, ref) => {
   } = props;
 
   const [maxHeight, setMaxHeight] = useState<number>(() => {
-    return document.body.offsetHeight - (220 + 28 * 2);
+    return document.body.offsetHeight - 210;
   });
   const [expandedKeys, setExpandedKeys] = useState(['myokr']);
   const [selectedMenuKeys, setSelectedMenuKeys] = useState<string[]>([]);
@@ -158,7 +159,7 @@ export default forwardRef((props: Props, ref) => {
     const obs = new ResizeObserver(entries => {
       for (let entry of entries) {
         const cr = entry.contentRect;
-        setMaxHeight(cr.height - (220 + 28 * 2));
+        setMaxHeight(cr.height - 210);
       }
     })
     obs.observe(document.body);

package/src/components/menus/export-modules/okr-menus/subordinate-menus/index.tsx

@@ -1,6 +1,7 @@
 import React, { useState, useEffect, useRef } from "react";
 import classNames from 'classnames';
-import { ResizeObserver } from '@juggle/resize-observer';
+// import { ResizeObserver } from '@juggle/resize-observer';
+import ResizeObserver from 'resize-observer-polyfill';
 import MenuTree from "../../../components/menu-tree";
 import { getSubordinates } from "../../../request-apis";
 import { ITreeNode } from "../../../types";
@@ -24,7 +25,7 @@ export default (props) => {
   const [selectedMenuKeys, setSelectedMenuKeys] = useState<string[]>([]);
   const [loginUserId] = useState(window.BSGlobal && window.BSGlobal.loginUserInfo.Id || 0);
   const [maxHeight, setMaxHeight] = useState<number>(() => {
-    return document.body.offsetHeight - (240);
+    return document.body.offsetHeight - 200;
   });
 
   useEffect(() => {
@@ -76,7 +77,7 @@ export default (props) => {
     const obs = new ResizeObserver(entries => {
       for (let entry of entries) {
         const cr = entry.contentRect;
-        setMaxHeight(cr.height - (240));
+        setMaxHeight(cr.height - 200);
       }
     })
     obs.observe(document.body);

package/src/components/nav-top/components/user-message/components/reply/reply-item.tsx

@@ -28,7 +28,7 @@ const Reply = (props) => {
 
   const feedText = () => {
     if (!item.content.trim()) {
-      return '分享了附件';
+      return '分享了文件';
     } else {
       return deleteText(htmlToText(item.content));
     }

package/src/components/nav-top/components/user-own-menu/utils.ts

@@ -41,14 +41,14 @@ const getLimit = () => [
     id: "manage",
     icon: "tu-icon-myqyht",
     title: getLocale('Per_Menu_Admin'),
-    objUrl: `${tm}`,
+    objUrl: `${apiServer}/${userId}/tmHome`,
     otherInfo: {}
   },
   {
     id: "open",
     icon: "tu-icon-my-gjgn",
     title: getLocale('Per_Menu_AdvancedFeatures'),
-    objUrl: `${tm}${tm.indexOf(`${userId}/TmHome`) != -1 ?'':`/${userId}/TmHome`}#?iTalentFrameType=iframe&iTalentFrame=${tm.indexOf(`${userId}/TmHome`) != -1 ?`${tm.replace(`/TmHome`,'')}`:`${tm}/${userId}`}/indexV2#/advancedSettings`,
+    objUrl: `${apiServer}/${userId}/tmHome#?iTalentFrameType=iframe&iTalentFrame=${apiServer}/${userId}/indexV2#/advancedSettings`,
     otherInfo: {}
   },
   {

package/src/components/okr-detail/base-info/o-desc/index.tsx

@@ -1,4 +1,5 @@
 import React, { FC, useState, useEffect, useRef, useCallback } from "react";
+import { inputWordTrans } from "../../../../utils/i18n-front-translate";
 import { getLocale } from "../../../../utils/getLocale";
 import "./index.scss";
 
@@ -93,7 +94,7 @@ const ODesc: FC<IODescProps> = ({
     if (!hasError) return <span></span>;
     return (
       <span className="o-desc__errror-tips">
-        已输入{desc.trim().length}个字,最多可输入{maxLength}字
+        {inputWordTrans(desc.trim().length, maxLength)}
       </span>
     );
   };

package/src/components/okr-detail/components/editable-input/index.tsx

@@ -1,6 +1,7 @@
 import React, { useRef, useState, useEffect } from "react";
-import ErrorTip from "../../../tooltip/error-tip";
 import classNames from "classnames";
+import ErrorTip from "../../../tooltip/error-tip";
+import { inputWordTrans } from "../../../../utils/i18n-front-translate";
 
 import './index.scss';
 
@@ -45,7 +46,7 @@ export default (props: IProps) => {
       return setErrorTip(emptyMessage || '');
     }
     if (val.length > maxLength) {
-      return setErrorTip(`已输入${val.length}字，最多可输入${maxLength}字`);
+      return setErrorTip(inputWordTrans(val.length, maxLength));
     }
     setText(val);
     setErrorTip('');

package/src/components/okr-detail/components/header/edit-name.tsx

@@ -3,6 +3,7 @@ import classNames from "classnames";
 import Toast from "../../../toast";
 import { updateOkrName } from "../../request-apis";
 import { getLocale } from "../../../../utils/getLocale";
+import { inputWordTrans } from "../../../../utils/i18n-front-translate";
 
 interface IEditNameProps {
   okrName: string;
@@ -27,7 +28,7 @@ const EditNameCmp = (props: IEditNameProps) => {
       return;
     }
     if (val.length > 500) {
-      setErrorTip(`已输入${val.length}字，最多可输入500字`);
+      setErrorTip(inputWordTrans(val.length, 500));
       return;
     }
     setErrorTip("");

package/src/components/okr-detail/components/okr-tree/tree-node/kr-node/kr-score-editor/edit-pop.tsx

@@ -2,6 +2,7 @@ import React, { PureComponent } from 'react'
 import Popup from '../../../../../../popup';
 import styled from 'styled-components'
 import { getLocale, isEn } from "../../../../../../../utils/getLocale";
+import { inputWordTrans } from '../../../../../../../utils/i18n-front-translate';
 
 const Wrapper = styled.div`
   min-width: 343px;
@@ -172,7 +173,7 @@ export default class EditPop extends PureComponent<Props> {
     this.setState({
       value: value,
       showError: maxLength && value.length > maxLength,
-      errMsg: `已输入 ${value.length} 个字，最多可输入 ${maxLength} 个字`,
+      errMsg: inputWordTrans(value.length, maxLength),
       disable: maxLength && value.length > maxLength && disable ? true : false
     })