@titaui/pc 1.9.45 → 1.9.49

package/src/components/ereport-list/style.ts

@@ -1,4 +1,4 @@
-import styled from 'styled-components';
+import styled from "styled-components";
 
 export const ListTopDivStyle = styled.div`
 width: 100%;
@@ -88,7 +88,7 @@ height: 24px;
 position: absolute;
 top: 20px;
 right: 0;
-`
+`;
 export const ItemOptionsChildsDivStyle = styled.div`
 display: flex;
 flex-direction: row;
@@ -104,7 +104,7 @@ margin-right: 2px;
 &:hover {
     color: #1B6CF1;
 }
-`
+`;
 export const ItemOptionsShareTextStyle = styled.a`
 margin-left: 2px;
 color: #2879ff;
@@ -116,7 +116,7 @@ align-items: center;
 &:hover {
     color: #1B6CF1;
 }
-`
+`;
 export const ItemOptionsMoreInfoTextStyle = styled.a`
 margin-right: 2px;
 color: #2879ff;
@@ -128,7 +128,7 @@ align-items: center;
 &:hover {
     color: #1B6CF1;
 }
-`
+`;
 export const ItemOptionsMoreInfoBackgroundStyle = styled.span`
 display: inline-block;
 color: #2879ff;
@@ -138,4 +138,4 @@ margin-left: 2px;
 &:hover {
     color: #1B6CF1;
 }
-`
+`;

package/src/components/error-boundary/index.tsx

@@ -23,7 +23,7 @@ class ErrorBoundary extends React.Component<PropsType, StateType> {
   componentDidCatch(error, errorInfo) {
     Sentry.withScope((scope) => {
       scope.setTag("error-level", `P${this.props.errorLevel || 0}`);
-      scope.setTag("error-type", `白页`);
+      scope.setTag("error-type", "白页");
       scope.setExtra("componentStack", errorInfo.componentStack);
       const eventId = Sentry.captureException(new Error(error), scope);
       this.setState({ eventId });

package/src/components/file-list/components/single-file/index.tsx

@@ -15,8 +15,10 @@ const SingleFile: FC<ISingleFileProps> = ({
   showDownload,
 }) => {
   const [isMouseEnter, setIsMouseEnter] = useState(false);
-  const { isImg, fileImg, backGroundColor, canPreview } = getFileTypeMapIcon(
-    data.fileType
+  const {
+    isImg, fileImg, backGroundColor, canPreview,
+  } = getFileTypeMapIcon(
+    data.fileType,
   );
 
   const handleMouseEnter = () => {
@@ -34,79 +36,80 @@ const SingleFile: FC<ISingleFileProps> = ({
   return (
     <div className={prefix}>
       {isMouseEnter && (
-        <div className={prefix + "__operate"} onMouseLeave={handleMouseLeave}>
+        <div className={`${prefix}__operate`} onMouseLeave={handleMouseLeave}>
           {!isImg && canPreview && data.previewUrl && (
             <a
-              className={classNames(prefix + "__operate-item", {
-                [prefix + "__operate-item--only"]: !showDownload,
+              className={classNames(`${prefix}__operate-item`, {
+                [`${prefix}__operate-item--only`]: !showDownload,
               })}
               href={data.previewUrl}
               target="_blank"
+              rel="noreferrer"
             >
               <i
                 className={classNames(
                   "tu-icon-yulan",
-                  prefix + "__operate-item-icon"
+                  `${prefix}__operate-item-icon`,
                 )}
               />
-              {getLocale('Mod_Preview')}
+              {getLocale("Mod_Preview")}
             </a>
           )}
           {isImg && data.previewUrl && (
             <a
-              className={classNames(prefix + "__operate-item", {
-                [prefix + "__operate-item--only"]: !showDownload,
+              className={classNames(`${prefix}__operate-item`, {
+                [`${prefix}__operate-item--only`]: !showDownload,
               })}
               onClick={handlePreviewImg}
             >
               <i
                 className={classNames(
                   "tu-icon-yulan",
-                  prefix + "__operate-item-icon"
+                  `${prefix}__operate-item-icon`,
                 )}
               />
-              {getLocale('Mod_Preview')}
+              {getLocale("Mod_Preview")}
             </a>
           )}
           {showDownload && (
             <a
-              className={classNames(prefix + "__operate-item", {
-                [prefix + "__not-preview"]: !canPreview || !data.previewUrl,
+              className={classNames(`${prefix}__operate-item`, {
+                [`${prefix}__not-preview`]: !canPreview || !data.previewUrl,
               })}
               href={data.downloadUrl}
             >
               <i
                 className={classNames(
                   "tu-icon-APP-xiazai",
-                  prefix + "__operate-item-icon"
+                  `${prefix}__operate-item-icon`,
                 )}
               />
-              {getLocale('Mod_Download')}
+              {getLocale("Mod_Download")}
             </a>
           )}
         </div>
       )}
       <div
-        className={classNames(prefix + "__file-preview")}
+        className={classNames(`${prefix}__file-preview`)}
         onMouseEnter={handleMouseEnter}
         style={{ backgroundColor: backGroundColor }}
       >
         {isImg && (
           <img
-            className={prefix + "__file-preview-img"}
+            className={`${prefix}__file-preview-img`}
             src={data.previewUrl || data.bigImageUrl}
           />
         )}
         {!isImg && (
-          <div className={prefix + "__file-preview-other"}>
+          <div className={`${prefix}__file-preview-other`}>
             <img
-              className={prefix + "__file-preview-other-img"}
+              className={`${prefix}__file-preview-other-img`}
               src={fileImg}
             />
           </div>
         )}
       </div>
-      <div className={prefix + "__file-name"}>
+      <div className={`${prefix}__file-name`}>
         <Tooltip.Text text={data.fileName} maxWidth={180} />
       </div>
     </div>

package/src/components/file-list/index.tsx

@@ -17,7 +17,7 @@ const FileList: FC<IFileListProps> = ({ data, showDownload = true }) => {
       }
     }
     return newIndex;
-  }
+  };
 
   const handleImgPreview = (index) => {
     // @ts-ignore
@@ -27,9 +27,9 @@ const FileList: FC<IFileListProps> = ({ data, showDownload = true }) => {
   return (
     <div className={prefix}>
       {data.map((file, index) => (
-        <SingleFileCmp key={file.documentId+index} data={file} index={index} showDownload={showDownload} onPreview={handleImgPreview} />
+        <SingleFileCmp key={file.documentId + index} data={file} index={index} showDownload={showDownload} onPreview={handleImgPreview} />
       ))}
-      <ImgViewer showDownload={showDownload} data={data.filter(file => isImg(file.fileType))} ref={imgViewerRef}/>
+      <ImgViewer showDownload={showDownload} data={data.filter((file) => isImg(file.fileType))} ref={imgViewerRef} />
     </div>
   );
 };

package/src/components/file-list/interface.ts

@@ -25,4 +25,4 @@ export interface ISingleFileProps {
 export interface IFileListProps {
   data: IFileType[];
   showDownload?: boolean;
-}
+}

package/src/components/file-list/util.ts

@@ -1,14 +1,14 @@
-import DocSvg from './img/new-file-list-doc.svg';
-import OtherSvg from './img/new-file-list-other.svg';
-import PdfSvg from './img/new-file-list-pdf.svg';
-import PptSvg from './img/new-file-list-ppt.svg';
-import RadioSvg from './img/new-file-list-radio.svg';
-import VideoSvg from './img/new-file-list-video.svg';
-import XlsSvg from './img/new-file-list-xls.svg';
+import DocSvg from "./img/new-file-list-doc.svg";
+import OtherSvg from "./img/new-file-list-other.svg";
+import PdfSvg from "./img/new-file-list-pdf.svg";
+import PptSvg from "./img/new-file-list-ppt.svg";
+import RadioSvg from "./img/new-file-list-radio.svg";
+import VideoSvg from "./img/new-file-list-video.svg";
+import XlsSvg from "./img/new-file-list-xls.svg";
 
 export const getFileTypeMapIcon = (fileType: string) => {
   let isImg = false;
-  let backGroundColor = '';
+  let backGroundColor = "";
   let fileImg;
   let canPreview = false;
   if (/^(jpg|png|gif|jpeg|image|JPG|PNG|GIF|JPEG)$/.test(fileType)) {
@@ -16,41 +16,41 @@ export const getFileTypeMapIcon = (fileType: string) => {
     canPreview = true;
   } else if (/^(mp3|ogg|ape|flac)$/.test(fileType.toLowerCase())) {
     fileImg = RadioSvg;
-    backGroundColor = '#FFE6FC';
+    backGroundColor = "#FFE6FC";
   } else if (/^(avi|wmv|mov|mp4|rmvb)$/.test(fileType.toLowerCase())) {
     fileImg = VideoSvg;
-    backGroundColor = '#F5E6FF';
+    backGroundColor = "#F5E6FF";
   } else if (/^(pptx|ppt)$/.test(fileType.toLowerCase())) {
     fileImg = PptSvg;
-    backGroundColor = '#FFF5E6';
+    backGroundColor = "#FFF5E6";
     canPreview = true;
   } else if (/^(doc|docx)$/.test(fileType.toLowerCase())) {
     fileImg = DocSvg;
-    backGroundColor = '#E6F0FF';
+    backGroundColor = "#E6F0FF";
     canPreview = true;
   } else if (/^(xls|xlsx)$/.test(fileType.toLowerCase())) {
     fileImg = XlsSvg;
-    backGroundColor = '#E6FFF5';
+    backGroundColor = "#E6FFF5";
     canPreview = true;
   } else if (/^(pdf)$/.test(fileType.toLowerCase())) {
     fileImg = PdfSvg;
-    backGroundColor = '#FFE7E6';
+    backGroundColor = "#FFE7E6";
     canPreview = true;
   } else {
     fileImg = OtherSvg;
-    backGroundColor = '#E6FCFF';
+    backGroundColor = "#E6FCFF";
   }
   return {
     isImg,
     fileImg,
     backGroundColor,
     canPreview,
-  }; 
-}
+  };
+};
 
 export const isImg = (fileType: string) => {
   if (/^(jpg|png|gif|jpeg|image|JPG|PNG|GIF|JPEG)$/.test(fileType)) {
     return true;
   }
   return false;
-}
+};

package/src/components/firework/firework.ts

@@ -1,43 +1,41 @@
-const PI = Math.PI
+const { PI } = Math;
 // const defaultEmoji = [
 //   '👍',
 //   '😊',
 //   '🎉'
 // ]
 
-const createElements = (root, elementCount, elementSize, zIndex, {emoji=[],images=[]}) => (
+const createElements = (root, elementCount, elementSize, zIndex, { emoji = [], images = [] }) => (
   Array
     .from({ length: elementCount })
     .map((_, index) => {
-      
-      const i = index % (emoji.length+images.length);
+      const i = index % (emoji.length + images.length);
       let element;
-      if(i < emoji.length){
-        element = document.createElement('span')
-        element.innerHTML = emoji[i]
-        element.style.fontSize = `${elementSize}px`
-        element.style.position = 'absolute'
-        element.style.zIndex = zIndex
-        root.appendChild(element)
-    }else {
-        element = document.createElement('img');
+      if (i < emoji.length) {
+        element = document.createElement("span");
+        element.innerHTML = emoji[i];
+        element.style.fontSize = `${elementSize}px`;
+        element.style.position = "absolute";
+        element.style.zIndex = zIndex;
+        root.appendChild(element);
+      } else {
+        element = document.createElement("img");
         element.style.width = `${elementSize}px`;
         element.style.height = `${elementSize}px`;
         element.src = images[i];
-        element.style.position = 'absolute';
-        root.appendChild(element)
-    }
-    element.style.pointerEvents = 'none'
-    return element
-     
+        element.style.position = "absolute";
+        root.appendChild(element);
+      }
+      element.style.pointerEvents = "none";
+      return element;
     })
-)
+);
 
-const radiansFrom = degrees => degrees * (PI / 180)
+const radiansFrom = (degrees) => degrees * (PI / 180);
 
-const generatePhysics = (angle, spread, startVelocity, random ,x,y) => {
-  const radAngle = radiansFrom(angle)
-  const radSpread = radiansFrom(spread)
+const generatePhysics = (angle, spread, startVelocity, random, x, y) => {
+  const radAngle = radiansFrom(angle);
+  const radSpread = radiansFrom(spread);
   return {
     x,
     y,
@@ -46,49 +44,47 @@ const generatePhysics = (angle, spread, startVelocity, random ,x,y) => {
     angle2D: -radAngle + ((0.5 * radSpread) - (random() * radSpread)),
     angle3D: -(PI / 4) + (random() * (PI / 2)),
     tiltAngle: random() * PI,
-    velocityx:(startVelocity * 0.5) + (random() * startVelocity)
-  }
-}
+    velocityx: (startVelocity * 0.5) + (random() * startVelocity),
+  };
+};
 
-const updateMojis = (fetti, progress, decayY,decayX) => {
-  fetti.physics.x += Math.cos(fetti.physics.angle2D) * fetti.physics.velocityx
-  fetti.physics.y += Math.sin(fetti.physics.angle2D) * fetti.physics.velocity
-  fetti.physics.wobble += 0
-  fetti.physics.velocity *= decayY
-  fetti.physics.velocityx *=decayX
-  fetti.physics.y += 15*progress
-  fetti.physics.tiltAngle += 0.1
+const updateMojis = (fetti, progress, decayY, decayX) => {
+  fetti.physics.x += Math.cos(fetti.physics.angle2D) * fetti.physics.velocityx;
+  fetti.physics.y += Math.sin(fetti.physics.angle2D) * fetti.physics.velocity;
+  fetti.physics.wobble += 0;
+  fetti.physics.velocity *= decayY;
+  fetti.physics.velocityx *= decayX;
+  fetti.physics.y += 15 * progress;
+  fetti.physics.tiltAngle += 0.1;
 
-  const { x, y, tiltAngle } = fetti.physics
-  const wobbleX = x + 0
-  const wobbleY = y + 0
-  const transform = `translate3d(${wobbleX}px, ${wobbleY}px, 0) rotate(${tiltAngle}rad)`
+  const { x, y, tiltAngle } = fetti.physics;
+  const wobbleX = x + 0;
+  const wobbleY = y + 0;
+  const transform = `translate3d(${wobbleX}px, ${wobbleY}px, 0) rotate(${tiltAngle}rad)`;
 
-  fetti.element.style.transform = transform
-  fetti.element.style.opacity = progress > 0.5 ? (1 - progress)*2 : 1
-}
+  fetti.element.style.transform = transform;
+  fetti.element.style.opacity = progress > 0.5 ? (1 - progress) * 2 : 1;
+};
 
-const animate = (root, mojis, decayY,decayX, lifetime) => {
-  return new Promise<void>((res => {
-    const totalTicks = lifetime
-  let tick = 0
+const animate = (root, mojis, decayY, decayX, lifetime) => new Promise<void>(((res) => {
+  const totalTicks = lifetime;
+  let tick = 0;
 
   const update = () => {
-    mojis.forEach((fetti) => updateMojis(fetti, tick / totalTicks, decayY,decayX))
+    mojis.forEach((fetti) => updateMojis(fetti, tick / totalTicks, decayY, decayX));
 
-    tick += 1
+    tick += 1;
     if (tick < totalTicks) {
-      window.requestAnimationFrame(update)
+      window.requestAnimationFrame(update);
     } else {
-      res()
+      res();
     }
-  }
+  };
 
-  window.requestAnimationFrame(update)
-  }))
-}
+  window.requestAnimationFrame(update);
+}));
 
-const shoot = (root,x,y, {
+const shoot = (root, x, y, {
   angle = 90,
   decayY = 0.9,
   decayX = 0.98,
@@ -100,19 +96,19 @@ const shoot = (root,x,y, {
   zIndex = 0,
   emoji = [],
   random = Math.random,
-  //@ts-ignore
-  images 
+  // @ts-ignore
+  images,
 } = {}) => {
-  const elements = createElements(root, elementCount, elementSize, zIndex,{
+  const elements = createElements(root, elementCount, elementSize, zIndex, {
     images,
-    emoji
-  })
+    emoji,
+  });
   const mojis = elements.map((element) => ({
     element,
-    physics: generatePhysics(angle, spread, startVelocity, random,x,y)
-  }))
+    physics: generatePhysics(angle, spread, startVelocity, random, x, y),
+  }));
 
-  return animate(root, mojis, decayY,decayX, lifetime)
-}
+  return animate(root, mojis, decayY, decayX, lifetime);
+};
 
-export default shoot
+export default shoot;

package/src/components/firework/index.tsx

@@ -1,4 +1,4 @@
-import shoot from './firework'
+import shoot from "./firework";
 
 interface FireworkOptions {
   getContainer?: ()=>HTMLElement
@@ -10,20 +10,20 @@ interface FireworkOptions {
   emoji?:string[]
 }
 
-export default async function(options:FireworkOptions){
+export default async function (options:FireworkOptions) {
   const defaluts = {
-    getContainer: ()=>document.body,
+    getContainer: () => document.body,
     counts: 10,
-    zIndex:2000
-  }
-  const op = {...options,...defaluts};
-  const root = document.createElement('div');
+    zIndex: 2000,
+  };
+  const op = { ...options, ...defaluts };
+  const root = document.createElement("div");
   const container = op.getContainer();
-  root.style.position = 'absolute';
-  root.style.zIndex = op.zIndex+''
+  root.style.position = "absolute";
+  root.style.zIndex = `${op.zIndex}`;
   container.append(root);
   const rect = root.getBoundingClientRect();
-  
-  await shoot(root,op.x-rect.x,op.y-rect.y,{images:op.images,emoji:op.emoji});
-  container.removeChild(root)
-}
+
+  await shoot(root, op.x - rect.x, op.y - rect.y, { images: op.images, emoji: op.emoji });
+  container.removeChild(root);
+}

package/src/components/follower-visitor/index.tsx

@@ -28,10 +28,10 @@ const FollowerVisitor: FC = () => {
       // @ts-ignore backbone 框架请求完接口，如果有数据会改变 hasUserMessage
       if (window.hasUserMessage) {
         // @ts-ignore
-        let { indicators = [] } = window.hasUserMessage;
+        const { indicators = [] } = window.hasUserMessage;
         // 循环获取 OKR 提醒通知
         (indicators || []).forEach((it) => {
-          let { type, value } = it;
+          const { type, value } = it;
           if (type == "mOkrCycle" && value > 0) {
             getMessages();
           }
@@ -65,51 +65,51 @@ const FollowerVisitor: FC = () => {
     return "";
   };
 
-  const renderPerson = (person) => {
-    return (
-      <span>
-        {person.map((info, index) => {
-          if (index >= 2) return;
-          return (
-            <span>
-              {index === 1 ? "、" : ""}
-              <OpenUserName name={info.user.name} id={info.user.userId} />
-            </span>
-          );
-        })}
-      </span>
-    );
-  };
+  const renderPerson = (person) => (
+    <span>
+      {person.map((info, index) => {
+        if (index >= 2) return;
+        return (
+          <span>
+            {index === 1 ? "、" : ""}
+            <OpenUserName name={info.user.name} id={info.user.userId} />
+          </span>
+        );
+      })}
+    </span>
+  );
 
   return (
     <div
       className={prefix}
       style={{ height: visible ? "36px" : "0", opacity: visible ? 1 : 0 }}
     >
-      <div className={prefix + "__info-wrapper"}>
+      <div className={`${prefix}__info-wrapper`}>
         <ConditionRender condition={followerInofs && followerInofs.length > 0}>
           <img
             className={classNames(`${prefix}__follower-icon`)}
             src={FollowerImage}
           />
           {renderPerson(followerInofs)}
-          {getPrefixStrDesc(followerInofs)}关注了你
+          {getPrefixStrDesc(followerInofs)}
+          关注了你
         </ConditionRender>
       </div>
-      <div className={prefix + "__info-wrapper"}>
+      <div className={`${prefix}__info-wrapper`}>
         <ConditionRender condition={visitorInofs && visitorInofs.length > 0}>
           <img
             className={classNames(`${prefix}__visitor-icon`)}
             src={VisitorImage}
           />
           {renderPerson(visitorInofs)}
-          {getPrefixStrDesc(visitorInofs)}访问了你
+          {getPrefixStrDesc(visitorInofs)}
+          访问了你
         </ConditionRender>
       </div>
       <span
         className={classNames("tu-icon-canceled", `${prefix}__close`)}
         onClick={handleCloseMessage}
-      ></span>
+      />
     </div>
   );
 };

package/src/components/follower-visitor/request-api.ts

@@ -1,5 +1,3 @@
 import { rget } from "../../utils/request";
 
-export const getOkrCyclePageBubbleVisitor = () => {
-  return rget('v1')('okr/okrCyclePageBubbleVisitor');
-}
+export const getOkrCyclePageBubbleVisitor = () => rget("v1")("okr/okrCyclePageBubbleVisitor");

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

@@ -1,9 +1,9 @@
-import React from 'react';
-import classNames from 'classnames';
+import React from "react";
+import classNames from "classnames";
 import { OpenDepartmentName } from "../../../../utils/open-data";
-import Tooltip from '../../../tooltip';
-import { getLocale } from '../../../../utils/getLocale';
-import './index.scss';
+import Tooltip from "../../../tooltip";
+import { getLocale } from "../../../../utils/getLocale";
+import "./index.scss";
 
 interface Department {
   departmentId: number;
@@ -17,32 +17,37 @@ interface Props {
   onClear: Function;
 }
 
-const preCls = 'form-field-department';
+const preCls = "form-field-department";
 
-export default (props: Props) => {
-  const { department, placeholder = getLocale('Mod_Pleaseselect'), onClick, onClear } = props;
+export default function (props: Props) {
+  const {
+    department, placeholder = getLocale("Mod_Pleaseselect"), onClick, onClear,
+  } = props;
 
   const renderDepartName = () => {
     if (!department) return <span />;
-    return <OpenDepartmentName
-      id={department.departmentId}
-      name={department.departmentName}
-    />
-  }
+    return (
+      <OpenDepartmentName
+        id={department.departmentId}
+        name={department.departmentName}
+      />
+    );
+  };
 
   const onHandleClear = (e) => {
     e.preventDefault();
     e.stopPropagation();
     onClear();
-  }
+  };
 
-  return <div className={classNames(`${preCls}__input`)} onClick={() => onClick && onClick()}>
-    {!department ?
-      <span className={classNames(`${preCls}__input--placeholder`)}>{placeholder}</span> :
+  return (
+    <div className={classNames(`${preCls}__input`)} onClick={() => onClick && onClick()}>
+      {!department
+        ? <span className={classNames(`${preCls}__input--placeholder`)}>{placeholder}</span>
       // @ts-ignore
-      <Tooltip.Text text={renderDepartName()} isPercent />
-    }
-    {department && <span className={classNames(`tu-icon-cross ${preCls}__input--clear`)} onClick={e => onHandleClear(e)}></span>}
-    <span className={classNames(`${preCls}__input--down tu-icon-sort-down`)}></span>
-  </div>
-}
+        : <Tooltip.Text text={renderDepartName()} isPercent />}
+      {department && <span className={classNames(`tu-icon-cross ${preCls}__input--clear`)} onClick={(e) => onHandleClear(e)} />}
+      <span className={classNames(`${preCls}__input--down tu-icon-sort-down`)} />
+    </div>
+  );
+}