@titaui/pc 1.9.45 → 1.9.49

package/src/components/weekly-report/index.tsx

@@ -1,10 +1,14 @@
-import React, { ReactElement, useRef, useState, useEffect } from "react";
-import classnames from 'classnames'
+import React, {
+  ReactElement, useRef, useState, useEffect,
+} from "react";
+import classnames from "classnames";
 import RectBtn from "../button/rect-btn";
 import CommonShare from "../common-share";
 import Card from "./card";
-import {rpost,rget, rput, rdelete} from '../../utils/request'
-import {getQueryString,changeQueryString} from '../../utils/tools';
+import {
+  rpost, rget, rput, rdelete,
+} from "../../utils/request";
+import { getQueryString, changeQueryString } from "../../utils/tools";
 import { getLocale } from "../../utils/getLocale";
 import "./index.scss";
 
@@ -14,48 +18,43 @@ interface Props {
 
 const preCls = "weekly-report-card";
 
-const getImageBase64ByUrl = base64 => {
-  return rpost('v1')(`/okr/share/imageDownLoadDfs`, { 'SharePicLink': base64 })
-    .then(res => {
-      return res.Data;
-    })
-}
+const getImageBase64ByUrl = (base64) => rpost("v1")("/okr/share/imageDownLoadDfs", { SharePicLink: base64 })
+  .then((res) => res.Data);
 
-function WeeklyReportPreview({ onShare,onClose,data }) {
+function WeeklyReportPreview({ onShare, onClose, data }) {
   const cardRef = useRef<any>();
-  
 
   return (
-    <div style={{ position: "relative"}}>
-      <div className={classnames(preCls + "__close")} onClick={onClose}/>
+    <div style={{ position: "relative" }}>
+      <div className={classnames(`${preCls}__close`)} onClick={onClose} />
       <div style={{ position: "absolute", left: "-99999999px" }}>
         <Card data={data} ref={cardRef} />
       </div>
-      <div className={preCls + "-wrapper"}>
-        <Card data={data}/>
+      <div className={`${preCls}-wrapper`}>
+        <Card data={data} />
       </div>
-      <div className={preCls + "__button-container"}>
+      <div className={`${preCls}__button-container`}>
         <RectBtn
-          className={preCls + "__download"}
+          className={`${preCls}__download`}
           onClick={async () => {
             const img = await cardRef?.current?.getImage();
-            const url = await getImageBase64ByUrl(img.split(',')[1])
-            let a = document.createElement('a');
+            const url = await getImageBase64ByUrl(img.split(",")[1]);
+            const a = document.createElement("a");
             a.href = url.obj;
-            a.download = 'okr.png';
-            a.click()
+            a.download = "okr.png";
+            a.click();
           }}
         >
-          {getLocale('OKR_MyO_Popup_Download')}
+          {getLocale("OKR_MyO_Popup_Download")}
         </RectBtn>
         <RectBtn
-          className={preCls + "__share"}
+          className={`${preCls}__share`}
           onClick={async () => {
             const img = await cardRef.current.getImage();
             onShare(img);
           }}
         >
-          {getLocale('Mod_ShareFeed')}
+          {getLocale("Mod_ShareFeed")}
         </RectBtn>
       </div>
     </div>
@@ -64,52 +63,52 @@ function WeeklyReportPreview({ onShare,onClose,data }) {
 
 function WeeklyReportModal({}: Props) {
   const [visible, setVisible] = useState<boolean>(!!getQueryString().redisKey);
-  const [redisKey, setRedisKey] = useState<string>(getQueryString().redisKey||null)
-  const [data,setData] = useState<any>()
+  const [redisKey, setRedisKey] = useState<string>(getQueryString().redisKey || null);
+  const [data, setData] = useState<any>();
   useEffect(() => {
-    window?.Talent?.app.vent.off('open-weekly-report-modal')
-    window?.Talent?.app.vent.on('open-weekly-report-modal',(redisKey)=>{
-      if(visible) return;
-      setRedisKey(redisKey)
-      setVisible(true)
-    })
-    return () => window?.Talent?.app.vent.off('open-weekly-report-modal')
-  }, [visible])
+    window?.Talent?.app.vent.off("open-weekly-report-modal");
+    window?.Talent?.app.vent.on("open-weekly-report-modal", (redisKey) => {
+      if (visible) return;
+      setRedisKey(redisKey);
+      setVisible(true);
+    });
+    return () => window?.Talent?.app.vent.off("open-weekly-report-modal");
+  }, [visible]);
 
-  useEffect(()=>{
-    if(!visible) return
-    const current = new Date()
-    const dateTimeTicks=(current.getFullYear()+'/'+(current.getMonth()+1)+'/'+current.getDate())
-    let param = `redisKey=${redisKey || ''}&dateTimeTicks=${dateTimeTicks||''}`
-    if(data) {
-      setData(null)
+  useEffect(() => {
+    if (!visible) return;
+    const current = new Date();
+    const dateTimeTicks = (`${current.getFullYear()}/${current.getMonth() + 1}/${current.getDate()}`);
+    const param = `redisKey=${redisKey || ""}&dateTimeTicks=${dateTimeTicks || ""}`;
+    if (data) {
+      setData(null);
     }
-   
-    rget('v1')('okr/wwsummary/get?'+param).then(res => {
-      if(res.Code == 1){
-        setData(res.Data)
-      }else {
-        setVisible(false)
+
+    rget("v1")(`okr/wwsummary/get?${param}`).then((res) => {
+      if (res.Code == 1) {
+        setData(res.Data);
+      } else {
+        setVisible(false);
       }
-    })
-  },[redisKey,visible])
+    });
+  }, [redisKey, visible]);
 
   useEffect(() => {
-    if(!!getQueryString().redisKey){
-      location.replace(decodeURIComponent(location.href).replace(/&?redisKey=\S*(&|$)/g,''))
+    if (getQueryString().redisKey) {
+      location.replace(decodeURIComponent(location.href).replace(/&?redisKey=\S*(&|$)/g, ""));
     }
-    if(visible){
-      rdelete('v1')('Indicator/Clear?message_type=0&indicator_type=mWeekStatisticIndicator')
+    if (visible) {
+      rdelete("v1")("Indicator/Clear?message_type=0&indicator_type=mWeekStatisticIndicator");
     }
-  },[visible])
-  if(!data) return null;
+  }, [visible]);
+  if (!data) return null;
   return (
     <CommonShare
       uid={new Date().getTime()}
       visible={visible}
       onClose={() => setVisible(false)}
       defaultContent="Show 一下我这周的努力～"
-      shareComponent={(onShare) => <WeeklyReportPreview onShare={onShare} onClose={() => setVisible(false)} data={data}/>}
+      shareComponent={(onShare) => <WeeklyReportPreview onShare={onShare} onClose={() => setVisible(false)} data={data} />}
     />
   );
 }

package/src/components/weekly-report/interface.ts

@@ -1,4 +1,3 @@
-
 export interface IWeeklyReportData {
   WeekCycle: string;
   Lnteraction: string;
@@ -28,4 +27,4 @@ interface Avatar {
   Normal: string;
   HasAvatar: boolean;
   Color?: any;
-}
+}

package/src/components/weekly-report/statistics.tsx

@@ -1,30 +1,35 @@
-import React, { ReactElement } from 'react'
-import classnames from 'classnames'
-import { getLocale } from '../../utils/getLocale'
-import { IWeeklyReportData } from './interface'
+import React, { ReactElement } from "react";
+import classnames from "classnames";
+import { getLocale } from "../../utils/getLocale";
+import { IWeeklyReportData } from "./interface";
 
 interface Props {
   data:IWeeklyReportData
 }
-const preCls = 'weekly-report-card__statistics'
-function Statistics({data}: Props): ReactElement {
+const preCls = "weekly-report-card__statistics";
+function Statistics({ data }: Props): ReactElement {
   return (
     <div className={preCls}>
-      <div className={classnames(preCls+'__item',preCls+'__finish')}>
-        <div className={preCls+'__num'}>{data.TaskNum}</div>
-        <div className={preCls+'__text'}>{getLocale('Rep_Tab_Mys_Completeask')}</div>
+      <div className={classnames(`${preCls}__item`, `${preCls}__finish`)}>
+        <div className={`${preCls}__num`}>{data.TaskNum}</div>
+        <div className={`${preCls}__text`}>{getLocale("Rep_Tab_Mys_Completeask")}</div>
       </div>
-      <div className={classnames(preCls+'__item',preCls+'__praise')}>
-        <div className={preCls+'__num'}>{data.LoveNum}</div>
-        <div className={preCls+'__text'}>获得点赞</div>
-        {data.LoveTopNum && data.LoveTopNum != '0' && <div className={preCls+'__tips'}>Top{data.LoveTopNum}</div>}
+      <div className={classnames(`${preCls}__item`, `${preCls}__praise`)}>
+        <div className={`${preCls}__num`}>{data.LoveNum}</div>
+        <div className={`${preCls}__text`}>获得点赞</div>
+        {data.LoveTopNum && data.LoveTopNum != "0" && (
+        <div className={`${preCls}__tips`}>
+          Top
+          {data.LoveTopNum}
+        </div>
+        )}
       </div>
-      <div className={classnames(preCls+'__item',preCls+'__communication')}>
-        <div className={preCls+'__num'}>{data.Lnteraction}</div>
-        <div className={preCls+'__text'}>参与互动</div>
+      <div className={classnames(`${preCls}__item`, `${preCls}__communication`)}>
+        <div className={`${preCls}__num`}>{data.Lnteraction}</div>
+        <div className={`${preCls}__text`}>参与互动</div>
       </div>
     </div>
-  )
+  );
 }
 
-export default Statistics
+export default Statistics;

package/src/components/word-cloud/index.js

@@ -1,12 +1,12 @@
-import React, { useRef, useEffect, useState } from 'react';
-import WordCloud from 'wordcloud';
-import classNames from 'classnames';
-import { getWords } from './request-apis';
+import React, { useRef, useEffect, useState } from "react";
+import WordCloud from "wordcloud";
+import classNames from "classnames";
+import { getWords } from "./request-apis";
 
-import './index.scss';
+import "./index.scss";
 
-export default props => {
-  const { async = true, 'list': dataList } = props;
+export default function (props) {
+  const { async = true, list: dataList } = props;
 
   const canvas = useRef();
   const [isShow, setIsShow] = useState(false);
@@ -16,41 +16,41 @@ export default props => {
     if (!list.length) return;
     setIsShow(true);
     WordCloud(canvas.current, eval({
-      "list": list,
-      "gridSize": 6,                // 密集程度 数字越小越密集
-      "weightFactor": 1,            // 字体大小=原始大小*weightFactor
-      "maxFontSize": 60,            // 最大字号
-      "minFontSize": 14,            // 最小字号
-      "fontWeight": 'normal',       // 字体粗细
-      "fontFamily": 'PingFang SC',  // 字体
-      "color": 'random-light',      // 字体颜色 'random-dark' 或者 'random-light'
-      "backgroundColor": 'white',   // 背景颜色
-      "rotateRatio": 0,             // 字体倾斜(旋转)概率，1代表总是倾斜(旋转)
-      'drawOutOfBound': false,
+      list,
+      gridSize: 6, // 密集程度 数字越小越密集
+      weightFactor: 1, // 字体大小=原始大小*weightFactor
+      maxFontSize: 60, // 最大字号
+      minFontSize: 14, // 最小字号
+      fontWeight: "normal", // 字体粗细
+      fontFamily: "PingFang SC", // 字体
+      color: "random-light", // 字体颜色 'random-dark' 或者 'random-light'
+      backgroundColor: "white", // 背景颜色
+      rotateRatio: 0, // 字体倾斜(旋转)概率，1代表总是倾斜(旋转)
+      drawOutOfBound: false,
     }));
   }, [list]);
 
   useEffect(() => {
     if (async) {
-      getWords().then(words => {
+      getWords().then((words) => {
         if (words.Data && words.Data.length) {
-          const list = words.Data.map(it => [it.text, it.value / 1000000]);
+          const list = words.Data.map((it) => [it.text, it.value / 1000000]);
           setList(list);
         }
-      })
+      });
     } else {
       setList(dataList);
     }
   }, []);
 
-  return <React.Fragment>
+  return (
     <div
       id="titaui-d3-cloud"
-      style={{ 'display': isShow ? 'unset' : 'none' }}
-      className={classNames('titaui-wordcloud')}
+      style={{ display: isShow ? "unset" : "none" }}
+      className={classNames("titaui-wordcloud")}
     >
-      <div className={classNames('titaui-wordcloud__title')}>{getLocale('HP_Hotcompanies')}</div>
-      <canvas ref={canvas} id="worldcloud-titaui-home-canvas" width="235" height="223"></canvas>
+      <div className={classNames("titaui-wordcloud__title")}>{getLocale("HP_Hotcompanies")}</div>
+      <canvas ref={canvas} id="worldcloud-titaui-home-canvas" width="235" height="223" />
     </div>
-  </React.Fragment>
+  );
 }

package/src/components/word-cloud/request-apis.js

@@ -1,16 +1,12 @@
-import axios from 'axios';
+import axios from "axios";
 
 const tenantId = BSGlobal && BSGlobal.tenantInfo.Id || 0;
 const userId = BSGlobal && BSGlobal.loginUserInfo.Id || 0;
 
 const requestDomain = () => {
-  if (!window.location.hostname.match(/dev/)) return '';
-  return 'http://www.tita.gift'
+  if (!window.location.hostname.match(/dev/)) return "";
+  return "http://www.tita.gift";
 };
 
-export const getWords = () => {
-  return axios.get(`${requestDomain()}/api/v1/${tenantId}/${userId}/wordCloud/get?num=250`)
-    .then(words => {
-      return words.data;
-    })
-}
+export const getWords = () => axios.get(`${requestDomain()}/api/v1/${tenantId}/${userId}/wordCloud/get?num=250`)
+  .then((words) => words.data);

package/src/components-v1/animate/AnimateChild.js

@@ -1,28 +1,31 @@
 /*
- * @Author: lianghaosen 
- * @Date: 2018-12-04 17:26:45 
+ * @Author: lianghaosen
+ * @Date: 2018-12-04 17:26:45
  * @Last Modified by: lianghaosen
  * @Last Modified time: 2018-12-04 18:00:19
  */
-import React, { Component } from 'react'
+import React, { Component } from "react";
 
-import {findDOMNode} from 'react-dom'
-import doAnimate from '../utils/animate/animate'
+import { findDOMNode } from "react-dom";
+import doAnimate from "../utils/animate/animate";
 
 export default class AnimateChild extends Component {
-  componentWillEnter = done => {
-    this.transition('enter',done)
-  }
-  componentWillLeave = done => {
-    this.transition('leave',done)
-  }
-  transition = (animationType,done) => {
-    let name = typeof this.props.transitionName == 'object' ? this.props.transitionName[animationType] : `${this.props.transitionName}-${animationType}`
-    doAnimate(findDOMNode(this),name,done)
-  }
+  componentWillEnter = (done) => {
+    this.transition("enter", done);
+  };
+
+  componentWillLeave = (done) => {
+    this.transition("leave", done);
+  };
+
+  transition = (animationType, done) => {
+    const name = typeof this.props.transitionName === "object" ? this.props.transitionName[animationType] : `${this.props.transitionName}-${animationType}`;
+    doAnimate(findDOMNode(this), name, done);
+  };
+
   render() {
     return (
       this.props.children
-    )
+    );
   }
 }

package/src/components-v1/animate/animate.js

@@ -1,79 +1,86 @@
 /*
- * @Author: lianghaosen 
- * @Date: 2018-12-03 16:35:53 
+ * @Author: lianghaosen
+ * @Date: 2018-12-03 16:35:53
  * @Last Modified by: lianghaosen
  * @Last Modified time: 2018-12-05 11:06:17
  */
-import React, { Component } from 'react'
-import AnimateChild from './AnimateChild'
+import React, { Component } from "react";
+import AnimateChild from "./AnimateChild";
+
 export default class animate extends Component {
-  constructor(props){
+  constructor(props) {
     super(props);
     this.childRef = React.createRef();
     this.state = {
-      children: props.children
-    }
-    
+      children: props.children,
+    };
   }
-  componentWillReceiveProps(nextProp){
+
+  componentWillReceiveProps(nextProp) {
     const prevProps = this.props;
-    const isWillShow = !! nextProp.children;
-    const isAlreadyShow = !! prevProps.children;
-    if(isWillShow){
+    const isWillShow = !!nextProp.children;
+    const isAlreadyShow = !!prevProps.children;
+    if (isWillShow) {
       this.setState({
-        children: nextProp.children
-      })
+        children: nextProp.children,
+      });
     }
-    if(isWillShow === isAlreadyShow) {
+    if (isWillShow === isAlreadyShow) {
       return;
     }
-    this.animationType = isWillShow ? 'Enter' : 'Leave'
+    this.animationType = isWillShow ? "Enter" : "Leave";
   }
-  componentDidUpdate(){
-    if(this.animationType){
+
+  componentDidUpdate() {
+    if (this.animationType) {
       this.refs.child[`componentWill${this.animationType}`]({
         start: this[`will${this.animationType}`],
-        end:this[`${this.animationType.toLowerCase()}IsDone`]
-      })
+        end: this[`${this.animationType.toLowerCase()}IsDone`],
+      });
       this.animationType = null;
     }
   }
+
   willEnter = () => {
-    const {onEnter} = this.props;
-    if(typeof onEnter !== 'object') {
+    const { onEnter } = this.props;
+    if (typeof onEnter !== "object") {
       return;
     }
     onEnter.start && onEnter.start();
-  }
+  };
+
   willLeave = () => {
-    const {onLeave} = this.props;
-    if(typeof onLeave !== 'object') {
+    const { onLeave } = this.props;
+    if (typeof onLeave !== "object") {
       return;
     }
     onLeave.start && onLeave.start();
-  }
+  };
+
   enterIsDone = () => {
-    const {onEnter} = this.props;
+    const { onEnter } = this.props;
     let end = onEnter;
-    if(typeof onEnter == 'object') {
+    if (typeof onEnter === "object") {
       end = onEnter.end;
     }
     end && end();
-  }
+  };
+
   leaveIsDone = () => {
-    const {onLeave} = this.props;
+    const { onLeave } = this.props;
     let end = onLeave;
-    if(typeof onLeave == 'object') {
+    if (typeof onLeave === "object") {
       end = onLeave.end;
     }
     this.setState({
-      children: this.props.children
-    })
+      children: this.props.children,
+    });
     end && end();
-  }
+  };
+
   render() {
     return (
       <AnimateChild transitionName={this.props.transitionName} ref="child">{this.state.children}</AnimateChild>
-    )
+    );
   }
 }

package/src/components-v1/animate/index.js

@@ -1,2 +1,3 @@
-import Animate from './animate'
-export default Animate;
+import Animate from "./animate";
+
+export default Animate;

package/src/components-v1/avatar/index.tsx

@@ -1,7 +1,8 @@
-import React, { PureComponent } from 'react';
-import { Wrapper, TextAvatar } from './styles';
-import { getBSGlobal, getUserInfo } from '../../utils/bs-global';
-import { isPlatform, OpenUserName } from '../../utils/open-data';
+import React, { PureComponent } from "react";
+import { Wrapper, TextAvatar } from "./styles";
+import { getBSGlobal, getUserInfo } from "../../utils/bs-global";
+import { isPlatform, OpenUserName } from "../../utils/open-data";
+
 interface Props {
   src?: string;
   name: string;
@@ -18,8 +19,9 @@ interface Size {
 interface State {}
 export default class Avatar extends PureComponent<Props, State> {
   static defaultProps = {
-    size: 'small',
+    size: "small",
   };
+
   static size = (type: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11): Size => {
     switch (type) {
       case 1:
@@ -97,30 +99,35 @@ export default class Avatar extends PureComponent<Props, State> {
         };
     }
   };
+
   renderImgAvatar = () => {
     const { src } = this.props;
-    return <img style={{ width: '100%', height: '100%' }} src={src} />;
+    return <img style={{ width: "100%", height: "100%" }} src={src} />;
   };
+
   renderTextAvatar = () => {
-    const { size, color, name, userId } = this.props;
-    if (isPlatform('wx'))
+    const {
+      size, color, name, userId,
+    } = this.props;
+    if (isPlatform("wx")) {
       return (
         <TextAvatar height={size.width} background={color}>
           <span
             style={{
-              display: 'inline-block',
-              width: size.fontSize + 'px',
-              overflow: 'hidden',
-              whiteSpace: 'nowrap',
-              fontSize: size.fontSize + 'px',
-              lineHeight: size.width + 'px',
+              display: "inline-block",
+              width: `${size.fontSize}px`,
+              overflow: "hidden",
+              whiteSpace: "nowrap",
+              fontSize: `${size.fontSize}px`,
+              lineHeight: `${size.width}px`,
             }}
           >
             <OpenUserName name={name} id={userId} />
           </span>
         </TextAvatar>
       );
-    let cuttedName = '';
+    }
+    let cuttedName = "";
     let cuttedNameLen = 0;
     for (let i = 0, lent = name.length; i < lent; i++) {
       let len = 1;
@@ -136,18 +143,22 @@ export default class Avatar extends PureComponent<Props, State> {
       </TextAvatar>
     );
   };
+
   render() {
-    const { size, src, userId, linkToProfile } = this.props;
+    const {
+      size, src, userId, linkToProfile,
+    } = this.props;
     const hasAvatar = src && !src.match(/default\w*.jpg$/);
     const avatarContent = hasAvatar ? this.renderImgAvatar() : this.renderTextAvatar();
     if (linkToProfile) {
-      const iframeBoxUrl = `${getBSGlobal('apiPath')}/u/${getUserInfo().Id}/Home#`;
+      const iframeBoxUrl = `${getBSGlobal("apiPath")}/u/${getUserInfo().Id}/Home#`;
       return (
         <a
-          target='_blank'
+          target="_blank"
           href={`${iframeBoxUrl}${encodeURIComponent(
-            'widget/italent?iTalentFrameType=iframe&iTalentNavId=&iTalentFrame=' + encodeURIComponent(getBSGlobal('titaHost') + '/' + getUserInfo().Id + '/UpaasPortalPlus#/medalwall?targetTabIndex=0&toUserId=' + userId),
+            `widget/italent?iTalentFrameType=iframe&iTalentNavId=&iTalentFrame=${encodeURIComponent(`${getBSGlobal("titaHost")}/${getUserInfo().Id}/UpaasPortalPlus#/medalwall?targetTabIndex=0&toUserId=${userId}`)}`,
           )}`}
+          rel="noreferrer"
         >
           <Wrapper size={size.width}>{avatarContent}</Wrapper>
         </a>

package/src/components-v1/avatar/styles.ts

@@ -1,4 +1,5 @@
-import styled from 'styled-components';
+import styled from "styled-components";
+
 export const Wrapper = styled.div<any>`
   display: inline-block;
   width: ${(p: any) => p.size}px;

package/src/components-v1/buttonv2/ButtonLinked.tsx

@@ -1,7 +1,8 @@
-import React, { ReactNode } from 'react';
-import styled from 'styled-components';
-import classNames from 'classnames';
-import './style/theme.scss';
+import React, { ReactNode } from "react";
+import styled from "styled-components";
+import classNames from "classnames";
+import "./style/theme.scss";
+
 const LinkedButtonWrapper = styled.a`
   font-size: 14px;
   user-select: select none;
@@ -15,10 +16,12 @@ interface P {
   className?: string;
   style?: React.CSSProperties;
 }
-export function ButtonLinked({ children, onClick, className, style }: P) {
+export function ButtonLinked({
+  children, onClick, className, style,
+}: P) {
   // 类似于链接，只不过有一个hover效果
   return (
-    <LinkedButtonWrapper className={classNames(className, 'tita-linked-button')} style={style} onClick={onClick}>
+    <LinkedButtonWrapper className={classNames(className, "tita-linked-button")} style={style} onClick={onClick}>
       {children}
     </LinkedButtonWrapper>
   );