@titaui/pc 1.9.49 → 1.9.50

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

@@ -1,71 +1,72 @@
-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 "./index.scss";
+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";
+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;
+      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: 'contacts',
+          appName: '人事通讯录',
+          appUrl: 'http://contacts-wxvendor.test-caagw.yunassess.com/',
         },
         {
-          appKey: "regist",
-          appName: "入职管理",
-          appUrl: "http://regist-wxvendor.test-caagw.yunassess.com/pc/",
+          appKey: 'regist',
+          appName: '入职管理',
+          appUrl: 'http://regist-wxvendor.test-caagw.yunassess.com/pc/',
         },
         {
-          appKey: "jixiaobao",
-          appName: "绩效考核",
-          appUrl: "http://contacts-wxvendor.test-caagw.yunassess.com/",
+          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: '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: '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: '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/",
+          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`}>
+      <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",
+            className={classNames(preCls + '__item', {
+              [preCls + '__item--active']: menu.appKey == 'jixiaobao',
             })}
           >
             <a href={menu.appUrl}>{menu.appName}</a>
@@ -76,18 +77,18 @@ function HrHeader({}: Props): ReactElement {
             popupVisible={isShowMore}
             onPopupVisibleChange={setIsShowMore}
             popupPlacement="bottom"
-            popup={(
-              <div className="tencent-hr-header-popup">
-                {menus.slice(5).map((menu) => (
-                  <a className="tencent-hr-header-popup__item" href={menu.appUrl}>{menu.appName}</a>
-                ))}
-              </div>
-                )}
+            popup={
+                  <div className='tencent-hr-header-popup'>
+                    {menus.slice(5).map((menu) => (
+                      <a className='tencent-hr-header-popup__item' href={menu.appUrl}>{menu.appName}</a>
+                    ))}
+                  </div>
+                }
           >
-            <div key="more" className={classNames(`${preCls}__item`)}>
+            <div key='more' className={classNames(preCls + '__item')}>
               <a>更多</a>
               <img
-                src={require("./arrow.png")}
+                src={require('./arrow.png')}
                 style={{ transform: `rotate(${isShowMore ? 180 : 0}deg)` }}
               />
             </div>
@@ -98,15 +99,15 @@ function HrHeader({}: Props): ReactElement {
         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>
+        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`}>
+        <span className={preCls + '__user'}>
           {getLoginUserInfo().Name}
-          <img src={require("./arrow.png")} style={{ transform: `rotate(${isShowUserMenu ? 180 : 0}deg)` }} />
+          <img src={require('./arrow.png')} style={{ transform: `rotate(${isShowUserMenu ? 180 : 0}deg)` }}/>
         </span>
       </Popup>
     </div>

package/src/components/icon-button-list/index.js

@@ -1,52 +1,43 @@
-import React from "react";
-import classNames from "classnames";
-import RcTooltip from "rc-tooltip";
+import React from 'react';
+import classNames from 'classnames';
+import RcTooltip from 'rc-tooltip';
 
-import "./rc-tooltip.scss";
-import "./index.scss";
+import './rc-tooltip.scss';
+import './index.scss';
 
-const preCls = "titaui-icon-button-list";
+const preCls = 'titaui-icon-button-list';
 
-export default function (props) {
+export default props => {
   const {
     items,
-    onClick = (e, icon) => { },
+    onClick = (e, icon) => { }
   } = props;
 
   if (!items) return <span />;
 
-  return (
-    <div className={classNames(preCls)}>
-      <div className={classNames(`${preCls}__inner`)}>
-        {items.map((it) => {
-          const {
-            icon, overlay, placement = "top", trigger = ["hover"],
-          } = it;
-          const content = (
-            <span className={classNames(`${preCls}__btn`)} onClick={(e) => onClick(e, icon)}>
-              <span className={classNames(`${preCls}__btn-icon`, {
-                [`${preCls}__btn-icon--base`]: true,
-                [`${preCls}__btn-icon--${icon}`]: true,
-              })}
-              />
-            </span>
-          );
-          if (overlay) {
-            return (
-              <RcTooltip
-                prefixCls="tui-tooltip"
-                placement={placement}
-                trigger={trigger}
-                overlay={overlay}
-                overlayClassName={classNames(`${preCls}__btn-tip`)}
-              >
-                {content}
-              </RcTooltip>
-            );
-          }
-          return content;
-        })}
-      </div>
+  return <div className={classNames(preCls)}>
+    <div className={classNames(`${preCls}__inner`)}>
+      {items.map(it => {
+        const { icon, overlay, placement = 'top', trigger = ['hover'] } = it;
+        let content = <span className={classNames(`${preCls}__btn`)} onClick={e => onClick(e, icon)}>
+          <span className={classNames(`${preCls}__btn-icon`, {
+            [`${preCls}__btn-icon--base`]: true,
+            [`${preCls}__btn-icon--${icon}`]: true
+          })}></span>
+        </span>
+        if (overlay) {
+          return <RcTooltip
+            prefixCls="tui-tooltip"
+            placement={placement}
+            trigger={trigger}
+            overlay={overlay}
+            overlayClassName={classNames(`${preCls}__btn-tip`)}
+          >
+            {content}
+          </RcTooltip>
+        }
+        return content;
+      })}
     </div>
-  );
+  </div>
 }

package/src/components/img-viewer/icon/enlarge.tsx

@@ -1,21 +1,21 @@
 import React from "react";
 
-export default function () {
+export default () => {
   return (
     <svg width="18px" height="18px" viewBox="0 0 18 18">
       <g
         id="APPgengduo"
         stroke="none"
-        strokeWidth="1"
+        stroke-width="1"
         fill="none"
-        fillRule="evenodd"
+        fill-rule="evenodd"
       >
         <path
           d="M9,0 C13.9705627,0 18,4.02943725 18,9 C18,13.9705627 13.9705627,18 9,18 C4.02943725,18 0,13.9705627 0,9 C0,4.02943725 4.02943725,0 9,0 Z M9,1.4 C4.8026359,1.4 1.4,4.8026359 1.4,9 C1.4,13.1973641 4.8026359,16.6 9,16.6 C13.1973641,16.6 16.6,13.1973641 16.6,9 C16.6,4.8026359 13.1973641,1.4 9,1.4 Z M9,5 C9.38659932,5 9.7,5.31340068 9.7,5.7 L9.7,8.3 L12.3,8.3 C12.6865993,8.3 13,8.61340068 13,9 C13,9.38659932 12.6865993,9.7 12.3,9.7 L9.7,9.7 L9.7,12.3 C9.7,12.6865993 9.38659932,13 9,13 C8.61340068,13 8.3,12.6865993 8.3,12.3 L8.3,9.7 L5.7,9.7 C5.31340068,9.7 5,9.38659932 5,9 C5,8.61340068 5.31340068,8.3 5.7,8.3 L8.3,8.3 L8.3,5.7 C8.3,5.31340068 8.61340068,5 9,5 Z"
           fill="currentColor"
-          fillRule="nonzero"
-        />
+          fill-rule="nonzero"
+        ></path>
       </g>
     </svg>
   );
-}
+};

package/src/components/img-viewer/icon/left-rotate.tsx

@@ -1,17 +1,17 @@
-import React from "react";
+import React from 'react';
 
-export default function () {
+export default () => {
   return (
     <svg width="18px" height="18px" viewBox="0 0 18 18">
-      <g id="xuanzhan-ni" stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
-        <g fillRule="nonzero">
-          <g transform="translate(9.000000, 9.000000) scale(-1, 1) translate(-9.000000, -9.000000) ">
-            <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="18" height="18" />
-            <path d="M15.9866683,5.44069564 C17.0912378,5.44069564 17.9866683,6.33612614 17.9866683,7.44069564 L17.9866683,15.3872174 C17.9866683,16.4917869 17.0912378,17.3872174 15.9866683,17.3872174 L5.19536392,17.3872174 C4.09079442,17.3872174 3.19536392,16.4917869 3.19536392,15.3872174 L3.19536392,7.44069564 C3.19536392,6.33612614 4.09079442,5.44069564 5.19536392,5.44069564 L15.9866683,5.44069564 Z M15.9866683,6.84069564 L5.19536392,6.84069564 C4.89713016,6.84069564 4.64971717,7.05828526 4.60321691,7.34337253 L4.59536392,7.44069564 L4.59536392,15.3872174 C4.59536392,15.6854512 4.81295353,15.9328641 5.0980408,15.9793644 L5.19536392,15.9872174 L15.9866683,15.9872174 C16.284902,15.9872174 16.532315,15.7696278 16.5788153,15.4845405 L16.5866683,15.3872174 L16.5866683,7.44069564 C16.5866683,7.14246188 16.3690786,6.89504889 16.0839914,6.84854863 L15.9866683,6.84069564 Z" id="路径" fill="currentColor" />
-            <path d="M9.39323348,1.18095652 C9.57194871,1.18896141 9.74286623,1.25644698 9.87884218,1.37269564 L9.91797261,1.39930436 C9.93910305,1.41886956 9.9520161,1.44 9.96101608,1.45565218 C9.98253782,1.47365218 10.020103,1.52608697 10.0549291,1.58947826 C10.0846683,1.64269564 10.1077552,1.7021739 10.1265378,1.77339131 C10.1785546,1.97564758 10.146065,2.1903618 10.0365378,2.36817392 C10.0242234,2.39020742 10.0106351,2.4115044 9.99584218,2.43195652 C9.98341528,2.45870356 9.96676797,2.48327816 9.94653782,2.50473913 L8.48066498,4.05831999 C8.19044727,4.36590239 7.70619862,4.38104544 7.3973298,4.0921972 C7.0967167,3.81106957 7.06509502,3.34518596 7.32497982,3.02602946 C7.48131917,2.83401343 7.55062013,2.71605909 7.53288269,2.67216644 C4.05222321,3.26455307 2.08014652,5.19691305 1.54992913,7.77326087 C1.46131722,8.19573767 1.04834146,8.46750123 0.625276951,8.38173913 C0.202435134,8.29387903 -0.0697751816,7.88066517 0.0164073867,7.45747826 C0.858103049,3.37304348 4.36732044,1.02834782 9.39323348,1.18095652 Z" id="路径" fill="currentColor" />
+      <g id="xuanzhan-ni" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+          <g fill-rule="nonzero">
+              <g transform="translate(9.000000, 9.000000) scale(-1, 1) translate(-9.000000, -9.000000) ">
+                  <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="18" height="18"></rect>
+                  <path d="M15.9866683,5.44069564 C17.0912378,5.44069564 17.9866683,6.33612614 17.9866683,7.44069564 L17.9866683,15.3872174 C17.9866683,16.4917869 17.0912378,17.3872174 15.9866683,17.3872174 L5.19536392,17.3872174 C4.09079442,17.3872174 3.19536392,16.4917869 3.19536392,15.3872174 L3.19536392,7.44069564 C3.19536392,6.33612614 4.09079442,5.44069564 5.19536392,5.44069564 L15.9866683,5.44069564 Z M15.9866683,6.84069564 L5.19536392,6.84069564 C4.89713016,6.84069564 4.64971717,7.05828526 4.60321691,7.34337253 L4.59536392,7.44069564 L4.59536392,15.3872174 C4.59536392,15.6854512 4.81295353,15.9328641 5.0980408,15.9793644 L5.19536392,15.9872174 L15.9866683,15.9872174 C16.284902,15.9872174 16.532315,15.7696278 16.5788153,15.4845405 L16.5866683,15.3872174 L16.5866683,7.44069564 C16.5866683,7.14246188 16.3690786,6.89504889 16.0839914,6.84854863 L15.9866683,6.84069564 Z" id="路径" fill="currentColor"></path>
+                  <path d="M9.39323348,1.18095652 C9.57194871,1.18896141 9.74286623,1.25644698 9.87884218,1.37269564 L9.91797261,1.39930436 C9.93910305,1.41886956 9.9520161,1.44 9.96101608,1.45565218 C9.98253782,1.47365218 10.020103,1.52608697 10.0549291,1.58947826 C10.0846683,1.64269564 10.1077552,1.7021739 10.1265378,1.77339131 C10.1785546,1.97564758 10.146065,2.1903618 10.0365378,2.36817392 C10.0242234,2.39020742 10.0106351,2.4115044 9.99584218,2.43195652 C9.98341528,2.45870356 9.96676797,2.48327816 9.94653782,2.50473913 L8.48066498,4.05831999 C8.19044727,4.36590239 7.70619862,4.38104544 7.3973298,4.0921972 C7.0967167,3.81106957 7.06509502,3.34518596 7.32497982,3.02602946 C7.48131917,2.83401343 7.55062013,2.71605909 7.53288269,2.67216644 C4.05222321,3.26455307 2.08014652,5.19691305 1.54992913,7.77326087 C1.46131722,8.19573767 1.04834146,8.46750123 0.625276951,8.38173913 C0.202435134,8.29387903 -0.0697751816,7.88066517 0.0164073867,7.45747826 C0.858103049,3.37304348 4.36732044,1.02834782 9.39323348,1.18095652 Z" id="路径" fill="currentColor"></path>
+              </g>
           </g>
-        </g>
       </g>
-    </svg>
-  );
-}
+  </svg>
+  )
+}

package/src/components/img-viewer/icon/right-rotate.tsx

@@ -1,16 +1,16 @@
 import React from "react";
 
-export default function () {
+export default () => {
   return (
     <svg width="18px" height="18px" viewBox="0 0 18 18">
       <g
         id="xuanzhan-sh"
         stroke="none"
-        strokeWidth="1"
+        stroke-width="1"
         fill="none"
-        fillRule="evenodd"
+        fill-rule="evenodd"
       >
-        <g fillRule="nonzero">
+        <g fill-rule="nonzero">
           <rect
             id="矩形"
             fill="#000000"
@@ -19,19 +19,19 @@ export default function () {
             y="0"
             width="18"
             height="18"
-          />
+          ></rect>
           <path
             d="M15.9866683,5.44069564 C17.0912378,5.44069564 17.9866683,6.33612614 17.9866683,7.44069564 L17.9866683,15.3872174 C17.9866683,16.4917869 17.0912378,17.3872174 15.9866683,17.3872174 L5.19536392,17.3872174 C4.09079442,17.3872174 3.19536392,16.4917869 3.19536392,15.3872174 L3.19536392,7.44069564 C3.19536392,6.33612614 4.09079442,5.44069564 5.19536392,5.44069564 L15.9866683,5.44069564 Z M15.9866683,6.84069564 L5.19536392,6.84069564 C4.89713016,6.84069564 4.64971717,7.05828526 4.60321691,7.34337253 L4.59536392,7.44069564 L4.59536392,15.3872174 C4.59536392,15.6854512 4.81295353,15.9328641 5.0980408,15.9793644 L5.19536392,15.9872174 L15.9866683,15.9872174 C16.284902,15.9872174 16.532315,15.7696278 16.5788153,15.4845405 L16.5866683,15.3872174 L16.5866683,7.44069564 C16.5866683,7.14246188 16.3690786,6.89504889 16.0839914,6.84854863 L15.9866683,6.84069564 Z"
             id="路径"
             fill="currentColor"
-          />
+          ></path>
           <path
             d="M9.39323348,1.18095652 C9.57194871,1.18896141 9.74286623,1.25644698 9.87884218,1.37269564 L9.91797261,1.39930436 C9.93910305,1.41886956 9.9520161,1.44 9.96101608,1.45565218 C9.98253782,1.47365218 10.020103,1.52608697 10.0549291,1.58947826 C10.0846683,1.64269564 10.1077552,1.7021739 10.1265378,1.77339131 C10.1785546,1.97564758 10.146065,2.1903618 10.0365378,2.36817392 C10.0242234,2.39020742 10.0106351,2.4115044 9.99584218,2.43195652 C9.98341528,2.45870356 9.96676797,2.48327816 9.94653782,2.50473913 L8.48066498,4.05831999 C8.19044727,4.36590239 7.70619862,4.38104544 7.3973298,4.0921972 C7.0967167,3.81106957 7.06509502,3.34518596 7.32497982,3.02602946 C7.48131917,2.83401343 7.55062013,2.71605909 7.53288269,2.67216644 C4.05222321,3.26455307 2.08014652,5.19691305 1.54992913,7.77326087 C1.46131722,8.19573767 1.04834146,8.46750123 0.625276951,8.38173913 C0.202435134,8.29387903 -0.0697751816,7.88066517 0.0164073867,7.45747826 C0.858103049,3.37304348 4.36732044,1.02834782 9.39323348,1.18095652 Z"
             id="路径"
             fill="currentColor"
-          />
+          ></path>
         </g>
       </g>
     </svg>
   );
-}
+};

package/src/components/img-viewer/icon/shrink.tsx

@@ -1,25 +1,25 @@
 import React from "react";
 
-export default function () {
+export default () => {
   return (
     <svg width="18px" height="18px" viewBox="0 0 18 18">
       <g
         id="weikaishi"
         stroke="none"
-        strokeWidth="1"
+        stroke-width="1"
         fill="none"
-        fillRule="evenodd"
+        fill-rule="evenodd"
       >
         <g>
-          <rect id="Rectangle-3" x="0" y="0" width="18" height="18" />
+          <rect id="Rectangle-3" x="0" y="0" width="18" height="18"></rect>
           <path
             d="M9,0 C13.9705627,0 18,4.02943725 18,9 C18,13.9705627 13.9705627,18 9,18 C4.02943725,18 0,13.9705627 0,9 C0,4.02943725 4.02943725,0 9,0 Z M9,1.4 C4.8026359,1.4 1.4,4.8026359 1.4,9 C1.4,13.1973641 4.8026359,16.6 9,16.6 C13.1973641,16.6 16.6,13.1973641 16.6,9 C16.6,4.8026359 13.1973641,1.4 9,1.4 Z M12.3,8.3 C12.6865993,8.3 13,8.61340068 13,9 C13,9.38659932 12.6865993,9.7 12.3,9.7 L5.7,9.7 C5.31340068,9.7 5,9.38659932 5,9 C5,8.61340068 5.31340068,8.3 5.7,8.3 L12.3,8.3 Z"
             id="形状结合"
             fill="currentColor"
-            fillRule="nonzero"
-          />
+            fill-rule="nonzero"
+          ></path>
         </g>
       </g>
     </svg>
   );
-}
+};

package/src/components/img-viewer/index.tsx

@@ -14,7 +14,7 @@ import Shrink from "./icon/shrink";
 import LeftRotate from "./icon/left-rotate";
 import RightRotate from "./icon/right-rotate";
 import Tooltip from "../tooltip";
-import Loading from "./image/loading.gif";
+import Loading from './image/loading.gif';
 import { getLocale } from "../../utils/getLocale";
 import "./index.scss";
 
@@ -76,10 +76,12 @@ const ImgViewer: FC<IImgViewerProps> = forwardRef(
       setCurrentScale(Number((currentScale - 0.1).toFixed(1)));
     };
 
-    useImperativeHandle(ref, () => ({
-      show: showPreview,
-      hide: hidePreview,
-    }));
+    useImperativeHandle(ref, () => {
+      return {
+        show: showPreview,
+        hide: hidePreview,
+      };
+    });
 
     useEffect(() => {
       const timer = setInterval(() => {
@@ -93,11 +95,11 @@ const ImgViewer: FC<IImgViewerProps> = forwardRef(
     const renderPreviewer = () => {
       if (!visible) return null;
       return (
-        <div className={classNames(prefix, "document-mouse-event-ignore")}>
-          <div className={`${prefix}__header`}>
-            <span className={`${prefix}__header-file-name`}>
+        <div className={classNames(prefix, 'document-mouse-event-ignore')}>
+          <div className={prefix + "__header"}>
+            <span className={prefix + "__header-file-name"}>
               <Tooltip.Text
-                text={currentImgData && currentImgData.fileName || ""}
+                text={currentImgData && currentImgData.fileName || ''}
                 isPercent
                 minusWidth={60}
               />
@@ -105,35 +107,35 @@ const ImgViewer: FC<IImgViewerProps> = forwardRef(
             <span>
               {showDownload && currentImgData && currentImgData.downloadUrl && (
                 <a
-                  className={`${prefix}__header-download`}
-                  href={currentImgData?.downloadUrl || "javascript:;"}
+                  className={prefix + "__header-download"}
+                  href={currentImgData?.downloadUrl||'javascript:;'}
                 >
                   <i
                     className={classNames(
                       "tu-icon-APP-xiazai",
-                      `${prefix}__header-download-icon`,
+                      prefix + "__header-download-icon"
                     )}
                   />
-                  {getLocale("Mod_Download")}
+                  {getLocale('Mod_Download')}
                 </a>
               )}
               <span
                 className={classNames(
-                  "tu-icon-close",
-                  `${prefix}__header-close`,
+                  `tu-icon-close`,
+                  prefix + "__header-close"
                 )}
                 onClick={hidePreview}
-              />
+              ></span>
             </span>
           </div>
-          <div className={`${prefix}__body`}>
+          <div className={prefix + "__body"}>
             <span
               className={classNames(
-                `${prefix}__body-operate-btn`,
-                `${prefix}__body-operate-btn--left`,
+                prefix + "__body-operate-btn",
+                prefix + "__body-operate-btn--left",
                 {
-                  [`${prefix}__body-operate-btn--disable`]: currentIndex === 0,
-                },
+                  [prefix + "__body-operate-btn--disable"]: currentIndex === 0,
+                }
               )}
               onClick={handlePreImgClick}
             >
@@ -141,53 +143,53 @@ const ImgViewer: FC<IImgViewerProps> = forwardRef(
             </span>
             <span
               className={classNames(
-                `${prefix}__body-operate-btn`,
-                `${prefix}__body-operate-btn--right`,
+                prefix + "__body-operate-btn",
+                prefix + "__body-operate-btn--right",
                 {
-                  [`${prefix}__body-operate-btn--disable`]:
+                  [prefix + "__body-operate-btn--disable"]:
                     currentIndex === data.length - 1,
-                },
+                }
               )}
               onClick={handleNextImgClick}
             >
               <i className="tu-icon-APP-xi" />
             </span>
             {isLoading && (
-            <div className={`${prefix}__body--loading`}>
-              <img src={Loading} />
-            </div>
-            )}
+                <div className={prefix+'__body--loading'}>
+                  <img src={Loading} />
+                </div>
+              )}
             <div style={{ transform: `rotate(${currentRotateDeg}deg)` }}>
               <img
-                className={`${prefix}__body-img`}
+                className={prefix+'__body-img'}
                 ref={imgRef}
                 src={currentImgData?.previewUrl || currentImgData?.bigImageUrl}
                 style={{ transform: `scale(${currentScale})` }}
               />
             </div>
           </div>
-          <div className={`${prefix}__footer`}>
-            <Tooltip overlay={getLocale("OKR_Ali_Butt_Narrow")} placement="top">
-              <span className={`${prefix}__footer-btn`} onClick={handleShrink}>
+          <div className={prefix + "__footer"}>
+            <Tooltip overlay={getLocale('OKR_Ali_Butt_Narrow')} placement="top">
+              <span className={prefix + "__footer-btn"} onClick={handleShrink}>
                 <Shrink />
               </span>
             </Tooltip>
-            <Tooltip overlay={getLocale("OKR_Ali_Butt_Enlarge")} placement="top">
-              <span className={`${prefix}__footer-btn`} onClick={handleEnlarge}>
+            <Tooltip overlay={getLocale('OKR_Ali_Butt_Enlarge')} placement="top">
+              <span className={prefix + "__footer-btn"} onClick={handleEnlarge}>
                 <Enlarge />
               </span>
             </Tooltip>
-            <Tooltip overlay="顺时针旋转" placement="top">
+            <Tooltip overlay={"顺时针旋转"} placement="top">
               <span
-                className={`${prefix}__footer-btn`}
+                className={prefix + "__footer-btn"}
                 onClick={handleRightRotate}
               >
                 <RightRotate />
               </span>
             </Tooltip>
-            <Tooltip overlay="逆时针旋转" placement="top">
+            <Tooltip overlay={"逆时针旋转"} placement="top">
               <span
-                className={`${prefix}__footer-btn`}
+                className={prefix + "__footer-btn"}
                 onClick={handleLeftRotate}
               >
                 <LeftRotate />
@@ -199,7 +201,7 @@ const ImgViewer: FC<IImgViewerProps> = forwardRef(
     };
 
     return ReactDOM.createPortal(renderPreviewer(), document.body);
-  },
+  }
 );
 
 export default ImgViewer;

package/src/components/img-viewer/interface.ts

@@ -19,4 +19,4 @@ export interface IImgViewerProps {
   data: IFileType[];
   ref: any;
   showDownload?: boolean;
-}
+}

package/src/components/img-viewer/util.ts

@@ -3,4 +3,4 @@ export const isImg = (fileType: string) => {
     return true;
   }
   return false;
-};
+}

package/src/components/invite-people/index.tsx

@@ -11,11 +11,11 @@ const InvitePeople: FC = () => {
 
   return (
     <Tooltip
-      overlay="邀请同事"
+      overlay={'邀请同事'}
       placement="right"
       align={{ offset: [0, 0] }}
     >
-      <div className={prefix} onClick={handleInvitePeople} />
+      <div className={prefix} onClick={handleInvitePeople}></div>
     </Tooltip>
   );
 };