@beisen-cmps/cooperation/lib/cooperation.js

import "core-js/modules/es7.array.includes";
import "core-js/modules/es6.string.includes";
import "core-js/modules/es6.function.name";
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
import "core-js/modules/es6.object.assign";
import React, { useState, useEffect, useMemo, useCallback, useRef } from 'react'; // import '@beisen-phoenix/style-token/css/reset.css';

import { SunLoading } from '@beisen-phoenix/loading';
import GroupTab from './components/groupTab';
import TimeLines from './components/timeLine/index';
import Head from './components/head/index';
import { getCommentById, getFeedOperationById } from './helper/require';
import CooReply from './reply';
import './index.css';
import { I18NCooperationDefault } from "./helper/i18nDefault";
var Name;

(function (Name) {
  // all = 'cooperation_All',
  Name["communicate"] = "cooperation_Communicate";
  Name["operationalRecords"] = "cooperation_OperationalRecords";
})(Name || (Name = {}));

var CooperationContent = function CooperationContent(props) {
  var translation = Object.assign({}, I18NCooperationDefault, props.translation);
  var id = props.id,
      _props$isShowHead = props.isShowHead,
      isShowHead = _props$isShowHead === void 0 ? true : _props$isShowHead,
      _props$isOpenReward = props.isOpenReward,
      isOpenReward = _props$isOpenReward === void 0 ? false : _props$isOpenReward,
      _props$cooperationHea = props.cooperationHeadName,
      cooperationHeadName = _props$cooperationHea === void 0 ? translation.cooperation || '协作' : _props$cooperationHea,
      _props$isShowOperatio = props.isShowOperationRecord,
      isShowOperationRecord = _props$isShowOperatio === void 0 ? true : _props$isShowOperatio,
      extendedComponentsData = props.extendedComponentsData,
      _props$isShowMentionA = props.isShowMentionAllBtn,
      isShowMentionAllBtn = _props$isShowMentionA === void 0 ? true : _props$isShowMentionA,
      _props$userAdvanceMod = props.userAdvanceMode,
      userAdvanceMode = _props$userAdvanceMod === void 0 ? false : _props$userAdvanceMod,
      _props$isShowMentionB = props.isShowMentionBtn,
      isShowMentionBtn = _props$isShowMentionB === void 0 ? true : _props$isShowMentionB,
      _props$isShowEmojyBtn = props.isShowEmojyBtn,
      isShowEmojyBtn = _props$isShowEmojyBtn === void 0 ? true : _props$isShowEmojyBtn,
      _props$isShowVisible = props.isShowVisible,
      isShowVisible = _props$isShowVisible === void 0 ? false : _props$isShowVisible,
      _props$isShowUploadBt = props.isShowUploadBtn,
      isShowUploadBtn = _props$isShowUploadBt === void 0 ? true : _props$isShowUploadBt,
      _props$isShowModal = props.isShowModal,
      isShowModal = _props$isShowModal === void 0 ? false : _props$isShowModal,
      operationBtnExternal = props.operationBtnExternal,
      _props$isExtendBefor = props.isExtendBefor,
      isExtendBefor = _props$isExtendBefor === void 0 ? false : _props$isExtendBefor,
      _props$defalutTabName = props.defalutTabName,
      defalutTabName = _props$defalutTabName === void 0 ? Name.communicate : _props$defalutTabName;

  var _useState = useState(defalutTabName),
      _useState2 = _slicedToArray(_useState, 2),
      activeName = _useState2[0],
      setActiveName = _useState2[1];

  var _useState3 = useState(),
      _useState4 = _slicedToArray(_useState3, 2),
      feedOperations = _useState4[0],
      setFeedOperations = _useState4[1];

  var componentObj = useRef({});

  var _useInitData = useInitData(id, setFeedOperations, activeName),
      _useInitData2 = _slicedToArray(_useInitData, 2),
      feedComments = _useInitData2[0],
      loading = _useInitData2[1];

  var handleClickFunc = useCallback(function (val) {
    setActiveName(val.name);
  }, []);
  var defaultTabArr = [// { text: '全部', isActive: true, name: Name.all },
  {
    text: translation.communication,
    isActive: !props.defalutTabName,
    name: Name.communicate
  }];
  var tabArr = useMemo(function () {
    //如果显示操作记录
    if (isShowOperationRecord) {
      defaultTabArr = defaultTabArr.concat([{
        text: translation.operation,
        isActive: false,
        name: Name.operationalRecords
      }]);
    }

    extendedComponentsData && extendedComponentsData.length > 0 && extendedComponentsData.forEach(function (element) {
      if (isExtendBefor) {
        defaultTabArr.unshift({
          text: element.text,
          isActive: props.defalutTabName == element.name,
          name: element.name
        });
      } else {
        defaultTabArr.push({
          text: element.text,
          isActive: props.defalutTabName == element.name,
          name: element.name
        });
      }

      if (!componentObj.current[element.name]) {
        componentObj.current[element.name] = element.components;
      }
    });
    return defaultTabArr;
  }, [isShowOperationRecord]); // 处理点击全部操作

  var handleFeedOperationsClickFunc = useCallback(function () {
    useGetfeedOperations(id, setFeedOperations);
  }, []);
  var CooReplyComponent = useMemo(function () {
    return React.createElement(CooReply, {
      feedComments: feedComments,
      id: id,
      isShowReward: isOpenReward,
      userAdvanceMode: userAdvanceMode,
      isShowMentionAllBtn: isShowMentionAllBtn,
      isShowVisible: isShowVisible,
      isShowMentionBtn: isShowMentionBtn,
      isShowEmojyBtn: isShowEmojyBtn,
      isShowModal: isShowModal,
      isShowUploadBtn: isShowUploadBtn,
      operationBtnExternal: operationBtnExternal,
      translation: translation
    });
  }, [feedComments, id, isOpenReward]);
  var TimeLineComponent = useMemo(function () {
    return React.createElement(TimeLines, Object.assign({}, feedOperations, {
      clickFunc: handleFeedOperationsClickFunc,
      translation: translation
    }));
  }, [feedOperations]);
  var GroupTabProps = {
    data: tabArr,
    onChange: handleClickFunc
  };
  var isShowTab = useMemo(function () {
    return isShowOperationRecord || Array.isArray(extendedComponentsData) && extendedComponentsData.length > 0;
  }, [isShowOperationRecord, extendedComponentsData]);
  useMemo(function () {
    // componentObj.current[Name.all] = (
    // 	<React.Fragment>
    // 		{isShowOperationRecord && TimeLineComponent}
    // 		{CooReplyComponent}
    // 	</React.Fragment>
    // );
    componentObj.current[Name.communicate] = CooReplyComponent; //是否显示操作记录

    if (isShowOperationRecord) {
      componentObj.current[Name.operationalRecords] = TimeLineComponent;
    }
  }, [TimeLineComponent, CooReplyComponent]); // useEffect(() => {
  // 	extendedComponentsData &&
  // 		extendedComponentsData.length > 0 &&
  // 		extendedComponentsData.forEach(element => {
  // 			defaultTabArr.push({
  // 				text: element.text,
  // 				isActive: false,
  // 				name: element.name
  // 			});
  // 			if (!componentObj.current[element.name]) {
  // 				componentObj.current[element.name] = element.components;
  // 			}
  // 		});
  // }, []);

  return React.createElement("div", {
    className: "cooperation-container"
  }, isShowHead && React.createElement(Head, {
    cooperationHeadName: cooperationHeadName
  }), isShowTab && React.createElement(GroupTab, Object.assign({}, GroupTabProps)), loading ? React.createElement(SunLoading, null) : React.createElement("div", null, componentObj.current[activeName]));
}; //自定义初始化数据hooks


var useInitData = function useInitData(id, setFeedOperations, activeName) {
  var _useState5 = useState(),
      _useState6 = _slicedToArray(_useState5, 2),
      feedComments = _useState6[0],
      setFeedComments = _useState6[1];

  var _useState7 = useState(false),
      _useState8 = _slicedToArray(_useState7, 2),
      loading = _useState8[0],
      setLoading = _useState8[1];

  useEffect(function () {
    var tabName = [Name.communicate, Name.operationalRecords];

    if (tabName.includes(activeName)) {
      setLoading(true); //用于初始化数据

      getCommentById({
        feed_id: id
      }).then(function (data) {
        var Code = data && data.Code || {},
            Data = data && data.Data || {};
        var newfeedComments = Data && Data.feedComments;
        var feedOperations = Data && Data.feedOperations;

        if (Code === 1) {
          setFeedComments(newfeedComments);
          setFeedOperations(feedOperations);
          setLoading(false);
        }
      });
    }
  }, [activeName]);
  return [feedComments, loading];
}; //自定义获取feedOperations hooks


var useGetfeedOperations = function useGetfeedOperations(id, setFeedOperations) {
  //用于初始化数据
  getFeedOperationById({
    feed_id: id
  }).then(function (data) {
    var Code = data.Code,
        Data = data.Data;

    if (Code === 1) {
      setFeedOperations(Data);
    }
  });
};

export default CooperationContent;