@titaui/pc 1.8.4 → 1.8.8

package/src/components/okr-detail/schedule/components/o-progress/index.tsx

@@ -15,6 +15,7 @@ import EmptyPng from '../../img/schedule-empty.png';
 import { OAuth, hasSuperior } from '../../../../../utils/auth';
 import { GeneralDataContext, CommonContext } from '../../../context';
 import { remindAction } from '../../../request-apis';
+import { getLocale } from "../../../../../utils/getLocale";
 import './index.scss';
 
 interface IOProgressProps {
@@ -64,7 +65,7 @@ const OProgress: FC<IOProgressProps> = ({listData, okrInfo, setUpdateProgress, h
   const handleModalOkClick = () => {
     updateProgressDesc(editOProgressId, okrInfo.workId, editOProgressContent ? editOProgressContent : '').then(resp => {
       if (resp.Code === 1) {
-        Toast.Success('操作成功', {canClose: false});
+        Toast.Success(getLocale('Mod_Successfuloperat'), {canClose: false});
         setEditOProgressVisiable(false);
         refreshAll && refreshAll();
         getOProgressData();
@@ -85,7 +86,7 @@ const OProgress: FC<IOProgressProps> = ({listData, okrInfo, setUpdateProgress, h
   const renderContent = ({onOpenModal}) => {
     return (
       <span className='o-progress__func-btn o-progress__func-btn--update' onClick={onOpenModal}>
-        <i className='tu-icon-gengxin o-progress__func-btn-icon'/>更新完成度
+        <i className='tu-icon-gengxin o-progress__func-btn-icon'/>{getLocale('OKR_MyO_Prog_Butt_Update')}
       </span>
     )
   }
@@ -94,7 +95,7 @@ const OProgress: FC<IOProgressProps> = ({listData, okrInfo, setUpdateProgress, h
     // @ts-ignore
     remindAction({toUserId: BSGlobal.loginUserInfo.Id, work_id: okrInfo.workId, type: 2}).then(resp => {
       if (resp.Code === 1) {
-        Toast.Success('提醒成功', {canClose: false});
+        Toast.Success(getLocale('OKR_MyO_Prog_Remindersu'), {canClose: false});
       } else {
         Toast.Error(resp.Message, {canClose: false});
       }
@@ -112,7 +113,7 @@ const OProgress: FC<IOProgressProps> = ({listData, okrInfo, setUpdateProgress, h
       // @ts-ignore 提醒上级查看
       remindAction({toUserId: BSGlobal.loginUserInfo.Id, work_id: okrInfo.workId}).then(resp => {
         if (resp.Code === 1) {
-          Toast.Success('提醒成功', {canClose: false});
+          Toast.Success(getLocale('OKR_MyO_Prog_Remindersu'), {canClose: false});
         } else {
           Toast.Error(resp.Message, {canClose: false});
         }
@@ -160,18 +161,18 @@ const OProgress: FC<IOProgressProps> = ({listData, okrInfo, setUpdateProgress, h
     return (
       <DialogConfirm visible={showRemindDialogConfirm} type="warning">
         {/* @ts-ignore */}
-        <span type="title">确定提醒 Ta 吗？</span>
+        <span type="title">{getLocale('OKR_DR_Pop_Areyousure')}</span>
         {/* @ts-ignore */}
-        <span type="content">系统将会发送通知提醒Ta去更新OKR进展</span>
-        <CancelButton type="button" onClick={handleCancelRemind}>取消</CancelButton>
-        <SureButton type="button" onClick={handleEnsureRemind}>确定</SureButton>
+        <span type="content">{getLocale('OKR_DR_Pop_ThesystemOKR')}</span>
+        <CancelButton type="button" onClick={handleCancelRemind}>{getLocale('Mod_Cancel')}</CancelButton>
+        <SureButton type="button" onClick={handleEnsureRemind}>{getLocale('OKR_MyO_Butt_Determine')}</SureButton>
       </DialogConfirm>
     )
   }, [showRemindDialogConfirm, handleCancelRemind, handleEnsureRemind])
 
   const renderEmptyCmp = useMemo(() => {
     const renderUpdateBtn = ({onOpenModal}) => {
-      return <button className={`o-progress__empty-button ${isPrincipalUser ? '' : 'o-progress__empty-button--not-principaluser'}`} onClick={onOpenModal}>更新完成度</button>
+      return <button className={`o-progress__empty-button ${isPrincipalUser ? '' : 'o-progress__empty-button--not-principaluser'}`} onClick={onOpenModal}>{getLocale('OKR_MyO_Prog_Butt_Update')}</button>
     }
     return (
       <div className={classNames({
@@ -180,13 +181,13 @@ const OProgress: FC<IOProgressProps> = ({listData, okrInfo, setUpdateProgress, h
       })}>
         <img width={128} src={EmptyPng} />
         <span className='o-progress__empty-text'>
-          {isPrincipalUser ? '目标进展一目了然？赶快更新完成度吧' : '暂无目标进展'}
+          {isPrincipalUser ? getLocale('OKR_MyO_KRP_tochecko') : getLocale('OKR_MyO_Pr_Text_Nooprogress')}
         </span>
         {isPrincipalUser && <OProgressUpdate okrInfo={okrInfo} renderContent={renderUpdateBtn} setUpdateData={setUpdateProgress}/>}
-        {!isCanEditProgress && <button className={'o-progress__empty-button'} onClick={handleRemindClick}>提醒更新进展</button>}
+        {!isCanEditProgress && <button className={'o-progress__empty-button'} onClick={handleRemindClick}>{getLocale('OKR_MyO_Pr_Butt_Reminder')}</button>}
         {isCanEditProgress && !isPrincipalUser && 
         <div>
-          <button className={'o-progress__empty-button'} onClick={handleRemindClick}>提醒更新进展</button>
+          <button className={'o-progress__empty-button'} onClick={handleRemindClick}>{getLocale('OKR_MyO_Pr_Butt_Reminder')}</button>
           <OProgressUpdate okrInfo={okrInfo} renderContent={renderUpdateBtn} setUpdateData={setUpdateProgress}/>
         </div>}
       </div>
@@ -194,7 +195,7 @@ const OProgress: FC<IOProgressProps> = ({listData, okrInfo, setUpdateProgress, h
   }, [hasOtherProgress])
 
   const renderDefaultRemindCmp = useMemo(() => {
-    const text = isPrincipalUser ? (hasSuperior() ? '提醒上级查看' : null) : '提醒更新进展';
+    const text = isPrincipalUser ? (hasSuperior() ? getLocale('OKR_MyO_Prog_Butt_Remind') : null) : getLocale('OKR_MyO_Pr_Butt_Reminder');
     return (
       <span className='o-progress__func-btn' onClick={handleRemindClick}>
         {text && <i className='tu-icon-shoushi o-progress__func-btn-icon' />}
@@ -207,7 +208,7 @@ const OProgress: FC<IOProgressProps> = ({listData, okrInfo, setUpdateProgress, h
     <div className={'o-progress__wrapper'}>
       {oProgressData.length === 0 ? renderEmptyCmp : (
         <div className='o-progress__header'>
-          <Title title='目标的进展'/>
+          <Title title={getLocale('OKR_MyO_Prog_Objectiveprogress')}/>
           <div className='o-progress__func-btns'>
             {okrInfo.status === 2 ? null : renderDefaultRemindCmp}
             {isCanEditProgress ? 
@@ -242,7 +243,7 @@ const OProgress: FC<IOProgressProps> = ({listData, okrInfo, setUpdateProgress, h
       {isMoreThanOneProgress ? 
         <div className='o-progress__shrink'>
           <span className='o-progress__shrink-text' onClick={handleChangeShowAll}>
-            {isShowAll ? '收起进展' : '查看全部进展'}
+            {isShowAll ? getLocale('OKR_MyO_Prog_Butt_Fold') : getLocale('OKR_MyO_Pr_Butt_Viewall')}
             <i className={isShowAll ? 'tu-icon-arrow-up' : 'tu-icon-arrow-down'}/>
           </span>
         </div>
@@ -259,7 +260,7 @@ const OProgress: FC<IOProgressProps> = ({listData, okrInfo, setUpdateProgress, h
       >
         <div className={`o-progress__textarea-wrapper ${hasError ? 'o-progress__textarea-wrapper--error' : ''}`}>
           <textarea 
-            placeholder='请输入进展' 
+            placeholder={getLocale('OKR_MyO_Pop_Upd_Pleprogress')}
             className={'o-progress__textarea'} 
             value={editOProgressContent} 
             onChange={handleTextareaChange} />

package/src/components/okr-detail/schedule/util.ts

@@ -1,3 +1,5 @@
+import { getLocale } from "../../../utils/getLocale";
+
 // @ts-nocheck
 export const isPrincipal = (principalUser) => {
   return window.BSGlobal["loginUserInfo"].Id === principalUser.userId;
@@ -11,5 +13,5 @@ export const getToNowTime = (time) => {
   if (diffSecond < 60 * 60 * 24 * 7) {
     return '';
   }
-  return `距上次更新${Math.floor(diffSecond / 60 / 60 / 24)}天`
+  return `${getLocale('OKR_MyO_Pr_Butt_Lastupd')}${Math.floor(diffSecond / 60 / 60 / 24)}${getLocale('OKR_MyO_Pr_Butt_dayago')}`
 }

package/src/components/okr-filter-drawer/filter-form.tsx

@@ -4,6 +4,7 @@ import { getBSGlobal } from "../../utils/bs-global";
 import { RectBtn } from "../button";
 import Form from "../form";
 import { localStorage } from "../../utils/local-storage";
+import { getLocale } from "../../utils/getLocale";
 import "./index.scss";
 const {Fields} = Form
 
@@ -16,6 +17,69 @@ interface FilterFormProps {
 const preCls = "tita-filter__form";
 const useLocalStorage = new localStorage();
 
+const getOkrTypeList = () => [
+  {
+    label: getLocale('Mod_all'),
+    value: "",
+  },
+  {
+    label: getLocale('OKR_MyO_Pop_Company'),
+    value: 3,
+  },
+  {
+    label: getLocale('Mod_Department'),
+    value: 2,
+  },
+  {
+    label: getLocale('OKR_MyO_Text_Team'),
+    value: 4,
+  },
+  {
+    label: getLocale('OKR_MyO_Pop_Individual'),
+    value: 1,
+  },
+];
+const getOkrClassifyList = () => [
+  {
+    label: getLocale('Mod_all'),
+    value: "",
+  },
+  {
+    label: getLocale('OKR_MyO_Es_Commitment'),
+    value: 1,
+  },
+  {
+    label: getLocale('OKR_MyO_Es_Visiontype'),
+    value: 2,
+  },
+];
+const getOrderTypeList = () => [
+  {
+    label: getLocale('OKR_MyO_Text_Firstcreated'),
+    value: 2,
+    toolTip: getLocale('OKR_MyO_Text_First'),
+  },
+  {
+    label: getLocale('OKR_MyO_Text_Latecreation'),
+    value: 1,
+    toolTip: getLocale('OKR_MyO_Text_Created'),
+  },
+  {
+    label: getLocale('OKR_MyO_Text_Earliest'),
+    value: 12,
+    toolTip: getLocale('OKR_MyO_Text_Update'),
+  },
+  {
+    label: getLocale('OKR_MyO_Text_Lateest'),
+    value: 11,
+    toolTip: getLocale('OKR_MyO_Text_Latest'),
+  },
+  {
+    label: getLocale('OKR_MyO_Text_Listed'),
+    value: 13,
+  },
+];
+
 const Filter: FC<FilterFormProps> = ({
   onSearch,
   closeFilterDrawer,
@@ -78,68 +142,6 @@ const Filter: FC<FilterFormProps> = ({
     useLocalStorage.setItem("okr-filter-isRemeber", isRemeber);
   };
 
-  const okrTypeList = [
-    {
-      label: "全部",
-      value: "",
-    },
-    {
-      label: "公司",
-      value: 3,
-    },
-    {
-      label: "部门",
-      value: 2,
-    },
-    {
-      label: "团队",
-      value: 4,
-    },
-    {
-      label: "个人",
-      value: 1,
-    },
-  ];
-  const okrClassifyList = [
-    {
-      label: "全部",
-      value: "",
-    },
-    {
-      label: "承诺型",
-      value: 1,
-    },
-    {
-      label: "愿景型",
-      value: 2,
-    },
-  ];
-  const orderTypeList = [
-    {
-      label: "创建时间最早",
-      value: 2,
-      toolTip: "点击后最早创建在前面",
-    },
-    {
-      label: "创建时间最晚",
-      value: 1,
-      toolTip: "点击后最晚创建在前面",
-    },
-    {
-      label: "更新时间最早",
-      value: 12,
-      toolTip: "点击后最早更新在前面",
-    },
-    {
-      label: "更新时间最晚",
-      value: 11,
-      toolTip: "点击后最晚更新在前面",
-    },
-    {
-      label: "按负责人排序",
-      value: 13,
-    },
-  ];
   return (
     <div className={`${preCls}`}>
       <div className={`${preCls}__content`}>
@@ -151,8 +153,8 @@ const Filter: FC<FilterFormProps> = ({
           {openOkrType ? (
             <Fields.Radios
               name="okrType"
-              label="目标类型"
-              radios={okrTypeList}
+              label={getLocale('OKR_MyO_Pop_Objectivetype')}
+              radios={getOkrTypeList()}
               value={formFieldValues.okrType}
               radioClass={`${preCls}-radio`}
             />
@@ -162,8 +164,8 @@ const Filter: FC<FilterFormProps> = ({
           {openClassify ? (
             <Fields.Radios
               name="okrClassify"
-              label="目标类别"
-              radios={okrClassifyList}
+              label={getLocale('OKR_MyO_Text_Category')}
+              radios={getOkrClassifyList()}
               value={formFieldValues.okrClassify}
               radioClass={`${preCls}-radio`}
             />
@@ -172,8 +174,8 @@ const Filter: FC<FilterFormProps> = ({
           )}
           <Fields.Radios
             name="orderType"
-            label="目标排序"
-            radios={orderTypeList}
+            label={getLocale('OKR_MyO_Text_Sorting')}
+            radios={getOrderTypeList()}
             value={formFieldValues.orderType}
             radioClass={`${preCls}-radio`}
           />
@@ -182,18 +184,20 @@ const Filter: FC<FilterFormProps> = ({
       <div className={`${preCls}__footer`}>
         <span className={`${preCls}__footer-checkbox`}>
           <Checkbox checked={isRemeber.bol} onChange={handleRemember} />
-          <span className={`${preCls}__footer-checkbox-text`}>记住选择</span>
+          <span className={`${preCls}__footer-checkbox-text`}>{getLocale('OKR_MyO_Butt_Remember')}</span>
         </span>
-        <RectBtn type="cancel" className={`${preCls}__footer-reset`} onClick={handleClose}>
-          取消
-        </RectBtn>
-        <RectBtn
-          className={`${preCls}__footer-sure`}
-          type="primary"
-          onClick={handleSubmit}
-        >
-          确定
-        </RectBtn>
+        <div className={`${preCls}__footer-btns`}>
+          <RectBtn type="cancel" className={`${preCls}__footer-reset`} onClick={handleClose}>
+            {getLocale('Mod_Cancel')}
+          </RectBtn>
+          <RectBtn
+            className={`${preCls}__footer-sure`}
+            type="primary"
+            onClick={handleSubmit}
+          >
+            {getLocale('OKR_MyO_Butt_Determine')}
+          </RectBtn>
+        </div>
       </div>
     </div>
   );

package/src/components/okr-filter-drawer/index.scss

@@ -20,7 +20,7 @@
     }
 
     &-radio {
-      width: 154px;
+      width: 190px;
       height: 22px;
       margin-bottom: 12px;
     }
@@ -28,7 +28,11 @@
     &__footer {
       display: flex;
       align-items: center;
-
+      justify-content: space-between;
+      &-btns{
+        display: flex;
+        align-items: center;
+      }
       &-checkbox {
         display: inline-flex;
         align-items: center;
@@ -44,12 +48,10 @@
 
         &-text {
           margin-left: 4px;
-          white-space: nowrap;
         }
       }
 
       &-reset {
-        margin-left: 40px;
         margin-right: 12px;
       }
     }

package/src/components/okr-filter-drawer/index.tsx

@@ -1,7 +1,7 @@
-import React, { FC, useState, Fragment } from "react";
+import React, { FC, Fragment } from "react";
 import Drawer from "../drawer";
 import FilterForm from "./filter-form";
-import PeriodSelector from "../period-selector";
+import { getLocale } from "../../utils/getLocale";
 
 interface FilterRrawerProps {
   visible?: boolean;
@@ -16,9 +16,6 @@ const Filter: FC<FilterRrawerProps> = ({
   onSearch,
   setFilterNum,
 }) => {
-  // const [cycle, setCycle] = useState({});
-  // const [filterDrawerVisible, setFilterDrawerVisible] = useState(visible);
-  const openFilterDrawer = () => setVisible(true);
   const closeFilterDrawer = () => setVisible(false);
   return (
     <Fragment>
@@ -27,10 +24,10 @@ const Filter: FC<FilterRrawerProps> = ({
         onClose={closeFilterDrawer}
         mask={true}
         maskClosable={true}
-        width={372}
+        width={450}
         destroyOnClose={false}
       >
-        <Drawer.Header content="高级筛选" />
+        <Drawer.Header content={getLocale('OKR_MyO_Title_Advanced')} />
         <FilterForm
           onSearch={onSearch}
           closeFilterDrawer={closeFilterDrawer}

package/src/components/okr-flow/child-node/work-node.js

@@ -10,6 +10,7 @@ import preCls from '../precls';
 import { OpenDepartmentName } from '../open-data';
 import { fittingString, getOpenData, setSize } from '../../open-data-painter';
 import { isWx } from '../../../utils/bs-global';
+import { getLocale } from "../../../utils/getLocale";
 
 const WorkNode = ({ data, isSearchRes, darkTheme }) => {
   const {
@@ -33,12 +34,14 @@ const WorkNode = ({ data, isSearchRes, darkTheme }) => {
   const [whiteImg, setWhiteImg] = useState();
   const [imgWidth, setImgWidth] = useState();
 
-  const okrTypeMap = {
-    1: '个人',
-    // 2: <OpenDepartmentName id={departmentId} name={departmentName} />,
-    2: <img src={darkTheme ? whiteImg: departUrl} style={{macWidth: 92}} width={imgWidth}/>,
-    3: '公司',
-    4: groupName || '团队',
+  const getOkrTypeMap = () => {
+    return {
+      1: getLocale('OKR_MyO_Pop_Individual'),
+      // 2: <OpenDepartmentName id={departmentId} name={departmentName} />,
+      2: <img src={darkTheme ? whiteImg: departUrl} style={{macWidth: 92}} width={imgWidth}/>,
+      3: getLocale('OKR_MyO_Pop_Company'),
+      4: groupName || getLocale('OKR_MyO_Text_Team'),
+    }
   };
 
   const getDepartUrl = async () => {
@@ -82,7 +85,7 @@ const WorkNode = ({ data, isSearchRes, darkTheme }) => {
     let cycleTypeCopy = modelType ? (modelType === 2 ? -1 : cycleType) : cycleType;
     switch (cycleTypeCopy) {
       case 0:
-        return '自定义';
+        return getLocale('Mod_Customization');
       case 1:
         return annualNum + '年';
       case 2:
@@ -114,7 +117,7 @@ const WorkNode = ({ data, isSearchRes, darkTheme }) => {
         <Creator creator={principalUser || {}} />
         <div className={classNames(`${preCls}--node-right`)}>
           <OkrType>
-            <span className={classNames(`${preCls}--node-type`)} >{okrTypeMap[okrType]}</span>
+            <span className={classNames(`${preCls}--node-type`)} >{getOkrTypeMap()[okrType]}</span>
           </OkrType>
           <span className={classNames(`${preCls}--node-cycle`)} >
             {getCycleTextByType()}

package/src/components/okr-flow/empty/index.js

@@ -1,5 +1,6 @@
 import preCls from '../precls';
 import classNames from 'classnames';
+import { getLocale } from '.././../../utils/getLocale';
 
 import './index.scss';
 
@@ -7,7 +8,7 @@ const Empty = () => {
   return (
     <div className={classNames(`${preCls}--empty`)}>
       <div className={classNames(`${preCls}--empty--icon`)} />
-      <div className={classNames(`${preCls}--empty--tip`)}>&nbsp;没有找到你想要的 ~</div>
+      <div className={classNames(`${preCls}--empty--tip`)}>&nbsp;{getLocale('OKR_Ali_Text_Didntfind')}</div>
     </div>
   );
 };

package/src/components/okr-flow/export-modal/index.tsx

@@ -10,6 +10,7 @@ import { CommonContext } from "../context";
 import { isWx } from "../../../utils/bs-global";
 import { getBase64DownloadUrl } from "../../okr-share/request-apis";
 import preCls from "../precls";
+import { getLocale } from "../../../utils/getLocale";
 import "rc-color-picker/assets/index.css";
 import "./index.scss";
 
@@ -117,7 +118,7 @@ const ExportMapModal = (props: IProps) => {
 
   return (
     <Dialog
-      title="导出地图"
+      title={getLocale('OKR_Ali_Exportmap')}
       noFooterLine={true}
       visible={visible}
       width="1000px"
@@ -130,7 +131,7 @@ const ExportMapModal = (props: IProps) => {
     >
       <Fragment>
         <div className="export-map-modal__setting">
-          <span style={{marginRight: 10}}>选择背景色</span>
+          <span style={{marginRight: 10}}>{getLocale('OKR_Ali_Selectbackground')}</span>
             <ColorPicker
               animation="slide-up"
               color={"#FFFFFF"}

package/src/components/okr-flow/mini-map/index.js

@@ -3,6 +3,7 @@ import { useZoomPanHelper } from '@titaui/react-flow-renderer';
 import classNames from 'classnames';
 import Tooltip from '../../tooltip';
 import Map from './map';
+import { getLocale } from "../../../utils/getLocale";
 
 import preCls from '../precls';
 import './index.scss';
@@ -39,7 +40,7 @@ const MiniMap = props => {
 
       <div className={classNames(`${preCls}--minimap--operat`)} >
 
-        <Tooltip placement='top' overlay={!visible ? '展开' : '收起'}>
+        <Tooltip placement='top' overlay={!visible ? getLocale('Mod_Unfold') : getLocale('Mod_Fold')}>
           <span
             className={classNames(`${preCls}--minimap--icon`, {
               [`${preCls}--minimap--icon__open`]: !visible,
@@ -51,7 +52,7 @@ const MiniMap = props => {
 
         <span className={classNames(`${preCls}--minimap--divider`)} >|</span>
 
-        <Tooltip placement='top' overlay={<span>缩小</span>}>
+        <Tooltip placement='top' overlay={<span>{getLocale('OKR_Ali_Butt_Narrow')}</span>}>
           <span
             className={classNames(`${preCls}--minimap--size__min`, `${preCls}--minimap--icon`)}
             onClick={onZoomOut}
@@ -60,7 +61,7 @@ const MiniMap = props => {
 
         <span>{zoom}%</span>
 
-        <Tooltip placement='top' overlay={<span>放大</span>}>
+        <Tooltip placement='top' overlay={<span>{getLocale('OKR_Ali_Butt_Enlarge')}</span>}>
           <span
             className={classNames(`${preCls}--minimap--size__max`, `${preCls}--minimap--icon`)}
             onClick={onZoomIn}

package/src/components/okr-period-selector/select-cycle.tsx

@@ -5,6 +5,7 @@ import Popup from "../popup";
 import RangePickerPop from "../range-picker-pop";
 import "./index.scss";
 import { getApiUrl, taker } from "../period-selector/helper";
+import { getLocale } from "../../utils/getLocale";
 
 export interface SelectCycleData {
   cycleType: string;
@@ -22,7 +23,7 @@ interface Props {
   canEdit?: boolean;
   getCycleRange?: boolean;
   popupAlign?: any;
-  className?:string
+  className?: string;
 }
 
 function _formatCycleData(periodParams, getCycleRange) {
@@ -58,9 +59,8 @@ export function CreateCycle({
   },
 }: Props): ReactElement {
   const popRef = useRef();
-  const btnRef = useRef<HTMLButtonElement>() as React.RefObject<
-    HTMLButtonElement
-  >;
+  const btnRef =
+    useRef<HTMLButtonElement>() as React.RefObject<HTMLButtonElement>;
   const [selfCycle, setSelfCycle] = useState(cycle || {});
   const [cycleSetting, setCycleSetting] = useState<any>();
 
@@ -100,10 +100,10 @@ export function CreateCycle({
   };
 
   const handleVisibleChange = (visible) => {
-    if(visible){
+    if (visible) {
       setSelfCycle(cycle);
     }
-  }
+  };
 
   let popup = <div />;
   if (cycleSetting) {
@@ -145,7 +145,7 @@ export function CreateCycle({
             className="okr-detail-date-cycle__date-line"
             style={{ borderBottom: "1px solid #F0F2F5" }}
           >
-            开始日期：
+            {getLocale('Mod_StartDate')}：
             <RangePickerPop
               format="YYYY/MM/DD"
               controlled
@@ -164,7 +164,7 @@ export function CreateCycle({
           </div>
 
           <div className="okr-detail-date-cycle__date-line">
-            结束日期：
+            {getLocale('Mod_EndDate')}：
             <RangePickerPop
               format="YYYY/MM/DD"
               controlled
@@ -188,11 +188,11 @@ export function CreateCycle({
               style={{ marginRight: 12 }}
               onClick={onCancelClickHandler}
             >
-              取消
+              {getLocale("Mod_Cancel")}
             </Button>
 
             <Button size="s" type="primary" onClick={onSureClickHandler}>
-              确定
+              {getLocale("OKR_MyO_Butt_Determine")}
             </Button>
           </div>
         </div>
@@ -218,11 +218,11 @@ export function CreateCycle({
         >
           {renderInnerContent({
             btnRef,
-            clickCallback: ()=>{},
+            clickCallback: () => {},
             text: _formatCycleData(cycle, getCycleRange),
           })}
         </PeriodSelector>
-      )
+      );
     }
   }
 

package/src/components/okr-progress/components/kr-progress/index.tsx

@@ -5,6 +5,7 @@ import TooltipText from '../../../tooltip/tooltip-text';
 import drawerManager from '../../../drawer-manager';
 import { IKrProgressProps } from '../../interface';
 import './index.scss';
+import { getLocale } from '../../../../utils/getLocale';
 
 const renderTitle = (index, title, id) => {
   const handleTitleClick = () => {
@@ -21,7 +22,7 @@ const renderTitle = (index, title, id) => {
 const KrProgress: FC<IKrProgressProps> = ({data}) => {
   return (
     <div className='kr-progress__container'>
-      <Title title='KR的进展'/>
+      <Title title={getLocale('OKR_MyO_Prog_Butt_KRprogress')}/>
       <div className={`kr-progress__content-wrapper`}>
         {
           data && data.map((item, index) => {